@lucca-front/ng 21.0.0 → 21.0.1

package/fesm2022/lucca-front-ng-loading.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lucca-front-ng-loading.mjs","sources":["../../../packages/ng/loading/loading.component.ts","../../../packages/ng/loading/lucca-front-ng-loading.ts"],"sourcesContent":["import { booleanAttribute, ChangeDetectionStrategy, Component, effect, inject, input, ViewEncapsulation } from '@angular/core';\nimport { LuClass } from '@lucca-front/ng/core';\n\n@Component({\n\tselector: 'lu-loading',\n\tproviders: [LuClass],\n\tstyleUrl: './loading.component.scss',\n\ttemplate: '<ng-content />',\n\tencapsulation: ViewEncapsulation.None,\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\thost: {\n\t\tclass: 'loading',\n\t\t'[class.mod-block]': 'block()',\n\t\t'[class.mod-invert]': 'invert()',\n\t\t'[class.mod-L]': 'size() === \"L\"',\n\t},\n})\nexport class LoadingComponent {\n\t#luClass = inject(LuClass);\n\n\treadonly size = input<'L' | null>(null);\n\treadonly invert = input(false, { transform: booleanAttribute });\n\treadonly block = input(false, { transform: booleanAttribute });\n\treadonly template = input<'popin' | 'drawer' | 'fullpage' | null>(null);\n\n\tconstructor() {\n\t\teffect(() => {\n\t\t\tthis.#luClass.setState({\n\t\t\t\t[`mod-${this.template()}`]: !!this.template(),\n\t\t\t});\n\t\t});\n\t}\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"lucca-front-ng-loading.mjs","sources":["../../../packages/ng/loading/loading.component.ts","../../../packages/ng/loading/lucca-front-ng-loading.ts"],"sourcesContent":["import { booleanAttribute, ChangeDetectionStrategy, Component, effect, inject, input, ViewEncapsulation } from '@angular/core';\nimport { LuClass } from '@lucca-front/ng/core';\n\ntype DisplayMode =\n\t| 'popin'\n\t| 'drawer'\n\t| 'fullPage'\n\t/** @deprecated use 'fullPage' instead */\n\t| 'fullpage';\n\n@Component({\n\tselector: 'lu-loading',\n\tproviders: [LuClass],\n\tstyleUrl: './loading.component.scss',\n\ttemplate: '<ng-content />',\n\tencapsulation: ViewEncapsulation.None,\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\thost: {\n\t\tclass: 'loading',\n\t\t'[class.mod-block]': 'block()',\n\t\t'[class.mod-invert]': 'invert()',\n\t\t'[class.mod-L]': 'size() === \"L\"',\n\t},\n})\nexport class LoadingComponent {\n\t#luClass = inject(LuClass);\n\n\treadonly size = input<'L' | null>(null);\n\treadonly invert = input(false, { transform: booleanAttribute });\n\treadonly block = input(false, { transform: booleanAttribute });\n\treadonly template = input<DisplayMode | null>(null);\n\n\tconstructor() {\n\t\teffect(() => {\n\t\t\tthis.#luClass.setState({\n\t\t\t\t[`mod-${this.template()}`]: !!this.template(),\n\t\t\t});\n\t\t});\n\t}\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lucca-front/ng",
-  "version": "21.0.0",
+  "version": "21.0.1",
   "description": "A library of icons made by the team @Lucca",
   "repository": {
     "type": "git",
@@ -27,8 +27,8 @@
     "@angular/core": "^20.0.0 || ^21.0.0",
     "@angular/cdk": "^20.0.0 || ^21.0.0",
     "@angular/animations": "^20.0.0 || ^21.0.0",
-    "@lucca-front/icons": "21.0.0",
-    "@lucca-front/scss": "21.0.0",
+    "@lucca-front/icons": "21.0.1",
+    "@lucca-front/scss": "21.0.1",
     "isomorphic-dompurify": "^2.17.0",
     "date-fns": "^3.6.0",
     "ngx-mask": "^20.0.3",
@@ -406,10 +406,6 @@
       "types": "./types/lucca-front-ng-scroll-box.d.ts",
       "default": "./fesm2022/lucca-front-ng-scroll-box.mjs"
     },
-    "./scrollBox": {
-      "types": "./types/lucca-front-ng-scrollBox.d.ts",
-      "default": "./fesm2022/lucca-front-ng-scrollBox.mjs"
-    },
     "./segmented-control": {
       "types": "./types/lucca-front-ng-segmented-control.d.ts",
       "default": "./fesm2022/lucca-front-ng-segmented-control.mjs"
@@ -418,14 +414,6 @@
       "types": "./types/lucca-front-ng-segmented-control-tabs.d.ts",
       "default": "./fesm2022/lucca-front-ng-segmented-control-tabs.mjs"
     },
-    "./segmentedControl": {
-      "types": "./types/lucca-front-ng-segmentedControl.d.ts",
-      "default": "./fesm2022/lucca-front-ng-segmentedControl.mjs"
-    },
-    "./segmentedControlTabs": {
-      "types": "./types/lucca-front-ng-segmentedControlTabs.d.ts",
-      "default": "./fesm2022/lucca-front-ng-segmentedControlTabs.mjs"
-    },
     "./select": {
       "types": "./types/lucca-front-ng-select.d.ts",
       "default": "./fesm2022/lucca-front-ng-select.mjs"
@@ -454,10 +442,6 @@
       "types": "./types/lucca-front-ng-status-badge.d.ts",
       "default": "./fesm2022/lucca-front-ng-status-badge.mjs"
     },
-    "./statusBadge": {
-      "types": "./types/lucca-front-ng-statusBadge.d.ts",
-      "default": "./fesm2022/lucca-front-ng-statusBadge.mjs"
-    },
     "./table-of-content": {
       "types": "./types/lucca-front-ng-table-of-content.d.ts",
       "default": "./fesm2022/lucca-front-ng-table-of-content.mjs"

package/schematics/alignment-utilities/index.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const css_mapper_1 = require("../lib/css-mapper");
+const lf_schematic_context_1 = require("../lib/lf-schematic-context");
+// Nx need to see "@angular-devkit/schematics" in order to run this migration correctly (see https://github.com/nrwl/nx/blob/d9fed4b832bf01d1b9a44ae9e486a5e5cd2d2253/packages/nx/src/command-line/migrate/migrate.ts#L1729-L1738)
+// eslint-disable-next-line @typescript-eslint/no-require-imports
+require('@angular-devkit/schematics');
+exports.default = (options) => {
+    return async (tree, context) => {
+        await lf_schematic_context_1.currentSchematicContext.init(context, options);
+        await new css_mapper_1.CssMapper(tree, {
+            classes: {
+                'u-textLeft': 'pr-u-textAlignStart',
+                'u-textCenter': 'pr-u-textAlignCenter',
+                'u-textRight': 'pr-u-textAlignEnd'
+            },
+            variables: {},
+            mixins: {}
+        }, {}).run();
+    };
+};

package/schematics/alignment-utilities/migration.spec.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const fs = require("fs");
+const glob = require("glob");
+const path = require("path");
+const migration_test_js_1 = require("../lib/migration-test.js");
+const collectionPath = path.normalize(path.join(__dirname, '..', 'collection.json'));
+const testsRoot = path.join(__dirname, 'tests');
+const files = fs.readdirSync(testsRoot);
+describe('Alignment utilities Migration', () => {
+    it('should update files', async () => {
+        // Arrange
+        const tree = (0, migration_test_js_1.createTreeFromFiles)(testsRoot, files, '.input.');
+        const expectedTree = (0, migration_test_js_1.createTreeFromFiles)(testsRoot, files, '.output.');
+        // Act
+        try {
+            await (0, migration_test_js_1.runSchematic)('collection', collectionPath, 'alignment-utilities', { skipInstallation: true }, tree);
+        }
+        catch (error) {
+            // eslint-disable-next-line no-console
+            console.log(error);
+        }
+        // Assert
+        (0, migration_test_js_1.expectTree)(tree).toMatchTree(expectedTree);
+    });
+    // Use this to migrate @lucca-front/* packages
+    it.skip('should migrate @lucca-front/*', async () => {
+        // Arrange
+        const lfRoot = path.normalize(path.join(__dirname, '..', '..', '..', '..'));
+        const lfFiles = [
+            ...glob.sync('packages/icons/**/*.scss', { cwd: lfRoot, nodir: true }),
+            ...glob.sync('packages/scss/**/*.scss', { cwd: lfRoot, nodir: true }),
+            ...glob.sync('packages/ng/**/*', { cwd: lfRoot, nodir: true, ignore: ['**/schematics/**'] }),
+            ...glob.sync('stories/**', { cwd: lfRoot, nodir: true }),
+        ];
+        const treeOriginalTree = (0, migration_test_js_1.createTreeFromFiles)(lfRoot, lfFiles, '.');
+        const tree = (0, migration_test_js_1.createTreeFromFiles)(lfRoot, lfFiles, '.');
+        // Act
+        await (0, migration_test_js_1.runSchematic)('collection', collectionPath, 'alignment-utilities', { skipInstallation: true }, tree);
+        // Assert
+        tree.visit((p, entry) => {
+            const original = treeOriginalTree.get(p)?.content.toString() || '';
+            const updated = entry?.content.toString() || '';
+            if (original !== updated) {
+                const fromRootPath = path.join(lfRoot, p);
+                fs.writeFileSync(fromRootPath, updated);
+            }
+        });
+    });
+});

package/schematics/alignment-utilities/schema.json

@@ -0,0 +1,23 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema",
+  "$id": "LuccaFrontAlignmentUtilities",
+  "title": "Lucca Front Alignment Utilities Schema",
+  "type": "object",
+  "properties": {
+    "dryRun": {
+      "type": "boolean",
+      "description": "Run through the migration without making any changes.",
+      "default": false
+    },
+    "skipInstall": {
+      "type": "boolean",
+      "description": "Skip installing dependencies.",
+      "default": false
+    },
+    "verbose": {
+      "type": "boolean",
+      "description": "Enable verbose logging.",
+      "default": false
+    }
+  }
+}

package/schematics/collection.json

@@ -36,6 +36,11 @@
       "factory": "./class-prefix/index",
       "schema": "./class-prefix/schema.json"
     },
