codexly-ui 0.5.7 → 0.5.9

package/fesm2022/codexly-ui.mjs

@@ -1297,10 +1297,13 @@ class ClxCardComponent {
     _hasHeader = computed(() => !!this._headerSlot(), ...(ngDevMode ? [{ debugName: "_hasHeader" }] : /* istanbul ignore next */ []));
     _hasBody = computed(() => !!this._bodySlot(), ...(ngDevMode ? [{ debugName: "_hasBody" }] : /* istanbul ignore next */ []));
     _hasFooter = computed(() => !!this._footerSlot(), ...(ngDevMode ? [{ debugName: "_hasFooter" }] : /* istanbul ignore next */ []));
+    /** Blocks interaction only — applied to body/footer so the header (e.g. an enable/disable switch) stays clickable. */
+    _disabledInteractionCls = computed(() => this.disabled() ? 'pointer-events-none' : '', ...(ngDevMode ? [{ debugName: "_disabledInteractionCls" }] : /* istanbul ignore next */ []));
     _bodyClass = computed(() => {
         const pad = this._hasBody() ? CARD_PADDING_MAP[this.padding()] : CARD_PADDING_MAP[this.padding()];
-        return `clx-card-body flex-1 ${pad}`;
+        return `clx-card-body flex-1 ${pad} ${this._disabledInteractionCls()}`.trim();
     }, ...(ngDevMode ? [{ debugName: "_bodyClass" }] : /* istanbul ignore next */ []));
+    _footerClass = computed(() => `clx-card-footer flex items-center gap-2 px-4 py-2 border-t border-clx-border-soft bg-clx-surface-2 ${this._disabledInteractionCls()}`.trim(), ...(ngDevMode ? [{ debugName: "_footerClass" }] : /* istanbul ignore next */ []));
     _hostClass = computed(() => {
         const variant = this.variant();
         const t = resolveColor(this._color());
@@ -1319,7 +1322,7 @@ class ClxCardComponent {
             const shadowClass = shadowInput !== undefined ? CARD_SHADOW_MAP[shadowInput] : '';
             variantClass = `bg-clx-surface-2 border border-transparent ${shadowClass}`;
         }
-        const disabledCls = this.disabled() ? 'opacity-50 pointer-events-none' : '';
+        const disabledCls = this.disabled() ? 'opacity-50' : '';
         return `flex flex-col ${resolveContainerRadius(this._themeSvc.config().borderRadius)} overflow-hidden w-full ${variantClass} ${hover} ${disabledCls}`.trim();
     }, ...(ngDevMode ? [{ debugName: "_hostClass" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: ClxCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
@@ -1338,7 +1341,7 @@ class ClxCardComponent {
     </div>
 
     @if (_hasFooter()) {
-      <div class="clx-card-footer flex items-center gap-2 px-4 py-2 border-t border-clx-border-soft bg-clx-surface-2">
+      <div [class]="_footerClass()">
         <ng-content select="[clxCardFooter]" />
       </div>
     }
@@ -1371,7 +1374,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
     </div>
 
     @if (_hasFooter()) {
-      <div class="clx-card-footer flex items-center gap-2 px-4 py-2 border-t border-clx-border-soft bg-clx-surface-2">
+      <div [class]="_footerClass()">
         <ng-content select="[clxCardFooter]" />
       </div>
     }
@@ -4421,7 +4424,7 @@ class ClxRadioComponent {
             return `${base} border-clx-border bg-clx-surface`;
         const t = resolveColor(this._color());
         if (this._variant() === 'solid')
-            return `${base} ${t.bg} ${t.border}`;
+            return `${base} bg-clx-surface ${t.border}`;
         return `${base} ${t.bgSubtle} ${t.borderLight}`;
     }, ...(ngDevMode ? [{ debugName: "_ringClass" }] : /* istanbul ignore next */ []));
     _dotClass = computed(() => {
@@ -4432,7 +4435,7 @@ class ClxRadioComponent {
             return `${base} scale-100 bg-clx-surface`;
         const t = resolveColor(this._color());
         if (this._variant() === 'solid')
-            return `${base} scale-100 ${t.text}`;
+            return `${base} scale-100 ${t.bg}`;
         return `${base} scale-100 ${t.textSubtle}`;
     }, ...(ngDevMode ? [{ debugName: "_dotClass" }] : /* istanbul ignore next */ []));
     _labelClass = computed(() => {