@pie-lib/config-ui 0.1.0

package/dist/_virtual/_rolldown/runtime.js

@@ -0,0 +1,11 @@
+//#region \0rolldown/runtime.js
+var e = Object.defineProperty, t = (t, n) => {
+	let r = {};
+	for (var i in t) e(r, i, {
+		get: t[i],
+		enumerable: !0
+	});
+	return n || e(r, Symbol.toStringTag, { value: "Module" }), r;
+};
+//#endregion
+export { t as __exportAll };

package/dist/alert-dialog.d.ts

@@ -0,0 +1,44 @@
+/**
+ * @synced-from pie-lib/packages/config-ui/src/alert-dialog.jsx
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import PropTypes from 'prop-types';
+declare const AlertDialog: {
+    ({ text, title, onClose, onConfirm, open, onCloseText, onConfirmText, disableAutoFocus, disableEnforceFocus, disableRestoreFocus, }: {
+        text: any;
+        title: any;
+        onClose: any;
+        onConfirm: any;
+        open: any;
+        onCloseText: any;
+        onConfirmText: any;
+        disableAutoFocus: any;
+        disableEnforceFocus: any;
+        disableRestoreFocus: any;
+    }): JSX.Element;
+    defaultProps: {
+        onCloseText: string;
+        onConfirmText: string;
+        disableAutoFocus: boolean;
+        disableEnforceFocus: boolean;
+        disableRestoreFocus: boolean;
+    };
+    propTypes: {
+        text: PropTypes.Requireable<NonNullable<string | object | null | undefined>>;
+        title: PropTypes.Requireable<string>;
+        onClose: PropTypes.Requireable<(...args: any[]) => any>;
+        onConfirm: PropTypes.Requireable<(...args: any[]) => any>;
+        open: PropTypes.Requireable<boolean>;
+        onConfirmText: PropTypes.Requireable<string>;
+        onCloseText: PropTypes.Requireable<string>;
+        disableAutoFocus: PropTypes.Requireable<boolean>;
+        disableEnforceFocus: PropTypes.Requireable<boolean>;
+        disableRestoreFocus: PropTypes.Requireable<boolean>;
+    };
+};
+export default AlertDialog;
+//# sourceMappingURL=alert-dialog.d.ts.map

package/dist/alert-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../src/alert-dialog.tsx"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAGH,OAAO,SAAS,MAAM,YAAY,CAAC;AAYnC,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsChB,CAAC;AAuBF,eAAe,WAAW,CAAC"}

package/dist/alert-dialog.js

@@ -0,0 +1,47 @@
+import "react";
+import e from "prop-types";
+import { Button as t, Dialog as n, DialogActions as r, DialogContent as i, DialogContentText as a, DialogTitle as o } from "@mui/material";
+import { styled as s } from "@mui/material/styles";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/alert-dialog.tsx
+var u = s(o)(() => ({ fontSize: "max(1.25rem, 18px)" })), d = s(a)(() => ({ fontSize: "max(1rem, 14px)" })), f = ({ text: e, title: a, onClose: o, onConfirm: s, open: f, onCloseText: p, onConfirmText: m, disableAutoFocus: h, disableEnforceFocus: g, disableRestoreFocus: _ }) => /* @__PURE__ */ l(n, {
+	open: f,
+	disableAutoFocus: h,
+	disableEnforceFocus: g,
+	disableRestoreFocus: _,
+	onClose: o,
+	children: [
+		a && /* @__PURE__ */ c(u, { children: a }),
+		e && /* @__PURE__ */ c(i, { children: /* @__PURE__ */ c(d, { children: e }) }),
+		/* @__PURE__ */ l(r, { children: [o && /* @__PURE__ */ c(t, {
+			onClick: o,
+			color: "primary",
+			children: p
+		}), s && /* @__PURE__ */ c(t, {
+			autoFocus: !0,
+			onClick: s,
+			color: "primary",
+			children: m
+		})] })
+	]
+});
+f.defaultProps = {
+	onCloseText: "CANCEL",
+	onConfirmText: "OK",
+	disableAutoFocus: !1,
+	disableEnforceFocus: !1,
+	disableRestoreFocus: !1
+}, f.propTypes = {
+	text: e.oneOfType([e.string, e.object]),
+	title: e.string,
+	onClose: e.func,
+	onConfirm: e.func,
+	open: e.bool,
+	onConfirmText: e.string,
+	onCloseText: e.string,
+	disableAutoFocus: e.bool,
+	disableEnforceFocus: e.bool,
+	disableRestoreFocus: e.bool
+};
+//#endregion
+export { f as default };

