@stylable/core - npm Package Compare versions

Comparing version 5.0.0-rc.3 to 5.0.0-rc.4

dist/features/css-class.d.ts

@@ -6,3 +6,4 @@ import { FeatureContext } from './feature';
 import type { StylableMeta } from '../stylable-meta';
-import type { ImmutableClass, Class, SelectorNode, ImmutableSelectorNode } from '@tokey/css-selector-parser';
+import type { Stylable } from '../stylable';
+import { ImmutableClass, Class, SelectorNode, ImmutableSelectorNode } from '@tokey/css-selector-parser';
 import type * as postcss from 'postcss';
@@ -62,2 +63,7 @@ export interface ClassSymbol extends StylableDirectives {
 }>;
+export declare class StylablePublicApi {
+    private stylable;
+    constructor(stylable: Stylable);
+    transformIntoSelector(meta: StylableMeta, name: string): string | undefined;
+}
 export declare function get(meta: StylableMeta, name: string): ClassSymbol | undefined;
@@ -64,0 +70,0 @@ export declare function getAll(meta: StylableMeta): Record<string, ClassSymbol>;

dist/features/css-class.js

@@ -26,3 +26,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.checkForScopedNodeAfter = exports.validateClassScoping = exports.namespaceClass = exports.addClass = exports.getAll = exports.get = exports.hooks = exports.diagnostics = void 0;
+exports.checkForScopedNodeAfter = exports.validateClassScoping = exports.namespaceClass = exports.addClass = exports.getAll = exports.get = exports.StylablePublicApi = exports.hooks = exports.diagnostics = void 0;
 const feature_1 = require("./feature");
@@ -37,2 +37,3 @@ const diagnostics_1 = require("./diagnostics");
 const custom_state_1 = require("../helpers/custom-state");
+const css_selector_parser_1 = require("@tokey/css-selector-parser");
 const diagnostics_2 = require("../diagnostics");
@@ -128,2 +129,27 @@ exports.diagnostics = {
 // API
+class StylablePublicApi {
+    constructor(stylable) {
+        this.stylable = stylable;
+    }
+    transformIntoSelector(meta, name) {
+        var _a;
+        const localSymbol = STSymbol.get(meta, name);
+        const resolved = (localSymbol === null || localSymbol === void 0 ? void 0 : localSymbol._kind) === 'import'
+            ? this.stylable.resolver.deepResolve(localSymbol)
+            : { _kind: 'css', meta, symbol: localSymbol };
+        if ((resolved === null || resolved === void 0 ? void 0 : resolved._kind) !== 'css' || ((_a = resolved.symbol) === null || _a === void 0 ? void 0 : _a._kind) !== 'class') {
+            return undefined;
+        }
+        const node = {
+            type: 'class',
+            value: '',
+            start: 0,
+            end: 0,
+            dotComments: [],
+        };
+        namespaceClass(resolved.meta, resolved.symbol, node, meta);
+        return (0, css_selector_parser_1.stringifySelectorAst)(node);
+    }
+}
+exports.StylablePublicApi = StylablePublicApi;
 function get(meta, name) {
@@ -130,0 +156,0 @@ return STSymbol.get(meta, name, `class`);

dist/features/st-mixin.d.ts

@@ -115,3 +115,4 @@ import * as STSymbol from './st-symbol';
     }): MixinReflection[];
+    scopeNestedSelector(scopeSelector: string, nestSelector: string): string;
 }
 //# sourceMappingURL=st-mixin.d.ts.map

dist/features/st-mixin.js

@@ -32,2 +32,3 @@ "use strict";
 const rule_1 = require("../helpers/rule");
+const selector_1 = require("../helpers/selector");
 const mixin_1 = require("../helpers/mixin");
@@ -42,2 +43,3 @@ const functions_1 = require("../functions");
 const diagnostics_1 = require("../diagnostics");
