react-native-gtkx 0.1.0-alpha.4 → 0.2.0-alpha.1

package/dist/style/split-style.js.map

@@ -1 +1 @@
-{"version":3,"file":"split-style.js","sourceRoot":"","sources":["../../src/style/split-style.ts"],"names":[],"mappings":"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","sourcesContent":["// Classifies a flattened style into layout props (consumed by the Yoga\n// engine) and visual props (compiled into GTK CSS). Pure module.\n\nimport type {\n  FlatStyle,\n  LayoutStyle,\n  SplitStyle,\n  VisualStyle,\n} from \"../contracts\"\nimport { warnOnce } from \"./dev-warning\"\n\n// Exhaustive over the frozen contract: adding a key to LayoutStyle in\n// contracts.ts fails compilation here until the key is classified.\nconst LAYOUT_KEYS: Record<keyof LayoutStyle, true> = {\n  alignContent: true,\n  alignItems: true,\n  alignSelf: true,\n  aspectRatio: true,\n  bottom: true,\n  columnGap: true,\n  direction: true,\n  display: true,\n  flex: true,\n  flexBasis: true,\n  flexDirection: true,\n  flexGrow: true,\n  flexShrink: true,\n  flexWrap: true,\n  gap: true,\n  height: true,\n  justifyContent: true,\n  left: true,\n  margin: true,\n  marginBottom: true,\n  marginHorizontal: true,\n  marginLeft: true,\n  marginRight: true,\n  marginTop: true,\n  marginVertical: true,\n  maxHeight: true,\n  maxWidth: true,\n  minHeight: true,\n  minWidth: true,\n  overflow: true,\n  padding: true,\n  paddingBottom: true,\n  paddingHorizontal: true,\n  paddingLeft: true,\n  paddingRight: true,\n  paddingTop: true,\n  paddingVertical: true,\n  position: true,\n  right: true,\n  rowGap: true,\n  top: true,\n  width: true,\n}\n\n// Note: `transform` is visual by contract — it is applied by the layout\n// engine through Fixed.Child matrices, not through CSS, and is passed\n// through here untouched.\nconst VISUAL_KEYS: Record<keyof VisualStyle, true> = {\n  backgroundColor: true,\n  borderBottomColor: true,\n  borderBottomLeftRadius: true,\n  borderBottomRightRadius: true,\n  borderBottomWidth: true,\n  borderColor: true,\n  borderLeftColor: true,\n  borderLeftWidth: true,\n  borderRadius: true,\n  borderRightColor: true,\n  borderRightWidth: true,\n  borderStyle: true,\n  borderTopColor: true,\n  borderTopLeftRadius: true,\n  borderTopRightRadius: true,\n  borderTopWidth: true,\n  borderWidth: true,\n  color: true,\n  fontFamily: true,\n  fontSize: true,\n  fontStyle: true,\n  fontWeight: true,\n  letterSpacing: true,\n  lineHeight: true,\n  opacity: true,\n  textAlign: true,\n  transform: true,\n}\n\n/**\n * Splits a flattened style into { layout, visual }. Unknown properties are\n * ignored with a one-time dev warning per key; undefined values are dropped.\n */\nexport const splitStyle = (flat: FlatStyle): SplitStyle => {\n  const layout: LayoutStyle = {}\n  const visual: VisualStyle = {}\n  for (const [key, value] of Object.entries(flat)) {\n    if (value === undefined) {\n      continue\n    }\n    if (Object.hasOwn(LAYOUT_KEYS, key)) {\n      ;(layout as Record<string, unknown>)[key] = value\n    } else if (Object.hasOwn(VISUAL_KEYS, key)) {\n      ;(visual as Record<string, unknown>)[key] = value\n    } else {\n      warnOnce(\n        `unknown-style-prop:${key}`,\n        `[react-native-gtkx] Unknown style property \"${key}\" is not supported and will be ignored`,\n      )\n    }\n  }\n  return { layout, visual }\n}\n"]}
+{"version":3,"file":"split-style.js","sourceRoot":"","sources":["../../src/style/split-style.ts"],"names":[],"mappings":"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","sourcesContent":["// Classifies a flattened style into layout props (consumed by the Yoga\n// engine) and visual props (compiled into GTK CSS). Pure module.\n\nimport type {\n  FlatStyle,\n  LayoutStyle,\n  SplitStyle,\n  VisualStyle,\n} from \"../contracts\"\nimport { warnOnce } from \"./dev-warning\"\n\n// Exhaustive over the frozen contract: adding a key to LayoutStyle in\n// contracts.ts fails compilation here until the key is classified.\nconst LAYOUT_KEYS: Record<keyof LayoutStyle, true> = {\n  alignContent: true,\n  alignItems: true,\n  alignSelf: true,\n  aspectRatio: true,\n  bottom: true,\n  columnGap: true,\n  direction: true,\n  display: true,\n  flex: true,\n  flexBasis: true,\n  flexDirection: true,\n  flexGrow: true,\n  flexShrink: true,\n  flexWrap: true,\n  gap: true,\n  height: true,\n  justifyContent: true,\n  left: true,\n  margin: true,\n  marginBottom: true,\n  marginHorizontal: true,\n  marginLeft: true,\n  marginRight: true,\n  marginTop: true,\n  marginVertical: true,\n  maxHeight: true,\n  maxWidth: true,\n  minHeight: true,\n  minWidth: true,\n  overflow: true,\n  padding: true,\n  paddingBottom: true,\n  paddingHorizontal: true,\n  paddingLeft: true,\n  paddingRight: true,\n  paddingTop: true,\n  paddingVertical: true,\n  position: true,\n  right: true,\n  rowGap: true,\n  top: true,\n  width: true,\n}\n\n// Note: `transform` is visual by contract — it is applied as the\n// GskTransform of the child's allocation, not through CSS, and is passed\n// through here untouched.\nconst VISUAL_KEYS: Record<keyof VisualStyle, true> = {\n  backgroundColor: true,\n  borderBottomColor: true,\n  borderBottomLeftRadius: true,\n  borderBottomRightRadius: true,\n  borderBottomWidth: true,\n  borderColor: true,\n  borderLeftColor: true,\n  borderLeftWidth: true,\n  borderRadius: true,\n  borderRightColor: true,\n  borderRightWidth: true,\n  borderStyle: true,\n  borderTopColor: true,\n  borderTopLeftRadius: true,\n  borderTopRightRadius: true,\n  borderTopWidth: true,\n  borderWidth: true,\n  color: true,\n  fontFamily: true,\n  fontSize: true,\n  fontStyle: true,\n  fontWeight: true,\n  letterSpacing: true,\n  lineHeight: true,\n  opacity: true,\n  textAlign: true,\n  transform: true,\n}\n\n/**\n * Splits a flattened style into { layout, visual }. Unknown properties are\n * ignored with a one-time dev warning per key; undefined values are dropped.\n */\nexport const splitStyle = (flat: FlatStyle): SplitStyle => {\n  const layout: LayoutStyle = {}\n  const visual: VisualStyle = {}\n  for (const [key, value] of Object.entries(flat)) {\n    if (value === undefined) {\n      continue\n    }\n    if (Object.hasOwn(LAYOUT_KEYS, key)) {\n      ;(layout as Record<string, unknown>)[key] = value\n    } else if (Object.hasOwn(VISUAL_KEYS, key)) {\n      ;(visual as Record<string, unknown>)[key] = value\n    } else {\n      warnOnce(\n        `unknown-style-prop:${key}`,\n        `[react-native-gtkx] Unknown style property \"${key}\" is not supported and will be ignored`,\n      )\n    }\n  }\n  return { layout, visual }\n}\n"]}