+    "component-path": {
+      "description": "Update path component import",
+      "factory": "./component-path/index",
+      "schema": "./component-path/schema.json"
+    },
     "tokens-typo": {
       "description": "Replace typography tokens with new names.",
       "factory": "./tokens-typo/index",
@@ -51,6 +56,11 @@
       "factory": "./palettes/index",
       "schema": "./palettes/schema.json"
     },
+    "alignment-utilities": {
+      "description": "Replace alignment utilities tokens.",
+      "factory": "./alignment-utilities/index",
+      "schema": "./alignment-utilities/schema.json"
+    },
     "action-icon": {
       "description": "Replace actionIcon usages with button mod-onlyIcon",
       "factory": "./action-icon/index",

package/schematics/component-path/index.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const component_mapper_1 = require("../lib/component-mapper");
+const lf_schematic_context_1 = require("../lib/lf-schematic-context");
+// Nx need to see "@angular-devkit/schematics" in order to run this migration correctly (see https://github.com/nrwl/nx/blob/d9fed4b832bf01d1b9a44ae9e486a5e5cd2d2253/packages/nx/src/command-line/migrate/migrate.ts#L1729-L1738)
+// eslint-disable-next-line @typescript-eslint/no-require-imports
+require('@angular-devkit/schematics');
+exports.default = (options) => {
+    return async (tree, context) => {
+        await lf_schematic_context_1.currentSchematicContext.init(context, options);
+        new component_mapper_1.ComponentMapper(tree, {
+            paths: {
+                "@lucca-front/ng/scrollBox": "@lucca-front/ng/scroll-box",
+                "@lucca-front/ng/segmentedControl": "@lucca-front/ng/segmented-control",
+                "@lucca-front/ng/segmentedControlTabs": "@lucca-front/ng/segmented-control-tabs",
+                "@lucca-front/ng/statusBadge": "@lucca-front/ng/status-badge"
+            },
+            components: {},
+            selectors: {}
+        }).run();
+    };
+};

package/schematics/component-path/migration.spec.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const fs = require("fs");
+const glob = require("glob");
+const path = require("path");
+const migration_test_js_1 = require("../lib/migration-test.js");
+const collectionPath = path.normalize(path.join(__dirname, '..', 'collection.json'));
+const testsRoot = path.join(__dirname, 'tests');
+const files = fs.readdirSync(testsRoot);
+describe('Component path Migration', () => {
+    it('should update files', async () => {
+        // Arrange
+        const tree = (0, migration_test_js_1.createTreeFromFiles)(testsRoot, files, '.input.');
+        const expectedTree = (0, migration_test_js_1.createTreeFromFiles)(testsRoot, files, '.output.');
+        // Act
+        try {
+            await (0, migration_test_js_1.runSchematic)('collection', collectionPath, 'component-path', { skipInstallation: true }, tree);
+        }
+        catch (error) {
+            //eslint-disable-next-line no-console
+            console.log(error);
+        }
+        // Assert
+        (0, migration_test_js_1.expectTree)(tree).toMatchTree(expectedTree);
+    });
+    // Use this to migrate @lucca-front/* packages
+    it.skip('should migrate @lucca-front/*', async () => {
+        // Arrange
+        const lfRoot = path.normalize(path.join(__dirname, '..', '..', '..', '..'));
+        const lfFiles = [
+            ...glob.sync('packages/icons/**/*.scss', { cwd: lfRoot, nodir: true }),
+            ...glob.sync('packages/scss/**/*.scss', { cwd: lfRoot, nodir: true }),
+            ...glob.sync('packages/ng/**/*', { cwd: lfRoot, nodir: true, ignore: ['**/schematics/**'] }),
+            ...glob.sync('stories/**', { cwd: lfRoot, nodir: true }),
+        ];
+        const treeOriginalTree = (0, migration_test_js_1.createTreeFromFiles)(lfRoot, lfFiles, '.');
+        const tree = (0, migration_test_js_1.createTreeFromFiles)(lfRoot, lfFiles, '.');
+        // Act
+        await (0, migration_test_js_1.runSchematic)('collection', collectionPath, 'component-path', { skipInstallation: true }, tree);
+        // Assert
+        tree.visit((p, entry) => {
+            const original = treeOriginalTree.get(p)?.content.toString() || '';
+            const updated = entry?.content.toString() || '';
+            if (original !== updated) {
+                const fromRootPath = path.join(lfRoot, p);
+                fs.writeFileSync(fromRootPath, updated);
+            }
+        });
+    });
+});

package/schematics/component-path/schema.json

@@ -0,0 +1,23 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema",
+  "$id": "LuccaFrontComponentPath",
+  "title": "Lucca Front Component Path Schema",
+  "type": "object",
+  "properties": {
+    "dryRun": {
+      "type": "boolean",
+      "description": "Run through the migration without making any changes.",
+      "default": false
+    },
+    "skipInstall": {
+      "type": "boolean",
+      "description": "Skip installing dependencies.",
+      "default": false
+    },
+    "verbose": {
+      "type": "boolean",
+      "description": "Enable verbose logging.",
+      "default": false
+    }
+  }
+}

