Ci

.github/workflows/node.js.yml

@@ -2,7 +2,7 @@ name: Node.js CI
 
 on:
   push:
-    branches: [ main, develop, beta ]
+    branches: [ main, develop, beta, ci ]
   pull_request:
     branches: [ main, develop, beta ]
 
@@ -12,7 +12,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [ 18.x, 20.x ]
+        node-version: [ '20.x' ]
 
     steps:
       - uses: actions/checkout@v4
@@ -39,13 +39,23 @@ jobs:
   publish:
     runs-on: ubuntu-latest
     needs: test
-    if: ${{ github.ref == 'refs/heads/main' || github.ref == 'refs/heads/beta' }}
+    if: ${{ github.ref == 'refs/heads/main' }}
 
     steps:
       - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
       - uses: actions/setup-node@v4
         with:
-          node-version: ${{ matrix.node-version }}
+          node-version: '20'
+
+      - name: git config
+        run: |
+          git config user.name "Release It"
+          git config user.email "[email protected]"
+
+      - name: Generate .npmrc
+        run: echo "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}" > .npmrc
 
       - name: Install Dependencies
         run: npm ci --ignore-scripts --no-audit
@@ -55,3 +65,33 @@ jobs:
         env:
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+  publish_beta:
+    runs-on: ubuntu-latest
+    needs: test
+    if: ${{ github.ref == 'refs/heads/ci' }}
+
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+
+      - name: git config
+        run: |
+          git config user.name "Release It"
+          git config user.email "[email protected]"
+
+      - name: Generate .npmrc
+        run: echo "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}" > .npmrc
+
+      - name: Install Dependencies
+        run: npm ci --ignore-scripts --no-audit
+
+      - name: Release
+        run: npm run release:beta
+        env:
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -1,7 +1,8 @@
 ## Files
+*.log
 *.map
 *.orig
-*.log
+.npmrc
 junit.xml
 
 ## Folders

.release-it.json

@@ -0,0 +1,44 @@
+{
+    "git": {
+        "requireBranch": [
+            "main",
+            "ci",
+            "beta"
+        ],
+        "commitMessage": "chore(release): publish version ${version}"
+    },
+    "github": {
+        "release": false,
+        "releaseName": "v${version}"
+    },
+    "npm": {
+        "publish": false
+    },
+    "plugins": {
+        "@release-it/conventional-changelog": {
+            "infile": "CHANGELOG.md",
+            "header": "# Changelog\n\nAll notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.",
+            "preset": {
+                "name": "conventionalcommits",
+                "types": [
+                    {
+                        "type": "feat",
+                        "section": "Features"
+                    },
+                    {
+                        "type": "fix",
+                        "section": "Bug Fixes"
+                    },
+                    {
+                        "type": "build",
+                        "section": "Build System"
+                    },
+                    {
+                        "type": "refactor",
+                        "section": "Code Refactoring"
+                    }
+                ]
+            }
+        }
+    }
+}

CHANGELOG.md

