@shapeshift-labs/frontier-lang-css 0.1.7 → 0.1.9

package/dist/index.d.ts

@@ -13,6 +13,7 @@ export interface CssProjectionOptions {
   readonly cssModuleCompositionGraphHash?: string;
   readonly icssGraphHash?: string;
   readonly scopedCascadeGraphHash?: string;
+  readonly selectorTargetGraphHash?: string;
   readonly targetPath?: string;
   readonly semanticIndexId?: string;
   readonly sourceSpansBySemanticNodeId?: Readonly<Record<string, CssSourceSpan>>;
@@ -143,6 +144,7 @@ export interface CssSemanticRecord {
   readonly scopeKey?: string;
   readonly statementText?: string;
   readonly scopedCascadeGraphHash?: string;
+  readonly selectorTargetGraphHash?: string;
   readonly sourceSpan: CssSourceSpan;
   readonly sourceHash: string;
   readonly parser?: 'postcss' | string;
@@ -222,86 +224,90 @@ export interface CssSemanticSheet {
 }
 
 export interface CssSemanticMergeEvidence {
-  readonly kind: 'frontier.lang.cssSemanticMergeEvidence';
-  readonly version: 1;
-  readonly status: 'ready' | 'needs-review' | string;
-  readonly sourcePath?: string;
-  readonly sourceHash: string;
-  readonly sheetHash: string;
+  readonly kind: 'frontier.lang.cssSemanticMergeEvidence'; readonly version: 1;
+  readonly status: 'ready' | 'needs-review' | string; readonly sourcePath?: string; readonly sourceHash: string; readonly sheetHash: string;
   readonly records: readonly CssSemanticRecord[];
   readonly cssModules?: CssModuleEvidence;
   readonly proofGaps: readonly CssSemanticProofGap[];
-  readonly autoMergeClaim: false;
-  readonly semanticEquivalenceClaim: false;
-  readonly cssModuleGeneratedNameEquivalenceClaim: false;
-  readonly cssModuleUseSiteEquivalenceClaim: false;
-  readonly browserCascadeEquivalenceClaim: false;
-  readonly browserRenderEquivalenceClaim: false;
+  readonly autoMergeClaim: false; readonly semanticEquivalenceClaim: false;
+  readonly cssModuleGeneratedNameEquivalenceClaim: false; readonly cssModuleUseSiteEquivalenceClaim: false;
+  readonly browserCascadeEquivalenceClaim: false; readonly browserRenderEquivalenceClaim: false;
 }
 
 export interface CssSafeMergeConflict {
-  readonly code: string;
-  readonly gateId: 'css-semantic-merge' | string;
-  readonly sourcePath?: string;
+  readonly code: string; readonly gateId: 'css-semantic-merge' | string; readonly sourcePath?: string;
   readonly details: Readonly<Record<string, unknown>> & { readonly reasonCode: string; readonly conflictKey: string };
 }
 
 export interface CssSafeMergeAdmission {
-  readonly status: 'auto-merge-candidate' | 'blocked' | string;
-  readonly action: 'apply-css' | 'human-review' | string;
-  readonly reviewRequired: boolean;
-  readonly reasonCodes: readonly string[];
+  readonly status: 'auto-merge-candidate' | 'blocked' | string; readonly action: 'apply-css' | 'human-review' | string;
+  readonly reviewRequired: boolean; readonly reasonCodes: readonly string[];
 }
 
 export interface CssSafeMergeResult {
-  readonly kind: 'frontier.lang.cssSafeMerge';
-  readonly version: 1;
-  readonly id: string;
-  readonly sourcePath?: string;
-  readonly status: 'merged' | 'blocked' | string;
-  readonly operation: string;
-  readonly mergedSourceText?: string;
-  readonly mergedSourceHash?: string;
+  readonly kind: 'frontier.lang.cssSafeMerge'; readonly version: 1; readonly id: string; readonly sourcePath?: string;
+  readonly status: 'merged' | 'blocked' | string; readonly operation: string;
+  readonly mergedSourceText?: string; readonly mergedSourceHash?: string;
   readonly conflicts: readonly CssSafeMergeConflict[];
   readonly admission: CssSafeMergeAdmission;
-  readonly autoMergeClaim: false;
-  readonly semanticEquivalenceClaim: false;
-  readonly baseSheetHash?: string;
-  readonly workerSheetHash?: string;
-  readonly headSheetHash?: string;
-  readonly workerChangedDeclarations?: number;
-  readonly headChangedDeclarations?: number;
-  readonly workerChangedCssModuleContracts?: number;
-  readonly headChangedCssModuleContracts?: number;
-  readonly parserEvidence?: CssSafeMergeParserEvidence;
+  readonly autoMergeClaim: false; readonly semanticEquivalenceClaim: false;
+  readonly baseSheetHash?: string; readonly workerSheetHash?: string; readonly headSheetHash?: string;
+  readonly workerChangedDeclarations?: number; readonly headChangedDeclarations?: number;
+  readonly workerChangedCssModuleContracts?: number; readonly headChangedCssModuleContracts?: number;
+  readonly parserEvidence?: CssSafeMergeParserEvidence; readonly selectorTargetEvidence?: CssSafeMergeSelectorTargetEvidence;
 }
 
 export interface CssSafeMergeParserEvidence {
-  readonly kind: 'frontier.lang.cssSafeMergeParserEvidence';
-  readonly version: 1;
-  readonly parserNames: readonly string[];
+  readonly kind: 'frontier.lang.cssSafeMergeParserEvidence'; readonly version: 1; readonly parserNames: readonly string[];
   readonly sourceCodeLocationInfo: boolean; readonly parserBackedSourceSpans: boolean; readonly parserBackedDeclarationSpans: boolean; readonly parserBackedTriviaHashes: boolean;
-  readonly scopedCascadeGraphHashPresent: boolean; readonly parseErrors: number;
-  readonly sides: Readonly<Record<string, CssSafeMergeParserSideEvidence>>;
+  readonly scopedCascadeGraphHashPresent: boolean; readonly parseErrors: number; readonly sides: Readonly<Record<string, CssSafeMergeParserSideEvidence>>;
 }
 
 export interface CssSafeMergeParserSideEvidence {
-  readonly parserName: string;
-  readonly sourceCodeLocationInfo: boolean; readonly parserBackedSourceSpans: boolean; readonly parserBackedDeclarationSpans: boolean; readonly parserBackedTriviaHashes: boolean;
+  readonly parserName: string; readonly sourceCodeLocationInfo: boolean; readonly parserBackedSourceSpans: boolean; readonly parserBackedDeclarationSpans: boolean; readonly parserBackedTriviaHashes: boolean;
   readonly scopedCascadeGraphHashPresent: boolean; readonly parseErrors: number; readonly recordCount: number; readonly declarationCount: number;
 }
 
+export interface CssSafeMergeSelectorTargetEvidence {
+  readonly kind: 'frontier.lang.cssSafeMergeSelectorTargetEvidence'; readonly version: 1; readonly selectorTargetGraphHashPresent: boolean; readonly parserBackedRuleSpans: boolean;
+  readonly selectorMoveCount: number; readonly workerSelectorMoves: number; readonly headSelectorMoves: number;
+  readonly sides: Readonly<Record<string, CssSafeMergeSelectorTargetSideEvidence>>;
+  readonly moves: Readonly<Record<'worker' | 'head', readonly CssSafeMergeSelectorMove[]>>;
+  readonly rebasedChangeCount?: number; readonly rebaseProofs?: readonly CssSafeMergeSelectorTargetRebaseProof[];
+}
+
+export interface CssSafeMergeSelectorTargetSideEvidence {
+  readonly ruleCount: number; readonly selectorCount: number; readonly declarationCount: number; readonly scopedRuleCount: number;
+  readonly selectorTargetGraphHashPresent: boolean; readonly parserBackedRuleSpans: boolean; readonly selectorSpecificityRecords: number;
+}
+
+export interface CssSafeMergeSelectorMove {
+  readonly side: string; readonly property: string; readonly beforeRuleKey: string; readonly afterRuleKey: string;
+  readonly beforeSelectors?: readonly string[]; readonly afterSelectors?: readonly string[]; readonly beforeScopes?: readonly string[]; readonly afterScopes?: readonly string[];
+  readonly declarationHash: string; readonly beforeSelectorTargetGraphHash?: string; readonly afterSelectorTargetGraphHash?: string; readonly selectorTargetGraphHashPresent: boolean;
+}
+
+export interface CssSafeMergeSelectorTargetRebaseProof {
+  readonly kind: 'css-selector-target-rebase'; readonly side: string; readonly fromRuleKey: string; readonly toRuleKey: string; readonly property: string; readonly cascadeKey: string;
+}
+
+export interface CssSelectorTargetEquivalence {
+  readonly fromRuleKey?: string; readonly toRuleKey?: string; readonly fromSelectors?: readonly string[]; readonly toSelectors?: readonly string[]; readonly graphHash?: string;
+}
+
 export interface CssSafeMergeInput {
   readonly id?: string; readonly sourcePath?: string; readonly baseSourceText?: string; readonly workerSourceText?: string; readonly headSourceText?: string;
   readonly cssModule?: boolean; readonly cssModules?: boolean;
   readonly generatedClassNameMap?: Readonly<Record<string, string>>;
   readonly generatedClassNameMapHash?: string; readonly jsTsUseSiteGraphHash?: string; readonly cssModuleCompositionGraphHash?: string; readonly icssGraphHash?: string; readonly scopedCascadeGraphHash?: string;
+  readonly selectorTargetGraphHash?: string; readonly selectorTargetEquivalences?: readonly CssSelectorTargetEquivalence[];
   readonly baseGeneratedClassNameMap?: Readonly<Record<string, string>>; readonly workerGeneratedClassNameMap?: Readonly<Record<string, string>>; readonly headGeneratedClassNameMap?: Readonly<Record<string, string>>;
   readonly baseGeneratedClassNameMapHash?: string; readonly workerGeneratedClassNameMapHash?: string; readonly headGeneratedClassNameMapHash?: string;
   readonly baseJsTsUseSiteGraphHash?: string; readonly workerJsTsUseSiteGraphHash?: string; readonly headJsTsUseSiteGraphHash?: string;
   readonly baseCssModuleCompositionGraphHash?: string; readonly workerCssModuleCompositionGraphHash?: string; readonly headCssModuleCompositionGraphHash?: string;
   readonly baseIcssGraphHash?: string; readonly workerIcssGraphHash?: string; readonly headIcssGraphHash?: string;
   readonly baseScopedCascadeGraphHash?: string; readonly workerScopedCascadeGraphHash?: string; readonly headScopedCascadeGraphHash?: string;
+  readonly baseSelectorTargetGraphHash?: string; readonly workerSelectorTargetGraphHash?: string; readonly headSelectorTargetGraphHash?: string;
 }
 
 export declare function toCssAst(document: FrontierLangDocument, options?: CssProjectionOptions): CssAstStylesheet;

package/dist/postcss-parser-evidence.js

@@ -61,6 +61,7 @@ function postcssRuleRecord(node, scopes, sourceHash, options) {
     })),
     customProperties: declarations.filter((declaration) => declaration.property.startsWith('--')).map((declaration) => declaration.property),
     scopedCascadeGraphHash: scopes.length ? options.scopedCascadeGraphHash : undefined,
