Merge pull request #254 from US-CBP/feature/upgrade-storybook-8.5

Feature/upgrade storybook 8.5

README.md

@@ -9,7 +9,7 @@
 
 The CBP Design System (1.0) exists to provide a unifying user experience and reduce redundant front-end code within the US Customs and Border Protection enterprise suite of applications and websites. This is the next evolution of our first effort, the [CBP Theme (1.X)](https://us-cbp.github.io/cbp-style-guide).
 
-> **⚠️ The CBP Design System (1.0) is still in a stage of very active development.** As such, much of the code base is still somewhat fragile and may break at any time. While we encourage you to explore our offerings, please do so with the knowledge that the codebase in these repositories will change rapidly and with little warning. Use at your own risk. We will communicate when a stable release will be made available.
+> **⚠️ The CBP Design System (1.0) is still in active development.** As such, breaking changes may be introduced but will be documented as such. While we encourage you to explore our offerings, please do so with the knowledge that the codebase in these repositories may change. Use at your own risk. We will communicate when a stable release will be made available.
 
 ## Contents
 
@@ -19,9 +19,9 @@ This project is set up as a monorepo, containing multiple packages. Current effo
 
 | Package Name                    | Description                                         |
 |---------------------------------|-----------------------------------------------------|
-| @cbpds/vanilla (_WIP_)          | HTML patterns, css/scss styles and vanilla js       |
+| @cbpds/vanilla (_deprecated_)   | HTML patterns, css/scss styles and vanilla js       |
 | @cbpds/web-components (_WIP_)   | Web components library                              |
-| @cbpds/react-components (_WIP_) | React components library                            |
+| @cbpds/react-components (_WIP_) | React components library (for React 18 and lower)   |
 | ux-guidelines  (_WIP_)          | Guidance for patterns, components and design tokens |
 
 ## Contributing

package.json

@@ -7,9 +7,6 @@
     "style-lint": "npx stylelint '**/*.scss'",
     "stylelint-check": "stylelint-config-prettier-check",
     "build-tokens": "npm run sd -w packages/design-tokens",
-    "vanilla-dev": "npm run dev -w packages/vanilla",
-    "vanilla-build": "npm run build -w packages/vanilla",
-    "vanilla-sb": "npm run storybook -w packages/vanilla",
     "ux-dev": "npm run dev -w packages/ux-guidelines",
     "ux-build": "npm run build -w packages/ux-guidelines",
     "react-build": "npm run build -w packages/react-components",
@@ -19,10 +16,10 @@
     "stencil-build-sb": "npm run build-pages -w packages/web-components",
     "stencil-generate": "npm run generate -w packages/web-components",
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build-pages": "npm run vanilla-build && npm run build-pages -w packages/vanilla && npm run stencil-build && npm run build-pages -w packages/web-components",
+    "build-pages": "npm run stencil-build && npm run build-pages -w packages/web-components",
+    "build-pages-old": "npm run build-pages -w packages/ux-guidelines && npm run stencil-build && npm run build-pages -w packages/web-components",
     "build-wc-package": "npm run stencil-build && npm run build-pages -w packages/web-components",
-    "build-pages-old": "npm run vanilla-build && npm run build-pages -w packages/vanilla && npm run build-pages -w packages/ux-guidelines",
-    "build-all": "npm run vanilla-build && npm run stencil-build && npm run react-build"
+    "build-all": "npm run stencil-build && npm run react-build"
   },
   "repository": {
     "type": "git",
@@ -56,7 +53,7 @@
     "eslint-plugin-react-refresh": "^0.4.5",
     "lerna": "^8.1.8",
     "postcss-scss": "^4.0.9",
-    "prettier": "^2.8.8",
+    "prettier": "^3.0.0",
     "stylelint": "^14.16.1",
     "stylelint-config-prettier": "^9.0.5",
     "stylelint-config-recommended": "^9.0.0",

packages/ux-guidelines/_includes/layout.njk

@@ -4,7 +4,7 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>CBP UX Guidelines | {{ title }}</title>
-  <link rel="stylesheet" href="{{ "/assets/cbpds-vanilla.css" | url }}"> 
+  <!---<link rel="stylesheet" href="{{ "/assets/cbpds-vanilla.css" | url }}">--->
 </head>
 <body>
   {{ content | safe }}

packages/ux-guidelines/content/index.html

@@ -3,7 +3,7 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <link rel="stylesheet" href="/assets/cbpds-vanilla.css">
+  <!---<link rel="stylesheet" href="/assets/cbpds-vanilla.css">--->
   <title>CBP UX Guidelines</title>
 </head>
 <body>

packages/ux-guidelines/eleventy.config.js

@@ -1,7 +1,9 @@
 module.exports = function(eleventyConfig) {
+  /*
   eleventyConfig.addPassthroughCopy({
     "../../node_modules/@cbpds/vanilla/dist/style.css": "assets/cbpds-vanilla.css"
   })
+  */
 
   // Return your Object options:
   return {