@@ -2,6 +2,37 @@
 
 All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.4.1-beta.1](https://github.com/magnesiumlabs/magnesium/compare/v4.4.1-beta.0...v4.4.1-beta.1) (2024-10-10)
+
+## [4.4.1-beta.0](https://github.com/magnesiumlabs/magnesium/compare/v4.4.0...v4.4.1-beta.0) (2024-10-10)
+
+
+### Build System
+
+* **deps:** bump to `sass` 1.77.8 ([966ff1b](https://github.com/magnesiumlabs/magnesium/commit/966ff1b560f0cd2111546358cec1b304b5b82839))
+* **deps:** remove unneeded dependencies ([47f37c4](https://github.com/magnesiumlabs/magnesium/commit/47f37c4724e9d0628ece889a7518e06e5e613e6b))
+
+
+### Code Refactoring
+
+* **color, shape:** remove `show` restriction ([5539343](https://github.com/magnesiumlabs/magnesium/commit/553934349b1daf1b0b9d1ca79f3c382db8ea94d0))
+* **color, shape:** remove unneeded `$_tokens` variable ([1c99416](https://github.com/magnesiumlabs/magnesium/commit/1c99416d40b779e778dde9c8bf6758278b4d23db))
+* **color:** change `$theme` parameter for `$tokens` ([7f6a3cd](https://github.com/magnesiumlabs/magnesium/commit/7f6a3cd3b6cf8d079d6125cf77e9b0ba925a3ba1))
+* **color:** rename `_mixins` to `_color` ([3651e07](https://github.com/magnesiumlabs/magnesium/commit/3651e07de0a96808869f86f8b7d3ffffc650d874))
+* **core:** rename `$theme` parameter for `$tokens` in `emit-custom-props()` mixin ([d214333](https://github.com/magnesiumlabs/magnesium/commit/d21433322e8598bb87998de101dc5438f96b6e9c))
+* **core:** rename `$theme` parameter for `$tokens` in `emit-theme-vars()` mixin ([a4b09c9](https://github.com/magnesiumlabs/magnesium/commit/a4b09c97ae9041be525ad88d0c4d2279caa60368))
+* **core:** renamed `$reference` to `$refs` in `validation()` function ([db9dbe7](https://github.com/magnesiumlabs/magnesium/commit/db9dbe75f9b5a194c428d3d89a64706ca73d74ff))
+* **core:** renamed `$theme` parameter for `$tokens` in functions ([85f6988](https://github.com/magnesiumlabs/magnesium/commit/85f69880cf3891832b03b63730d1c640eb3b2c30))
+* **core:** simplify `emit-custom-props()` mixin ([6026df6](https://github.com/magnesiumlabs/magnesium/commit/6026df67836c4ddaa167f6998974aeb1428880c6))
+* **create-name:** update comments ([e409756](https://github.com/magnesiumlabs/magnesium/commit/e40975659eeef703276285a5cfd92e8f50fc955e))
+* removed unneeded `!default` ([f3f495d](https://github.com/magnesiumlabs/magnesium/commit/f3f495d2ec43d50485cdc2049f2db8e9b0a7edd4))
+* **shape:** change `$theme` parameter for `$tokens` ([5d39d93](https://github.com/magnesiumlabs/magnesium/commit/5d39d9333f9b59d74a55be6348c97b7d6a9c3529))
+* **shape:** rename `_mixins` to `_shape` ([6bc942a](https://github.com/magnesiumlabs/magnesium/commit/6bc942a93d6698a5fb3ed83b298c9b2357c519a5))
+* **validation:** change internal variable name ([8f84083](https://github.com/magnesiumlabs/magnesium/commit/8f840837275b0250246877e19a4bad0ead2b06e1))
+* **validation:** change internal variable name ([62e158c](https://github.com/magnesiumlabs/magnesium/commit/62e158cfb3ee2f8174e536a2e4409ed6bb7f2e6d))
+
+
+
 ## [4.4.0](https://github.com/magnesiumlabs/magnesium/compare/v4.3.1...v4.4.0) (2024-06-21)
 
 

README.md

@@ -37,7 +37,7 @@ user-provided theme's tokens map.
 
 ## Mixins
 
-### `emit-custom-props($theme, $prefix)`
+### `emit-custom-props($tokens, $prefix)`
 
 Emits CSS custom properties declarations from a user-provided theme's.
 
@@ -63,7 +63,7 @@ $theme: (
 
 ## Functions
 
-### `emit-variable($theme, $token, $fallback, $prefix)`
+### `emit-variable($tokens, $token, $fallback, $prefix)`
 
 Emits CSS variable declaration from a user-provided theme's.
 

__tests__/_config-variables.scss

@@ -0,0 +1,11 @@
+@use "./tokens";
+
+$color: (
+    "prefix": "sys-color",
+    "tokens": tokens.$color
+);
+
+$shape: (
+    "prefix": "sys-shape",
+    "tokens": tokens.$shape
+);

__tests__/_config.scss

@@ -1,14 +1,4 @@
-@use "./tokens";
+@use "./config-variables" as config;
 @use "../src/mixins";
 
-$color: (
-    "prefix": "sys-color",
-    "tokens": tokens.$color
-);
-
-$shape: (
-    "prefix": "sys-shape",
-    "tokens": tokens.$shape
-);
-
-@include mixins.config("md", $color, $shape);
+@include mixins.config("md", config.$color, config.$shape);

__tests__/_tokens.scss

@@ -11,7 +11,7 @@ $shape: (
 );
 
 $button: (
-    "text-color": var(--mg-color-primary, darkcyan),
+    "text-color": darkcyan,
     "text-size": 16px,
     "padding": (
         "top": 12px

__tests__/config.spec.scss

@@ -0,0 +1,52 @@
+// ============================================================================================= //
+//                                             TEST                                              //
+// ============================================================================================= //
+
+@use "pkg:sass-true" as *;
+@use "./config";
+@use "./tokens";
+@use "../src/mixins";
+
+@include describe("core") {
+    @include describe("config") {
+        @include describe("mixins") {
+            @include describe("emit-custom-props()") {
+                @include it("Should return theme custom properties declarations.") {
+                    @include assert {
+                        @include output(false) {
+                            .test {
+                                @include mixins.emit-custom-props(tokens.$button, "button");
+                            }
+                        }
+
+                        @include expect(false) {
+                            .test {
+                                --md-button-text-color: darkcyan;
+                                --md-button-text-size: 16px;
+                                --md-button-padding-top: 12px;
+                            }
+                        }
+                    }
+                }
+
+                @include it("Should return theme custom properties declarations without component name.") {
+                    @include assert {
+                        @include output(false) {
+                            .test {
+                                @include mixins.emit-custom-props(tokens.$button);
+                            }
+                        }
+
+                        @include expect(false) {
+                            .test {
+                                --md-text-color: darkcyan;
+                                --md-text-size: 16px;
+                                --md-padding-top: 12px;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

__tests__/functions.spec.scss

@@ -25,19 +25,19 @@
         }
 
         @include describe("create-theme-vars()") {
-            @include it("Should return a map of tokens with custom properties.") {
+            @include it("Should return a map of tokens with `var()` CSS function.") {
                 @include assert-equal(functions.create-theme-vars(tokens.$button, "button"), (
-                    "text-color": var(--mg-button-text-color, var(--mg-color-primary, darkcyan)),
+                    "text-color": var(--mg-button-text-color, darkcyan),
                     "text-size": var(--mg-button-text-size, 16px),
                     "padding": (
                         "top": var(--mg-button-padding-top, 12px)
                     )
                 ));
             }
 
-            @include it("Should return a map of tokens with custom properties without component name prefix.") {
+            @include it("Should return a map of tokens with `var()` CSS function without component name.") {
                 @include assert-equal(functions.create-theme-vars(tokens.$button, null), (
-                    "text-color": var(--mg-text-color, var(--mg-color-primary, darkcyan)),
+                    "text-color": var(--mg-text-color, darkcyan),
                     "text-size": var(--mg-text-size, 16px),
                     "padding": (
                         "top": var(--mg-padding-top, 12px)
@@ -52,7 +52,7 @@
             }
 
             @include it("Should return validated theme tokens with fallback.") {
-                @include assert-equal(functions.emit-variable(tokens.$button, "text-color", true, "button"), var(--mg-button-text-color, var(--mg-color-primary, darkcyan)));
+                @include assert-equal(functions.emit-variable(tokens.$button, "text-color", true, "button"), var(--mg-button-text-color, darkcyan));
             }
         }
     }