learngraph 0.4.0 → 0.7.0

package/dist/types/components/SkillCard.d.ts

@@ -0,0 +1,34 @@
+/**
+ * SkillCard Component
+ *
+ * Card component displaying skill details with mastery status.
+ *
+ * @packageDocumentation
+ */
+import { type FC } from 'react';
+import type { SkillCardProps } from './types.js';
+/**
+ * SkillCard Component
+ *
+ * Displays skill information with optional mastery tracking.
+ *
+ * @example
+ * ```tsx
+ * import { SkillCard } from 'learngraph/components';
+ *
+ * function SkillDetails({ skill }) {
+ *   return (
+ *     <SkillCard
+ *       skill={skill}
+ *       mastery={{ probability: 0.75, confidence: 'medium', attempts: 10 }}
+ *       isAvailable={true}
+ *       variant="detailed"
+ *       onStartLearning={() => console.log('Start learning')}
+ *     />
+ *   );
+ * }
+ * ```
+ */
+export declare const SkillCard: FC<SkillCardProps>;
+export default SkillCard;
+//# sourceMappingURL=SkillCard.d.ts.map

package/dist/types/components/SkillCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkillCard.d.ts","sourceRoot":"","sources":["../../../src/components/SkillCard.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAc,EAAE,KAAK,EAAE,EAA+B,MAAM,OAAO,CAAC;AAEpE,OAAO,KAAK,EAAE,cAAc,EAAgB,MAAM,YAAY,CAAC;AAkN/D;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAmMxC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/types/components/SkillExplorer.d.ts

@@ -0,0 +1,39 @@
+/**
+ * SkillExplorer Component
+ *
+ * Interactive skill browser with filtering and search.
+ *
+ * @packageDocumentation
+ */
+import { type FC } from 'react';
+import type { SkillExplorerProps } from './types.js';
+/**
+ * SkillExplorer Component
+ *
+ * Interactive browser for exploring and filtering skills.
+ *
+ * @example
+ * ```tsx
+ * import { SkillExplorer } from 'learngraph/components';
+ *
+ * function CurriculumBrowser() {
+ *   const { skills, edges } = useLearnGraph();
+ *
+ *   return (
+ *     <SkillExplorer
+ *       skills={skills}
+ *       edges={edges}
+ *       masteredSkillIds={['skill-1', 'skill-2']}
+ *       viewMode="grid"
+ *       enableSearch
+ *       enableFilters
+ *       onSkillSelect={(skill) => navigate(`/skill/${skill.id}`)}
+ *       onSetGoal={(skill) => setLearningGoal(skill.id)}
+ *     />
+ *   );
+ * }
+ * ```
+ */
+export declare const SkillExplorer: FC<SkillExplorerProps>;
+export default SkillExplorer;
+//# sourceMappingURL=SkillExplorer.d.ts.map

package/dist/types/components/SkillExplorer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkillExplorer.d.ts","sourceRoot":"","sources":["../../../src/components/SkillExplorer.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAc,EACZ,KAAK,EAAE,EAKR,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,kBAAkB,EAAgB,MAAM,YAAY,CAAC;AAuanE;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAmRhD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/types/components/SkillGraph.d.ts

@@ -0,0 +1,38 @@
+/**
+ * SkillGraph Component
+ *
+ * Interactive graph visualization for skills and prerequisites.
+ * Uses React Flow for rendering and interaction.
+ *
+ * @packageDocumentation
+ */
+import { type FC } from 'react';
+import type { SkillGraphProps } from './types.js';
+/**
+ * SkillGraph Component
+ *
+ * Interactive visualization of skills and their prerequisite relationships.
+ *
+ * @example
+ * ```tsx
+ * import { SkillGraph } from 'learngraph/components';
+ *
+ * function CurriculumView() {
+ *   const { skills, edges } = useLearnGraph();
+ *
+ *   return (
+ *     <SkillGraph
+ *       skills={skills}
+ *       edges={edges}
+ *       masteredSkillIds={['skill-1', 'skill-2']}
+ *       layout="hierarchical"
+ *       onNodeClick={(node) => console.log('Selected:', node.skill.name)}
+ *       height={600}
+ *     />
+ *   );
+ * }
+ * ```
+ */
+export declare const SkillGraph: FC<SkillGraphProps>;
+export default SkillGraph;
+//# sourceMappingURL=SkillGraph.d.ts.map

package/dist/types/components/SkillGraph.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkillGraph.d.ts","sourceRoot":"","sources":["../../../src/components/SkillGraph.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAc,EAKZ,KAAK,EAAE,EAER,MAAM,OAAO,CAAC;AAmBf,OAAO,KAAK,EACV,eAAe,EAIhB,MAAM,YAAY,CAAC;AAmVpB;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CA6M1C,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/types/components/hooks.d.ts

