npm - cognikit - Versions diffs - 1.0.2 → 1.1.0 - Mend

cognikit 1.0.2 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (124) hide show

package/public/assets/images/landscape.jpg ADDED Viewed

Binary file

package/public/assets/images/mountains.jpg ADDED Viewed

Binary file

package/public/builders.html ADDED Viewed

@@ -0,0 +1,87 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<meta name="theme-color" content="#f7f9fc">
+	<title>CogniKit Builder Shell</title>
+	<style>
+		:root {
+			--edu-bg: 247 249 252;
+			--edu-card: 255 255 255;
+			--edu-ink: 31 41 55;
+			--edu-second-ink: 71 85 105;
+			--edu-third-ink: 100 116 139;
+			--edu-inverted-ink: 248 250 252;
+			--edu-success: 22 163 74;
+			--edu-error: 220 38 38;
+			--edu-warning: 255 222 33;
+			--edu-neutral: 14 165 233;
+			--edu-first-accent: 49 120 198;
+			--edu-second-accent: 245 158 11;
+			--edu-third-accent: 236 72 153;
+			--edu-border: 229 231 235;
+			--edu-muted: 243 244 246;
+			--edu-shadow-color: 0 0 0;
+		}
+		* {
+			box-sizing: border-box;
+		}
+		html,
+		body {
+			margin: 0;
+			width: 100%;
+			height: 100%;
+		}
+		body {
+			font-family: "IBM Plex Sans", "Segoe UI", sans-serif;
+			background:
+				linear-gradient(180deg, rgb(var(--edu-bg)), rgb(var(--edu-muted) / 0.5));
+			color: rgb(var(--edu-ink));
+			overflow-x: hidden;
+			overflow-y: auto;
+		}
+		.page {
+			display: grid;
+			grid-template-rows: auto auto;
+			width: 100%;
+			min-height: 100dvh;
+			padding: 1.25rem;
+			gap: 1rem;
+		}
+		.demo-frame {
+			border: 1px solid rgb(var(--edu-border));
+			background: rgb(var(--edu-card));
+		}
+		edu-builder-window {
+			display: block;
+			width: 100%;
+		}
+		@media (max-width: 720px) {
+			.page {
+				padding: 0.75rem;
+			}
+			.page-title {
+				font-size: 1.3rem;
+			}
+		}
+	</style>
+</head>
+<body>
+	<main class="page">
+		<section class="demo-frame">
+			<edu-builder-window></edu-builder-window>
+		</section>
+	</main>
+	<script type="module" src="./app.js"></script>
+</body>
+</html>

package/public/examples/data.ts ADDED Viewed

@@ -0,0 +1,167 @@
+const ASSETS =  [
+	mcq: `
+paris:\n type: image\n url: https://plus.unsplash.com/premium_photo-1718035557075-5111d9d906d2?q=80&w=1171&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\n dialog: true
+exampleHtml:
+type: html
+content: <div style="padding:1rem;"><h3>Rich HTML Question</h3><p>What is <strong>2 + 2</strong>?</p><ul><li>Addition</li><li>Basic math</li></ul></div>
+dialog: true
+movements:\n type: video\n url: https://www.pexels.com/download/video/6548176\n dialog: false
+laugh:\n type: audio\n url: https://www.soundjay.com/human/sounds/man-laughing-01.mp3\n dialog: true
+`
+];
+const CONFIGS = [
+	mcq: {
+		variant: "letter",
+		shuffle: true,
+		animationsEnabled: true,
+		prompt: "Complete the general knowledge quizz",
+		timer: 120,
+		attemptLimit: 3,
+		points: 100,
+		wallpaper: "mountains",
+		soundEnabled: true
+	},
+	nary: {
+		variant: "playful",
+		shuffle: true,
+		animationsEnabled: true,
+		prompt: "Set the correct matter state to each element",
+		timer: 220,
+		attemptLimit: 3,
+		points: 50,
+		wallpaper: "landscape",
+		soundEnabled: true
+	},
+	classificationMatrix: {
+		variant: "sign",
+		shuffle: true,
+		animationsEnabled: true,
+		prompt: "Add the correct attributes to the programming languages",
+		timer: 320,
+		attemptLimit: 6,
+		points: 40,
+		wallpaper: "https://images.unsplash.com/photo-1763568258474-7c2330c1a893?q=80&w=1170&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+		soundEnabled: true
+	}
+]
+const data: Record<string, { data: any, assets: string | null, config: any }>> = [
+	nary: {
+		data: {
+			rows: [
+				"Ice",
+				"Iron",
+				"Diamond",
+				"Water",
+				"Mercury",
+				"Oil",
+				"Oxygen",
+				"Helium",
+				"Steam"
+			],
+			cols: [
+				"solid",
+				"liquid",
+				"gas"
+			],
+			answerKey: {
+				"solid": [
+					"Ice",
+					"Iron",
+					"Diamond"
+				],
+				"liquid": [
+					"Water",
+					"Mercury",
+					"Oil"
+				],
+				"gas": [
+					"Oxygen",
+					"Helium",
+					"Steam"
+				]
+			}
+		}
+		assets: null,
+		config: CONFIGS["nary"]
+	},
+	classificationMatrix: {
+		data: {
+			rows: [
+				"Python",
+				"JavaScript",
+				"Ruby",
+				"C++",
+				"Rust",
+				"Go"
+			],
+			cols: [
+				"interpreted",
+				"compiled",
+				"strongly_typed",
+				"weakly_typed"
+			],
+			answerKey: {
+				"interpreted": [
+					"Python",
+					"JavaScript",
+					"Ruby"
+				],
+				"compiled": [
+					"C++",
+					"Rust",
+					"Go"
+				],
+				"strongly_typed": [
+					"Python",
+					"C++",
+					"Rust",
+					"Go"
+				],
+				"weakly_typed": [
+					"JavaScript",
+					"Ruby"
+				]
+			}
+		},
+		assets: null,
+		config: CONFIGS["classificationMatrix"]
+	},
+	MCQ: {
+		data: {
+			type: 'recognition',
+			items: [
+				{
+					question: '@:paris',
+					correctOptions: ['Paris'],
+					options: ['London', 'Berlin', 'Madrid']
+				},
+				{
+					question: 'Which of these are programming languages?',
+					correctOptions: ['Python', 'JavaScript', 'Java'],
+					options: ['HTML', 'CSS']
+				},
+				{
+					question: '@:exampleHtml',
+					correctOptions: ['4'],
+					options: ['3', '5', '6']
+				},
+				{
+					question: '@:movements',
+					correctOptions: ['Dancing'],
+					options: ['Sleeping', 'Cooking', 'Kissing']
+				},
+				{
+					question: '@:laugh',
+					correctOptions: ["laughing"],
+					options: ['Crying', 'Shouting']
+				}
+			]
+		},
+		assets: ASSETS["mcq"],
+		config: CONFIGS["mcq"]
+	}
+]