package/schematics/lib/component-mapper.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ComponentMapper = void 0;
+const typescript_1 = require("typescript");
+const angular_template_1 = require("./angular-template");
+const file_update_1 = require("./file-update");
+const schematic_utils_1 = require("./schematic.utils");
+const schematics_1 = require("./schematics");
+class ComponentMapper {
+    constructor(tree, rawMappings, mappingProps) {
+        this.tree = tree;
+        this.rawMappings = rawMappings;
+        this.mappingProps = mappingProps;
+        this.mappings = {
+            paths: (0, schematic_utils_1.expand)(this.rawMappings.paths, this.mappingProps),
+            components: (0, schematic_utils_1.expand)(this.rawMappings.components, this.mappingProps),
+            selectors: (0, schematic_utils_1.expand)(this.rawMappings.selectors, this.mappingProps)
+        };
+        this.pathsToUpdate = new Set(Object.keys(this.mappings.paths));
+    }
+    run() {
+        this.tree.visit((path, entry) => {
+            if (path.includes('node_modules') || !entry) {
+                return;
+            }
+            if (path.endsWith('.ts')) {
+                (0, schematics_1.migrateFile)(path, entry, this.tree, (content) => this.migrateTsFile(path, content));
+            }
+            else {
+                return;
+            }
+        });
+    }
+    migrateTsFile(fileName, content) {
+        const sourcefile = (0, typescript_1.createSourceFile)(fileName, content, typescript_1.ScriptTarget.ESNext);
+        const updates = [];
+        (0, typescript_1.forEachChild)(sourcefile, (0, angular_template_1.createVisitor)(typescript_1.isStringLiteral, (node) => {
+            const newText = this.updatePathText(node.text);
+            if (newText !== null && newText !== node.text) {
+                const position = node.pos + node.getLeadingTriviaWidth(sourcefile) /* Spaces before the single/double quote */ + 1; /* Single or double quote before the string content */
+                updates.push({
+                    position,
+                    oldContent: node.text,
+                    newContent: newText
+                });
+            }
+        }));
+        return (0, file_update_1.applyUpdates)(content, updates);
+    }
+    updatePathText(text) {
+        return this.pathsToUpdate.has(text) ? this.mappings.paths[text] || text : null;
+    }
+}
+exports.ComponentMapper = ComponentMapper;