package/dist/style/transform.d.ts

@@ -0,0 +1,22 @@
+import type { Transform2D, TransformPart } from "../contracts";
+export declare const IDENTITY_TRANSFORM: Transform2D;
+/**
+ * RN angle syntax: a number with an explicit `deg` or `rad` unit. Returns
+ * degrees, or null for anything unparseable (warned once, then dropped —
+ * a bad angle must not take the whole style down).
+ */
+export declare const parseAngle: (value: unknown) => number | null;
+/**
+ * Folds an RN transform array into a single matrix. Order is RN's (and
+ * CSS's): the leftmost entry is the outermost matrix, so it is applied to a
+ * point LAST — `[{rotate}, {translateX}]` translates, then rotates the
+ * result about the origin.
+ */
+export declare const composeTransform: (parts: readonly TransformPart[]) => Transform2D;
+export declare const isIdentityTransform: (matrix: Transform2D) => boolean;
+/**
+ * True when the matrix is a pure translation. Those keep the existing
+ * positional fast path (the rect is simply offset), which costs no
+ * GskTransform at all — only rotate/scale need one.
+ */
+export declare const isTranslationOnly: (matrix: Transform2D) => boolean;

package/dist/style/transform.js

@@ -0,0 +1,137 @@
+// Composes an RN `transform` array into one 2D affine matrix. Pure module —
+// no bridge imports — so the whole ordering contract is unit-testable on any
+// OS; the bridge only turns the finished matrix into a GskTransform.
+//
+// Why a matrix and not a chain of GskTransform calls: measured in the VM
+// (docs/research/transforms.md), a five-op GskTransform chain costs 18.3 us
+// per build against 5.7 us for one gsk_transform_matrix2d(), and both
+// produce a bit-identical to2d(). Composition is six multiplies of plain
+// numbers, so it stays on the Animated fast path.
+import { warnOnce } from "./dev-warning";
+export const IDENTITY_TRANSFORM = {
+    xx: 1,
+    yx: 0,
+    xy: 0,
+    yy: 1,
+    dx: 0,
+    dy: 0,
+};
+const DEG_PER_RAD = 180 / Math.PI;
+/**
+ * RN angle syntax: a number with an explicit `deg` or `rad` unit. Returns
+ * degrees, or null for anything unparseable (warned once, then dropped —
+ * a bad angle must not take the whole style down).
+ */
+export const parseAngle = (value) => {
+    if (typeof value === "number") {
+        // RN rejects unitless angles in styles, but an Animated node driving a
+        // rotation with a plain numeric outputRange is a common shortcut and
+        // degrees are the only sane reading of it.
+        return Number.isFinite(value) ? value : null;
+    }
+    if (typeof value !== "string") {
+        return null;
+    }
+    const match = /^\s*([+-]?(?:\d+\.?\d*|\.\d+)(?:[eE][+-]?\d+)?)(deg|rad)\s*$/.exec(value);
+    if (!match) {
+        warnOnce(`invalid-angle:${value}`, `[react-native-gtkx] Invalid angle ${JSON.stringify(value)} in "transform" — expected "<number>deg" or "<number>rad"; the entry is ignored`);
+        return null;
+    }
+    const amount = parseFloat(match[1]);
+    return match[2] === "rad" ? amount * DEG_PER_RAD : amount;
+};
+// left * right, both in the Transform2D component order.
+const multiply = (left, right) => ({
+    xx: left.xx * right.xx + left.xy * right.yx,
+    yx: left.yx * right.xx + left.yy * right.yx,
+    xy: left.xx * right.xy + left.xy * right.yy,
+    yy: left.yx * right.xy + left.yy * right.yy,
+    dx: left.xx * right.dx + left.xy * right.dy + left.dx,
+    dy: left.yx * right.dx + left.yy * right.dy + left.dy,
+});
+const scaleMatrix = (x, y) => Number.isFinite(x) && Number.isFinite(y)
+    ? { xx: x, yx: 0, xy: 0, yy: y, dx: 0, dy: 0 }
+    : null;
+const rotateMatrix = (angle) => {
+    const degrees = parseAngle(angle);
+    if (degrees === null) {
+        return null;
+    }
+    const radians = degrees / DEG_PER_RAD;
+    const cos = Math.cos(radians);
+    const sin = Math.sin(radians);
+    return { xx: cos, yx: sin, xy: -sin, yy: cos, dx: 0, dy: 0 };
+};
+// A TransformPart is a single-key object, and this runs on every animated
+// frame — so the supported keys are probed directly (a monomorphic property
+// load) instead of being discovered with Object.keys/for-in, and the matrices
+// are plain literals rather than spreads of the identity. Key discovery only
+// happens on the miss path, to name the unsupported entry in the warning.
+const partToMatrix = (part) => {
+    const entry = part;
+    const translateX = entry.translateX;
+    if (typeof translateX === "number") {
+        return Number.isFinite(translateX)
+            ? { xx: 1, yx: 0, xy: 0, yy: 1, dx: translateX, dy: 0 }
+            : null;
+    }
+    const translateY = entry.translateY;
+    if (typeof translateY === "number") {
+        return Number.isFinite(translateY)
+            ? { xx: 1, yx: 0, xy: 0, yy: 1, dx: 0, dy: translateY }
+            : null;
+    }
+    const scale = entry.scale;
+    if (typeof scale === "number") {
+        return scaleMatrix(scale, scale);
+    }
+    const scaleX = entry.scaleX;
+    if (typeof scaleX === "number") {
+        return scaleMatrix(scaleX, 1);
+    }
+    const scaleY = entry.scaleY;
+    if (typeof scaleY === "number") {
+        return scaleMatrix(1, scaleY);
+    }
+    if (entry.rotate !== undefined) {
+        return rotateMatrix(entry.rotate);
+    }
+    if (entry.rotateZ !== undefined) {
+        return rotateMatrix(entry.rotateZ);
+    }
+    for (const key of Object.keys(entry)) {
+        warnOnce(`unsupported-transform:${key}`, `[react-native-gtkx] Unsupported transform "${key}" — supported: translateX, translateY, scale, scaleX, scaleY, rotate, rotateZ`);
+    }
+    return null;
+};
+/**
+ * Folds an RN transform array into a single matrix. Order is RN's (and
+ * CSS's): the leftmost entry is the outermost matrix, so it is applied to a
+ * point LAST — `[{rotate}, {translateX}]` translates, then rotates the
+ * result about the origin.
+ */
+export const composeTransform = (parts) => {
+    // `matrix === null` means "still the identity", which lets the common
+    // single-entry array skip the multiply entirely.
+    let matrix = null;
+    for (const part of parts) {
+        const next = partToMatrix(part);
+        if (next) {
+            matrix = matrix === null ? next : multiply(matrix, next);
+        }
+    }
+    return matrix ?? IDENTITY_TRANSFORM;
+};
+export const isIdentityTransform = (matrix) => matrix.xx === 1 &&
+    matrix.yx === 0 &&
+    matrix.xy === 0 &&
+    matrix.yy === 1 &&
+    matrix.dx === 0 &&
+    matrix.dy === 0;
+/**
+ * True when the matrix is a pure translation. Those keep the existing
+ * positional fast path (the rect is simply offset), which costs no
+ * GskTransform at all — only rotate/scale need one.
+ */
+export const isTranslationOnly = (matrix) => matrix.xx === 1 && matrix.yx === 0 && matrix.xy === 0 && matrix.yy === 1;
+//# sourceMappingURL=transform.js.map

