refactor: relocate demo samples and stabilize svelte element builds

Move element-demo sample configs into src/lib/samples with updated loaders/tooling, and harden Svelte element compatibility by fixing custom-element compile paths and modernizing mc-populated-blank delivery markup/typing.

Made-with: Cursor

Author: chillenious

.changeset/mc-populated-blank.md

@@ -0,0 +1,5 @@
+---
+'@pie-element/mc-populated-blank': minor
+---
+
+Initial publish of `@pie-element/mc-populated-blank`: Svelte 5 element for multiple-choice answers that populate a `{{blank}}` slot in an HTML template, with optional audio/transcript, author UI, controller, and print surface. Synthetic demos in element-demo and pie-players item-demos.

.gitignore

@@ -62,7 +62,6 @@ esm-compatible-elements.json
 apps/element-demo/src/lib/element-imports.js
 apps/element-demo/src/lib/element-imports.d.ts
 apps/element-demo/src/lib/elements/registry.ts
-apps/element-demo/src/lib/data/sample-configs/
 
 # Demo server lock file
 .demo-server.lock

UPSTREAM_SYNC_COMMIT_GUIDE.md

@@ -42,7 +42,7 @@ These are regenerated automatically on every `upstream:sync` and should NOT be c
   - **Contains timestamp** that changes on every sync
   - Regenerated from scanning `packages/elements-react/`
 
-- **`apps/element-demo/src/lib/data/sample-configs/react/`**
+- **`apps/element-demo/src/lib/samples/`**
   - Sample config/session JSON files
   - Copied from each element's `docs/demo/` directory
   - Redundant since source configs are already committed in element packages

apps/element-demo/convert-demo.mjs

@@ -2,7 +2,7 @@ import config from './packages/elements-react/multiple-choice/docs/demo/config.m
 import { writeFileSync } from 'node:fs';
 
 writeFileSync(
-  './apps/element-demo/src/lib/data/sample-configs/react/multiple-choice.json',
+  './apps/element-demo/src/lib/samples/multiple-choice.json',
   JSON.stringify(config, null, 2)
 );
 

apps/element-demo/src/lib/elements/registry.ts

@@ -298,6 +298,16 @@ export const ELEMENT_REGISTRY: readonly ElementMetadata[] = [
     "hasConfig": true,
     "hasSession": true,
     "demoCount": 1
+  },
+  {
+    "name": "mc-populated-blank",
+    "title": "MC Populated Blank",
+    "packageName": "@pie-element/mc-populated-blank",
+    "hasAuthor": true,
+    "hasPrint": true,
+    "hasConfig": true,
+    "hasSession": true,
+    "demoCount": 8
   }
 ];
 

…ata/sample-configs/react/categorize.json …ent-demo/src/lib/samples/categorize.jsonapps/element-demo/src/lib/data/sample-configs/react/categorize.json renamed to apps/element-demo/src/lib/samples/categorize.json apps/element-demo/src/lib/data/sample-configs/react/categorize.json renamed to apps/element-demo/src/lib/samples/categorize.json

@@ -4,12 +4,7 @@
       "id": "math-equations",
       "title": "Math Equations Classification",
       "description": "Categorize equations as true or false with LaTeX math rendering",
