chore: improve lint, release workflows (#1627)

* Add standard-version to automate releases

* Remove husky

* Add lint script; run lint in GitHub Actions

* Run lint script

* Add Enrico to contributors

.github/workflows/ci.yml

@@ -17,8 +17,9 @@ jobs:
           path: "**/node_modules"
           key: ${{ runner.os }}-modules-${{ hashFiles('**/yarn.lock') }}
 
-      - name: Install dependencies and build the library
+      - name: Install dependencies, build, test, and lint the codebase
         run: |
           yarn
           yarn build:lib
           yarn test:types
+          yarn lint

.prettierignore

@@ -1,8 +1,9 @@
 /lib
 /css
+/types
 .svelte-kit
 .routify
 dist
 client
 build
-*.svx
+*.svx

CHANGELOG.md

@@ -1,11 +1,6 @@
 # Changelog
 
-All notable changes to this project will be documented in this file.
+All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
-
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
-and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
-
-<!-- ## Unreleased -->
 
 ## [0.71.0](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.71.0) - 2022-12-31
 

CONTRIBUTING.md

@@ -2,6 +2,19 @@
 
 Before submitting a pull request (PR), consider [filing an issue](https://github.com/carbon-design-system/carbon-components-svelte/issues) to gain clarity and direction.
 
+- [Prerequisites](#prerequisites)
+- [Project set-up](#project-set-up)
+  - [Install](#install)
+- [Documentation set-up](#documentation-set-up)
+- [Development workflow](#development-workflow)
+  - [Component Format](#component-format)
+  - [Editing a component](#editing-a-component)
+  - [Creating a component](#creating-a-component)
+  - [Run `yarn build:docs`](#run-yarn-builddocs)
+- [Submit a Pull Request](#submit-a-pull-request)
+  - [Sync Your Fork](#sync-your-fork)
+  - [Submit a PR](#submit-a-pr)
+
 ## Prerequisites
 
 - [Node.js](https://nodejs.org/en/download/package-manager/) (version >=12)
@@ -145,3 +158,34 @@ git merge upstream/master
 ### Submit a PR
 
 After you've pushed your changes to remote, submit your PR. Make sure you are comparing `<YOUR_USER_ID>/feature` to `origin/master`.
+
+## Maintainer guide
+
+The following items only apply to project maintainers.
+
+### Release
+
+Locally, while on `master` and the branch is clean, run `yarn release`. This command will:
+
+- Build library and docs
+- Bump package.json version
+- Add notes to Changelog
+
+This command will not create a commit nor tag. Afterwards, perform the following manually:
+
+```sh
+# 1. Stage prepared files for a commit
+git add .
+
+# 2. Commit based on the current version, either manually or with jq
+git commit -m "v$(jq -r '.version' package.json)"
+
+# 3. Create a tag based on the current version, either manually or with `jq`:
+git tag "v$(jq -r '.version' package.json)"
+
+# 4. Push files, then publish
+git push
+npm publish
+
+# 5. Generate release notes on GitHub, and comment on issues and pull requests
+```

package.json

@@ -12,12 +12,13 @@
   ],
   "scripts": {
     "test:types": "svelte-check --workspace tests",
+    "lint": "prettier --write \"**/*.{svelte,md,js,json,ts}\"",
     "build:css": "node scripts/build-css",
     "build:docs": "node scripts/build-docs",
     "build:lib": "rollup -c",
-    "prepack": "yarn build:docs & yarn build:lib",
     "format": "prettier --write \"./**/*.{svelte,js,md}\"",
-    "prepare": "husky install"
+    "prepack": "yarn build:docs & yarn build:lib",
+    "release": "standard-version && yarn prepack"
   },
   "dependencies": {
     "flatpickr": "4.6.9"
@@ -29,8 +30,6 @@
     "autoprefixer": "^10.4.8",
     "carbon-components": "10.56.0",
     "carbon-icons-svelte": "^11.2.0",
-    "husky": "^8.0.1",
-    "lint-staged": "^13.0.3",
     "postcss": "^8.4.16",
     "prettier": "^2.7.1",
     "prettier-plugin-svelte": "^2.7.0",
@@ -38,16 +37,16 @@
     "rollup-plugin-svelte": "^7.1.0",
     "rollup-plugin-terser": "^7.0.2",
     "sass": "^1.49.11",
+    "standard-version": "^9.5.0",
     "sveld": "^0.18.0",
     "svelte": "^3.51.0",
     "svelte-check": "^2.8.1",
     "typescript": "^4.7.4"
   },
-  "lint-staged": {
+  "standard-version": {
-    "*.{svelte,md,js,json}": [
+    "skip": {
-      "prettier --write"
+      "commit": true
-    ],
+    }
-    "*.{svelte,js,md}": "prettier --write"
   },
   "prettier": {
     "svelteStrictMode": true
@@ -72,7 +71,8 @@
     "css"
   ],
   "contributors": [
+    "Josef Aidt (https://github.com/josefaidt)",
     "Eric Liu (https://github.com/metonym)",
-    "Josef Aidt (https://github.com/josefaidt)"
+    "Enrico Sacchetti (https://github.com/theetrain)"
   ]
 }

src/Breakpoint/breakpointObserver.d.ts

@@ -1,28 +1,28 @@
-import type { Readable, Subscriber, Unsubscriber } from "svelte/store";
+import type { Readable, Subscriber, Unsubscriber } from "svelte/store";
-import type { BreakpointSize, BreakpointValue } from "./breakpoints";
+import type { BreakpointSize, BreakpointValue } from "./breakpoints";
-
+
-/**
+/**
- * Creates a readable store that returns the current breakpoint size.
+ * Creates a readable store that returns the current breakpoint size.
- * It also provides functions for creating derived stores used to do comparisons.
+ * It also provides functions for creating derived stores used to do comparisons.
- */
+ */
-export function breakpointObserver(): {
+export function breakpointObserver(): {
-  subscribe: (
+  subscribe: (
-    this: void,
+    this: void,
-    run: Subscriber<any>,
+    run: Subscriber<any>,
-    invalidate?: (value?: any) => void
+    invalidate?: (value?: any) => void
-  ) => Unsubscriber;
+  ) => Unsubscriber;
-  /**
+  /**
-   * Returns a store readable store that returns whether the current
+   * Returns a store readable store that returns whether the current
-   * breakpoint is smaller than {@link size}.
+   * breakpoint is smaller than {@link size}.
-   * @param {BreakpointSize} size Size to compare against.
+   * @param {BreakpointSize} size Size to compare against.
-   */
+   */
-  smallerThan: (size: BreakpointSize) => Readable<boolean>;
+  smallerThan: (size: BreakpointSize) => Readable<boolean>;
-  /**
+  /**
-   * Returns a store readable store that returns whether the current
+   * Returns a store readable store that returns whether the current
-   * breakpoint is larger than {@link size}.
+   * breakpoint is larger than {@link size}.
-   * @param {BreakpointSize} size Size to compare against.
+   * @param {BreakpointSize} size Size to compare against.
-   */
+   */
-  largerThan: (size: BreakpointSize) => Readable<boolean>;
+  largerThan: (size: BreakpointSize) => Readable<boolean>;
-};
+};
-
+
-export default breakpointObserver;
+export default breakpointObserver;

src/Breakpoint/breakpoints.d.ts

@@ -1,11 +1,11 @@
-/**
+/**
- * Pixel sizes of Carbon grid breakpoints.
+ * Pixel sizes of Carbon grid breakpoints.
- * @type {Record<BreakpointSize, BreakpointValue>}
+ * @type {Record<BreakpointSize, BreakpointValue>}
- */
+ */
-export const breakpoints: Record<BreakpointSize, BreakpointValue>;
+export const breakpoints: Record<BreakpointSize, BreakpointValue>;
-
+
-export type BreakpointSize = "sm" | "md" | "lg" | "xlg" | "max";
+export type BreakpointSize = "sm" | "md" | "lg" | "xlg" | "max";
-
+
-export type BreakpointValue = 320 | 672 | 1056 | 1312 | 1584;
+export type BreakpointValue = 320 | 672 | 1056 | 1312 | 1584;
-
+
-export default breakpoints;
+export default breakpoints;

src/Breakpoint/index.d.ts

@@ -1,3 +1,3 @@
-export { default as Breakpoint } from "./Breakpoint.svelte";
+export { default as Breakpoint } from "./Breakpoint.svelte";
-export { breakpointObserver } from "./breakpointObserver";
+export { breakpointObserver } from "./breakpointObserver";
-export { breakpoints } from "./breakpoints";
+export { breakpoints } from "./breakpoints";

types/Breakpoint/breakpointObserver.d.ts

@@ -1,28 +1,28 @@
-import type { Readable, Subscriber, Unsubscriber } from "svelte/store";
+import type { Readable, Subscriber, Unsubscriber } from "svelte/store";
-import type { BreakpointSize, BreakpointValue } from "./breakpoints";
+import type { BreakpointSize, BreakpointValue } from "./breakpoints";
-
+
-/**
+/**
- * Creates a readable store that returns the current breakpoint size.
+ * Creates a readable store that returns the current breakpoint size.
- * It also provides functions for creating derived stores used to do comparisons.
+ * It also provides functions for creating derived stores used to do comparisons.
- */
+ */
-export function breakpointObserver(): {
+export function breakpointObserver(): {
-  subscribe: (
+  subscribe: (
-    this: void,
+    this: void,
-    run: Subscriber<any>,
+    run: Subscriber<any>,
-    invalidate?: (value?: any) => void
+    invalidate?: (value?: any) => void
-  ) => Unsubscriber;
+  ) => Unsubscriber;
-  /**
+  /**
-   * Returns a store readable store that returns whether the current
+   * Returns a store readable store that returns whether the current
-   * breakpoint is smaller than {@link size}.
+   * breakpoint is smaller than {@link size}.
-   * @param {BreakpointSize} size Size to compare against.
+   * @param {BreakpointSize} size Size to compare against.
-   */
+   */
-  smallerThan: (size: BreakpointSize) => Readable<boolean>;
+  smallerThan: (size: BreakpointSize) => Readable<boolean>;
-  /**
+  /**
-   * Returns a store readable store that returns whether the current
+   * Returns a store readable store that returns whether the current
-   * breakpoint is larger than {@link size}.
+   * breakpoint is larger than {@link size}.
-   * @param {BreakpointSize} size Size to compare against.
+   * @param {BreakpointSize} size Size to compare against.
-   */
+   */
-  largerThan: (size: BreakpointSize) => Readable<boolean>;
+  largerThan: (size: BreakpointSize) => Readable<boolean>;
-};
+};
-
+
-export default breakpointObserver;
+export default breakpointObserver;

types/Breakpoint/breakpoints.d.ts

@@ -1,11 +1,11 @@
-/**
+/**
- * Pixel sizes of Carbon grid breakpoints.
+ * Pixel sizes of Carbon grid breakpoints.
- * @type {Record<BreakpointSize, BreakpointValue>}
+ * @type {Record<BreakpointSize, BreakpointValue>}
- */
+ */
-export const breakpoints: Record<BreakpointSize, BreakpointValue>;
+export const breakpoints: Record<BreakpointSize, BreakpointValue>;
-
+
-export type BreakpointSize = "sm" | "md" | "lg" | "xlg" | "max";
+export type BreakpointSize = "sm" | "md" | "lg" | "xlg" | "max";
-
+
-export type BreakpointValue = 320 | 672 | 1056 | 1312 | 1584;
+export type BreakpointValue = 320 | 672 | 1056 | 1312 | 1584;
-
+
-export default breakpoints;
+export default breakpoints;

types/Breakpoint/index.d.ts

@@ -1,3 +1,3 @@
-export { default as Breakpoint } from "./Breakpoint.svelte";
+export { default as Breakpoint } from "./Breakpoint.svelte";
-export { breakpointObserver } from "./breakpointObserver";
+export { breakpointObserver } from "./breakpointObserver";
-export { breakpoints } from "./breakpoints";
+export { breakpoints } from "./breakpoints";