+    selectorTargetGraphHash: options.selectorTargetGraphHash,
     sourceSpan: sourceSpanFromPostcss(node.source, options.sourcePath),
     sourceHash,
     rawTextHash: hashSemanticValue({ kind: 'frontier.lang.css.rawRuleText.v1', text: node.toString() }),

package/dist/semantic-merge-css-modules.js

@@ -9,7 +9,8 @@ function sheetOptions(input, side, sourcePath) {
     jsTsUseSiteGraphHash: input[`${prefix}JsTsUseSiteGraphHash`] ?? input.jsTsUseSiteGraphHash,
     cssModuleCompositionGraphHash: input[`${prefix}CssModuleCompositionGraphHash`] ?? input.cssModuleCompositionGraphHash,
     icssGraphHash: input[`${prefix}IcssGraphHash`] ?? input.icssGraphHash,
-    scopedCascadeGraphHash: input[`${prefix}ScopedCascadeGraphHash`] ?? input.scopedCascadeGraphHash
+    scopedCascadeGraphHash: input[`${prefix}ScopedCascadeGraphHash`] ?? input.scopedCascadeGraphHash,
+    selectorTargetGraphHash: input[`${prefix}SelectorTargetGraphHash`] ?? input.selectorTargetGraphHash
   };
 }
 