package/dist/checkbox.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @synced-from pie-lib/packages/config-ui/src/checkbox.jsx
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import PropTypes from 'prop-types';
+declare const Checkbox: {
+    ({ mini, checked, onChange, value, label, error }: {
+        mini: any;
+        checked: any;
+        onChange: any;
+        value: any;
+        label: any;
+        error: any;
+    }): JSX.Element;
+    propTypes: {
+        mini: PropTypes.Requireable<boolean>;
+        checked: PropTypes.Validator<boolean>;
+        onChange: PropTypes.Validator<(...args: any[]) => any>;
+        value: PropTypes.Requireable<string>;
+        label: PropTypes.Validator<string>;
+        error: PropTypes.Requireable<boolean>;
+    };
+    defaultProps: {
+        value: string;
+        mini: boolean;
+        error: boolean;
+    };
+};
+export default Checkbox;
+//# sourceMappingURL=checkbox.d.ts.map

package/dist/checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../src/checkbox.tsx"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAIH,OAAO,SAAS,MAAM,YAAY,CAAC;AAmCnC,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;CAMb,CAAC;AAiBF,eAAe,QAAQ,CAAC"}

package/dist/checkbox.js

@@ -0,0 +1,57 @@
+import "react";
+import e from "prop-types";
+import { styled as t } from "@mui/material/styles";
+import { jsx as n } from "react/jsx-runtime";
+import { color as r } from "@pie-lib/render-ui";
+import i from "@mui/material/FormControlLabel";
+import a from "@mui/material/Checkbox";
+import { grey as o } from "@mui/material/colors";
+//#region src/checkbox.tsx
+var s = t(i)(({ theme: e, mini: t }) => ({
+	margin: 0,
+	marginLeft: 0,
+	padding: 0,
+	"& .MuiFormControlLabel-label": {
+		fontSize: e.typography.fontSize - 1,
+		transform: "translate(-4%, 2%)",
+		color: "rgba(0,0,0,1.0)",
+		...t && {
+			marginLeft: e.spacing(1),
+			color: o[700],
+			fontSize: e.typography.fontSize - 3
+		}
+	}
+})), c = t(a)(({ theme: e, mini: t, error: n }) => ({
+	color: `${r.tertiary()} !important`,
+	...t && {
+		margin: 0,
+		padding: 0,
+		width: e.spacing(3),
+		height: e.spacing(3)
+	},
+	...n && { color: `${e.palette.error.main} !important` }
+})), l = ({ mini: e, checked: t, onChange: r, value: i, label: a, error: o }) => /* @__PURE__ */ n(s, {
+	mini: e,
+	control: /* @__PURE__ */ n(c, {
+		checked: t,
+		onChange: r,
+		value: i,
+		mini: e,
+		error: o
+	}),
+	label: a
+});
+l.propTypes = {
+	mini: e.bool,
+	checked: e.bool.isRequired,
+	onChange: e.func.isRequired,
+	value: e.string,
+	label: e.string.isRequired,
+	error: e.bool
+}, l.defaultProps = {
+	value: "",
+	mini: !1,
+	error: !1
+};
+//#endregion
+export { l as default };

package/dist/choice-configuration/feedback-menu.d.ts

