@jesscss/core 2.0.0-alpha.5 → 2.0.0-alpha.6

package/src/tree/selector-compound.ts

@@ -0,0 +1,205 @@
+import {
+  defineType,
+  type OptionalLocation
+} from './node.js';
+import type { Context } from '../context.js';
+import { Nil } from './nil.js';
+import { Selector } from './selector.js';
+import type { SimpleSelector } from './selector-simple.js';
+import { isNode } from './util/is-node.js';
+import { type MaybePromise, pipe, isThenable, serialForEach } from '@jesscss/awaitable-pipe';
+import { type PrintOptions, getPrintOptions } from './util/print.js';
+import { N } from './node-type.js';
+
+export type CompoundSelectorChildData = { value: SimpleSelector[] };
+
+/**
+ * @example
+ * .class#id
+ *
+ * Must have at least 2 selectors. Otherwise it would be collapsed.
+ */
+/** Anything other than type (element) or universal, which must come first */
+const nonElementRegex = /^[.#:[]/;
+export interface CompoundSelector {
+  type: 'CompoundSelector';
+  shortType: 'compound';
+}
+export class CompoundSelector extends Selector<SimpleSelector[], any, CompoundSelectorChildData> {
+  static override childKeys = ['value'] as const;
+
+  value!: SimpleSelector[];
+
+  constructor(value: SimpleSelector[], options?: any, location?: any, treeContext?: any) {
+    super(value, options, location, treeContext);
+    this.value = value;
+    for (const child of value) {
+      if (child instanceof Selector) {
+        this.adopt(child);
+      }
+    }
+  }
+
+  get length() {
+    return this.value.length;
+  }
+
+  override clone(deep?: boolean): this {
+    if (deep) {
+      return super.clone(true) as this;
+    }
+    return this._withValue(this.value) as this;
+  }
+
+  private _withValue(value: SimpleSelector[]): CompoundSelector {
+    const location = Array.isArray(this.location) && this.location.length === 6
+      ? this.location as OptionalLocation
+      : undefined;
+    const node = new (this.constructor as typeof CompoundSelector)(
+      [],
+      this.options ? { ...this.options } : undefined,
+      location,
+      this.treeContext
+    );
+    node.inherit(this);
+    node.value = value;
+    return node;
+  }
+
+  override valueOf() {
+    let value = this._valueOf;
+    if (!value) {
+      const components = this.value;
+      const preserveGeneratedPseudoOrder = components.some(component =>
+        (isNode(component, N.PseudoSelector) && component.generated)
+        || isNode(component, N.Ampersand)
+      );
+
+      if (preserveGeneratedPseudoOrder) {
+        value = components.map(component => component.valueOf()).join('');
+        this._valueOf = value;
+        return value;
+      }
+
+      const elementSelectors: string[] = [];
+      const nonElementSelectors: string[] = [];
+
+      const processComponents = (components: SimpleSelector[]) => {
+        for (const component of components) {
+          if (
+            isNode(component, N.PseudoSelector)
+            && component.get('name') === ':is'
+            && isNode(component.get('arg'), N.CompoundSelector)
+          ) {
+            processComponents((component.get('arg') as CompoundSelector).get('value'));
+            continue;
+          }
+          value = component.valueOf();
+          if (!nonElementRegex.test(value)) {
+            elementSelectors.push(value);
+          } else {
+            nonElementSelectors.push(value);
+          }
+        }
+      };
+      processComponents(components);
+
+      value = [...elementSelectors, ...nonElementSelectors.sort()].join('');
+      this._valueOf = value;
+    }
+    return value;
+  }
+
+  override toTrimmedString(options?: PrintOptions): string {
+    options = getPrintOptions(options);
+    const w = options.writer!;
+    const data = this.get('value', options.context);
+    const mark = w.mark();
+    for (const item of data) {
+      const out = w.capture(() => item.toString(options));
+      w.add(out.trim(), item);
+    }
+    return w.getSince(mark);
+  }
+
+  override evalNode(context: Context): MaybePromise<CompoundSelector | Selector | Nil> {
+    return pipe(
+      () => {
+        const sel = super.evalNode(context) as CompoundSelector;
+        const value = [...sel.get('value', context)];
+        let changed = false;
+        const maybe = serialForEach(value.map((_, i) => i), (i: number) => {
+          const out = value[i]!.eval(context);
+          if (isThenable(out)) {
+            return (out as Promise<SimpleSelector>).then((res) => {
+              if (res !== value[i]) {
+                value[i] = res as SimpleSelector;
+                changed = true;
+              }
+              return undefined;
+            });
+          }
+          if ((out as SimpleSelector) !== value[i]) {
+            value[i] = out as SimpleSelector;
+            changed = true;
+          }
+          return undefined;
+        });
+        if (isThenable(maybe)) {
+          return (maybe as Promise<void>).then(() => {
+            if (changed) {
+              return sel === this
+                ? this._withValue(value)
+                : (() => {
+                    sel.value = value;
+                    return sel;
+                  })();
+            }
+            return sel;
+          });
+        }
+        if (changed) {
+          return sel === this
+            ? this._withValue(value)
+            : (() => {
+                sel.value = value;
+                return sel;
+              })();
+        }
+        return sel;
+      },
+      (sel) => {
+        let data: SimpleSelector[] = sel.get('value', context).filter(n => n && !(n instanceof Nil));
+        const preserveGeneratedPseudoOrder = data.some(component =>
+          (isNode(component, N.PseudoSelector) && component.generated)
+          || isNode(component, N.Ampersand)
+        );
+        if (!preserveGeneratedPseudoOrder) {
+          data = data.sort((a: SimpleSelector, b: SimpleSelector) => {
+            let aIsElement = !nonElementRegex.test(a.valueOf());
+            let bIsElement = !nonElementRegex.test(b.valueOf());
+            if (aIsElement && bIsElement) {
+              return a.valueOf() < b.valueOf() ? -1 : 1;
+            }
+            return aIsElement ? -1 : bIsElement ? 1 : 0;
+          });
+        }
+        if (data.length === 0) {
+          return (new Nil()).inherit(this);
+        }
+        if (data.length === 1) {
+          return data[0]!.inherit(this) as Selector;
+        }
+        const nextValue = [...data];
+        return sel === this
+          ? this._withValue(nextValue)
+          : (() => {
+              sel.value = nextValue;
+              return sel;
+            })();
+      }
+    );
+  }
+}
+
+export const compound = defineType(CompoundSelector, 'CompoundSelector', 'compound');

package/src/tree/selector-interpolated.ts

@@ -0,0 +1,95 @@
+import type { Context } from '../context.js';
+import { defineType, Node, F_MAY_ASYNC, F_NON_STATIC, type OptionalLocation, type NodeOptions, type TreeContext } from './node.js';
+import { SimpleSelector } from './selector-simple.js';
+import { Selector } from './selector.js';
+import type { BitSetLibrary } from './util/bitset.js';
+import { Interpolated } from './interpolated.js';
+import { getPrintOptions, type PrintOptions } from './util/print.js';
+import { type MaybePromise, isThenable } from '@jesscss/awaitable-pipe';
+
+const { isArray } = Array;
+
+function propagateKeySetLibrary(sel: Selector, library: BitSetLibrary<string>) {
+  sel.keySetLibrary = library;
+  const childKeys = (sel.constructor as typeof Node).childKeys;
+  if (!childKeys) {
+    return;
+  }
+  for (const key of childKeys) {
+    const field = (sel as unknown as Record<string, unknown>)[key];
+    if (isArray(field)) {
+      for (const child of field as Selector[]) {
+        if (child && !child.keySetLibrary) {
+          propagateKeySetLibrary(child, library);
+        }
+      }
+    }
+  }
+}
+
+export type InterpolatedSelectorChildData = { value: Interpolated };
+
+export interface InterpolatedSelector extends SimpleSelector<Interpolated, NodeOptions, InterpolatedSelectorChildData> {
+  type: 'InterpolatedSelector';
+  shortType: 'interpolated-selector';
+  eval(context: Context): MaybePromise<Selector>;
+}
+
+/**
+ * A selector that wraps an interpolated value
+ * This allows interpolation to be used in selector contexts
+ */
+export class InterpolatedSelector extends SimpleSelector<Interpolated, NodeOptions, InterpolatedSelectorChildData> {
+  static override childKeys = ['value'] as const;
+
+  readonly value!: Interpolated;
+
+  constructor(value: Interpolated, options?: NodeOptions, location?: OptionalLocation, treeContext?: TreeContext) {
+    super(value, options, location, treeContext);
+    this.value = value;
+    if (this.value instanceof Node) {
+      this.adopt(this.value);
+    }
+    this.addFlag(F_NON_STATIC);
+    this.addFlag(F_MAY_ASYNC);
+  }
+
+  get isClass() {
+    return /^\./.test(this.valueOf());
+  }
+
+  get isId() {
+    return /^#/.test(this.valueOf());
+  }
+
+  get isTag() {
+    return /^[^.#*]/.test(this.valueOf());
+  }
+
+  override evalNode(context: Context): MaybePromise<Selector> {
+    const result = this.value.evalToSelector(context);
+    const library = context.selectorBits;
+    if (isThenable(result)) {
+      return (result as Promise<Selector>).then((sel) => {
+        propagateKeySetLibrary(sel, library);
+        return sel;
+      });
+    }
+    propagateKeySetLibrary(result as Selector, library);
+    return result;
+  }
+
+  override toTrimmedString(options?: PrintOptions): string {
+    options = getPrintOptions(options);
+    const w = options.writer!;
+    const mark = w.mark();
+    this.value.toString(options);
+    return w.getSince(mark);
+  }
+
+  override valueOf(): string {
+    return this.value.valueOf();
+  }
+}
+
+export const interpolatedSelector = defineType(InterpolatedSelector, 'InterpolatedSelector', 'interpolated-selector');

package/src/tree/selector-list.ts

@@ -0,0 +1,245 @@
+import {
+  defineType,
+  F_EXTENDED,
+  F_EXTEND_TARGET,
+  type OptionalLocation
+} from './node.js';
+import { type Context } from '../context.js';
+import { Selector } from './selector.js';
+import { type PrintOptions, getPrintOptions } from './util/print.js';
+import { type MaybePromise, pipe, isThenable, serialForEach } from '@jesscss/awaitable-pipe';
+import { isNode } from './util/is-node.js';
+import { N } from './node-type.js';
+import { selectorMatch } from './util/selector-match-core.js';
+
+export type SelectorListChildData = { value: Selector[] };
+
+export interface SelectorList {
+  type: 'SelectorList';
+  shortType: 'sellist';
+}
+
+/** Constructs */
+export class SelectorList extends Selector<Selector[], any, SelectorListChildData> {
+  static override childKeys = ['value'] as const;
+
+  value!: Selector[];
+
+  constructor(value: Selector[], options?: any, location?: any, treeContext?: any) {
+    super(value, options, location, treeContext);
+    this.value = value;
+    for (const child of value) {
+      if (child instanceof Selector) {
+        this.adopt(child);
+      }
+    }
+  }
+
+  get length() {
+    return this.value.length;
+  }
+
+  override clone(deep?: boolean): this {
+    if (deep) {
+      return super.clone(true) as this;
+    }
+    return this._withValue(this.value) as this;
+  }
+
+  private _withValue(value: Selector[]): SelectorList {
+    const location = Array.isArray(this.location) && this.location.length === 6
+      ? this.location as OptionalLocation
+      : undefined;
+    const node = new (this.constructor as typeof SelectorList)(
+      [],
+      this.options ? { ...this.options } : undefined,
+      location,
+      this.treeContext
+    );
+    node.inherit(this);
+    node.value = value;
+    return node;
+  }
+
+  /** Normalize selectors on separate lines with indentation */
+  override toTrimmedString(options?: PrintOptions) {
+    options = getPrintOptions(options);
+    const w = options.writer!;
+    let depth = options.depth!;
+    let space = ''.padStart(depth * 2);
+    // Flatten generated top-level `:is(...)` items into the selector list.
+    const sourceValue = this.get('value', options.context);
+    const value: Selector[] = [];
+    for (const item of sourceValue) {
+      if (isNode(item, N.PseudoSelector) && item.get('name') === ':is') {
+        const arg = item.get('arg');
+        if (arg && isNode(arg, N.SelectorList)) {
+          value.push(...arg.get('value'));
+          continue;
+        }
+      }
+      if (isNode(item, N.CompoundSelector) && item.get('value').length === 1) {
+        const only = item.get('value')[0]!;
+        if (isNode(only, N.PseudoSelector) && only.get('name') === ':is') {
+          const arg = only.get('arg');
+          if (arg && isNode(arg, N.SelectorList)) {
+            value.push(...arg.get('value'));
+            continue;
+          }
+        }
+      }
+      if (isNode(item, N.ComplexSelector) && item.get('value').length === 1) {
+        const only = item.get('value')[0]!;
+        if (isNode(only, N.PseudoSelector) && only.get('name') === ':is') {
+          const arg = only.get('arg');
+          if (arg && isNode(arg, N.SelectorList)) {
+            value.push(...arg.get('value'));
+            continue;
+          }
+        }
+      }
+      value.push(item);
+    }
+    if (
+      options.referenceMode === true
+      && options.referenceRenderEnabled === true
+      && options.referenceFilterTargets === true
+    ) {
+      const extendedOnly = value.filter(item =>
+        item.hasFlag(F_EXTENDED) && !item.hasFlag(F_EXTEND_TARGET)
+      );
+      if (extendedOnly.length > 0) {
+        value.splice(0, value.length, ...extendedOnly);
+      }
+    }
+    let length = value.length;
+    if (length === 0) {
+      return '';
+    }
+    const mark = w.mark();
+    let item = value[0]!;
+
+    let out = w.capture(() => item.toString(options));
+    w.add(out.trim(), item);
+
+    for (let i = 1; i < length; i++) {
+      item = value[i]!;
+      w.add(`,\n${space}`);
+      out = (w.capture(() => item.toString(options))).trim();
+      w.add(out);
+    }
+    return w.getSince(mark);
+  }
+
+  override valueOf() {
+    const itemValues = this.value.map(item => item.valueOf());
+    return itemValues.join(',');
+  }
+
+  override compare(b: Selector, context?: Context): 0 | 1 | -1 | undefined {
+    if (!isNode(b, N.Selector)) {
+      return super.compare(b as unknown as Selector, context);
+    }
+    const semantic = selectorMatch(this, b, undefined, context);
+    if (semantic.fullMatch) {
+      return 0;
+    }
+    return super.compare(b, context);
+  }
+
+  override evalNode(context: Context): MaybePromise<SelectorList | Selector> {
+    return pipe(
+      () => {
+        const list = super.evalNode(context) as SelectorList;
+        const value = [...list.get('value', context)];
+        let changed = false;
+        const maybe = serialForEach(value.map((_, i) => i), (i) => {
+          const out = value[i]!.eval(context);
+          if (isThenable(out)) {
+            return (out as Promise<Selector>).then((res) => {
+              if (res !== value[i]) {
+                value[i] = res as Selector;
+                changed = true;
+              }
+              return undefined;
+            });
+          }
+          if ((out as Selector) !== value[i]) {
+            value[i] = out as Selector;
+            changed = true;
+          }
+          return undefined;
+        });
+        if (isThenable(maybe)) {
+          return (maybe as Promise<void>).then(() => {
+            if (changed) {
+              return list === this
+                ? this._withValue(value)
+                : (() => {
+                    list.value = value;
+                    return list;
+                  })();
+            }
+            return list;
+          });
+        }
+        if (changed) {
+          return list === this
+            ? this._withValue(value)
+            : (() => {
+                list.value = value;
+                return list;
+              })();
+        }
+        return list;
+      },
+      (list) => {
+        const value = list.get('value', context);
+        const flattened: Selector[] = [];
+        for (const item of value) {
+          if (isNode(item, N.PseudoSelector) && item.get('name') === ':is') {
+            const arg = item.get('arg');
+            if (arg && isNode(arg, N.SelectorList)) {
+              flattened.push(...arg.get('value'));
+              continue;
+            }
+          }
+          if (isNode(item, N.CompoundSelector) && item.get('value').length === 1) {
+            const only = item.get('value')[0]!;
+            if (isNode(only, N.PseudoSelector) && only.get('name') === ':is') {
+              const arg = only.get('arg');
+              if (arg && isNode(arg, N.SelectorList)) {
+                flattened.push(...arg.get('value'));
+                continue;
+              }
+            }
+          }
+          if (isNode(item, N.ComplexSelector) && item.get('value').length === 1) {
+            const only = item.get('value')[0]!;
+            if (isNode(only, N.PseudoSelector) && only.get('name') === ':is') {
+              const arg = only.get('arg');
+              if (arg && isNode(arg, N.SelectorList)) {
+                flattened.push(...arg.get('value'));
+                continue;
+              }
+            }
+          }
+          flattened.push(item);
+        }
+        if (flattened.length !== value.length) {
+          if (list === this) {
+            list = this._withValue(flattened);
+          } else {
+            list.value = flattened;
+          }
+        }
+        if (flattened.length === 1) {
+          return flattened[0]!;
+        }
+        return list;
+      }
+    );
+  }
+}
+
+export const sellist = defineType(SelectorList, 'SelectorList', 'sellist');