package/dist/semantic-merge-selector-targets.js

@@ -0,0 +1,139 @@
+function mergeSelectorTargetEvidence(sheets, changed) {
+  const entries = Object.entries(sheets).map(([side, sheet]) => [side, sheetSelectorTargetEvidence(sheet)]);
+  const moves = { worker: selectorTargetMoves(changed.worker, 'worker'), head: selectorTargetMoves(changed.head, 'head') };
+  return {
+    kind: 'frontier.lang.cssSafeMergeSelectorTargetEvidence',
+    version: 1,
+    selectorTargetGraphHashPresent: entries.every(([, evidence]) => evidence.selectorTargetGraphHashPresent === true),
+    parserBackedRuleSpans: entries.every(([, evidence]) => evidence.parserBackedRuleSpans === true),
+    selectorMoveCount: moves.worker.length + moves.head.length,
+    workerSelectorMoves: moves.worker.length,
+    headSelectorMoves: moves.head.length,
+    sides: Object.fromEntries(entries),
+    moves
+  };
+}
+
+function sheetSelectorTargetEvidence(sheet) {
+  const rules = (sheet.records ?? []).filter((record) => record.kind === 'rule');
+  return {
+    ruleCount: rules.length,
+    selectorCount: rules.reduce((sum, record) => sum + (record.selectors?.length ?? 0), 0),
+    declarationCount: rules.reduce((sum, record) => sum + (record.declarations?.length ?? 0), 0),
+    scopedRuleCount: rules.filter((record) => (record.scopes ?? []).length > 0).length,
+    selectorTargetGraphHashPresent: rules.length === 0 || rules.every((record) => Boolean(record.selectorTargetGraphHash)),
+    parserBackedRuleSpans: rules.every((record) => record.parser === 'postcss' && record.sourceSpan?.startOffset !== undefined),
+    selectorSpecificityRecords: rules.filter((record) => Array.isArray(record.specificity)).length
+  };
+}
+
+function selectorTargetMoves(changes, side) {
+  const deletions = changes.filter((change) => change.kind === 'delete' && change.before);
+  const additions = changes.filter((change) => change.kind === 'add' && change.after);
+  const moves = [];
+  const usedAdditions = new Set();
+  for (const deletion of deletions) {
+    const addition = additions.find((candidate) => !usedAdditions.has(candidate) && sameDeclarationTargetSignature(deletion.before, candidate.after) && deletion.before.ruleKey !== candidate.after.ruleKey);
+    if (!addition) continue;
+    usedAdditions.add(addition);
+    moves.push({
+      side,
+      property: deletion.before.property,
+      beforeRuleKey: deletion.before.ruleKey,
+      afterRuleKey: addition.after.ruleKey,
+      beforeSelectors: deletion.before.selectors,
+      afterSelectors: addition.after.selectors,
+      beforeScopes: deletion.before.scopes,
+      afterScopes: addition.after.scopes,
+      declarationHash: addition.after.declarationHash,
+      beforeSelectorTargetGraphHash: deletion.before.selectorTargetGraphHash,
+      afterSelectorTargetGraphHash: addition.after.selectorTargetGraphHash,
+      selectorTargetGraphHashPresent: Boolean(deletion.before.selectorTargetGraphHash && addition.after.selectorTargetGraphHash)
+    });
+  }
+  return moves;
+}
+
+function planSelectorTargetRebase(id, sourcePath, selectorTargetEvidence, changed, options = {}) {
+  const planned = { worker: [...changed.worker], head: [...changed.head] };
+  const worker = selectorTargetMoveSidePlan(id, sourcePath, selectorTargetEvidence.moves.worker, selectorTargetEvidence.moves.head, planned.head, options);
+  const head = selectorTargetMoveSidePlan(id, sourcePath, selectorTargetEvidence.moves.head, selectorTargetEvidence.moves.worker, planned.worker, options);
+  return {
+    changed: planned,
+    conflicts: [...worker.conflicts, ...head.conflicts],
+    evidence: { ...selectorTargetEvidence, rebasedChangeCount: worker.rebaseProofs.length + head.rebaseProofs.length, rebaseProofs: [...worker.rebaseProofs, ...head.rebaseProofs] }
+  };
+}
+
+function selectorTargetMoveSidePlan(id, sourcePath, moves, oppositeMoves, oppositeChanges, options) {
+  const conflicts = [];
+  const rebaseProofs = [];
+  for (const move of moves) {
+    if (oppositeMoves.some((oppositeMove) => sameSelectorMove(move, oppositeMove))) continue;
+    for (let index = 0; index < oppositeChanges.length; index += 1) {
+      const change = oppositeChanges[index];
+      if (!selectorMoveTouchesChange(move, change)) continue;
+      if (canRebaseChange(move, change, options)) {
+        const rebased = rebaseChangeToSelectorMove(change, move);
+        oppositeChanges[index] = rebased.change;
+        rebaseProofs.push(rebased.proof);
+      } else conflicts.push(conflict(id, sourcePath, change.key, move, change));
+    }
+  }
+  return { conflicts, rebaseProofs };
+}
+
+function canRebaseChange(move, change, options) {
+  return change.kind === 'add' && change.after && hasSelectorTargetEquivalence(move, options);
+}
+
+function hasSelectorTargetEquivalence(move, options) {
+  return (options.selectorTargetEquivalences ?? []).some((entry) => {
+    const ruleKeysMatch = entry.fromRuleKey === move.beforeRuleKey && entry.toRuleKey === move.afterRuleKey;
+    const selectorsMatch = selectorListKey(entry.fromSelectors) === selectorListKey(move.beforeSelectors) && selectorListKey(entry.toSelectors) === selectorListKey(move.afterSelectors);
+    const graphMatches = !entry.graphHash || entry.graphHash === move.beforeSelectorTargetGraphHash || entry.graphHash === move.afterSelectorTargetGraphHash;
+    return graphMatches && (ruleKeysMatch || selectorsMatch);
+  });
+}
+
+function rebaseChangeToSelectorMove(change, move) {
+  const after = { ...change.after, ruleKey: move.afterRuleKey, selectors: move.afterSelectors, scopes: move.afterScopes ?? [], key: cascadeKey(move.afterScopes, move.afterSelectors, change.after.property), rebasedFromRuleKey: move.beforeRuleKey };
+  return {
+    change: { ...change, key: after.key, after },
+    proof: { kind: 'css-selector-target-rebase', side: change.side, fromRuleKey: move.beforeRuleKey, toRuleKey: move.afterRuleKey, property: change.after.property, cascadeKey: after.key }
+  };
+}
+
+function conflict(id, sourcePath, cascadeKey, selectorMove, change) {
+  return {
+    code: 'css-selector-target-conflict',
+    gateId: 'css-semantic-merge',
+    sourcePath,
+    details: {
+      reasonCode: 'css-selector-target-rebase-unproved',
+      conflictKey: `css#${id}#css-selector-target-rebase-unproved#${cascadeKey ?? sourcePath ?? 'source'}`,
+      cascadeKey,
+      selectorMove,
+      opposite: changeDetails(change)
+    }
+  };
+}
+
+function selectorMoveTouchesChange(move, change) {
+  const entry = change.after ?? change.before;
+  return entry?.ruleKey === move.beforeRuleKey || entry?.ruleKey === move.afterRuleKey;
+}
+
+function sameDeclarationTargetSignature(left, right) {
+  return Boolean(left && right && left.property === right.property && left.value === right.value && left.important === right.important);
+}
+
+function sameSelectorMove(left, right) {
+  return left.property === right.property && left.beforeRuleKey === right.beforeRuleKey && left.afterRuleKey === right.afterRuleKey && left.declarationHash === right.declarationHash;
+}
+
+function cascadeKey(scopes = [], selectors = [], property) { return [...scopes, selectors.join(','), property].join('::'); }
+function selectorListKey(value = []) { return Array.isArray(value) ? value.join(',') : undefined; }
+function changeDetails(change) { return { kind: change.kind, property: (change.after ?? change.before)?.property, value: change.after?.value, important: change.after?.important }; }
+
+export { mergeSelectorTargetEvidence, planSelectorTargetRebase };