package/dist/style/transform.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transform.js","sourceRoot":"","sources":["../../src/style/transform.ts"],"names":[],"mappings":"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","sourcesContent":["// Composes an RN `transform` array into one 2D affine matrix. Pure module —\n// no bridge imports — so the whole ordering contract is unit-testable on any\n// OS; the bridge only turns the finished matrix into a GskTransform.\n//\n// Why a matrix and not a chain of GskTransform calls: measured in the VM\n// (docs/research/transforms.md), a five-op GskTransform chain costs 18.3 us\n// per build against 5.7 us for one gsk_transform_matrix2d(), and both\n// produce a bit-identical to2d(). Composition is six multiplies of plain\n// numbers, so it stays on the Animated fast path.\n\nimport type { Transform2D, TransformPart } from \"../contracts\"\nimport { warnOnce } from \"./dev-warning\"\n\nexport const IDENTITY_TRANSFORM: Transform2D = {\n  xx: 1,\n  yx: 0,\n  xy: 0,\n  yy: 1,\n  dx: 0,\n  dy: 0,\n}\n\nconst DEG_PER_RAD = 180 / Math.PI\n\n/**\n * RN angle syntax: a number with an explicit `deg` or `rad` unit. Returns\n * degrees, or null for anything unparseable (warned once, then dropped —\n * a bad angle must not take the whole style down).\n */\nexport const parseAngle = (value: unknown): number | null => {\n  if (typeof value === \"number\") {\n    // RN rejects unitless angles in styles, but an Animated node driving a\n    // rotation with a plain numeric outputRange is a common shortcut and\n    // degrees are the only sane reading of it.\n    return Number.isFinite(value) ? value : null\n  }\n  if (typeof value !== \"string\") {\n    return null\n  }\n  const match =\n    /^\\s*([+-]?(?:\\d+\\.?\\d*|\\.\\d+)(?:[eE][+-]?\\d+)?)(deg|rad)\\s*$/.exec(value)\n  if (!match) {\n    warnOnce(\n      `invalid-angle:${value}`,\n      `[react-native-gtkx] Invalid angle ${JSON.stringify(value)} in \"transform\" — expected \"<number>deg\" or \"<number>rad\"; the entry is ignored`,\n    )\n    return null\n  }\n  const amount = parseFloat(match[1]!)\n  return match[2] === \"rad\" ? amount * DEG_PER_RAD : amount\n}\n\n// left * right, both in the Transform2D component order.\nconst multiply = (left: Transform2D, right: Transform2D): Transform2D => ({\n  xx: left.xx * right.xx + left.xy * right.yx,\n  yx: left.yx * right.xx + left.yy * right.yx,\n  xy: left.xx * right.xy + left.xy * right.yy,\n  yy: left.yx * right.xy + left.yy * right.yy,\n  dx: left.xx * right.dx + left.xy * right.dy + left.dx,\n  dy: left.yx * right.dx + left.yy * right.dy + left.dy,\n})\n\nconst scaleMatrix = (x: number, y: number): Transform2D | null =>\n  Number.isFinite(x) && Number.isFinite(y)\n    ? { xx: x, yx: 0, xy: 0, yy: y, dx: 0, dy: 0 }\n    : null\n\nconst rotateMatrix = (angle: unknown): Transform2D | null => {\n  const degrees = parseAngle(angle)\n  if (degrees === null) {\n    return null\n  }\n  const radians = degrees / DEG_PER_RAD\n  const cos = Math.cos(radians)\n  const sin = Math.sin(radians)\n  return { xx: cos, yx: sin, xy: -sin, yy: cos, dx: 0, dy: 0 }\n}\n\n// A TransformPart is a single-key object, and this runs on every animated\n// frame — so the supported keys are probed directly (a monomorphic property\n// load) instead of being discovered with Object.keys/for-in, and the matrices\n// are plain literals rather than spreads of the identity. Key discovery only\n// happens on the miss path, to name the unsupported entry in the warning.\nconst partToMatrix = (part: TransformPart): Transform2D | null => {\n  const entry = part as Record<string, unknown>\n\n  const translateX = entry.translateX\n  if (typeof translateX === \"number\") {\n    return Number.isFinite(translateX)\n      ? { xx: 1, yx: 0, xy: 0, yy: 1, dx: translateX, dy: 0 }\n      : null\n  }\n  const translateY = entry.translateY\n  if (typeof translateY === \"number\") {\n    return Number.isFinite(translateY)\n      ? { xx: 1, yx: 0, xy: 0, yy: 1, dx: 0, dy: translateY }\n      : null\n  }\n  const scale = entry.scale\n  if (typeof scale === \"number\") {\n    return scaleMatrix(scale, scale)\n  }\n  const scaleX = entry.scaleX\n  if (typeof scaleX === \"number\") {\n    return scaleMatrix(scaleX, 1)\n  }\n  const scaleY = entry.scaleY\n  if (typeof scaleY === \"number\") {\n    return scaleMatrix(1, scaleY)\n  }\n  if (entry.rotate !== undefined) {\n    return rotateMatrix(entry.rotate)\n  }\n  if (entry.rotateZ !== undefined) {\n    return rotateMatrix(entry.rotateZ)\n  }\n\n  for (const key of Object.keys(entry)) {\n    warnOnce(\n      `unsupported-transform:${key}`,\n      `[react-native-gtkx] Unsupported transform \"${key}\" — supported: translateX, translateY, scale, scaleX, scaleY, rotate, rotateZ`,\n    )\n  }\n  return null\n}\n\n/**\n * Folds an RN transform array into a single matrix. Order is RN's (and\n * CSS's): the leftmost entry is the outermost matrix, so it is applied to a\n * point LAST — `[{rotate}, {translateX}]` translates, then rotates the\n * result about the origin.\n */\nexport const composeTransform = (\n  parts: readonly TransformPart[],\n): Transform2D => {\n  // `matrix === null` means \"still the identity\", which lets the common\n  // single-entry array skip the multiply entirely.\n  let matrix: Transform2D | null = null\n  for (const part of parts) {\n    const next = partToMatrix(part)\n    if (next) {\n      matrix = matrix === null ? next : multiply(matrix, next)\n    }\n  }\n  return matrix ?? IDENTITY_TRANSFORM\n}\n\nexport const isIdentityTransform = (matrix: Transform2D): boolean =>\n  matrix.xx === 1 &&\n  matrix.yx === 0 &&\n  matrix.xy === 0 &&\n  matrix.yy === 1 &&\n  matrix.dx === 0 &&\n  matrix.dy === 0\n\n/**\n * True when the matrix is a pure translation. Those keep the existing\n * positional fast path (the rect is simply offset), which costs no\n * GskTransform at all — only rotate/scale need one.\n */\nexport const isTranslationOnly = (matrix: Transform2D): boolean =>\n  matrix.xx === 1 && matrix.yx === 0 && matrix.xy === 0 && matrix.yy === 1\n"]}

package/dist/style/visual-css.js

@@ -8,8 +8,9 @@
 // - line-height: supported since GTK 4.6 (we target 4.20+);
 // - text-align does NOT exist in GTK CSS — textAlign is applied by the Text
 //   component via widget properties (justify/xalign), so it is skipped here;
-// - transform is applied by the layout engine via Fixed.Child matrices,
-//   never through CSS, and is skipped here as well.
+// - transform does NOT exist as a widget property in GTK4 CSS either: it is
+//   composed into a matrix by ./transform.ts and applied as the GskTransform
+//   of the child's allocation, so it is skipped here as well.
 import { parseColor } from "./colors";
 import { warnOnce } from "./dev-warning";
 const px = (value) => `${value}px`;

