cssints 0.0.0-stage → 0.2.0

package/dist/lowered-D2KusPLp.mjs

@@ -0,0 +1,28 @@
+import { a as registry } from "./registry-CTumHB8p.mjs";
+import { Result } from "effect";
+import { browserslistToTargets, transform } from "lightningcss";
+//#region src/lowered.ts
+const first = (css) => /^[^{]*\{([^;}]*)/.exec(css)?.[1];
+const lower = (prop, value, lacking, feature) => {
+	const code = Buffer.from(prop.startsWith("--") ? `:root{${prop}:${value}}` : `x{${prop}:${value}}`);
+	const out = first(transform({
+		filename: "x.css",
+		code,
+		minify: true,
+		targets: browserslistToTargets(lacking)
+	}).code.toString());
+	const holds = new RegExp(`(?<![\\w-])${feature.replace(/\(\)$/, "")}(?![\\w-])`);
+	return out !== void 0 && holds.test(`${prop}:${value}`) && !holds.test(out) ? out.slice(out.indexOf(":") + 1) : void 0;
+};
+const fallbackOf = (prop, value, w) => {
+	const key = `${prop}\0${value}\0${w.feature}\0${w.lacking.join()}`;
+	let hit = registry.lowered.get(key);
+	if (hit === void 0) {
+		hit = Result.getOrElse(Result.try(() => lower(prop, value, w.lacking, w.feature)), () => void 0) ?? false;
+		registry.lowered.set(key, hit);
+	}
+	return hit || void 0;
+};
+const loweredOf = (prop, value, w) => fallbackOf(prop, value, w) !== void 0;
+//#endregion
+export { loweredOf as n, fallbackOf as t };

package/dist/node-OJ_w_Usj.d.mts

@@ -0,0 +1,233 @@
+import { a as Kernel, i as GlobalRule, n as Conflict, o as Runtime, s as ThemeRule } from "./author-types-C1AhsnrT.mjs";
+import { Warning } from "@cssints/css-grammar/support";
+import { Context } from "effect";
+import { TokenType } from "@cssints/css-grammar/token";
+//#region src/registry.d.ts
+interface Rule {
+  layer: string;
+  /** Sort key within the layer: the min-width of its conditions, then the places of its pseudo-classes. */
+  cond: number[];
+  /** The at-rule preludes around `css`, outermost first (`@media (width >= 40rem)`). */
+  wrap: string[];
+  prop: string;
+  /** The style rule: `.cls:hover{color:red}`. */
+  css: string;
+  /** The tokens (`--name`) its value reads. */
+  tokens?: string[];
+}
+/** What a plugin member leaves on a style node besides declarations: its name, and the runtime and conflicts it has. */
+interface Plug {
+  name: string;
+  /** What errors call it (the scope that owns `name`), when that is not `name`. */
+  label?: string;
+  marker: string;
+  conflicts?: Conflict;
+  runtime?: Runtime;
+}
+/** A registered runtime, by plugin name: the files whose styles use it. */
+interface RuntimeEntry {
+  runtime: Runtime;
+  users: Set<string>;
+}
+/** A registered kernel: the custom properties it declares, the markers printed for it, the files that use it. */
+interface KernelEntry {
+  kernel: Kernel;
+  vars: string[];
+  markers: Set<string>;
+  users: Set<string>;
+}
+/** A support warning of a declaration in a kernel written as styles, weighed against the runtimes of a style (kernel.ts `addKernel`). */
+interface KernelWarning {
+  prop: string;
+  /** the value as the sheet prints it: `--_x` is `--<scope>-x` */
+  value: string;
+  warning: Warning;
+}
+/** The call site being evaluated, set by `__at` before its expression runs. */
+interface At {
+  file: string;
+  site: number;
+  offset: number;
+}
+/** A token's `@property` rule, by variable name (`--color-primary`). One entry per name across all modules. */
+interface Property {
+  css: string;
+  /** Literals of its type, put in place of `var(--name)` when a value that uses it is checked (TOKEN_TYPES). */
+  probes: readonly string[];
+  /** Where it was declared: `file#site.n`, `file`, and the evaluation (`gen`) that declared it. */
+  by: string;
+  file: string;
+  gen: number;
+}
+/** What a token is worth, by variable name: its literal (an alias or a derived token: the flattened one), and what it stays live as. */
+interface TokenDef {
+  kind: TokenType;
+  /** Whether the custom property inherits: only a token that does can be written on <html> by the runtime of derived tokens. */
+  inherit: boolean;
+  /** `color.bg` for a token of createTokens, else the variable. */
+  path: string;
+  value: string;
+  /** An alias or a derived token: its value with `var(--target)` for each reference, and the variables it refers to. */
+  template?: string;
+  refs?: string[];
+  /** `value` as LightningCSS lowers it for the targets that lack it: the initial value, and the default of a derived token. */
+  fallback?: string;
+  /** A derived token the runtime computes (derived-data.ts): its flattened literal, which a browser that parses it needs no runtime for. */
+  poly?: string;
+}
+/**
+ * A rule of a token set or a theme, in layer _.k after the globals (sheet.ts). `key` orders them: the kind (0 the
+ * `:root` declarations of aliases, 1 themes under a condition, 2 themes under a selector), then the place in the source.
+ * `names` are the variables it sets or reads: a module that uses one of them has the rule in its sheet too (plugin.ts).
+ * `layer`, when set, sends the rule to a **top-level** declared layer of that name instead of `_.k`: a look must rank
+ * above the engine's `:root` fallbacks, and a nested layer ranks below the rules of its parent.
+ * `theme` is what a contrast check reads: the values the theme sets, by variable name, for the selector `label` (inside
+ * `@scope (scope)`, if it has one); `poly` those of them that the runtime of derived tokens computes, with their flattened literals.
+ */
+interface Themed {
+  file: string;
+  key: string;
+  css: string;
+  names: string[];
+  layer?: string;
+  theme?: {
+    label: string;
+    scope?: string;
+    values: Map<string, string>;
+    poly?: Map<string, string>;
+  };
+}
+/** A global rule of a plugin member (`addGlobal`), by its content, with the files whose styles carry it. */
+interface GlobalEntry {
+  global: GlobalRule;
+  users: Set<string>;
+}
+/** A statement `@layer a, b;` to declare: `before` prints it before the engine's `@layer _.k, …;`, so its layers rank below. */
+interface LayersDecl {
+  names: readonly string[];
+  before?: boolean;
+}
+/** A declared statement `@layer a, b;` (`layers()`), by its names joined with `,`, with the files that declared it. */
+interface LayerEntry {
+  names: string[];
+  before: boolean;
+  users: Set<string>;
+}
+/** A `css.check.contrast` call, checked once the module that made it has run, and again at the end of a build. */
+interface Check {
+  at: At;
+  fg: string;
+  bg: string;
+  min: number;
+  gen: number;
+}
+interface RegistryState {
+  /** file -> site index -> replacement expression */
+  sites: Map<string, Map<number, string>>;
+  /** file -> site index -> the declarations of the style it produced: what a cn() with runtime arguments settles (macro.ts `groupOf`) */
+  nodes: Map<string, Map<number, Decl[]>>;
+  /** class -> rule; one entry per class across all modules */
+  rules: Map<string, Rule>;
+  /** `layer<TAB>css` -> a global rule: in the sheet of the modules that carry it, in layer _.k unless it names a layer (sheet.ts `addGlobal`) */
+  globals: Map<string, GlobalEntry>;
+  /** the declared top-level layers (sheet.ts `addLayers`) */
+  layers: Map<string, LayerEntry>;
+  /** key -> the kernels of the styles evaluated so far (sheet.ts `addKernel`): for collisions; the sheet reads the entries of a module */
+  kernels: Map<string, KernelEntry>;
+  /** plugin name -> its runtime and the files that use it (delivery.ts) */
+  runtimes: Map<string, RuntimeEntry>;
+  /** scope name -> the hash of its content (scope.ts `register`): a name is unique per process */
+  scopes: Map<string, string>;
+  /** what scope.ts needs of the eval-time library, set by macro.ts: `css` for a kernel written as styles (with `nest` and `vars`), `kernelOf` to check and print it under its class */
+  lib?: {
+    css: object;
+    kernelOf: (what: string, style: CssNode, cls: string) => {
+      css: string;
+      props: string[];
+      kernels?: Kernel[];
+      warnings: KernelWarning[];
+    };
+  };
+  /** the replacement of a site that holds a node of cssints/tui (tui.ts), set when that module loads */
+  tui?: (value: {
+    readonly __tui: unknown;
+  }) => string | undefined;
+  /** the tokens and themes of cssints/tui (tui.ts): a namespace of their own, never in a sheet (cssints-0s1z) */
+  terminal?: Pick<RegistryState, "properties" | "defs" | "themed">;
+  /** what the front of "cssints/plugin" calls (scope-engine.ts `engine`), set by macro.ts */
+  engine?: object;
+  /** the typed properties of scopes: checked by their own grammar when called, not by the engine */
+  userProps: Set<string>;
+  /** file -> the evaluation (`gen`) in which its first site ran: its kernels of older ones are forgotten (`__at`) */
+  seen: Map<string, number>;
+  /** name -> the `@property` rule of every token declared so far (token.ts) */
+  properties: Map<string, Property>;
+  /** name -> what each token is worth (token.ts, theme.ts): the contrast check and the theme rules read it */
+  defs: Map<string, TokenDef>;
+  /** `file#site.n` -> the rules of createTokens and createGlobalTheme calls */
+  themed: Map<string, Themed>;
+  /** `file#site` -> the contrast checks */
+  checks: Map<string, Check>;
+  /** the evaluation in progress; tokens of an older one that its file no longer declares are stale */
+  gen: number;
+  /** tokens created at the site being evaluated: two in one site get different private names */
+  tokens: number;
+  /** warnings not yet handed to Vite, each at the site that made it (`warn`) */
+  warnings: Warned[];
+  /** `file of the site \0 key` of the warnings said in this build; in dev, until that file is edited (`forgetWarnings`) */
+  warned: Set<string>;
+  /** `property value feature targets` -> what LightningCSS lowers it to, or false (lowered.ts) */
+  lowered: Map<string, string | false>;
+  /** the files the evaluation in progress read (`dependsOn`): dependencies of the module being evaluated (plugin.ts `depsOf`) */
+  files: Set<string>;
+  at?: At;
+  /** the site `tokens` is counting for: a call in a loop is one site that registers several tokens */
+  site?: string;
+}
+declare global {
+  var __cssints: RegistryState | undefined;
+}
+/** A warning and the site that made it, when there is one. */
+interface Warned {
+  message: string;
+  at?: At | undefined;
+}
+//#endregion
+//#region src/node.d.ts
+/**
+ * One condition of a style: an at-rule prelude (`@media (width >= 40rem)`), a pseudo-class (`:hover`), an attribute
+ * (`[aria-current="page"]`) or, with `ancestor`, a selector of a marked ancestor (`:where(._g:hover)`), or, with
+ * `nest` (kernels only), a selector around the class (`& > *`, `:root:has(&)`: `&` is the class); with `own`, its subject
+ * is still the element (`.x &`).
+ * `rank` orders the rules of a layer: the min-width of a media or container query in px, the place of a pseudo-class.
+ */
+interface Cond {
+  text: string;
+  rank: number;
+  ancestor?: true;
+  nest?: true;
+  own?: true;
+}
+/**
+ * One declaration: property and value, under the conditions that wrap it (outermost first). `fallbacks` are the other
+ * values of a `firstThatWorks(...)`, best first: the rule prints them before `value`, which is the one wanted.
+ */
+type Decl = [prop: string, value: string, conds?: Cond[], fallbacks?: string[]];
+/**
+ * What a css.* builder returns: its declarations, and next to them the fixed classes it prints (`markers`, each with
+ * the key of the kernel it belongs to), the kernels it needs, and the plugin members whose runtime and conflicts apply
+ * (`plugs`). `cn()` merges all three. `bare` are the markers of a merged style that came with no declaration of their
+ * own (`pretty()`, `frame()`): a condition around it would wrap nothing of theirs, so it is an error.
+ */
+interface CssNode {
+  __cssints: Decl[];
+  markers?: [marker: string, kernel: string][];
+  kernels?: Kernel[];
+  globals?: GlobalRule[];
+  themes?: ThemeRule[];
+  layers?: LayersDecl[];
+  plugs?: Plug[];
+  bare?: [marker: string, kernel: string][];
+}
+//#endregion
+export { RegistryState as i, At as n, LayersDecl as r, CssNode as t };

package/dist/parent-vars.d.mts

@@ -0,0 +1,13 @@
+//#region src/parent-vars.d.ts
+interface Family {
+  /** The class every element of the family carries (`_f`). */
+  marker: string;
+  /** The custom property read from the nearest marked ancestor, and written on the element. */
+  read: string;
+  write: string;
+  /** A property that changes when a CSS condition (`:hover`, a media query) changes `read`: its transition re-runs us. */
+  watch?: string;
+}
+declare const _default: (add: Family[]) => void;
+//#endregion
+export { _default as default };

package/dist/parent-vars.mjs

@@ -0,0 +1,65 @@
+//#region src/parent-vars.ts
+const families = [];
+let started = false;
+let observer;
+const update = (roots) => {
+	for (const f of families) {
+		const s = `.${f.marker}`;
+		const level = /* @__PURE__ */ new Map();
+		const rows = [];
+		for (const r of roots) for (const el of r.matches(s) ? [r, ...r.querySelectorAll(s)] : r.querySelectorAll(s)) {
+			const p = el.parentElement?.closest(s);
+			const l = level.has(p) ? level.get(p) + 1 : 0;
+			level.set(el, l);
+			(rows[l] ??= []).push([el, p]);
+		}
+		for (const row of rows) {
+			const v = new Map(row.map(([, p]) => [p, p && getComputedStyle(p).getPropertyValue(f.read)]));
+			for (const [el, p] of row) if (p) el.style.setProperty(f.write, v.get(p));
+			else el.style.removeProperty(f.write);
+		}
+	}
+	observer?.takeRecords();
+};
+const top = (nodes) => {
+	const s = new Set(nodes);
+	return [...s].filter((n) => {
+		for (let a = n.parentNode; n.isConnected && a; a = a.parentNode) if (s.has(a)) return false;
+		return n.isConnected;
+	});
+};
+const start = () => {
+	const root = document.documentElement;
+	const p = document.createElement("div");
+	const c = document.createElement("i");
+	const s = document.createElement("style");
+	s.textContent = "@container style(--_q:1){i{--_h:1}}";
+	p.style.setProperty("--_q", "1");
+	p.append(c);
+	document.head.append(s);
+	root.append(p);
+	const supported = getComputedStyle(c).getPropertyValue("--_h");
+	p.remove();
+	s.remove();
+	if (supported) return;
+	root.setAttribute("data-cssints-poly", "");
+	observer = new MutationObserver((rs) => update(top(rs.flatMap((r) => r.type === "childList" ? [...r.addedNodes].filter((n) => n.nodeType === 1) : [r.target]))));
+	observer.observe(root, {
+		subtree: true,
+		childList: true,
+		attributes: true,
+		attributeFilter: ["class", "style"]
+	});
+	for (const type of ["transitionrun", "transitionend"]) document.addEventListener(type, (e) => families.some((f) => f.watch === e.propertyName) && update([e.target]));
+};
+var parent_vars_default = (add) => {
+	if (typeof document === "undefined") return;
+	families.push(...add);
+	if (!started) {
+		started = true;
+		start();
+	}
+	if (observer) update([document.documentElement]);
+};
+//#endregion
+export { parent_vars_default as default };