@@ -0,0 +1,33 @@
+/**
+ * @synced-from pie-lib/packages/config-ui/src/choice-configuration/feedback-menu.jsx
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import PropTypes from 'prop-types';
+import React from 'react';
+export declare class IconMenu extends React.Component {
+    static propTypes: {
+        opts: PropTypes.Requireable<object>;
+        onClick: PropTypes.Validator<(...args: any[]) => any>;
+        iconButtonElement: PropTypes.Requireable<any>;
+    };
+    constructor(props: any);
+    handleClick: any;
+    handleRequestClose: any;
+    render(): JSX.Element;
+}
+export default class FeedbackMenu extends React.Component {
+    static propTypes: {
+        value: PropTypes.Requireable<object>;
+        onChange: PropTypes.Validator<(...args: any[]) => any>;
+        classes: PropTypes.Validator<object>;
+    };
+    static defaultProps: {
+        classes: {};
+    };
+    render(): JSX.Element;
+}
+//# sourceMappingURL=feedback-menu.d.ts.map

package/dist/choice-configuration/feedback-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"feedback-menu.d.ts","sourceRoot":"","sources":["../../src/choice-configuration/feedback-menu.tsx"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAkCH,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,qBAAa,QAAS,SAAQ,KAAK,CAAC,SAAS;IAC3C,MAAM,CAAC,SAAS;;;;MAId;gBAEU,KAAK,KAAA;IAQjB,WAAW,EAAE,GAAG,CAEd;IAEF,kBAAkB,EAAE,GAAG,CAErB;IAEF,MAAM;CA4BP;AAED,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,KAAK,CAAC,SAAS;IACvD,MAAM,CAAC,SAAS;;;;MAId;IAEF,MAAM,CAAC,YAAY;;MAEjB;IAEF,MAAM;CAwBP"}

package/dist/choice-configuration/feedback-menu.js

@@ -0,0 +1,85 @@
+import e from "react";
+import t from "prop-types";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import * as i from "@pie-lib/render-ui";
+import { InlineMenu as a } from "@pie-lib/render-ui";
+import o from "@mui/material/MenuItem";
+import s from "@mui/material/IconButton";
+import c from "@mui/icons-material/Feedback";
+//#region src/choice-configuration/feedback-menu.tsx
+function l(e) {
+	return typeof e == "function" || typeof e == "object" && !!e && typeof e.$$typeof == "symbol";
+}
+function u(e, t) {
+	return !e || l(e) ? e : l(e.default) ? e.default : t && l(e[t]) ? e[t] : t && l(e[t]?.default) ? e[t].default : e;
+}
+var d = u(a, "InlineMenu") || u(m.InlineMenu, "InlineMenu"), f = i, p = f.default, m = p && typeof p == "object" ? p : f, h = class extends e.Component {
+	static propTypes = {
+		opts: t.object,
+		onClick: t.func.isRequired,
+		iconButtonElement: t.any
+	};
+	constructor(e) {
+		super(e), this.state = {
+			anchorEl: void 0,
+			open: !1
+		};
+	}
+	handleClick = (e) => {
+		this.setState({
+			open: !0,
+			anchorEl: e.currentTarget
+		});
+	};
+	handleRequestClose = () => {
+		this.setState({ open: !1 });
+	};
+	render() {
+		let { opts: e, onClick: t } = this.props, i = Object.keys(e), a = (e) => () => {
+			t(e), this.handleRequestClose();
+		};
+		return /* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("div", {
+			onClick: this.handleClick,
+			children: this.props.iconButtonElement
+		}), /* @__PURE__ */ n(d, {
+			id: "simple-menu",
+			anchorEl: this.state.anchorEl,
+			open: this.state.open,
+			onClose: this.handleRequestClose,
+			transitionDuration: {
+				enter: 225,
+				exit: 195
+			},
+			children: i.map((t, r) => /* @__PURE__ */ n(o, {
+				onClick: a(t),
+				children: e[t]
+			}, r))
+		})] });
+	}
+}, g = class extends e.Component {
+	static propTypes = {
+		value: t.object,
+		onChange: t.func.isRequired,
+		classes: t.object.isRequired
+	};
+	static defaultProps = { classes: {} };
+	render() {
+		let { value: e, onChange: t, classes: r } = this.props, i = e && e.type, a = i === "custom" || i === "default" ? "primary" : "disabled", o = i === "custom" ? "Custom Feedback" : i === "default" ? "Default Feedback" : "Feedback disabled";
+		return /* @__PURE__ */ n(h, {
+			iconButtonElement: /* @__PURE__ */ n(s, {
+				className: r.icon,
+				"aria-label": o,
+				size: "large",
+				children: /* @__PURE__ */ n(c, { color: a })
+			}),
+			onClick: (e) => t(e),
+			opts: {
+				none: "No Feedback",
+				default: "Default",
+				custom: "Custom"
+			}
+		});
+	}
+};
+//#endregion
+export { g as default };