package/schematics/lib/css-mapper.js

@@ -1,23 +1,24 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CssMapper = void 0;
-const schematics_1 = require("./schematics");
-const scss_ast_1 = require("./scss-ast");
-const html_ast_1 = require("./html-ast");
-const file_update_1 = require("./file-update");
 const typescript_1 = require("typescript");
-const typescript_ast_1 = require("./typescript-ast");
 const angular_template_1 = require("./angular-template");
+const file_update_1 = require("./file-update");
+const html_ast_1 = require("./html-ast");
 const lf_schematic_context_1 = require("./lf-schematic-context");
+const schematic_utils_1 = require("./schematic.utils");
+const schematics_1 = require("./schematics");
+const scss_ast_1 = require("./scss-ast");
+const typescript_ast_1 = require("./typescript-ast");
 class CssMapper {
     constructor(tree, rawMappings, mappingProps) {
         this.tree = tree;
         this.rawMappings = rawMappings;
         this.mappingProps = mappingProps;
         this.mappings = {
-            classes: this.expand(this.rawMappings.classes),
-            variables: this.expand(this.rawMappings.variables),
-            mixins: this.expand(this.rawMappings.mixins)
+            classes: (0, schematic_utils_1.expand)(this.rawMappings.classes, this.mappingProps),
+            variables: (0, schematic_utils_1.expand)(this.rawMappings.variables, this.mappingProps),
+            mixins: (0, schematic_utils_1.expand)(this.rawMappings.mixins, this.mappingProps)
         };
         this.classesToUpdate = new Set(Object.keys(this.mappings.classes));
         this.varsToUpdate = new Set(Object.keys(this.mappings.variables));
@@ -118,29 +119,5 @@ class CssMapper {
         }
         return text;
     }
-    camelize(str) {
-        return str[0].toLowerCase() + str.slice(1);
-    }
-    pascalize(str) {
-        return str[0].toUpperCase() + str.slice(1);
-    }
-    expand(rawMapping) {
-        const props = this.mappingProps || {};
-        const replaceValue = (oldValue, map, newValue) => {
-            return oldValue.replace(`{${map}}`, newValue).replace(`{${this.pascalize(map)}}`, this.pascalize(newValue));
-        };
-        return Object.fromEntries(Object.entries(rawMapping).flatMap(([oldTemplate, newTemplate]) => {
-            const placeholders = [...oldTemplate.matchAll(/\{(\w*)}/g)].map(([, template]) => template);
-            let values = [[oldTemplate, newTemplate]];
-            for (const placeholder of placeholders) {
-                const map = this.camelize(placeholder);
-                if (!map || !(map in props)) {
-                    throw new Error(`No mapping for ${map} found`);
-                }
-                values = values.flatMap(([oldVal, newVal]) => Object.entries(props[map]).map(([key, value]) => [replaceValue(oldVal, map, key), replaceValue(newVal, map, value)]));
-            }
-            return values;
-        }));
-    }
 }
 exports.CssMapper = CssMapper;

