@shapeshift-labs/frontier-lang-css 0.1.10 → 0.1.12

package/README.md

@@ -232,11 +232,11 @@ const merge = safeMergeCssSource({
 });
 ```
 
-`sourceMap.mappings` links emitted rule blocks back to Frontier Lang semantic node ids. `createCssSemanticMergeEvidence` records selectors, specificity, declarations, custom properties, `var()` fallback references, animation/keyframe links, font-face links, URL asset references, cascade keys, statement-form at-rules, CSS Modules exports, ICSS edges, scoped cascade graph proof hashes, source spans, stable hashes, and fail-closed proof gaps for cascade/render-sensitive CSS surfaces. `safeMergeCssSource` admits independent declaration edits by cascade key, including existing scoped `@media` / `@supports` / `@container` / `@layer` declarations when a scoped cascade graph proof hash is supplied, carries source-bound dependency graph evidence into the merge result, preserves unchanged statement-form at-rules such as `@layer reset, components;`, and for `.module.css` files it classifies exported local classes, `composes`, and ICSS import/export records as explicit merge contracts.
+`sourceMap.mappings` links emitted rule blocks back to Frontier Lang semantic node ids. `createCssSemanticMergeEvidence` records selectors, specificity, declarations, custom properties, `var()` fallback references, animation/keyframe links, font-face links, URL asset references, cascade keys, statement-form at-rules, CSS Modules exports, ICSS edges, scoped cascade graph proof hashes, source spans, stable hashes, and fail-closed proof gaps for cascade/render-sensitive CSS surfaces. `safeMergeCssSource` admits independent declaration edits by cascade key, including existing scoped `@media` / `@supports` / `@container` / `@layer` declarations when a scoped cascade graph proof hash is supplied, carries source-bound dependency graph evidence into the merge result, blocks parallel edits whose CSS shorthand expansions overlap a longhand or sub-shorthand, preserves unchanged statement-form at-rules such as `@layer reset, components;`, and for `.module.css` files it classifies exported local classes, `composes`, and ICSS import/export records as explicit merge contracts. Cascade-sensitive source-shape changes still block by default, but a host can attach a `css-source-bound-cascade-runtime-proof` / `css-cascade-runtime-proof` that is bound to the exact source path, reason, side, shape key, and base/worker/head/output source hashes to admit that specific change.
 
 ## Support Boundary
 
-- Ready evidence: style rules, selectors, specificity, declarations, source-bound dependency graph hashes for custom properties, `var()` fallbacks, animations/keyframes, font faces, and URL assets, statement-form at-rules, CSS Modules local exports, generated class-name map coverage, JS/TS use-site graph hashes, composition graph hashes, ICSS graph hashes, scoped cascade graph hashes, source spans, stable hashes.
-- Safe merge: independent declarations with non-overlapping cascade keys; unchanged statement-form at-rules preserved in canonical output; existing scoped declaration edits when scoped cascade graph proof is supplied; explicit CSS Modules export additions/deletions when generated class-name and JS/TS use-site graph proof is supplied; composition edits when composition graph proof is supplied; ICSS edits when ICSS graph proof is supplied. Output is a canonical CSS render and not a byte/trivia-preserving claim.
-- Review-only gaps: incomplete generated class-name maps, unproved CSS Modules use-site graphs, unproved composition or ICSS graphs, shorthands without longhand expansion, statement-form at-rule order/condition changes, one-sided or structurally changed scoped cascade under `@media` / `@supports` / `@container` / `@layer`, `@keyframes`, `@font-face`, `@page`, browser layout and render equivalence.
-- Claims: dependency graph evidence is an admission/review signal only; `autoMergeClaim`, `semanticEquivalenceClaim`, `browserCascadeEquivalenceClaim`, and `browserRenderEquivalenceClaim` remain false.
+- Ready evidence: style rules, selectors, specificity, declarations, source-bound dependency graph hashes for custom properties, `var()` fallbacks, animations/keyframes, font faces, and URL assets, statement-form at-rules, CSS Modules local exports, generated class-name map coverage, JS/TS use-site graph hashes, composition graph hashes, ICSS graph hashes, scoped cascade graph hashes, source-bound cascade runtime proofs, source spans, stable hashes.
+- Safe merge: independent declarations with non-overlapping cascade keys and non-overlapping shorthand expansion sets; unchanged statement-form at-rules preserved in canonical output; existing scoped declaration edits when scoped cascade graph proof is supplied; source-shape/cascade-sensitive edits only when an exact source-bound cascade runtime proof is supplied; explicit CSS Modules export additions/deletions when generated class-name and JS/TS use-site graph proof is supplied; composition edits when composition graph proof is supplied; ICSS edits when ICSS graph proof is supplied. Output is a canonical CSS render and not a byte/trivia-preserving claim.
+- Review-only gaps: incomplete generated class-name maps, unproved CSS Modules use-site graphs, unproved composition or ICSS graphs, shorthand value expansion/equivalence beyond known affected-property overlap checks, statement-form at-rule order/condition changes, one-sided or structurally changed scoped cascade under `@media` / `@supports` / `@container` / `@layer`, `@keyframes`, `@font-face`, `@page`, browser layout and render equivalence.
+- Claims: dependency graph evidence is an admission/review signal only; `autoMergeClaim`, `semanticEquivalenceClaim`, and `browserRenderEquivalenceClaim` remain false. `browserCascadeEquivalenceClaim` is only true on a safe-merge result when a source-bound cascade runtime proof admits the specific cascade-sensitive source-shape change.

package/dist/cascade-runtime-proof.d.ts

@@ -0,0 +1,34 @@
+export interface CssCascadeRuntimeProof {
+  readonly id?: string;
+  readonly kind: 'css-cascade-runtime-proof' | 'css-source-bound-cascade-runtime-proof' | string;
+  readonly status: 'passed' | string;
+  readonly proofLevel?: string;
+  readonly sourcePath?: string;
+  readonly reasonCode?: string;
+  readonly reasonCodes?: readonly string[];
+  readonly side?: 'worker' | 'head' | string;
+  readonly sides?: readonly string[];
+  readonly shapeKey?: string;
+  readonly shapeKeys?: readonly string[];
+  readonly baseSourceText?: string; readonly workerSourceText?: string; readonly headSourceText?: string; readonly outputSourceText?: string; readonly mergedSourceText?: string;
+  readonly baseSourceHash?: string; readonly workerSourceHash?: string; readonly headSourceHash?: string; readonly outputSourceHash?: string; readonly mergedSourceHash?: string;
+  readonly sourceTexts?: Readonly<Record<string, string>>;
+  readonly sources?: Readonly<Record<string, string>>;
+  readonly sourceHashes?: Readonly<Record<string, string>>;
+  readonly hashes?: Readonly<Record<string, string>>;
+}
+
+export interface CssCascadeRuntimeProofRecord {
+  readonly id?: string;
+  readonly kind: string;
+  readonly status: 'passed';
+  readonly proofLevel: string;
+  readonly reasonCode: string;
+  readonly side: string;
+  readonly shapeKey: string;
+  readonly sourcePath?: string;
+  readonly baseSourceHash?: string;
+  readonly workerSourceHash?: string;
+  readonly headSourceHash?: string;
+  readonly outputSourceHash?: string;
+}

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import type { FrontierLangDocument } from '@shapeshift-labs/frontier-lang-kernel'; import type { CssDependencyGraphEvidence } from './dependency-graph.js';
+import type { FrontierLangDocument } from '@shapeshift-labs/frontier-lang-kernel'; import type { CssCascadeRuntimeProof, CssCascadeRuntimeProofRecord } from './cascade-runtime-proof.js'; import type { CssDependencyGraphEvidence } from './dependency-graph.js'; export type { CssCascadeRuntimeProof, CssCascadeRuntimeProofRecord } from './cascade-runtime-proof.js';
 
 export interface CssProjectionOptions {
   readonly banner?: string;
@@ -13,6 +13,8 @@ export interface CssProjectionOptions {
   readonly cssModuleCompositionGraphHash?: string;
   readonly icssGraphHash?: string;
   readonly scopedCascadeGraphHash?: string;
+  readonly cssCascadeRuntimeProof?: CssCascadeRuntimeProof; readonly cssCascadeRuntimeProofs?: readonly CssCascadeRuntimeProof[];
+  readonly cssSourceBoundCascadeProof?: CssCascadeRuntimeProof; readonly cssSourceBoundCascadeProofs?: readonly CssCascadeRuntimeProof[];
   readonly selectorTargetGraphHash?: string;
   readonly targetPath?: string;
   readonly semanticIndexId?: string;
@@ -20,36 +22,16 @@ export interface CssProjectionOptions {
   readonly evidence?: readonly CssProjectionEvidenceRecord[];
 }
 
-export interface CssProjectionEvidenceRecord {
-  readonly id: string;
-  readonly kind?: string;
-  readonly summary?: string;
-  readonly [key: string]: unknown;
-}
+export interface CssProjectionEvidenceRecord { readonly id: string; readonly kind?: string; readonly summary?: string; readonly [key: string]: unknown; }
 
 export interface CssSourceSpan {
-  readonly path?: string;
-  readonly startOffset?: number;
-  readonly endOffset?: number;
-  readonly startLine: number;
-  readonly startColumn: number;
-  readonly endLine: number;
-  readonly endColumn: number;
+  readonly path?: string; readonly startOffset?: number; readonly endOffset?: number;
+  readonly startLine: number; readonly startColumn: number; readonly endLine: number; readonly endColumn: number;
 }
 
-export interface CssParserDiagnostic {
-  readonly reason?: string;
-  readonly line?: number;
-  readonly column?: number;
-  readonly input?: string;
-  readonly [key: string]: unknown;
-}
+export interface CssParserDiagnostic { readonly reason?: string; readonly line?: number; readonly column?: number; readonly input?: string; readonly [key: string]: unknown; }
 
-export interface CssParserEvidence {
-  readonly name: 'postcss' | string;
-  readonly sourceCodeLocationInfo: boolean;
-  readonly parseErrors: readonly CssParserDiagnostic[];
-}
+export interface CssParserEvidence { readonly name: 'postcss' | string; readonly sourceCodeLocationInfo: boolean; readonly parseErrors: readonly CssParserDiagnostic[]; }
 
 export interface CssSourceRef {
   readonly semanticNodeId: string;
@@ -242,6 +224,8 @@ export interface CssSafeMergeConflict {
 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 browserCascadeEquivalenceClaim?: true;
+  readonly cssCascadeRuntimeProofs?: readonly CssCascadeRuntimeProofRecord[];
 }
 
 export interface CssSafeMergeResult {
@@ -251,10 +235,12 @@ export interface CssSafeMergeResult {
   readonly conflicts: readonly CssSafeMergeConflict[];
   readonly admission: CssSafeMergeAdmission;
   readonly autoMergeClaim: false; readonly semanticEquivalenceClaim: false;
+  readonly browserCascadeEquivalenceClaim: boolean; readonly browserRenderEquivalenceClaim: 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; readonly dependencyGraphEvidence?: CssDependencyGraphEvidence;
+  readonly cascadeRuntimeProofs?: readonly CssCascadeRuntimeProofRecord[];
 }
 
 export interface CssSafeMergeParserEvidence {
@@ -300,6 +286,14 @@ export interface CssSafeMergeInput {
   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 cssCascadeRuntimeProof?: CssCascadeRuntimeProof; readonly cssCascadeRuntimeProofs?: readonly CssCascadeRuntimeProof[];
+  readonly cssCascadeRuntimeProofsByPath?: Readonly<Record<string, CssCascadeRuntimeProof | readonly CssCascadeRuntimeProof[]>>;
+  readonly cssSourceBoundCascadeProof?: CssCascadeRuntimeProof; readonly cssSourceBoundCascadeProofs?: readonly CssCascadeRuntimeProof[];
+  readonly cssSourceBoundCascadeProofsByPath?: Readonly<Record<string, CssCascadeRuntimeProof | readonly CssCascadeRuntimeProof[]>>;
+  readonly cascadeRuntimeProof?: CssCascadeRuntimeProof; readonly cascadeRuntimeProofs?: readonly CssCascadeRuntimeProof[];
+  readonly cascadeRuntimeProofsByPath?: Readonly<Record<string, CssCascadeRuntimeProof | readonly CssCascadeRuntimeProof[]>>;
+  readonly sourceBoundCascadeProof?: CssCascadeRuntimeProof; readonly sourceBoundCascadeProofs?: readonly CssCascadeRuntimeProof[];
+  readonly sourceBoundCascadeProofsByPath?: Readonly<Record<string, CssCascadeRuntimeProof | readonly CssCascadeRuntimeProof[]>>;
   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;

package/dist/postcss-parser-evidence.js

@@ -1,7 +1,7 @@
 import { hashSemanticValue } from '@shapeshift-labs/frontier-lang-kernel';
 import postcss from 'postcss';
 
-const ShorthandProperties = new Set(['all', 'animation', 'background', 'border', 'border-block', 'border-color', 'border-image', 'border-inline', 'border-radius', 'border-style', 'border-width', 'columns', 'flex', 'font', 'gap', 'grid', 'grid-area', 'grid-column', 'grid-row', 'inset', 'list-style', 'margin', 'offset', 'outline', 'overflow', 'padding', 'place-content', 'place-items', 'place-self', 'text-decoration', 'transition']);
+const ShorthandProperties = new Set(['all', 'animation', 'background', 'border', 'border-block', 'border-block-color', 'border-block-end', 'border-block-start', 'border-block-style', 'border-block-width', 'border-bottom', 'border-color', 'border-image', 'border-inline', 'border-inline-color', 'border-inline-end', 'border-inline-start', 'border-inline-style', 'border-inline-width', 'border-left', 'border-radius', 'border-right', 'border-style', 'border-top', 'border-width', 'columns', 'flex', 'font', 'gap', 'grid', 'grid-area', 'grid-column', 'grid-row', 'inset', 'inset-block', 'inset-inline', 'list-style', 'margin', 'margin-block', 'margin-inline', 'offset', 'outline', 'overflow', 'overscroll-behavior', 'padding', 'padding-block', 'padding-inline', 'place-content', 'place-items', 'place-self', 'scroll-margin', 'scroll-margin-block', 'scroll-margin-inline', 'scroll-padding', 'scroll-padding-block', 'scroll-padding-inline', 'text-decoration', 'transition']);
 const RuntimeAtRules = new Set(['keyframes', 'font-face', 'page', 'property']);
 const ScopeAtRules = new Set(['media', 'supports', 'container', 'layer', 'scope']);
 

package/dist/semantic-merge-cascade-runtime.js

@@ -0,0 +1,82 @@
+function admitCascadeRuntimeProofs({ id, sourcePath, input, sourceShapeChanges, binding, hash }) {
+  const proofs = cascadeRuntimeProofCandidates(input, sourcePath);
+  const admitted = [];
+  const conflicts = [];
+  for (const change of sourceShapeChanges) {
+    const proof = proofs.find((candidate) => isCascadeRuntimeProofForChange(candidate, change, sourcePath, binding, hash));
+    if (proof) admitted.push(cascadeRuntimeProofRecord(proof, change, sourcePath, binding, hash));
+    else conflicts.push(conflict(id, sourcePath, 'css-source-shape-unsupported', change.reasonCode, change));
+  }
+  return { proofs: admitted, conflicts };
+}
+
+function cascadeRuntimeProofCandidates(input = {}, sourcePath) {
+  return [
+    input.cssCascadeRuntimeProof,
+    input.cssCascadeRuntimeProofs,
+    input.cssCascadeRuntimeProofsByPath?.[sourcePath],
+    input.cssSourceBoundCascadeProof,
+    input.cssSourceBoundCascadeProofs,
+    input.cssSourceBoundCascadeProofsByPath?.[sourcePath],
+    input.cascadeRuntimeProof,
+    input.cascadeRuntimeProofs,
+    input.cascadeRuntimeProofsByPath?.[sourcePath],
+    input.sourceBoundCascadeProof,
+    input.sourceBoundCascadeProofs,
+    input.sourceBoundCascadeProofsByPath?.[sourcePath]
+  ].flatMap(asArray).filter(Boolean);
+}
+
+function isCascadeRuntimeProofForChange(proof, change, sourcePath, binding, hash) {
+  return Boolean(proof && typeof proof === 'object') &&
+    CascadeRuntimeProofKinds.has(proof.kind) &&
+    proof.status === 'passed' &&
+    proof.sourcePath === sourcePath &&
+    proofCoversValue(proof.reasonCode, proof.reasonCodes, change.reasonCode) &&
+    proofCoversValue(proof.side, proof.sides, change.side) &&
+    proofCoversValue(proof.shapeKey, proof.shapeKeys, change.shapeKey) &&
+    cascadeProofSourceMatches(proof, 'base', binding.base, hash) &&
+    cascadeProofSourceMatches(proof, 'worker', binding.worker, hash) &&
+    cascadeProofSourceMatches(proof, 'head', binding.head, hash) &&
+    cascadeProofSourceMatches(proof, 'output', binding.output, hash);
+}
+
+function cascadeProofSourceMatches(proof, role, sourceText, hash) {
+  if (typeof sourceText !== 'string') return false;
+  const sourceHash = hash?.(sourceText);
+  const textFields = role === 'output' ? ['outputSourceText', 'mergedSourceText'] : [`${role}SourceText`];
+  const hashFields = role === 'output' ? ['outputSourceHash', 'mergedSourceHash'] : [`${role}SourceHash`];
+  const aliases = role === 'output' ? ['output', 'merged'] : [role];
+  return textFields.some((field) => proof[field] === sourceText) ||
+    aliases.some((alias) => proof.sourceTexts?.[alias] === sourceText || proof.sources?.[alias] === sourceText) ||
+    hashFields.some((field) => sourceHash !== undefined && proof[field] === sourceHash) ||
+    aliases.some((alias) => sourceHash !== undefined && (proof.sourceHashes?.[alias] === sourceHash || proof.hashes?.[alias] === sourceHash));
+}
+
+function cascadeRuntimeProofRecord(proof, change, sourcePath, binding, hash) {
+  return {
+    id: proof.id,
+    kind: proof.kind,
+    status: 'passed',
+    proofLevel: proof.proofLevel ?? 'css-cascade-runtime-source-bound',
+    reasonCode: change.reasonCode,
+    side: change.side,
+    shapeKey: change.shapeKey,
+    sourcePath,
+    baseSourceHash: hash?.(binding.base),
+    workerSourceHash: hash?.(binding.worker),
+    headSourceHash: hash?.(binding.head),
+    outputSourceHash: hash?.(binding.output)
+  };
+}
+
+function conflict(id, sourcePath, code, reasonCode, details = {}) {
+  return { code, gateId: 'css-semantic-merge', sourcePath, details: { reasonCode, conflictKey: `css#${id}#${reasonCode}#${details.cascadeKey ?? details.shapeKey ?? sourcePath ?? 'source'}`, ...details } };
+}
+
+function proofCoversValue(value, values, expected) { return value === expected || (Array.isArray(values) && values.includes(expected)); }
+function asArray(value) { return Array.isArray(value) ? value : value === undefined ? [] : [value]; }
+
+const CascadeRuntimeProofKinds = new Set(['css-cascade-runtime-proof', 'css-source-bound-cascade-runtime-proof']);
+
+export { admitCascadeRuntimeProofs };

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