package/dist/style/visual-css.js.map

@@ -1 +1 @@
-{"version":3,"file":"visual-css.js","sourceRoot":"","sources":["../../src/style/visual-css.ts"],"names":[],"mappings":"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","sourcesContent":["// Compiles a VisualStyle into a GTK4 CSS declaration block (no selector).\n// Pure module — the resulting string is registered as a class through an\n// injected `css` function (see registry.ts / registry.gtkx.ts).\n//\n// GTK4 CSS is not web CSS. What this generator relies on:\n// - background-color, border-*, border-radius (incl. per-corner), opacity,\n//   color, font-*, letter-spacing: supported by GTK4;\n// - line-height: supported since GTK 4.6 (we target 4.20+);\n// - text-align does NOT exist in GTK CSS — textAlign is applied by the Text\n//   component via widget properties (justify/xalign), so it is skipped here;\n// - transform is applied by the layout engine via Fixed.Child matrices,\n//   never through CSS, and is skipped here as well.\n\nimport type { VisualStyle } from \"../contracts\"\nimport { parseColor } from \"./colors\"\nimport { warnOnce } from \"./dev-warning\"\n\nconst px = (value: number): string => `${value}px`\n\nconst clamp01 = (value: number): number => Math.min(1, Math.max(0, value))\n\nconst pushColor = (\n  declarations: string[],\n  cssProperty: string,\n  value: string,\n  styleProperty: string,\n): void => {\n  const parsed = parseColor(value)\n  if (parsed === null) {\n    warnOnce(\n      `invalid-color:${styleProperty}:${value}`,\n      `[react-native-gtkx] Invalid color ${JSON.stringify(value)} in \"${styleProperty}\" — declaration dropped`,\n    )\n    return\n  }\n  declarations.push(`${cssProperty}: ${parsed};`)\n}\n\nconst formatFontFamily = (family: string): string => {\n  const trimmed = family.trim()\n  if (/^(\".*\"|'.*')$/.test(trimmed)) {\n    return trimmed\n  }\n  return /^[A-Za-z][\\w-]*$/.test(trimmed)\n    ? trimmed\n    : `\"${trimmed.replace(/\"/g, '\\\\\"')}\"`\n}\n\n/**\n * Renders a VisualStyle as GTK CSS declarations (one per line, stable\n * order). Returns \"\" when the style produces no CSS (e.g. transform-only).\n */\nexport const visualStyleToCss = (visual: VisualStyle): string => {\n  const decls: string[] = []\n\n  if (visual.backgroundColor !== undefined) {\n    pushColor(\n      decls,\n      \"background-color\",\n      visual.backgroundColor,\n      \"backgroundColor\",\n    )\n  }\n  if (visual.opacity !== undefined) {\n    decls.push(`opacity: ${clamp01(visual.opacity)};`)\n  }\n\n  // GTK defaults border-style to none — width alone renders nothing. An\n  // explicit borderStyle wins (GTK4 CSS supports solid/dotted/dashed);\n  // otherwise any positive border width turns the border on with \"solid\".\n  const hasVisibleBorderWidth = [\n    visual.borderWidth,\n    visual.borderTopWidth,\n    visual.borderRightWidth,\n    visual.borderBottomWidth,\n    visual.borderLeftWidth,\n  ].some((width) => width !== undefined && width > 0)\n  if (visual.borderStyle !== undefined) {\n    decls.push(`border-style: ${visual.borderStyle};`)\n  } else if (hasVisibleBorderWidth) {\n    decls.push(\"border-style: solid;\")\n  }\n  // Shorthands first, then per-side overrides so the sides win.\n  if (visual.borderWidth !== undefined) {\n    decls.push(`border-width: ${px(visual.borderWidth)};`)\n  }\n  if (visual.borderTopWidth !== undefined) {\n    decls.push(`border-top-width: ${px(visual.borderTopWidth)};`)\n  }\n  if (visual.borderRightWidth !== undefined) {\n    decls.push(`border-right-width: ${px(visual.borderRightWidth)};`)\n  }\n  if (visual.borderBottomWidth !== undefined) {\n    decls.push(`border-bottom-width: ${px(visual.borderBottomWidth)};`)\n  }\n  if (visual.borderLeftWidth !== undefined) {\n    decls.push(`border-left-width: ${px(visual.borderLeftWidth)};`)\n  }\n  if (visual.borderColor !== undefined) {\n    pushColor(decls, \"border-color\", visual.borderColor, \"borderColor\")\n  }\n  if (visual.borderTopColor !== undefined) {\n    pushColor(\n      decls,\n      \"border-top-color\",\n      visual.borderTopColor,\n      \"borderTopColor\",\n    )\n  }\n  if (visual.borderRightColor !== undefined) {\n    pushColor(\n      decls,\n      \"border-right-color\",\n      visual.borderRightColor,\n      \"borderRightColor\",\n    )\n  }\n  if (visual.borderBottomColor !== undefined) {\n    pushColor(\n      decls,\n      \"border-bottom-color\",\n      visual.borderBottomColor,\n      \"borderBottomColor\",\n    )\n  }\n  if (visual.borderLeftColor !== undefined) {\n    pushColor(\n      decls,\n      \"border-left-color\",\n      visual.borderLeftColor,\n      \"borderLeftColor\",\n    )\n  }\n  if (visual.borderRadius !== undefined) {\n    decls.push(`border-radius: ${px(visual.borderRadius)};`)\n  }\n  // Per-corner radii come after the shorthand so they override it.\n  if (visual.borderTopLeftRadius !== undefined) {\n    decls.push(`border-top-left-radius: ${px(visual.borderTopLeftRadius)};`)\n  }\n  if (visual.borderTopRightRadius !== undefined) {\n    decls.push(`border-top-right-radius: ${px(visual.borderTopRightRadius)};`)\n  }\n  if (visual.borderBottomRightRadius !== undefined) {\n    decls.push(\n      `border-bottom-right-radius: ${px(visual.borderBottomRightRadius)};`,\n    )\n  }\n  if (visual.borderBottomLeftRadius !== undefined) {\n    decls.push(\n      `border-bottom-left-radius: ${px(visual.borderBottomLeftRadius)};`,\n    )\n  }\n\n  if (visual.color !== undefined) {\n    pushColor(decls, \"color\", visual.color, \"color\")\n  }\n  if (visual.fontFamily !== undefined) {\n    decls.push(`font-family: ${formatFontFamily(visual.fontFamily)};`)\n  }\n  if (visual.fontSize !== undefined) {\n    decls.push(`font-size: ${px(visual.fontSize)};`)\n  }\n  if (visual.fontStyle !== undefined) {\n    decls.push(`font-style: ${visual.fontStyle};`)\n  }\n  if (visual.fontWeight !== undefined) {\n    decls.push(`font-weight: ${visual.fontWeight};`)\n  }\n  if (visual.letterSpacing !== undefined) {\n    decls.push(`letter-spacing: ${px(visual.letterSpacing)};`)\n  }\n  if (visual.lineHeight !== undefined) {\n    decls.push(`line-height: ${px(visual.lineHeight)};`)\n  }\n\n  // visual.textAlign, visual.transform: intentionally not CSS (see header).\n\n  return decls.join(\"\\n\")\n}\n"]}
+{"version":3,"file":"visual-css.js","sourceRoot":"","sources":["../../src/style/visual-css.ts"],"names":[],"mappings":"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","sourcesContent":["// Compiles a VisualStyle into a GTK4 CSS declaration block (no selector).\n// Pure module — the resulting string is registered as a class through an\n// injected `css` function (see registry.ts / registry.gtkx.ts).\n//\n// GTK4 CSS is not web CSS. What this generator relies on:\n// - background-color, border-*, border-radius (incl. per-corner), opacity,\n//   color, font-*, letter-spacing: supported by GTK4;\n// - line-height: supported since GTK 4.6 (we target 4.20+);\n// - text-align does NOT exist in GTK CSS — textAlign is applied by the Text\n//   component via widget properties (justify/xalign), so it is skipped here;\n// - transform does NOT exist as a widget property in GTK4 CSS either: it is\n//   composed into a matrix by ./transform.ts and applied as the GskTransform\n//   of the child's allocation, so it is skipped here as well.\n\nimport type { VisualStyle } from \"../contracts\"\nimport { parseColor } from \"./colors\"\nimport { warnOnce } from \"./dev-warning\"\n\nconst px = (value: number): string => `${value}px`\n\nconst clamp01 = (value: number): number => Math.min(1, Math.max(0, value))\n\nconst pushColor = (\n  declarations: string[],\n  cssProperty: string,\n  value: string,\n  styleProperty: string,\n): void => {\n  const parsed = parseColor(value)\n  if (parsed === null) {\n    warnOnce(\n      `invalid-color:${styleProperty}:${value}`,\n      `[react-native-gtkx] Invalid color ${JSON.stringify(value)} in \"${styleProperty}\" — declaration dropped`,\n    )\n    return\n  }\n  declarations.push(`${cssProperty}: ${parsed};`)\n}\n\nconst formatFontFamily = (family: string): string => {\n  const trimmed = family.trim()\n  if (/^(\".*\"|'.*')$/.test(trimmed)) {\n    return trimmed\n  }\n  return /^[A-Za-z][\\w-]*$/.test(trimmed)\n    ? trimmed\n    : `\"${trimmed.replace(/\"/g, '\\\\\"')}\"`\n}\n\n/**\n * Renders a VisualStyle as GTK CSS declarations (one per line, stable\n * order). Returns \"\" when the style produces no CSS (e.g. transform-only).\n */\nexport const visualStyleToCss = (visual: VisualStyle): string => {\n  const decls: string[] = []\n\n  if (visual.backgroundColor !== undefined) {\n    pushColor(\n      decls,\n      \"background-color\",\n      visual.backgroundColor,\n      \"backgroundColor\",\n    )\n  }\n  if (visual.opacity !== undefined) {\n    decls.push(`opacity: ${clamp01(visual.opacity)};`)\n  }\n\n  // GTK defaults border-style to none — width alone renders nothing. An\n  // explicit borderStyle wins (GTK4 CSS supports solid/dotted/dashed);\n  // otherwise any positive border width turns the border on with \"solid\".\n  const hasVisibleBorderWidth = [\n    visual.borderWidth,\n    visual.borderTopWidth,\n    visual.borderRightWidth,\n    visual.borderBottomWidth,\n    visual.borderLeftWidth,\n  ].some((width) => width !== undefined && width > 0)\n  if (visual.borderStyle !== undefined) {\n    decls.push(`border-style: ${visual.borderStyle};`)\n  } else if (hasVisibleBorderWidth) {\n    decls.push(\"border-style: solid;\")\n  }\n  // Shorthands first, then per-side overrides so the sides win.\n  if (visual.borderWidth !== undefined) {\n    decls.push(`border-width: ${px(visual.borderWidth)};`)\n  }\n  if (visual.borderTopWidth !== undefined) {\n    decls.push(`border-top-width: ${px(visual.borderTopWidth)};`)\n  }\n  if (visual.borderRightWidth !== undefined) {\n    decls.push(`border-right-width: ${px(visual.borderRightWidth)};`)\n  }\n  if (visual.borderBottomWidth !== undefined) {\n    decls.push(`border-bottom-width: ${px(visual.borderBottomWidth)};`)\n  }\n  if (visual.borderLeftWidth !== undefined) {\n    decls.push(`border-left-width: ${px(visual.borderLeftWidth)};`)\n  }\n  if (visual.borderColor !== undefined) {\n    pushColor(decls, \"border-color\", visual.borderColor, \"borderColor\")\n  }\n  if (visual.borderTopColor !== undefined) {\n    pushColor(\n      decls,\n      \"border-top-color\",\n      visual.borderTopColor,\n      \"borderTopColor\",\n    )\n  }\n  if (visual.borderRightColor !== undefined) {\n    pushColor(\n      decls,\n      \"border-right-color\",\n      visual.borderRightColor,\n      \"borderRightColor\",\n    )\n  }\n  if (visual.borderBottomColor !== undefined) {\n    pushColor(\n      decls,\n      \"border-bottom-color\",\n      visual.borderBottomColor,\n      \"borderBottomColor\",\n    )\n  }\n  if (visual.borderLeftColor !== undefined) {\n    pushColor(\n      decls,\n      \"border-left-color\",\n      visual.borderLeftColor,\n      \"borderLeftColor\",\n    )\n  }\n  if (visual.borderRadius !== undefined) {\n    decls.push(`border-radius: ${px(visual.borderRadius)};`)\n  }\n  // Per-corner radii come after the shorthand so they override it.\n  if (visual.borderTopLeftRadius !== undefined) {\n    decls.push(`border-top-left-radius: ${px(visual.borderTopLeftRadius)};`)\n  }\n  if (visual.borderTopRightRadius !== undefined) {\n    decls.push(`border-top-right-radius: ${px(visual.borderTopRightRadius)};`)\n  }\n  if (visual.borderBottomRightRadius !== undefined) {\n    decls.push(\n      `border-bottom-right-radius: ${px(visual.borderBottomRightRadius)};`,\n    )\n  }\n  if (visual.borderBottomLeftRadius !== undefined) {\n    decls.push(\n      `border-bottom-left-radius: ${px(visual.borderBottomLeftRadius)};`,\n    )\n  }\n\n  if (visual.color !== undefined) {\n    pushColor(decls, \"color\", visual.color, \"color\")\n  }\n  if (visual.fontFamily !== undefined) {\n    decls.push(`font-family: ${formatFontFamily(visual.fontFamily)};`)\n  }\n  if (visual.fontSize !== undefined) {\n    decls.push(`font-size: ${px(visual.fontSize)};`)\n  }\n  if (visual.fontStyle !== undefined) {\n    decls.push(`font-style: ${visual.fontStyle};`)\n  }\n  if (visual.fontWeight !== undefined) {\n    decls.push(`font-weight: ${visual.fontWeight};`)\n  }\n  if (visual.letterSpacing !== undefined) {\n    decls.push(`letter-spacing: ${px(visual.letterSpacing)};`)\n  }\n  if (visual.lineHeight !== undefined) {\n    decls.push(`line-height: ${px(visual.lineHeight)};`)\n  }\n\n  // visual.textAlign, visual.transform: intentionally not CSS (see header).\n\n  return decls.join(\"\\n\")\n}\n"]}

