@spartan-ng/cli 0.0.1-alpha.573 → 0.0.1-alpha.575

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spartan-ng/cli",
-  "version": "0.0.1-alpha.573",
+  "version": "0.0.1-alpha.575",
   "type": "commonjs",
   "dependencies": {
     "@angular/core": ">=19.0.0",

package/src/generators/healthcheck/generator.js

@@ -18,6 +18,7 @@ const core_imports_1 = require("./healthchecks/core-imports");
 const helm_imports_1 = require("./healthchecks/helm-imports");
 const hlm_1 = require("./healthchecks/hlm");
 const hlm_date_picker_1 = require("./healthchecks/hlm-date-picker");
+const hlm_dialog_1 = require("./healthchecks/hlm-dialog");
 const hlm_icon_1 = require("./healthchecks/hlm-icon");
 const hlm_menu_1 = require("./healthchecks/hlm-menu");
 const hlm_progress_1 = require("./healthchecks/hlm-progress");
@@ -54,6 +55,7 @@ async function healthcheckGenerator(tree, options) {
         brn_toggle_group_2_1.brainToggleGroup2Healthcheck,
         brn_collapsible_1.brainCollapsibleHealthcheck,
         hlm_menu_1.helmMenuHealthcheck,
+        hlm_dialog_1.helmDialogHealthcheck,
     ];
     const failedReports = [];
     const importAlias = await (0, config_1.getImportAlias)(tree, options.angularCli);

package/src/generators/healthcheck/generator.js.map

@@ -1 +1 @@
-{"version":3,"file":"generator.js","sourceRoot":"","sources":["../../../../../../libs/cli/src/generators/healthcheck/generator.ts"],"names":[],"mappings":";;AA8BA,oDAsDC;AApFD,uCAA4D;AAC5D,+CAAoD;AACpD,iDAAmH;AACnH,gEAAuE;AACvE,gFAAwF;AACxF,wGAAiG;AACjG,oEAA6E;AAC7E,wDAAiE;AACjE,gEAAyE;AACzE,oGAA6F;AAC7F,0DAAmE;AACnE,sEAA8E;AAC9E,0EAAiF;AACjF,8DAAqE;AACrE,8DAAqE;AACrE,4CAA0D;AAC1D,oEAAuE;AACvE,sDAA8D;AAC9D,sDAA8D;AAC9D,8DAAkE;AAClE,oEAAuE;AACvE,0DAA8D;AAC9D,kEAAyE;AACzE,0EAAgF;AAChF,oDAA4D;AAE5D,2CAA4C;AAC5C,+CAA+C;AAC/C,2CAAgD;AAEzC,KAAK,UAAU,oBAAoB,CAAC,IAAU,EAAE,OAA8D;IACpH,eAAM,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;IAEvC,MAAM,YAAY,GAAkB;QACnC,4BAAkB;QAClB,uCAAuB;QACvB,qCAAsB;QACtB,8BAAmB;QACnB,uCAAqB;QACrB,iCAAqB;QACrB,8BAAiB;QACjB,8CAA2B;QAC3B,qCAAsB;QACtB,gDAA2B;QAC3B,uCAAqB;QACrB,kCAAmB;QACnB,0BAAoB;QACpB,yCAAyB;QACzB,iEAA6B;QAC7B,6DAA2B;QAC3B,wDAAgC;QAChC,yCAAwB;QACxB,mCAAsB;QACtB,iDAA4B;QAC5B,6CAA2B;QAC3B,8BAAmB;KACnB,CAAC;IAEF,MAAM,aAAa,GAAwB,EAAE,CAAC;IAE9C,MAAM,WAAW,GAAG,MAAM,IAAA,uBAAc,EAAC,IAAI,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAEnE,KAAK,MAAM,WAAW,IAAI,YAAY,EAAE,CAAC;QACxC,MAAM,MAAM,GAAG,MAAM,IAAA,uBAAc,EAAC,IAAI,EAAE,WAAW,EAAE,WAAW,CAAC,CAAC;QACpE,IAAA,sBAAW,EAAC,MAAM,CAAC,CAAC;QAEpB,IAAI,MAAM,CAAC,MAAM,KAAK,gCAAiB,CAAC,OAAO,EAAE,CAAC;YACjD,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAC5B,CAAC;IACF,CAAC;IAED,KAAK,MAAM,MAAM,IAAI,aAAa,EAAE,CAAC;QACpC,IAAI,MAAM,CAAC,OAAO,IAAI,IAAA,mCAAoB,EAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC;YAChE,MAAM,GAAG,GAAG,OAAO,CAAC,OAAO,IAAI,CAAC,MAAM,IAAA,mBAAU,EAAC,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC;YAE7E,IAAI,GAAG,EAAE,CAAC;gBACT,MAAM,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,UAAU,EAAE,OAAO,CAAC,UAAU,EAAE,WAAW,EAAE,CAAC,CAAC;YACrF,CAAC;QACF,CAAC;IACF,CAAC;IAED,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QACzB,MAAM,IAAA,oBAAW,EAAC,IAAI,CAAC,CAAC;IACzB,CAAC;AACF,CAAC;AAED,kBAAe,oBAAoB,CAAC"}
+{"version":3,"file":"generator.js","sourceRoot":"","sources":["../../../../../../libs/cli/src/generators/healthcheck/generator.ts"],"names":[],"mappings":";;AA+BA,oDAuDC;AAtFD,uCAA4D;AAC5D,+CAAoD;AACpD,iDAAmH;AACnH,gEAAuE;AACvE,gFAAwF;AACxF,wGAAiG;AACjG,oEAA6E;AAC7E,wDAAiE;AACjE,gEAAyE;AACzE,oGAA6F;AAC7F,0DAAmE;AACnE,sEAA8E;AAC9E,0EAAiF;AACjF,8DAAqE;AACrE,8DAAqE;AACrE,4CAA0D;AAC1D,oEAAuE;AACvE,0DAAkE;AAClE,sDAA8D;AAC9D,sDAA8D;AAC9D,8DAAkE;AAClE,oEAAuE;AACvE,0DAA8D;AAC9D,kEAAyE;AACzE,0EAAgF;AAChF,oDAA4D;AAE5D,2CAA4C;AAC5C,+CAA+C;AAC/C,2CAAgD;AAEzC,KAAK,UAAU,oBAAoB,CAAC,IAAU,EAAE,OAA8D;IACpH,eAAM,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;IAEvC,MAAM,YAAY,GAAkB;QACnC,4BAAkB;QAClB,uCAAuB;QACvB,qCAAsB;QACtB,8BAAmB;QACnB,uCAAqB;QACrB,iCAAqB;QACrB,8BAAiB;QACjB,8CAA2B;QAC3B,qCAAsB;QACtB,gDAA2B;QAC3B,uCAAqB;QACrB,kCAAmB;QACnB,0BAAoB;QACpB,yCAAyB;QACzB,iEAA6B;QAC7B,6DAA2B;QAC3B,wDAAgC;QAChC,yCAAwB;QACxB,mCAAsB;QACtB,iDAA4B;QAC5B,6CAA2B;QAC3B,8BAAmB;QACnB,kCAAqB;KACrB,CAAC;IAEF,MAAM,aAAa,GAAwB,EAAE,CAAC;IAE9C,MAAM,WAAW,GAAG,MAAM,IAAA,uBAAc,EAAC,IAAI,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAEnE,KAAK,MAAM,WAAW,IAAI,YAAY,EAAE,CAAC;QACxC,MAAM,MAAM,GAAG,MAAM,IAAA,uBAAc,EAAC,IAAI,EAAE,WAAW,EAAE,WAAW,CAAC,CAAC;QACpE,IAAA,sBAAW,EAAC,MAAM,CAAC,CAAC;QAEpB,IAAI,MAAM,CAAC,MAAM,KAAK,gCAAiB,CAAC,OAAO,EAAE,CAAC;YACjD,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAC5B,CAAC;IACF,CAAC;IAED,KAAK,MAAM,MAAM,IAAI,aAAa,EAAE,CAAC;QACpC,IAAI,MAAM,CAAC,OAAO,IAAI,IAAA,mCAAoB,EAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC;YAChE,MAAM,GAAG,GAAG,OAAO,CAAC,OAAO,IAAI,CAAC,MAAM,IAAA,mBAAU,EAAC,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC;YAE7E,IAAI,GAAG,EAAE,CAAC;gBACT,MAAM,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,UAAU,EAAE,OAAO,CAAC,UAAU,EAAE,WAAW,EAAE,CAAC,CAAC;YACrF,CAAC;QACF,CAAC;IACF,CAAC;IAED,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QACzB,MAAM,IAAA,oBAAW,EAAC,IAAI,CAAC,CAAC;IACzB,CAAC;AACF,CAAC;AAED,kBAAe,oBAAoB,CAAC"}

package/src/generators/healthcheck/healthchecks/hlm-dialog.d.ts

@@ -0,0 +1,2 @@
+import { type Healthcheck } from '../healthchecks';
+export declare const helmDialogHealthcheck: Healthcheck;

package/src/generators/healthcheck/healthchecks/hlm-dialog.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.helmDialogHealthcheck = void 0;
+const tslib_1 = require("tslib");
+const devkit_1 = require("@nx/devkit");
+const generator_1 = tslib_1.__importStar(require("../../migrate-dialog/generator"));
+const healthchecks_1 = require("../healthchecks");
+exports.helmDialogHealthcheck = {
+    name: 'Helm Menu',
+    async detect(tree, failure, _) {
+        (0, devkit_1.visitNotIgnoredFiles)(tree, '/', (file) => {
+            // if the file is a .ts or .htlm file, check for helm menu
+            if (!file.endsWith('.ts') && !file.endsWith('.html')) {
+                return;
+            }
+            // skip itself
+            if (generator_1.ignoreFiles.some((menuFile) => file.endsWith(menuFile))) {
+                return;
+            }
+            const contents = tree.read(file, 'utf-8');
+            if (!contents) {
+                return;
+            }
+            if (contents.includes('brnAlertDialogTrigger') ||
+                contents.includes('brnDialogTrigger') ||
+                contents.includes('brnPopoverTrigger') ||
+                contents.includes('brn-popover') ||
+                contents.includes('brnSheetTrigger')) {
+                failure(`Please use the new helm directives for alert-dialog, dialog, popover or sheet.`, healthchecks_1.HealthcheckSeverity.Error, true);
+            }
+        });
+    },
+    fix: async (tree, { importAlias }) => {
+        await (0, generator_1.default)(tree, { skipFormat: true, importAlias });
+        return true;
+    },
+    prompt: 'Would you like to migrate alert-dialog/dialog/popover/sheet selectors? You need to generate the new helm components for alert-dialog, dialog, popover or sheet.',
+};
+//# sourceMappingURL=hlm-dialog.js.map

package/src/generators/healthcheck/healthchecks/hlm-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hlm-dialog.js","sourceRoot":"","sources":["../../../../../../../libs/cli/src/generators/healthcheck/healthchecks/hlm-dialog.ts"],"names":[],"mappings":";;;;AAAA,uCAAkD;AAClD,oFAAmF;AACnF,kDAAwE;AAE3D,QAAA,qBAAqB,GAAgB;IACjD,IAAI,EAAE,WAAW;IACjB,KAAK,CAAC,MAAM,CAAC,IAAI,EAAE,OAAO,EAAE,CAAC;QAC5B,IAAA,6BAAoB,EAAC,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;YACxC,0DAA0D;YAC1D,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC;gBACtD,OAAO;YACR,CAAC;YAED,cAAc;YACd,IAAI,uBAAW,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC;gBAC7D,OAAO;YACR,CAAC;YAED,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;YAE1C,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACf,OAAO;YACR,CAAC;YAED,IACC,QAAQ,CAAC,QAAQ,CAAC,uBAAuB,CAAC;gBAC1C,QAAQ,CAAC,QAAQ,CAAC,kBAAkB,CAAC;gBACrC,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC;gBACtC,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC;gBAChC,QAAQ,CAAC,QAAQ,CAAC,iBAAiB,CAAC,EACnC,CAAC;gBACF,OAAO,CACN,gFAAgF,EAChF,kCAAmB,CAAC,KAAK,EACzB,IAAI,CACJ,CAAC;YACH,CAAC;QACF,CAAC,CAAC,CAAC;IACJ,CAAC;IACD,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE;QACpC,MAAM,IAAA,mBAAoB,EAAC,IAAI,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAC;QACpE,OAAO,IAAI,CAAC;IACb,CAAC;IACD,MAAM,EACL,iKAAiK;CAClK,CAAC"}

package/src/generators/migrate-dialog/compat.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (generatorOptions: import("./schema").MigrateDialogGeneratorSchema) => (tree: any, context: any) => Promise<any>;
+export default _default;

package/src/generators/migrate-dialog/compat.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const devkit_1 = require("@nx/devkit");
+const generator_1 = require("./generator");
+exports.default = (0, devkit_1.convertNxGenerator)(generator_1.migrateDialogGenerator);
+//# sourceMappingURL=compat.js.map

package/src/generators/migrate-dialog/compat.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"compat.js","sourceRoot":"","sources":["../../../../../../libs/cli/src/generators/migrate-dialog/compat.ts"],"names":[],"mappings":";;AAAA,uCAAgD;AAChD,2CAAqD;AAErD,kBAAe,IAAA,2BAAkB,EAAC,kCAAsB,CAAC,CAAC"}

