fix(core): address PR feedback — ReDoS-safe slug trim, getVariables cleanups

- slugify: replace the anchored alternated trim regex (/^-+|-+$/g) with a
  character-scan trim — CodeQL js/polynomial-redos blocker.
- readRenderOverrides: fold the readOverrides wrapper into the exported
  function (one name, no pass-through).
- getVariables: deduplicate declarers with a Set, matching
  injectCompositionCssVariables.
- Move the tokenSlug import to the top of the file.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Vance Ingalls
2026-07-08 02:34:18 -07:00
co-authored by Claude Fable 5
parent e2c88ef689
commit d9368ec051
2 changed files with 21 additions and 13 deletions
+12 -9
View File
@@ -19,6 +19,8 @@
*
* const { title = "Untitled", theme = "light" } = getVariables<MyVars>();
*/
import { cssVariableName, detectSlugCollisions } from "../tokenSlug";
export function getVariables<
T extends Record<string, unknown> = Record<string, unknown>,
>(): Partial<T> {
@@ -27,11 +29,18 @@ export function getVariables<
// Same collection the CSS-variable injection uses: <html> first, then any
// composition element carrying the attribute (later declarers win), then
// render-time overrides.
const declaredDefaults = readDeclaredDefaults(document.documentElement);
const declarers = new Set<Element>();
if (document.documentElement?.hasAttribute("data-composition-variables")) {
declarers.add(document.documentElement);
}
for (const el of Array.from(document.querySelectorAll("[data-composition-variables]"))) {
declarers.add(el);
}
const declaredDefaults: Record<string, unknown> = {};
for (const el of declarers) {
Object.assign(declaredDefaults, readDeclaredDefaults(el));
}
const overrides = readOverrides();
const overrides = readRenderOverrides();
return { ...declaredDefaults, ...overrides } as Partial<T>;
}
@@ -65,8 +74,6 @@ export function readDeclaredDefaults(root: Element | null): Record<string, unkno
return out;
}
import { cssVariableName, detectSlugCollisions } from "../tokenSlug";
const APPLIED_VARS_ATTR = "data-hf-css-vars";
function hasInlineStyle(target: Element): target is Element & ElementCSSInlineStyle {
@@ -125,7 +132,7 @@ export function injectCompositionCssVariables(doc: Document): void {
for (const el of Array.from(doc.querySelectorAll("[data-composition-variables]"))) {
declarers.add(el);
}
const overrides = readOverrides();
const overrides = readRenderOverrides();
const allIds: string[] = [];
for (const el of declarers) {
allIds.push(...applyDeclaredForElement(el, overrides, doc.defaultView));
@@ -181,10 +188,6 @@ export function parseHostVariableValues(host: Element): Record<string, unknown>
/** Render-time variable overrides (`hyperframes render --variables`). */
export function readRenderOverrides(): Record<string, unknown> {
return readOverrides();
}
function readOverrides(): Record<string, unknown> {
if (typeof window === "undefined") return {};
const raw = (window as Window & { __hfVariables?: unknown }).__hfVariables;
if (!raw || typeof raw !== "object" || Array.isArray(raw)) return {};
+9 -4
View File
@@ -8,10 +8,15 @@
*/
export function slugify(name: string): string {
const slug = name
.toLowerCase()
.replace(/[^a-z0-9]+/g, "-")
.replace(/^-+|-+$/g, "");
const collapsed = name.toLowerCase().replace(/[^a-z0-9]+/g, "-");
// Character-scan trim of leading/trailing "-" instead of /^-+|-+$/:
// CodeQL flags the alternated anchored regex as polynomial ReDoS on
// adversarial inputs (js/polynomial-redos).
let start = 0;
let end = collapsed.length;
while (start < end && collapsed[start] === "-") start++;
while (end > start && collapsed[end - 1] === "-") end--;
const slug = collapsed.slice(start, end);
return slug.length > 0 ? slug : "node";
}