CED-1724: new folder structure and publish process for v3

.github/workflows/ci.yml

@@ -40,10 +40,6 @@ jobs:
             - name: Install dependencies 👨🏻‍💻
               run: |
                 make install
-                make update-peer-deps
-                make build-scss-pkg
-                make symlink
-                make build-vue-pkg
                 make symlink
 
             - name: Run linter 👀

.github/workflows/deploy-v3.yml

@@ -18,7 +18,7 @@ jobs:
               with:
                 ref: esds-3.0-vue3-primevue
 
-            - name: Log into ES_DS_DEV AWS account 🔑 
+            - name: Log into ES_DS_DEV AWS account 🔑
               id: creds
               uses: aws-actions/configure-aws-credentials@v4
               with:
@@ -31,13 +31,13 @@ jobs:
               run: |
                   aws codeartifact login --tool npm --domain energysage --domain-owner 659694780082 --repository cloud-engineering
 
-            - name: Link ES-DS Version 3 🔗 
-              working-directory: 
+            - name: Link ES-DS Version 3 🔗
+              working-directory:
               shell: bash
               run: |
-                cd es-bs-base; npm link
-                cd ../es-ds-components; npm link  
-                cd ../es-ds-docs; npm link @energysage/es-bs-base @energysage/es-ds-components
+                cd es-ds-styles; npm link
+                cd ../es-ds-components; npm link
+                cd ../es-ds-docs; npm link @energysage/es-ds-styles @energysage/es-ds-components
 
             - name: Build ES-DS Version 3 🛠️
               working-directory: ./es-ds-docs
@@ -49,4 +49,4 @@ jobs:
               working-directory: ./es-ds-docs
               shell: bash
               run: |
-                aws s3 cp --recursive .output/public/ s3://es-ds-version-2
+                aws s3 cp --recursive .output/public/ s3://es-ds-version-2

Makefile

@@ -1,78 +1,55 @@
-# Run local v3 docs site with hot reloading hooked up to es-bs-base and es-ds-components
+# Run local v3 docs site with hot reloading hooked up to es-ds-styles and es-ds-components
 
 .PHONY: dev
-dev:
-	cd es-bs-base; npm link
-	cd es-ds-components; npm link
-	cd es-ds-docs; npm link @energysage/es-bs-base @energysage/es-ds-components
+dev: symlink
 	cd es-ds-docs; npm run dev
 
-# Run the old v2 docs site with slow rebuilds of es-bs-base and es-vue-base
-
-.PHONY: legacy-dev
-legacy-dev:
-	overmind s
+.PHONY: symlink
+symlink:
+	cd es-ds-styles; npm link
+	cd es-ds-components; npm link
+	cd es-ds-docs; npm link @energysage/es-ds-styles @energysage/es-ds-components
 
-# Unlink local v3 docs site from local es-bs-base and es-ds-components; restore to NPM versions
+# Unlink local v3 docs site from local es-ds-styles and es-ds-components; restore to NPM versions
 
 .PHONY: unlink
 unlink:
-	cd es-bs-base; npm unlink @energysage/es-bs-base
+	cd es-ds-styles; npm unlink @energysage/es-ds-styles
 	cd es-ds-components; npm unlink @energysage/es-ds-components
-	cd es-ds-docs; npm unlink --no-save @energysage/es-bs-base
+	cd es-ds-docs; npm unlink --no-save @energysage/es-ds-styles
 	cd es-ds-docs; npm unlink --no-save @energysage/es-ds-components
 	cd es-ds-docs npm install
 
 .PHONY: lint
 lint:
-	npx lerna run lint
+	npm --prefix es-ds-styles run lint
+# TODO: set up linting for es-ds-components and es-ds-docs
+# 	npm --prefix es-ds-components run lint
+# 	npm --prefix es-ds-docs run lint
 
 .PHONY: test
 test:
-	npx lerna run test
+	npm --prefix es-ds-styles run test
+# TODO: set up testing for es-ds-components and es-ds-docs
+#	npm --prefix es-ds-components run test
+#	npm --prefix es-ds-docs run test
 
 .PHONY: build
 build:
-	npx lerna run build
-
-.PHONY: publish
-publish:
-	npx lerna publish
-
-.PHONY: symlink
-symlink:
-	npx lerna bootstrap
-
-.PHONE: reload
-reload:
-	npm --prefix es-vue-base run build
-	npx lerna bootstrap
+	npm --prefix es-ds-styles run build
+	npm --prefix es-ds-docs run build
+# es-ds-components does not have a build step
 
 # Sometimes Called
 
 .PHONY: install
 install:
-	npm install
-	npm --prefix es-bs-base install
+	npm --prefix es-ds-styles install
 	npm --prefix es-ds-components install
 	npm --prefix es-ds-docs install
 
-.PHONY: legacy-install
-legacy-install:
-	npm install
-	npx lerna exec -- npm install
-
 # Bootstraping Commands (not reguarly called)
 
-.PHONY: build-scss-pkg
-build-scss-pkg:
-	npm run --prefix es-bs-base build
-
-.PHONY: build-vue-pkg
-build-vue-pkg:
-	npm run --prefix es-vue-base build
-
-.PHONY: update-peer-deps
-update-peer-deps:
-	npm --prefix es-vue-base install bootstrap-vue@2 \
-		vue@2
+.PHONY: update-package-deps
+update-package-deps:
+	cd es-ds-docs; npm uninstall @energysage/es-ds-styles && npm install @energysage/es-ds-styles && npm uninstall @energysage/es-ds-components && npm install @energysage/es-ds-components

README.md

@@ -26,14 +26,14 @@ For EnergySage specific resources & channels see the
 
 Starting in version 3.0, the EnergySage Design System is composed of 2 core npm packages:
 