package/dist/choice-configuration/index.d.ts

@@ -0,0 +1,63 @@
+/**
+ * @synced-from pie-lib/packages/config-ui/src/choice-configuration/index.jsx
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import React from 'react';
+import PropTypes from 'prop-types';
+export declare class ChoiceConfiguration extends React.Component {
+    static propTypes: {
+        noLabels: PropTypes.Requireable<boolean>;
+        useLetterOrdering: PropTypes.Requireable<boolean>;
+        className: PropTypes.Requireable<string>;
+        error: PropTypes.Requireable<string>;
+        mode: PropTypes.Requireable<string>;
+        defaultFeedback: PropTypes.Validator<object>;
+        disabled: PropTypes.Requireable<boolean>;
+        nonEmpty: PropTypes.Requireable<boolean>;
+        data: PropTypes.Requireable<PropTypes.InferProps<{
+            label: PropTypes.Validator<string>;
+            value: PropTypes.Validator<string>;
+            correct: PropTypes.Requireable<boolean>;
+            feedback: PropTypes.Requireable<PropTypes.InferProps<{
+                type: PropTypes.Requireable<string>;
+                value: PropTypes.Requireable<string>;
+            }>>;
+        }>>;
+        onDelete: PropTypes.Requireable<(...args: any[]) => any>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        index: PropTypes.Requireable<number>;
+        imageSupport: PropTypes.Requireable<PropTypes.InferProps<{
+            add: PropTypes.Validator<(...args: any[]) => any>;
+            delete: PropTypes.Validator<(...args: any[]) => any>;
+        }>>;
+        disableImageAlignmentButtons: PropTypes.Requireable<boolean>;
+        allowFeedBack: PropTypes.Requireable<boolean>;
+        allowDelete: PropTypes.Requireable<boolean>;
+        noCorrectAnswerError: PropTypes.Requireable<string>;
+        spellCheck: PropTypes.Requireable<boolean>;
+        pluginOpts: PropTypes.Requireable<object>;
+        toolbarOpts: PropTypes.Requireable<object>;
+        uploadSoundSupport: PropTypes.Requireable<object>;
+        maxImageWidth: PropTypes.Requireable<number>;
+        maxImageHeight: PropTypes.Requireable<number>;
+    };
+    static defaultProps: {
+        index: number;
+        noLabels: boolean;
+        useLetterOrdering: boolean;
+        allowFeedBack: boolean;
+        allowDelete: boolean;
+    };
+    _changeFn: (key: any) => (update: any) => void;
+    onLabelChange: (update: any) => void;
+    onCheckedChange: any;
+    onFeedbackValueChange: any;
+    onFeedbackTypeChange: any;
+    render(): JSX.Element;
+}
+export default ChoiceConfiguration;
+//# sourceMappingURL=index.d.ts.map

package/dist/choice-configuration/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/choice-configuration/index.tsx"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAqMnC,qBAAa,mBAAoB,SAAQ,KAAK,CAAC,SAAS;IACtD,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAmCd;IAEF,MAAM,CAAC,YAAY;;;;;;MAMjB;IAEF,SAAS,GAAI,QAAG,MAAM,WAAM,UAM1B;IAEF,aAAa,wBAA2B;IAExC,eAAe,EAAE,GAAG,CAOlB;IAEF,qBAAqB,EAAE,GAAG,CAUxB;IAEF,oBAAoB,EAAE,GAAG,CASvB;IAEF,MAAM;CAqGP;AAED,eAAe,mBAAmB,CAAC"}

package/dist/choice-configuration/index.js

@@ -0,0 +1,240 @@
+import { InputCheckbox as e, InputRadio as t } from "../inputs.js";
+import n from "./feedback-menu.js";
+import r from "react";
+import i from "prop-types";
+import { styled as a } from "@mui/material/styles";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import * as c from "@pie-lib/render-ui";
+import { InputContainer as l } from "@pie-lib/render-ui";
+import u from "@pie-lib/editable-html-tip-tap";
+import d from "@mui/material/IconButton";
+import f from "@mui/material/TextField";
+import p from "@mui/icons-material/Delete";
+import m from "@mui/icons-material/SubdirectoryArrowRight";
+//#region src/choice-configuration/index.tsx
+function h(e) {
+	return typeof e == "function" || typeof e == "object" && !!e && typeof e.$$typeof == "symbol";
+}
+function g(e, t) {
+	return !e || h(e) ? e : h(e.default) ? e.default : t && h(e[t]) ? e[t] : t && h(e[t]?.default) ? e[t].default : e;
+}
+var _ = g(l, "InputContainer") || g(b.InputContainer, "InputContainer"), v = c, y = v.default, b = y && typeof y == "object" ? y : v, x = u, S = a("div")(({ theme: e }) => ({ marginTop: e.spacing(2) })), C = ({ label: e, onChange: t, value: n, className: r, imageSupport: i, disableImageAlignmentButtons: a, disabled: s, spellCheck: c, nonEmpty: l, pluginOpts: u, toolbarOpts: d, error: f, maxImageWidth: p, maxImageHeight: m, uploadSoundSupport: h, mathMlOptions: g = {} }) => /* @__PURE__ */ o(_, {
+	label: e,
+	className: r,
+	children: /* @__PURE__ */ o(S, { children: /* @__PURE__ */ o(x, {
+		markup: n || "",
+		disabled: s,
+		spellCheck: c,
+		nonEmpty: l,
+		onChange: t,
+		imageSupport: i,
+		disableImageAlignmentButtons: a,
+		pluginProps: u || {},
+		toolbarOpts: d,
+		error: f,
+		maxImageWidth: p,
+		maxImageHeight: m,
+		uploadSoundSupport: h,
+		languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
+		mathMlOptions: g
+	}) })
+}), w = a("div")(() => ({ position: "relative" })), T = a(m)(({ theme: e }) => ({
+	fill: e.palette.grey[400],
+	left: -56,
+	position: "absolute",
+	top: 40
+})), E = a(f)(({ theme: e }) => ({
+	width: "100%",
+	marginTop: e.spacing(2)
+})), D = a(C)(({ theme: e }) => ({
+	width: "100%",
+	marginTop: e.spacing(2)
+})), O = ({ value: e, onChange: t, type: n, correct: r, defaults: i, toolbarOpts: a, mathMlOptions: c = {} }) => !n || n === "none" ? null : n === "default" ? /* @__PURE__ */ s(w, { children: [/* @__PURE__ */ o(T, {}), /* @__PURE__ */ o(E, {
+	label: "Feedback Text",
+	value: r ? i.correct : i.incorrect,
+	variant: "standard"
+})] }) : /* @__PURE__ */ s(w, { children: [/* @__PURE__ */ o(T, {}), /* @__PURE__ */ o(D, {
+	label: "Feedback Text",
+	value: e,
+	onChange: t,
+	toolbarOpts: a,
+	mathMlOptions: c
+})] }), k = a("span")(({ theme: e }) => ({
+	paddingRight: e.spacing(1),
+	paddingTop: e.spacing(3)
+})), A = a("div")(() => ({
+	display: "flex",
+	alignItems: "center"
+})), j = a("div")(({ theme: e }) => ({
+	flex: "0 1 auto",
+	paddingTop: e.spacing(.5),
+	paddingBottom: 0,
+	marginRight: 0,
+	marginLeft: e.spacing(1)
+})), M = a("div")(({ theme: e }) => ({
+	flex: "0 1 auto",
+	paddingTop: e.spacing(2),
+	paddingLeft: 0,
+	marginLeft: 0,
+	marginRight: e.spacing(1)
+})), N = a("div")(() => ({
+	margin: 0,
+	width: "inherit"
+})), P = a("div")(() => ({
+	margin: 0,
+	width: "inherit"
+})), F = a("div")(({ theme: e }) => ({
+	flex: "0 1 auto",
+	paddingTop: e.spacing(2),
+	paddingLeft: 0,
+	marginLeft: 0
+})), I = a("div")(({ theme: e }) => ({
+	display: "flex",
+	flex: 1,
+	flexDirection: "column",
+	marginRight: e.spacing(1)
+})), L = a("div")(({ theme: e }) => ({
+	fontSize: e.typography.fontSize - 2,
+	color: e.palette.error.main
+})), R = class extends r.Component {
+	static propTypes = {
+		noLabels: i.bool,
+		useLetterOrdering: i.bool,
+		className: i.string,
+		error: i.string,
+		mode: i.oneOf(["checkbox", "radio"]),
+		defaultFeedback: i.object.isRequired,
+		disabled: i.bool,
+		nonEmpty: i.bool,
+		data: i.shape({
+			label: i.string.isRequired,
+			value: i.string.isRequired,
+			correct: i.bool,
+			feedback: i.shape({
+				type: i.string,
+				value: i.string
+			})
+		}),
+		onDelete: i.func,
+		onChange: i.func,
+		index: i.number,
+		imageSupport: i.shape({
+			add: i.func.isRequired,
+			delete: i.func.isRequired
+		}),
+		disableImageAlignmentButtons: i.bool,
+		allowFeedBack: i.bool,
+		allowDelete: i.bool,
+		noCorrectAnswerError: i.string,
+		spellCheck: i.bool,
+		pluginOpts: i.object,
+		toolbarOpts: i.object,
+		uploadSoundSupport: i.object,
+		maxImageWidth: i.number,
+		maxImageHeight: i.number
+	};
+	static defaultProps = {
+		index: -1,
+		noLabels: !1,
+		useLetterOrdering: !1,
+		allowFeedBack: !0,
+		allowDelete: !0
+	};
+	_changeFn = (e) => (t) => {
+		let { data: n, onChange: r } = this.props;
+		r && r({
+			...n,
+			[e]: t
+		});
+	};
+	onLabelChange = this._changeFn("label");
+	onCheckedChange = (e) => {
+		let t = e.target.checked, { data: n, onChange: r } = this.props;
+		r && r({
+			...n,
+			correct: t
+		});
+	};
+	onFeedbackValueChange = (e) => {
+		let { data: t, onChange: n } = this.props;
+		if (t.feedback.type !== "custom") return;
+		let r = {
+			...t.feedback,
+			value: e
+		};
+		n && n({
+			...t,
+			feedback: r
+		});
+	};
+	onFeedbackTypeChange = (e) => {
+		let { data: t, onChange: n } = this.props, r = {
+			...t.feedback,
+			type: e
+		};
+		r.type !== "custom" && (r.value = void 0), n && n({
+			...t,
+			feedback: r
+		});
+	};
+	render() {
+		let { data: r, mode: i, onDelete: a, defaultFeedback: c, index: l, className: u, noLabels: f, useLetterOrdering: m, imageSupport: h, disableImageAlignmentButtons: g, disabled: v, spellCheck: y, nonEmpty: b, allowFeedBack: x, allowDelete: S, pluginOpts: w, toolbarOpts: T, error: E, noCorrectAnswerError: D, uploadSoundSupport: R, maxImageWidth: z, maxImageHeight: B, mathMlOptions: V = {} } = this.props, H = i === "checkbox" ? e : t;
+		return /* @__PURE__ */ s(A, { children: [
+			l > 0 && /* @__PURE__ */ o(k, {
+				type: "title",
+				children: m ? String.fromCharCode(96 + l).toUpperCase() : l
+			}),
+			/* @__PURE__ */ o(j, { children: /* @__PURE__ */ o(H, {
+				onChange: this.onCheckedChange,
+				label: f ? "" : "Correct",
+				checked: !!r.correct,
+				error: D
+			}) }),
+			/* @__PURE__ */ s(I, { children: [
+				/* @__PURE__ */ o(C, {
+					label: f ? "" : "Label",
+					value: r.label,
+					onChange: this.onLabelChange,
+					imageSupport: h,
+					disableImageAlignmentButtons: g,
+					disabled: v,
+					spellCheck: y,
+					nonEmpty: b,
+					pluginOpts: w,
+					toolbarOpts: T,
+					error: E,
+					uploadSoundSupport: R,
+					mathMlOptions: V,
+					maxImageWidth: z,
+					maxImageHeight: B
+				}),
+				E && /* @__PURE__ */ o(L, { children: E }),
+				x && /* @__PURE__ */ o(O, {
+					...r.feedback,
+					correct: r.correct,
+					defaults: c,
+					onChange: this.onFeedbackValueChange,
+					toolbarOpts: T
+				})
+			] }),
+			x && /* @__PURE__ */ o(M, { children: /* @__PURE__ */ o(_, {
+				label: f ? "" : "Feedback",
+				children: /* @__PURE__ */ o(N, { children: /* @__PURE__ */ o(n, {
+					onChange: this.onFeedbackTypeChange,
+					value: r.feedback
+				}) })
+			}) }),
+			S && /* @__PURE__ */ o(F, { children: /* @__PURE__ */ o(_, {
+				label: f ? "" : "Delete",
+				children: /* @__PURE__ */ o(P, { children: /* @__PURE__ */ o(d, {
+					"aria-label": "delete",
+					onClick: a,
+					size: "large",
+					children: /* @__PURE__ */ o(p, {})
+				}) })
+			}) })
+		] });
+	}
+};
+//#endregion
+export { R as default };