@@ -131,14 +131,18 @@ function cssModuleOverlapConflicts(id, sourcePath, workerChanges, headChanges) {
 }
 
 function unsupportedSourceShapeConflicts(id, sourcePath, sheets, declarationChanges, hash) {
-  const sourceShapeChanges = {
-    worker: unsupportedSourceShapeChanges(sheets.base, sheets.worker, declarationChanges.worker, 'worker', hash),
-    head: unsupportedSourceShapeChanges(sheets.base, sheets.head, declarationChanges.head, 'head', hash)
-  };
-  return [...sourceShapeChanges.worker, ...sourceShapeChanges.head].map((change) => conflict(id, sourcePath, 'css-source-shape-unsupported', change.reasonCode, change));
+  return unsupportedSourceShapeChanges(sheets, declarationChanges, hash)
+    .map((change) => conflict(id, sourcePath, 'css-source-shape-unsupported', change.reasonCode, change));
+}
+
+function unsupportedSourceShapeChanges(sheets, declarationChanges, hash) {
+  return [
+    ...unsupportedSourceShapeChangesForSide(sheets.base, sheets.worker, declarationChanges.worker, 'worker', hash),
+    ...unsupportedSourceShapeChangesForSide(sheets.base, sheets.head, declarationChanges.head, 'head', hash)
+  ];
 }
 
