@lucca-front/ng 10.0.2 → 10.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lucca-front/ng",
3
- "version": "10.0.2",
3
+ "version": "10.0.3",
4
4
  "description": "A library of icons made by the team @Lucca",
5
5
  "repository": {
6
6
  "type": "git",
@@ -29,8 +29,8 @@
29
29
  "@angular/common": "^14.0.0",
30
30
  "@angular/core": "^14.0.0",
31
31
  "@angular/cdk": "^14.0.0",
32
- "@lucca-front/icons": "v10.0.2",
33
- "@lucca-front/scss": "v10.0.2",
32
+ "@lucca-front/icons": "v10.0.3",
33
+ "@lucca-front/scss": "v10.0.3",
34
34
  "rxjs": "^6.0.0 || ^7.0.0"
35
35
  },
36
36
  "bugs": {
@@ -0,0 +1,46 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.extractNgTemplates = void 0;
4
+ const typescript_1 = require("typescript");
5
+ function extractNgTemplates(fileName, content) {
6
+ const sourcefile = (0, typescript_1.createSourceFile)(fileName, content, typescript_1.ScriptTarget.ESNext);
7
+ const templates = [];
8
+ (0, typescript_1.forEachChild)(sourcefile, createVisitor(sourcefile, typescript_1.isDecorator, (decorator) => {
9
+ if (!(0, typescript_1.isCallExpression)(decorator.expression)) {
10
+ return;
11
+ }
12
+ if (!(0, typescript_1.isIdentifier)(decorator.expression.expression)) {
13
+ return;
14
+ }
15
+ if (decorator.expression.expression.escapedText !== 'Component') {
16
+ return;
17
+ }
18
+ const argument = decorator.expression.arguments[0];
19
+ if (!argument || !(0, typescript_1.isObjectLiteralExpression)(argument)) {
20
+ return;
21
+ }
22
+ templates.push(...argument.properties
23
+ .filter(typescript_1.isPropertyAssignment)
24
+ .filter((prop) => (0, typescript_1.isIdentifier)(prop.name) && prop.name.text === 'template')
25
+ .map((prop) => prop.initializer)
26
+ .filter(orGuard(typescript_1.isStringLiteral, typescript_1.isNoSubstitutionTemplateLiteral))
27
+ .map((initializer) => ({
28
+ offsetStart: initializer.getStart(sourcefile) + initializer.getLeadingTriviaWidth(sourcefile),
29
+ offsetEnd: initializer.getEnd(),
30
+ content: initializer.text,
31
+ })));
32
+ }));
33
+ return templates;
34
+ }
35
+ exports.extractNgTemplates = extractNgTemplates;
36
+ function createVisitor(sourcefile, predicate, callback) {
37
+ return function visit(node) {
38
+ if (predicate(node)) {
39
+ callback(node);
40
+ }
41
+ (0, typescript_1.forEachChild)(node, visit);
42
+ };
43
+ }
44
+ function orGuard(guard1, guard2) {
45
+ return (item) => guard1(item) || guard2(item);
46
+ }
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.extractAllCssClassNames = exports.updateCssClassNames = exports.HtmlAst = void 0;
3
+ exports.extractAllHtmlElementNames = exports.extractAllCssClassNames = exports.updateCssClassNames = exports.HtmlAst = void 0;
4
4
  const file_update_js_1 = require("./file-update.js");
5
5
  class HtmlAst {
6
6
  constructor(content, lib) {
@@ -118,3 +118,10 @@ function extractAllCssClassNames(content, lib) {
118
118
  return [...allClasses];
119
119
  }
120
120
  exports.extractAllCssClassNames = extractAllCssClassNames;
121
+ function extractAllHtmlElementNames(content, lib) {
122
+ const allElements = new Set();
123
+ const root = new HtmlAst(content, lib);
124
+ root.visitElements(/.*/, (element) => allElements.add(element.name));
125
+ return [...allElements];
126
+ }
127
+ exports.extractAllHtmlElementNames = extractAllHtmlElementNames;
@@ -2,79 +2,87 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.getCssImports = void 0;
4
4
  const classWithImports = [
5
- { cssClass: 'actionIcon', cssImport: '@lucca-front/scss/src/components/actionIcon' },
6
- { cssClass: 'box', cssImport: '@lucca-front/scss/src/components/box' },
7
- { cssClass: 'breadcrumbs', cssImport: '@lucca-front/scss/src/components/breadcrumbs' },
8
- { cssClass: 'button', cssImport: '@lucca-front/scss/src/components/button' },
9
- { cssClass: 'button-group', cssImport: '@lucca-front/scss/src/components/buttonGroup' },
10
- { cssClass: 'callout', cssImport: '@lucca-front/scss/src/components/callout' },
11
- { cssClass: 'card', cssImport: '@lucca-front/scss/src/components/card' },
12
- { cssClass: 'checkbox', cssImport: '@lucca-front/scss/src/components/checkbox' },
13
- { cssClass: 'chip', cssImport: '@lucca-front/scss/src/components/chip' },
14
- { cssClass: 'code', cssImport: '@lucca-front/scss/src/components/code' },
15
- { cssClass: 'collapse', cssImport: '@lucca-front/scss/src/components/collapse' },
16
- { cssClass: 'container', cssImport: '@lucca-front/scss/src/components/container' },
17
- { cssClass: 'contentSection', cssImport: '@lucca-front/scss/src/components/contentSection' },
18
- { cssClass: 'titleSection', cssImport: '@lucca-front/scss/src/components/titleSection' },
19
- { cssClass: 'divider', cssImport: '@lucca-front/scss/src/components/divider' },
20
- { cssClass: 'emptyState', cssImport: '@lucca-front/scss/src/components/emptyState' },
21
- { cssClass: 'errorPage', cssImport: '@lucca-front/scss/src/components/errorPage' },
22
- { cssClass: 'textfield', cssImport: '@lucca-front/scss/src/components/field' },
23
- { cssClass: 'radiosfield', cssImport: '@lucca-front/scss/src/components/field' },
24
- { cssClass: 'checkboxesfield', cssImport: '@lucca-front/scss/src/components/field' },
25
- { cssClass: 'file', cssImport: '@lucca-front/scss/src/components/file' },
26
- { cssClass: 'filters', cssImport: '@lucca-front/scss/src/components/filters' },
27
- { cssClass: 'form-group', cssImport: '@lucca-front/scss/src/components/form' },
28
- { cssClass: 'gauge', cssImport: '@lucca-front/scss/src/components/gauge' },
29
- { cssClass: 'grid', cssImport: '@lucca-front/scss/src/components/grid' },
30
- { cssClass: 'header', cssImport: '@lucca-front/scss/src/components/header' },
31
- { cssClass: 'label', cssImport: '@lucca-front/scss/src/components/label' },
32
- { cssClass: 'layout', cssImport: '@lucca-front/scss/src/components/layout' },
33
- { cssClass: 'link', cssImport: '@lucca-front/scss/src/components/link' },
34
- { cssClass: 'list', cssImport: '@lucca-front/scss/src/components/list' },
35
- { cssClass: 'loading', cssImport: '@lucca-front/scss/src/components/loading' },
36
- { cssClass: 'main-content', cssImport: '@lucca-front/scss/src/components/main' },
37
- { cssClass: 'menu', cssImport: '@lucca-front/scss/src/components/menu' },
38
- { cssClass: 'navSide', cssImport: '@lucca-front/scss/src/components/navside' },
39
- { cssClass: 'pageHeader', cssImport: '@lucca-front/scss/src/components/pageHeader' },
40
- { cssClass: 'pagination', cssImport: '@lucca-front/scss/src/components/pagination' },
41
- { cssClass: 'progress', cssImport: '@lucca-front/scss/src/components/progress' },
42
- { cssClass: 'radio', cssImport: '@lucca-front/scss/src/components/radio' },
43
- { cssClass: 'radioButtons', cssImport: '@lucca-front/scss/src/components/radioButtons' },
44
- { cssClass: 'section', cssImport: '@lucca-front/scss/src/components/section' },
45
- { cssClass: 'switch', cssImport: '@lucca-front/scss/src/components/switch' },
46
- { cssClass: 'table', cssImport: '@lucca-front/scss/src/components/table' },
47
- { cssClass: /^mod-layoutFixed-.*/, cssImport: '@lucca-front/scss/src/components/tableFixed' },
48
- { cssClass: 'mod-sortable', cssImport: '@lucca-front/scss/src/components/tableSorted' },
49
- { cssClass: 'table-head-row-cell-sortableButton', cssImport: '@lucca-front/scss/src/components/tableSorted' },
50
- { cssClass: 'mod-stickyColumn', cssImport: '@lucca-front/scss/src/components/tableSticked' },
51
- { cssClass: 'mod-stickyHeader', cssImport: '@lucca-front/scss/src/components/tableSticked' },
52
- { cssClass: 'tag', cssImport: '@lucca-front/scss/src/components/tag' },
53
- { cssClass: 'textfield', cssImport: '@lucca-front/scss/src/components/textfield' },
54
- { cssClass: 'timeline', cssImport: '@lucca-front/scss/src/components/timeline' },
55
- { cssClass: 'title', cssImport: '@lucca-front/scss/src/components/title' },
56
- { cssClass: 'toasts', cssImport: '@lucca-front/scss/src/components/toast' },
57
- { cssClass: 'tableOfContent', cssImport: '@lucca-front/scss/src/components/tableOfContent' },
58
- { cssClass: /^u-.*/, cssImport: '@lucca-front/scss/src/components/util' },
5
+ { cssClass: ['actionIcon'], cssImport: ['@lucca-front/scss/src/components/actionIcon'] },
6
+ { cssClass: ['box'], cssImport: ['@lucca-front/scss/src/components/box'] },
7
+ { cssClass: ['breadcrumbs'], cssImport: ['@lucca-front/scss/src/components/breadcrumbs'] },
8
+ { cssClass: ['button'], cssImport: ['@lucca-front/scss/src/components/button'] },
9
+ { cssClass: ['button-group'], cssImport: ['@lucca-front/scss/src/components/buttonGroup'] },
10
+ { cssClass: ['callout'], cssImport: ['@lucca-front/scss/src/components/callout'] },
11
+ { cssClass: ['card'], cssImport: ['@lucca-front/scss/src/components/card'] },
12
+ { cssClass: ['checkbox'], cssImport: ['@lucca-front/scss/src/components/checkbox'] },
13
+ { cssClass: ['chip'], cssImport: ['@lucca-front/scss/src/components/chip'] },
14
+ { cssClass: ['code'], cssImport: ['@lucca-front/scss/src/components/code'] },
15
+ { cssClass: ['collapse'], cssImport: ['@lucca-front/scss/src/components/collapse'] },
16
+ { cssClass: ['container'], cssImport: ['@lucca-front/scss/src/components/container'] },
17
+ { cssClass: ['contentSection'], cssImport: ['@lucca-front/scss/src/components/contentSection'] },
18
+ { cssClass: ['titleSection'], cssImport: ['@lucca-front/scss/src/components/titleSection'] },
19
+ { cssClass: ['divider'], cssImport: ['@lucca-front/scss/src/components/divider'] },
20
+ { cssClass: ['emptyState'], cssImport: ['@lucca-front/scss/src/components/emptyState'] },
21
+ { cssClass: ['errorPage'], cssImport: ['@lucca-front/scss/src/components/errorPage'] },
22
+ { cssClass: ['textfield'], cssImport: ['@lucca-front/scss/src/components/field', '@lucca-front/scss/src/components/textfield'] },
23
+ { cssClass: ['radiosfield'], cssImport: ['@lucca-front/scss/src/components/field', '@lucca-front/scss/src/components/radio'] },
24
+ { cssClass: ['checkboxesfield'], cssImport: ['@lucca-front/scss/src/components/field', '@lucca-front/scss/src/components/checkbox'] },
25
+ { cssClass: ['file'], cssImport: ['@lucca-front/scss/src/components/file'] },
26
+ { cssClass: ['filters'], cssImport: ['@lucca-front/scss/src/components/filters'] },
27
+ { cssClass: ['form-group'], cssImport: ['@lucca-front/scss/src/components/form'] },
28
+ { cssClass: ['gauge'], cssImport: ['@lucca-front/scss/src/components/gauge'] },
29
+ { cssClass: ['grid'], cssImport: ['@lucca-front/scss/src/components/grid'] },
30
+ { cssClass: ['header'], cssImport: ['@lucca-front/scss/src/components/header'] },
31
+ { cssClass: ['label'], cssImport: ['@lucca-front/scss/src/components/label'] },
32
+ { cssClass: ['layout'], cssImport: ['@lucca-front/scss/src/components/layout'] },
33
+ { cssClass: ['link'], cssImport: ['@lucca-front/scss/src/components/link'] },
34
+ { cssClass: ['list'], cssImport: ['@lucca-front/scss/src/components/list'] },
35
+ { cssClass: ['loading'], cssImport: ['@lucca-front/scss/src/components/loading'] },
36
+ { cssClass: ['main-content'], cssImport: ['@lucca-front/scss/src/components/main'] },
37
+ { cssClass: ['menu'], cssImport: ['@lucca-front/scss/src/components/menu'] },
38
+ { cssClass: ['navSide'], cssImport: ['@lucca-front/scss/src/components/navside'], elements: ['lucca-sitemap'] },
39
+ { cssClass: ['pageHeader'], cssImport: ['@lucca-front/scss/src/components/pageHeader'] },
40
+ { cssClass: ['pagination'], cssImport: ['@lucca-front/scss/src/components/pagination'] },
41
+ { cssClass: ['progress'], cssImport: ['@lucca-front/scss/src/components/progress'] },
42
+ { cssClass: ['radio'], cssImport: ['@lucca-front/scss/src/components/radio'] },
43
+ { cssClass: ['radioButtons'], cssImport: ['@lucca-front/scss/src/components/radioButtons'] },
44
+ { cssClass: ['section'], cssImport: ['@lucca-front/scss/src/components/section'] },
45
+ { cssClass: ['switch'], cssImport: ['@lucca-front/scss/src/components/switch'] },
46
+ { cssClass: ['table'], cssImport: ['@lucca-front/scss/src/components/table'] },
47
+ { cssClass: [/^mod-layoutFixed-.*/], cssImport: ['@lucca-front/scss/src/components/tableFixed'] },
48
+ { cssClass: ['mod-sortable', 'table-head-row-cell-sortableButton'], cssImport: ['@lucca-front/scss/src/components/tableSorted'] },
49
+ { cssClass: ['mod-stickyColumn', 'mod-stickyHeader'], cssImport: ['@lucca-front/scss/src/components/tableSticked'] },
50
+ { cssClass: ['tag'], cssImport: ['@lucca-front/scss/src/components/tag'] },
51
+ { cssClass: ['textfield'], cssImport: ['@lucca-front/scss/src/components/textfield'] },
52
+ { cssClass: ['timeline'], cssImport: ['@lucca-front/scss/src/components/timeline'] },
53
+ {
54
+ cssClass: ['u-h1', 'u-h2', 'u-h3', 'u-h4', 'u-h5', 'u-h6'],
55
+ cssImport: ['@lucca-front/scss/src/components/title'],
56
+ elements: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'],
57
+ },
58
+ { cssClass: ['toasts'], cssImport: ['@lucca-front/scss/src/components/toast'] },
59
+ { cssClass: ['tableOfContent'], cssImport: ['@lucca-front/scss/src/components/tableOfContent'] },
60
+ { cssClass: [/^u-.*/], cssImport: ['@lucca-front/scss/src/components/util'] },
59
61
  ];
60
- function getCssImports(allVisitedClasses) {
62
+ function getCssImports(allVisitedClasses, allVisitedElements) {
61
63
  const exactCssClasses = {};
64
+ const exactCssElements = {};
62
65
  const regexpCssTests = [];
63
66
  // Pre-compute classWithImports for performance optimization
64
67
  for (const classWithImport of classWithImports) {
65
- if (typeof classWithImport.cssClass === 'string') {
66
- exactCssClasses[classWithImport.cssClass] = classWithImport.cssImport;
68
+ for (const cssClass of classWithImport.cssClass) {
69
+ if (typeof cssClass === 'string') {
70
+ exactCssClasses[cssClass] = classWithImport.cssImport;
71
+ }
72
+ else {
73
+ regexpCssTests.push((css) => (css.match(cssClass) ? classWithImport.cssImport : null));
74
+ }
67
75
  }
68
- else {
69
- regexpCssTests.push((cssClass) => (cssClass.match(classWithImport.cssClass) ? classWithImport.cssImport : null));
76
+ for (const element of classWithImport.elements || []) {
77
+ exactCssElements[element] = classWithImport.cssImport;
70
78
  }
71
79
  }
72
80
  const imports = new Set();
73
81
  for (const visitedClass of allVisitedClasses) {
74
- const newImport = exactCssClasses[visitedClass] || regexpCssTests.map((test) => test(visitedClass)).find(Boolean);
75
- if (newImport) {
76
- imports.add(newImport);
77
- }
82
+ (exactCssClasses[visitedClass] || regexpCssTests.map((test) => test(visitedClass)).find(Boolean))?.forEach((newImport) => imports.add(newImport));
83
+ }
84
+ for (const visitedElement of allVisitedElements) {
85
+ exactCssElements[visitedElement]?.forEach((newImport) => imports.add(newImport));
78
86
  }
79
87
  return [...imports].sort();
80
88
  }
@@ -25,6 +25,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
25
25
  Object.defineProperty(exports, "__esModule", { value: true });
26
26
  const child_process_1 = require("child_process");
27
27
  const path = __importStar(require("path"));
28
+ const angular_template_1 = require("../../lib/angular-template");
28
29
  const html_ast_1 = require("../../lib/html-ast");
29
30
  const css_class_registry_1 = require("./css-class-registry");
30
31
  const migration_1 = require("./migration");
@@ -50,6 +51,7 @@ exports.default = (options) => {
50
51
  const angularCompiler = await import('@angular/compiler');
51
52
  const { postcssValueParser } = await import('../../lib/local-deps/postcss-value-parser.js');
52
53
  const allCssClasses = new Set();
54
+ const allHtmlElements = new Set();
53
55
  tree.visit((path, entry) => {
54
56
  if (path.includes('node_modules') || !entry) {
55
57
  return;
@@ -74,13 +76,24 @@ exports.default = (options) => {
74
76
  migrateFile((content) => {
75
77
  if (!skipGlobalImportOptimization) {
76
78
  (0, html_ast_1.extractAllCssClassNames)(content, angularCompiler).forEach((c) => allCssClasses.add(c));
79
+ (0, html_ast_1.extractAllHtmlElementNames)(content, angularCompiler).forEach((c) => allHtmlElements.add(c));
77
80
  }
78
81
  return (0, migration_1.migrateHTMLFile)(path, content, angularCompiler);
79
82
  });
80
83
  }
84
+ if (path.endsWith('.ts')) {
85
+ migrateFile((content) => {
86
+ const ngTemplates = (0, angular_template_1.extractNgTemplates)(path, content);
87
+ if (!skipGlobalImportOptimization) {
88
+ ngTemplates.flatMap((tpl) => (0, html_ast_1.extractAllCssClassNames)(tpl.content, angularCompiler)).forEach((c) => allCssClasses.add(c));
89
+ ngTemplates.flatMap((tpl) => (0, html_ast_1.extractAllHtmlElementNames)(tpl.content, angularCompiler)).forEach((c) => allHtmlElements.add(c));
90
+ }
91
+ return (0, migration_1.migrateTsFile)(content, ngTemplates, angularCompiler);
92
+ });
93
+ }
81
94
  });
82
95
  if (!skipGlobalImportOptimization) {
83
- const cssImports = (0, css_class_registry_1.getCssImports)([...allCssClasses]);
96
+ const cssImports = (0, css_class_registry_1.getCssImports)([...allCssClasses], [...allHtmlElements]);
84
97
  tree.visit((path, entry) => {
85
98
  if (path.includes('node_modules') || !entry || !path.endsWith('.scss')) {
86
99
  return;
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.migrateAngularJsonFile = exports.migrateIndexHTMLFile = exports.migrateHTMLFile = exports.optimizeScssGlobalImport = exports.migrateScssFile = void 0;
3
+ exports.migrateAngularJsonFile = exports.migrateIndexHTMLFile = exports.migrateTsFile = exports.migrateHTMLFile = exports.optimizeScssGlobalImport = exports.migrateScssFile = void 0;
4
4
  const file_update_js_1 = require("../../lib/file-update.js");
5
5
  const html_ast_js_1 = require("../../lib/html-ast.js");
6
6
  const scss_ast_js_1 = require("../../lib/scss-ast.js");
@@ -17,7 +17,7 @@ const theme_js_1 = require("./updaters/theme.js");
17
17
  function migrateScssFile(content, postCss, postCssScss, postcssValueParser) {
18
18
  const root = postCssScss.parse(content);
19
19
  root.walkAtRules('import', (rule) => {
20
- ['@lucca-front/scss/src/mixins', '@lucca-front/icons/src/mixins', '@lucca-front/scss/src/icons', 'theming'].some((name) => (0, scss_ast_js_1.removeImportNode)(rule, name, postcssValueParser));
20
+ ['@lucca-front/scss/src/mixins', '@lucca-front/icons/src/mixins', '@lucca-front/scss/src/_mixins', '@lucca-front/icons/src/_mixins', '@lucca-front/scss/src/icons', 'theming'].some((name) => (0, scss_ast_js_1.removeImportNode)(rule, name, postcssValueParser));
21
21
  });
22
22
  (0, remove_scss_placeholder_js_1.removeScssPlaceholders)(root, postcssValueParser);
23
23
  (0, ie11_js_1.removeIE11ThemeSupport)(root, postcssValueParser);
@@ -69,16 +69,27 @@ function optimizeScssGlobalImport(content, cssImports, postCss, postCssScss) {
69
69
  return root.toResult({ syntax: { stringify: postCssScss.stringify } }).css;
70
70
  }
71
71
  exports.optimizeScssGlobalImport = optimizeScssGlobalImport;
72
+ const classMigrationMap = {
73
+ 'u-fontWeightBold': 'u-fontWeight600',
74
+ 'u-order1': 'u-flexOrder1',
75
+ 'u-order-1': 'u-flexOrderMinus1',
76
+ };
72
77
  function migrateHTMLFile(path, content, angularCompiler) {
73
- return path.endsWith('index.html')
74
- ? migrateIndexHTMLFile(content, angularCompiler)
75
- : (0, html_ast_js_1.updateCssClassNames)(content, {
76
- 'u-fontWeightBold': 'u-fontWeight600',
77
- 'u-order1': 'u-flexOrder1',
78
- 'u-order-1': 'u-flexOrderMinus1',
79
- }, angularCompiler);
78
+ return path.endsWith('index.html') ? migrateIndexHTMLFile(content, angularCompiler) : (0, html_ast_js_1.updateCssClassNames)(content, classMigrationMap, angularCompiler);
80
79
  }
81
80
  exports.migrateHTMLFile = migrateHTMLFile;
81
+ function migrateTsFile(content, templates, angularCompiler) {
82
+ if (!templates.length) {
83
+ return content;
84
+ }
85
+ const updates = templates.map((tpl) => ({
86
+ position: tpl.offsetStart,
87
+ oldContent: tpl.content,
88
+ newContent: (0, html_ast_js_1.updateCssClassNames)(tpl.content, classMigrationMap, angularCompiler),
89
+ }));
90
+ return (0, file_update_js_1.applyUpdates)(content, updates);
91
+ }
92
+ exports.migrateTsFile = migrateTsFile;
82
93
  function migrateIndexHTMLFile(content, angularCompiler) {
83
94
  const root = new html_ast_js_1.HtmlAst(content, angularCompiler);
84
95
  const updates = [];
@@ -117,7 +128,7 @@ function migrateAngularJsonFile(content) {
117
128
  const architect = project.architect[architectNode];
118
129
  const options = architect?.options?.stylePreprocessorOptions;
119
130
  if (options?.includePaths) {
120
- options.includePaths = options.includePaths.filter((p) => !p.startsWith('@lucca-front/'));
131
+ options.includePaths = options.includePaths.filter((p) => !p.includes('@lucca-front/'));
121
132
  if (!options.includePaths.length) {
122
133
  delete architect.options?.stylePreprocessorOptions;
123
134
  }
@@ -88,7 +88,7 @@ describe('Migration Angular JSON file', () => {
88
88
  });
89
89
  });
90
90
  describe('CSS Vars Migration', () => {
91
- it('should update style files', async () => {
91
+ it('should update files', async () => {
92
92
  const tree = new testing_1.UnitTestTree(schematics_1.Tree.empty());
93
93
  const inputs = files.filter((f) => f.includes('.input.'));
94
94
  const outputs = files.filter((f) => f.includes('.output.'));
@@ -109,6 +109,23 @@ describe('CSS Vars Migration', () => {
109
109
  });
110
110
  it('should add optimized global imports', async () => {
111
111
  const tree = new testing_1.UnitTestTree(schematics_1.Tree.empty());
112
+ tree.create('app.component.ts', `
113
+ @Component({
114
+ selector: 'clp-root',
115
+ template: \`
116
+ <clp-accessibility-nav></clp-accessibility-nav>
117
+ <lucca-sitemap id="navSide" class="mod-withBanner"></lucca-sitemap>
118
+ <main role="main" class="main-content" id="main-content">
119
+ <router-outlet></router-outlet>
120
+ </main>
121
+ <clf-feature-toggle feature="inbox">
122
+ <clp-documents-satellite enabled></clp-documents-satellite>
123
+ </clf-feature-toggle>
124
+ <clf-toast [sources]="[message$, toastError$]"></clf-toast>
125
+ \`,
126
+ })
127
+ export class AppComponent {}
128
+ `);
112
129
  tree.create('app.component.html', '<button type="button" class="button">Test</button>');
113
130
  tree.create('table.component.html', '<table class="table mod-sortable" [class.mod-stickyColumn]="true"></table>');
114
131
  tree.create('util.component.html', '<div class="u-marginTopStandard">LOL</div>');
@@ -120,6 +137,8 @@ describe('CSS Vars Migration', () => {
120
137
  `@forward '@lucca-front/icons/src/main';`,
121
138
  `@forward '@lucca-front/scss/src/main';`,
122
139
  `@forward '@lucca-front/scss/src/components/button';`,
140
+ `@forward '@lucca-front/scss/src/components/main';`,
141
+ `@forward '@lucca-front/scss/src/components/navside';`,
123
142
  `@forward '@lucca-front/scss/src/components/table';`,
124
143
  `@forward '@lucca-front/scss/src/components/tableSorted';`,
125
144
  `@forward '@lucca-front/scss/src/components/tableSticked';`,
@@ -9,7 +9,7 @@ function updateElevation(root, postCss, postCssValueParser) {
9
9
  const level = funcNode.nodes[0].value;
10
10
  atRule.before(new postCss.Declaration({
11
11
  prop: 'box-shadow',
12
- value: `var(--commons-elevation-elevation-${level})`,
12
+ value: `var(--commons-elevations-elevation-${level})`,
13
13
  }));
14
14
  atRule.remove();
15
15
  });