package/dist/semantic-merge.js

@@ -1,4 +1,5 @@
 import { cssModuleContractChanges, cssModuleContractConflicts, sheetOptions, unsupportedSourceShapeConflicts } from './semantic-merge-css-modules.js';
+import { mergeSelectorTargetEvidence, planSelectorTargetRebase } from './semantic-merge-selector-targets.js';
 
 function safeMergeCssSource(input = {}, context = {}) {
   const parseSheet = context.parseCssSemanticSheet;
@@ -29,10 +30,11 @@ function safeMergeCssSource(input = {}, context = {}) {
   ];
   const moduleConflicts = cssModuleContractConflicts(id, sourcePath, moduleChanges);
   const sourceShapeConflicts = unsupportedSourceShapeConflicts(id, sourcePath, sheets, changed, hash);
-  const conflicts = [...parserConflicts, ...proofConflicts, ...overlapConflicts, ...moduleConflicts, ...sourceShapeConflicts];
   const parserEvidence = mergeParserEvidence(sheets);
-  if (conflicts.length) return blocked(id, sourcePath, 'css-semantic-merge-conflict', conflicts, { parserEvidence });
-  const mergedIndex = applyDeclarationChanges(applyDeclarationChanges(indexes.base, changed.head), changed.worker);
+  const selectorTargetPlan = planSelectorTargetRebase(id, sourcePath, mergeSelectorTargetEvidence(sheets, changed), changed, input);
+  const conflicts = [...parserConflicts, ...proofConflicts, ...overlapConflicts, ...moduleConflicts, ...sourceShapeConflicts, ...selectorTargetPlan.conflicts];
+  if (conflicts.length) return blocked(id, sourcePath, 'css-semantic-merge-conflict', conflicts, { parserEvidence, selectorTargetEvidence: selectorTargetPlan.evidence });
+  const mergedIndex = applyDeclarationChanges(applyDeclarationChanges(indexes.base, selectorTargetPlan.changed.head), selectorTargetPlan.changed.worker);
   return merged(id, sourcePath, renderDeclarationIndex(mergedIndex), 'semantic-declaration-merge', hash, {
     baseSheetHash: sheets.base.sheetHash,
     workerSheetHash: sheets.worker.sheetHash,
@@ -41,7 +43,8 @@ function safeMergeCssSource(input = {}, context = {}) {
     headChangedDeclarations: changed.head.length,
     workerChangedCssModuleContracts: moduleChanges.worker.length,
     headChangedCssModuleContracts: moduleChanges.head.length,
-    parserEvidence
+    parserEvidence,
+    selectorTargetEvidence: selectorTargetPlan.evidence
   });
 }
 
@@ -71,6 +74,7 @@ function declarationIndex(sheet) {
         value: declaration.value,
         important: declaration.important,
         declarationHash: declaration.declarationHash,
+        selectorTargetGraphHash: record.selectorTargetGraphHash,
         proofGaps: proofGapsForDeclaration(record, declaration)
       };
       declarations.set(entry.key, entry);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shapeshift-labs/frontier-lang-css",
-  "version": "0.1.7",
+  "version": "0.1.9",
   "description": "CSS semantic merge evidence and projection adapter for Frontier Lang semantic source documents.",
   "type": "module",
   "main": "./dist/index.js",