-function unsupportedSourceShapeChanges(baseSheet, currentSheet, declarationChanges, side, hash) {
+function unsupportedSourceShapeChangesForSide(baseSheet, currentSheet, declarationChanges, side, hash) {
   const baseShape = sourceShapeIndex(baseSheet, hash);
   const currentShape = sourceShapeIndex(currentSheet, hash);
   const keys = unique([...baseShape.keys(), ...currentShape.keys()]);
@@ -226,4 +230,4 @@ function uniqueProofGaps(values) {
   return [...byCode.values()];
 }
 
-export { cssModuleContractChanges, cssModuleContractConflicts, sheetOptions, unsupportedSourceShapeConflicts };
+export { cssModuleContractChanges, cssModuleContractConflicts, sheetOptions, unsupportedSourceShapeChanges, unsupportedSourceShapeConflicts };

package/dist/semantic-merge-shorthand.js

@@ -0,0 +1,147 @@
+function shorthandGroupForProperty(property) {
+  const normalized = normalizeProperty(property);
+  if (!normalized) return undefined;
+  if (ShorthandExpansionKeys.has(normalized)) return normalized;
+  for (const [group, keys] of ShorthandExpansionKeys) if (keys.has(normalized)) return group;
+  return undefined;
+}
+
+function declarationsOverlapByCssProperty(leftProperty, rightProperty) {
+  const left = normalizeProperty(leftProperty);
+  const right = normalizeProperty(rightProperty);
+  if (!left || !right) return false;
+  if (left === right) return true;
+  if (left.startsWith('--') || right.startsWith('--')) return false;
+  const leftKeys = affectedPropertyKeys(left);
+  const rightKeys = affectedPropertyKeys(right);
+  if (leftKeys.has(AllStandardProperties)) return !allPropertyExcluded(right);
+  if (rightKeys.has(AllStandardProperties)) return !allPropertyExcluded(left);
+  for (const key of leftKeys) if (rightKeys.has(key)) return true;
+  return false;
+}
+
+function affectedPropertyKeys(property) {
+  return ShorthandExpansionKeys.get(property) ?? new Set([property]);
+}
+
+function normalizeProperty(property) {
+  return String(property ?? '').trim().toLowerCase();
+}
+
+function allPropertyExcluded(property) {
+  return property.startsWith('--') || property === 'direction' || property === 'unicode-bidi';
+}
+
+const AllStandardProperties = '*';
+
+const ShorthandExpansionKeys = new Map(Object.entries({
+  all: [AllStandardProperties],
+  animation: ['animation-composition', 'animation-delay', 'animation-direction', 'animation-duration', 'animation-fill-mode', 'animation-iteration-count', 'animation-name', 'animation-play-state', 'animation-range-end', 'animation-range-start', 'animation-timeline', 'animation-timing-function'],
+  background: ['background-attachment', 'background-blend-mode', 'background-clip', 'background-color', 'background-image', 'background-origin', 'background-position', 'background-repeat', 'background-size'],
+  border: [
+    ...edgeKeys('border', ['width', 'style', 'color']),
+    'border-width',
+    'border-style',
+    'border-color',
+    'border-top',
+    'border-right',
+    'border-bottom',
+    'border-left'
+  ],
+  'border-block': [...logicalEdgeKeys('border-block', ['width', 'style', 'color']), 'border-block-width', 'border-block-style', 'border-block-color', 'border-block-start', 'border-block-end'],
+  'border-block-color': logicalEdgeKeys('border-block', ['color']),
+  'border-block-end': propertyTuple('border-block-end', ['width', 'style', 'color']),
+  'border-block-end-color': ['border-block-end-color'],
+  'border-block-end-style': ['border-block-end-style'],
+  'border-block-end-width': ['border-block-end-width'],
+  'border-block-start': propertyTuple('border-block-start', ['width', 'style', 'color']),
+  'border-block-start-color': ['border-block-start-color'],
+  'border-block-start-style': ['border-block-start-style'],
+  'border-block-start-width': ['border-block-start-width'],
+  'border-block-style': logicalEdgeKeys('border-block', ['style']),
+  'border-block-width': logicalEdgeKeys('border-block', ['width']),
+  'border-bottom': propertyTuple('border-bottom', ['width', 'style', 'color']),
+  'border-bottom-color': ['border-bottom-color'],
+  'border-bottom-left-radius': ['border-bottom-left-radius'],
+  'border-bottom-right-radius': ['border-bottom-right-radius'],
+  'border-bottom-style': ['border-bottom-style'],
+  'border-bottom-width': ['border-bottom-width'],
+  'border-color': edgeKeys('border', ['color']),
+  'border-image': ['border-image-source', 'border-image-slice', 'border-image-width', 'border-image-outset', 'border-image-repeat'],
+  'border-inline': [...logicalEdgeKeys('border-inline', ['width', 'style', 'color']), 'border-inline-width', 'border-inline-style', 'border-inline-color', 'border-inline-start', 'border-inline-end'],
+  'border-inline-color': logicalEdgeKeys('border-inline', ['color']),
+  'border-inline-end': propertyTuple('border-inline-end', ['width', 'style', 'color']),
+  'border-inline-end-color': ['border-inline-end-color'],
+  'border-inline-end-style': ['border-inline-end-style'],
+  'border-inline-end-width': ['border-inline-end-width'],
+  'border-inline-start': propertyTuple('border-inline-start', ['width', 'style', 'color']),
+  'border-inline-start-color': ['border-inline-start-color'],
+  'border-inline-start-style': ['border-inline-start-style'],
+  'border-inline-start-width': ['border-inline-start-width'],
+  'border-inline-style': logicalEdgeKeys('border-inline', ['style']),
+  'border-inline-width': logicalEdgeKeys('border-inline', ['width']),
+  'border-left': propertyTuple('border-left', ['width', 'style', 'color']),
+  'border-left-color': ['border-left-color'],
+  'border-left-style': ['border-left-style'],
+  'border-left-width': ['border-left-width'],
+  'border-radius': ['border-top-left-radius', 'border-top-right-radius', 'border-bottom-right-radius', 'border-bottom-left-radius'],
+  'border-right': propertyTuple('border-right', ['width', 'style', 'color']),
+  'border-right-color': ['border-right-color'],
+  'border-right-style': ['border-right-style'],
+  'border-right-width': ['border-right-width'],
+  'border-style': edgeKeys('border', ['style']),
+  'border-top': propertyTuple('border-top', ['width', 'style', 'color']),
+  'border-top-color': ['border-top-color'],
+  'border-top-left-radius': ['border-top-left-radius'],
+  'border-top-right-radius': ['border-top-right-radius'],
+  'border-top-style': ['border-top-style'],
+  'border-top-width': ['border-top-width'],
+  'border-width': edgeKeys('border', ['width']),
+  columns: ['column-width', 'column-count'],
+  flex: ['flex-grow', 'flex-shrink', 'flex-basis'],
+  font: ['font-family', 'font-size', 'font-size-adjust', 'font-stretch', 'font-style', 'font-variant', 'font-weight', 'line-height'],
+  gap: ['row-gap', 'column-gap'],
+  grid: ['grid-template-rows', 'grid-template-columns', 'grid-template-areas', 'grid-auto-rows', 'grid-auto-columns', 'grid-auto-flow'],
+  'grid-area': ['grid-row-start', 'grid-column-start', 'grid-row-end', 'grid-column-end'],
+  'grid-column': ['grid-column-start', 'grid-column-end'],
+  'grid-row': ['grid-row-start', 'grid-row-end'],
+  inset: ['top', 'right', 'bottom', 'left'],
+  'inset-block': ['inset-block-start', 'inset-block-end'],
+  'inset-inline': ['inset-inline-start', 'inset-inline-end'],
+  'list-style': ['list-style-image', 'list-style-position', 'list-style-type'],
+  margin: ['margin-top', 'margin-right', 'margin-bottom', 'margin-left'],
+  'margin-block': ['margin-block-start', 'margin-block-end'],
+  'margin-inline': ['margin-inline-start', 'margin-inline-end'],
+  offset: ['offset-anchor', 'offset-distance', 'offset-path', 'offset-position', 'offset-rotate'],
+  outline: ['outline-color', 'outline-style', 'outline-width'],
+  overflow: ['overflow-x', 'overflow-y'],
+  'overscroll-behavior': ['overscroll-behavior-x', 'overscroll-behavior-y'],
+  padding: ['padding-top', 'padding-right', 'padding-bottom', 'padding-left'],
+  'padding-block': ['padding-block-start', 'padding-block-end'],
+  'padding-inline': ['padding-inline-start', 'padding-inline-end'],
+  'place-content': ['align-content', 'justify-content'],
+  'place-items': ['align-items', 'justify-items'],
+  'place-self': ['align-self', 'justify-self'],
+  'scroll-margin': ['scroll-margin-top', 'scroll-margin-right', 'scroll-margin-bottom', 'scroll-margin-left'],
+  'scroll-margin-block': ['scroll-margin-block-start', 'scroll-margin-block-end'],
+  'scroll-margin-inline': ['scroll-margin-inline-start', 'scroll-margin-inline-end'],
+  'scroll-padding': ['scroll-padding-top', 'scroll-padding-right', 'scroll-padding-bottom', 'scroll-padding-left'],
+  'scroll-padding-block': ['scroll-padding-block-start', 'scroll-padding-block-end'],
+  'scroll-padding-inline': ['scroll-padding-inline-start', 'scroll-padding-inline-end'],
+  'text-decoration': ['text-decoration-line', 'text-decoration-color', 'text-decoration-style', 'text-decoration-thickness'],
+  transition: ['transition-behavior', 'transition-delay', 'transition-duration', 'transition-property', 'transition-timing-function']
+}).map(([property, keys]) => [property, new Set(keys)]));
+
+function edgeKeys(prefix, attributes) {
+  return ['top', 'right', 'bottom', 'left'].flatMap((edge) => attributes.map((attribute) => `${prefix}-${edge}-${attribute}`));
+}
+
+function logicalEdgeKeys(prefix, attributes) {
+  return ['start', 'end'].flatMap((edge) => attributes.map((attribute) => `${prefix}-${edge}-${attribute}`));
+}
+
+function propertyTuple(prefix, attributes) {
+  return attributes.map((attribute) => `${prefix}-${attribute}`);
+}
+
+export { declarationsOverlapByCssProperty, shorthandGroupForProperty };

package/dist/semantic-merge.js

@@ -1,6 +1,8 @@
-import { cssModuleContractChanges, cssModuleContractConflicts, sheetOptions, unsupportedSourceShapeConflicts } from './semantic-merge-css-modules.js';
+import { cssModuleContractChanges, cssModuleContractConflicts, sheetOptions, unsupportedSourceShapeChanges } from './semantic-merge-css-modules.js';
+import { admitCascadeRuntimeProofs } from './semantic-merge-cascade-runtime.js';
 import { mergeCssDependencyGraphEvidence } from './dependency-graph.js';
 import { mergeSelectorTargetEvidence, planSelectorTargetRebase } from './semantic-merge-selector-targets.js';
+import { declarationsOverlapByCssProperty, shorthandGroupForProperty } from './semantic-merge-shorthand.js';
 
 function safeMergeCssSource(input = {}, context = {}) {
   const parseSheet = context.parseCssSemanticSheet;
@@ -30,14 +32,23 @@ function safeMergeCssSource(input = {}, context = {}) {
     ...shorthandOverlapConflicts(id, sourcePath, changed.worker, changed.head)
   ];
   const moduleConflicts = cssModuleContractConflicts(id, sourcePath, moduleChanges);
-  const sourceShapeConflicts = unsupportedSourceShapeConflicts(id, sourcePath, sheets, changed, hash);
   const parserEvidence = mergeParserEvidence(sheets);
   const dependencyGraphEvidence = mergeCssDependencyGraphEvidence(sheets, changed);
   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, dependencyGraphEvidence, selectorTargetEvidence: selectorTargetPlan.evidence });
+  const shapeChanges = unsupportedSourceShapeChanges(sheets, changed, hash);
   const mergedIndex = applyDeclarationChanges(applyDeclarationChanges(indexes.base, selectorTargetPlan.changed.head), selectorTargetPlan.changed.worker);
-  return merged(id, sourcePath, renderDeclarationIndex(mergedIndex), 'semantic-declaration-merge', hash, {
+  const mergedSourceText = renderDeclarationIndex(mergedIndex);
+  const cascadeRuntimeAdmission = admitCascadeRuntimeProofs({
+    id,
+    sourcePath,
+    input,
+    sourceShapeChanges: shapeChanges,
+    binding: { base, worker, head, output: mergedSourceText },
+    hash
+  });
+  const conflicts = [...parserConflicts, ...proofConflicts, ...overlapConflicts, ...moduleConflicts, ...cascadeRuntimeAdmission.conflicts, ...selectorTargetPlan.conflicts];
+  if (conflicts.length) return blocked(id, sourcePath, 'css-semantic-merge-conflict', conflicts, { parserEvidence, dependencyGraphEvidence, selectorTargetEvidence: selectorTargetPlan.evidence, cascadeRuntimeProofs: cascadeRuntimeAdmission.proofs });
+  return merged(id, sourcePath, mergedSourceText, 'semantic-declaration-merge', hash, {
     baseSheetHash: sheets.base.sheetHash,
     workerSheetHash: sheets.worker.sheetHash,
     headSheetHash: sheets.head.sheetHash,
@@ -47,7 +58,9 @@ function safeMergeCssSource(input = {}, context = {}) {
     headChangedCssModuleContracts: moduleChanges.head.length,
     parserEvidence,
     dependencyGraphEvidence,
-    selectorTargetEvidence: selectorTargetPlan.evidence
+    selectorTargetEvidence: selectorTargetPlan.evidence,
+    cascadeRuntimeProofs: cascadeRuntimeAdmission.proofs,
+    browserCascadeEquivalenceClaim: cascadeRuntimeAdmission.proofs.length > 0
   });
 }
 
@@ -184,9 +197,7 @@ function hasRelatedExistingDeclaration(entry, indexes) {
 
 function declarationsOverlapByShorthandGroup(left, right) {
   if (!left || !right || left.ruleKey !== right.ruleKey) return false;
-  const leftGroup = shorthandGroupForProperty(left.property);
-  const rightGroup = shorthandGroupForProperty(right.property);
-  return Boolean(leftGroup && rightGroup && leftGroup === rightGroup);
+  return declarationsOverlapByCssProperty(left.property, right.property);
 }
 
 function applyDeclarationChanges(index, changes) {
@@ -267,20 +278,25 @@ function blocked(id, sourcePath, reasonCode, conflicts = [], extra = {}) {
 }
 
 function result(id, sourcePath, status, body) {
+  const browserCascadeEquivalenceClaim = status === 'merged' && body.browserCascadeEquivalenceClaim === true;
   return {
     kind: 'frontier.lang.cssSafeMerge',
     version: 1,
     id,
     sourcePath,
     status,
+    ...body,
     autoMergeClaim: false,
     semanticEquivalenceClaim: false,
-    ...body,
+    browserCascadeEquivalenceClaim,
+    browserRenderEquivalenceClaim: false,
     admission: {
       status: status === 'merged' ? 'auto-merge-candidate' : 'blocked',
       action: status === 'merged' ? 'apply-css' : 'human-review',
       reviewRequired: status !== 'merged',
-      reasonCodes: unique((body.conflicts ?? []).map((item) => item.details.reasonCode))
+      reasonCodes: unique((body.conflicts ?? []).map((item) => item.details.reasonCode)),
+      browserCascadeEquivalenceClaim: browserCascadeEquivalenceClaim || undefined,
+      cssCascadeRuntimeProofs: body.cascadeRuntimeProofs?.length ? body.cascadeRuntimeProofs : undefined
     }
   };
 }
@@ -298,19 +314,4 @@ function proofGapsForDeclaration(record, declaration) {
 function unique(values) { return [...new Set(values.filter(Boolean))]; }
 function spaces(count) { return ' '.repeat(Math.max(0, count)); }
 
-function shorthandGroupForProperty(property) {
-  if (ShorthandGroups.has(property)) return property;
-  for (const [group, longhands] of ShorthandGroups) if (longhands.includes(property)) return group;
-  return undefined;
-}
-
-const ShorthandGroups = new Map([
-  ['background', ['background-attachment', 'background-clip', 'background-color', 'background-image', 'background-origin', 'background-position', 'background-repeat', 'background-size']],
-  ['border', ['border-color', 'border-style', 'border-width', 'border-top', 'border-right', 'border-bottom', 'border-left']],
-  ['font', ['font-family', 'font-size', 'font-stretch', 'font-style', 'font-variant', 'font-weight', 'line-height']],
-  ['list-style', ['list-style-image', 'list-style-position', 'list-style-type']],
-  ['margin', ['margin-top', 'margin-right', 'margin-bottom', 'margin-left']],
-  ['padding', ['padding-top', 'padding-right', 'padding-bottom', 'padding-left']]
-]);
-
 export { safeMergeCssSource };

package/package.json

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