@stylable/core - npm Package Compare versions

Comparing version 5.14.0 to 5.15.0

dist/features/st-custom-state.d.ts

@@ -91,2 +91,7 @@ import { parsePseudoStates, parseStateValue, transformPseudoClassToCustomState, createBooleanStateClassName, createStateWithParamClassName, systemValidators, validationErrors as sysValidationErrors, resolveStateParam, isTemplateState, MappedStates } from '../helpers/custom-state';
     };
+    NO_PARAM_REQUIRED: {
+        (name: string, param: string): import("../diagnostics").DiagnosticBase;
+        code: string;
+        severity: import("..").DiagnosticSeverity;
+    };
 };
@@ -93,0 +98,0 @@ export declare const hooks: import("./feature").FeatureHooks<import("./feature").NodeTypes>;

dist/helpers/custom-state.d.ts

@@ -114,2 +114,7 @@ import type * as postcss from 'postcss';
     };
+    NO_PARAM_REQUIRED: {
+        (name: string, param: string): import("../diagnostics").DiagnosticBase;
+        code: string;
+        severity: import("../diagnostics").DiagnosticSeverity;
+    };
 };
@@ -116,0 +121,0 @@ export declare function parsePseudoStates(value: string, decl: postcss.Declaration, diagnostics: Diagnostics): MappedStates;

dist/helpers/custom-state.js

@@ -42,2 +42,3 @@ "use strict";
     UNSUPPORTED_INITIAL_SELECTOR: (0, diagnostics_1.createDiagnosticReporter)('08017', 'error', (state, finalSelector) => `pseudo-state "${state}" result cannot start with a type or universal selector "${finalSelector}"`),
+    NO_PARAM_REQUIRED: (0, diagnostics_1.createDiagnosticReporter)('08018', 'error', (name, param) => `pseudo-state "${name}" accepts no parameter, but received "${param}"`),
 };