package/src/generators/migrate-dialog/generator.d.ts

@@ -0,0 +1,5 @@
+import { type Tree } from '@nx/devkit';
+import type { MigrateDialogGeneratorSchema } from './schema';
+export declare const ignoreFiles: string[];
+export declare function migrateDialogGenerator(tree: Tree, { skipFormat }: MigrateDialogGeneratorSchema): Promise<void>;
+export default migrateDialogGenerator;

package/src/generators/migrate-dialog/generator.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ignoreFiles = void 0;
+exports.migrateDialogGenerator = migrateDialogGenerator;
+const devkit_1 = require("@nx/devkit");
+const visit_files_1 = require("../../utils/visit-files");
+exports.ignoreFiles = ['hlm-alert-dialog-trigger.ts', 'hlm-dialog-trigger.ts', 'hlm-popover-trigger.ts'];
+async function migrateDialogGenerator(tree, { skipFormat }) {
+    replaceSelector(tree);
+    if (!skipFormat) {
+        await (0, devkit_1.formatFiles)(tree);
+    }
+}
+function replaceSelector(tree) {
+    (0, visit_files_1.visitFiles)(tree, '.', (path) => {
+        // if this is not an html file or typescript file (inline templates) then skip
+        if (!path.endsWith('.html') && !path.endsWith('.ts')) {
+            return;
+        }
+        if (exports.ignoreFiles.some((menuFile) => path.endsWith(menuFile))) {
+            return;
+        }
+        let content = tree.read(path, 'utf-8');
+        if (!content) {
+            return;
+        }
+        // alert-dialog trigger
+        if (content.includes('brnAlertDialogTrigger')) {
+            content = content
+                .replace(/brnAlertDialogTrigger/g, 'hlmAlertDialogTrigger')
+                .replace(/brnAlertDialogTriggerFor/g, 'hlmAlertDialogTriggerFor');
+        }
+        // dialog trigger
+        if (content.includes('brnDialogTrigger')) {
+            content = content
+                .replace(/brnDialogTrigger/g, 'hlmDialogTrigger')
+                .replace(/brnDialogTriggerFor/g, 'hlmDialogTriggerFor');
+        }
+        // popover trigger
+        if (content.includes('brnPopoverTrigger')) {
+            content = content
+                .replace(/brnPopoverTrigger/g, 'hlmPopoverTrigger')
+                .replace(/brnPopoverTriggerFor/g, 'hlmPopoverTriggerFor');
+        }
+        // popover
+        if (content.includes('brn-popover')) {
+            content = content.replace(/brn-popover/g, 'hlm-popover');
+        }
+        // sheet trigger
+        if (content.includes('brnSheetTrigger')) {
+            content = content.replace(/brnSheetTrigger/g, 'hlmSheetTrigger');
+        }
+        tree.write(path, content);
+    });
+}
+exports.default = migrateDialogGenerator;
+//# sourceMappingURL=generator.js.map

