---
title: Data Flow - Index Building
---
flowchart LR
subgraph Repos["Git Repositories"]
R1[mozaic-design-system]
R2[mozaic-vue]
R3[mozaic-react]
end
subgraph TokenParsers["Token Parsers"]
TP[tokens-parser.ts<br/>orchestrator]
TP1[color-parser]
TP2[spacing-parser]
TP3[shadow-parser]
TP4[border-parser]
TP5[screen-parser]
TP6[typography-parser]
TP7[grid-parser]
end
subgraph OtherParsers["Other Parsers"]
P2[vue-parser.ts]
P3[react-parser.ts]
P4[docs-parser.ts]
P5[scss-parser.ts]
P6[icon-parser.ts]
end
subgraph Data["Extracted Data"]
D1[Design Tokens<br/>colors, spacing, typography,<br/>shadows, borders, screens, grid]
D2[Vue Components<br/>props, slots, events, examples]
D4V[Vue Storybook Docs<br/>Getting Started, Usage]
D4R[React Storybook Docs<br/>Getting Started, Usage]
D3[React Components<br/>props, callbacks, examples]
D4[Documentation<br/>MDX content, frontmatter]
D5[CSS Utilities<br/>Flexy, Margin, Padding, etc.]
D6[Icons<br/>SVG icons with metadata]
end
subgraph DB["SQLite Database"]
T1[(tokens)]
T1P[(token_properties)]
T1F[(tokens_fts)]
T2[(components)]
T3[(component_props)]
T4[(component_slots)]
T5[(component_events)]
T6[(component_examples)]
T7[(documentation)]
T8[(docs_fts)]
CU[(css_utilities)]
CUC[(css_utility_classes)]
CUE[(css_utility_examples)]
IC[(icons)]
end
R1 --> TP
TP --> TP1 & TP2 & TP3 & TP4 & TP5 & TP6 & TP7
TP1 & TP2 & TP3 & TP4 & TP5 & TP6 & TP7 --> D1
D1 --> T1
T1 --> T1P & T1F
R1 --> P4 --> D4 --> T7 --> T8
R1 --> P5 --> D5 --> CU
CU --> CUC & CUE
R2 --> P4 --> D4V --> T7
R3 --> P4 --> D4R --> T7
R2 --> P2 --> D2 --> T2
R3 --> P3 --> D3 --> T2
D2 --> T3 & T4 & T5 & T6
D3 --> T3 & T5 & T6
R1 --> P6 --> D6 --> IC