mn-angular-lib 0.0.87 → 0.0.88

package/fesm2022/mn-angular-lib.mjs

@@ -3316,21 +3316,30 @@ var ColumnSortType;
  * Attribute directive that applies responsive-hiding classes to table cells/headers.
  * Hides the element by default and shows it as `table-cell` at the specified breakpoint.
  *
+ * Uses a static class map so Tailwind CSS can detect the full class names at build time.
+ *
  * Usage: `<td [mnHiddenBelow]="column.hiddenBelow">`
  */
 class MnHiddenBelowDirective {
+    /** The breakpoint below which the element is hidden. */
     mnHiddenBelow;
     el = inject(ElementRef);
     renderer = inject(Renderer2);
     appliedClasses = [];
+    /** Static mapping of breakpoints to their full Tailwind class names. */
+    classMap = {
+        sm: ['hidden', 'sm:table-cell'],
+        md: ['hidden', 'md:table-cell'],
+        lg: ['hidden', 'lg:table-cell'],
+    };
     ngOnChanges() {
         // Remove previously applied classes
         for (const cls of this.appliedClasses) {
             this.renderer.removeClass(this.el.nativeElement, cls);
         }
         this.appliedClasses = [];
-        if (this.mnHiddenBelow) {
-            const classes = ['hidden', `${this.mnHiddenBelow}:table-cell`];
+        if (this.mnHiddenBelow && this.classMap[this.mnHiddenBelow]) {
+            const classes = this.classMap[this.mnHiddenBelow];
             for (const cls of classes) {
                 this.renderer.addClass(this.el.nativeElement, cls);
             }