codexly-ui 0.10.84 → 0.10.86

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "codexly-ui",
-  "version": "0.10.84",
+  "version": "0.10.86",
   "description": "Standalone, signal-based Angular UI component library for Codexly, styled with Tailwind CSS.",
   "keywords": [
     "angular",

package/types/codexly-ui.d.ts

@@ -355,6 +355,10 @@ declare class ClxListItemComponent {
     private readonly _themeSvc;
     readonly label: _angular_core.InputSignal<string>;
     readonly sublabel: _angular_core.InputSignal<string>;
+    /** Sublabel is single-line/truncated by default (its usual role as short trailing metadata) —
+     *  set this when the sublabel is a longer explanatory sentence that should wrap instead of
+     *  getting cut off with an ellipsis. */
+    readonly wrapSublabel: _angular_core.InputSignal<boolean>;
     readonly icon: _angular_core.InputSignal<string>;
     readonly meta: _angular_core.InputSignal<string>;
     readonly metaColor: _angular_core.InputSignal<ClxColorInput | undefined>;
@@ -367,7 +371,7 @@ declare class ClxListItemComponent {
     protected readonly _labelClass: _angular_core.Signal<string>;
     protected readonly _metaClass: _angular_core.Signal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ClxListItemComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxListItemComponent, "clx-list-item", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "meta": { "alias": "meta"; "required": false; "isSignal": true; }; "metaColor": { "alias": "metaColor"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["[clxLead]", "[clxContent]", "[clxTrail]", "*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxListItemComponent, "clx-list-item", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "wrapSublabel": { "alias": "wrapSublabel"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "meta": { "alias": "meta"; "required": false; "isSignal": true; }; "metaColor": { "alias": "metaColor"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["[clxLead]", "[clxContent]", "[clxTrail]", "*"], true, never>;
 }
 
 type ClxSkeletonVariant = 'text' | 'circular' | 'rectangular';
@@ -2511,12 +2515,22 @@ interface ClxFilterChangeEvent {
     all: ClxFilterValues;
 }
 
+/** clx-button's own size input excludes 'xl' — mirrored here so applyButtonSize can't be set to a
+ *  value the button would silently reject. */
+type ClxButtonSize = Extract<ClxSize, 'xxs' | 'xs' | 'sm' | 'md' | 'lg'>;
 declare class ClxFilterPanelComponent {
     private readonly _themeSvc;
     readonly fields: _angular_core.InputSignal<ClxFilterField[]>;
     readonly color: _angular_core.InputSignal<ClxColorInput | undefined>;
     readonly showApply: _angular_core.InputSignal<boolean>;
+    /** Overrides for just the "Aplicar filtros" button — falls back to color()/theme primary and
+     *  size 'sm' when unset, same pattern as clx-product-detail's actionColor/wishlistColor. Lets a
+     *  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. */
+    readonly applyButtonColor: _angular_core.InputSignal<ClxColorInput | undefined>;
+    readonly applyButtonSize: _angular_core.InputSignal<ClxButtonSize>;
     protected readonly _color: _angular_core.Signal<ClxColorInput>;
+    protected readonly _applyButtonColor: _angular_core.Signal<ClxColorInput>;
     readonly values: _angular_core.ModelSignal<ClxFilterValues>;
     readonly filterChange: _angular_core.OutputEmitterRef<ClxFilterChangeEvent>;
     readonly applyChange: _angular_core.OutputEmitterRef<ClxFilterValues>;
@@ -2540,7 +2554,7 @@ declare class ClxFilterPanelComponent {
     protected _badgeCls(): string;
     protected _fieldBadgeCls(): string;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ClxFilterPanelComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxFilterPanelComponent, "clx-filter-panel", never, { "fields": { "alias": "fields"; "required": true; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "showApply": { "alias": "showApply"; "required": false; "isSignal": true; }; "values": { "alias": "values"; "required": false; "isSignal": true; }; }, { "values": "valuesChange"; "filterChange": "filterChange"; "applyChange": "applyChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxFilterPanelComponent, "clx-filter-panel", never, { "fields": { "alias": "fields"; "required": true; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "showApply": { "alias": "showApply"; "required": false; "isSignal": true; }; "applyButtonColor": { "alias": "applyButtonColor"; "required": false; "isSignal": true; }; "applyButtonSize": { "alias": "applyButtonSize"; "required": false; "isSignal": true; }; "values": { "alias": "values"; "required": false; "isSignal": true; }; }, { "values": "valuesChange"; "filterChange": "filterChange"; "applyChange": "applyChange"; }, never, never, true, never>;
 }
 
 declare class ClxCarouselDirective {