package/src/generators/migrate-dialog/generator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generator.js","sourceRoot":"","sources":["../../../../../../libs/cli/src/generators/migrate-dialog/generator.ts"],"names":[],"mappings":";;;AAMA,wDAMC;AAZD,uCAAoD;AACpD,yDAAqD;AAGxC,QAAA,WAAW,GAAG,CAAC,6BAA6B,EAAE,uBAAuB,EAAE,wBAAwB,CAAC,CAAC;AAEvG,KAAK,UAAU,sBAAsB,CAAC,IAAU,EAAE,EAAE,UAAU,EAAgC;IACpG,eAAe,CAAC,IAAI,CAAC,CAAC;IAEtB,IAAI,CAAC,UAAU,EAAE,CAAC;QACjB,MAAM,IAAA,oBAAW,EAAC,IAAI,CAAC,CAAC;IACzB,CAAC;AACF,CAAC;AAED,SAAS,eAAe,CAAC,IAAU;IAClC,IAAA,wBAAU,EAAC,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;QAC9B,8EAA8E;QAC9E,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC;YACtD,OAAO;QACR,CAAC;QAED,IAAI,mBAAW,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC;YAC7D,OAAO;QACR,CAAC;QAED,IAAI,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAEvC,IAAI,CAAC,OAAO,EAAE,CAAC;YACd,OAAO;QACR,CAAC;QAED,uBAAuB;QACvB,IAAI,OAAO,CAAC,QAAQ,CAAC,uBAAuB,CAAC,EAAE,CAAC;YAC/C,OAAO,GAAG,OAAO;iBACf,OAAO,CAAC,wBAAwB,EAAE,uBAAuB,CAAC;iBAC1D,OAAO,CAAC,2BAA2B,EAAE,0BAA0B,CAAC,CAAC;QACpE,CAAC;QAED,iBAAiB;QACjB,IAAI,OAAO,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAAE,CAAC;YAC1C,OAAO,GAAG,OAAO;iBACf,OAAO,CAAC,mBAAmB,EAAE,kBAAkB,CAAC;iBAChD,OAAO,CAAC,sBAAsB,EAAE,qBAAqB,CAAC,CAAC;QAC1D,CAAC;QAED,kBAAkB;QAClB,IAAI,OAAO,CAAC,QAAQ,CAAC,mBAAmB,CAAC,EAAE,CAAC;YAC3C,OAAO,GAAG,OAAO;iBACf,OAAO,CAAC,oBAAoB,EAAE,mBAAmB,CAAC;iBAClD,OAAO,CAAC,uBAAuB,EAAE,sBAAsB,CAAC,CAAC;QAC5D,CAAC;QAED,UAAU;QACV,IAAI,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC;YACrC,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC;QAC1D,CAAC;QAED,gBAAgB;QAChB,IAAI,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,CAAC;YACzC,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,kBAAkB,EAAE,iBAAiB,CAAC,CAAC;QAClE,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IAC3B,CAAC,CAAC,CAAC;AACJ,CAAC;AAED,kBAAe,sBAAsB,CAAC"}