-- [@energysage/es-bs-base](https://www.npmjs.com/package/@energysage/es-bs-base)
+- [@energysage/es-ds-styles](https://www.npmjs.com/package/@energysage/es-ds-styles)
 - [@energysage/es-ds-components](https://www.npmjs.com/package/@energysage/es-ds-components)
 
 ```mermaid
 graph TB
     subgraph es-ds
         subgraph "@energysage"
-            A["@energysage/es-bs-base"]
+            A["@energysage/es-ds-styles"]
             C["@energysage/es-ds-components"]
         end
         D[es-ds-docs]
@@ -44,18 +44,18 @@ graph TB
     Y-->D
 ```
 
-**es-bs-base**
+**es-ds-styles**
 
-- [es-bs-base](./es-bs-base/) started as a fork of **Bootstrap 4**.
+- [es-ds-styles](es-ds-styles/) started as a fork of **Bootstrap 4**.
 - This package overrides the `_variables.scss` file in Bootstrap to the defaults required by the EnergySage design system.
 - There are additional variables and colors that diverge and extend from the core
 Bootstrap framework.
 - The SASS has also been refactored to use
 [the modular system](https://sass-lang.com/blog/the-module-system-is-launched/)
 and dart-sass compiler.
-- Prior to v3.0, `es-bs-base` worked with the `es-vue-base` package, which is based on
+- Prior to v3.0, `es-ds-styles` worked with the `es-vue-base` package, which is based on
 [bootstrap-vue](https://bootstrap-vue.org/). As such, there are still some legacy
-Bootstrap Vue styles present in `es-bs-base`. Those are deprecated and will be removed
+Bootstrap Vue styles present in `es-ds-styles`. Those are deprecated and will be removed
 in a future version.
 
 **es-ds-components**
@@ -71,14 +71,14 @@ how to integrate `es-ds` packages into a Nuxt 3 project.
 
 Prior to version 3.0, the EnergySage Design System was composed of 2 core npm packages:
 
-- [@energysage/es-bs-base](https://www.npmjs.com/package/@energysage/es-bs-base)
+- [@energysage/es-ds-styles](https://www.npmjs.com/package/@energysage/es-ds-styles)
 - [@energysage/es-vue-base](https://www.npmjs.com/package/@energysage/es-vue-base)
 
 ```mermaid
 graph TB
     subgraph es-ds
         subgraph "@energysage"
-            A["@energysage/es-bs-base"]
+            A["@energysage/es-ds-styles"]
             C["@energysage/es-vue-base"]
         end
         D[es-design-system]
@@ -93,7 +93,7 @@ graph TB
 - [es-vue-base](./es-vue-base/) contains vue components for use in nuxt projects.
 It has a dependency of [bootstrap-vue](https://bootstrap-vue.org/) as components
 extends or are composed of bootstrap components.
-- `es-bs-base` is a sibling dependencies and should provide the baseline CSS
+- `es-ds-styles` is a sibling dependencies and should provide the baseline CSS
 styling to vue rendered components.
 
 **es-design-system**
@@ -117,22 +117,8 @@ origin  [email protected]:EnergySage/es-ds.git (push)
 
 ### Installing Dependencies and Linking packages
 
-**v3.0 and later**
-
 1. `make install` - installs all packages from npm
 
-**v2.x and earlier**
-
-1. `make legacy-install` - installs all packages from npm
-2. `make update-peer-deps` - installs necessary peer deps for `es-vue-base` used
-   in `es-design-system`
-3. `make build-scss-pkg` - build `es-bs-base/dist` locally; we do this first
-   since `es-vue-base` imports it `@import '~@energysage/es-bs-base/scss/includes'`
-4. `make symlink` - [symlink or bootstrap](https://lerna.js.org/docs/features/bootstrap) `es-bs-base/dist`
-5. `make build-vue-pkg` - build `es-vue-base/dist` locally
-6. `make symlink` - [symlink or bootstrap](https://lerna.js.org/docs/features/bootstrap)
-   `es-bs-base/dist` and `es-vue-base/dist` for use in `es-design-system`
-
 ### Development workflow
 
 ```
@@ -141,7 +127,7 @@ make dev
 
 This command will:
 
-- Locally link your `es-bs-base` and `es-ds-components` folders to the `es-ds-docs` Nuxt app
+- Locally link your `es-ds-styles` and `es-ds-components` folders to the `es-ds-docs` Nuxt app
 - Start the `es-ds-docs` local dev server
 
 You can then make changes as desired in either upstream package folder and the local dev server should immediately reflect those changes.
@@ -153,7 +139,7 @@ make unlink
 This command will:
 
 - Undo the local linking set up by the above command
-- Reinstall the public NPM versions of the `es-bs-base` and `es-ds-components` packages
+- Reinstall the public NPM versions of the `es-ds-styles` and `es-ds-components` packages
 
 This enables you to run the `es-ds-docs` server with the state of code that is publicly available on NPM.
 
@@ -163,13 +149,13 @@ npm run dev
 ```
 
 These commands will:
-- Run the `es-ds-docs` local dev server without locally linking to the `es-bs-base` and `es-ds-components` packages folders
+- Run the `es-ds-docs` local dev server without locally linking to the `es-ds-styles` and `es-ds-components` packages folders
 - Whichever versions of the two upstream packages are installed (or already locally linked) will be used
 
 #### Development workflow prior to v3.0
 
 To develop with hot reloading for all packages you'll want to run `make legacy-dev` in
-the `es-ds` directory. This will build and package `es-bs-base` and
+the `es-ds` directory. This will build and package `es-ds-styles` and
 `es-vue-base` and symlink them to `es-design-system` for use in the nuxt app. It
 will then start a dev instance for `es-design-system` that will be available at
 `http://localhost:8500`.
@@ -194,7 +180,7 @@ In another terminal run:
 (cd es-design-system && FAST_LOCAL=true npm run dev)
 ```
 
-This will result in much faster reloads that skip rebuilding all of `es-bs-base`
+This will result in much faster reloads that skip rebuilding all of `es-ds-styles`
 as well as skipping server-side rendering. But *note* this will also throw an
 error in webpack-dev server until `es-vue-base` finishes compiling, then it
 should recover.
@@ -261,62 +247,21 @@ in the changelog when publishing a new release.
 
 ### Publishing and Versioning
 
-For simplicity of deployment, versioning of packages are fixed and updated
-together.
-
-#### Publishing a new version of a package
-
 Assuming changes are approved, the process of publishing a new version is...
-
 0. Ensure your local environment is
    [setup](./README.md#installing-dependencies-and-linking-packages) and you are on
    the `main` branch
-1. `npm login` - Logs you into the npm.js registry. You'll need access to our `es-ds` package there in order for things to work.
-2. `make install && make symlink` - Install the new published versions locally
-   and symlink them
-3. `make build` - Build all packages to `*/dist` folders locally
-4. `make lint && make test` - Run tests and linting to ensure they pass
-5. `make publish` - Publish updated packages to
-   [npmjs.com](https://www.npmjs.com/org/energysage)
-6. Update [CHANGELOG.md](./CHANGELOG.md) with our newly published changes
-7. `make install && make symlink` - Install the new published versions locally
-   and symlink them
-8. `git commit -m "docs: :memo: add version X.X.X to the changelog" && git push` -
+1. Make sure the package.json versions in `es-ds-styles` and `es-ds-components` is updated to a new version 
+   that hasn't been published before on NPM.
+2. `npm login` - Logs you into the npm.js registry. You'll need access to our `es-ds` package there in order for things to work.
+3. `make install && make symlink` - Install and symlink dependencies locally
+4. `make build` - Build all packages to `*/dist` folders locally
+5. `make lint && make test` - Run tests and linting to ensure they pass
+6. Publish updated packages to
+   [npmjs.com](https://www.npmjs.com/org/energysage) with npm publish.
+   1. `cd es-ds-styles && npm publish && cd ..`
+   2. `cd es-ds-components && npm publish && cd ..`
+7. Update [CHANGELOG.md](./CHANGELOG.md) with our newly published changes
+8. `make update-package-deps` - Install the new published versions locally
+9. `git commit -m "docs: :memo: add version X.X.X to the changelog" && git push` -
    Commit and push the changelog and `package-lock.json` updates
-9. For updating the design-system website see
-   [Deploy Design System](https://energysage.atlassian.net/wiki/spaces/DSE/pages/208568321/Deploy+Design+System+Documentation)
-
-Running `make publish` will trigger the following prompt:
-
-```shell
-lerna info Looking for changed packages since v0.1.9
-? Select a new version (currently 0.1.9)
-❯ Patch (0.1.10)
-  Minor (0.2.0)
-  Major (1.0.0)
-  Prepatch (0.1.10-alpha.0)
-  Preminor (0.2.0-alpha.0)
-  Premajor (1.0.0-alpha.0)
-  Custom Prerelease
-  Custom Version
-```
-
-You'll note the lerna script will walk you through versioning, then push your
-changes, and tag the release in git.
-
-This project follows [semantic versioning](https://semver.org/). Please make
-sure your change in version reflects the semantics defined via semver. At a high
-level the guidelines are:
-
-1. MAJOR version changes introduce incompatible API changes. API changes could
-   mean:
-    - removal of core-components used in other verticals
-    - changing "props" of core-components causing breaking changes in other verticals
-2. MINOR version changes add functionality in a backwards compatible manner.
-   This could mean:
-    - changing the hex value represented by the variable `$white` in
-      `es-bs-base`
-    - adding an additional "prop" to a core-component, but otherwise not
-      chancing the default behavior
-3. PATCH version changes are backwards compatible bug-fixes and should have no
-   impact on functionality aside from fixing a bug