package/schematics/lib/html-ast.js

@@ -6,8 +6,8 @@ exports.extractAllCssClassNames = extractAllCssClassNames;
 exports.extractAllHtmlElementNames = extractAllHtmlElementNames;
 const typescript_1 = require("typescript");
 const file_update_js_1 = require("./file-update.js");
-const typescript_ast_js_1 = require("./typescript-ast.js");
 const lf_schematic_context_1 = require("./lf-schematic-context");
+const typescript_ast_js_1 = require("./typescript-ast.js");
 class HtmlAstVisitor {
     constructor(nodes) {
         this.nodes = Array.isArray(nodes) ? nodes : [nodes];

package/schematics/lib/schematic.utils.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.camelize = camelize;
+exports.pascalize = pascalize;
+exports.expand = expand;
+function camelize(str) {
+    return str[0].toLowerCase() + str.slice(1);
+}
+function pascalize(str) {
+    return str[0].toUpperCase() + str.slice(1);
+}
+function expand(rawMapping, mappingProps) {
+    const props = mappingProps || {};
+    const replaceValue = (oldValue, map, newValue) => {
+        return oldValue.replace(`{${map}}`, newValue).replace(`{${pascalize(map)}}`, pascalize(newValue));
+    };
+    return Object.fromEntries(Object.entries(rawMapping).flatMap(([oldTemplate, newTemplate]) => {
+        const placeholders = [...oldTemplate.matchAll(/\{(\w*)}/g)].map(([, template]) => template);
+        let values = [[oldTemplate, newTemplate]];
+        for (const placeholder of placeholders) {
+            const map = camelize(placeholder);
+            if (!map || !(map in props)) {
+                throw new Error(`No mapping for ${map} found`);
+            }
+            values = values.flatMap(([oldVal, newVal]) => Object.entries(props[map]).map(([key, value]) => [replaceValue(oldVal, map, key), replaceValue(newVal, map, value)]));
+        }
+        return values;
+    }));
+}

package/schematics/palettes/index.js

@@ -13,14 +13,16 @@ exports.default = (options) => {
                 'palette-grey': 'palette-neutral',
                 'palette-primary': 'palette-product',
                 'palette-secondary': 'palette-product',
-                'palette-lucca': 'palette-brand'
+                'palette-lucca': 'palette-brand',
             },
             variables: {
                 '--palettes-grey-{val}': `--palettes-neutral-{val}`,
                 '--palettes-primary-{val}': `--palettes-product-{val}`,
                 '--palettes-secondary-{val}': `--palettes-product-{val}`,
                 '--palettes-lucca-{val}': `--palettes-brand-{val}`,
-                '--colors-grey-{val}': `--colors-neutral-{val}`
+                '--colors-grey-{val}': `--palettes-neutral-{val}`,
+                '--colors-white-color': '—-palettes-neutral-0',
+                '--colors-black-color': '—-palettes-neutral-900'
             },
             mixins: {}
         }, {

package/types/lucca-front-ng-box.d.ts

@@ -4,8 +4,9 @@ declare class BoxComponent {
     readonly toggle: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly neutral: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly killable: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly withArrow: _angular_core.InputSignalWithTransform<boolean, unknown>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<BoxComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BoxComponent, "lu-box", never, { "toggle": { "alias": "toggle"; "required": false; "isSignal": true; }; "neutral": { "alias": "neutral"; "required": false; "isSignal": true; }; "killable": { "alias": "killable"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BoxComponent, "lu-box", never, { "toggle": { "alias": "toggle"; "required": false; "isSignal": true; }; "neutral": { "alias": "neutral"; "required": false; "isSignal": true; }; "killable": { "alias": "killable"; "required": false; "isSignal": true; }; "withArrow": { "alias": "withArrow"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 export { BoxComponent };

package/types/lucca-front-ng-forms-rich-text-input-formatters-markdown.d.ts

@@ -1,5 +1,5 @@
 import { Provider } from '@angular/core';
-import { Transformer } from '@lexical/markdown';
+import { Transformer, TextMatchTransformer } from '@lexical/markdown';
 import { RichTextFormatter } from '@lucca-front/ng/forms/rich-text-input';
 import { LexicalEditor } from 'lexical';
 
@@ -13,4 +13,13 @@ declare class MarkdownFormatter extends RichTextFormatter {
 }
 declare function provideLuRichTextMarkdownFormatter(transformers?: Transformer[]): Provider;
 
-export { DEFAULT_MARKDOWN_TRANSFORMERS, MarkdownFormatter, provideLuRichTextMarkdownFormatter };
+/**
+ * Transformer for tag nodes
+ * It will match the following pattern `{{Tag}}` and create a TagNode (using `replace` function).
+ * It will export the tag node to markdown (as `{{Tag}}`) using the `export` function.
+ *
+ * @docs https://github.com/facebook/lexical/tree/main/packages/lexical-markdown#transformers
+ */
+declare const TAGS: TextMatchTransformer;
+
+export { DEFAULT_MARKDOWN_TRANSFORMERS, MarkdownFormatter, TAGS, provideLuRichTextMarkdownFormatter };

package/types/lucca-front-ng-forms-rich-text-input-formatters-plain-text.d.ts

@@ -1,15 +1,27 @@
 import { Provider } from '@angular/core';
-import { Transformer } from '@lexical/markdown';
 import { RichTextFormatter } from '@lucca-front/ng/forms/rich-text-input';
-import { LexicalEditor } from 'lexical';
+import { TextNode, LexicalEditor } from 'lexical';
+
+interface PlainTextTransformer {
+    regExp: RegExp;
+    replace: (texNode: TextNode, match: RegExpMatchArray) => void;
+}
+
+/**
+ * Transformer for tag nodes
+ * It will match the following pattern `{{Tag}}` and create a TagNode (using `replace` function).
+ *
+ */
+declare const PLAINTEXT_TAGS: PlainTextTransformer;
 
 declare class PlainTextFormatter extends RichTextFormatter {
     #private;
-    constructor(transformers?: Transformer[]);
+    constructor(transformers?: PlainTextTransformer[]);
     registerTextPlugin(editor: LexicalEditor): () => void;
-    parse(editor: LexicalEditor, markdown?: string | null): void;
+    parse(editor: LexicalEditor, text?: string | null): void;
     format(editor: LexicalEditor): string;
 }
-declare function provideLuRichTextPlainTextFormatter(transformers?: Transformer[]): Provider;
+declare function provideLuRichTextPlainTextFormatter(transformers?: PlainTextTransformer[]): Provider;
 
-export { PlainTextFormatter, provideLuRichTextPlainTextFormatter };
+export { PLAINTEXT_TAGS, PlainTextFormatter, provideLuRichTextPlainTextFormatter };
+export type { PlainTextTransformer };

package/types/lucca-front-ng-forms-rich-text-input.d.ts

@@ -1,11 +1,10 @@
 import * as _angular_core from '@angular/core';
 import { InjectionToken, Signal, WritableSignal, OnInit, OnDestroy, ElementRef, ViewContainerRef, TemplateRef, AfterViewInit } from '@angular/core';
 import * as lexical from 'lexical';
-import { LexicalEditor, Klass, LexicalNode, LexicalNodeReplacement, CommandPayloadType, DOMExportOutput, TextFormatType } from 'lexical';
+import { LexicalEditor, Klass, LexicalNode, LexicalNodeReplacement, CommandPayloadType, DOMExportOutput, Spread, SerializedLexicalNode, DecoratorNode, NodeKey, EditorConfig, DOMConversionMap, LexicalUpdateJSON, TextFormatType } from 'lexical';
 import { ControlValueAccessor, FormControl } from '@angular/forms';
 import { LuSimpleSelectInputComponent } from '@lucca-front/ng/simple-select';
 import { LinkNode } from '@lexical/link';
-import { TextMatchTransformer } from '@lexical/markdown';
 import { LuccaIcon } from '@lucca-front/icons';
 
 type UnregisterFn = () => void;
@@ -184,14 +183,39 @@ declare class RichTextPluginTagComponent implements RichTextPluginComponent, OnD
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<RichTextPluginTagComponent, "lu-rich-text-plugin-tag", never, { "tags": { "alias": "tags"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-/**
- * Transformer for tag nodes
- * It will match the following pattern `{{Tag}}` and create a TagNode (using `replace` function).
- * It will export the tag node to markdown (as `{{Tag}}`) using the `export` function.
- *
- * @docs https://github.com/facebook/lexical/tree/main/packages/lexical-markdown#transformers
- */
-declare const TAGS: TextMatchTransformer;
+type SerializedTagNode = Spread<{
+    tagKey?: string;
+    tagDescription?: string;
+    disabled?: boolean;
+}, SerializedLexicalNode>;
+declare class TagNode extends DecoratorNode<string> {
+    #private;
+    static setViewContainerRef(vcr: ViewContainerRef): void;
+    constructor(tagKey?: string, tagDescription?: string, disabled?: boolean, key?: NodeKey);
+    isDisabled(): boolean;
+    setDisabled(disabled: boolean): this;
+    getTagKey(): string;
+    setTagKey(tagKey: string): this;
+    getTagDescription(): string;
+    setTagDescription(description: string): this;
+    static getType(): string;
+    static clone(node: TagNode): TagNode;
+    /**
+     * This method must be implemented but has no purpose outside of react
+     */
+    decorate(): string;
+    createDOM(_config: EditorConfig, editor: LexicalEditor): HTMLElement;
+    updateDOM(prevNode: TagNode, _dom: HTMLElement, _config: EditorConfig): boolean;
+    remove(preserveEmptyParent?: boolean): void;
+    exportDOM(): DOMExportOutput;
+    static importDOM(): DOMConversionMap;
+    static importJSON(serializedNode: SerializedTagNode): TagNode;
+    updateFromJSON(serializedNode: LexicalUpdateJSON<SerializedTagNode>): this;
+    exportJSON(): SerializedTagNode;
+    getTextContent(): string;
+}
+declare function $createTagNode(key?: string, description?: string): TagNode;
+declare function $isTagNode(node: LexicalNode | null | undefined): node is TagNode;
 
 declare class TextStyleComponent implements OnDestroy, RichTextPluginComponent {
     #private;
@@ -229,5 +253,5 @@ declare class RichTextInputToolbarComponent implements RichTextPluginComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<RichTextInputToolbarComponent, "lu-rich-text-input-toolbar", never, {}, {}, never, never, true, never>;
 }
 
-export { ClearFormatComponent, HeadingsComponent, INITIAL_UPDATE_TAG, LinkComponent, ListStyleToolbarComponent, RICH_TEXT_FORMATTER, RICH_TEXT_PLUGIN_COMPONENT, RichTextFormatter, RichTextInputComponent, RichTextInputToolbarComponent, RichTextPluginTagComponent, SKIP_DOM_SELECTION_TAG, TAGS, TextStyleComponent, TextStyleToolbarComponent };
-export type { RichTextPluginComponent, Tag };
+export { $createTagNode, $isTagNode, ClearFormatComponent, HeadingsComponent, INITIAL_UPDATE_TAG, LinkComponent, ListStyleToolbarComponent, RICH_TEXT_FORMATTER, RICH_TEXT_PLUGIN_COMPONENT, RichTextFormatter, RichTextInputComponent, RichTextInputToolbarComponent, RichTextPluginTagComponent, SKIP_DOM_SELECTION_TAG, TagNode, TextStyleComponent, TextStyleToolbarComponent };
+export type { RichTextPluginComponent, SerializedTagNode, Tag };

package/types/lucca-front-ng-loading.d.ts

@@ -1,11 +1,14 @@
 import * as _angular_core from '@angular/core';
 
+type DisplayMode = 'popin' | 'drawer' | 'fullPage'
+/** @deprecated use 'fullPage' instead */
+ | 'fullpage';
 declare class LoadingComponent {
     #private;
     readonly size: _angular_core.InputSignal<"L">;
     readonly invert: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly block: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    readonly template: _angular_core.InputSignal<"popin" | "drawer" | "fullpage">;
+    readonly template: _angular_core.InputSignal<DisplayMode>;
     constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoadingComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoadingComponent, "lu-loading", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "invert": { "alias": "invert"; "required": false; "isSignal": true; }; "block": { "alias": "block"; "required": false; "isSignal": true; }; "template": { "alias": "template"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;

package/fesm2022/lucca-front-ng-scrollBox.mjs

@@ -1,6 +0,0 @@
-export * from '@lucca-front/ng/scroll-box';
-
-/**
- * Generated bundle index. Do not edit.
- */
-//# sourceMappingURL=lucca-front-ng-scrollBox.mjs.map