codexly-ui 0.12.13 → 0.12.14

package/fesm2022/codexly-ui.mjs

@@ -13259,6 +13259,11 @@ class ClxFilterPanelComponent {
      *  host keep a saturated brand color on checkboxes/slider (small accents) while giving the CTA
      *  button its own color and a bigger size if the sidebar's width calls for it. */
     applyButtonColor = input(undefined, ...(ngDevMode ? [{ debugName: "applyButtonColor" }] : /* istanbul ignore next */ []));
+    /** Text color for the same "Aplicar filtros" button — independent of applyButtonColor, same
+     *  rationale as clx-button's own [textColor]: a saturated applyButtonColor can leave the
+     *  auto-resolved contrast text illegible. Undefined leaves clx-button's own automatic
+     *  resolution untouched. */
+    applyButtonTextColor = input(undefined, ...(ngDevMode ? [{ debugName: "applyButtonTextColor" }] : /* istanbul ignore next */ []));
     applyButtonSize = input('sm', ...(ngDevMode ? [{ debugName: "applyButtonSize" }] : /* istanbul ignore next */ []));
     _color = computed(() => this.color() ?? this._themeSvc.config().primaryColor, ...(ngDevMode ? [{ debugName: "_color" }] : /* istanbul ignore next */ []));
     _applyButtonColor = computed(() => this.applyButtonColor() ?? this._color(), ...(ngDevMode ? [{ debugName: "_applyButtonColor" }] : /* istanbul ignore next */ []));
@@ -13346,7 +13351,7 @@ class ClxFilterPanelComponent {
         return `text-xs px-1.5 py-0.5 rounded-full font-medium ${t.bgSubtle} ${t.textSubtle}`;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: ClxFilterPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.15", type: ClxFilterPanelComponent, isStandalone: true, selector: "clx-filter-panel", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, showApply: { classPropertyName: "showApply", publicName: "showApply", isSignal: true, isRequired: false, transformFunction: null }, applyButtonColor: { classPropertyName: "applyButtonColor", publicName: "applyButtonColor", isSignal: true, isRequired: false, transformFunction: null }, applyButtonSize: { classPropertyName: "applyButtonSize", publicName: "applyButtonSize", isSignal: true, isRequired: false, transformFunction: null }, values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { values: "valuesChange", filterChange: "filterChange", applyChange: "applyChange" }, host: { classAttribute: "flex flex-col bg-clx-surface border border-clx-border rounded-xl overflow-hidden" }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.15", type: ClxFilterPanelComponent, isStandalone: true, selector: "clx-filter-panel", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, showApply: { classPropertyName: "showApply", publicName: "showApply", isSignal: true, isRequired: false, transformFunction: null }, applyButtonColor: { classPropertyName: "applyButtonColor", publicName: "applyButtonColor", isSignal: true, isRequired: false, transformFunction: null }, applyButtonTextColor: { classPropertyName: "applyButtonTextColor", publicName: "applyButtonTextColor", isSignal: true, isRequired: false, transformFunction: null }, applyButtonSize: { classPropertyName: "applyButtonSize", publicName: "applyButtonSize", isSignal: true, isRequired: false, transformFunction: null }, values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { values: "valuesChange", filterChange: "filterChange", applyChange: "applyChange" }, host: { classAttribute: "flex flex-col bg-clx-surface border border-clx-border rounded-xl overflow-hidden" }, ngImport: i0, template: `
     <!-- Header -->
     <div class="flex items-center justify-between px-4 py-3 border-b border-clx-border-soft">
       <div class="flex items-center gap-2">
@@ -13467,7 +13472,7 @@ class ClxFilterPanelComponent {
     <!-- Apply footer -->
     @if (showApply()) {
       <div class="px-4 py-3 border-t border-clx-border-soft flex gap-2">
-        <button clx-button type="button" variant="solid" [color]="_applyButtonColor()" [size]="applyButtonSize()" class="flex-1" (click)="_apply()">
+        <button clx-button type="button" variant="solid" [color]="_applyButtonColor()" [textColor]="applyButtonTextColor()" [size]="applyButtonSize()" class="flex-1" (click)="_apply()">
           Aplicar filtros
         </button>
       </div>
@@ -13601,7 +13606,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
     <!-- Apply footer -->
     @if (showApply()) {
       <div class="px-4 py-3 border-t border-clx-border-soft flex gap-2">
-        <button clx-button type="button" variant="solid" [color]="_applyButtonColor()" [size]="applyButtonSize()" class="flex-1" (click)="_apply()">
+        <button clx-button type="button" variant="solid" [color]="_applyButtonColor()" [textColor]="applyButtonTextColor()" [size]="applyButtonSize()" class="flex-1" (click)="_apply()">
           Aplicar filtros
         </button>
       </div>
@@ -13611,7 +13616,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     host: { class: 'flex flex-col bg-clx-surface border border-clx-border rounded-xl overflow-hidden' },
                 }]
-        }], propDecorators: { fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], showApply: [{ type: i0.Input, args: [{ isSignal: true, alias: "showApply", required: false }] }], applyButtonColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "applyButtonColor", required: false }] }], applyButtonSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "applyButtonSize", required: false }] }], values: [{ type: i0.Input, args: [{ isSignal: true, alias: "values", required: false }] }, { type: i0.Output, args: ["valuesChange"] }], filterChange: [{ type: i0.Output, args: ["filterChange"] }], applyChange: [{ type: i0.Output, args: ["applyChange"] }] } });
+        }], propDecorators: { fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], showApply: [{ type: i0.Input, args: [{ isSignal: true, alias: "showApply", required: false }] }], applyButtonColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "applyButtonColor", required: false }] }], applyButtonTextColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "applyButtonTextColor", required: false }] }], applyButtonSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "applyButtonSize", required: false }] }], values: [{ type: i0.Input, args: [{ isSignal: true, alias: "values", required: false }] }, { type: i0.Output, args: ["valuesChange"] }], filterChange: [{ type: i0.Output, args: ["filterChange"] }], applyChange: [{ type: i0.Output, args: ["applyChange"] }] } });
 
 class ClxCarouselDirective {
     templateRef;