How ritveak/jainconceptlab works
Concept Laboratory is a React app for learning concepts through explanatory content, optional FAQs/resources, and concept-specific interactive labs. A visitor opens the hub, selects a concept, then explores its dynamically available tabs; labs progress through scenario selection, guided decisions, and a reflection or scorecard. The shared concept loader discovers Markdown, lab, FAQ, and resource assets, while dedicated Mohniye and Samvaay state hooks implement distinct experiments. Edges reflect explicit imports or documented behavior; unsampled subsystems are represented at their existing concept-directory paths, with no inferred internal calls.
Main entry points: index.jsx Concept Loader · samvaay/Lab.jsx Samvaay Lab · mohniye/Lab.jsx Mohniye Lab · ConceptPage.jsx Concept Page
Components 25
App Navigation
- Route App
src/App.jsx - Concept Hub
src/components/layout/ConceptHub.jsx - Concept Page
src/components/layout/ConceptPage.jsx - Dynamic Tabs
src/components/layout/ConceptTabs.jsx
Concept Content
- Concept Loader
src/concepts/index.jsx - Concept Definitions
src/concepts - Markdown Renderer
src/components/layout/ConceptMarkdown.jsx - Styled Prose
src/components/prose/ConceptProse.jsx - FAQ Renderer
src/components/renderers/FaqRenderer.jsx - Resources Renderer
src/components/renderers/ResourcesRenderer.jsx
Interactive Labs
- Karmagranth Lab
src/concepts/karmagranth/Lab.jsx - Karmagranth Data
src/concepts/karmagranth/data.js - Mohniye Lab
src/concepts/mohniye/Lab.jsx - Mohniye State
src/concepts/mohniye/useMohniyeLab.js - Mohniye Scenarios
src/concepts/mohniye/data.js - Mohniye Stage UI
src/concepts/mohniye/lab - Samvaay Lab
src/concepts/samvaay/Lab.jsx - Samvaay State
src/concepts/samvaay/useSamvaayLab.js - Samvaay Scenarios
src/concepts/samvaay/data.js - Samvaay Stage UI
src/concepts/samvaay/lab
Shared Presentation
- FAQ Accordion
src/components/faq/FaqSection.jsx - Lab Wrapper
src/components/lab/LabEmbedded.jsx - Immersive Pivot
src/components/lab/PivotImmersive.jsx - Matrix Animation
src/hooks/useMatrixAnimation.js
Other components
- Visitor
Connections 30
- Visitor → Route App: opens
src/App.jsx - Route App → Concept Hub: routes home
src/App.jsx - Route App → Concept Page: routes concept
src/App.jsx - Concept Hub → Concept Loader: loads concepts
src/components/layout/ConceptHub.jsx - Concept Hub → Concept Page: navigates to
src/components/layout/ConceptHub.jsx - Concept Page → Concept Loader: gets content
src/components/layout/ConceptPage.jsx - Concept Loader → Concept Definitions: discovers content
src/concepts/index.jsx - Concept Loader → Markdown Renderer: renders markdown
src/concepts/index.jsx - Markdown Renderer → Styled Prose: uses
src/components/layout/ConceptMarkdown.jsx - Concept Page → Dynamic Tabs: renders tabs
src/components/layout/ConceptPage.jsx - Concept Loader → FAQ Renderer: renders FAQ
src/concepts/index.jsx - FAQ Renderer → FAQ Accordion: renders accordion
src/components/renderers/FaqRenderer.jsx - Concept Loader → Resources Renderer: renders resources
src/concepts/index.jsx - Concept Loader → Karmagranth Lab: loads lab
- Concept Loader → Mohniye Lab: loads lab
- Concept Loader → Samvaay Lab: loads lab
- Karmagranth Lab → Lab Wrapper: uses wrapper
src/concepts/karmagranth/Lab.jsx - Karmagranth Lab → Karmagranth Data: reads data
src/concepts/karmagranth/Lab.jsx - Mohniye Lab → Lab Wrapper: uses wrapper
src/concepts/mohniye/Lab.jsx - Mohniye Lab → Mohniye State: uses state
src/concepts/mohniye/Lab.jsx - Mohniye Lab → Mohniye Scenarios: reads data
src/concepts/mohniye/Lab.jsx - Mohniye Lab → Mohniye Stage UI: renders stages
src/concepts/mohniye/Lab.jsx - Mohniye State → Mohniye Scenarios: derives state
src/concepts/mohniye/useMohniyeLab.js - Samvaay Lab → Lab Wrapper: uses wrapper
src/concepts/samvaay/Lab.jsx - Samvaay Lab → Samvaay State: uses state
src/concepts/samvaay/Lab.jsx - Samvaay Lab → Samvaay Scenarios: reads data
src/concepts/samvaay/Lab.jsx - Samvaay Lab → Samvaay Stage UI: renders stages
src/concepts/samvaay/Lab.jsx - Samvaay Lab → Immersive Pivot: uses pivot
src/concepts/samvaay/Lab.jsx - Samvaay State → Samvaay Scenarios: derives state
src/concepts/samvaay/useSamvaayLab.js - Immersive Pivot → Matrix Animation: uses animation
src/components/lab/PivotImmersive.jsx