@@ -511,11 +512,20 @@ // parse
 function transformPseudoClassToCustomState(stateDef, meta, name, stateNode, namespace, resolver, diagnostics, selectorNode) {
-    if (stateDef === null) {
-        (0, selector_1.convertToClass)(stateNode).value = createBooleanStateClassName(name, namespace);
+    if (stateDef === null || typeof stateDef === 'string') {
+        if (stateNode.nodes && selectorNode) {
+            diagnostics.report(exports.stateDiagnostics.NO_PARAM_REQUIRED(name, (0, selector_1.stringifySelector)(stateNode.nodes)), {
+                node: selectorNode,
+                word: (0, selector_1.stringifySelector)(stateNode),
+            });
+        }
+        if (stateDef === null) {
+            // boolean
+            (0, selector_1.convertToClass)(stateNode).value = createBooleanStateClassName(name, namespace);
+        }
+        else {
+            // static template selector
+            // simply concat global mapped selector - ToDo: maybe change to 'selector'
+            (0, selector_1.convertToInvalid)(stateNode).value = stateDef;
+        }
         delete stateNode.nodes;
     }
-    else if (typeof stateDef === 'string') {
-        // simply concat global mapped selector - ToDo: maybe change to 'selector'
-        (0, selector_1.convertToInvalid)(stateNode).value = stateDef;
-        delete stateNode.nodes;
-    }
     else if (typeof stateDef === 'object') {
@@ -522,0 +532,0 @@ if (isTemplateState(stateDef)) {

dist/index.d.ts

@@ -16,2 +16,3 @@ export { Stylable, StylableConfig } from './stylable';
 export { validateCustomPropertyName } from './helpers/css-custom-property';
+export { generateStylableJSModuleSource } from './stylable-js-module-source';
 //# sourceMappingURL=index.d.ts.map

dist/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.validateCustomPropertyName = exports.ensureModuleImport = exports.parseModuleImportStatement = exports.createDefaultResolver = exports.createCustomValue = exports.CustomValueStrategy = exports.processNamespace = exports.defaultNamespaceBuilder = exports.defaultNoMatchHandler = exports.createNamespaceStrategy = exports.noCollisionNamespace = exports.StylableMeta = exports.Diagnostics = exports.Stylable = void 0;
+exports.generateStylableJSModuleSource = exports.validateCustomPropertyName = exports.ensureModuleImport = exports.parseModuleImportStatement = exports.createDefaultResolver = exports.createCustomValue = exports.CustomValueStrategy = exports.processNamespace = exports.defaultNamespaceBuilder = exports.defaultNoMatchHandler = exports.createNamespaceStrategy = exports.noCollisionNamespace = exports.StylableMeta = exports.Diagnostics = exports.Stylable = void 0;
 var stylable_1 = require("./stylable");
@@ -29,2 +29,4 @@ Object.defineProperty(exports, "Stylable", { enumerable: true, get: function () { return stylable_1.Stylable; } });
 Object.defineProperty(exports, "validateCustomPropertyName", { enumerable: true, get: function () { return css_custom_property_1.validateCustomPropertyName; } });
+var stylable_js_module_source_1 = require("./stylable-js-module-source");
+Object.defineProperty(exports, "generateStylableJSModuleSource", { enumerable: true, get: function () { return stylable_js_module_source_1.generateStylableJSModuleSource; } });
 //# sourceMappingURL=index.js.map

dist/native-reserved-lists.js

@@ -163,2 +163,3 @@ "use strict";
     scaleZ: { preserveQuotes: false },
+    scroll: { preserveQuotes: false },
     sepia: { preserveQuotes: false },
@@ -180,3 +181,28 @@ skew: { preserveQuotes: false },
     var: { preserveQuotes: false },
+    color: { preserveQuotes: true },
+    'color-mix': { preserveQuotes: true },
+    lab: { preserveQuotes: true },
+    oklab: { preserveQuotes: true },
+    lch: { preserveQuotes: true },
+    oklch: { preserveQuotes: true },
+    supports: { preserveQuotes: true },
+    anchor: { preserveQuotes: true },
+    selector: { preserveQuotes: true /* TODO:transform the nested selector */ },
+    style: { preserveQuotes: true /* TODO: transform the dashed ident property */ },
+    'image-set': { preserveQuotes: true },
+    sin: { preserveQuotes: true },
+    cos: { preserveQuotes: true },
+    tan: { preserveQuotes: true },
+    asin: { preserveQuotes: true },
+    acos: { preserveQuotes: true },
+    atan: { preserveQuotes: true },
+    atan2: { preserveQuotes: true },
+    pow: { preserveQuotes: true },
+    sqrt: { preserveQuotes: true },
+    hypot: { preserveQuotes: true },
+    log: { preserveQuotes: true },
+    exp: { preserveQuotes: true },
+    abs: { preserveQuotes: true },
+    sign: { preserveQuotes: true },
 };
 //# sourceMappingURL=native-reserved-lists.js.map

dist/stylable-resolver.js

@@ -364,3 +364,3 @@ "use strict";
                 else {
-                    current = { _kind: 'css', symbol: parent, meta };
+                    current = { _kind: 'css', symbol: parent, meta: current.meta };
                 }
@@ -367,0 +367,0 @@ }

dist/stylable-transformer.js

@@ -626,5 +626,10 @@ "use strict";
              * search for elements in each resolved selector.
-             * start at 1 for extended symbols to prefer inherited elements over local
+             * start at 1 for legacy flat mode to prefer inherited elements over local
              */
-            const startIndex = resolvedContext.length === 1 || resolvedContext[0]?.symbol._kind === 'part' ? 0 : 1;
+            const startIndex = resolvedContext.length === 1 ||
+                (resolvedContext[0] &&
+                    (features_1.STStructure.isStructureMode(resolvedContext[0].meta) ||
+                        resolvedContext[0].symbol._kind === 'part'))
+                ? 0
+                : 1;
             resolved: for (let i = startIndex; i < resolvedContext.length; i++) {
@@ -631,0 +636,0 @@ const { symbol, meta } = resolvedContext[i];

package.json

 {
   "name": "@stylable/core",
-  "version": "5.14.0",
+  "version": "5.15.0",
   "description": "CSS for Components",
@@ -23,3 +23,3 @@ "main": "dist/index.js",
     "lodash.clonedeepwith": "^4.5.0",
-    "postcss": "^8.4.24",
+    "postcss": "^8.4.25",
     "postcss-js": "^4.0.1",
@@ -26,0 +26,0 @@ "postcss-nested": "^6.0.1",

src/helpers/custom-state.ts

@@ -157,2 +157,8 @@ import type * as postcss from 'postcss';
     ),
+    NO_PARAM_REQUIRED: createDiagnosticReporter(
+        '08018',
+        'error',
+        (name: string, param: string) =>
+            `pseudo-state "${name}" accepts no parameter, but received "${param}"`
+    ),
 };
@@ -859,9 +865,21 @@
 ) {
-    if (stateDef === null) {
-        convertToClass(stateNode).value = createBooleanStateClassName(name, namespace);
+    if (stateDef === null || typeof stateDef === 'string') {
+        if (stateNode.nodes && selectorNode) {
+            diagnostics.report(
+                stateDiagnostics.NO_PARAM_REQUIRED(name, stringifySelector(stateNode.nodes)),
+                {
+                    node: selectorNode,
+                    word: stringifySelector(stateNode),
+                }
+            );
+        }
+        if (stateDef === null) {
+            // boolean
+            convertToClass(stateNode).value = createBooleanStateClassName(name, namespace);
+        } else {
+            // static template selector
+            // simply concat global mapped selector - ToDo: maybe change to 'selector'
+            convertToInvalid(stateNode).value = stateDef;
+        }
         delete stateNode.nodes;
-    } else if (typeof stateDef === 'string') {
-        // simply concat global mapped selector - ToDo: maybe change to 'selector'
-        convertToInvalid(stateNode).value = stateDef;
-        delete stateNode.nodes;
     } else if (typeof stateDef === 'object') {
@@ -868,0 +886,0 @@ if (isTemplateState(stateDef)) {

src/index.ts

@@ -40,1 +40,3 @@ export { Stylable, StylableConfig } from './stylable';
 export { validateCustomPropertyName } from './helpers/css-custom-property';
+
+export { generateStylableJSModuleSource } from './stylable-js-module-source';

src/native-reserved-lists.ts

@@ -166,2 +166,3 @@ // MDN reference: https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes
     scaleZ: { preserveQuotes: false },
+    scroll: { preserveQuotes: false },
     sepia: { preserveQuotes: false },
@@ -183,2 +184,27 @@ skew: { preserveQuotes: false },
     var: { preserveQuotes: false },
+    color: { preserveQuotes: true },
+    'color-mix': { preserveQuotes: true },
+    lab: { preserveQuotes: true },
+    oklab: { preserveQuotes: true },
+    lch: { preserveQuotes: true },
+    oklch: { preserveQuotes: true },
+    supports: { preserveQuotes: true },
+    anchor: { preserveQuotes: true },
+    selector: { preserveQuotes: true /* TODO:transform the nested selector */ },
+    style: { preserveQuotes: true /* TODO: transform the dashed ident property */ },
+    'image-set': { preserveQuotes: true },
+    sin: { preserveQuotes: true },
+    cos: { preserveQuotes: true },
+    tan: { preserveQuotes: true },
+    asin: { preserveQuotes: true },
+    acos: { preserveQuotes: true },
+    atan: { preserveQuotes: true },
+    atan2: { preserveQuotes: true },
+    pow: { preserveQuotes: true },
+    sqrt: { preserveQuotes: true },
+    hypot: { preserveQuotes: true },
+    log: { preserveQuotes: true },
+    exp: { preserveQuotes: true },
+    abs: { preserveQuotes: true },
+    sign: { preserveQuotes: true },
 };

src/stylable-resolver.ts

@@ -502,3 +502,3 @@ import type { FileProcessor } from './cached-process-file';
                 } else {
-                    current = { _kind: 'css', symbol: parent, meta };
+                    current = { _kind: 'css', symbol: parent, meta: current.meta };
                 }
@@ -505,0 +505,0 @@ } else {

src/stylable-transformer.ts

@@ -168,3 +168,3 @@ import isVendorPrefixed from 'is-vendor-prefixed';
         meta.transformedScopes = null;
-        meta.targetAst = meta.sourceAst.clone();
+        meta.targetAst = meta.sourceAst.clone() as postcss.Root;
         const context = {
@@ -831,6 +831,11 @@ meta,
              * search for elements in each resolved selector.
-             * start at 1 for extended symbols to prefer inherited elements over local
+             * start at 1 for legacy flat mode to prefer inherited elements over local
              */
             const startIndex =
-                resolvedContext.length === 1 || resolvedContext[0]?.symbol._kind === 'part' ? 0 : 1;
+                resolvedContext.length === 1 ||
+                (resolvedContext[0] &&
+                    (STStructure.isStructureMode(resolvedContext[0].meta) ||
+                        resolvedContext[0].symbol._kind === 'part'))
+                    ? 0
+                    : 1;
             resolved: for (let i = startIndex; i < resolvedContext.length; i++) {
@@ -837,0 +842,0 @@ const { symbol, meta } = resolvedContext[i];

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

5185425

increased by266.98%

Number of package files

332

increased by4.4%

Lines of code

28392

increased by12.14%

Dependency changes

• Updatedpostcss@^8.4.25