@@ -0,0 +1,187 @@
+/**
+ * React Hooks for LearnGraph
+ *
+ * Custom hooks for accessing graph data and learning state.
+ *
+ * @packageDocumentation
+ */
+import { type ReactNode } from 'react';
+import type { SkillNode } from '../types/index.js';
+import type { GraphStorage } from '../storage/index.js';
+import type { LearnGraphContextValue, UseLearningPathOptions, UseLearningPathResult, UseZPDOptions, UseZPDResult } from './types.js';
+/**
+ * Provider props
+ */
+export interface LearnGraphProviderProps {
+    /** Storage instance */
+    storage: GraphStorage;
+    /** Initial mastered skill IDs */
+    masteredSkillIds?: string[];
+    /** Children */
+    children: ReactNode;
+}
+/**
+ * LearnGraph context provider
+ *
+ * @example
+ * ```tsx
+ * import { LearnGraphProvider } from 'learngraph/components';
+ * import { MemoryStorage } from 'learngraph/storage';
+ *
+ * const storage = new MemoryStorage();
+ * await storage.connect({ backend: 'memory' });
+ *
+ * function App() {
+ *   return (
+ *     <LearnGraphProvider storage={storage}>
+ *       <YourComponents />
+ *     </LearnGraphProvider>
+ *   );
+ * }
+ * ```
+ */
+export declare function LearnGraphProvider({ storage, masteredSkillIds: initialMastered, children, }: LearnGraphProviderProps): JSX.Element;
+/**
+ * Use LearnGraph context
+ *
+ * @example
+ * ```tsx
+ * function SkillList() {
+ *   const { skills, isLoading } = useLearnGraph();
+ *
+ *   if (isLoading) return <div>Loading...</div>;
+ *
+ *   return (
+ *     <ul>
+ *       {skills.map(skill => (
+ *         <li key={skill.id}>{skill.name}</li>
+ *       ))}
+ *     </ul>
+ *   );
+ * }
+ * ```
+ */
+export declare function useLearnGraph(): LearnGraphContextValue;
+/**
+ * Generate learning path to target skill
+ *
+ * @example
+ * ```tsx
+ * function PathToAlgebra() {
+ *   const { steps, totalMinutes, isLoading } = useLearningPath({
+ *     targetSkillId: 'algebra-101',
+ *     masteredSkillIds: ['arithmetic'],
+ *   });
+ *
+ *   if (isLoading) return <div>Loading...</div>;
+ *
+ *   return (
+ *     <div>
+ *       <h2>Path to Algebra ({totalMinutes} min)</h2>
+ *       {steps.map(step => (
+ *         <div key={step.skill.id}>{step.skill.name}</div>
+ *       ))}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useLearningPath(options: UseLearningPathOptions): UseLearningPathResult;
+/**
+ * Get Zone of Proximal Development skills
+ *
+ * @example
+ * ```tsx
+ * function NextSteps() {
+ *   const { readyToLearn, almostReady, isLoading } = useZPD({
+ *     masteredSkillIds: ['skill-1', 'skill-2'],
+ *     limit: 5,
+ *   });
+ *
+ *   if (isLoading) return <div>Loading...</div>;
+ *
+ *   return (
+ *     <div>
+ *       <h2>Ready to Learn</h2>
+ *       {readyToLearn.map(skill => (
+ *         <div key={skill.id}>{skill.name}</div>
+ *       ))}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useZPD(options?: UseZPDOptions): UseZPDResult;
+/**
+ * Use skill hook result
+ */
+export interface UseSkillResult {
+    skill: SkillNode | null;
+    prerequisites: SkillNode[];
+    dependents: SkillNode[];
+    isAvailable: boolean;
+    isMastered: boolean;
+    isLoading: boolean;
+    error: Error | null;
+}
+/**
+ * Get detailed skill information
+ *
+ * @example
+ * ```tsx
+ * function SkillDetails({ skillId }: { skillId: string }) {
+ *   const { skill, prerequisites, isAvailable } = useSkill(skillId);
+ *
+ *   if (!skill) return <div>Skill not found</div>;
+ *
+ *   return (
+ *     <div>
+ *       <h2>{skill.name}</h2>
+ *       <p>{skill.description}</p>
+ *       {isAvailable && <button>Start Learning</button>}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useSkill(skillId: string): UseSkillResult;
+/**
+ * Use filtered skills hook result
+ */
+export interface UseFilteredSkillsResult {
+    filteredSkills: SkillNode[];
+    availableTags: string[];
+    totalCount: number;
+    filteredCount: number;
+}
+/**
+ * Filter skills with various criteria
+ *
+ * @example
+ * ```tsx
+ * function FilteredList() {
+ *   const { filteredSkills, availableTags } = useFilteredSkills({
+ *     query: 'algebra',
+ *     bloomLevels: ['apply', 'analyze'],
+ *     tags: ['math'],
+ *   });
+ *
+ *   return (
+ *     <ul>
+ *       {filteredSkills.map(skill => (
+ *         <li key={skill.id}>{skill.name}</li>
+ *       ))}
+ *     </ul>
+ *   );
+ * }
+ * ```
+ */
+export declare function useFilteredSkills(filters: {
+    query?: string;
+    bloomLevels?: string[];
+    tags?: string[];
+    masteryStatus?: 'all' | 'mastered' | 'available' | 'locked';
+    sortBy?: 'name' | 'bloomLevel' | 'estimatedMinutes';
+    sortDirection?: 'asc' | 'desc';
+}): UseFilteredSkillsResult;
+//# sourceMappingURL=hooks.d.ts.map

