Chore/update ng 20

.changeset/strong-lions-upgrade.md

@@ -0,0 +1,7 @@
+---
+"@alauda/ui": major
+---
+
+feat: upgrade Angular toolchain and Sass theme exports
+
+BREAKING CHANGE: The main branch now targets the Angular 20+ toolchain and updates Sass theme exports and build outputs. Applications that still depend on the v9 Sass import paths, theme structure, or Angular 19-compatible build setup should stay on the `release/v9` maintenance branch until they complete the migration.

.github/workflows/release.yml

@@ -29,6 +29,9 @@ jobs:
           # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits
           fetch-depth: 0
 
+      - name: Corepack Enable
+        run: corepack enable
+
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:

.github/workflows/stories.yml

@@ -12,6 +12,9 @@ jobs:
       - name: Checkout Repo
         uses: actions/checkout@v4
 
+      - name: Corepack Enable
+        run: corepack enable
+
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:

.github/workflows/test.yml

@@ -10,6 +10,9 @@ jobs:
       - name: Checkout Repo
         uses: actions/checkout@v4
 
+      - name: Corepack Enable
+        run: corepack enable
+
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
@@ -23,4 +26,4 @@ jobs:
         run: yarn lint
 
       - name: Run test
-        run: yarn test:ci
+        run: npm run test:ci

.gitignore

@@ -12,3 +12,4 @@ reports
 /documentation.json
 /ng-package.debug.json
 /report.*.json
+.yarn/install-state.gz

.storybook/global.scss

@@ -1,2 +1,2 @@
-@import './reset-browser';
-@import '../src/theme/style.scss';
+@use './reset-browser' as *;
+@use '../src/theme/style.scss' as *;

.storybook/main.ts

@@ -5,8 +5,6 @@ const config: StorybookConfig = {
   stories: ['../stories/**/*.mdx', '../stories/**/*.stories.@(js|jsx|ts|tsx)'],
   addons: [
     '@storybook/addon-links',
-    '@storybook/addon-essentials',
-    '@storybook/addon-interactions',
     {
       name: '@storybook/addon-docs',
       options: {

.storybook/manager.ts

@@ -1,5 +1,5 @@
-import { addons } from '@storybook/manager-api';
-import { create } from '@storybook/theming';
+import { addons } from 'storybook/manager-api';
+import { create } from 'storybook/theming';
 
 addons.setConfig({
   panelPosition: 'right',

.storybook/preview.ts

@@ -1,10 +1,9 @@
 import { setCompodocJson } from '@storybook/addon-docs/angular';
 import type { Preview } from '@storybook/angular';
-import { addons } from '@storybook/manager-api';
+import { addons } from 'storybook/manager-api';
 
 import docJson from '../documentation.json';
 
-// eslint-disable-next-line import/no-webpack-loader-syntax, import/no-unresolved
 import '!style-loader!css-loader!sass-loader!./global.scss';
 
 setCompodocJson(docJson);

.storybook/reset-browser.scss

@@ -1,5 +1,5 @@
-@import '../src/theme/var';
-@import '../src/theme/mixin';
+@use '../src/theme/var' as var;
+@use '../src/theme/mixin' as mixin;
 
 * {
   &,
@@ -55,8 +55,8 @@ body {
   justify-content: center;
   min-width: 100%;
   min-height: 100%;
-  color: use-text-color(main);
-  background-color: use-rgb(n-10);
+  color: var.use-text-color(main);
+  background-color: var.use-rgb(n-10);
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
     Arial, 'Microsoft YaHei', sans-serif;
   font-size: 14px;
@@ -71,7 +71,7 @@ code {
   font-size: 14px;
   line-height: 20px;
   padding: 12px;
-  background: use-rgb(n-9);
+  background: var.use-rgb(n-9);
   border-radius: 2px;
 
   &[ngCodeColorize] {
@@ -83,8 +83,8 @@ input:-webkit-autofill,
 input:-webkit-autofill:hover,
 input:-webkit-autofill:focus,
 input:-webkit-autofill:active {
-  -webkit-text-fill-color: #{use-text-color(main)} !important;
-  box-shadow: 0 0 0 3000px #{use-rgb(main-bg)} inset !important;
+  -webkit-text-fill-color: #{var.use-text-color(main)} !important;
+  box-shadow: 0 0 0 3000px #{var.use-rgb(main-bg)} inset !important;
 }
 
 [hidden] {

.stylelintrc

@@ -27,6 +27,7 @@
           }
         ],
         "scss/no-duplicate-dollar-variables": null,
+        "scss/selector-no-redundant-nesting-selector": null,
         "scss/function-no-unknown": [
           true,
           {

.yarn/plugins/plugin-prepare-lifecycle.cjs

@@ -0,0 +1,11 @@
+module.exports = {
+  name: 'plugin-prepare-lifecycle',
+  factory: (e) => ({
+    hooks: {
+      afterAllInstalled(r) {
+        if (!r.topLevelWorkspace.manifest.scripts.get('prepare')) return;
+        e('@yarnpkg/shell').execute('yarn prepare');
+      },
+    },
+  }),
+};

.yarnrc.yml

@@ -0,0 +1,7 @@
+nodeLinker: node-modules
+
+npmRegistryServer: "https://registry.npmmirror.com"
+
+plugins:
+  - path: .yarn/plugins/plugin-prepare-lifecycle.cjs
+    spec: "https://github.com/un-es/yarn-plugin-prepare-lifecycle/releases/download/v0.0.1/index.js"