package/src/generators/migrate-dialog/schema.d.ts

@@ -0,0 +1,4 @@
+export interface MigrateDialogGeneratorSchema {
+	skipFormat?: boolean;
+	importAlias: string;
+}

package/src/generators/migrate-dialog/schema.json

@@ -0,0 +1,19 @@
+{
+	"$schema": "http://json-schema.org/draft-07/schema",
+	"$id": "MigrateDialog",
+	"title": "",
+	"type": "object",
+	"properties": {
+		"skipFormat": {
+			"type": "boolean",
+			"default": false,
+			"description": "Skip formatting files"
+		},
+		"importAlias": {
+			"type": "string",
+			"default": "@spartan-ui/helm",
+			"description": "The prefix to use for helm imports"
+		}
+	},
+	"required": []
+}

package/src/generators/ui/libs/alert-dialog/files/index.ts.template

@@ -1,31 +1,34 @@
 import { HlmAlertDialog } from './lib/hlm-alert-dialog';
-import { HlmAlertDialogActionButton } from './lib/hlm-alert-dialog-action-button';
-import { HlmAlertDialogCancelButton } from './lib/hlm-alert-dialog-cancel-button';
+import { HlmAlertDialogAction } from './lib/hlm-alert-dialog-action';
+import { HlmAlertDialogCancel } from './lib/hlm-alert-dialog-cancel';
 import { HlmAlertDialogContent } from './lib/hlm-alert-dialog-content';
 import { HlmAlertDialogDescription } from './lib/hlm-alert-dialog-description';
 import { HlmAlertDialogFooter } from './lib/hlm-alert-dialog-footer';
 import { HlmAlertDialogHeader } from './lib/hlm-alert-dialog-header';
 import { HlmAlertDialogOverlay } from './lib/hlm-alert-dialog-overlay';
 import { HlmAlertDialogTitle } from './lib/hlm-alert-dialog-title';
