art-bd-ui 1.0.30 → 1.0.32

package/dist/cjs/_virtual/index.js

@@ -1,11 +1,7 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var index = require('../node_modules/use-sync-external-store/shim/index.js');
 
-var _commonjsHelpers = require('./_commonjsHelpers.js');
-var index = require('../node_modules/prop-types/index.js');
+var shimExports = index.__require();
 
-var propTypesExports = /*@__PURE__*/ index.__require();
-var PropTypes = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(propTypesExports);
-
-exports.default = PropTypes;
+exports.shimExports = shimExports;

package/dist/cjs/_virtual/index2.js

@@ -1,7 +1,11 @@
 'use strict';
 
-var index = require('../node_modules/use-sync-external-store/shim/index.js');
+Object.defineProperty(exports, '__esModule', { value: true });
 
-var shimExports = index.__require();
+var _commonjsHelpers = require('./_commonjsHelpers.js');
+var index = require('../node_modules/prop-types/index.js');
 
-exports.shimExports = shimExports;
+var propTypesExports = /*@__PURE__*/ index.__require();
+var PropTypes = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(propTypesExports);
+
+exports.default = PropTypes;

package/dist/cjs/_virtual/index3.js

@@ -1,11 +1,5 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var shim = {exports: {}};
 
-var _commonjsHelpers = require('./_commonjsHelpers.js');
-var index = require('../node_modules/attr-accept/dist/es/index.js');
-
-var esExports = index.__require();
-var _accepts = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(esExports);
-
-exports.default = _accepts;
+exports.__module = shim;

package/dist/cjs/_virtual/index4.js

@@ -1,5 +1,11 @@
 'use strict';
 
-var shim = {exports: {}};
+Object.defineProperty(exports, '__esModule', { value: true });
 
-exports.__module = shim;
+var _commonjsHelpers = require('./_commonjsHelpers.js');
+var index = require('../node_modules/attr-accept/dist/es/index.js');
+
+var esExports = index.__require();
+var _accepts = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(esExports);
+
+exports.default = _accepts;

package/dist/cjs/_virtual/index5.js

@@ -1,5 +1,11 @@
 'use strict';
 
-var propTypes = {exports: {}};
+Object.defineProperty(exports, '__esModule', { value: true });
 
-exports.__module = propTypes;
+var _commonjsHelpers = require('./_commonjsHelpers.js');
+var index = require('../node_modules/color-name/index.js');
+
+var colorNameExports = index.__require();
+var names = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(colorNameExports);
+
+exports.default = names;

package/dist/cjs/_virtual/index6.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _commonjsHelpers = require('./_commonjsHelpers.js');
-var index = require('../node_modules/color-name/index.js');
+var index$1 = require('../node_modules/color-convert/index.js');
 
-var colorNameExports = index.__require();
-var names = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(colorNameExports);
+var colorConvertExports = index$1.__require();
+var index = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(colorConvertExports);
 
-exports.default = names;
+exports.default = index;

package/dist/cjs/_virtual/index7.js

@@ -1,11 +1,5 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var propTypes = {exports: {}};
 
-var _commonjsHelpers = require('./_commonjsHelpers.js');
-var index$1 = require('../node_modules/color-convert/index.js');
-
-var colorConvertExports = index$1.__require();
-var index = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(colorConvertExports);
-
-exports.default = index;
+exports.__module = propTypes;

package/dist/cjs/_virtual/uniqueId.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _commonjsHelpers = require('./_commonjsHelpers.js');
+var uniqueId = require('../node_modules/lodash/uniqueId.js');
+
+var uniqueIdExports = uniqueId.__require();
+var uid = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(uniqueIdExports);
+
+exports.default = uid;

package/dist/cjs/components/forms/input-number/input-number.js

@@ -9,8 +9,8 @@ var stepButtons = require('./step-buttons.js');
 var useUpdateEffect = require('../../../hooks/use-update-effect.js');
 require('../../../_virtual/throttle.js');
 require('../../../_virtual/isEqual.js');
-var buttonGroup = require('../../buttons/button-group/button-group.js');
 var inputGroup = require('../input-group/input-group.js');