package/dist/choice-utils.d.ts

@@ -0,0 +1,22 @@
+/**
+ * @synced-from pie-lib/packages/config-ui/src/choice-utils.js
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+/**
+ * Add value to every model.choices.
+ * @param {Object} model the model to normalize
+ * @return {Object} the updated model
+ */
+export declare const normalizeChoices: (model: any) => any;
+/**
+ * Find the first available index.
+ * @param {string[]} values
+ * @param {number} index
+ * @return {string}
+ */
+export declare const firstAvailableIndex: (values: any, index: any) => any;
+//# sourceMappingURL=choice-utils.d.ts.map

package/dist/choice-utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"choice-utils.d.ts","sourceRoot":"","sources":["../src/choice-utils.ts"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAIH;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GAAI,UAAK,QAQrC,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,GAAI,WAAM,EAAE,UAAK,QAMhD,CAAC"}

package/dist/choice-utils.js

@@ -0,0 +1,15 @@
+import { __exportAll as e } from "./_virtual/_rolldown/runtime.js";
+import { includes as t } from "lodash-es";
+//#region src/choice-utils.ts
+var n = /* @__PURE__ */ e({
+	firstAvailableIndex: () => i,
+	normalizeChoices: () => r
+}), r = (e) => {
+	let t = e.choices.map((e, t) => (e.value ||= `${t}`, e));
+	return {
+		...e,
+		choices: t
+	};
+}, i = (e, n) => t(e, `${n}`) ? i(e, n + 1) : `${n}`;
+//#endregion
+export { n as choice_utils_exports };