Merge branch 'main' into line_wrap

Author: akoreman

package-lock.json

@@ -53,7 +53,6 @@
     "./highlight/ruby": "./code-view/highlight/ruby.js",
     "./highlight/rust": "./code-view/highlight/rust.js",
     "./highlight/sh": "./code-view/highlight/sh.js",
-    "./highlight/swift": "./code-view/highlight/swift.js",
     "./highlight/typescript": "./code-view/highlight/typescript.js",
     "./highlight/xml": "./code-view/highlight/xml.js",
     "./highlight/yaml": "./code-view/highlight/yaml.js",
@@ -79,7 +78,7 @@
     "@cloudscape-design/global-styles": "^1.0.1",
     "@cloudscape-design/test-utils-converter": "^1.0.0",
     "@cloudscape-design/theming-build": "^1",
-    "@size-limit/preset-small-lib": "^11.0.2",
+    "@size-limit/preset-small-lib": "^11.1.2",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
     "@types/jest-image-snapshot": "^6.1.0",
@@ -90,7 +89,7 @@
     "@typescript-eslint/eslint-plugin": "^5.48.0",
     "@typescript-eslint/parser": "^5.48.0",
     "@vitejs/plugin-react": "^4.2.1",
-    "@vitest/coverage-istanbul": "^1.1.1",
+    "@vitest/coverage-v8": "^1.4.0",
     "chokidar-cli": "^3.0.0",
     "eslint": "^8.31.0",
     "eslint-config-prettier": "^8.6.0",
@@ -114,7 +113,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.6.1",
-    "size-limit": "^11.0.2",
+    "size-limit": "^11.1.2",
     "stylelint": "^15.11.0",
     "stylelint-config-recommended-scss": "^12.0.0",
     "stylelint-order": "^6.0.3",
@@ -123,7 +122,7 @@
     "stylelint-use-logical": "^2.1.0",
     "typescript": "4.9.4",
     "vite": "^5.0.12",
-    "vitest": "^1.1.1"
+    "vitest": "^1.4.0"
   },
   "//": "ensure that typedoc uses typescript 4.9.4. It prints a warning, but works",
   "overrides": {
@@ -143,11 +142,11 @@
   "size-limit": [
     {
       "path": "lib/components/index.js",
-      "limit": "508b"
+      "limit": "6.2kb"
     },
     {
       "path": "lib/components/code-view/highlight/javascript.js",
-      "limit": "1kb"
+      "limit": "10kb"
     }
   ]
 }

package.json

@@ -1,14 +1,5 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import { ThemeBuilder, buildThemedComponentsInternal } from "@cloudscape-design/theming-build";
+import { buildStyles } from "@cloudscape-design/theming-build/internal";
 
-// Generates scoped styles for the component
-// The output includes files like 'styles.css.js', 'styles.scoped.css', and 'styles.selectors.js'
-await buildThemedComponentsInternal({
-  primary: new ThemeBuilder("unused", ":root", []).build(), // "unused" as placeholder and ":root" for global style
-  componentsOutputDir: "lib/components", // sets the output directory for the processed styles
-  skip: ["design-tokens", "preset"], // skips generation of design tokens and presets
-  scssDir: "src", // sets the source directory for SCSS files
-  variablesMap: {}, // not needed - can be used for custom token-variable mappings
-  exposed: [], // not needed - can be used for exposing specific design tokens
-});
+await buildStyles("src", "lib/components");

scripts/compile-styles.js

@@ -1,6 +1,6 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`definition for code-view matches the snapshot > code-view 1`] = `
+exports[`definition for code-view matches the snapshot 1`] = `
 {
   "events": [],
   "functions": [],

src/__tests__/__snapshots__/documenter.test.ts.snap

@@ -3,11 +3,11 @@
 import { render } from "@testing-library/react";
 import { ReactElement } from "react";
 import { describe, expect, test } from "vitest";
+import * as components from "../../lib/components";
 import { defaultProps } from "./default-props";
-import { requireComponent } from "./utils";
 
-describe(`base props support for code-view`, async () => {
-  const Component = await requireComponent("code-view");
+describe(`base props support for code-view`, () => {
+  const Component = components.CodeView;
   const props = defaultProps["code-view" as keyof typeof defaultProps];
 
   function renderComponent(ui: ReactElement) {
@@ -20,11 +20,13 @@ describe(`base props support for code-view`, async () => {
   });
 
   test("should not allow id", () => {
+    // @ts-expect-error id is not supported
     const { container } = renderComponent(<Component {...props} id="example" />);
     expect(container.querySelector("#example")).toBeNull();
   });
 
   test("should not allow className", () => {
+    // @ts-expect-error className is not supported
     const { container } = renderComponent(<Component {...props} className="example" />);
     expect(container.querySelector(".example")).toBeNull();
   });

src/__tests__/base-props-support.test.tsx

@@ -1,9 +1,10 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import { expect, test } from "vitest";
-import { requireComponentDefinition } from "./utils";
+// @ts-expect-error no types here
+import apiDocs from "../../lib/components/internal/api-docs/components";
 
-test(`definition for code-view matches the snapshot`, () => {
-  const definition = requireComponentDefinition("code-view");
-  expect(definition).toMatchSnapshot("code-view");
+test("definition for code-view matches the snapshot", () => {
+  const definition = apiDocs["code-view"];
+  expect(definition).toMatchSnapshot();
 });

src/__tests__/documenter.test.ts

@@ -0,0 +1,18 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import fs from "node:fs";
+import path from "node:path";
+import url from "node:url";
+import { describe, expect, test } from "vitest";
+
+const dirname = path.dirname(url.fileURLToPath(import.meta.url));
+const rulesDir = path.resolve(dirname, "../highlight");
+const rules = fs.readdirSync(rulesDir).filter((file) => file !== "index.tsx");
+
+describe("highlight rules can be loaded", () => {
+  test.each(rules)("%s", async (rule) => {
+    // eslint-disable-next-line no-unsanitized/method
+    const { default: highlight } = await import(path.join(rulesDir, rule));
+    expect(highlight("")).toBeDefined();
+  });
+});

src/__tests__/utils.ts

@@ -15,7 +15,7 @@ export default defineConfig({
     setupFiles: ["./src/__tests__/setup.ts"],
     coverage: {
       enabled: process.env.CI === "true",
-      provider: "istanbul",
+      provider: "v8",
       include: ["src/**", "lib/components/**"],
       exclude: ["**/__tests__/**", "**/*.d.ts", "**/api-docs/**", "**/test-utils/selectors/**"],
     },