+import { HlmAlertDialogTrigger } from './lib/hlm-alert-dialog-trigger';
 
 export * from './lib/hlm-alert-dialog';
-export * from './lib/hlm-alert-dialog-action-button';
-export * from './lib/hlm-alert-dialog-cancel-button';
+export * from './lib/hlm-alert-dialog-action';
+export * from './lib/hlm-alert-dialog-cancel';
 export * from './lib/hlm-alert-dialog-content';
 export * from './lib/hlm-alert-dialog-description';
 export * from './lib/hlm-alert-dialog-footer';
 export * from './lib/hlm-alert-dialog-header';
 export * from './lib/hlm-alert-dialog-overlay';
 export * from './lib/hlm-alert-dialog-title';
+export * from './lib/hlm-alert-dialog-trigger';
 
 export const HlmAlertDialogImports = [
+	HlmAlertDialog,
 	HlmAlertDialogContent,
 	HlmAlertDialogDescription,
 	HlmAlertDialogFooter,
 	HlmAlertDialogHeader,
 	HlmAlertDialogOverlay,
 	HlmAlertDialogTitle,
-	HlmAlertDialogActionButton,
-	HlmAlertDialogCancelButton,
-	HlmAlertDialog,
+	HlmAlertDialogAction,
+	HlmAlertDialogCancel,
+	HlmAlertDialogTrigger,
 ] as const;

package/src/generators/ui/libs/alert-dialog/files/lib/hlm-alert-dialog-action.ts.template

@@ -0,0 +1,13 @@
+import { Directive, input } from '@angular/core';
+import { HlmButton } from '<%- importAlias %>/button';
+
+@Directive({
+	selector: 'button[hlmAlertDialogAction]',
+	hostDirectives: [{ directive: HlmButton, inputs: ['variant', 'size'] }],
+	host: {
+		'[type]': 'type()',
+	},
+})
+export class HlmAlertDialogAction {
+	public readonly type = input<'button' | 'submit' | 'reset'>('button');
+}

package/src/generators/ui/libs/alert-dialog/files/lib/{hlm-alert-dialog-cancel-button.ts.template → hlm-alert-dialog-cancel.ts.template}

@@ -1,9 +1,14 @@
-import { Directive } from '@angular/core';
+import { Directive, input } from '@angular/core';
 import { HlmButton, provideBrnButtonConfig } from '<%- importAlias %>/button';
 
 @Directive({
 	selector: 'button[hlmAlertDialogCancel]',
 	providers: [provideBrnButtonConfig({ variant: 'outline' })],
 	hostDirectives: [{ directive: HlmButton, inputs: ['variant', 'size'] }],
+	host: {
+		'[type]': 'type()',
+	},
 })
-export class HlmAlertDialogCancelButton {}
+export class HlmAlertDialogCancel {
+	public readonly type = input<'button' | 'submit' | 'reset'>('button');
+}

package/src/generators/ui/libs/alert-dialog/files/lib/hlm-alert-dialog-content.ts.template

@@ -1,18 +1,15 @@
-import { ChangeDetectionStrategy, Component, computed, input, signal } from '@angular/core';
+import { computed, Directive, input, signal } from '@angular/core';
 import { injectExposesStateProvider } from '@spartan-ng/brain/core';
 import { hlm } from '<%- importAlias %>/utils';
 import type { ClassValue } from 'clsx';
 
