carbon-preprocess-svelte 0.11.2 → 0.11.4

package/README.md

@@ -49,7 +49,7 @@ The preprocessor optimizes imports from the following packages:
 
 > [!NOTE]
 > When this preprocessor was first created, there was no workaround to optimize slow cold start times with Vite in development.
-> As of today, [@sveltejs/vite-plugin-svelte](https://github.com/sveltejs/vite-plugin-svelte) enables [`prebundleSvelteLibraries`](https://github.com/sveltejs/vite-plugin-svelte/blob/ba4ac32cf5c3e9c048d1ac430c1091ca08eaa130/docs/config.md#prebundlesveltelibraries), which pre-bundles Svelte libraries to improve cold start times for Vite-based set-ups.
+> As of today, [@sveltejs/vite-plugin-svelte](https://github.com/sveltejs/vite-plugin-svelte) enables [`prebundleSvelteLibraries`](https://github.com/sveltejs/vite-plugin-svelte/blob/ba4ac32cf5c3e9c048d1ac430c1091ca08eaa130/docs/config.md#prebundlesveltelibraries) by default, which greatly improves development times.
 > However, this preprocessor is still useful for non-Vite bundlers, like Rollup and Webpack.
 
 #### SvelteKit

package/dist/plugins/OptimizeCssPlugin.js

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const utils_1 = require("../utils");
-const print_diff_1 = require("./print-diff");
 const create_optimized_css_1 = require("./create-optimized-css");
+const print_diff_1 = require("./print-diff");
 // Webpack plugin to optimize CSS for Carbon Svelte components.
 class OptimizeCssPlugin {
     constructor(options) {
@@ -35,7 +35,7 @@ class OptimizeCssPlugin {
                 for (const [id] of Object.entries(assets)) {
                     if ((0, utils_1.isCssFile)(id)) {
                         const original_css = assets[id].source();
-                        const optimized_css = (0, create_optimized_css_1.createOptimizedCss)(original_css, ids, this.options);
+                        const optimized_css = (0, create_optimized_css_1.createOptimizedCss)(Object.assign(Object.assign({}, this.options), { source: original_css, ids }));
                         compilation.updateAsset(id, new RawSource(optimized_css));
                         if (this.options.verbose) {
                             (0, print_diff_1.printDiff)({ original_css, optimized_css, id });

package/dist/plugins/create-optimized-css.d.ts

@@ -22,4 +22,9 @@ export type OptimizeCssOptions = {
      */
     preserveAllIBMFonts?: boolean;
 };
-export declare function createOptimizedCss(original_css: Uint8Array | string, ids: string[], options?: OptimizeCssOptions): string;
+type CreateOptimizedCssOptions = OptimizeCssOptions & {
+    source: Uint8Array | string;
+    ids: string[];
+};
+export declare function createOptimizedCss(options: CreateOptimizedCssOptions): string;
+export {};

package/dist/plugins/create-optimized-css.js

@@ -3,13 +3,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createOptimizedCss = void 0;
+exports.createOptimizedCss = createOptimizedCss;
 const node_path_1 = __importDefault(require("node:path"));
 const postcss_1 = __importDefault(require("postcss"));
 const postcss_discard_empty_1 = __importDefault(require("postcss-discard-empty"));
 const component_index_1 = require("../component-index");
 const constants_1 = require("../constants");
-function createOptimizedCss(original_css, ids, options) {
+function createOptimizedCss(options) {
+    const { source, ids } = options;
     const preserveAllIBMFonts = (options === null || options === void 0 ? void 0 : options.preserveAllIBMFonts) === true;
     // List of Carbon classes that must be preserved in the CSS
     // but that are not referenced in Carbon Svelte components.
@@ -62,16 +63,16 @@ function createOptimizedCss(original_css, ids, options) {
                     node.walkDecls((decl) => {
                         switch (decl.prop) {
                             case "font-family":
-                                attributes["font-family"] = decl.value;
-                                break;
                             case "font-style":
-                                attributes["font-style"] = decl.value;
-                                break;
                             case "font-weight":
-                                attributes["font-weight"] = decl.value;
+                                attributes[decl.prop] = decl.value;
                                 break;
                         }
                     });
+                    // Do not proceed if font is not IBM Plex.
+                    if (!attributes["font-family"].startsWith("IBM Plex")) {
+                        return;
+                    }
                     const is_mono = attributes["font-style"] === "normal" &&
                         attributes["font-family"] === "IBM Plex Mono" &&
                         attributes["font-weight"] === "400";
@@ -85,6 +86,5 @@ function createOptimizedCss(original_css, ids, options) {
             },
         },
         (0, postcss_discard_empty_1.default)(),
-    ]).process(original_css).css;
+    ]).process(source).css;
 }
-exports.createOptimizedCss = createOptimizedCss;

package/dist/plugins/optimize-css.js

@@ -11,8 +11,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.optimizeCss = void 0;
 const utils_1 = require("../utils");
-const print_diff_1 = require("./print-diff");
 const create_optimized_css_1 = require("./create-optimized-css");
+const print_diff_1 = require("./print-diff");
 // Vite plugin (Rollup-compatible) to optimize CSS for Carbon Svelte components.
 const optimizeCss = (options) => {
     const verbose = (options === null || options === void 0 ? void 0 : options.verbose) !== false;
@@ -35,7 +35,7 @@ const optimizeCss = (options) => {
                     const file = bundle[id];
                     if (file.type === "asset" && (0, utils_1.isCssFile)(id)) {
                         const original_css = file.source;
-                        const optimized_css = (0, create_optimized_css_1.createOptimizedCss)(original_css, ids, options);
+                        const optimized_css = (0, create_optimized_css_1.createOptimizedCss)(Object.assign(Object.assign({}, options), { source: original_css, ids }));
                         file.source = optimized_css;
                         if (verbose) {
                             (0, print_diff_1.printDiff)({ original_css, optimized_css, id });

package/dist/plugins/print-diff.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="node" />
 export declare function printDiff(props: {
     original_css: Uint8Array | Buffer | string;
     optimized_css: string;

package/dist/plugins/print-diff.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.printDiff = void 0;
+exports.printDiff = printDiff;
 const constants_1 = require("../constants");
 const formatter = new Intl.NumberFormat("en-US", { maximumFractionDigits: 2 });
 function toHumanReadableSize(size_in_kb) {
@@ -36,4 +36,3 @@ function printDiff(props) {
     console.log("Before:", original_display);
     console.log("After: ", optimized_display, `(-${diff})\n`);
 }
-exports.printDiff = printDiff;

package/dist/preprocessors/optimize-imports.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="svelte" />
 import type { SveltePreprocessor } from "svelte/types/compiler/preprocess";
 export declare const optimizeImports: SveltePreprocessor<"script">;

package/dist/preprocessors/optimize-imports.js

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.optimizeImports = void 0;
+const estree_walker_1 = require("estree-walker");
 const magic_string_1 = __importDefault(require("magic-string"));
 const compiler_1 = require("svelte/compiler");
 const component_index_1 = require("../component-index");
@@ -29,7 +30,7 @@ const optimizeImports = () => {
             // Wrap the content in a `<script>` tag to parse it with the Svelte parser.
             const content = `<script>${raw}</script>`;
             const s = new magic_string_1.default(content);
-            (0, compiler_1.walk)((0, compiler_1.parse)(content), {
+            (0, estree_walker_1.walk)((0, compiler_1.parse)(content), {
                 enter(node) {
                     if (node.type === "ImportDeclaration") {
                         const import_name = node.source.value;

package/dist/utils.js

@@ -1,16 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isCarbonSvelteImport = exports.isCssFile = exports.isSvelteFile = void 0;
+exports.isSvelteFile = isSvelteFile;
+exports.isCssFile = isCssFile;
+exports.isCarbonSvelteImport = isCarbonSvelteImport;
 const constants_1 = require("./constants");
 function isSvelteFile(id) {
     return constants_1.RE_EXT_SVELTE.test(id);
 }
-exports.isSvelteFile = isSvelteFile;
 function isCssFile(id) {
     return constants_1.RE_EXT_CSS.test(id);
 }
-exports.isCssFile = isCssFile;
 function isCarbonSvelteImport(id) {
     return isSvelteFile(id) && id.includes("carbon-components-svelte" /* CarbonSvelte.Components */);
 }
-exports.isCarbonSvelteImport = isCarbonSvelteImport;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-preprocess-svelte",
-  "version": "0.11.2",
+  "version": "0.11.4",
   "license": "Apache-2.0",
   "description": "Svelte preprocessors for the Carbon Design System",
   "author": "Eric Liu (https://github.com/metonym)",
@@ -8,17 +8,19 @@
   "types": "./dist/index.d.ts",
   "scripts": {
     "index:components": "bun scripts/index-components.ts",
-    "prepack": "tsc -p tsconfig.build.json",
-    "format": "bunx --bun prettier --write ."
+    "build": "bun --bun tsc -p tsconfig.build.json",
+    "test:e2e": "bun tests/test-e2e.ts",
+    "format": "bun --bun prettier --write . --cache"
   },
   "dependencies": {
-    "magic-string": "^0.30.8",
-    "postcss": "^8.4.36",
+    "estree-walker": "^2.0.2",
+    "magic-string": "^0.30.10",
+    "postcss": "^8.4.40",
     "postcss-discard-empty": "^6.0.3"
   },
   "devDependencies": {
     "@types/bun": "latest",
-    "@types/jest": "^29.5.12",
+    "@types/jest": "latest",
     "carbon-components-svelte": "0.85.0",
     "prettier": "latest",
     "svelte": "latest",