@acorex/components 19.8.0-next.8 → 19.9.0

package/fesm2022/acorex-components-common.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { model, output, Component, inject, ElementRef, signal, afterNextRender, Injectable, PLATFORM_ID, Directive, Host, Self, Optional, Input, Inject, NgModule, ChangeDetectorRef, ViewContainerRef, EventEmitter, InjectionToken, Output, input, effect } from '@angular/core';
+import { model, output, Component, inject, ElementRef, signal, afterNextRender, Injectable, PLATFORM_ID, Input, Host, Self, Optional, Directive, Inject, NgModule, ChangeDetectorRef, ViewContainerRef, EventEmitter, InjectionToken, Output, input, effect } from '@angular/core';
 import { AXHtmlUtil } from '@acorex/core/utils';
-import { flatten, clone, set, isEqual } from 'lodash-es';
+import { flatten, clone, isEqual } from 'lodash-es';
 import { DataSource } from '@angular/cdk/collections';
 import { Subscription, BehaviorSubject, debounceTime, distinctUntilChanged, Subject, fromEvent, noop, skip } from 'rxjs';
 import { DOCUMENT, isPlatformBrowser } from '@angular/common';
@@ -669,23 +669,8 @@ function convertArrayToDataSource(items, options = { key: 'id', pageSize: 100 })
     return new AXDataSource(config);
 }
 
-const AX_STYLE_COLOR_TYPES = [
-    'primary',
-    'secondary',
-    'success',
-    'warning',
-    'danger',
-    'ghost',
-];
-const AX_STYLE_LOOK_TYPES = [
-    'solid',
-    'blank',
-    'outline',
-    'twotone',
-    'flat',
-    'fill',
-    'none',
-];
+const AX_STYLE_COLOR_TYPES = ['primary', 'success', 'warning', 'danger', 'neutral', 'ghost'];
+const AX_STYLE_LOOK_TYPES = ['solid', 'blank', 'outline', 'twotone', 'flat', 'fill', 'none'];
 const AX_LOCATIONS = [
     'bottom-start',
     'bottom-center',
@@ -1329,9 +1314,9 @@ class MXButtonBaseComponent extends classes(MXInteractiveComponent, MXColorLookC
             'ax-button-icon': !this.text,
             'ax-state-disabled': this.disabled,
             'ax-state-selected': this.selected,
+            'ax-el-interactive': true,
         };
-        set(cssClasses, `ax-${this.look || 'solid'}`, true);
-        set(cssClasses, `ax-${this.color || 'primary'}`, true);
+        cssClasses[`ax-el-${this['color'] || 'solid'}${this['look'] ? '-' + this['look'] : '-solid'}`] = true;
         return cssClasses;
     }
 }
@@ -1938,7 +1923,7 @@ class AXRippleDirective {
         this.el = el;
         this.cdr = cdr;
         this.enabled = true;
-        this.axRippleColor = 'var(--ax-comp-ripple-bg-color, rgba(255, 255, 255, 0.3))';
+        this.axRippleColor = 'rgb(255, 255, 255 , 0.3)';
         this.document = inject(DOCUMENT);
         this.platformID = inject(PLATFORM_ID);
     }