package/dist/svg/geometry.d.ts

@@ -0,0 +1,19 @@
+export type Point = {
+    x: number;
+    y: number;
+};
+export declare const parsePoints: (points: string) => Point[];
+export type RectShape = {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    rx?: number;
+    ry?: number;
+};
+export declare const rectToPathData: ({ x, y, width, height, rx, ry, }: RectShape) => string;
+export declare const ellipseToPathData: (cx: number, cy: number, rx: number, ry: number) => string;
+export declare const circleToPathData: (cx: number, cy: number, r: number) => string;
+export declare const lineToPathData: (x1: number, y1: number, x2: number, y2: number) => string;
+export declare const polygonToPathData: (points: string | Point[]) => string;
+export declare const polylineToPathData: (points: string | Point[]) => string;

package/dist/svg/geometry.js

@@ -0,0 +1,80 @@
+// Pure shape → SVG path `d` string generators. No gtkx imports (unit-testable
+// on any OS, like style/colors.ts) — the only consumer of the output is
+// `Gsk.Path.parse()` in the bridge, so every generator here produces (a
+// superset of) SVG path syntax and nothing else. This is the "no parser of
+// our own" bet from the PRD: <Path> passes its `d` straight through, and
+// every other shape is just a small amount of arithmetic away from the same
+// syntax.
+// Accepts both the comma-separated and whitespace-separated forms RN-svg
+// tolerates ("0,0 10,5" and "0 0 10 5"), and odd trailing tokens are
+// dropped rather than throwing — malformed `points` should render nothing
+// useful, not crash the tree.
+export const parsePoints = (points) => {
+    const numbers = points
+        .trim()
+        .split(/[\s,]+/)
+        .filter((token) => token.length > 0)
+        .map(Number)
+        .filter((value) => !Number.isNaN(value));
+    const result = [];
+    for (let i = 0; i + 1 < numbers.length; i += 2) {
+        result.push({ x: numbers[i], y: numbers[i + 1] });
+    }
+    return result;
+};
+// SVG's rx/ry resolution: either one fills in for a missing other, and both
+// clamp to half the box so opposite corners never overlap.
+const resolveCornerRadii = (width, height, rx, ry) => {
+    const rawRx = rx ?? ry ?? 0;
+    const rawRy = ry ?? rx ?? 0;
+    return [
+        Math.max(0, Math.min(rawRx, width / 2)),
+        Math.max(0, Math.min(rawRy, height / 2)),
+    ];
+};
+export const rectToPathData = ({ x, y, width, height, rx, ry, }) => {
+    if (width <= 0 || height <= 0) {
+        return "";
+    }
+    const [radiusX, radiusY] = resolveCornerRadii(width, height, rx, ry);
+    if (radiusX <= 0 || radiusY <= 0) {
+        return `M ${x} ${y} H ${x + width} V ${y + height} H ${x} Z`;
+    }
+    const right = x + width;
+    const bottom = y + height;
+    return (`M ${x + radiusX} ${y} ` +
+        `H ${right - radiusX} ` +
+        `A ${radiusX} ${radiusY} 0 0 1 ${right} ${y + radiusY} ` +
+        `V ${bottom - radiusY} ` +
+        `A ${radiusX} ${radiusY} 0 0 1 ${right - radiusX} ${bottom} ` +
+        `H ${x + radiusX} ` +
+        `A ${radiusX} ${radiusY} 0 0 1 ${x} ${bottom - radiusY} ` +
+        `V ${y + radiusY} ` +
+        `A ${radiusX} ${radiusY} 0 0 1 ${x + radiusX} ${y} Z`);
+};
+// Two semicircle arcs — the standard trick for a full ellipse/circle in a
+// path grammar that has no dedicated "ellipse" command.
+export const ellipseToPathData = (cx, cy, rx, ry) => {
+    if (rx <= 0 || ry <= 0) {
+        return "";
+    }
+    return (`M ${cx - rx} ${cy} ` +
+        `A ${rx} ${ry} 0 1 0 ${cx + rx} ${cy} ` +
+        `A ${rx} ${ry} 0 1 0 ${cx - rx} ${cy} Z`);
+};
+export const circleToPathData = (cx, cy, r) => ellipseToPathData(cx, cy, r, r);
+export const lineToPathData = (x1, y1, x2, y2) => `M ${x1} ${y1} L ${x2} ${y2}`;
+const pointsToPathData = (points, close) => {
+    if (points.length === 0) {
+        return "";
+    }
+    const [first, ...rest] = points;
+    const segments = rest.map((p) => `L ${p.x} ${p.y}`).join(" ");
+    const body = segments.length > 0
+        ? `M ${first.x} ${first.y} ${segments}`
+        : `M ${first.x} ${first.y}`;
+    return close ? `${body} Z` : body;
+};
+export const polygonToPathData = (points) => pointsToPathData(typeof points === "string" ? parsePoints(points) : points, true);
+export const polylineToPathData = (points) => pointsToPathData(typeof points === "string" ? parsePoints(points) : points, false);
+//# sourceMappingURL=geometry.js.map