-@Component({
-	selector: 'hlm-alert-dialog-content',
-	changeDetection: ChangeDetectionStrategy.OnPush,
+@Directive({
+	selector: '[hlmAlertDialogContent],hlm-alert-dialog-content',
 	host: {
+		'data-slot': 'alert-dialog-content',
 		'[class]': '_computedClass()',
 		'[attr.data-state]': 'state()',
 	},
-	template: `
-		<ng-content />
-	`,
 })
 export class HlmAlertDialogContent {
 	private readonly _stateProvider = injectExposesStateProvider({ optional: true, host: true });

package/src/generators/ui/libs/alert-dialog/files/lib/hlm-alert-dialog-description.ts.template

@@ -7,6 +7,7 @@ import type { ClassValue } from 'clsx';
 	selector: '[hlmAlertDialogDescription]',
 	hostDirectives: [BrnAlertDialogDescription],
 	host: {
+		'data-slot': 'alert-dialog-description',
 		'[class]': '_computedClass()',
 	},
 })

package/src/generators/ui/libs/alert-dialog/files/lib/hlm-alert-dialog-footer.ts.template

@@ -1,16 +1,13 @@
-import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { computed, Directive, input } from '@angular/core';
 import { hlm } from '<%- importAlias %>/utils';
 import type { ClassValue } from 'clsx';
 
-@Component({
-	selector: 'hlm-alert-dialog-footer',
-	changeDetection: ChangeDetectionStrategy.OnPush,
+@Directive({
+	selector: '[hlmAlertDialogFooter],hlm-alert-dialog-footer',
 	host: {
+		'data-slot': 'alert-dialog-footer',
 		'[class]': '_computedClass()',
 	},
-	template: `
-		<ng-content />
-	`,
 })
 export class HlmAlertDialogFooter {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });

package/src/generators/ui/libs/alert-dialog/files/lib/hlm-alert-dialog-header.ts.template

@@ -1,16 +1,13 @@
-import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { computed, Directive, input } from '@angular/core';
 import { hlm } from '<%- importAlias %>/utils';
 import type { ClassValue } from 'clsx';
 
-@Component({
-	selector: 'hlm-alert-dialog-header',
-	changeDetection: ChangeDetectionStrategy.OnPush,
+@Directive({
+	selector: '[hlmAlertDialogHeader],hlm-alert-dialog-header',
 	host: {
+		'data-slot': 'alert-dialog-header',
 		'[class]': '_computedClass()',
 	},
-	template: `
-		<ng-content />
-	`,
 })
 export class HlmAlertDialogHeader {
 	public readonly userClass = input<ClassValue>('', { alias: 'class' });

package/src/generators/ui/libs/alert-dialog/files/lib/hlm-alert-dialog-overlay.ts.template

@@ -1,10 +1,12 @@
 import { Directive, computed, effect, input, untracked } from '@angular/core';
+import { BrnAlertDialogOverlay } from '@spartan-ng/brain/alert-dialog';
 import { injectCustomClassSettable } from '@spartan-ng/brain/core';
 import { hlm } from '<%- importAlias %>/utils';
 import type { ClassValue } from 'clsx';
 
 @Directive({
-	selector: '[hlmAlertDialogOverlay],brn-alert-dialog-overlay[hlm]',
+	selector: '[hlmAlertDialogOverlay],hlm-alert-dialog-overlay',
+	hostDirectives: [BrnAlertDialogOverlay],
 })
 export class HlmAlertDialogOverlay {
 	private readonly _classSettable = injectCustomClassSettable({ optional: true, host: true });

package/src/generators/ui/libs/alert-dialog/files/lib/hlm-alert-dialog-title.ts.template

@@ -7,6 +7,7 @@ import type { ClassValue } from 'clsx';
 	selector: '[hlmAlertDialogTitle]',
 	hostDirectives: [BrnAlertDialogTitle],
 	host: {
+		'data-slot': 'alert-dialog-title',
 		'[class]': '_computedClass()',
 	},
 })

package/src/generators/ui/libs/alert-dialog/files/lib/hlm-alert-dialog-trigger.ts.template

@@ -0,0 +1,13 @@
+import { Directive } from '@angular/core';
+import { BrnAlertDialogTrigger } from '@spartan-ng/brain/alert-dialog';
+
+@Directive({
+	selector: 'button[hlmAlertDialogTrigger],button[hlmAlertDialogTriggerFor]',
+	hostDirectives: [
+		{ directive: BrnAlertDialogTrigger, inputs: ['id', 'brnAlertDialogTriggerFor: hlmAlertDialogTriggerFor', 'type'] },
+	],
+	host: {
+		'data-slot': 'alert-dialog-trigger',
+	},
+})
+export class HlmAlertDialogTrigger {}

package/src/generators/ui/libs/alert-dialog/files/lib/hlm-alert-dialog.ts.template

@@ -1,16 +1,12 @@
 import { ChangeDetectionStrategy, Component, forwardRef } from '@angular/core';
-import {
-	BRN_ALERT_DIALOG_DEFAULT_OPTIONS,
-	BrnAlertDialog,
-	BrnAlertDialogOverlay,
-} from '@spartan-ng/brain/alert-dialog';
+import { BRN_ALERT_DIALOG_DEFAULT_OPTIONS, BrnAlertDialog } from '@spartan-ng/brain/alert-dialog';
 import { BrnDialog, provideBrnDialogDefaultOptions } from '@spartan-ng/brain/dialog';
 import { HlmAlertDialogOverlay } from './hlm-alert-dialog-overlay';
 
 @Component({
 	selector: 'hlm-alert-dialog',
 	exportAs: 'hlmAlertDialog',
-	imports: [BrnAlertDialogOverlay, HlmAlertDialogOverlay],
+	imports: [HlmAlertDialogOverlay],
 	providers: [
 		{
 			provide: BrnDialog,
@@ -22,7 +18,7 @@ import { HlmAlertDialogOverlay } from './hlm-alert-dialog-overlay';
 	],
 	changeDetection: ChangeDetectionStrategy.OnPush,
 	template: `
-		<brn-alert-dialog-overlay hlm />
+		<hlm-alert-dialog-overlay />
 		<ng-content />
 	`,
 })

package/src/generators/ui/libs/autocomplete/files/lib/hlm-autocomplete-group.ts.template

@@ -1,10 +1,10 @@
-import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { computed, Directive, input } from '@angular/core';
 import { BrnAutocompleteGroup } from '@spartan-ng/brain/autocomplete';
 import { hlm } from '<%- importAlias %>/utils';
+import type { ClassValue } from 'clsx';
 
-@Component({
-	selector: 'hlm-autocomplete-group',
-	changeDetection: ChangeDetectionStrategy.OnPush,
+@Directive({
+	selector: '[hlmAutocompleteGroup],hlm-autocomplete-group',
 	hostDirectives: [
 		{
 			directive: BrnAutocompleteGroup,
@@ -14,11 +14,10 @@ import { hlm } from '<%- importAlias %>/utils';
 	host: {
 		'[class]': '_computedClass()',
 	},
-	template: '<ng-content />',
 })
 export class HlmAutocompleteGroup {
 	/** The user defined class  */
-	public readonly userClass = input<string>('', { alias: 'class' });
+	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
 	/** The styles to apply  */
 	protected readonly _computedClass = computed(() =>

package/src/generators/ui/libs/autocomplete/files/lib/hlm-autocomplete-item.ts.template

@@ -1,10 +1,10 @@
-import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { computed, Directive, input } from '@angular/core';
 import { BrnAutocompleteItem } from '@spartan-ng/brain/autocomplete';
 import { hlm } from '<%- importAlias %>/utils';
+import type { ClassValue } from 'clsx';
 
-@Component({
-	selector: 'button[hlm-autocomplete-item]',
-	changeDetection: ChangeDetectionStrategy.OnPush,
+@Directive({
+	selector: 'button[hlmAutocompleteItem],button[hlm-autocomplete-item]',
 	hostDirectives: [
 		{
 			directive: BrnAutocompleteItem,
@@ -15,13 +15,10 @@ import { hlm } from '<%- importAlias %>/utils';
 	host: {
 		'[class]': '_computedClass()',
 	},
-	template: `
-		<ng-content />
-	`,
 })
 export class HlmAutocompleteItem {
 	/** The user defined class  */
-	public readonly userClass = input<string>('', { alias: 'class' });
+	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
 	/** The styles to apply  */
 	protected readonly _computedClass = computed(() =>

package/src/generators/ui/libs/autocomplete/files/lib/hlm-autocomplete-list.ts.template

@@ -1,10 +1,10 @@
-import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { computed, Directive, input } from '@angular/core';
 import { BrnAutocompleteList } from '@spartan-ng/brain/autocomplete';
 import { hlm } from '<%- importAlias %>/utils';
+import type { ClassValue } from 'clsx';
 
-@Component({
-	selector: 'hlm-autocomplete-list',
-	changeDetection: ChangeDetectionStrategy.OnPush,
+@Directive({
+	selector: '[hlmAutocompleteList],hlm-autocomplete-list',
 	hostDirectives: [
 		{
 			directive: BrnAutocompleteList,
@@ -14,11 +14,10 @@ import { hlm } from '<%- importAlias %>/utils';
 	host: {
 		'[class]': '_computedClass()',
 	},
-	template: '<ng-content />',
 })
 export class HlmAutocompleteList {
 	/** The user defined class  */
-	public readonly userClass = input<string>('', { alias: 'class' });
+	public readonly userClass = input<ClassValue>('', { alias: 'class' });
 
 	/** The styles to apply  */
 	protected readonly _computedClass = computed(() =>

package/src/generators/ui/libs/autocomplete/files/lib/hlm-autocomplete.ts.template

@@ -19,7 +19,7 @@ import {
 import { type ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { provideIcons } from '@ng-icons/core';
 import { lucideChevronDown, lucideCircleX, lucideSearch } from '@ng-icons/lucide';
-import { BrnAutocomplete, BrnAutocompleteEmpty, BrnAutocompleteImports } from '@spartan-ng/brain/autocomplete';
+import { BrnAutocomplete, BrnAutocompleteImports } from '@spartan-ng/brain/autocomplete';
 import { debouncedSignal } from '@spartan-ng/brain/core';
 import type { ChangeFn, TouchFn } from '@spartan-ng/brain/forms';
 import { BrnPopoverImports } from '@spartan-ng/brain/popover';
@@ -46,8 +46,7 @@ export const HLM_AUTOCOMPLETE_VALUE_ACCESSOR = {
 	selector: 'hlm-autocomplete',
 	imports: [
 		NgTemplateOutlet,
-		BrnAutocomplete,
-		BrnAutocompleteEmpty,
+		BrnAutocompleteImports,
 		HlmAutocompleteEmpty,
 		HlmAutocompleteGroup,
 		HlmAutocompleteItem,
@@ -57,7 +56,6 @@ export const HLM_AUTOCOMPLETE_VALUE_ACCESSOR = {
 		HlmPopoverImports,
 		HlmIconImports,
 		HlmInputGroupImports,
-		BrnAutocompleteImports,
 	],
 	providers: [HLM_AUTOCOMPLETE_VALUE_ACCESSOR, provideIcons({ lucideSearch, lucideChevronDown, lucideCircleX })],
 	changeDetection: ChangeDetectionStrategy.OnPush,
@@ -66,14 +64,14 @@ export const HLM_AUTOCOMPLETE_VALUE_ACCESSOR = {
 	},
 	template: `
 		@let transformer = transformOptionToValue();
-		<brn-popover
+		<hlm-popover
 			#popover
 			align="start"
 			autoFocus="first-heading"
 			sideOffset="5"
 			closeDelay="100"
+			closeOnOutsidePointerEvents="true"
 			(closed)="_closed()"
-			[closeOnOutsidePointerEvents]="true"
 		>
 			<div brnAutocomplete (selectionCleared)="_selectionCleared()">
 				<div
@@ -164,7 +162,7 @@ export const HLM_AUTOCOMPLETE_VALUE_ACCESSOR = {
 					</div>
 				</div>
 			</div>
-		</brn-popover>
+		</hlm-popover>
 	`,
 })
 export class HlmAutocomplete<T, V = T> implements ControlValueAccessor {
@@ -255,19 +253,19 @@ export class HlmAutocomplete<T, V = T> implements ControlValueAccessor {
 	});
 
 	/** Placeholder text for the input field. */
-	public readonly searchPlaceholderText = input('Select an option');
+	public readonly searchPlaceholderText = input<string>('Select an option');
 
 	/** Text to display when loading options. */
-	public readonly loadingText = input('Loading options...');
+	public readonly loadingText = input<string>('Loading options...');
 
 	/** Text to display when no options are found. */
-	public readonly emptyText = input('No options found');
+	public readonly emptyText = input<string>('No options found');
 
 	/** Aria label for the toggle button. */
-	public readonly ariaLabelToggleButton = input('Toggle options');
+	public readonly ariaLabelToggleButton = input<string>('Toggle options');
 
 	/** The id of the input field. */
-	public readonly inputId = input(`hlm-autocomplete-input-${++HlmAutocomplete._id}`);
+	public readonly inputId = input<string>(`hlm-autocomplete-input-${++HlmAutocomplete._id}`);
 
 	/** Whether the autocomplete is disabled. */
 	public readonly disabled = input<boolean, BooleanInput>(false, { transform: booleanAttribute });

package/src/generators/ui/libs/carousel/files/lib/hlm-carousel-content.ts.template

@@ -1,17 +1,14 @@
-import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';
+import { computed, Directive, inject, input } from '@angular/core';
 import { hlm } from '<%- importAlias %>/utils';
 import type { ClassValue } from 'clsx';
 import { HlmCarousel } from './hlm-carousel';
 
-@Component({
-	selector: 'hlm-carousel-content',
-	changeDetection: ChangeDetectionStrategy.OnPush,
+@Directive({
+	selector: '[hlmCarouselContent],hlm-carousel-content',
 	host: {
+		'data-slot': 'carousel-content',
 		'[class]': '_computedClass()',
 	},
-	template: `
-		<ng-content />
-	`,
 })
 export class HlmCarouselContent {
 	private readonly _orientation = inject(HlmCarousel).orientation;

package/src/generators/ui/libs/carousel/files/lib/hlm-carousel-item.ts.template

@@ -1,19 +1,16 @@
-import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';
+import { computed, Directive, inject, input } from '@angular/core';
 import { hlm } from '<%- importAlias %>/utils';
 import type { ClassValue } from 'clsx';
 import { HlmCarousel } from './hlm-carousel';
 
-@Component({
-	selector: 'hlm-carousel-item',
-	changeDetection: ChangeDetectionStrategy.OnPush,
+@Directive({
+	selector: '[hlmCarouselItem],hlm-carousel-item',
 	host: {
+		'data-slot': 'carousel-item',
 		'[class]': '_computedClass()',
 		role: 'group',
 		'aria-roledescription': 'slide',
 	},
-	template: `
-		<ng-content />
-	`,
 })
 export class HlmCarouselItem {
 	private readonly _orientation = inject(HlmCarousel).orientation;

package/src/generators/ui/libs/carousel/files/lib/hlm-carousel-next.ts.template

@@ -14,6 +14,7 @@ import { HlmCarousel } from './hlm-carousel';
 	changeDetection: ChangeDetectionStrategy.OnPush,
 	hostDirectives: [{ directive: HlmButton, inputs: ['variant', 'size'] }],
 	host: {
+		'data-slot': 'carousel-next',
 		'[disabled]': 'isDisabled()',
 		'(click)': '_carousel.scrollNext()',
 	},