@alauda/ui 6.4.2-beta.8 → 6.4.3-beta

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alauda/ui",
-  "version": "6.4.2-beta.8",
+  "version": "6.4.3-beta",
   "description": "Angular UI components by Alauda Frontend Team.",
   "repository": "git+https://github.com/alauda/alauda-ui.git",
   "author": "Alauda Frontend",

package/table/table-cell.directive.d.ts

@@ -3,7 +3,8 @@ import { ElementRef } from '@angular/core';
 import * as i0 from "@angular/core";
 /** Cell template container that adds the right classes and role. */
 export declare class TableCellDirective extends CdkCell {
+    direction: 'row' | 'column';
     constructor(columnDef: CdkColumnDef, elementRef: ElementRef<HTMLElement>);
     static ɵfac: i0.ɵɵFactoryDeclaration<TableCellDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TableCellDirective, "aui-table-cell", never, {}, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TableCellDirective, "aui-table-cell", never, { "direction": "direction"; }, {}, never>;
 }

package/table/table-scroll.directive.d.ts

@@ -3,8 +3,9 @@ import { Subject } from 'rxjs';
 import { TableComponent } from './table.component';
 import * as i0 from "@angular/core";
 export declare class TableScrollWrapperDirective {
+    auiTableScrollWrapper: string;
     static ɵfac: i0.ɵɵFactoryDeclaration<TableScrollWrapperDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TableScrollWrapperDirective, "[auiTableScrollWrapper]", never, {}, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TableScrollWrapperDirective, "[auiTableScrollWrapper]", never, { "auiTableScrollWrapper": "auiTableScrollWrapper"; }, {}, never>;
 }
 export declare class TableScrollShadowDirective implements AfterViewInit, OnDestroy {
     private readonly el;

package/theme/_mixin.scss

@@ -58,48 +58,78 @@
 }
 
 // 使用 box-shadow 模拟带圆角的 outline