+const css_selector_parser_1 = require("@tokey/css-selector-parser");
 exports.MixinType = {
@@ -125,2 +127,6 @@ ALL: `-st-mixin`,
     }
+    scopeNestedSelector(scopeSelector, nestSelector) {
+        return (0, selector_1.scopeNestedSelector)((0, css_selector_parser_1.parseCssSelector)(scopeSelector), (0, css_selector_parser_1.parseCssSelector)(nestSelector))
+            .selector;
+    }
 }
@@ -127,0 +133,0 @@ exports.StylablePublicApi = StylablePublicApi;

dist/features/st-scope.d.ts

@@ -0,2 +1,4 @@
+import type { Stylable } from '../stylable';
 import type { ImmutablePseudoClass } from '@tokey/css-selector-parser';
+import * as postcss from 'postcss';
 export declare const diagnostics: {
@@ -12,2 +14,7 @@ MISSING_SCOPING_PARAM: {
 }>;
+export declare class StylablePublicApi {
+    private stylable;
+    constructor(stylable: Stylable);
+    getStScope(rule: postcss.Rule): postcss.AtRule | undefined;
+}
 //# sourceMappingURL=st-scope.d.ts.map

dist/features/st-scope.js

@@ -26,3 +26,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.hooks = exports.diagnostics = void 0;
+exports.StylablePublicApi = exports.hooks = exports.diagnostics = void 0;
 const feature_1 = require("./feature");
@@ -60,2 +60,11 @@ const selector_1 = require("../helpers/selector");
 // API
+class StylablePublicApi {
+    constructor(stylable) {
+        this.stylable = stylable;
+    }
+    getStScope(rule) {
+        return getStScope(rule);
+    }
+}
+exports.StylablePublicApi = StylablePublicApi;
 function isStScopeStatement(node) {
@@ -73,2 +82,13 @@ return node.type === 'atrule' && node.name === 'st-scope';
 }
+function getStScope(rule) {
+    var _a;
+    let current = rule;
+    while (current === null || current === void 0 ? void 0 : current.parent) {
+        current = current.parent;
+        if (isStScopeStatement(current) && ((_a = current.parent) === null || _a === void 0 ? void 0 : _a.type) === 'root') {
+            return current;
+        }
+    }
+    return;
+}
 //# sourceMappingURL=st-scope.js.map

dist/index-internal.d.ts

@@ -15,3 +15,2 @@ export { safeParse } from './parser';
 export { createStylableFileProcessor } from './create-stylable-processor';
-export { createDefaultResolver } from './module-resolver';
 export { packageNamespaceFactory } from './resolve-namespace-factories';
@@ -18,0 +17,0 @@ import { createBooleanStateClassName, createStateWithParamClassName, resolveStateParam } from './pseudo-states';

dist/index-internal.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getAstNodeAt = exports.systemValidators = exports.createCustomValue = exports.pseudoStates = exports.packageNamespaceFactory = exports.createDefaultResolver = exports.createStylableFileProcessor = exports.cachedProcessFile = exports.StylableResolver = exports.reportDiagnostic = exports.emitDiagnostics = exports.namespaceDelimiter = exports.namespace = exports.makeAbsolute = exports.isAsset = exports.knownPseudoClassesWithNestedSelectors = exports.nativePseudoElements = exports.nativePseudoClasses = exports.cssParse = exports.murmurhash3_32_gc = exports.STCustomSelector = exports.transformerDiagnostics = exports.StylableTransformer = exports.StylableProcessor = exports.processorDiagnostics = exports.safeParse = void 0;
+exports.getAstNodeAt = exports.systemValidators = exports.createCustomValue = exports.pseudoStates = exports.packageNamespaceFactory = exports.createStylableFileProcessor = exports.cachedProcessFile = exports.StylableResolver = exports.reportDiagnostic = exports.emitDiagnostics = exports.namespaceDelimiter = exports.namespace = exports.makeAbsolute = exports.isAsset = exports.knownPseudoClassesWithNestedSelectors = exports.nativePseudoElements = exports.nativePseudoClasses = exports.cssParse = exports.murmurhash3_32_gc = exports.STCustomSelector = exports.transformerDiagnostics = exports.StylableTransformer = exports.StylableProcessor = exports.processorDiagnostics = exports.safeParse = void 0;
 var parser_1 = require("./parser");
@@ -37,4 +37,2 @@ Object.defineProperty(exports, "safeParse", { enumerable: true, get: function () { return parser_1.safeParse; } });
 Object.defineProperty(exports, "createStylableFileProcessor", { enumerable: true, get: function () { return create_stylable_processor_1.createStylableFileProcessor; } });
-var module_resolver_1 = require("./module-resolver");
-Object.defineProperty(exports, "createDefaultResolver", { enumerable: true, get: function () { return module_resolver_1.createDefaultResolver; } });
 var resolve_namespace_factories_1 = require("./resolve-namespace-factories");
@@ -41,0 +39,0 @@ Object.defineProperty(exports, "packageNamespaceFactory", { enumerable: true, get: function () { return resolve_namespace_factories_1.packageNamespaceFactory; } });

dist/index.d.ts

@@ -13,4 +13,5 @@ export { Stylable, StylableConfig } from './stylable';
 export { CustomValueStrategy, createCustomValue } from './custom-values';
+export { createDefaultResolver } from './module-resolver';
 export { parseModuleImportStatement, ensureModuleImport } from './helpers/import';
 export { validateCustomPropertyName } from './helpers/css-custom-property';
 //# sourceMappingURL=index.d.ts.map

dist/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.validateCustomPropertyName = exports.ensureModuleImport = exports.parseModuleImportStatement = exports.createCustomValue = exports.CustomValueStrategy = exports.processNamespace = exports.defaultNamespaceBuilder = exports.defaultNoMatchHandler = exports.createNamespaceStrategy = exports.noCollisionNamespace = exports.StylableMeta = exports.Diagnostics = exports.Stylable = void 0;
+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");
@@ -21,2 +21,4 @@ Object.defineProperty(exports, "Stylable", { enumerable: true, get: function () { return stylable_1.Stylable; } });
 Object.defineProperty(exports, "createCustomValue", { enumerable: true, get: function () { return custom_values_1.createCustomValue; } });
+var module_resolver_1 = require("./module-resolver");
+Object.defineProperty(exports, "createDefaultResolver", { enumerable: true, get: function () { return module_resolver_1.createDefaultResolver; } });
 // low-level api
@@ -23,0 +25,0 @@ var import_1 = require("./helpers/import");

dist/stylable.d.ts

@@ -9,3 +9,3 @@ import type { CacheItem, FileProcessor, MinimalFS } from './cached-process-file';
 import type { IStylableOptimizer, ModuleResolver } from './types';
-import { STImport, STVar, STMixin } from './features';
+import { STImport, STScope, STVar, STMixin, CSSClass } from './features';
 import { Dependency } from './visit-meta-css-dependencies';
@@ -39,4 +39,6 @@ export interface StylableConfig {
     stModule: STImport.StylablePublicApi;
+    stScope: STScope.StylablePublicApi;
     stVar: STVar.StylablePublicApi;
     stMixin: STMixin.StylablePublicApi;
+    cssClass: CSSClass.StylablePublicApi;
     projectRoot: string;
@@ -64,4 +66,3 @@ protected fileSystem: MinimalFS;
     private createTransformer;
-    transform(meta: StylableMeta): StylableResults;
-    transform(source: string, resourcePath: string): StylableResults;
+    transform(pathOrMeta: string | StylableMeta, options?: Partial<TransformerOptions>): StylableResults;
     transformSelector(pathOrMeta: string | StylableMeta, selector: string, options?: Partial<TransformerOptions>): {
@@ -68,0 +69,0 @@ selector: string;

dist/stylable.js

@@ -40,4 +40,6 @@ "use strict";
         this.stModule = new features_1.STImport.StylablePublicApi(this);
+        this.stScope = new features_1.STScope.StylablePublicApi(this);
         this.stVar = new features_1.STVar.StylablePublicApi(this);
         this.stMixin = new features_1.STMixin.StylablePublicApi(this);
+        this.cssClass = new features_1.CSSClass.StylablePublicApi(this);
         this.diagnostics = new diagnostics_1.Diagnostics();
@@ -111,8 +113,5 @@ this.projectRoot = config.projectRoot;
     }
-    transform(metaOrSource, resourcePath, options = {}, processorOptions = {}) {
-        const meta = typeof metaOrSource === 'string'
-            ? this.createProcessor(processorOptions).process(this.cssParser(metaOrSource, { from: resourcePath }))
-            : metaOrSource;
+    transform(pathOrMeta, options = {}) {
+        const meta = typeof pathOrMeta === `string` ? this.analyze(pathOrMeta) : pathOrMeta;
         const transformer = this.createTransformer(options);
-        this.fileProcessor.add(meta.source, meta);
         return transformer.transform(meta);
@@ -119,0 +118,0 @@ }

package.json

 {
   "name": "@stylable/core",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "CSS for Components",
@@ -20,3 +20,3 @@ "main": "dist/index.js",
     "deindent": "^0.1.0",
-    "enhanced-resolve": "^5.9.3",
+    "enhanced-resolve": "^5.10.0",
     "is-vendor-prefixed": "^4.0.0",
@@ -23,0 +23,0 @@ "lodash.clonedeep": "^4.5.0",

src/features/css-class.ts

@@ -14,3 +14,4 @@ import { createFeature, FeatureContext } from './feature';
 import { validateRuleStateDefinition } from '../helpers/custom-state';
-import type {
+import type { Stylable } from '../stylable';
+import {
     ImmutableClass,
@@ -20,2 +21,3 @@ Class,
     ImmutableSelectorNode,
+    stringifySelectorAst,
 } from '@tokey/css-selector-parser';
@@ -168,2 +170,27 @@ import type * as postcss from 'postcss';
 
+export class StylablePublicApi {
+    constructor(private stylable: Stylable) {}
+    public transformIntoSelector(meta: StylableMeta, name: string): string | undefined {
+        const localSymbol = STSymbol.get(meta, name);
+        const resolved =
+            localSymbol?._kind === 'import'
+                ? this.stylable.resolver.deepResolve(localSymbol)
+                : { _kind: 'css', meta, symbol: localSymbol };
+
+        if (resolved?._kind !== 'css' || resolved.symbol?._kind !== 'class') {
+            return undefined;
+        }
+
+        const node: Class = {
+            type: 'class',
+            value: '',
+            start: 0,
+            end: 0,
+            dotComments: [],
+        };
+        namespaceClass(resolved.meta, resolved.symbol, node, meta);
+        return stringifySelectorAst(node);
+    }
+}
+
 export function get(meta: StylableMeta, name: string): ClassSymbol | undefined {
@@ -170,0 +197,0 @@ return STSymbol.get(meta, name, `class`);

src/features/st-mixin.ts

@@ -9,2 +9,3 @@ import { createFeature, FeatureTransformContext } from './feature';
 import { createSubsetAst } from '../helpers/rule';
+import { scopeNestedSelector } from '../helpers/selector';
 import { mixinHelperDiagnostics, parseStMixin, parseStPartialMixin } from '../helpers/mixin';
@@ -23,2 +24,3 @@ import { resolveArgumentsValue } from '../functions';
 import type { Stylable } from '../stylable';
+import { parseCssSelector } from '@tokey/css-selector-parser';
 
@@ -191,2 +193,6 @@ export interface MixinValue {
     }
+    public scopeNestedSelector(scopeSelector: string, nestSelector: string): string {
+        return scopeNestedSelector(parseCssSelector(scopeSelector), parseCssSelector(nestSelector))
+            .selector;
+    }
 }
@@ -193,0 +199,0 @@

src/features/st-scope.ts

 import { createFeature } from './feature';
 import { parseSelectorWithCache, scopeNestedSelector } from '../helpers/selector';
+import type { Stylable } from '../stylable';
 import type { ImmutablePseudoClass } from '@tokey/css-selector-parser';
@@ -47,3 +48,10 @@ import * as postcss from 'postcss';
 
-function isStScopeStatement(node: postcss.ChildNode): node is postcss.AtRule {
+export class StylablePublicApi {
+    constructor(private stylable: Stylable) {}
+    public getStScope(rule: postcss.Rule) {
+        return getStScope(rule);
+    }
+}
+
+function isStScopeStatement(node: any): node is postcss.AtRule {
     return node.type === 'atrule' && node.name === 'st-scope';
@@ -64,1 +72,12 @@ }
 }
+
+function getStScope(rule: postcss.Rule): postcss.AtRule | undefined {
+    let current: postcss.Container | postcss.Document = rule;
+    while (current?.parent) {
+        current = current.parent;
+        if (isStScopeStatement(current) && current.parent?.type === 'root') {
+            return current;
+        }
+    }
+    return;
+}

src/index-internal.ts

@@ -31,3 +31,2 @@ export { safeParse } from './parser';
 export { createStylableFileProcessor } from './create-stylable-processor';
-export { createDefaultResolver } from './module-resolver';
 export { packageNamespaceFactory } from './resolve-namespace-factories';
@@ -34,0 +33,0 @@ import {

src/index.ts

@@ -35,2 +35,3 @@ export { Stylable, StylableConfig } from './stylable';
 export { CustomValueStrategy, createCustomValue } from './custom-values';
+export { createDefaultResolver } from './module-resolver';
 
@@ -37,0 +38,0 @@ // low-level api

src/stylable.ts

@@ -17,3 +17,3 @@ import type { CacheItem, FileProcessor, MinimalFS } from './cached-process-file';
 import { createDefaultResolver } from './module-resolver';
-import { STImport, STVar, STMixin, CSSCustomProperty } from './features';
+import { STImport, STScope, STVar, STMixin, CSSClass, CSSCustomProperty } from './features';
 import { Dependency, visitMetaCSSDependencies } from './visit-meta-css-dependencies';
@@ -53,4 +53,6 @@ import * as postcss from 'postcss';
     public stModule = new STImport.StylablePublicApi(this);
+    public stScope = new STScope.StylablePublicApi(this);
     public stVar = new STVar.StylablePublicApi(this);
     public stMixin = new STMixin.StylablePublicApi(this);
+    public cssClass = new CSSClass.StylablePublicApi(this);
     //
@@ -151,19 +153,8 @@ public projectRoot: string;
     }
-    // ToDo: unify signature - accept only meta + optional transformer options
-    public transform(meta: StylableMeta): StylableResults;
-    public transform(source: string, resourcePath: string): StylableResults;
     public transform(
-        metaOrSource: string | StylableMeta,
-        resourcePath?: string,
-        options: Partial<TransformerOptions> = {},
-        processorOptions: CreateProcessorOptions = {}
+        pathOrMeta: string | StylableMeta,
+        options: Partial<TransformerOptions> = {}
     ): StylableResults {
-        const meta =
-            typeof metaOrSource === 'string'
-                ? this.createProcessor(processorOptions).process(
-                      this.cssParser(metaOrSource, { from: resourcePath })
-                  )
-                : metaOrSource;
+        const meta = typeof pathOrMeta === `string` ? this.analyze(pathOrMeta) : pathOrMeta;
         const transformer = this.createTransformer(options);
-        this.fileProcessor.add(meta.source, meta);
         return transformer.transform(meta);
@@ -170,0 +161,0 @@ }

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

1026066

increased by0.58%

Lines of code

18294

increased by0.57%

Dependency changes

• Updatedenhanced-resolve@^5.10.0