feat: introduce archify skill for generating architecture diagrams
- Added a new Archify skill, enabling users to create polished architecture, workflow, sequence, data-flow, and lifecycle diagrams. - Implemented comprehensive functionality including rendering, validation, and delivery of diagrams in various formats. - Integrated a user-friendly command-line interface for generating and previewing diagrams. - Developed supporting files including package.json, LICENSE, and SKILL.md for documentation and licensing. - Added unit tests to ensure reliability and functionality of the new skill. These changes enhance the application by providing a structured approach to visualizing system architecture and workflows, improving user experience and data representation.
This commit is contained in:
shancheas
@@ -0,0 +1,835 @@
|
||||
#!/usr/bin/env node
|
||||
|
||||
import fs from 'node:fs';
|
||||
import path from 'node:path';
|
||||
import { collectAmbiguousCorridors, collectBorderRuns, collectLabelRouteClearance, collectRouteRhythmIssues, routeBudgetMetrics } from '../renderers/shared/geometry.mjs';
|
||||
import {
|
||||
DESKTOP_READABILITY_VIEWPORT,
|
||||
DESKTOP_READER_DIAGRAM_WIDTH,
|
||||
MIN_PROJECTED_NODE_TEXT_PX,
|
||||
projectedNodeTextPx,
|
||||
} from '../renderers/shared/desktop-readability.mjs';
|
||||
|
||||
const input = process.argv[2];
|
||||
|
||||
if (!input || input === '-h' || input === '--help') {
|
||||
console.error('Usage: node scripts/check-render-output.mjs <diagram.html>');
|
||||
process.exit(input ? 0 : 2);
|
||||
}
|
||||
|
||||
const htmlPath = path.resolve(input);
|
||||
let html;
|
||||
try {
|
||||
html = fs.readFileSync(htmlPath, 'utf8');
|
||||
} catch (err) {
|
||||
console.error(JSON.stringify({
|
||||
ok: false,
|
||||
file: htmlPath,
|
||||
checks: [{ name: 'file_readable', ok: false, details: [err.message] }],
|
||||
}, null, 2));
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
const checks = [];
|
||||
let composition = {
|
||||
schemaVersion: 1,
|
||||
profile: 'standard',
|
||||
status: 'pass',
|
||||
summary: { errors: 0, warnings: 0 },
|
||||
metrics: {
|
||||
properCrossings: 0,
|
||||
ambiguousCorridors: 0,
|
||||
containerBorderRuns: 0,
|
||||
labelRouteClearanceIssues: 0,
|
||||
minLabelRouteClearance: null,
|
||||
maxBends: 0,
|
||||
routesOverSuggestedBends: 0,
|
||||
maxStretch: null,
|
||||
routesOverSuggestedStretch: 0,
|
||||
minSegmentPx: null,
|
||||
minInteriorSegmentPx: null,
|
||||
shortSegmentCount: 0,
|
||||
shortEndpointSegmentCount: 0,
|
||||
shortInteriorSegmentCount: 0,
|
||||
microSegmentCount: 0,
|
||||
desktopReadabilityIssues: 0,
|
||||
minProjectedNodeTextPx: null,
|
||||
},
|
||||
suggestedLimits: { bendsPerRelationship: 2, stretch: 1.35, segmentPx: 16, microSegmentPx: 8 },
|
||||
issues: [],
|
||||
};
|
||||
|
||||
function addCheck(name, ok, details = []) {
|
||||
checks.push({ name, ok, details });
|
||||
}
|
||||
|
||||
const svgMatches = [...html.matchAll(/<svg\b[\s\S]*?<\/svg>/gi)];
|
||||
addCheck('single_svg', svgMatches.length === 1, [`found ${svgMatches.length} <svg> block(s)`]);
|
||||
|
||||
if (svgMatches.length === 1) {
|
||||
const svg = svgMatches[0][0];
|
||||
const svgRoot = svg.match(/<svg\b[^>]*>/i)?.[0] || '';
|
||||
const svgAttrs = parseAttrs(svgRoot);
|
||||
const qualityProfile = svgAttrs['data-quality-profile'] || 'standard';
|
||||
const qualityGatesEnforced = svgAttrs['data-quality-gates'] !== 'advisory';
|
||||
addCheck('finite_svg', !/\b(?:NaN|undefined|Infinity|-Infinity)\b/.test(svg));
|
||||
const legendStart = svg.indexOf('<!-- Legend -->');
|
||||
const beforeLegend = legendStart >= 0 ? svg.slice(0, legendStart) : svg;
|
||||
const desktopReadabilityIssue = collectDesktopReadability(svgAttrs, beforeLegend);
|
||||
const arrows = collectArrows(beforeLegend);
|
||||
const diagonal = arrows.flatMap((arrow) => diagonalStraightSegments(arrow).map((segment) => ({ arrow, ...segment })));
|
||||
addCheck(
|
||||
'orthogonal_arrows',
|
||||
diagonal.length === 0,
|
||||
diagonal.map(({ arrow, segmentIndex }) => `${arrow.kind} ${arrow.index} segment ${segmentIndex + 1}: ${arrow.raw}`),
|
||||
);
|
||||
const relationshipCrossings = collectRelationshipCrossings(arrows);
|
||||
const compositionFrames = collectCompositionFrames(beforeLegend);
|
||||
const containerBorderRuns = collectBorderRuns({
|
||||
routedRelations: arrows
|
||||
.filter((arrow) => arrow.from && arrow.to && arrow.borderSegments.length)
|
||||
.map((arrow) => ({
|
||||
relation: arrow,
|
||||
relationIndex: arrow.index,
|
||||
segments: arrow.borderSegments,
|
||||
})),
|
||||
frames: compositionFrames,
|
||||
});
|
||||
const routedRelationships = arrows
|
||||
.filter((arrow) => arrow.from && arrow.to && arrow.routePoints.length)
|
||||
.map((arrow) => ({ relation: arrow, relationIndex: arrow.index, points: arrow.routePoints }));
|
||||
const routeMetrics = routeBudgetMetrics({ routedRelations: routedRelationships });
|
||||
const routeRhythmIssues = collectRouteRhythmIssues({ routedRelations: routedRelationships });
|
||||
const ambiguousCorridors = collectAmbiguousCorridors({ routedRelations: routedRelationships });
|
||||
const relationshipLabels = collectRelationshipLabelMasks(beforeLegend, arrows);
|
||||
const labelClearanceThreshold = qualityProfile === 'showcase' ? 4 : 2;
|
||||
const labelRouteMeasurements = collectLabelRouteClearance({
|
||||
labels: relationshipLabels,
|
||||
routedRelations: arrows.map((arrow) => ({ relation: arrow, relationIndex: arrow.index, points: arrow.routePoints })),
|
||||
threshold: Number.MAX_VALUE,
|
||||
});
|
||||
const labelRouteClearance = collectLabelRouteClearance({
|
||||
labels: relationshipLabels,
|
||||
routedRelations: arrows.map((arrow) => ({ relation: arrow, relationIndex: arrow.index, points: arrow.routePoints })),
|
||||
threshold: labelClearanceThreshold,
|
||||
});
|
||||
const crossingIsError = qualityProfile === 'showcase';
|
||||
const corridorIsError = qualityProfile === 'showcase';
|
||||
const rhythmIsError = qualityProfile === 'showcase';
|
||||
const labelClearanceIsError = qualityProfile === 'showcase';
|
||||
const desktopReadabilityIsError = qualityProfile === 'showcase';
|
||||
const compositionErrors = (qualityGatesEnforced ? containerBorderRuns.length : 0)
|
||||
+ (crossingIsError ? relationshipCrossings.length : 0)
|
||||
+ (corridorIsError ? ambiguousCorridors.length : 0)
|
||||
+ (labelClearanceIsError ? labelRouteClearance.length : 0)
|
||||
+ (rhythmIsError ? routeRhythmIssues.length : 0)
|
||||
+ (desktopReadabilityIsError && desktopReadabilityIssue ? 1 : 0);
|
||||
const compositionWarnings = (qualityGatesEnforced ? 0 : containerBorderRuns.length)
|
||||
+ (crossingIsError ? 0 : relationshipCrossings.length)
|
||||
+ (corridorIsError ? 0 : ambiguousCorridors.length)
|
||||
+ (labelClearanceIsError ? 0 : labelRouteClearance.length)
|
||||
+ (rhythmIsError ? 0 : routeRhythmIssues.length)
|
||||
+ (desktopReadabilityIsError || !desktopReadabilityIssue ? 0 : 1);
|
||||
composition = {
|
||||
schemaVersion: 1,
|
||||
profile: qualityProfile,
|
||||
status: compositionErrors ? 'fail' : 'pass',
|
||||
summary: {
|
||||
errors: compositionErrors,
|
||||
warnings: compositionWarnings,
|
||||
},
|
||||
metrics: {
|
||||
properCrossings: relationshipCrossings.length,
|
||||
ambiguousCorridors: ambiguousCorridors.length,
|
||||
containerBorderRuns: containerBorderRuns.length,
|
||||
labelRouteClearanceIssues: labelRouteClearance.length,
|
||||
minLabelRouteClearance: labelRouteMeasurements.length
|
||||
? Math.round(Math.min(...labelRouteMeasurements.map((hit) => hit.clearance)) * 10) / 10
|
||||
: null,
|
||||
desktopReadabilityIssues: desktopReadabilityIssue ? 1 : 0,
|
||||
minProjectedNodeTextPx: desktopReadabilityIssue?.projectedFontPx ?? null,
|
||||
...roundedRouteMetrics(routeMetrics),
|
||||
},
|
||||
suggestedLimits: { bendsPerRelationship: 2, stretch: 1.35, segmentPx: 16, microSegmentPx: 8 },
|
||||
issues: [
|
||||
...containerBorderRuns.map((hit) => ({
|
||||
severity: qualityGatesEnforced ? 'error' : 'warning',
|
||||
code: 'composition/container-border-run',
|
||||
relationship: relationshipRecord(hit.relation),
|
||||
frame: frameRecord(hit.frame),
|
||||
side: hit.side,
|
||||
segmentIndex: hit.segmentIndex,
|
||||
overlapLength: Math.round(hit.overlapLength * 10) / 10,
|
||||
from: hit.overlapStart.map((value) => Math.round(value * 10) / 10),
|
||||
to: hit.overlapEnd.map((value) => Math.round(value * 10) / 10),
|
||||
})),
|
||||
...labelRouteClearance.map((hit) => ({
|
||||
severity: labelClearanceIsError ? 'error' : 'warning',
|
||||
code: 'composition/label-route-clearance',
|
||||
label: hit.label?.label || hit.labelRelation?.label || '',
|
||||
labelRelationship: relationshipRecord(hit.labelRelation),
|
||||
otherRelationship: relationshipRecord(hit.otherRelation),
|
||||
segmentIndex: hit.segmentIndex,
|
||||
labelRect: roundedRect(hit.rect),
|
||||
clearance: Math.round(hit.clearance * 10) / 10,
|
||||
intersectionLength: Math.round((hit.intersectionLength || 0) * 10) / 10,
|
||||
threshold: hit.threshold,
|
||||
from: hit.start.map((value) => Math.round(value * 10) / 10),
|
||||
to: hit.end.map((value) => Math.round(value * 10) / 10),
|
||||
})),
|
||||
...relationshipCrossings.map((hit) => ({
|
||||
severity: crossingIsError ? 'error' : 'warning',
|
||||
code: 'composition/proper-crossing',
|
||||
relationship: relationshipRecord(hit.left),
|
||||
otherRelationship: relationshipRecord(hit.right),
|
||||
point: hit.point.map((value) => Math.round(value * 10) / 10),
|
||||
})),
|
||||
...ambiguousCorridors.map((hit) => ({
|
||||
severity: corridorIsError ? 'error' : 'warning',
|
||||
code: 'composition/ambiguous-corridor',
|
||||
relationship: relationshipRecord(hit.left.relation),
|
||||
otherRelationship: relationshipRecord(hit.right.relation),
|
||||
segmentIndex: hit.leftSegment,
|
||||
otherSegmentIndex: hit.rightSegment,
|
||||
overlapLength: Math.round(hit.overlapLength * 10) / 10,
|
||||
from: hit.overlapStart.map((value) => Math.round(value * 10) / 10),
|
||||
to: hit.overlapEnd.map((value) => Math.round(value * 10) / 10),
|
||||
})),
|
||||
...routeRhythmIssues.map((hit) => ({
|
||||
severity: rhythmIsError ? 'error' : 'warning',
|
||||
code: hit.code,
|
||||
relationship: relationshipRecord(hit.relation),
|
||||
segmentIndex: hit.segmentIndex,
|
||||
position: hit.position,
|
||||
length: Math.round(hit.length * 10) / 10,
|
||||
from: hit.start.map((value) => Math.round(value * 10) / 10),
|
||||
to: hit.end.map((value) => Math.round(value * 10) / 10),
|
||||
})),
|
||||
...(desktopReadabilityIssue ? [{
|
||||
severity: desktopReadabilityIsError ? 'error' : 'warning',
|
||||
code: 'composition/desktop-readability',
|
||||
viewportWidth: DESKTOP_READABILITY_VIEWPORT.width,
|
||||
viewportHeight: DESKTOP_READABILITY_VIEWPORT.height,
|
||||
availableDiagramWidth: DESKTOP_READER_DIAGRAM_WIDTH,
|
||||
viewBoxWidth: desktopReadabilityIssue.viewBoxWidth,
|
||||
scale: desktopReadabilityIssue.scale,
|
||||
text: desktopReadabilityIssue.text,
|
||||
detail: desktopReadabilityIssue.detail,
|
||||
sourceFontPx: desktopReadabilityIssue.sourceFontPx,
|
||||
projectedFontPx: desktopReadabilityIssue.projectedFontPx,
|
||||
minimumProjectedFontPx: MIN_PROJECTED_NODE_TEXT_PX,
|
||||
}] : []),
|
||||
],
|
||||
};
|
||||
addCheck(
|
||||
'label_route_clearance',
|
||||
!labelClearanceIsError || labelRouteClearance.length === 0,
|
||||
labelRouteClearance.map((hit) => (
|
||||
`[composition/label-route-clearance] ${qualityProfile} label "${hit.label?.label || hit.labelRelation?.label || ''}" on ${relationshipName(hit.labelRelation)} is ${Math.round(hit.clearance * 10) / 10}px from ${relationshipName(hit.otherRelation)} segment ${hit.segmentIndex} [${formatPoint(hit.start)}] -> [${formatPoint(hit.end)}]${hit.intersectionLength > 0 ? ` with ${Math.round(hit.intersectionLength * 10) / 10}px hidden by the mask` : ''} (minimum ${hit.threshold}px) — use renderer-supported label controls (message y for sequence; otherwise labelAt, labelDx, labelDy, or labelSegment), or adjust the other relationship route/via/channel.`
|
||||
)),
|
||||
);
|
||||
addCheck(
|
||||
'relationship_crossings',
|
||||
!crossingIsError || relationshipCrossings.length === 0,
|
||||
relationshipCrossings.map((hit) => (
|
||||
`[composition/proper-crossing] ${qualityProfile} ${relationshipName(hit.left)} crosses ${relationshipName(hit.right)} at [${formatPoint(hit.point)}]`
|
||||
)),
|
||||
);
|
||||
addCheck(
|
||||
'relationship_corridors',
|
||||
!corridorIsError || ambiguousCorridors.length === 0,
|
||||
ambiguousCorridors.map((hit) => (
|
||||
`[composition/ambiguous-corridor] ${qualityProfile} ${relationshipName(hit.left.relation)} shares a ${Math.round(hit.overlapLength * 10) / 10}px corridor with ${relationshipName(hit.right.relation)} at [${formatPoint(hit.overlapStart)}] -> [${formatPoint(hit.overlapEnd)}]`
|
||||
)),
|
||||
);
|
||||
addCheck(
|
||||
'container_border_runs',
|
||||
!qualityGatesEnforced || containerBorderRuns.length === 0,
|
||||
containerBorderRuns.map((hit) => (
|
||||
`[composition/container-border-run] ${relationshipName(hit.relation)} follows ${frameName(hit.frame)} ${hit.side} border for ${Math.round(hit.overlapLength * 10) / 10}px on segment ${hit.segmentIndex} [${formatPoint(hit.overlapStart)}] -> [${formatPoint(hit.overlapEnd)}]`
|
||||
)),
|
||||
);
|
||||
addCheck(
|
||||
'route_rhythm',
|
||||
!rhythmIsError || routeRhythmIssues.length === 0,
|
||||
routeRhythmIssues.map((hit) => (
|
||||
`[${hit.code}] ${qualityProfile} ${relationshipName(hit.relation)} has a ${Math.round(hit.length * 10) / 10}px ${hit.position} segment ${hit.segmentIndex} [${formatPoint(hit.start)}] -> [${formatPoint(hit.end)}]`
|
||||
)),
|
||||
);
|
||||
|
||||
if (legendStart >= 0) {
|
||||
const legendFragment = svg.slice(legendStart);
|
||||
const legendBoxes = collectLegendBoxes(legendFragment);
|
||||
const collisions = collectLegendCollisions(arrows, legendBoxes);
|
||||
addCheck(
|
||||
'legend_clearance',
|
||||
collisions.length === 0,
|
||||
collisions.map((hit) => `${hit.arrow.kind} ${hit.arrow.index} crosses legend ${hit.box.label}`),
|
||||
);
|
||||
} else {
|
||||
addCheck('legend_clearance', true, ['no legend marker found']);
|
||||
}
|
||||
}
|
||||
|
||||
const ok = checks.every((check) => check.ok) && composition.status !== 'fail';
|
||||
console.log(JSON.stringify({ ok, file: htmlPath, checks, composition }, null, 2));
|
||||
process.exit(ok ? 0 : 1);
|
||||
|
||||
function collectArrows(fragment) {
|
||||
const arrows = [];
|
||||
let index = 0;
|
||||
|
||||
for (const tag of fragment.matchAll(/<(path|line)\b[^>]*>/gi)) {
|
||||
const raw = tag[0];
|
||||
if (!/\bclass="[^"]*\ba-(?:default|emphasis|security|dashed)\b/.test(raw)) continue;
|
||||
if (!/\bmarker-end=/.test(raw)) continue;
|
||||
const attrs = parseAttrs(raw);
|
||||
const segments = tag[1].toLowerCase() === 'line'
|
||||
? lineSegments(attrs)
|
||||
: pathSegments(attrs.d || '');
|
||||
const borderSegments = tag[1].toLowerCase() === 'line'
|
||||
? segments
|
||||
: straightPathSegments(attrs.d || '');
|
||||
arrows.push({
|
||||
kind: tag[1].toLowerCase(),
|
||||
index: index += 1,
|
||||
raw,
|
||||
segments,
|
||||
borderSegments,
|
||||
routePoints: parseRoutePoints(attrs['data-composition-points']) || (
|
||||
borderSegments.length ? [borderSegments[0].start, ...borderSegments.map((segment) => segment.end)] : []
|
||||
),
|
||||
from: attrs['data-edge-from'] || attrs['data-composition-edge-from'],
|
||||
to: attrs['data-edge-to'] || attrs['data-composition-edge-to'],
|
||||
id: attrs['data-edge-id'] || attrs['data-composition-edge-id'],
|
||||
key: attrs['data-edge-key'],
|
||||
label: attrs['data-edge-label'],
|
||||
offset: tag.index,
|
||||
});
|
||||
}
|
||||
|
||||
return arrows;
|
||||
}
|
||||
|
||||
function collectRelationshipLabelMasks(fragment, arrows) {
|
||||
const labels = [];
|
||||
for (const match of fragment.matchAll(/<g\b[^>]*\bdata-edge-(?:key|id|from)="[^"]*"[^>]*>[\s\S]*?<\/g>/gi)) {
|
||||
const group = match[0];
|
||||
const groupAttrs = parseAttrs(group.match(/<g\b[^>]*>/i)?.[0] || '');
|
||||
const rectTag = [...group.matchAll(/<rect\b[^>]*>/gi)]
|
||||
.map((item) => item[0])
|
||||
.find((tag) => /\bclass="[^"]*\bc-mask\b/.test(tag));
|
||||
if (!rectTag) continue;
|
||||
const attrs = parseAttrs(rectTag);
|
||||
const rect = {
|
||||
x: numberAttr(attrs, 'x'),
|
||||
y: numberAttr(attrs, 'y'),
|
||||
width: numberAttr(attrs, 'width'),
|
||||
height: numberAttr(attrs, 'height'),
|
||||
};
|
||||
if (![rect.x, rect.y, rect.width, rect.height].every(Number.isFinite)) continue;
|
||||
const groupStart = match.index;
|
||||
const groupEnd = groupStart + group.length;
|
||||
const containedOwner = arrows.find((arrow) => (
|
||||
arrow.offset > groupStart
|
||||
&& arrow.offset < groupEnd
|
||||
&& arrow.from === groupAttrs['data-edge-from']
|
||||
&& arrow.to === groupAttrs['data-edge-to']
|
||||
&& (!groupAttrs['data-edge-id'] || !arrow.id || arrow.id === groupAttrs['data-edge-id'])
|
||||
));
|
||||
const owner = arrows.find((arrow) => (
|
||||
groupAttrs['data-edge-key'] !== undefined && arrow.key === groupAttrs['data-edge-key']
|
||||
)) || containedOwner || arrows.find((arrow) => (
|
||||
arrow.id === groupAttrs['data-edge-id']
|
||||
&& arrow.from === groupAttrs['data-edge-from']
|
||||
&& arrow.to === groupAttrs['data-edge-to']
|
||||
));
|
||||
if (!owner) continue;
|
||||
if (owner.key === undefined && groupAttrs['data-edge-key'] !== undefined) owner.key = groupAttrs['data-edge-key'];
|
||||
if (!owner.id && groupAttrs['data-edge-id']) owner.id = groupAttrs['data-edge-id'];
|
||||
if (!owner.label && groupAttrs['data-edge-label']) owner.label = groupAttrs['data-edge-label'];
|
||||
labels.push({
|
||||
relation: owner,
|
||||
relationIndex: owner.index,
|
||||
label: groupAttrs['data-edge-label'] || '',
|
||||
rect,
|
||||
});
|
||||
}
|
||||
return labels;
|
||||
}
|
||||
|
||||
function roundedRect(rect) {
|
||||
return Object.fromEntries(Object.entries(rect).map(([key, value]) => [key, Math.round(value * 10) / 10]));
|
||||
}
|
||||
|
||||
function roundedRouteMetrics(metrics) {
|
||||
return {
|
||||
...metrics,
|
||||
maxStretch: metrics.maxStretch == null ? null : Math.round(metrics.maxStretch * 1000) / 1000,
|
||||
minSegmentPx: metrics.minSegmentPx == null ? null : Math.round(metrics.minSegmentPx * 10) / 10,
|
||||
minInteriorSegmentPx: metrics.minInteriorSegmentPx == null ? null : Math.round(metrics.minInteriorSegmentPx * 10) / 10,
|
||||
};
|
||||
}
|
||||
|
||||
function parseRoutePoints(value) {
|
||||
if (!value) return null;
|
||||
const points = value.split(';').map((pair) => pair.split(',').map(Number));
|
||||
return points.length >= 2 && points.every(isPoint) ? points : null;
|
||||
}
|
||||
|
||||
function collectRelationshipCrossings(arrows) {
|
||||
const relationships = arrows.filter((arrow) => arrow.from && arrow.to && arrow.segments.length);
|
||||
const crossings = [];
|
||||
for (let leftIndex = 0; leftIndex < relationships.length; leftIndex += 1) {
|
||||
const left = relationships[leftIndex];
|
||||
for (let rightIndex = leftIndex + 1; rightIndex < relationships.length; rightIndex += 1) {
|
||||
const right = relationships[rightIndex];
|
||||
if ([left.from, left.to].some((id) => id === right.from || id === right.to)) continue;
|
||||
let point = null;
|
||||
for (const leftSegment of left.segments) {
|
||||
for (const rightSegment of right.segments) {
|
||||
point = properSegmentIntersection(leftSegment.start, leftSegment.end, rightSegment.start, rightSegment.end);
|
||||
if (point) break;
|
||||
}
|
||||
if (point) break;
|
||||
}
|
||||
if (point) crossings.push({ left, right, point });
|
||||
}
|
||||
}
|
||||
return crossings;
|
||||
}
|
||||
|
||||
function relationshipName(arrow) {
|
||||
return arrow.id
|
||||
? `relationship id "${arrow.id}" ("${arrow.from}" -> "${arrow.to}")`
|
||||
: `relationship "${arrow.from}" -> "${arrow.to}"`;
|
||||
}
|
||||
|
||||
function relationshipRecord(arrow) {
|
||||
const stableIndex = Number(arrow.key);
|
||||
return {
|
||||
id: arrow.id,
|
||||
from: arrow.from,
|
||||
to: arrow.to,
|
||||
label: arrow.label || '',
|
||||
collectionIndex: Number.isInteger(stableIndex) && stableIndex >= 0 ? stableIndex : arrow.index - 1,
|
||||
artifactIndex: arrow.index,
|
||||
};
|
||||
}
|
||||
|
||||
function collectCompositionFrames(fragment) {
|
||||
const frames = [];
|
||||
for (const match of fragment.matchAll(/<(rect|path|line)\b[^>]*>/gi)) {
|
||||
const attrs = parseAttrs(match[0]);
|
||||
const kind = attrs['data-composition-frame-kind'];
|
||||
if (!kind) continue;
|
||||
const identity = attrs['data-composition-frame-id'] || frames.length;
|
||||
if (match[1].toLowerCase() === 'rect') {
|
||||
const frame = {
|
||||
kind,
|
||||
id: identity,
|
||||
x: numberAttr(attrs, 'x'),
|
||||
y: numberAttr(attrs, 'y'),
|
||||
width: numberAttr(attrs, 'width'),
|
||||
height: numberAttr(attrs, 'height'),
|
||||
radius: numberAttr(attrs, 'rx') || 0,
|
||||
};
|
||||
if ([frame.x, frame.y, frame.width, frame.height].every(Number.isFinite)) frames.push(frame);
|
||||
continue;
|
||||
}
|
||||
const segments = match[1].toLowerCase() === 'line'
|
||||
? lineSegments(attrs)
|
||||
: pathSegments(attrs.d || '');
|
||||
for (const [segmentIndex, segment] of segments.entries()) {
|
||||
frames.push({
|
||||
kind,
|
||||
id: segments.length > 1 ? `${identity}:${segmentIndex}` : identity,
|
||||
shape: 'line',
|
||||
start: segment.start,
|
||||
end: segment.end,
|
||||
});
|
||||
}
|
||||
}
|
||||
return frames;
|
||||
}
|
||||
|
||||
function frameName(frame) {
|
||||
return `${frame.kind || 'frame'} "${frame.id}"`;
|
||||
}
|
||||
|
||||
function frameRecord(frame) {
|
||||
return { kind: frame.kind, id: frame.id };
|
||||
}
|
||||
|
||||
function formatPoint(point) {
|
||||
return point.map((value) => Math.round(value * 10) / 10).join(', ');
|
||||
}
|
||||
|
||||
function lineSegments(attrs) {
|
||||
const start = [numberAttr(attrs, 'x1'), numberAttr(attrs, 'y1')];
|
||||
const end = [numberAttr(attrs, 'x2'), numberAttr(attrs, 'y2')];
|
||||
if (!isPoint(start) || !isPoint(end)) return [];
|
||||
return [{ start, end }];
|
||||
}
|
||||
|
||||
function pathSegments(d) {
|
||||
const points = pointsFromPath(d);
|
||||
const segments = [];
|
||||
for (let i = 1; i < points.length; i += 1) {
|
||||
segments.push({ start: points[i - 1], end: points[i] });
|
||||
}
|
||||
return segments;
|
||||
}
|
||||
|
||||
// Border runs use exact visible primitives. Non-collinear Q curves are never
|
||||
// flattened into chords here: a tangent or sampled near-horizontal curve is
|
||||
// not a structural border run. A fully collinear Q remains a straight visible
|
||||
// primitive and is included.
|
||||
function straightPathSegments(d) {
|
||||
const tokens = d.match(/[MLHVQZmlhvqz]|[-+]?(?:\d*\.)?\d+(?:e[-+]?\d+)?/g) || [];
|
||||
const segments = [];
|
||||
let i = 0;
|
||||
let command = '';
|
||||
let current = [0, 0];
|
||||
let start = null;
|
||||
while (i < tokens.length) {
|
||||
if (isCommand(tokens[i])) command = tokens[i++];
|
||||
if (!command) break;
|
||||
const absolute = command === command.toUpperCase();
|
||||
switch (command.toUpperCase()) {
|
||||
case 'M':
|
||||
case 'L': {
|
||||
let first = true;
|
||||
while (i + 1 < tokens.length && !isCommand(tokens[i])) {
|
||||
const point = [Number.parseFloat(tokens[i++]), Number.parseFloat(tokens[i++])];
|
||||
if (!point.every(Number.isFinite)) break;
|
||||
const next = absolute ? point : [current[0] + point[0], current[1] + point[1]];
|
||||
if (command.toUpperCase() === 'L' || !first) segments.push({ start: current, end: next });
|
||||
current = next;
|
||||
if (!start) start = current;
|
||||
first = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'H': {
|
||||
while (i < tokens.length && !isCommand(tokens[i])) {
|
||||
const value = Number.parseFloat(tokens[i++]);
|
||||
if (!Number.isFinite(value)) break;
|
||||
const next = [absolute ? value : current[0] + value, current[1]];
|
||||
segments.push({ start: current, end: next });
|
||||
current = next;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'V': {
|
||||
while (i < tokens.length && !isCommand(tokens[i])) {
|
||||
const value = Number.parseFloat(tokens[i++]);
|
||||
if (!Number.isFinite(value)) break;
|
||||
const next = [current[0], absolute ? value : current[1] + value];
|
||||
segments.push({ start: current, end: next });
|
||||
current = next;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Q': {
|
||||
while (i + 3 < tokens.length && !isCommand(tokens[i])) {
|
||||
const values = [0, 0, 0, 0].map(() => Number.parseFloat(tokens[i++]));
|
||||
if (!values.every(Number.isFinite)) break;
|
||||
const control = absolute ? values.slice(0, 2) : [current[0] + values[0], current[1] + values[1]];
|
||||
const end = absolute ? values.slice(2, 4) : [current[0] + values[2], current[1] + values[3]];
|
||||
if (Math.abs(crossProduct(current, control, end)) <= 1e-9) segments.push({ start: current, end });
|
||||
current = end;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Z':
|
||||
if (start) segments.push({ start: current, end: start });
|
||||
current = start || current;
|
||||
command = '';
|
||||
break;
|
||||
default:
|
||||
return [];
|
||||
}
|
||||
}
|
||||
return segments.filter(({ start: a, end: b }) => isPoint(a) && isPoint(b));
|
||||
}
|
||||
|
||||
function diagonalStraightSegments(arrow) {
|
||||
return arrow.borderSegments.flatMap(({ start, end }, segmentIndex) => (
|
||||
Math.abs(start[0] - end[0]) > 0.01 && Math.abs(start[1] - end[1]) > 0.01
|
||||
? [{ segmentIndex, start, end }]
|
||||
: []
|
||||
));
|
||||
}
|
||||
|
||||
function collectLegendBoxes(fragment) {
|
||||
const boxes = [];
|
||||
|
||||
for (const match of fragment.matchAll(/<rect\b[^>]*>/gi)) {
|
||||
const attrs = parseAttrs(match[0]);
|
||||
const x = numberAttr(attrs, 'x');
|
||||
const y = numberAttr(attrs, 'y');
|
||||
const width = numberAttr(attrs, 'width');
|
||||
const height = numberAttr(attrs, 'height');
|
||||
if ([x, y, width, height].every(Number.isFinite)) {
|
||||
boxes.push({ x1: x, y1: y, x2: x + width, y2: y + height, label: `rect@${x},${y}` });
|
||||
}
|
||||
}
|
||||
|
||||
for (const match of fragment.matchAll(/<text\b([^>]*)>([\s\S]*?)<\/text>/gi)) {
|
||||
const attrs = parseAttrs(match[1]);
|
||||
const box = textBox(attrs, stripTags(match[2]).trim());
|
||||
if (box) boxes.push(box);
|
||||
}
|
||||
|
||||
return boxes;
|
||||
}
|
||||
|
||||
function collectLegendCollisions(arrows, boxes) {
|
||||
const collisions = [];
|
||||
for (const arrow of arrows) {
|
||||
for (const segment of arrow.segments) {
|
||||
for (const box of boxes) {
|
||||
if (segmentIntersectsBox(segment, padBox(box, 2))) {
|
||||
collisions.push({ arrow, box });
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return collisions;
|
||||
}
|
||||
|
||||
function textBox(attrs, text) {
|
||||
const x = numberAttr(attrs, 'x');
|
||||
const y = numberAttr(attrs, 'y');
|
||||
const fontSize = Number.parseFloat(attrs['font-size'] || '10');
|
||||
if (!Number.isFinite(x) || !Number.isFinite(y) || !Number.isFinite(fontSize)) return null;
|
||||
const width = estimatedTextWidth(text, fontSize);
|
||||
const anchor = attrs['text-anchor'] || 'start';
|
||||
let x1 = x;
|
||||
if (anchor === 'middle') x1 = x - width / 2;
|
||||
if (anchor === 'end') x1 = x - width;
|
||||
return {
|
||||
x1,
|
||||
y1: y - fontSize,
|
||||
x2: x1 + width,
|
||||
y2: y + fontSize * 0.25,
|
||||
label: text || `text@${x},${y}`,
|
||||
};
|
||||
}
|
||||
|
||||
function collectDesktopReadability(svgAttrs, fragment) {
|
||||
const viewBox = String(svgAttrs.viewBox || '').trim().split(/[\s,]+/).map(Number);
|
||||
const viewBoxWidth = viewBox.length === 4 ? viewBox[2] : Number.NaN;
|
||||
if (!Number.isFinite(viewBoxWidth) || viewBoxWidth <= 0) return null;
|
||||
const scale = Math.min(1, DESKTOP_READER_DIAGRAM_WIDTH / viewBoxWidth);
|
||||
let worst = null;
|
||||
for (const match of fragment.matchAll(/<text\b([^>]*)>([\s\S]*?)<\/text>/gi)) {
|
||||
const primary = /\bdata-node-label(?:\s*=|\s|$)/i.test(match[1]);
|
||||
const boundary = /\bdata-boundary-label(?:\s*=|\s|$)/i.test(match[1]);
|
||||
const context = /\bdata-detail\s*=\s*"context"/i.test(match[1]);
|
||||
if (!primary && !boundary && !context) continue;
|
||||
const attrs = parseAttrs(match[1]);
|
||||
const fontSize = Number.parseFloat(attrs['font-size'] || '');
|
||||
if (!Number.isFinite(fontSize)) continue;
|
||||
const projected = projectedNodeTextPx(fontSize, viewBoxWidth);
|
||||
if (projected >= MIN_PROJECTED_NODE_TEXT_PX) continue;
|
||||
const candidate = {
|
||||
viewBoxWidth,
|
||||
scale,
|
||||
text: stripTags(match[2]).trim(),
|
||||
detail: primary
|
||||
? 'primary'
|
||||
: boundary ? 'boundary' : 'context',
|
||||
sourceFontPx: fontSize,
|
||||
projectedFontPx: projected,
|
||||
};
|
||||
if (!worst || candidate.projectedFontPx < worst.projectedFontPx) worst = candidate;
|
||||
}
|
||||
return worst;
|
||||
}
|
||||
|
||||
function estimatedTextWidth(text, fontSize) {
|
||||
let units = 0;
|
||||
for (const char of text) units += char.charCodeAt(0) > 255 ? 1.8 : 0.62;
|
||||
return Math.max(fontSize, units * fontSize);
|
||||
}
|
||||
|
||||
function pointsFromPath(d) {
|
||||
const tokens = d.match(/[MLHVQZmlhvqz]|[-+]?(?:\d*\.)?\d+(?:e[-+]?\d+)?/g) || [];
|
||||
const points = [];
|
||||
let i = 0;
|
||||
let command = '';
|
||||
let current = [0, 0];
|
||||
let start = null;
|
||||
|
||||
while (i < tokens.length) {
|
||||
if (isCommand(tokens[i])) command = tokens[i++];
|
||||
if (!command) break;
|
||||
|
||||
const absolute = command === command.toUpperCase();
|
||||
switch (command.toUpperCase()) {
|
||||
case 'M':
|
||||
case 'L': {
|
||||
while (i + 1 < tokens.length && !isCommand(tokens[i])) {
|
||||
const x = Number.parseFloat(tokens[i++]);
|
||||
const y = Number.parseFloat(tokens[i++]);
|
||||
if (!Number.isFinite(x) || !Number.isFinite(y)) break;
|
||||
current = absolute ? [x, y] : [current[0] + x, current[1] + y];
|
||||
points.push(current);
|
||||
if (!start) start = current;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'H': {
|
||||
while (i < tokens.length && !isCommand(tokens[i])) {
|
||||
const x = Number.parseFloat(tokens[i++]);
|
||||
if (!Number.isFinite(x)) break;
|
||||
current = absolute ? [x, current[1]] : [current[0] + x, current[1]];
|
||||
points.push(current);
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'V': {
|
||||
while (i < tokens.length && !isCommand(tokens[i])) {
|
||||
const y = Number.parseFloat(tokens[i++]);
|
||||
if (!Number.isFinite(y)) break;
|
||||
current = absolute ? [current[0], y] : [current[0], current[1] + y];
|
||||
points.push(current);
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Q': {
|
||||
while (i + 3 < tokens.length && !isCommand(tokens[i])) {
|
||||
const controlX = Number.parseFloat(tokens[i++]);
|
||||
const controlY = Number.parseFloat(tokens[i++]);
|
||||
const endX = Number.parseFloat(tokens[i++]);
|
||||
const endY = Number.parseFloat(tokens[i++]);
|
||||
if (![controlX, controlY, endX, endY].every(Number.isFinite)) break;
|
||||
const control = absolute
|
||||
? [controlX, controlY]
|
||||
: [current[0] + controlX, current[1] + controlY];
|
||||
const end = absolute
|
||||
? [endX, endY]
|
||||
: [current[0] + endX, current[1] + endY];
|
||||
const startPoint = current;
|
||||
for (let step = 1; step <= 8; step += 1) {
|
||||
const amount = step / 8;
|
||||
const remaining = 1 - amount;
|
||||
points.push([
|
||||
remaining * remaining * startPoint[0] + 2 * remaining * amount * control[0] + amount * amount * end[0],
|
||||
remaining * remaining * startPoint[1] + 2 * remaining * amount * control[1] + amount * amount * end[1],
|
||||
]);
|
||||
}
|
||||
current = end;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Z': {
|
||||
if (start) points.push(start);
|
||||
break;
|
||||
}
|
||||
default:
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
return points.filter(isPoint);
|
||||
}
|
||||
|
||||
function properSegmentIntersection(a, b, c, d) {
|
||||
const abC = crossProduct(a, b, c);
|
||||
const abD = crossProduct(a, b, d);
|
||||
const cdA = crossProduct(c, d, a);
|
||||
const cdB = crossProduct(c, d, b);
|
||||
const epsilon = 1e-9;
|
||||
const opposite = (left, right) => (left > epsilon && right < -epsilon) || (left < -epsilon && right > epsilon);
|
||||
if (!opposite(abC, abD) || !opposite(cdA, cdB)) return null;
|
||||
const denominator = (a[0] - b[0]) * (c[1] - d[1]) - (a[1] - b[1]) * (c[0] - d[0]);
|
||||
if (Math.abs(denominator) < epsilon) return null;
|
||||
const ab = a[0] * b[1] - a[1] * b[0];
|
||||
const cd = c[0] * d[1] - c[1] * d[0];
|
||||
return [
|
||||
(ab * (c[0] - d[0]) - (a[0] - b[0]) * cd) / denominator,
|
||||
(ab * (c[1] - d[1]) - (a[1] - b[1]) * cd) / denominator,
|
||||
];
|
||||
}
|
||||
|
||||
function crossProduct(a, b, c) {
|
||||
return (b[0] - a[0]) * (c[1] - a[1]) - (b[1] - a[1]) * (c[0] - a[0]);
|
||||
}
|
||||
|
||||
function segmentIntersectsBox(segment, box) {
|
||||
const { start, end } = segment;
|
||||
if (pointInsideBox(start, box) || pointInsideBox(end, box)) return true;
|
||||
const edges = [
|
||||
[[box.x1, box.y1], [box.x2, box.y1]],
|
||||
[[box.x2, box.y1], [box.x2, box.y2]],
|
||||
[[box.x2, box.y2], [box.x1, box.y2]],
|
||||
[[box.x1, box.y2], [box.x1, box.y1]],
|
||||
];
|
||||
return edges.some(([a, b]) => segmentsIntersect(start, end, a, b));
|
||||
}
|
||||
|
||||
function segmentsIntersect(a, b, c, d) {
|
||||
const o1 = orientation(a, b, c);
|
||||
const o2 = orientation(a, b, d);
|
||||
const o3 = orientation(c, d, a);
|
||||
const o4 = orientation(c, d, b);
|
||||
|
||||
if (o1 !== o2 && o3 !== o4) return true;
|
||||
if (o1 === 0 && onSegment(a, c, b)) return true;
|
||||
if (o2 === 0 && onSegment(a, d, b)) return true;
|
||||
if (o3 === 0 && onSegment(c, a, d)) return true;
|
||||
if (o4 === 0 && onSegment(c, b, d)) return true;
|
||||
return false;
|
||||
}
|
||||
|
||||
function orientation(a, b, c) {
|
||||
const value = (b[1] - a[1]) * (c[0] - b[0]) - (b[0] - a[0]) * (c[1] - b[1]);
|
||||
if (Math.abs(value) < 1e-9) return 0;
|
||||
return value > 0 ? 1 : 2;
|
||||
}
|
||||
|
||||
function onSegment(a, b, c) {
|
||||
return b[0] <= Math.max(a[0], c[0]) + 1e-9
|
||||
&& b[0] + 1e-9 >= Math.min(a[0], c[0])
|
||||
&& b[1] <= Math.max(a[1], c[1]) + 1e-9
|
||||
&& b[1] + 1e-9 >= Math.min(a[1], c[1]);
|
||||
}
|
||||
|
||||
function pointInsideBox(point, box) {
|
||||
return point[0] >= box.x1 && point[0] <= box.x2 && point[1] >= box.y1 && point[1] <= box.y2;
|
||||
}
|
||||
|
||||
function padBox(box, padding) {
|
||||
return {
|
||||
...box,
|
||||
x1: box.x1 - padding,
|
||||
y1: box.y1 - padding,
|
||||
x2: box.x2 + padding,
|
||||
y2: box.y2 + padding,
|
||||
};
|
||||
}
|
||||
|
||||
function parseAttrs(tag) {
|
||||
const attrs = {};
|
||||
for (const match of tag.matchAll(/([\w:-]+)\s*=\s*"([^"]*)"/g)) attrs[match[1]] = match[2];
|
||||
return attrs;
|
||||
}
|
||||
|
||||
function numberAttr(attrs, name) {
|
||||
return Number.parseFloat(attrs[name]);
|
||||
}
|
||||
|
||||
function isCommand(token) {
|
||||
return /^[A-Za-z]$/.test(token);
|
||||
}
|
||||
|
||||
function isPoint(point) {
|
||||
return Array.isArray(point) && point.length === 2 && point.every(Number.isFinite);
|
||||
}
|
||||
|
||||
function stripTags(value) {
|
||||
return value.replace(/<[^>]*>/g, '');
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,141 @@
|
||||
#!/usr/bin/env node
|
||||
|
||||
import fs from 'node:fs';
|
||||
import path from 'node:path';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
import * as simpleIcons from 'simple-icons';
|
||||
|
||||
const here = path.dirname(fileURLToPath(import.meta.url));
|
||||
const root = path.resolve(here, '..');
|
||||
const catalogPath = path.join(root, 'brand-marks', 'catalog.json');
|
||||
const outputPath = path.join(root, 'renderers', 'shared', 'generated-brand-marks.mjs');
|
||||
const catalog = JSON.parse(fs.readFileSync(catalogPath, 'utf8'));
|
||||
const simpleIconsVersion = JSON.parse(fs.readFileSync(
|
||||
path.join(root, 'node_modules', 'simple-icons', 'package.json'),
|
||||
'utf8',
|
||||
)).version;
|
||||
const simpleBySlug = new Map(Object.values(simpleIcons)
|
||||
.filter((icon) => icon && typeof icon === 'object' && icon.slug && icon.path)
|
||||
.map((icon) => [icon.slug, icon]));
|
||||
|
||||
function normalizedList(value) {
|
||||
return [...new Set((Array.isArray(value) ? value : [])
|
||||
.map((item) => String(item).trim())
|
||||
.filter(Boolean))];
|
||||
}
|
||||
|
||||
function lookupForms(value) {
|
||||
const raw = String(value ?? '').trim().toLocaleLowerCase('en-US');
|
||||
if (!raw) return [];
|
||||
return [...new Set([
|
||||
raw,
|
||||
raw.replace(/[\s_]+/g, '-'),
|
||||
raw.replace(/[\s_.-]+/g, ''),
|
||||
])];
|
||||
}
|
||||
|
||||
function fail(message) {
|
||||
console.error(`brand catalog: ${message}`);
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
if (catalog.schemaVersion !== 1 || !Array.isArray(catalog.marks) || catalog.marks.length === 0) {
|
||||
fail('catalog.json must contain a non-empty schemaVersion 1 marks array');
|
||||
}
|
||||
|
||||
const ids = new Set();
|
||||
const lookupKeys = new Map();
|
||||
const domains = new Map();
|
||||
const generated = catalog.marks.map((entry, index) => {
|
||||
if (!/^[a-z0-9]+(?:-[a-z0-9]+)*$/.test(entry.id || '')) fail(`marks[${index}] has an invalid id`);
|
||||
if (ids.has(entry.id)) fail(`duplicate id ${entry.id}`);
|
||||
ids.add(entry.id);
|
||||
|
||||
const aliases = normalizedList(entry.aliases);
|
||||
const entryDomains = normalizedList(entry.domains).map((domain) => domain.toLowerCase());
|
||||
for (const key of [entry.id, ...aliases]) {
|
||||
for (const form of lookupForms(key)) {
|
||||
if (lookupKeys.has(form) && lookupKeys.get(form) !== entry.id) {
|
||||
fail(`lookup key ${JSON.stringify(key)} is shared by ${lookupKeys.get(form)} and ${entry.id}`);
|
||||
}
|
||||
lookupKeys.set(form, entry.id);
|
||||
}
|
||||
}
|
||||
for (const domain of entryDomains) {
|
||||
if (domains.has(domain) && domains.get(domain) !== entry.id) {
|
||||
fail(`domain ${domain} is shared by ${domains.get(domain)} and ${entry.id}`);
|
||||
}
|
||||
domains.set(domain, entry.id);
|
||||
}
|
||||
|
||||
let mark;
|
||||
if (entry.simpleIcon) {
|
||||
const icon = simpleBySlug.get(entry.simpleIcon);
|
||||
if (!icon) fail(`${entry.id} references missing Simple Icons slug ${entry.simpleIcon}`);
|
||||
mark = {
|
||||
id: entry.id,
|
||||
title: entry.title || icon.title,
|
||||
category: entry.category,
|
||||
aliases,
|
||||
domains: entryDomains,
|
||||
viewBox: 24,
|
||||
hex: icon.hex,
|
||||
path: icon.path,
|
||||
provenance: {
|
||||
provider: 'Simple Icons',
|
||||
providerVersion: simpleIconsVersion,
|
||||
source: icon.source,
|
||||
...(icon.guidelines ? { guidelines: icon.guidelines } : {}),
|
||||
...(icon.license ? { license: icon.license } : {}),
|
||||
},
|
||||
};
|
||||
} else if (entry.custom) {
|
||||
const custom = entry.custom;
|
||||
if (!entry.title || !custom.path || !custom.source || !/^[0-9A-F]{6}$/i.test(custom.hex || '')) {
|
||||
fail(`${entry.id} custom mark requires title, path, source, and six-digit hex`);
|
||||
}
|
||||
mark = {
|
||||
id: entry.id,
|
||||
title: entry.title,
|
||||
category: entry.category,
|
||||
aliases,
|
||||
domains: entryDomains,
|
||||
viewBox: custom.viewBox || 24,
|
||||
hex: custom.hex.toUpperCase(),
|
||||
path: custom.path,
|
||||
provenance: {
|
||||
provider: 'Official brand asset',
|
||||
source: custom.source,
|
||||
...(custom.guidelines ? { guidelines: custom.guidelines } : {}),
|
||||
},
|
||||
};
|
||||
} else {
|
||||
fail(`${entry.id} must provide simpleIcon or custom`);
|
||||
}
|
||||
if (!mark.category || !mark.title) fail(`${entry.id} is missing category or title`);
|
||||
for (const form of lookupForms(mark.title)) {
|
||||
if (lookupKeys.has(form) && lookupKeys.get(form) !== entry.id) {
|
||||
fail(`title ${JSON.stringify(mark.title)} is shared by ${lookupKeys.get(form)} and ${entry.id}`);
|
||||
}
|
||||
lookupKeys.set(form, entry.id);
|
||||
}
|
||||
return mark;
|
||||
}).sort((left, right) => left.id.localeCompare(right.id));
|
||||
|
||||
const banner = `// Generated by scripts/generate-brand-marks.mjs from brand-marks/catalog.json.\n// Simple Icons ${simpleIconsVersion}. Do not edit by hand.\n`;
|
||||
const source = `${banner}export const BRAND_MARKS = Object.freeze(${JSON.stringify(generated, null, 2)});\n`;
|
||||
|
||||
if (process.argv.includes('--check')) {
|
||||
const current = fs.existsSync(outputPath)
|
||||
? fs.readFileSync(outputPath, 'utf8').replace(/\r\n?/g, '\n')
|
||||
: '';
|
||||
if (current !== source) {
|
||||
console.error('generated brand marks are stale — run npm run generate:brand-marks');
|
||||
process.exit(1);
|
||||
}
|
||||
} else {
|
||||
const temporary = `${outputPath}.${process.pid}.tmp`;
|
||||
fs.writeFileSync(temporary, source);
|
||||
fs.renameSync(temporary, outputPath);
|
||||
console.log(`generated ${path.relative(root, outputPath)} (${generated.length} marks)`);
|
||||
}
|
||||
@@ -0,0 +1,66 @@
|
||||
#!/usr/bin/env node
|
||||
|
||||
import fs from 'node:fs';
|
||||
import path from 'node:path';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
import Ajv2020 from 'ajv/dist/2020.js';
|
||||
import standaloneCode from 'ajv/dist/standalone/index.js';
|
||||
|
||||
const __dirname = path.dirname(fileURLToPath(import.meta.url));
|
||||
const root = path.resolve(__dirname, '..');
|
||||
const schemasDir = path.join(root, 'schemas');
|
||||
const output = path.join(root, 'renderers/shared/generated-validators.mjs');
|
||||
const diagramTypes = ['workflow', 'sequence', 'dataflow', 'lifecycle', 'architecture'];
|
||||
|
||||
const ajv = new Ajv2020({
|
||||
allErrors: true,
|
||||
strict: true,
|
||||
code: { source: true, esm: true },
|
||||
});
|
||||
ajv.addSchema(JSON.parse(fs.readFileSync(path.join(schemasDir, 'common.schema.json'), 'utf8')));
|
||||
|
||||
const schemaIds = {};
|
||||
for (const type of diagramTypes) {
|
||||
const schema = JSON.parse(fs.readFileSync(path.join(schemasDir, `${type}.schema.json`), 'utf8'));
|
||||
ajv.addSchema(schema);
|
||||
schemaIds[type] = schema.$id;
|
||||
}
|
||||
|
||||
const banner = '// Generated by scripts/generate-validators.mjs. Do not edit by hand.\n';
|
||||
const ajvUcs2Import = 'require("ajv/dist/runtime/ucs2length").default';
|
||||
const inlineUcs2Length = `function ucs2length(str) {
|
||||
const len = str.length;
|
||||
let length = 0;
|
||||
let pos = 0;
|
||||
while (pos < len) {
|
||||
length += 1;
|
||||
const value = str.charCodeAt(pos++);
|
||||
if (value >= 0xd800 && value <= 0xdbff && pos < len
|
||||
&& (str.charCodeAt(pos) & 0xfc00) === 0xdc00) pos += 1;
|
||||
}
|
||||
return length;
|
||||
}`;
|
||||
let validatorCode = standaloneCode(ajv, schemaIds);
|
||||
if (!validatorCode.includes(ajvUcs2Import)) {
|
||||
throw new Error('AJV standalone output no longer contains the expected ucs2length helper');
|
||||
}
|
||||
validatorCode = validatorCode.replaceAll(ajvUcs2Import, inlineUcs2Length);
|
||||
if (validatorCode.includes('require(')) {
|
||||
throw new Error('AJV standalone output contains an unexpected runtime dependency');
|
||||
}
|
||||
const generated = `${banner}${validatorCode}\n`;
|
||||
|
||||
if (process.argv.includes('--check')) {
|
||||
const current = fs.existsSync(output)
|
||||
? fs.readFileSync(output, 'utf8').replace(/\r\n?/g, '\n')
|
||||
: '';
|
||||
if (current !== generated) {
|
||||
console.error('generated validators are stale — run npm run generate:validators');
|
||||
process.exit(1);
|
||||
}
|
||||
} else {
|
||||
const temporary = `${output}.${process.pid}.tmp`;
|
||||
fs.writeFileSync(temporary, generated);
|
||||
fs.renameSync(temporary, output);
|
||||
console.log(`generated ${path.relative(root, output)}`);
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
// Re-render every bundled example from its JSON IR. Installed skills keep HTML
|
||||
// beside the JSON examples; the development script passes the golden directory.
|
||||
|
||||
import { execFileSync } from 'node:child_process';
|
||||
import path from 'node:path';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
|
||||
const __dirname = path.dirname(fileURLToPath(import.meta.url));
|
||||
const skillRoot = path.resolve(__dirname, '..');
|
||||
const outputRoot = path.resolve(process.argv[2] || path.join(skillRoot, 'examples'));
|
||||
|
||||
const TARGETS = [
|
||||
['workflow', 'agent-tool-call.workflow.json', 'workflow-agent-tool-call-rendered.html'],
|
||||
['sequence', 'cache-miss-request.sequence.json', 'sequence-cache-miss-request.html'],
|
||||
['dataflow', 'product-analytics.dataflow.json', 'dataflow-product-analytics.html'],
|
||||
['lifecycle', 'agent-run.lifecycle.json', 'lifecycle-agent-run.html'],
|
||||
['architecture', 'web-app.architecture.json', 'web-app-rendered.html'],
|
||||
];
|
||||
|
||||
for (const [mode, input, output] of TARGETS) {
|
||||
execFileSync(process.execPath, [
|
||||
path.join(skillRoot, `renderers/${mode}/render-${mode}.mjs`),
|
||||
path.join(skillRoot, 'examples', input),
|
||||
path.join(outputRoot, output),
|
||||
], { stdio: 'inherit' });
|
||||
}
|
||||
@@ -0,0 +1,182 @@
|
||||
export const SKILL_ID = 'archify';
|
||||
export const EXPECTED_REPOSITORY = 'https://github.com/tt-a1i/archify';
|
||||
export const DEFAULT_MANIFEST_URL = 'https://tt-a1i.github.io/archify/skill-updates/archify/stable.json';
|
||||
|
||||
const CONTROL_OR_BIDI = /[\u0000-\u001f\u007f-\u009f\u202a-\u202e\u2066-\u2069]/u;
|
||||
const HEX_40 = /^[a-f0-9]{40}$/;
|
||||
const HEX_64 = /^[a-f0-9]{64}$/;
|
||||
const SEMVER = /^(0|[1-9]\d*)\.(0|[1-9]\d*)\.(0|[1-9]\d*)(?:-([0-9A-Za-z-]+(?:\.[0-9A-Za-z-]+)*))?(?:\+([0-9A-Za-z-]+(?:\.[0-9A-Za-z-]+)*))?$/;
|
||||
const UTC_SECONDS = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}Z$/;
|
||||
|
||||
export class UpdateContractError extends Error {
|
||||
constructor(message) {
|
||||
super(message);
|
||||
this.name = 'UpdateContractError';
|
||||
}
|
||||
}
|
||||
|
||||
function isPlainObject(value) {
|
||||
return Boolean(value) && typeof value === 'object' && !Array.isArray(value);
|
||||
}
|
||||
|
||||
function hasExactKeys(value, expected) {
|
||||
return isPlainObject(value)
|
||||
&& Object.keys(value).sort().join('\0') === [...expected].sort().join('\0');
|
||||
}
|
||||
|
||||
export function parseSemver(value) {
|
||||
if (typeof value !== 'string' || value.length > 128) {
|
||||
throw new UpdateContractError(`invalid SemVer: ${JSON.stringify(value)}`);
|
||||
}
|
||||
const match = SEMVER.exec(value);
|
||||
if (!match) throw new UpdateContractError(`invalid SemVer: ${JSON.stringify(value)}`);
|
||||
const prerelease = match[4]?.split('.') ?? null;
|
||||
if (prerelease?.some((identifier) => /^\d+$/.test(identifier)
|
||||
&& identifier.length > 1 && identifier.startsWith('0'))) {
|
||||
throw new UpdateContractError(`invalid SemVer: ${JSON.stringify(value)}`);
|
||||
}
|
||||
return {
|
||||
core: match.slice(1, 4),
|
||||
prerelease,
|
||||
build: match[5]?.split('.') ?? null,
|
||||
};
|
||||
}
|
||||
|
||||
function compareNumericIdentifiers(left, right) {
|
||||
if (left.length !== right.length) return left.length < right.length ? -1 : 1;
|
||||
if (left === right) return 0;
|
||||
return left < right ? -1 : 1;
|
||||
}
|
||||
|
||||
function comparePrerelease(left, right) {
|
||||
if (left === null && right === null) return 0;
|
||||
if (left === null) return 1;
|
||||
if (right === null) return -1;
|
||||
const length = Math.max(left.length, right.length);
|
||||
for (let index = 0; index < length; index += 1) {
|
||||
if (left[index] === undefined) return -1;
|
||||
if (right[index] === undefined) return 1;
|
||||
if (left[index] === right[index]) continue;
|
||||
const leftNumeric = /^\d+$/.test(left[index]);
|
||||
const rightNumeric = /^\d+$/.test(right[index]);
|
||||
if (leftNumeric && rightNumeric) return compareNumericIdentifiers(left[index], right[index]);
|
||||
if (leftNumeric !== rightNumeric) return leftNumeric ? -1 : 1;
|
||||
return left[index] < right[index] ? -1 : 1;
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
export function compareSemver(leftValue, rightValue) {
|
||||
const left = parseSemver(leftValue);
|
||||
const right = parseSemver(rightValue);
|
||||
for (let index = 0; index < left.core.length; index += 1) {
|
||||
const comparison = compareNumericIdentifiers(left.core[index], right.core[index]);
|
||||
if (comparison !== 0) return comparison;
|
||||
}
|
||||
return comparePrerelease(left.prerelease, right.prerelease);
|
||||
}
|
||||
|
||||
export function releaseChannelForVersion(value) {
|
||||
return parseSemver(value).prerelease ? 'development' : 'stable';
|
||||
}
|
||||
|
||||
export function isStableCoreVersion(value) {
|
||||
try {
|
||||
const parsed = parseSemver(value);
|
||||
return parsed.prerelease === null && parsed.build === null;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
export function validateCanonicalUtcTimestamp(value) {
|
||||
if (typeof value !== 'string' || !UTC_SECONDS.test(value)) {
|
||||
throw new UpdateContractError('publication time must use YYYY-MM-DDTHH:mm:ssZ');
|
||||
}
|
||||
const timestamp = Date.parse(value);
|
||||
if (!Number.isFinite(timestamp)
|
||||
|| new Date(timestamp).toISOString().replace('.000Z', 'Z') !== value) {
|
||||
throw new UpdateContractError('publication time is not a real UTC calendar instant');
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
||||
export function validateLocalRelease(value) {
|
||||
if (!hasExactKeys(value, [
|
||||
'schemaVersion', 'skillId', 'channel', 'version', 'source', 'updateManifestUrl',
|
||||
])
|
||||
|| value.schemaVersion !== 1
|
||||
|| value.skillId !== SKILL_ID
|
||||
|| !hasExactKeys(value.source, ['repository'])
|
||||
|| value.source.repository !== EXPECTED_REPOSITORY
|
||||
|| value.updateManifestUrl !== DEFAULT_MANIFEST_URL) {
|
||||
throw new UpdateContractError('invalid local release identity');
|
||||
}
|
||||
const expectedChannel = releaseChannelForVersion(value.version);
|
||||
if (value.channel !== expectedChannel) {
|
||||
throw new UpdateContractError('local release channel does not match its version');
|
||||
}
|
||||
return {
|
||||
schemaVersion: value.schemaVersion,
|
||||
skillId: value.skillId,
|
||||
channel: value.channel,
|
||||
version: value.version,
|
||||
source: { repository: value.source.repository },
|
||||
updateManifestUrl: value.updateManifestUrl,
|
||||
};
|
||||
}
|
||||
|
||||
export function validateReleaseNotesUrl(value, version) {
|
||||
if (!isStableCoreVersion(version)) {
|
||||
throw new UpdateContractError('release notes require a stable core version');
|
||||
}
|
||||
const expected = `https://github.com/tt-a1i/archify/releases/tag/v${version}`;
|
||||
if (value !== expected) {
|
||||
throw new UpdateContractError('release notes URL is outside the exact trusted release path');
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
||||
export function validateStableUpdateManifest(value) {
|
||||
if (!hasExactKeys(value, [
|
||||
'schemaVersion', 'skillId', 'channel', 'version', 'publishedAt', 'source',
|
||||
'artifact', 'summary', 'releaseNotes', 'severity',
|
||||
])
|
||||
|| value.schemaVersion !== 1
|
||||
|| value.skillId !== SKILL_ID
|
||||
|| value.channel !== 'stable'
|
||||
|| !isStableCoreVersion(value.version)
|
||||
|| !hasExactKeys(value.source, ['repository', 'ref', 'treeSha'])
|
||||
|| value.source.repository !== EXPECTED_REPOSITORY
|
||||
|| value.source.ref !== `v${value.version}`
|
||||
|| !HEX_40.test(value.source.treeSha)
|
||||
|| !hasExactKeys(value.artifact, ['sha256'])
|
||||
|| !HEX_64.test(value.artifact.sha256)) {
|
||||
throw new UpdateContractError('invalid immutable stable release identity');
|
||||
}
|
||||
validateCanonicalUtcTimestamp(value.publishedAt);
|
||||
if (typeof value.summary !== 'string' || value.summary.length < 1 || value.summary.length > 160
|
||||
|| CONTROL_OR_BIDI.test(value.summary)) {
|
||||
throw new UpdateContractError('invalid release summary');
|
||||
}
|
||||
validateReleaseNotesUrl(value.releaseNotes, value.version);
|
||||
if (!['normal', 'security'].includes(value.severity)) {
|
||||
throw new UpdateContractError('invalid update severity');
|
||||
}
|
||||
return {
|
||||
schemaVersion: value.schemaVersion,
|
||||
skillId: value.skillId,
|
||||
channel: value.channel,
|
||||
version: value.version,
|
||||
publishedAt: value.publishedAt,
|
||||
source: {
|
||||
repository: value.source.repository,
|
||||
ref: value.source.ref,
|
||||
treeSha: value.source.treeSha,
|
||||
},
|
||||
artifact: { sha256: value.artifact.sha256 },
|
||||
summary: value.summary,
|
||||
releaseNotes: value.releaseNotes,
|
||||
severity: value.severity,
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user