package/dist/svg/geometry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"geometry.js","sourceRoot":"","sources":["../../src/svg/geometry.ts"],"names":[],"mappings":"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","sourcesContent":["// Pure shape → SVG path `d` string generators. No gtkx imports (unit-testable\n// on any OS, like style/colors.ts) — the only consumer of the output is\n// `Gsk.Path.parse()` in the bridge, so every generator here produces (a\n// superset of) SVG path syntax and nothing else. This is the \"no parser of\n// our own\" bet from the PRD: <Path> passes its `d` straight through, and\n// every other shape is just a small amount of arithmetic away from the same\n// syntax.\n\nexport type Point = { x: number; y: number }\n\n// Accepts both the comma-separated and whitespace-separated forms RN-svg\n// tolerates (\"0,0 10,5\" and \"0 0 10 5\"), and odd trailing tokens are\n// dropped rather than throwing — malformed `points` should render nothing\n// useful, not crash the tree.\nexport const parsePoints = (points: string): Point[] => {\n  const numbers = points\n    .trim()\n    .split(/[\\s,]+/)\n    .filter((token) => token.length > 0)\n    .map(Number)\n    .filter((value) => !Number.isNaN(value))\n  const result: Point[] = []\n  for (let i = 0; i + 1 < numbers.length; i += 2) {\n    result.push({ x: numbers[i]!, y: numbers[i + 1]! })\n  }\n  return result\n}\n\nexport type RectShape = {\n  x: number\n  y: number\n  width: number\n  height: number\n  rx?: number\n  ry?: number\n}\n\n// SVG's rx/ry resolution: either one fills in for a missing other, and both\n// clamp to half the box so opposite corners never overlap.\nconst resolveCornerRadii = (\n  width: number,\n  height: number,\n  rx: number | undefined,\n  ry: number | undefined,\n): [number, number] => {\n  const rawRx = rx ?? ry ?? 0\n  const rawRy = ry ?? rx ?? 0\n  return [\n    Math.max(0, Math.min(rawRx, width / 2)),\n    Math.max(0, Math.min(rawRy, height / 2)),\n  ]\n}\n\nexport const rectToPathData = ({\n  x,\n  y,\n  width,\n  height,\n  rx,\n  ry,\n}: RectShape): string => {\n  if (width <= 0 || height <= 0) {\n    return \"\"\n  }\n  const [radiusX, radiusY] = resolveCornerRadii(width, height, rx, ry)\n  if (radiusX <= 0 || radiusY <= 0) {\n    return `M ${x} ${y} H ${x + width} V ${y + height} H ${x} Z`\n  }\n  const right = x + width\n  const bottom = y + height\n  return (\n    `M ${x + radiusX} ${y} ` +\n    `H ${right - radiusX} ` +\n    `A ${radiusX} ${radiusY} 0 0 1 ${right} ${y + radiusY} ` +\n    `V ${bottom - radiusY} ` +\n    `A ${radiusX} ${radiusY} 0 0 1 ${right - radiusX} ${bottom} ` +\n    `H ${x + radiusX} ` +\n    `A ${radiusX} ${radiusY} 0 0 1 ${x} ${bottom - radiusY} ` +\n    `V ${y + radiusY} ` +\n    `A ${radiusX} ${radiusY} 0 0 1 ${x + radiusX} ${y} Z`\n  )\n}\n\n// Two semicircle arcs — the standard trick for a full ellipse/circle in a\n// path grammar that has no dedicated \"ellipse\" command.\nexport const ellipseToPathData = (\n  cx: number,\n  cy: number,\n  rx: number,\n  ry: number,\n): string => {\n  if (rx <= 0 || ry <= 0) {\n    return \"\"\n  }\n  return (\n    `M ${cx - rx} ${cy} ` +\n    `A ${rx} ${ry} 0 1 0 ${cx + rx} ${cy} ` +\n    `A ${rx} ${ry} 0 1 0 ${cx - rx} ${cy} Z`\n  )\n}\n\nexport const circleToPathData = (cx: number, cy: number, r: number): string =>\n  ellipseToPathData(cx, cy, r, r)\n\nexport const lineToPathData = (\n  x1: number,\n  y1: number,\n  x2: number,\n  y2: number,\n): string => `M ${x1} ${y1} L ${x2} ${y2}`\n\nconst pointsToPathData = (points: Point[], close: boolean): string => {\n  if (points.length === 0) {\n    return \"\"\n  }\n  const [first, ...rest] = points\n  const segments = rest.map((p) => `L ${p.x} ${p.y}`).join(\" \")\n  const body =\n    segments.length > 0\n      ? `M ${first!.x} ${first!.y} ${segments}`\n      : `M ${first!.x} ${first!.y}`\n  return close ? `${body} Z` : body\n}\n\nexport const polygonToPathData = (points: string | Point[]): string =>\n  pointsToPathData(\n    typeof points === \"string\" ? parsePoints(points) : points,\n    true,\n  )\n\nexport const polylineToPathData = (points: string | Point[]): string =>\n  pointsToPathData(\n    typeof points === \"string\" ? parsePoints(points) : points,\n    false,\n  )\n"]}