+var utils$1 = require('../../../lib/utils.js');
 
 const noop = () => { };
 const getFormatter = (decimalScale, locale) => new Intl.NumberFormat(locale, {
@@ -19,7 +19,7 @@ const getFormatter = (decimalScale, locale) => new Intl.NumberFormat(locale, {
     maximumFractionDigits: decimalScale,
 });
 const InputNumber = React.forwardRef((_a, ref) => {
-    var { value, onChange = noop, step = 1, min = -Infinity, max = Infinity, precision = 0, withControls = true, readOnly = false, disabled = false } = _a, rest = tslib_es6.__rest(_a, ["value", "onChange", "step", "min", "max", "precision", "withControls", "readOnly", "disabled"]);
+    var { value, onChange = noop, step = 1, min = -Infinity, max = Infinity, precision = 0, withControls = true, readOnly = false, disabled = false, className } = _a, rest = tslib_es6.__rest(_a, ["value", "onChange", "step", "min", "max", "precision", "withControls", "readOnly", "disabled", "className"]);
     // caret tracking
     const cursorPosition = React.useRef(0);
     const inputRef = React.useRef(null);
@@ -83,7 +83,7 @@ const InputNumber = React.forwardRef((_a, ref) => {
     // controls visibility and disabled state
     const disableUp = disabled || next(1) === utils.clamp(base, min, max);
     const disableDown = disabled || next(-1) === utils.clamp(base, min, max);
-    return (jsxRuntime.jsxs(buttonGroup.ButtonGroup, { groupGap: "none", children: [jsxRuntime.jsx(inputGroup.InputGroupInput, Object.assign({}, rest, { ref: inputRef, type: "text", inputMode: precision > 0 ? "decimal" : "numeric", pattern: "[0-9]*(\\.[0-9]+)?", readOnly: readOnly || false, disabled: disabled, value: display, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown })), withControls && (jsxRuntime.jsx(stepButtons.StepButtons, { onIncrease: stepUp, onDecrease: stepDown, disableUp: disableUp, disableDown: disableDown }))] }));
+    return (jsxRuntime.jsxs(inputGroup.InputGroup, { className: utils$1.cn("bg-background text-sm overflow-hidden", className), children: [jsxRuntime.jsx(inputGroup.InputGroupInput, Object.assign({}, rest, { ref: inputRef, type: "text", inputMode: precision > 0 ? "decimal" : "numeric", pattern: "[0-9]*(\\\\.[0-9]+)?", readOnly: readOnly || false, disabled: disabled, value: display, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown })), withControls && (jsxRuntime.jsx(stepButtons.StepButtons, { onIncrease: stepUp, onDecrease: stepDown, disableUp: disableUp, disableDown: disableDown }))] }));
 });
 InputNumber.displayName = "InputNumber";
 

package/dist/cjs/components/forms/input-number/step-buttons.js

@@ -11,7 +11,7 @@ var utils = require('../../../lib/utils.js');
 
 const StepButton = ({ direction, disabled = false, onClick }) => (jsxRuntime.jsx(button.Button, { variant: "ghost", tabIndex: -1, "aria-hidden": true, className: utils.cn("flex items-center justify-center w-8 h-1/2 p-0 rounded-l-none hover:bg-accent cursor-pointer", disabled && "opacity-40 cursor-not-allowed"), onClick: disabled ? undefined : onClick, children: jsxRuntime.jsx(icon.Icon, { name: direction === "down" ? "chevron-down" : "chevron-up", size: 16 }) }));
 StepButton.displayName = "StepButton";
-const StepButtons = ({ onIncrease, onDecrease, disableUp, disableDown }) => (jsxRuntime.jsxs(buttonGroup.ButtonGroup, { orientation: "vertical", className: "select-none border rounded-md", children: [jsxRuntime.jsx(StepButton, { direction: "up", disabled: disableUp, onClick: onIncrease }), jsxRuntime.jsx(buttonGroup.ButtonGroupSeparator, { orientation: "horizontal" }), jsxRuntime.jsx(StepButton, { direction: "down", disabled: disableDown, onClick: onDecrease })] }));
+const StepButtons = ({ onIncrease, onDecrease, disableUp, disableDown, className }) => (jsxRuntime.jsxs(buttonGroup.ButtonGroup, { orientation: "vertical", className: utils.cn("h-full shrink-0 p-0 select-none rounded-none border-0 border-l border-input", className), children: [jsxRuntime.jsx(StepButton, { direction: "up", disabled: disableUp, onClick: onIncrease }), jsxRuntime.jsx(buttonGroup.ButtonGroupSeparator, { orientation: "horizontal" }), jsxRuntime.jsx(StepButton, { direction: "down", disabled: disableDown, onClick: onDecrease })] }));
 StepButtons.displayName = "StepButtons";
 
 exports.StepButtons = StepButtons;

package/dist/cjs/components/forms/select/select.js

@@ -45,16 +45,20 @@ const SelectScrollDownButton = (_a) => {
 };
 SelectScrollDownButton.displayName = "SelectScrollDownButton";
 const SelectContent = (_a) => {
-    var { className, children, position = "popper" } = _a, props = tslib_es6.__rest(_a, ["className", "children", "position"]);
-    return (jsxRuntime.jsx(index.Portal, { children: jsxRuntime.jsxs(index.Content, Object.assign({ "data-slot": "select-content", className: utils.cn([
-                "overlay-appearance-animation",
-                "overlay-zoom-animation",
-                "overlay-slide-animation",
-                "max-h-(--radix-select-content-available-height)",
-                "origin-(--radix-select-content-transform-origin)",
-            ], "relative z-50 min-w-[8rem] bg-popover text-popover-foreground overflow-x-hidden overflow-y-auto rounded-md border shadow-md", position === "popper" &&
-                "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className), position: position }, props, { children: [jsxRuntime.jsx(SelectScrollUpButton, {}), jsxRuntime.jsx(index.Viewport, { className: utils.cn("p-1", position === "popper" &&
-                        "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"), children: children }), jsxRuntime.jsx(SelectScrollDownButton, {})] })) }));
+    var { className, children, position = "popper", portal = true, portalContainer } = _a, props = tslib_es6.__rest(_a, ["className", "children", "position", "portal", "portalContainer"]);
+    const content = (jsxRuntime.jsxs(index.Content, Object.assign({ "data-slot": "select-content", className: utils.cn([
+            "overlay-appearance-animation",
+            "overlay-zoom-animation",
+            "overlay-slide-animation",
+            "max-h-(--radix-select-content-available-height)",
+            "origin-(--radix-select-content-transform-origin)",
+        ], "relative z-50 min-w-[8rem] bg-popover text-popover-foreground overflow-x-hidden overflow-y-auto rounded-md border shadow-md", position === "popper" &&
+            "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className), position: position }, props, { children: [jsxRuntime.jsx(SelectScrollUpButton, {}), jsxRuntime.jsx(index.Viewport, { className: utils.cn("p-1", position === "popper" &&
+                    "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"), children: children }), jsxRuntime.jsx(SelectScrollDownButton, {})] })));
+    if (!portal) {
+        return content;
+    }
+    return jsxRuntime.jsx(index.Portal, { container: portalContainer, children: content });
 };
 SelectContent.displayName = "SelectContent";
 const SelectLabel = (_a) => {

package/dist/cjs/components/quiz/builder/components/question-card/question-card.js

@@ -0,0 +1,44 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var questionTypeOptions = require('../../question-type-options.js');
+var choiceTaskEditor = require('../../editors/choice-task-editor.js');
+var openAnswerTaskEditor = require('../../editors/open-answer-task-editor.js');
+var matchPairsTaskEditor = require('../../editors/match-pairs-task-editor.js');
+var fillInBlankTaskEditor = require('../../editors/fill-in-blank-task-editor.js');
+var sequenceTaskEditor = require('../../editors/sequence-task-editor.js');
+var codeTaskEditor = require('../../editors/code-task-editor.js');
+var questionPromptEditor = require('../question-prompt-editor/question-prompt-editor.js');
+var card = require('../../../../ui/card/card.js');
+var button = require('../../../../buttons/button/button.js');
+var label = require('../../../../forms/label/label.js');
+var select = require('../../../../forms/select/select.js');
+var dropdownMenu = require('../../../../ui/dropdown-menu/dropdown-menu.js');
+require('../../../../forms/checkbox/checkbox.js');
+require('../../../../forms/dropzone/dropzone.js');
+require('../../../../../node_modules/tslib/tslib.es6.js');
+require('react');
+require('../../../../utility/separator/separator.js');
+require('../../../../forms/file-upload/file-upload.js');
+require('../../../../forms/form/form.js');
+require('../../../../forms/input/input.js');
+require('../../../../forms/textarea/textarea.js');
+var inputNumber = require('../../../../forms/input-number/input-number.js');
+require('../../../../forms/radio/radio.js');
+require('../../../../forms/switch/switch.js');
+var icon = require('../../../../media/icon/icon.js');
+var ellipsis = require('../../../../../node_modules/lucide-react/dist/esm/icons/ellipsis.js');
+var copy = require('../../../../../node_modules/lucide-react/dist/esm/icons/copy.js');
+var trash2 = require('../../../../../node_modules/lucide-react/dist/esm/icons/trash-2.js');
+
+const QuestionCard = ({ index, question, onChange, onDelete, onDuplicate, onTypeChange }) => {
+    var _a, _b, _c, _d;
+    const updateSettings = (patch) => {
+        var _a;
+        onChange(Object.assign(Object.assign({}, question), { settings: Object.assign(Object.assign({}, ((_a = question.settings) !== null && _a !== void 0 ? _a : {})), patch) }));
+    };
+    return (jsxRuntime.jsxs(card.Card, { children: [jsxRuntime.jsxs(card.CardHeader, { className: "flex flex-row items-center justify-between space-y-0", children: [jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-3", children: [jsxRuntime.jsxs(card.CardTitle, { className: "text-base shrink-0", children: ["Question ", index + 1] }), jsxRuntime.jsxs(select.Select, { value: question.type, onValueChange: (v) => onTypeChange(v), children: [jsxRuntime.jsx(select.SelectTrigger, { className: "w-[200px]", children: jsxRuntime.jsx(select.SelectValue, { placeholder: "Type" }) }), jsxRuntime.jsx(select.SelectContent, { children: questionTypeOptions.QUESTION_TYPE_OPTIONS.map((option) => (jsxRuntime.jsx(select.SelectItem, { value: option.type, children: option.label }, option.type))) })] }), jsxRuntime.jsxs("div", { className: "relative w-[120px]", children: [jsxRuntime.jsx(label.Label, { htmlFor: `points_${question.id}`, className: "sr-only", children: "Points" }), jsxRuntime.jsx(inputNumber.InputNumber, { id: `points_${question.id}`, prefix: jsxRuntime.jsx(icon.Icon, { name: "trophy" }), min: 0, step: 1, className: "w-12", value: (_a = question.points) !== null && _a !== void 0 ? _a : 1, onChange: (newNumber) => onChange(Object.assign(Object.assign({}, question), { points: newNumber })) })] })] }), jsxRuntime.jsxs(dropdownMenu.DropdownMenu, { children: [jsxRuntime.jsx(dropdownMenu.DropdownMenuTrigger, { asChild: true, children: jsxRuntime.jsx(button.Button, { variant: "ghost", size: "icon", "aria-label": "Question menu", children: jsxRuntime.jsx(ellipsis.default, { className: "size-4" }) }) }), jsxRuntime.jsxs(dropdownMenu.DropdownMenuContent, { align: "end", className: "w-56", children: [jsxRuntime.jsx(dropdownMenu.DropdownMenuLabel, { children: "Settings" }), jsxRuntime.jsxs(dropdownMenu.DropdownMenuGroup, { children: [jsxRuntime.jsx(dropdownMenu.DropdownMenuCheckboxItem, { checked: !!((_b = question.settings) === null || _b === void 0 ? void 0 : _b.shuffleOptions), onCheckedChange: (checked) => updateSettings({ shuffleOptions: Boolean(checked) }), children: "Shuffle options" }), jsxRuntime.jsx(dropdownMenu.DropdownMenuCheckboxItem, { checked: (_d = (_c = question.settings) === null || _c === void 0 ? void 0 : _c.showFeedback) !== null && _d !== void 0 ? _d : true, onCheckedChange: (checked) => updateSettings({ showFeedback: Boolean(checked) }), children: "Show feedback" })] }), jsxRuntime.jsx(dropdownMenu.DropdownMenuSeparator, {}), jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem, { onClick: onDuplicate, children: [jsxRuntime.jsx(copy.default, { className: "mr-2 size-4" }), "Duplicate"] }), jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem, { className: "text-destructive", onClick: onDelete, children: [jsxRuntime.jsx(trash2.default, { className: "mr-2 size-4" }), "Delete"] })] })] })] }), jsxRuntime.jsxs(card.CardContent, { className: "space-y-4", children: [jsxRuntime.jsx(questionPromptEditor.QuestionPromptEditor, { questionId: question.id, value: question.prompt, onChange: (prompt) => onChange(Object.assign(Object.assign({}, question), { prompt })) }), (question.type === "single-choice" || question.type === "multi-choice") && (jsxRuntime.jsx(choiceTaskEditor.ChoiceTaskEditor, { mode: question.type === "single-choice" ? "single" : "multi", options: question.options, onChange: (opts) => onChange(Object.assign(Object.assign({}, question), { options: opts })) })), question.type === "open-answer" && (jsxRuntime.jsx(openAnswerTaskEditor.OpenAnswerTaskEditor, { question: question, onChange: (q) => onChange(q) })), question.type === "match-pairs" && (jsxRuntime.jsx(matchPairsTaskEditor.MatchPairsTaskEditor, { question: question, onChange: (q) => onChange(q) })), question.type === "fill-in-blank" && (jsxRuntime.jsx(fillInBlankTaskEditor.FillInBlankTaskEditor, { question: question, onChange: (q) => onChange(q) })), question.type === "sequence" && (jsxRuntime.jsx(sequenceTaskEditor.SequenceTaskEditor, { question: question, onChange: (q) => onChange(q) })), question.type === "code-task" && (jsxRuntime.jsx(codeTaskEditor.CodeTaskEditor, { question: question, onChange: (q) => onChange(q) }))] })] }));
+};
+
+exports.QuestionCard = QuestionCard;

package/dist/cjs/components/quiz/builder/components/question-prompt-editor/question-prompt-editor.js

@@ -0,0 +1,33 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var label = require('../../../../forms/label/label.js');
+var textarea = require('../../../../forms/textarea/textarea.js');
+var richEditor = require('../../../../ui/rich-editor/rich-editor.js');
+require('react');
+require('../../../../ui/rich-editor/extensions.js');
+require('../../../../ui/rich-editor/extensions/carousel/extension.js');
+require('../../../../ui/rich-editor/extensions/carousel/editor.js');
+require('../../../../ui/carousel/carousel.js');
+require('../../../../../node_modules/tslib/tslib.es6.js');
+require('../../../../forms/file-upload/file-upload.js');
+
+const PROMPT_TOOLBAR_ACTIONS = [
+    "history",
+    "heading",
+    "bold",
+    "italic",
+    "underline",
+    "strike",
+    "link",
+    "bulletList",
+    "orderedList",
+    "blockquote",
+    "clearFormatting",
+];
+const QuestionPromptEditor = ({ questionId, value, onChange, placeholder = "Type the question prompt…", mode = "rich", }) => {
+    return (jsxRuntime.jsxs("div", { className: "space-y-2", children: [jsxRuntime.jsx(label.Label, { htmlFor: mode === "plain" ? `prompt_${questionId}` : undefined, children: "Prompt" }), mode === "rich" ? (jsxRuntime.jsx(richEditor.RichEditor, { value: value, onChange: onChange, placeholder: placeholder, toolbarActions: [...PROMPT_TOOLBAR_ACTIONS], showBubbleMenu: false, showFooter: false, editorContentClassName: "min-h-[120px] py-3" })) : (jsxRuntime.jsx(textarea.Textarea, { id: `prompt_${questionId}`, placeholder: placeholder, value: value, onChange: (event) => onChange(event.target.value) }))] }));
+};
+
+exports.QuestionPromptEditor = QuestionPromptEditor;

package/dist/cjs/components/quiz/builder/components/questions-sidebar/questions-sidebar.js

@@ -0,0 +1,68 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core_esm = require('../../../../../node_modules/@dnd-kit/core/dist/core.esm.js');
+var sortable_esm = require('../../../../../node_modules/@dnd-kit/sortable/dist/sortable.esm.js');
+var utilities_esm = require('../../../../../node_modules/@dnd-kit/utilities/dist/utilities.esm.js');
+var modifiers_esm = require('../../../../../node_modules/@dnd-kit/modifiers/dist/modifiers.esm.js');
+var utils = require('../../../../../lib/utils.js');
+var gripVertical = require('../../../../../node_modules/lucide-react/dist/esm/icons/grip-vertical.js');
+
+function _interopNamespaceDefault(e) {
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n.default = e;
+    return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+const QuestionsSidebar = ({ items, onReorder, onJump, activeId }) => {
+    const sensors = core_esm.useSensors(core_esm.useSensor(core_esm.PointerSensor, { activationConstraint: { distance: 6 } }));
+    const [dragging, setDragging] = React__namespace.useState(false);
+    const scrollRef = React__namespace.useRef(null);
+    const onDragEnd = (e) => {
+        setDragging(false);
+        const { active, over } = e;
+        if (!over || active.id === over.id)
+            return;
+        const oldIndex = items.findIndex((x) => x.id === active.id);
+        const newIndex = items.findIndex((x) => x.id === over.id);
+        if (oldIndex < 0 || newIndex < 0)
+            return;
+        const next = sortable_esm.arrayMove(items, oldIndex, newIndex);
+        onReorder(next.map((n) => n.id), active.id);
+    };
+    return (jsxRuntime.jsxs("div", { className: "rounded-lg border bg-card", children: [jsxRuntime.jsx("div", { className: "px-3 pt-2 text-sm font-medium", children: "Questions" }), jsxRuntime.jsx("div", { ref: scrollRef, className: utils.cn("px-2 py-2", "overflow-y-auto overscroll-contain", 
+                // prevent text selection + touch scrolling glitches while dragging
+                dragging ? "select-none touch-none" : ""), 
+                // Block wheel scroll from propagating to the page while dragging
+                onWheelCapture: (e) => {
+                    if (dragging)
+                        e.stopPropagation();
+                }, children: jsxRuntime.jsx(core_esm.DndContext, { sensors: sensors, collisionDetection: core_esm.closestCenter, 
+                    // Keep dnd constrained to this scroll container
+                    modifiers: [modifiers_esm.restrictToVerticalAxis, modifiers_esm.restrictToFirstScrollableAncestor], onDragStart: () => setDragging(true), onDragCancel: () => setDragging(false), onDragEnd: onDragEnd, autoScroll: false, children: jsxRuntime.jsx(sortable_esm.SortableContext, { items: items.map((x) => x.id), strategy: sortable_esm.verticalListSortingStrategy, children: jsxRuntime.jsx("ul", { className: "space-y-1", children: items.map((it, idx) => (jsxRuntime.jsx(SidebarRow, { item: it, index: idx, onJump: () => {
+                                    console.log("onJump", it.id);
+                                    onJump(it.id);
+                                }, active: activeId === it.id }, it.id))) }) }) }) })] }));
+};
+const SidebarRow = ({ item, index, onJump, active }) => {
+    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = sortable_esm.useSortable({ id: item.id });
+    const style = { transform: utilities_esm.CSS.Transform.toString(transform), transition };
+    return (jsxRuntime.jsxs("li", { ref: setNodeRef, style: style, className: utils.cn("flex items-center gap-2 rounded-md border px-2 py-1 text-sm bg-background", "focus-within:ring-2 focus-within:ring-primary", active && "ring-2 ring-primary", isDragging && "opacity-70"), children: [jsxRuntime.jsx("button", Object.assign({ className: "p-1 rounded-md border bg-background hover:bg-accent", "aria-label": "Drag to reorder" }, attributes, listeners, { children: jsxRuntime.jsx(gripVertical.default, { className: "size-4 opacity-70" }) })), jsxRuntime.jsx("button", { type: "button", onClick: onJump, className: "flex-1 text-left truncate hover:underline", title: item.label || `Question ${index + 1}`, children: item.label || `Question ${index + 1}` }), jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: item.type })] }));
+};
+
+exports.QuestionsSidebar = QuestionsSidebar;

package/dist/cjs/components/quiz/builder/components/quiz-settings/quiz-settings.js

@@ -0,0 +1,34 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var card = require('../../../../ui/card/card.js');
+var label = require('../../../../forms/label/label.js');
+var input = require('../../../../forms/input/input.js');
+var _switch = require('../../../../forms/switch/switch.js');
+var utils = require('../../../../../lib/utils.js');
+
+const QuizSettingsPanel = ({ value, onChange, className }) => {
+    var _a, _b, _c, _d, _e;
+    const set = (patch) => onChange(Object.assign(Object.assign({}, value), patch));
+    return (jsxRuntime.jsxs(card.Card, { className: utils.cn(
+        // Compact look & feel
+        "p-3 md:p-3 rounded-lg border bg-card", className), children: [jsxRuntime.jsx("div", { className: "text-xs font-medium text-muted-foreground mb-2", children: "Quiz settings" }), jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-2 md:flex md:items-center md:gap-4", children: [jsxRuntime.jsx(ToggleItem, { id: "shuffle", label: "Shuffle questions", checked: !!value.shuffleQuestions, onCheckedChange: (v) => set({ shuffleQuestions: v }) }), jsxRuntime.jsx(ToggleItem, { id: "sequential", label: "Sequential mode", checked: !!value.sequentialMode, onCheckedChange: (v) => set({ sequentialMode: v }) }), jsxRuntime.jsx(ToggleItem, { id: "breakdown", label: "Show breakdown", checked: (_a = value.showResultBreakdown) !== null && _a !== void 0 ? _a : true, onCheckedChange: (v) => set({ showResultBreakdown: v }) })] }), jsxRuntime.jsxs("div", { className: "mt-2 grid grid-cols-2 md:grid-cols-4 gap-2", children: [jsxRuntime.jsx(Num, { id: "failfast", miniLabel: "Incorrect streak", value: (_b = value.failFastIncorrectStreak) !== null && _b !== void 0 ? _b : 0, min: 0, step: 1, onChange: (n) => set({ failFastIncorrectStreak: Math.max(0, n) }) }), jsxRuntime.jsx(Num, { id: "attempts", miniLabel: "Attempts", value: (_c = value.attemptsAllowed) !== null && _c !== void 0 ? _c : 0, min: 0, step: 1, suffix: value.attemptsAllowed === 0 ? "∞" : undefined, onChange: (n) => set({ attemptsAllowed: Math.max(0, n) }) }), jsxRuntime.jsx(Num, { id: "timelimit", miniLabel: "Total time", value: (_d = value.timeLimitSeconds) !== null && _d !== void 0 ? _d : 0, min: 0, step: 30, suffix: "sec", onChange: (n) => set({ timeLimitSeconds: Math.max(0, n) }) }), jsxRuntime.jsx(Num, { id: "perquestion", miniLabel: "Per question", value: (_e = value.perQuestionDefaultSeconds) !== null && _e !== void 0 ? _e : 0, min: 0, step: 10, suffix: "sec", onChange: (n) => set({ perQuestionDefaultSeconds: Math.max(0, n) }) })] })] }));
+};
+/* ——— UI bits —————————————————————————————— */
+const ToggleItem = ({ id, label, checked, onCheckedChange }) => {
+    return (jsxRuntime.jsxs("label", { htmlFor: id, className: utils.cn("group inline-flex items-center justify-between gap-2", "rounded-md border px-2 py-1.5 bg-background hover:bg-accent/50", "cursor-pointer select-none"), children: [jsxRuntime.jsx("span", { className: "text-xs md:text-sm", children: label }), jsxRuntime.jsx(_switch.Switch, { id: id, checked: checked, onCheckedChange: onCheckedChange })] }));
+};
+const Num = ({ id, miniLabel, value, min = 0, step = 1, suffix, onChange }) => {
+    return (jsxRuntime.jsxs("div", { className: "space-y-1", children: [jsxRuntime.jsx(label.Label, { htmlFor: id, className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: miniLabel }), jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsx(input.Input, { id: id, type: "number", inputMode: "numeric", min: min, step: step, className: utils.cn("h-8 pr-12", // reserve space for suffix chip
+                        "text-sm"), value: Number.isFinite(value) ? value : 0, onChange: (e) => onChange(safeNum(e.currentTarget.value, min)), "aria-label": miniLabel }), suffix && (jsxRuntime.jsx("span", { className: utils.cn("pointer-events-none absolute right-1 top-1/2 -translate-y-1/2", "rounded-md border px-1.5 py-0.5 text-[10px] text-muted-foreground bg-background"), children: suffix }))] })] }));
+};
+/* ——— utils —————————————————————————————— */
+function safeNum(v, min = 0) {
+    const n = Number(v);
+    if (Number.isNaN(n))
+        return min;
+    return n;
+}
+
+exports.QuizSettingsPanel = QuizSettingsPanel;

package/dist/cjs/components/quiz/builder/components/use-scroll-spy.js

@@ -0,0 +1,109 @@
+"use client";
+'use strict';
+
+var React = require('react');
+
+function _interopNamespaceDefault(e) {
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n.default = e;
+    return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+function useScrollSpy(ids) {
+    const [activeId, setActiveId] = React__namespace.useState(null);
+    const observerRef = React__namespace.useRef(null);
+    React__namespace.useEffect(() => {
+        // Clean up previous observer
+        if (observerRef.current) {
+            observerRef.current.disconnect();
+        }
+        // Get all elements
+        const elements = ids.map((id) => document.querySelector(`[data-spy-id="${id}"]`)).filter((el) => el !== null);
+        if (elements.length === 0) {
+            setActiveId(null);
+            return;
+        }
+        // Store visibility state for all elements
+        const visibilityMap = new Map();
+        const updateActiveElement = () => {
+            // Check if we're near the bottom of the page
+            const scrollableHeight = document.documentElement.scrollHeight - window.innerHeight;
+            const currentScroll = window.scrollY;
+            const isNearBottom = scrollableHeight - currentScroll < 100;
+            // If near bottom, always activate the last element
+            if (isNearBottom && elements.length > 0) {
+                const lastElement = elements[elements.length - 1];
+                const lastId = lastElement.dataset.spyId;
+                if (lastId) {
+                    setActiveId(lastId);
+                    return;
+                }
+            }
+            // Get all visible entries with their ratios
+            const visibleEntries = Array.from(visibilityMap.entries())
+                .filter(([_, ratio]) => ratio > 0)
+                .map(([element, ratio]) => ({
+                element,
+                id: element.dataset.spyId,
+                ratio,
+            }));
+            if (visibleEntries.length === 0) {
+                return;
+            }
+            // Simply find the element with the highest intersection ratio
+            // This means the element with the most content visible on screen
+            const winner = visibleEntries.reduce((max, current) => (current.ratio > max.ratio ? current : max));
+            setActiveId(winner.id);
+        };
+        // Create observer with zero margins - pure visibility tracking
+        observerRef.current = new IntersectionObserver((entries) => {
+            // Update visibility map with current ratios
+            entries.forEach((entry) => {
+                if (entry.isIntersecting && entry.intersectionRatio > 0) {
+                    visibilityMap.set(entry.target, entry.intersectionRatio);
+                }
+                else {
+                    visibilityMap.delete(entry.target);
+                }
+            });
+            // Find which element has the most content visible
+            updateActiveElement();
+        }, {
+            // Zero margins - just track what's actually visible
+            rootMargin: "0px",
+            // Fine-grained thresholds for accurate ratio tracking
+            threshold: [0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1.0],
+        });
+        // Observe all elements
+        elements.forEach((el) => observerRef.current.observe(el));
+        // Add scroll listener to detect bottom
+        const handleScroll = () => {
+            updateActiveElement();
+        };
+        window.addEventListener("scroll", handleScroll, { passive: true });
+        // Cleanup
+        return () => {
+            if (observerRef.current) {
+                observerRef.current.disconnect();
+            }
+            window.removeEventListener("scroll", handleScroll);
+            visibilityMap.clear();
+        };
+    }, [ids.join(",")]);
+    return activeId;
+}
+
+exports.useScrollSpy = useScrollSpy;