-      "tags": [
-        "math",
-        "equations",
-        "true-false",
-        "latex"
-      ],
+      "tags": ["math", "equations", "true-false", "latex"],
       "model": {
         "id": "1",
         "element": "categorize",
@@ -69,19 +64,11 @@
         "correctResponse": [
           {
             "category": "0",
-            "choices": [
-              "3",
-              "4",
-              "5"
-            ]
+            "choices": ["3", "4", "5"]
           },
           {
             "category": "1",
-            "choices": [
-              "0",
-              "1",
-              "2"
-            ]
+            "choices": ["0", "1", "2"]
           }
         ],
         "lockChoiceOrder": true,
@@ -102,13 +89,7 @@
       "id": "geometry-shapes",
       "title": "Geometric Shapes by Dimensions",
       "description": "Sort shapes with math formulas into 2D and 3D categories",
-      "tags": [
-        "math",
-        "geometry",
-        "shapes",
-        "2d",
-        "3d"
-      ],
+      "tags": ["math", "geometry", "shapes", "2d", "3d"],
       "model": {
         "id": "2",
         "element": "categorize",
@@ -168,19 +149,11 @@
         "correctResponse": [
           {
             "category": "0",
-            "choices": [
-              "0",
-              "2",
-              "4"
-            ]
+            "choices": ["0", "2", "4"]
           },
           {
             "category": "1",
-            "choices": [
-              "1",
-              "3",
-              "5"
-            ]
+            "choices": ["1", "3", "5"]
           }
         ],
         "lockChoiceOrder": false,
@@ -201,13 +174,7 @@
       "id": "algebra-operations",
       "title": "Algebraic Operations with Alternates",
       "description": "Categorize expressions by operation type with multiple correct arrangements",
-      "tags": [
-        "math",
-        "algebra",
-        "operations",
-        "alternates",
-        "advanced"
-      ],
+      "tags": ["math", "algebra", "operations", "alternates", "advanced"],
       "model": {
         "id": "3",
         "element": "categorize",
@@ -265,41 +232,18 @@
         "correctResponse": [
           {
             "category": "0",
-            "choices": [
-              "0"
-            ],
-            "alternateResponses": [
-              [
-                "0",
-                "3"
-              ]
-            ]
+            "choices": ["0"],
+            "alternateResponses": [["0", "3"]]
           },
           {
             "category": "1",
-            "choices": [
-              "2",
-              "4"
-            ],
-            "alternateResponses": [
-              [
-                "1",
-                "2",
-                "4"
-              ]
-            ]
+            "choices": ["2", "4"],
+            "alternateResponses": [["1", "2", "4"]]
           },
           {
             "category": "2",
-            "choices": [
-              "1",
-              "3"
-            ],
-            "alternateResponses": [
-              [
-                "3"
-              ]
-            ]
+            "choices": ["1", "3"],
+            "alternateResponses": [["3"]]
           }
         ],
         "lockChoiceOrder": true,
@@ -320,13 +264,7 @@
       "id": "calculus-concepts",
       "title": "Calculus: Derivatives vs Integrals",
       "description": "Four-category grid with calculus formulas and multiple placements",
-      "tags": [
-        "math",
-        "calculus",
-        "derivatives",
-        "integrals",
-        "grid"
-      ],
+      "tags": ["math", "calculus", "derivatives", "integrals", "grid"],
       "model": {
         "id": "4",
         "element": "categorize",
@@ -394,29 +332,19 @@
         "correctResponse": [
           {
             "category": "0",
-            "choices": [
-              "0"
-            ]
+            "choices": ["0"]
           },
           {
             "category": "1",
-            "choices": [
-              "1"
-            ]
+            "choices": ["1"]
           },
           {
             "category": "2",
-            "choices": [
-              "2",
-              "4"
-            ]
+            "choices": ["2", "4"]
           },
           {
             "category": "3",
-            "choices": [
-              "3",
-              "5"
-            ]
+            "choices": ["3", "5"]
           }
         ],
         "lockChoiceOrder": true,

…/data/sample-configs/react/charting.json …ement-demo/src/lib/samples/charting.jsonapps/element-demo/src/lib/data/sample-configs/react/charting.json renamed to apps/element-demo/src/lib/samples/charting.json apps/element-demo/src/lib/data/sample-configs/react/charting.json renamed to apps/element-demo/src/lib/samples/charting.json

@@ -4,12 +4,7 @@
       "id": "bar-chart-statistics",
       "title": "Bar Chart - Test Score Distribution",
       "description": "Interactive bar chart for analyzing student test scores with editable values",
-      "tags": [
-        "bar",
-        "statistics",
-        "data-analysis",
-        "interactive"
-      ],
+      "tags": ["bar", "statistics", "data-analysis", "interactive"],
       "model": {
         "id": "1",
         "element": "charting",
@@ -104,13 +99,7 @@
       "id": "line-chart-growth",
       "title": "Line Chart - Plant Growth with Math",
       "description": "Line chart with cross markers showing exponential plant growth over time",
-      "tags": [
-        "line",
-        "lineCross",
-        "growth",
-        "math",
-        "science"
-      ],
+      "tags": ["line", "lineCross", "growth", "math", "science"],
       "model": {
         "id": "2",
         "element": "charting",
@@ -203,13 +192,7 @@
       "id": "histogram-frequency",
       "title": "Histogram - Survey Response Frequencies",
       "description": "Histogram showing frequency distribution with all editable categories",
-      "tags": [
-        "histogram",
-        "frequency",
-        "survey",
-        "statistics",
-        "editable"
-      ],
+      "tags": ["histogram", "frequency", "survey", "statistics", "editable"],
       "model": {
         "id": "3",
         "element": "charting",

…sample-configs/react/complex-rubric.json …demo/src/lib/samples/complex-rubric.jsonapps/element-demo/src/lib/data/sample-configs/react/complex-rubric.json renamed to apps/element-demo/src/lib/samples/complex-rubric.json apps/element-demo/src/lib/data/sample-configs/react/complex-rubric.json renamed to apps/element-demo/src/lib/samples/complex-rubric.json

@@ -11,18 +11,8 @@
         "rubricType": "simpleRubric",
         "rubrics": {
           "simpleRubric": {
-            "points": [
-              "nothing right",
-              "a teeny bit right",
-              "mostly right",
-              "bingo"
-            ],
-            "sampleAnswers": [
-              null,
-              "just right",
-              "not left",
-              null
-            ],
+            "points": ["nothing right", "a teeny bit right", "mostly right", "bingo"],
+            "sampleAnswers": [null, "just right", "not left", null],
             "maxPoints": 3,
             "excludeZero": false
           },
@@ -126,11 +116,7 @@
               },
               {
                 "maxPoints": 5,
-                "scorePointsLabels": [
-                  "Non-Scorable",
-                  "Unsatisfactory",
-                  "Satisfactory"
-                ],
+                "scorePointsLabels": ["Non-Scorable", "Unsatisfactory", "Satisfactory"],
                 "traitLabel": "Category",
                 "traits": [
                   {

…ple-configs/react/drag-in-the-blank.json …o/src/lib/samples/drag-in-the-blank.jsonapps/element-demo/src/lib/data/sample-configs/react/drag-in-the-blank.json renamed to apps/element-demo/src/lib/samples/drag-in-the-blank.json apps/element-demo/src/lib/data/sample-configs/react/drag-in-the-blank.json renamed to apps/element-demo/src/lib/samples/drag-in-the-blank.json

@@ -4,11 +4,7 @@
       "id": "basic-sentence",
       "title": "Basic Sentence Completion",
       "description": "Simple fill-in-the-blank sentence with text choices",
-      "tags": [
-        "basic",
-        "text",
-        "sentence"
-      ],
+      "tags": ["basic", "text", "sentence"],
       "model": {
         "id": "1",
         "element": "drag-in-the-blank",
@@ -55,11 +51,7 @@
       "id": "math-equations",
       "title": "Mathematical Equations",
       "description": "Complete equations with mathematical expressions and symbols",
-      "tags": [
-        "math",
-        "equations",
-        "algebra"
-      ],
+      "tags": ["math", "equations", "algebra"],
       "model": {
         "id": "2",
         "element": "drag-in-the-blank",
@@ -112,12 +104,7 @@
       "id": "word-problems-images",
       "title": "Word Problems with Arrays",
       "description": "Match word problems to visual array representations",
-      "tags": [
-        "images",
-        "arrays",
-        "word-problems",
-        "multiplication"
-      ],
+      "tags": ["images", "arrays", "word-problems", "multiplication"],
       "model": {
         "id": "3",
         "element": "drag-in-the-blank",
@@ -161,12 +148,7 @@
       "id": "chemistry-duplicates",
       "title": "Chemistry Balance with Duplicates",
       "description": "Balance chemical equations allowing duplicate use of coefficients",
-      "tags": [
-        "chemistry",
-        "duplicates",
-        "math",
-        "equations"
-      ],
+      "tags": ["chemistry", "duplicates", "math", "equations"],
       "model": {
         "id": "4",
         "element": "drag-in-the-blank",

…mple-configs/react/drawing-response.json …mo/src/lib/samples/drawing-response.jsonapps/element-demo/src/lib/data/sample-configs/react/drawing-response.json renamed to apps/element-demo/src/lib/samples/drawing-response.json apps/element-demo/src/lib/data/sample-configs/react/drawing-response.json renamed to apps/element-demo/src/lib/samples/drawing-response.json

@@ -4,10 +4,7 @@
       "id": "default",
       "title": "Default Demo",
       "description": "Basic drawing response configuration",
-      "tags": [
-        "drawing",
-        "default"
-      ],
+      "tags": ["drawing", "default"],
       "model": {
         "id": "1",
         "element": "drawing-response",