@superbuilders/incept-renderer 0.1.8 → 0.1.12

package/dist/components/index.d.ts

@@ -1,9 +1,8 @@
-import { e as ChoiceInteraction, d as AssessmentItem } from '../schema-DZoGAQdF.js';
-export { C as ChoiceCorrectness, h as ContentBlockRenderer, a as ContentBlockRendererProps, i as QTIRenderer, Q as QTIRendererProps, b as QTITheme, R as ResponseFeedback } from '../schema-DZoGAQdF.js';
+export { C as ChoiceCorrectness, d as ContentBlockRenderer, a as ContentBlockRendererProps, e as QTIRenderer, Q as QTIRendererProps, f as QTIStimulusRenderer, b as QTIStimulusRendererProps, c as QTITheme, R as ResponseFeedback } from '../qti-stimulus-renderer-CSuLfoff.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { C as ChoiceInteraction, A as AssessmentItem, j as DisplayInlineEmbed, l as DisplayTextEmbed, h as DisplayGap } from '../schema-DKduufCs.js';
 import { EvaluationResult } from '../types.js';
 import * as React from 'react';
-import { f as DisplayInlineEmbed, h as DisplayTextEmbed, d as DisplayGap } from '../types-B7YRTQKt.js';
 import 'zod';
 
 interface ChoiceInteractionRendererProps {

package/dist/components/index.js

@@ -29,6 +29,13 @@ var DEFAULT_CONFIG = {
     "div",
     "br",
     "hr",
+    // Headings
+    "h1",
+    "h2",
+    "h3",
+    "h4",
+    "h5",
+    "h6",
     // Formatting
     "b",
     "i",
@@ -78,6 +85,9 @@ var DEFAULT_CONFIG = {
     "figcaption",
     "blockquote",
     "cite",
+    // Interactive
+    "details",
+    "summary",
     // Links
     "a",
     // Forms (for future interactive elements)
@@ -345,7 +355,7 @@ var choiceIndicatorVariants = cva(
     "data-[state=unchecked]:bg-background data-[state=unchecked]:border-2 data-[state=unchecked]:border-input data-[state=unchecked]:text-muted-foreground",
     "data-[state=checked]:border-2 data-[state=checked]:border-[var(--choice-complement)] data-[state=checked]:text-[var(--choice-foreground)]",
     "data-[filled=true]:data-[state=checked]:bg-[var(--choice-complement)]",
-    "data-[filled=true]:data-[state=checked]:shadow-[inset_0_0_0_2px_rgb(255_255_255)] dark:data-[filled=true]:data-[state=checked]:shadow-[inset_0_0_0_2px_rgb(255_255_255)]",
+    "data-[filled=true]:data-[state=checked]:shadow-[inset_0_0_0_3px_rgb(255_255_255)] dark:data-[filled=true]:data-[state=checked]:shadow-[inset_0_0_0_3px_hsl(var(--background))]",
     "focus-visible:ring-[var(--choice-complement)] focus-visible:ring-[3px]",
     "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
   ],
@@ -374,31 +384,38 @@ function ChoiceIndicator({
   letter,
   type = "radio",
   showLetter = true,
-  ...props
+  id,
+  value,
+  checked,
+  onCheckedChange,
+  disabled
 }) {
   const baseClassName = cn(choiceIndicatorVariants({ palette }), className);
   if (type === "checkbox") {
-    const checkboxProps = props;
     return /* @__PURE__ */ jsx(
       CheckboxPrimitive.Root,
       {
         "data-slot": "choice-indicator",
         "data-palette": palette,
-        "data-filled": !showLetter,
+        "data-filled": !showLetter ? "true" : void 0,
         className: baseClassName,
-        ...checkboxProps,
+        id,
+        checked,
+        onCheckedChange,
+        disabled,
         children: showLetter && /* @__PURE__ */ jsx("span", { className: "data-[state=unchecked]:block data-[state=checked]:hidden", children: letter })
       }
     );
   }
-  const radioProps = props;
   return /* @__PURE__ */ jsx(
     RadioGroupPrimitive.Item,
     {
       "data-slot": "choice-indicator",
       "data-palette": palette,
       className: baseClassName,
-      ...radioProps,
+      id,
+      value: value ?? "",
+      disabled,
       children: letter
     }
   );
@@ -1751,14 +1768,16 @@ function SortableItem({
       style,
       ...attributes,
       ...listeners,
+      "data-disabled": disabled,
+      "data-dragging": isDragging,
       className: cn(
-        "bg-background border rounded-lg shadow-sm touch-none select-none",
+        "qti-order-item",
         // Styling differs based on orientation
-        isHorizontal ? "px-4 py-2 min-w-[100px] flex items-center justify-center text-center" : "p-4 w-full flex items-center gap-3",
-        disabled ? "cursor-default opacity-90 bg-muted/50" : "cursor-grab active:cursor-grabbing hover:border-macaw/50 hover:shadow-md"
+        isHorizontal ? "min-w-[100px] flex items-center justify-center text-center" : "w-full flex items-center gap-3",
+        disabled ? "cursor-default" : "cursor-grab active:cursor-grabbing"
       ),
       children: [
-        !isHorizontal && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground shrink-0", children: /* @__PURE__ */ jsx(DragHandleIcon, {}) }),
+        !isHorizontal && /* @__PURE__ */ jsx("div", { className: "qti-order-item-handle shrink-0", children: /* @__PURE__ */ jsx(DragHandleIcon, {}) }),
         /* @__PURE__ */ jsx(HTMLContent, { html: contentHtml })
       ]
     }
@@ -1768,12 +1787,13 @@ function DragOverlayItem({ contentHtml, isHorizontal }) {
   return /* @__PURE__ */ jsxs(
     "div",
     {
+      "data-dragging": "true",
       className: cn(
-        "bg-background border-2 border-macaw rounded-lg shadow-xl cursor-grabbing z-50",
-        isHorizontal ? "px-4 py-2 min-w-[100px] flex items-center justify-center" : "p-4 w-full flex items-center gap-3"
+        "qti-order-item cursor-grabbing z-50",
+        isHorizontal ? "min-w-[100px] flex items-center justify-center" : "w-full flex items-center gap-3"
       ),
       children: [
-        !isHorizontal && /* @__PURE__ */ jsx("div", { className: "text-macaw shrink-0", children: /* @__PURE__ */ jsx(DragHandleIcon, {}) }),
+        !isHorizontal && /* @__PURE__ */ jsx("div", { className: "qti-order-item-handle shrink-0", children: /* @__PURE__ */ jsx(DragHandleIcon, {}) }),
         /* @__PURE__ */ jsx(HTMLContent, { html: contentHtml })
       ]
     }
@@ -1827,14 +1847,9 @@ function OrderInteraction({
       styles: { active: { opacity: "0.4" } }
     })
   };
-  const getContainerStyles = () => {
-    if (!hasSubmitted) {
-      return "bg-muted/30 border-transparent";
-    }
-    if (isCorrect) {
-      return "bg-owl/10 border-owl";
-    }
-    return "bg-cardinal/10 border-cardinal";
+  const getContainerCorrectness = () => {
+    if (!hasSubmitted) return void 0;
+    return isCorrect;
   };
   return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
     interaction.promptHtml && /* @__PURE__ */ jsx(HTMLContent, { html: interaction.promptHtml }),
@@ -1849,11 +1864,8 @@ function OrderInteraction({
           /* @__PURE__ */ jsx(SortableContext, { items: items.map((i) => i.id), strategy, disabled: disabled || hasSubmitted, children: /* @__PURE__ */ jsx(
             "div",
             {
-              className: cn(
-                "rounded-xl p-4 transition-colors border-2",
-                isHorizontal ? "flex flex-wrap gap-3" : "flex flex-col gap-2",
-                getContainerStyles()
-              ),
+              "data-correct": getContainerCorrectness(),
+              className: cn("qti-order-container", isHorizontal ? "flex flex-wrap" : "flex flex-col"),
               children: items.map((item) => /* @__PURE__ */ jsx(
                 SortableItem,
                 {
@@ -2403,6 +2415,9 @@ function QTIRenderer({
     showFeedback && overallFeedback?.messageHtml && /* @__PURE__ */ jsx("div", { className: "qti-feedback mt-6 p-6", "data-correct": overallFeedback.isCorrect, children: /* @__PURE__ */ jsx(HTMLContent, { html: overallFeedback.messageHtml }) })
   ] });
 }
+function QTIStimulusRenderer({ stimulus, className }) {
+  return /* @__PURE__ */ jsx("article", { className: cn("qti-stimulus", className), lang: stimulus.xmlLang, "data-stimulus-id": stimulus.identifier, children: /* @__PURE__ */ jsx(HTMLContent, { html: stimulus.bodyHtml, className: "qti-stimulus-body" }) });
+}
 function QtiFeedbackBlock({ result, item, className }) {
   const feedbackBlock = React3.useMemo(() => {
     if (!result.feedbackIdentifier) {
@@ -2446,6 +2461,6 @@ function QtiFeedbackBlock({ result, item, className }) {
   ] });
 }
 
-export { ChoiceInteractionRenderer, ContentBlockRenderer, FeedbackMessage, HTMLContent, QTIRenderer, QtiFeedbackBlock };
+export { ChoiceInteractionRenderer, ContentBlockRenderer, FeedbackMessage, HTMLContent, QTIRenderer, QTIStimulusRenderer, QtiFeedbackBlock };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map