-@mixin outline-shadow($color: primary) {
-  @include theme-light {
+@mixin outline-shadow($color: primary, $theme: auto) {
+  @if ($theme == light) {
     box-shadow: 0 0 0 2px use-rgba($color, 0.16);
-  }
-  @include theme-dark {
+  } @else if($theme == dark) {
     box-shadow: 0 0 0 2px use-rgba($color, 0.3);
+  } @else {
+    @include theme-light {
+      box-shadow: 0 0 0 2px use-rgba($color, 0.16);
+    }
+    @include theme-dark {
+      box-shadow: 0 0 0 2px use-rgba($color, 0.3);
+    }
   }
 }
 
-@mixin card-shadow() {
-  @include theme-light {
+@mixin card-shadow($theme: auto) {
+  @if ($theme == light) {
     box-shadow: 0 0 4px 0 use-rgba(origin-shadow, 0.1);
-  }
-  @include theme-dark {
+  } @else if($theme == dark) {
     box-shadow: 0 0 4px 0 use-rgba(origin-shadow, 0.75);
+  } @else {
+    @include theme-light {
+      box-shadow: 0 0 4px 0 use-rgba(origin-shadow, 0.1);
+    }
+    @include theme-dark {
+      box-shadow: 0 0 4px 0 use-rgba(origin-shadow, 0.75);
+    }
   }
 }
 
-@mixin popper-shadow() {
-  @include theme-light {
+@mixin popper-shadow($theme: auto) {
+  @if ($theme == light) {
     box-shadow: 0 2px 8px 0 use-rgba(origin-shadow, 0.2);
-  }
-  @include theme-dark {
+  } @else if($theme == dark) {
     box-shadow: 0 2px 8px 0 use-rgba(origin-shadow, 0.75);
+  } @else {
+    @include theme-light {
+      box-shadow: 0 2px 8px 0 use-rgba(origin-shadow, 0.2);
+    }
+    @include theme-dark {
+      box-shadow: 0 2px 8px 0 use-rgba(origin-shadow, 0.75);
+    }
   }
 }
 
-@mixin modal-shadow() {
-  @include theme-light {
+@mixin modal-shadow($theme: auto) {
+  @if ($theme == light) {
     box-shadow: 0 2px 8px 0 use-rgba(origin-shadow, 0.2);
-  }
-  @include theme-dark {
+  } @else if($theme == dark) {
     box-shadow: 0 4px 16px 0 use-rgba(origin-shadow, 0.75);
+  } @else {
+    @include theme-light {
+      box-shadow: 0 2px 8px 0 use-rgba(origin-shadow, 0.2);
+    }
+    @include theme-dark {
+      box-shadow: 0 4px 16px 0 use-rgba(origin-shadow, 0.75);
+    }
   }
 }
 
-@mixin modal-backdrop() {
-  @include theme-light {
+@mixin modal-backdrop($theme: auto) {
+  @if ($theme == light) {
     background-color: use-rgba(origin-shadow, 0.4);
-  }
-  @include theme-dark {
+  } @else if($theme == dark) {
     background-color: use-rgba(origin-shadow, 0.75);
+  } @else {
+    @include theme-light {
+      background-color: use-rgba(origin-shadow, 0.4);
+    }
+    @include theme-dark {
+      background-color: use-rgba(origin-shadow, 0.75);
+    }
   }
 }
 
@@ -125,6 +155,10 @@
     border-radius: 2px;
     background-color: $color;
   }
+
+  &::-webkit-scrollbar-corner {
+    background-color: transparent;
+  }
 }
 
 @mixin clear-button() {

package/theme/_theme-preset.scss

@@ -49,6 +49,7 @@
 }
 
 @mixin light-mode {
+  color-scheme: light;
   --aui-color-blue: #{rgb-string(#007af5)};
   --aui-color-b-0: #{rgb-string(#0067d0)};
   --aui-color-b-1: #{rgb-string(#268df6)};
@@ -58,6 +59,15 @@
   --aui-color-b-5: #{rgb-string(#cce4fd)};
   --aui-color-b-6: #{rgb-string(#e5f1fe)};
   --aui-color-b-7: #{rgb-string(#f2f8fe)};
+  --aui-color-primary: var(--aui-color-blue);
+  --aui-color-p-0: var(--aui-color-b-0);
+  --aui-color-p-1: var(--aui-color-b-1);
+  --aui-color-p-2: var(--aui-color-b-2);
+  --aui-color-p-3: var(--aui-color-b-3);
+  --aui-color-p-4: var(--aui-color-b-4);
+  --aui-color-p-5: var(--aui-color-b-5);
+  --aui-color-p-6: var(--aui-color-b-6);
+  --aui-color-p-7: var(--aui-color-b-7);
   --aui-color-green: #{rgb-string(#00c261)};
   --aui-color-g-0: #{rgb-string(#00a552)};
   --aui-color-g-1: #{rgb-string(#26cb78)};
@@ -103,6 +113,7 @@
 }
 
 @mixin dark-mode {
+  color-scheme: dark;
   --aui-color-blue: #{rgb-string(#3d8eff)};
   --aui-color-b-0: #{rgb-string(#3674cc)};
   --aui-color-b-1: #{rgb-string(#6daaff)};
@@ -112,6 +123,15 @@
   --aui-color-b-5: #{rgb-string(#283651)};
   --aui-color-b-6: #{rgb-string(#2a4066)};
   --aui-color-b-7: #{rgb-string(#2c4a7a)};
+  --aui-color-primary: var(--aui-color-blue);
+  --aui-color-p-0: var(--aui-color-b-0);
+  --aui-color-p-1: var(--aui-color-b-1);
+  --aui-color-p-2: var(--aui-color-b-2);
+  --aui-color-p-3: var(--aui-color-b-3);
+  --aui-color-p-4: var(--aui-color-b-4);
+  --aui-color-p-5: var(--aui-color-b-5);
+  --aui-color-p-6: var(--aui-color-b-6);
+  --aui-color-p-7: var(--aui-color-b-7);
   --aui-color-green: #{rgb-string(#11b671)};
   --aui-color-g-0: #{rgb-string(#159261)};
   --aui-color-g-1: #{rgb-string(#4cc894)};

package/theme/style.css

@@ -9,6 +9,15 @@
   --aui-color-b-5: 204, 228, 253;
   --aui-color-b-6: 229, 241, 254;
   --aui-color-b-7: 242, 248, 254;
+  --aui-color-primary: var(--aui-color-blue);
+  --aui-color-p-0: var(--aui-color-b-0);
+  --aui-color-p-1: var(--aui-color-b-1);
+  --aui-color-p-2: var(--aui-color-b-2);
+  --aui-color-p-3: var(--aui-color-b-3);
+  --aui-color-p-4: var(--aui-color-b-4);
+  --aui-color-p-5: var(--aui-color-b-5);
+  --aui-color-p-6: var(--aui-color-b-6);
+  --aui-color-p-7: var(--aui-color-b-7);
   --aui-color-green: 0, 194, 97;
   --aui-color-g-0: 0, 165, 82;
   --aui-color-g-1: 38, 203, 120;
@@ -64,6 +73,15 @@ html[aui-theme-mode=light] {
   --aui-color-b-5: 204, 228, 253;
   --aui-color-b-6: 229, 241, 254;
   --aui-color-b-7: 242, 248, 254;
+  --aui-color-primary: var(--aui-color-blue);
+  --aui-color-p-0: var(--aui-color-b-0);
+  --aui-color-p-1: var(--aui-color-b-1);
+  --aui-color-p-2: var(--aui-color-b-2);
+  --aui-color-p-3: var(--aui-color-b-3);
+  --aui-color-p-4: var(--aui-color-b-4);
+  --aui-color-p-5: var(--aui-color-b-5);
+  --aui-color-p-6: var(--aui-color-b-6);
+  --aui-color-p-7: var(--aui-color-b-7);
   --aui-color-green: 0, 194, 97;
   --aui-color-g-0: 0, 165, 82;
   --aui-color-g-1: 38, 203, 120;
@@ -120,6 +138,15 @@ html[aui-theme-mode=light] {
     --aui-color-b-5: 40, 54, 81;
     --aui-color-b-6: 42, 64, 102;
     --aui-color-b-7: 44, 74, 122;
+    --aui-color-primary: var(--aui-color-blue);
+    --aui-color-p-0: var(--aui-color-b-0);
+    --aui-color-p-1: var(--aui-color-b-1);
+    --aui-color-p-2: var(--aui-color-b-2);
+    --aui-color-p-3: var(--aui-color-b-3);
+    --aui-color-p-4: var(--aui-color-b-4);
+    --aui-color-p-5: var(--aui-color-b-5);
+    --aui-color-p-6: var(--aui-color-b-6);
+    --aui-color-p-7: var(--aui-color-b-7);
     --aui-color-green: 17, 182, 113;
     --aui-color-g-0: 21, 146, 97;
     --aui-color-g-1: 76, 200, 148;
@@ -175,6 +202,15 @@ html[aui-theme-mode=dark] {
   --aui-color-b-5: 40, 54, 81;
   --aui-color-b-6: 42, 64, 102;
   --aui-color-b-7: 44, 74, 122;
+  --aui-color-primary: var(--aui-color-blue);
+  --aui-color-p-0: var(--aui-color-b-0);
+  --aui-color-p-1: var(--aui-color-b-1);
+  --aui-color-p-2: var(--aui-color-b-2);
+  --aui-color-p-3: var(--aui-color-b-3);
+  --aui-color-p-4: var(--aui-color-b-4);
+  --aui-color-p-5: var(--aui-color-b-5);
+  --aui-color-p-6: var(--aui-color-b-6);
+  --aui-color-p-7: var(--aui-color-b-7);
   --aui-color-green: 17, 182, 113;
   --aui-color-g-0: 21, 146, 97;
   --aui-color-g-1: 76, 200, 148;
@@ -261,15 +297,6 @@ html[aui-theme-mode=dark] {
   --aui-form-item-width-l: 732px;
   --aui-form-item-width-m: 436px;
   --aui-form-item-width-s: 140px;
-  --aui-color-primary: var(--aui-color-blue);
-  --aui-color-p-0: var(--aui-color-b-0);
-  --aui-color-p-1: var(--aui-color-b-1);
-  --aui-color-p-2: var(--aui-color-b-2);
-  --aui-color-p-3: var(--aui-color-b-3);
-  --aui-color-p-4: var(--aui-color-b-4);
-  --aui-color-p-5: var(--aui-color-b-5);
-  --aui-color-p-6: var(--aui-color-b-6);
-  --aui-color-p-7: var(--aui-color-b-7);
 }
 
 body {

package/utils/fn.d.ts

@@ -2,4 +2,5 @@ import { TemplateRef } from '@angular/core';
 export declare function isUndefined(val: unknown): boolean;
 export declare const last: <T>(values: T[]) => T;
 export declare const isTemplateRef: (label: any) => label is TemplateRef<unknown>;
+export declare const isString: (label: any) => label is string;
 export declare const handlePixel: (value: number | string) => string;

package/utils/operators.d.ts

@@ -1,8 +1,7 @@
-/**
- * @see https://rxjs.dev/deprecations/multicasting#publishreplay
- *
- * FIXME:
- * The recommended replacement is breaking our apps for watching resources,
- * revert it back temporarily. see also https://github.com/ReactiveX/rxjs/discussions/6438
- */
-export declare const publishRef: <T>(bufferSize?: number, windowTime?: number) => import("rxjs").UnaryFunction<import("rxjs").Observable<T>, import("rxjs").Observable<T>>;
+import { TimestampProvider } from 'rxjs';
+export declare type PublishRefConfig<T> = number | (import('rxjs/internal/operators/share').ShareConfig<T> & {
+    bufferSize?: number;
+    windowTime?: number;
+    timestampProvider?: TimestampProvider;
+});
+export declare const publishRef: <T>(bufferSizeOrConfig?: PublishRefConfig<T>) => import("rxjs").MonoTypeOperatorFunction<T>;