@egose/shadcn-theme-ng 0.0.13 → 0.0.15

package/spinner/fesm2022/spinner.mjs

@@ -14,15 +14,15 @@ class HlmSpinner {
     spinnerClass = input('', ...(ngDevMode ? [{ debugName: "spinnerClass", alias: 'spinnerClass' }] : [{ alias: 'spinnerClass' }]));
     // Map sizes to Tailwind classes
     sizeClasses = {
-        small: 'tw:size-6!',
-        medium: 'tw:size-8!',
-        large: 'tw:size-12!',
+        small: 'size-6!',
+        medium: 'size-8!',
+        large: 'size-12!',
     };
     // Outer container class (visibility + layout)
-    _containerClass = computed(() => hlm('tw:flex-col tw:items-center tw:justify-center', // base container styles
-    this.show() ? 'tw:flex' : 'tw:hidden', this.wrapperClass()), ...(ngDevMode ? [{ debugName: "_containerClass" }] : []));
+    _containerClass = computed(() => hlm('flex-col items-center justify-center', // base container styles
+    this.show() ? 'flex' : 'hidden', this.wrapperClass()), ...(ngDevMode ? [{ debugName: "_containerClass" }] : []));
     // SVG spinner class (size + animation + color)
-    _iconClass = computed(() => hlm('tw:[&>svg]:animate-spin tw:[&>svg]:text-primary', // base svg styles
+    _iconClass = computed(() => hlm('[&>svg]:animate-spin [&>svg]:text-primary', // base svg styles
     this.sizeClasses[this.size()], this.spinnerClass()), ...(ngDevMode ? [{ debugName: "_iconClass" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmSpinner, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.1", type: HlmSpinner, isStandalone: true, selector: "hlm-spinner", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null }, wrapperClass: { classPropertyName: "wrapperClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, spinnerClass: { classPropertyName: "spinnerClass", publicName: "spinnerClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "status" }, properties: { "class": "_containerClass()" } }, ngImport: i0, template: `<ng-icon [svg]="icon" [class]="_iconClass()" />`, isInline: true, dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });

package/switch/fesm2022/switch.mjs

@@ -6,7 +6,7 @@ import { hlm } from '@egose/shadcn-theme-ng/utils';
 
 class HlmSwitchThumb {
     userClass = input('', ...(ngDevMode ? [{ debugName: "userClass", alias: 'class' }] : [{ alias: 'class' }]));
-    _computedClass = computed(() => hlm('tw:bg-background tw:dark:group-data-[state=unchecked]:bg-foreground tw:dark:group-data-[state=checked]:bg-primary-foreground tw:pointer-events-none tw:block tw:size-4 tw:rounded-full tw:ring-0 tw:transition-transform tw:data-[state=unchecked]:translate-x-0 tw:group-data-[state=checked]:translate-x-[calc(100%-2px)]', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
+    _computedClass = computed(() => hlm('bg-background dark:group-data-[state=unchecked]:bg-foreground dark:group-data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=unchecked]:translate-x-0 group-data-[state=checked]:translate-x-[calc(100%-2px)]', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmSwitchThumb, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.1", type: HlmSwitchThumb, isStandalone: true, selector: "brn-switch-thumb[hlm],[hlmSwitchThumb]", inputs: { userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, ngImport: i0 });
 }
@@ -27,7 +27,7 @@ const EG_SWITCH_VALUE_ACCESSOR = {
 };
 class HlmSwitch {
     userClass = input('', ...(ngDevMode ? [{ debugName: "userClass", alias: 'class' }] : [{ alias: 'class' }]));
-    _computedClass = computed(() => hlm('tw:data-[state=checked]:bg-primary tw:data-[state=unchecked]:bg-input tw:focus-visible:border-ring tw:focus-visible:ring-ring/50 tw:dark:data-[state=unchecked]:bg-input/80 tw:shadow-xs tw:group tw:inline-flex tw:h-[1.15rem] tw:w-8 tw:shrink-0 tw:items-center tw:rounded-full tw:border tw:border-transparent tw:outline-none tw:transition-all tw:focus-visible:ring-[3px] tw:data-[disabled=true]:cursor-not-allowed tw:data-[disabled=true]:opacity-50', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
+    _computedClass = computed(() => hlm('data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 shadow-xs group inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent outline-none transition-all focus-visible:ring-[3px] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     /** The checked state of the switch. */
     checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
     /** The disabled state of the switch. */

package/tabs/fesm2022/tabs.mjs

@@ -14,7 +14,7 @@ import { HlmIcon } from '@egose/shadcn-theme-ng/icon';
 class HlmTabs {
     tab = input.required(...(ngDevMode ? [{ debugName: "tab" }] : []));
     userClass = input('', ...(ngDevMode ? [{ debugName: "userClass", alias: 'class' }] : [{ alias: 'class' }]));
-    _computedClass = computed(() => hlm('tw:flex tw:flex-col tw:gap-2', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
+    _computedClass = computed(() => hlm('flex flex-col gap-2', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmTabs, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.1", type: HlmTabs, isStandalone: true, selector: "hlm-tabs", inputs: { tab: { classPropertyName: "tab", publicName: "tab", isSignal: true, isRequired: true, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, hostDirectives: [{ directive: i1.BrnTabs, inputs: ["orientation", "orientation", "direction", "direction", "activationMode", "activationMode", "brnTabs", "tab"], outputs: ["tabActivated", "tabActivated"] }], ngImport: i0, template: '<ng-content/>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
@@ -40,7 +40,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
 class HlmTabsContent {
     contentFor = input.required(...(ngDevMode ? [{ debugName: "contentFor", alias: 'hlmTabsContent' }] : [{ alias: 'hlmTabsContent' }]));
     userClass = input('', ...(ngDevMode ? [{ debugName: "userClass", alias: 'class' }] : [{ alias: 'class' }]));
-    _computedClass = computed(() => hlm('tw:ring-offset-background tw:focus-visible:ring-ring tw:mt-2 tw:focus-visible:outline-none tw:focus-visible:ring-2 tw:focus-visible:ring-offset-2', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
+    _computedClass = computed(() => hlm('ring-offset-background focus-visible:ring-ring mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmTabsContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.1", type: HlmTabsContent, isStandalone: true, selector: "[hlmTabsContent]", inputs: { contentFor: { classPropertyName: "contentFor", publicName: "hlmTabsContent", isSignal: true, isRequired: true, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, hostDirectives: [{ directive: i1.BrnTabsContent, inputs: ["brnTabsContent", "hlmTabsContent"] }], ngImport: i0 });
 }
@@ -55,11 +55,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
                 }]
         }] });
 
-const listVariants = cva('tw:bg-muted tw:text-muted-foreground tw:inline-flex tw:h-9 tw:w-fit tw:items-center tw:justify-center tw:rounded-lg tw:p-[3px]', {
+const listVariants = cva('bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]', {
     variants: {
         orientation: {
-            horizontal: 'tw:h-10 tw:space-x-1',
-            vertical: 'tw:mt-2 tw:h-fit tw:flex-col tw:space-y-1',
+            horizontal: 'h-10 space-x-1',
+            vertical: 'mt-2 h-fit flex-col space-y-1',
         },
     },
     defaultVariants: {
@@ -96,11 +96,11 @@ class HlmTabsPaginatedList extends BrnTabsPaginatedList {
     nextPaginator = viewChild.required('nextPaginator');
     previousPaginator = viewChild.required('previousPaginator');
     userClass = input('', ...(ngDevMode ? [{ debugName: "userClass", alias: 'class' }] : [{ alias: 'class' }]));
-    _computedClass = computed(() => hlm('tw:relative tw:flex tw:flex-shrink-0 tw:gap-1 tw:overflow-hidden', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
+    _computedClass = computed(() => hlm('relative flex flex-shrink-0 gap-1 overflow-hidden', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     tabListClass = input('', ...(ngDevMode ? [{ debugName: "tabListClass", alias: 'tabListClass' }] : [{ alias: 'tabListClass' }]));
     _tabListClass = computed(() => hlm(listVariants(), this.tabListClass()), ...(ngDevMode ? [{ debugName: "_tabListClass" }] : []));
     paginationButtonClass = input('', ...(ngDevMode ? [{ debugName: "paginationButtonClass", alias: 'paginationButtonClass' }] : [{ alias: 'paginationButtonClass' }]));
-    _paginationButtonClass = computed(() => hlm('tw:relative tw:z-[2] tw:select-none tw:disabled:cursor-default', buttonVariants({ variant: 'ghost', size: 'icon' }), this.paginationButtonClass()), ...(ngDevMode ? [{ debugName: "_paginationButtonClass" }] : []));
+    _paginationButtonClass = computed(() => hlm('relative z-[2] select-none disabled:cursor-default', buttonVariants({ variant: 'ghost', size: 'icon' }), this.paginationButtonClass()), ...(ngDevMode ? [{ debugName: "_paginationButtonClass" }] : []));
     _itemSelected(event) {
         event.preventDefault();
     }
@@ -123,9 +123,9 @@ class HlmTabsPaginatedList extends BrnTabsPaginatedList {
       <ng-icon hlm size="base" name="lucideChevronLeft" />
     </button>
 
-    <div #tabListContainer class="tw:z-[1] tw:flex tw:grow tw:overflow-hidden" (keydown)="_handleKeydown($event)">
+    <div #tabListContainer class="z-[1] flex grow overflow-hidden" (keydown)="_handleKeydown($event)">
       <div
-        class="tw:relative tw:grow tw:transition-transform"
+        class="relative grow transition-transform"
         #tabList
         role="tablist"
         (cdkObserveContent)="_onContentChanges()"
@@ -178,9 +178,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
       <ng-icon hlm size="base" name="lucideChevronLeft" />
     </button>
 
-    <div #tabListContainer class="tw:z-[1] tw:flex tw:grow tw:overflow-hidden" (keydown)="_handleKeydown($event)">
+    <div #tabListContainer class="z-[1] flex grow overflow-hidden" (keydown)="_handleKeydown($event)">
       <div
-        class="tw:relative tw:grow tw:transition-transform"
+        class="relative grow transition-transform"
         #tabList
         role="tablist"
         (cdkObserveContent)="_onContentChanges()"
@@ -218,7 +218,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
 class HlmTabsTrigger {
     triggerFor = input.required(...(ngDevMode ? [{ debugName: "triggerFor", alias: 'hlmTabsTrigger' }] : [{ alias: 'hlmTabsTrigger' }]));
     userClass = input('', ...(ngDevMode ? [{ debugName: "userClass", alias: 'class' }] : [{ alias: 'class' }]));
-    _computedClass = computed(() => hlm('tw:data-[state=active]:bg-background tw:dark:data-[state=active]:text-foreground tw:focus-visible:border-ring tw:focus-visible:ring-ring/50 tw:focus-visible:outline-ring tw:dark:data-[state=active]:border-input tw:dark:data-[state=active]:bg-input/10 tw:text-foreground tw:dark:text-muted-foreground tw:inline-flex tw:h-[calc(100%-1px)] tw:flex-1 tw:items-center tw:justify-center tw:gap-1.5 tw:whitespace-nowrap tw:rounded-md tw:border tw:border-transparent tw:px-2 tw:py-1 tw:text-sm tw:font-medium tw:transition-[color,box-shadow] tw:focus-visible:outline-1 tw:focus-visible:ring-[3px] tw:disabled:pointer-events-none tw:disabled:opacity-50 tw:data-[state=active]:shadow-sm tw:[&_ng-icon]:pointer-events-none tw:[&_ng-icon]:shrink-0 tw:[&_ng-icon]:text-base', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
+    _computedClass = computed(() => hlm('data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/10 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 whitespace-nowrap rounded-md border border-transparent px-2 py-1 text-sm font-medium transition-[color,box-shadow] focus-visible:outline-1 focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_ng-icon]:pointer-events-none [&_ng-icon]:shrink-0 [&_ng-icon]:text-base', this.userClass()), ...(ngDevMode ? [{ debugName: "_computedClass" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmTabsTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.1", type: HlmTabsTrigger, isStandalone: true, selector: "[hlmTabsTrigger]", inputs: { triggerFor: { classPropertyName: "triggerFor", publicName: "hlmTabsTrigger", isSignal: true, isRequired: true, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, hostDirectives: [{ directive: i1.BrnTabsTrigger, inputs: ["brnTabsTrigger", "hlmTabsTrigger", "disabled", "disabled"] }], ngImport: i0 });
 }

package/tooltip/fesm2022/tooltip.mjs

@@ -21,11 +21,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
                 }]
         }] });
 
-const DEFAULT_TOOLTIP_CONTENT_CLASSES = 'tw:bg-primary tw:text-primary-foreground tw:animate-in tw:fade-in-0 tw:zoom-in-95 tw:z-50 tw:w-fit tw:rounded-md tw:px-3 tw:py-1.5 tw:text-xs tw:text-balance ' +
-    'tw:data-[state=open]:animate-in ' +
-    'tw:data-[state=closed]:animate-out tw:data-[state=closed]:fade-out-0 tw:data-[state=closed]:zoom-out-95 ' +
-    'tw:data-[side=below]:slide-in-from-top-2 tw:data-[side=above]:slide-in-from-bottom-2 ' +
-    'tw:data-[side=left]:slide-in-from-right-2 tw:data-[side=right]:slide-in-from-left-2 ';
+const DEFAULT_TOOLTIP_CONTENT_CLASSES = 'bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 z-50 w-fit rounded-md px-3 py-1.5 text-xs text-balance ' +
+    'data-[state=open]:animate-in ' +
+    'data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 ' +
+    'data-[side=below]:slide-in-from-top-2 data-[side=above]:slide-in-from-bottom-2 ' +
+    'data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 ';
 class HlmTooltipTrigger {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: HlmTooltipTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.1", type: HlmTooltipTrigger, isStandalone: true, selector: "[hlmTooltipTrigger]", providers: [