codexly-ui 0.12.14 → 0.12.16

package/package.json

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

package/types/codexly-ui.d.ts

@@ -2936,6 +2936,11 @@ declare class ClxFilterPanelComponent {
     readonly applyButtonSize: _angular_core.InputSignal<ClxButtonSize>;
     protected readonly _color: _angular_core.Signal<ClxColorInput>;
     protected readonly _applyButtonColor: _angular_core.Signal<ClxColorInput>;
+    /** Outer border — was a hardcoded border-clx-border (a fixed global CSS var, same gray in every
+     *  theme) instead of reading the theme like every other card-shaped component (clx-card,
+     *  clx-product, clx-wishlist, clx-notification all use cardBorderColor/borderLight). Now
+     *  consistent with those. */
+    protected readonly _hostClass: _angular_core.Signal<string>;
     readonly values: _angular_core.ModelSignal<ClxFilterValues>;
     readonly filterChange: _angular_core.OutputEmitterRef<ClxFilterChangeEvent>;
     readonly applyChange: _angular_core.OutputEmitterRef<ClxFilterValues>;
@@ -3316,6 +3321,9 @@ declare class ClxProductComponent {
      *  variant="ghost" (text tinted at textSubtle strength, not a solid fill), so contrast risk is
      *  low, but this is still exposed for full parity with clx-product-detail/clx-wishlist. */
     readonly actionTextColor: _angular_core.InputSignal<ClxColorInput | undefined>;
+    /** Card drop shadow — same ClxCardShadow scale as clx-card ('none' turns it off entirely).
+     *  Falls back to 'sm', the shadow this card has always rendered with. */
+    readonly shadow: _angular_core.InputSignal<ClxCardShadow | undefined>;
     readonly imageFit: _angular_core.InputSignal<"contain" | "cover">;
     readonly addToCart: _angular_core.OutputEmitterRef<ClxProduct>;
     readonly addToWishlist: _angular_core.OutputEmitterRef<ClxProduct>;
@@ -3348,7 +3356,7 @@ declare class ClxProductComponent {
     protected readonly _descClass: _angular_core.Signal<string>;
     protected readonly _priceClass: _angular_core.Signal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ClxProductComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxProductComponent, "clx-product", never, { "product": { "alias": "product"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "priority": { "alias": "priority"; "required": false; "isSignal": true; }; "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "clxColor": { "alias": "clxColor"; "required": false; "isSignal": true; }; "actionTextColor": { "alias": "actionTextColor"; "required": false; "isSignal": true; }; "imageFit": { "alias": "imageFit"; "required": false; "isSignal": true; }; }, { "addToCart": "addToCart"; "addToWishlist": "addToWishlist"; "viewOptions": "viewOptions"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxProductComponent, "clx-product", never, { "product": { "alias": "product"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "priority": { "alias": "priority"; "required": false; "isSignal": true; }; "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "clxColor": { "alias": "clxColor"; "required": false; "isSignal": true; }; "actionTextColor": { "alias": "actionTextColor"; "required": false; "isSignal": true; }; "shadow": { "alias": "shadow"; "required": false; "isSignal": true; }; "imageFit": { "alias": "imageFit"; "required": false; "isSignal": true; }; }, { "addToCart": "addToCart"; "addToWishlist": "addToWishlist"; "viewOptions": "viewOptions"; }, never, never, true, never>;
 }
 
 /** st_spec_options */
@@ -3636,6 +3644,9 @@ declare class ClxWishlistComponent {
     /** Text color for each item's own "Añadir al carrito" (variant="solid") — independent of
      *  `color`, same rationale as checkoutAllTextColor. */
     readonly addToCartTextColor: _angular_core.InputSignal<ClxColorInput | undefined>;
+    /** Product card drop shadow — same ClxCardShadow scale as clx-card ('none' turns it off
+     *  entirely). Falls back to 'sm', the shadow these cards have always rendered with. */
+    readonly shadow: _angular_core.InputSignal<ClxCardShadow | undefined>;
     readonly sortOptions: _angular_core.InputSignal<ClxSelectOption[]>;
     readonly currentPage: _angular_core.ModelSignal<number>;
     readonly pageSize: _angular_core.ModelSignal<number>;
@@ -3682,7 +3693,7 @@ declare class ClxWishlistComponent {
     handleRemove(item: ClxWishlistItem): void;
     handleCheckoutAll(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ClxWishlistComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxWishlistComponent, "clx-wishlist", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "checkoutAllTextColor": { "alias": "checkoutAllTextColor"; "required": false; "isSignal": true; }; "addToCartTextColor": { "alias": "addToCartTextColor"; "required": false; "isSignal": true; }; "sortOptions": { "alias": "sortOptions"; "required": false; "isSignal": true; }; "currentPage": { "alias": "currentPage"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "sortValue": { "alias": "sortValue"; "required": false; "isSignal": true; }; "searchValue": { "alias": "searchValue"; "required": false; "isSignal": true; }; }, { "currentPage": "currentPageChange"; "pageSize": "pageSizeChange"; "sortValue": "sortValueChange"; "searchValue": "searchValueChange"; "onRemove": "onRemove"; "onAddToCart": "onAddToCart"; "onSearchChange": "onSearchChange"; "onSortChange": "onSortChange"; "onPageChange": "onPageChange"; "onCheckoutAll": "onCheckoutAll"; "onBrowseCatalog": "onBrowseCatalog"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxWishlistComponent, "clx-wishlist", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "checkoutAllTextColor": { "alias": "checkoutAllTextColor"; "required": false; "isSignal": true; }; "addToCartTextColor": { "alias": "addToCartTextColor"; "required": false; "isSignal": true; }; "shadow": { "alias": "shadow"; "required": false; "isSignal": true; }; "sortOptions": { "alias": "sortOptions"; "required": false; "isSignal": true; }; "currentPage": { "alias": "currentPage"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "sortValue": { "alias": "sortValue"; "required": false; "isSignal": true; }; "searchValue": { "alias": "searchValue"; "required": false; "isSignal": true; }; }, { "currentPage": "currentPageChange"; "pageSize": "pageSizeChange"; "sortValue": "sortValueChange"; "searchValue": "searchValueChange"; "onRemove": "onRemove"; "onAddToCart": "onAddToCart"; "onSearchChange": "onSearchChange"; "onSortChange": "onSortChange"; "onPageChange": "onPageChange"; "onCheckoutAll": "onCheckoutAll"; "onBrowseCatalog": "onBrowseCatalog"; }, never, never, true, never>;
 }
 
 /** Refleja sa_cart_items + ca_variants + ca_products */
@@ -3723,7 +3734,19 @@ declare class ClxCartComponent {
      *  showing a code input that always fails would read as broken, not "not built yet". */
     readonly showCoupon: _angular_core.InputSignal<boolean>;
     readonly coupon: _angular_core.ModelSignal<ClxCouponResult | null>;
+    /** Drop shadow for the item cards and Order Summary panel — same ClxCardShadow scale as
+     *  clx-card ('none' turns it off entirely). Falls back to 'sm', the shadow these have always
+     *  rendered with. */
+    readonly shadow: _angular_core.InputSignal<ClxCardShadow | undefined>;
+    private readonly _themeSvc;
     protected readonly _quantityColor: _angular_core.Signal<ClxColorInput>;
+    /** Item cards — was bg-clx-surface + shadow-sm with NO border at all (unlike clx-product/
+     *  clx-wishlist, which already read cardBorderColor). Now consistent: themed border +
+     *  configurable shadow, same borderLight treatment as clx-card's own elevated variant. */
+    protected readonly _cardClass: _angular_core.Signal<string>;
+    /** Order Summary panel — same border/shadow treatment as _cardClass, but no hover lift (it's a
+     *  static panel, not a clickable card). */
+    protected readonly _summaryClass: _angular_core.Signal<string>;
     readonly onRemove: _angular_core.OutputEmitterRef<ClxCartItem>;
     readonly onQuantityChange: _angular_core.OutputEmitterRef<{
         item: ClxCartItem;
@@ -3744,7 +3767,7 @@ declare class ClxCartComponent {
     applyCoupon(): void;
     removeCoupon(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ClxCartComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxCartComponent, "clx-cart", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "quantityColor": { "alias": "quantityColor"; "required": false; "isSignal": true; }; "showCoupon": { "alias": "showCoupon"; "required": false; "isSignal": true; }; "coupon": { "alias": "coupon"; "required": false; "isSignal": true; }; }, { "coupon": "couponChange"; "onRemove": "onRemove"; "onQuantityChange": "onQuantityChange"; "onClearCart": "onClearCart"; "onApplyCoupon": "onApplyCoupon"; "onCheckout": "onCheckout"; "onBrowseCatalog": "onBrowseCatalog"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClxCartComponent, "clx-cart", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "quantityColor": { "alias": "quantityColor"; "required": false; "isSignal": true; }; "showCoupon": { "alias": "showCoupon"; "required": false; "isSignal": true; }; "coupon": { "alias": "coupon"; "required": false; "isSignal": true; }; "shadow": { "alias": "shadow"; "required": false; "isSignal": true; }; }, { "coupon": "couponChange"; "onRemove": "onRemove"; "onQuantityChange": "onQuantityChange"; "onClearCart": "onClearCart"; "onApplyCoupon": "onApplyCoupon"; "onCheckout": "onCheckout"; "onBrowseCatalog": "onBrowseCatalog"; }, never, never, true, never>;
 }
 
 interface ClxCartSummaryData {