package/dist/svg/gradient-geometry.d.ts

@@ -0,0 +1,15 @@
+export type BoundingBox = {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+};
+export type GradientUnits = "objectBoundingBox" | "userSpaceOnUse";
+export declare const resolveGradientPoint: (bounds: BoundingBox, fractionX: number, fractionY: number, units: GradientUnits) => {
+    x: number;
+    y: number;
+};
+export declare const resolveGradientRadius: (bounds: BoundingBox, r: number, units: GradientUnits) => {
+    hradius: number;
+    vradius: number;
+};

package/dist/svg/gradient-geometry.js

@@ -0,0 +1,18 @@
+// Pure objectBoundingBox / userSpaceOnUse coordinate math for gradients — no
+// gtkx imports, so it stays testable even though the bridge's actual
+// gradient PAINT is currently blocked by an upstream gtkx-rc2 native bug
+// (see the WORKAROUND note by makeColorStop in gtkx/bridge/svg-node.ts).
+// This is the part of gradient support that already works end to end today
+// and will need no changes once that bug is fixed upstream.
+export const resolveGradientPoint = (bounds, fractionX, fractionY, units) => units === "userSpaceOnUse"
+    ? { x: fractionX, y: fractionY }
+    : {
+        x: bounds.x + fractionX * bounds.width,
+        y: bounds.y + fractionY * bounds.height,
+    };
+// SVG only has one radial radius; objectBoundingBox stretches it into an
+// ellipse matching the shape's own aspect ratio (what browsers do too).
+export const resolveGradientRadius = (bounds, r, units) => units === "userSpaceOnUse"
+    ? { hradius: r, vradius: r }
+    : { hradius: r * bounds.width, vradius: r * bounds.height };
+//# sourceMappingURL=gradient-geometry.js.map

package/dist/svg/gradient-geometry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gradient-geometry.js","sourceRoot":"","sources":["../../src/svg/gradient-geometry.ts"],"names":[],"mappings":"AAAA,6EAA6E;AAC7E,qEAAqE;AACrE,yEAAyE;AACzE,yEAAyE;AACzE,2EAA2E;AAC3E,4DAA4D;AAU5D,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAClC,MAAmB,EACnB,SAAiB,EACjB,SAAiB,EACjB,KAAoB,EACM,EAAE,CAC5B,KAAK,KAAK,gBAAgB;IACxB,CAAC,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE;IAChC,CAAC,CAAC;QACE,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,SAAS,GAAG,MAAM,CAAC,KAAK;QACtC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,SAAS,GAAG,MAAM,CAAC,MAAM;KACxC,CAAA;AAEP,yEAAyE;AACzE,wEAAwE;AACxE,MAAM,CAAC,MAAM,qBAAqB,GAAG,CACnC,MAAmB,EACnB,CAAS,EACT,KAAoB,EACkB,EAAE,CACxC,KAAK,KAAK,gBAAgB;IACxB,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE;IAC5B,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,GAAG,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAA","sourcesContent":["// Pure objectBoundingBox / userSpaceOnUse coordinate math for gradients — no\n// gtkx imports, so it stays testable even though the bridge's actual\n// gradient PAINT is currently blocked by an upstream gtkx-rc2 native bug\n// (see the WORKAROUND note by makeColorStop in gtkx/bridge/svg-node.ts).\n// This is the part of gradient support that already works end to end today\n// and will need no changes once that bug is fixed upstream.\n\nexport type BoundingBox = {\n  x: number\n  y: number\n  width: number\n  height: number\n}\nexport type GradientUnits = \"objectBoundingBox\" | \"userSpaceOnUse\"\n\nexport const resolveGradientPoint = (\n  bounds: BoundingBox,\n  fractionX: number,\n  fractionY: number,\n  units: GradientUnits,\n): { x: number; y: number } =>\n  units === \"userSpaceOnUse\"\n    ? { x: fractionX, y: fractionY }\n    : {\n        x: bounds.x + fractionX * bounds.width,\n        y: bounds.y + fractionY * bounds.height,\n      }\n\n// SVG only has one radial radius; objectBoundingBox stretches it into an\n// ellipse matching the shape's own aspect ratio (what browsers do too).\nexport const resolveGradientRadius = (\n  bounds: BoundingBox,\n  r: number,\n  units: GradientUnits,\n): { hradius: number; vradius: number } =>\n  units === \"userSpaceOnUse\"\n    ? { hradius: r, vradius: r }\n    : { hradius: r * bounds.width, vradius: r * bounds.height }\n"]}

package/dist/svg/transform.d.ts

@@ -0,0 +1,22 @@
+export type SvgTransformOp = {
+    type: "translate";
+    x: number;
+    y: number;
+} | {
+    type: "scale";
+    x: number;
+    y: number;
+} | {
+    type: "rotate";
+    angleDeg: number;
+} | {
+    type: "matrix";
+    a: number;
+    b: number;
+    c: number;
+    d: number;
+    e: number;
+    f: number;
+};
+/** Parses an SVG transform-list string left to right into primitive ops. */
+export declare const parseSvgTransform: (value: string | undefined) => SvgTransformOp[];

package/dist/svg/transform.js

