@lucca-front/ng 19.1.6 → 19.2.0

package/schematics/new-icons/index.js

@@ -1,19 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const installer_js_1 = require("../lib/local-deps/installer.js");
 const schematics_js_1 = require("../lib/schematics.js");
 const migration_js_1 = require("./migration.js");
+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) => {
-    const skipInstallation = options?.skipInstallation ?? false;
     return async (tree, context) => {
-        if (!skipInstallation) {
-            (0, installer_js_1.installLocalDependencies)(context);
-        }
+        await lf_schematic_context_1.currentSchematicContext.init(context, options);
         const postCssScss = await Promise.resolve().then(() => require('../lib/local-deps/postcss-scss.js'));
-        const angularCompiler = await Promise.resolve().then(() => require('@angular/compiler'));
         const { postcssSelectorParser } = await Promise.resolve().then(() => require('../lib/local-deps/postcss-selector-parser.js'));
         tree.visit((path, entry) => {
             if (path.includes('node_modules') || !entry) {
@@ -23,10 +19,10 @@ exports.default = (options) => {
                 (0, schematics_js_1.migrateFile)(path, entry, tree, (content) => (0, migration_js_1.migrateScssFile)(content, postCssScss, postcssSelectorParser));
             }
             if (path.endsWith('.html')) {
-                (0, schematics_js_1.migrateFile)(path, entry, tree, (content) => (0, migration_js_1.migrateHTMLFile)(content, angularCompiler));
+                (0, schematics_js_1.migrateFile)(path, entry, tree, (content) => (0, migration_js_1.migrateHTMLFile)(content));
             }
             if (path.endsWith('.ts')) {
-                (0, schematics_js_1.migrateFile)(path, entry, tree, (content) => (0, migration_js_1.migrateTsFile)(path, content, angularCompiler));
+                (0, schematics_js_1.migrateFile)(path, entry, tree, (content) => (0, migration_js_1.migrateTsFile)(path, content));
             }
         });
     };

package/schematics/new-icons/migration.js

@@ -10,41 +10,42 @@ const html_ast_js_1 = require("../lib/html-ast.js");
 const scss_ast_js_1 = require("../lib/scss-ast.js");
 const typescript_ast_js_1 = require("../lib/typescript-ast.js");
 const mapping_js_1 = require("./mapping.js");
+const lf_schematic_context_1 = require("../lib/lf-schematic-context");
 function migrateScssFile(content, postCssScss, postcssSelectorParser) {
     const root = postCssScss.parse(content);
     (0, scss_ast_js_1.updateCSSClassNamesInRules)(root, mapping_js_1.oldIconClassToNewIconClass, postcssSelectorParser);
     return root.toResult({ syntax: { stringify: postCssScss.stringify } }).css;
 }
-function migrateHTMLFile(content, angularCompiler) {
-    content = (0, html_ast_js_1.updateCssClassNames)(content, mapping_js_1.oldIconClassToNewIconClass, angularCompiler);
-    content = (0, angular_template_js_1.replaceComponentInput)('lu-icon', 'icon', mapping_js_1.oldIconToNewIcon, content, angularCompiler);
+function migrateHTMLFile(content) {
+    content = (0, html_ast_js_1.updateCssClassNames)(content, mapping_js_1.oldIconClassToNewIconClass);
+    content = (0, angular_template_js_1.replaceComponentInput)('lu-icon', 'icon', mapping_js_1.oldIconToNewIcon, content);
     return (0, file_update_js_1.updateContent)(content, (updates) => {
-        const htmlAst = new html_ast_js_1.HtmlAst(content, angularCompiler);
+        const htmlAst = new html_ast_js_1.HtmlAst(content);
         htmlAst.visitElementWithAttribute(/.*/, 'class', (elem, attr) => {
-            const legacyIconText = attr.value.includes('lucca-icon') && elem.children.find((c) => c instanceof angularCompiler.TmplAstText && mapping_js_1.oldIcons.has(c.value));
-            if (attr.valueSpan && legacyIconText && legacyIconText instanceof angularCompiler.TmplAstText) {
+            const legacyIconText = attr.value.includes('lucca-icon') && elem.children.find((c) => c instanceof lf_schematic_context_1.currentSchematicContext.angularCompiler.TmplAstText && mapping_js_1.oldIcons.has(c.value));
+            if (attr.valueSpan && legacyIconText && legacyIconText instanceof lf_schematic_context_1.currentSchematicContext.angularCompiler.TmplAstText) {
                 updates.push({
                     position: legacyIconText.sourceSpan.start.offset,
                     oldContent: legacyIconText.value,
-                    newContent: '',
+                    newContent: ''
                 });
                 updates.push({
                     position: attr.valueSpan.start.offset,
                     oldContent: attr.value,
-                    newContent: attr.value.replace('lucca-icon', 'lucca-icon ' + mapping_js_1.oldIconClassToNewIconClass['icon-' + legacyIconText.value]),
+                    newContent: attr.value.replace('lucca-icon', 'lucca-icon ' + mapping_js_1.oldIconClassToNewIconClass['icon-' + legacyIconText.value])
                 });
             }
         });
     });
 }
-function migrateTsFile(fileName, content, angularCompiler) {
+function migrateTsFile(fileName, content) {
     return (0, file_update_js_1.updateContent)(content, (updates) => {
         const sourcefile = (0, typescript_1.createSourceFile)(fileName, content, typescript_1.ScriptTarget.ESNext);
         const templates = (0, angular_template_js_1.extractNgTemplates)(sourcefile);
         updates.push(...templates.map((tpl) => ({
             position: tpl.offsetStart,
             oldContent: tpl.content,
-            newContent: migrateHTMLFile(tpl.content, angularCompiler),
+            newContent: migrateHTMLFile(tpl.content)
         })));
         updates.push(...(0, typescript_ast_js_1.replaceStringLiterals)(sourcefile, mapping_js_1.oldIconClassToNewIconClass));
     });

package/schematics/new-icons/schema.json

@@ -1,7 +1,23 @@
 {
-	"$schema": "http://json-schema.org/draft-07/schema",
-	"$id": "LuccaFrontNewIcons",
-	"title": "Lucca Front New Icons Schema",
-	"type": "object",
-	"properties": {}
+  "$schema": "http://json-schema.org/draft-07/schema",
+  "$id": "LuccaFrontNewIcons",
+  "title": "Lucca Front New Icons 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/palettes/index.js

@@ -1,31 +1,28 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const css_mapper_1 = require("../lib/css-mapper");
-const installer_1 = require("../lib/local-deps/installer");
+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) => {
-    const skipInstallation = options?.skipInstallation ?? false;
     return async (tree, context) => {
-        if (!skipInstallation) {
-            (0, installer_1.installLocalDependencies)(context);
-        }
+        await lf_schematic_context_1.currentSchematicContext.init(context, options);
         await new css_mapper_1.CssMapper(tree, {
             classes: {
                 '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}': `--colors-neutral-{val}`
             },
-            mixins: {},
+            mixins: {}
         }, {
             val: {
                 25: '25',
@@ -38,8 +35,8 @@ exports.default = (options) => {
                 600: '600',
                 700: '700',
                 800: '800',
-                900: '900',
-            },
+                900: '900'
+            }
         }).run();
     };
 };

package/schematics/palettes/schema.json

@@ -1,7 +1,23 @@
 {
-	"$schema": "http://json-schema.org/draft-07/schema",
-	"$id": "LuccaFrontPalettes",
-	"title": "Lucca Front Palettes Schema",
-	"type": "object",
-	"properties": {}
+  "$schema": "http://json-schema.org/draft-07/schema",
+  "$id": "LuccaFrontPalettes",
+  "title": "Lucca Front Palettes 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/tokens-spacing/index.js

@@ -1,16 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const css_mapper_1 = require("../lib/css-mapper");
-const installer_1 = require("../lib/local-deps/installer");
+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) => {
-    const skipInstallation = options?.skipInstallation ?? false;
     return async (tree, context) => {
-        if (!skipInstallation) {
-            (0, installer_1.installLocalDependencies)(context);
-        }
+        await lf_schematic_context_1.currentSchematicContext.init(context, options);
         await new css_mapper_1.CssMapper(tree, {
             classes: {
                 'u-margin{tshirt}': 'pr-u-margin{tshirt}',
@@ -29,12 +26,12 @@ exports.default = (options) => {
                 'u-paddingBlock{tshirt}': 'pr-u-paddingBlock{tshirt}',
                 'u-gap{tshirt}': 'pr-u-gap{tshirt}',
                 'u-rowGap{tshirt}': 'pr-u-rowGap{tshirt}',
-                'u-columnGap{tshirt}': 'pr-u-columnGap{tshirt}',
+                'u-columnGap{tshirt}': 'pr-u-columnGap{tshirt}'
             },
             variables: {
-                '--spacings-{tshirt}': `--pr-t-spacings-{tshirt}`,
+                '--spacings-{tshirt}': `--pr-t-spacings-{tshirt}`
             },
-            mixins: {},
+            mixins: {}
         }, {
             tshirt: {
                 Auto: 'Auto',
@@ -45,8 +42,8 @@ exports.default = (options) => {
                 M: '300',
                 L: '400',
                 XL: '600',
-                XXL: '800',
-            },
+                XXL: '800'
+            }
         }).run();
     };
 };

package/schematics/tokens-spacing/schema.json

@@ -1,7 +1,23 @@
 {
-	"$schema": "http://json-schema.org/draft-07/schema",
-	"$id": "LuccaFrontTokensSpacing",
-	"title": "Lucca Front Tokens Spacing Schema",
-	"type": "object",
-	"properties": {}
+  "$schema": "http://json-schema.org/draft-07/schema",
+  "$id": "LuccaFrontTokensSpacing",
+  "title": "Lucca Front Tokens Spacing 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/scrollBox/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@lucca-front/ng/scrollBox" />
+export * from './public-api';

package/scrollBox/public-api.d.ts

@@ -0,0 +1 @@
+export * from './scroll-box.component';

package/scrollBox/scroll-box.component.d.ts

@@ -0,0 +1,13 @@
+import { OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class ScrollBoxComponent implements OnInit {
+    #private;
+    get isFirstVisibleClass(): boolean;
+    isFirstVisible: import("@angular/core").WritableSignal<boolean>;
+    get isLastVisibleClass(): boolean;
+    isLastVisible: import("@angular/core").WritableSignal<boolean>;
+    initObserver(element: Element, isFirst: boolean): void;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScrollBoxComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScrollBoxComponent, "lu-scroll-box", never, {}, {}, never, ["*"], true, never>;
+}

package/simple-select/input/panel-ref.factory.d.ts

@@ -1,5 +1,5 @@
 import { Overlay, OverlayConfig, OverlayPositionBuilder, ScrollStrategyOptions } from '@angular/cdk/overlay';
-import { ElementRef, Injector } from '@angular/core';
+import { ElementRef, Injector, ViewContainerRef } from '@angular/core';
 import { LuSelectPanelRef } from '@lucca-front/ng/core-select';
 import { LuSimpleSelectInputComponent } from './select-input.component';
 import * as i0 from "@angular/core";
@@ -12,6 +12,7 @@ export declare class LuSimpleSelectPanelRefFactory {
     private selectLabelId;
     private selectId;
     buildPanelRef<T>(selectInput: LuSimpleSelectInputComponent<T>, overlayConfigOverride?: OverlayConfig): LuSelectPanelRef<T, T>;
+    buildAndAttachPanelRef<T>(selectInput: LuSimpleSelectInputComponent<T>, host: ViewContainerRef): LuSelectPanelRef<T, T>;
     protected buildOverlayConfig(overlayConfigOverride?: OverlayConfig): OverlayConfig;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuSimpleSelectPanelRefFactory, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<LuSimpleSelectPanelRefFactory>;

package/simple-select/input/select-input.component.d.ts

@@ -1,13 +1,18 @@
+import { ViewContainerRef } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 import { ALuSelectInputComponent, LuSelectPanelRef } from '@lucca-front/ng/core-select';
 import { LuSimpleSelectPanelRefFactory } from './panel-ref.factory';
 import * as i0 from "@angular/core";
 export declare class LuSimpleSelectInputComponent<T> extends ALuSelectInputComponent<T, T> implements ControlValueAccessor {
     intl: import("../select.translate").ILuSimpleSelectLabel;
+    get filterPillClass(): boolean;
     autocomplete?: string;
+    filterPillPanelAnchorRef: import("@angular/core").Signal<ViewContainerRef>;
     protected panelRefFactory: LuSimpleSelectPanelRefFactory;
     protected buildPanelRef(): LuSelectPanelRef<T, T>;
+    inputSpace(event: Event): void;
     protected hasValue(): boolean;
+    enableFilterPillMode(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuSimpleSelectInputComponent<any>, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<LuSimpleSelectInputComponent<any>, "lu-simple-select", never, { "autocomplete": { "alias": "autocomplete"; "required": false; }; }, {}, never, never, true, never>;
 }

package/simple-select/panel/panel.component.d.ts

@@ -19,7 +19,7 @@ export declare class LuSelectPanelComponent<T> implements AfterViewInit {
     optionTpl: import("@angular/core").ModelSignal<import("@angular/core").Type<unknown> | import("@angular/core").TemplateRef<import("@lucca-front/ng/core-select").LuOptionContext<T>>>;
     optionsQL: QueryList<ɵLuOptionComponent<T>>;
     keyManager: CoreSelectKeyManager<T>;
-    get selected(): T | undefined;
+    selected: import("@angular/core").Signal<T>;
     clueChange$: import("rxjs").Observable<string>;
     shouldDisplayAddOption$: import("rxjs").Observable<boolean>;
     groupTemplateLocation$: import("rxjs").Observable<import("@lucca-front/ng/core-select/panel/panel.utils").GroupTemplateLocation>;

package/src/_components.scss

@@ -1,12 +1,12 @@
-@import 'components/calendar';
-@import 'components/input';
-@import 'components/picker';
-@import 'components/popover';
-@import 'components/popup';
-@import 'components/dropdown';
-@import 'components/sidepanel';
-@import 'components/cdk/overlay';
-@import 'components/cdk/textarea';
-@import 'components/cdk/misc';
-@import 'components/cdk/global';
-@import 'components/cdk/dragDrop';
+@forward 'components/calendar';
+@forward 'components/input';
+@forward 'components/popover';
+@forward 'components/picker';
+@forward 'components/popup';
+@forward 'components/sidepanel';
+
+@forward 'components/cdk/overlay';
+@forward 'components/cdk/textarea';
+@forward 'components/cdk/misc';
+@forward 'components/cdk/global';
+@forward 'components/cdk/dragDrop';

package/src/_definitions.scss

@@ -1,6 +1,6 @@
-@import 'definitions/select/select-input';
-@import 'definitions/select/select-clearer';
-@import 'definitions/option/option-item';
-@import 'definitions/option/option-searcher';
-@import 'definitions/option/option-selector';
-@import 'definitions/option/option-placeholder';
+@forward 'definitions/select/select-input';
+@forward 'definitions/select/select-clearer';
+@forward 'definitions/option/option-item';
+@forward 'definitions/option/option-searcher';
+@forward 'definitions/option/option-selector';
+@forward 'definitions/option/option-placeholder';

package/src/components/_picker.scss

@@ -1,3 +1,5 @@
+@use 'popover';
+
 .lu-picker-panel {
 	@extend %popover-panel;
 }
@@ -5,16 +7,16 @@
 .lu-picker-content {
 	@extend %popover-content;
 
-	max-height: 20rem;
+	max-block-size: 20rem;
 	padding: var(--pr-t-spacings-50);
 	overflow-y: auto;
 	display: block;
 	animation: scaleIn 150ms cubic-bezier(0.25, 0.8, 0.25, 1);
-	margin-left: calc(var(--pr-t-spacings-50) * -1);
-	margin-right: calc(var(--pr-t-spacings-50) * -1);
+	margin-inline-start: calc(var(--pr-t-spacings-50) * -1);
+	margin-inline-end: calc(var(--pr-t-spacings-50) * -1);
 
 	&.is-loading {
-		//height: 17.5rem;
+		//block-size: 17.5rem;
 	}
 }
 
@@ -31,17 +33,18 @@
 }
 
 .lu-picker-content-option-group {
-	margin-bottom: var(--pr-t-spacings-50);
+	margin-block-end: var(--pr-t-spacings-50);
 }
 
 .lu-picker-content-option-group-title {
 	font-size: var(--sizes-S-fontSize);
 	line-height: var(--sizes-S-lineHeight);
 	font-weight: 600;
-	padding: var(--components-options-item-padding-vertical) var(--components-options-item-padding-horizontal);
+	padding-block: var(--components-options-item-padding-vertical);
+	padding-inline: var(--components-options-item-padding-horizontal);
 	color: var(--palettes-neutral-600);
 	position: sticky;
-	top: 0;
+	inset-block-start: 0;
 	background-color: var(--pr-t-elevation-surface-raised);
 	z-index: 1;
 	display: flex;
@@ -52,15 +55,16 @@
 
 .lu-picker-content-add {
 	position: sticky;
-	bottom: 0;
+	inset-block-end: 0;
 	background-color: var(--palettes-neutral-0);
 	box-shadow: var(--pr-t-elevation-shadow-overflow);
 	padding: var(--pr-t-spacings-50);
-	margin: 0 calc(var(--pr-t-spacings-50) * -1);
+	margin-block: 0;
+	margin-inline: calc(var(--pr-t-spacings-50) * -1);
 	transform: translateY(var(--pr-t-spacings-50));
 
 	.button {
-		width: 100%;
+		inline-size: 100%;
 		justify-content: left;
 	}
 }
@@ -74,26 +78,25 @@
 .lu-picker-loading {
 	// deprecated
 	position: absolute;
-	left: 50%;
-	top: 50%;
+	inset-inline-start: 50%;
+	inset-block-start: 50%;
 	transform: translateX(-50%) translateY(-50%);
 }
 
 .lu-picker-header {
 	background-color: var(--pr-t-elevation-surface-raised);
 	position: sticky;
-	top: 0;
-	left: 0;
-	right: 0;
+	inset-block-start: 0;
+	inset-inline: 0;
 	display: block;
 	z-index: 1;
-	margin-bottom: var(--pr-t-spacings-50);
+	margin-block-end: var(--pr-t-spacings-50);
 	box-shadow: 0 -4px 0 var(--pr-t-spacings-100) var(--pr-t-elevation-surface-raised); // Avoid showing options list while scrolling due to header sticky potisionning
 }
 
 .lu-picker-textfield {
-	width: 100%;
-	padding-bottom: var(--pr-t-spacings-100);
+	inline-size: 100%;
+	padding-block-end: var(--pr-t-spacings-100);
 
 	.textfield-input {
 		background-color: var(--palettes-neutral-0);
@@ -104,18 +107,17 @@
 .lu-picker-footer {
 	background-color: var(--pr-t-elevation-surface-raised);
 	position: sticky;
-	bottom: 0;
-	left: 0;
-	right: 0;
+	inset-block-end: 0;
+	inset-inline: 0;
 	display: block;
 	z-index: 1;
 }
 
 .lu-date-picker-panel {
-	width: var(--components-calendar-width);
+	inline-size: var(--components-calendar-width);
 
 	.lu-picker-content {
-		max-height: none;
+		max-block-size: none;
 	}
 }
 

package/src/components/_popover.scss

@@ -1,7 +1,7 @@
 %popover-panel {
 	display: flex;
 	flex-direction: column;
-	max-height: calc(100vh + 48px);
+	max-block-size: calc(100vh + 48px);
 	position: relative;
 
 	&.is-above {
@@ -54,5 +54,6 @@
 .lu-popover-content {
 	@extend %popover-content;
 
-	padding: var(--pr-t-spacings-100) var(--pr-t-spacings-150);
+	padding-block: var(--pr-t-spacings-100);
+	padding-inline: var(--pr-t-spacings-150);
 }