package/dist/types/components/hooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../../src/components/hooks.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,SAAS,EAAoB,MAAM,mBAAmB,CAAC;AACrE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,KAAK,EACV,sBAAsB,EACtB,sBAAsB,EACtB,qBAAqB,EACrB,aAAa,EACb,YAAY,EAEb,MAAM,YAAY,CAAC;AAWpB;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,uBAAuB;IACvB,OAAO,EAAE,YAAY,CAAC;IACtB,iCAAiC;IACjC,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,eAAe;IACf,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,OAAO,EACP,gBAAgB,EAAE,eAAoB,EACtC,QAAQ,GACT,EAAE,uBAAuB,GAAG,GAAG,CAAC,OAAO,CAkIvC;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,aAAa,IAAI,sBAAsB,CAMtD;AAMD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CAkGvB;AAMD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,MAAM,CAAC,OAAO,GAAE,aAAkB,GAAG,YAAY,CA2EhE;AAMD;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,SAAS,GAAG,IAAI,CAAC;IACxB,aAAa,EAAE,SAAS,EAAE,CAAC;IAC3B,UAAU,EAAE,SAAS,EAAE,CAAC;IACxB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,QAAQ,CAAC,OAAO,EAAE,MAAM,GAAG,cAAc,CA0CxD;AAMD;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,cAAc,EAAE,SAAS,EAAE,CAAC;IAC5B,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,aAAa,CAAC,EAAE,KAAK,GAAG,UAAU,GAAG,WAAW,GAAG,QAAQ,CAAC;IAC5D,MAAM,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,kBAAkB,CAAC;IACpD,aAAa,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;CAChC,GAAG,uBAAuB,CAmH1B"}

package/dist/types/components/index.d.ts

@@ -0,0 +1,59 @@
+/**
+ * LearnGraph React Components
+ *
+ * Visual components for graph exploration and learning dashboards.
+ *
+ * @packageDocumentation
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   LearnGraphProvider,
+ *   useLearnGraph,
+ *   SkillGraph,
+ *   SkillCard,
+ *   SkillExplorer,
+ *   LearningPathView,
+ *   ProgressDashboard,
+ * } from 'learngraph/components';
+ * import { MemoryStorage } from 'learngraph/storage';
+ *
+ * // Setup storage
+ * const storage = new MemoryStorage();
+ * await storage.connect({ backend: 'memory' });
+ *
+ * // Wrap your app with the provider
+ * function App() {
+ *   return (
+ *     <LearnGraphProvider storage={storage}>
+ *       <CurriculumView />
+ *     </LearnGraphProvider>
+ *   );
+ * }
+ *
+ * // Use hooks and components
+ * function CurriculumView() {
+ *   const { skills, edges, isLoading } = useLearnGraph();
+ *
+ *   if (isLoading) return <div>Loading...</div>;
+ *
+ *   return (
+ *     <SkillGraph
+ *       skills={skills}
+ *       edges={edges}
+ *       layout="hierarchical"
+ *       height={600}
+ *     />
+ *   );
+ * }
+ * ```
+ */
+export type { GraphNode, GraphEdge, GraphLayout, GraphViewport, SkillGraphProps, MasteryState, SkillCardProps, PathStep, LearningPathViewProps, LearningStats, BloomProgress, ActivityItem, ProgressDashboardProps, SkillFilters, SkillExplorerProps, LearnGraphContextValue, UseLearningPathOptions, UseLearningPathResult, UseZPDOptions, UseZPDResult, } from './types.js';
+export { DEFAULT_BLOOM_COLORS, STATUS_COLORS } from './types.js';
+export { LearnGraphProvider, useLearnGraph, useLearningPath, useZPD, useSkill, useFilteredSkills, type LearnGraphProviderProps, type UseSkillResult, type UseFilteredSkillsResult, } from './hooks.js';
+export { SkillGraph } from './SkillGraph.js';
+export { SkillCard } from './SkillCard.js';
+export { LearningPathView } from './LearningPathView.js';
+export { ProgressDashboard } from './ProgressDashboard.js';
+export { SkillExplorer } from './SkillExplorer.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AAGH,YAAY,EAEV,SAAS,EACT,SAAS,EACT,WAAW,EACX,aAAa,EACb,eAAe,EAEf,YAAY,EACZ,cAAc,EAEd,QAAQ,EACR,qBAAqB,EAErB,aAAa,EACb,aAAa,EACb,YAAY,EACZ,sBAAsB,EAEtB,YAAY,EACZ,kBAAkB,EAElB,sBAAsB,EACtB,sBAAsB,EACtB,qBAAqB,EACrB,aAAa,EACb,YAAY,GACb,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGjE,OAAO,EACL,kBAAkB,EAClB,aAAa,EACb,eAAe,EACf,MAAM,EACN,QAAQ,EACR,iBAAiB,EACjB,KAAK,uBAAuB,EAC5B,KAAK,cAAc,EACnB,KAAK,uBAAuB,GAC7B,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC"}