@@ -0,0 +1,74 @@
+// Pure parser for the SVG `transform` attribute's function-list syntax
+// (translate/scale/rotate/matrix — no gtkx imports, unit-testable anywhere).
+// `skewX`/`skewY` are a deliberate cut (see epic.md): nothing in the shapes
+// this API ships needs them, and Gsk's skew() takes degrees on both axes
+// while SVG's skewX/skewY are single-axis, different enough to not be a
+// one-line addition later if it turns out to matter.
+//
+// `rotate(angle, cx, cy)` is expanded here into translate/rotate/translate
+// so the bridge only ever has to apply four primitive ops, never carry
+// pivot-point bookkeeping of its own.
+const CALL_PATTERN = /([a-zA-Z]+)\s*\(([^)]*)\)/g;
+const parseArgs = (raw) => raw
+    .trim()
+    .split(/[\s,]+/)
+    .filter((token) => token.length > 0)
+    .map(Number);
+const isAllFinite = (values) => values.every((value) => Number.isFinite(value));
+const buildOps = (name, args) => {
+    switch (name) {
+        case "translate": {
+            if (args.length < 1 || args.length > 2 || !isAllFinite(args)) {
+                return [];
+            }
+            const [x, y = 0] = args;
+            return [{ type: "translate", x: x, y }];
+        }
+        case "scale": {
+            if (args.length < 1 || args.length > 2 || !isAllFinite(args)) {
+                return [];
+            }
+            const [x, y = x] = args;
+            return [{ type: "scale", x: x, y: y }];
+        }
+        case "rotate": {
+            if ((args.length !== 1 && args.length !== 3) || !isAllFinite(args)) {
+                return [];
+            }
+            const [angleDeg, cx, cy] = args;
+            if (cx === undefined || cy === undefined) {
+                return [{ type: "rotate", angleDeg: angleDeg }];
+            }
+            return [
+                { type: "translate", x: cx, y: cy },
+                { type: "rotate", angleDeg: angleDeg },
+                { type: "translate", x: -cx, y: -cy },
+            ];
+        }
+        case "matrix": {
+            if (args.length !== 6 || !isAllFinite(args)) {
+                return [];
+            }
+            const [a, b, c, d, e, f] = args;
+            return [{ type: "matrix", a: a, b: b, c: c, d: d, e: e, f: f }];
+        }
+        default:
+            // skewX/skewY (deliberate cut) and anything unrecognized: ignored,
+            // same leniency RN-svg shows toward transform-list garbage.
+            return [];
+    }
+};
+/** Parses an SVG transform-list string left to right into primitive ops. */
+export const parseSvgTransform = (value) => {
+    if (!value) {
+        return [];
+    }
+    const ops = [];
+    for (const match of value.matchAll(CALL_PATTERN)) {
+        const name = match[1];
+        const args = parseArgs(match[2] ?? "");
+        ops.push(...buildOps(name, args));
+    }
+    return ops;
+};
+//# sourceMappingURL=transform.js.map

package/dist/svg/transform.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transform.js","sourceRoot":"","sources":["../../src/svg/transform.ts"],"names":[],"mappings":"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","sourcesContent":["// Pure parser for the SVG `transform` attribute's function-list syntax\n// (translate/scale/rotate/matrix — no gtkx imports, unit-testable anywhere).\n// `skewX`/`skewY` are a deliberate cut (see epic.md): nothing in the shapes\n// this API ships needs them, and Gsk's skew() takes degrees on both axes\n// while SVG's skewX/skewY are single-axis, different enough to not be a\n// one-line addition later if it turns out to matter.\n//\n// `rotate(angle, cx, cy)` is expanded here into translate/rotate/translate\n// so the bridge only ever has to apply four primitive ops, never carry\n// pivot-point bookkeeping of its own.\n\nexport type SvgTransformOp =\n  | { type: \"translate\"; x: number; y: number }\n  | { type: \"scale\"; x: number; y: number }\n  | { type: \"rotate\"; angleDeg: number }\n  | {\n      type: \"matrix\"\n      a: number\n      b: number\n      c: number\n      d: number\n      e: number\n      f: number\n    }\n\nconst CALL_PATTERN = /([a-zA-Z]+)\\s*\\(([^)]*)\\)/g\n\nconst parseArgs = (raw: string): number[] =>\n  raw\n    .trim()\n    .split(/[\\s,]+/)\n    .filter((token) => token.length > 0)\n    .map(Number)\n\nconst isAllFinite = (values: number[]): boolean =>\n  values.every((value) => Number.isFinite(value))\n\nconst buildOps = (name: string, args: number[]): SvgTransformOp[] => {\n  switch (name) {\n    case \"translate\": {\n      if (args.length < 1 || args.length > 2 || !isAllFinite(args)) {\n        return []\n      }\n      const [x, y = 0] = args\n      return [{ type: \"translate\", x: x!, y }]\n    }\n    case \"scale\": {\n      if (args.length < 1 || args.length > 2 || !isAllFinite(args)) {\n        return []\n      }\n      const [x, y = x] = args\n      return [{ type: \"scale\", x: x!, y: y! }]\n    }\n    case \"rotate\": {\n      if ((args.length !== 1 && args.length !== 3) || !isAllFinite(args)) {\n        return []\n      }\n      const [angleDeg, cx, cy] = args\n      if (cx === undefined || cy === undefined) {\n        return [{ type: \"rotate\", angleDeg: angleDeg! }]\n      }\n      return [\n        { type: \"translate\", x: cx, y: cy },\n        { type: \"rotate\", angleDeg: angleDeg! },\n        { type: \"translate\", x: -cx, y: -cy },\n      ]\n    }\n    case \"matrix\": {\n      if (args.length !== 6 || !isAllFinite(args)) {\n        return []\n      }\n      const [a, b, c, d, e, f] = args\n      return [{ type: \"matrix\", a: a!, b: b!, c: c!, d: d!, e: e!, f: f! }]\n    }\n    default:\n      // skewX/skewY (deliberate cut) and anything unrecognized: ignored,\n      // same leniency RN-svg shows toward transform-list garbage.\n      return []\n  }\n}\n\n/** Parses an SVG transform-list string left to right into primitive ops. */\nexport const parseSvgTransform = (\n  value: string | undefined,\n): SvgTransformOp[] => {\n  if (!value) {\n    return []\n  }\n  const ops: SvgTransformOp[] = []\n  for (const match of value.matchAll(CALL_PATTERN)) {\n    const name = match[1]!\n    const args = parseArgs(match[2] ?? \"\")\n    ops.push(...buildOps(name, args))\n  }\n  return ops\n}\n"]}

package/dist/svg/view-box.d.ts

@@ -0,0 +1,34 @@
+export type ViewBox = {
+    minX: number;
+    minY: number;
+    width: number;
+    height: number;
+};
+export declare const parseViewBox: (value: string | undefined) => ViewBox | null;
+export type AlignX = "min" | "mid" | "max";
+export type AlignY = "min" | "mid" | "max";
+export type MeetOrSlice = "meet" | "slice";
+export type PreserveAspectRatio = {
+    align: "none" | {
+        x: AlignX;
+        y: AlignY;
+    };
+    meetOrSlice: MeetOrSlice;
+};
+export declare const DEFAULT_PRESERVE_ASPECT_RATIO: PreserveAspectRatio;
+export declare const parsePreserveAspectRatio: (value: string | undefined) => PreserveAspectRatio;
+export type ViewBoxTransform = {
+    scaleX: number;
+    scaleY: number;
+    translateX: number;
+    translateY: number;
+};
+/**
+ * Maps viewBox user-space coordinates onto a `viewportWidth` x
+ * `viewportHeight` box: `screen = user * scale + translate`. Mirrors the SVG
+ * algorithm exactly (see spec §7.11) — "none" stretches independently per
+ * axis, "meet" fits the whole viewBox inside the viewport (letterboxing),
+ * "slice" fills the viewport and overflows the viewBox (the bridge clips to
+ * the viewport bounds, same as a real SVG renderer).
+ */
+export declare const resolveViewBoxTransform: (viewBox: ViewBox | null, viewportWidth: number, viewportHeight: number, preserveAspectRatio?: PreserveAspectRatio) => ViewBoxTransform;