@pie-lib/render-ui 6.2.0-next.40 → 6.2.0-next.42

package/dist/color.d.ts

@@ -10,6 +10,7 @@ export declare const defaults: {
     TEXT: string;
     DISABLED: string;
     DISABLED_SECONDARY: string;
+    DISABLED_TEXT: string;
     CORRECT: "#4caf50";
     CORRECT_SECONDARY: "#e8f5e9";
     CORRECT_TERTIARY: string;
@@ -65,6 +66,7 @@ export declare const v: (prefix: any) => (...args: any[]) => any;
 export declare const text: () => any;
 export declare const disabled: () => any;
 export declare const disabledSecondary: () => any;
+export declare const disabledText: () => any;
 export declare const correct: () => any;
 export declare const correctSecondary: () => any;
 export declare const correctTertiary: () => any;

package/dist/color.js

@@ -2,68 +2,70 @@ import { __exportAll as ee } from "./_virtual/_rolldown/runtime.js";
 import { green as e, indigo as t, orange as te, pink as n, red as r } from "@mui/material/colors";
 //#region src/color.ts
 var ne = /* @__PURE__ */ ee({
-	background: () => O,
-	backgroundDark: () => k,
-	black: () => V,
-	blueGrey100: () => Y,
-	blueGrey300: () => X,
-	blueGrey600: () => Z,
-	blueGrey900: () => Q,
-	border: () => P,
-	borderDark: () => I,
-	borderGray: () => L,
-	borderLight: () => F,
-	buttonBorder: () => le,
-	buttonFocusOutline: () => J,
-	buttonHoverBg: () => ue,
-	correct: () => u,
-	correctSecondary: () => d,
-	correctTertiary: () => f,
-	correctWithIcon: () => p,
+	background: () => k,
+	backgroundDark: () => A,
+	black: () => H,
+	blueGrey100: () => X,
+	blueGrey300: () => Z,
+	blueGrey600: () => Q,
+	blueGrey900: () => ie,
+	border: () => F,
+	borderDark: () => L,
+	borderGray: () => R,
+	borderLight: () => I,
+	buttonBorder: () => ue,
+	buttonFocusOutline: () => Y,
+	buttonHoverBg: () => de,
+	correct: () => d,
+	correctSecondary: () => f,
+	correctTertiary: () => p,
+	correctWithIcon: () => m,
 	defaults: () => i,
 	disabled: () => c,
 	disabledSecondary: () => l,
-	dropdownBackground: () => j,
-	fadedPrimary: () => C,
-	focusChecked: () => W,
-	focusCheckedBorder: () => G,
-	focusUnchecked: () => K,
-	focusUncheckedBorder: () => q,
-	incorrect: () => m,
-	incorrectSecondary: () => g,
-	incorrectWithIcon: () => h,
-	keyBoardFocusIndicator: () => ce,
-	keypadButton: () => ie,
-	keypadButtonHover: () => $,
-	keypadButtonOperator: () => ae,
-	keypadButtonOperatorHover: () => se,
-	keypadEmptyPlaceholder: () => oe,
-	missing: () => _,
-	missingWithIcon: () => v,
-	primary: () => y,
-	primaryDark: () => x,
-	primaryLight: () => b,
-	primaryText: () => S,
-	secondary: () => w,
-	secondaryBackground: () => A,
-	secondaryDark: () => E,
-	secondaryLight: () => T,
-	secondaryText: () => D,
-	surface: () => re,
-	tableGrid: () => R,
-	tableGridLight: () => z,
-	tableStripe: () => B,
-	tertiary: () => M,
-	tertiaryLight: () => N,
+	disabledText: () => u,
+	dropdownBackground: () => re,
+	fadedPrimary: () => w,
+	focusChecked: () => G,
+	focusCheckedBorder: () => K,
+	focusUnchecked: () => q,
+	focusUncheckedBorder: () => J,
+	incorrect: () => h,
+	incorrectSecondary: () => _,
+	incorrectWithIcon: () => g,
+	keyBoardFocusIndicator: () => le,
+	keypadButton: () => ae,
+	keypadButtonHover: () => se,
+	keypadButtonOperator: () => oe,
+	keypadButtonOperatorHover: () => ce,
+	keypadEmptyPlaceholder: () => $,
+	missing: () => v,
+	missingWithIcon: () => y,
+	primary: () => b,
+	primaryDark: () => S,
+	primaryLight: () => x,
+	primaryText: () => C,
+	secondary: () => T,
+	secondaryBackground: () => j,
+	secondaryDark: () => D,
+	secondaryLight: () => E,
+	secondaryText: () => O,
+	surface: () => M,
+	tableGrid: () => z,
+	tableGridLight: () => B,
+	tableStripe: () => V,
+	tertiary: () => N,
+	tertiaryLight: () => P,
 	text: () => s,
-	transparent: () => U,
+	transparent: () => W,
 	v: () => a,
-	visualElementsColors: () => de,
-	white: () => H
+	visualElementsColors: () => fe,
+	white: () => U
 }), i = {
 	TEXT: "black",
 	DISABLED: "grey",
 	DISABLED_SECONDARY: "#ABABAB",
+	DISABLED_TEXT: "#545454",
 	CORRECT: e[500],
 	CORRECT_SECONDARY: e[50],
 	CORRECT_TERTIARY: "#0EA449",
@@ -119,7 +121,7 @@ Object.freeze(i);
 var a = (ee) => (...e) => {
 	let t = e.pop();
 	return e.reduceRight((e, t) => `var(--${ee}-${t}, ${e})`, t);
-}, o = a("pie"), s = () => o("text", i.TEXT), c = () => o("disabled", i.DISABLED), l = () => o("disabled-secondary", i.DISABLED_SECONDARY), u = () => o("correct", i.CORRECT), d = () => o("correct-secondary", i.CORRECT_SECONDARY), f = () => o("correct-tertiary", i.CORRECT_TERTIARY), p = () => o("correct-icon", i.CORRECT_WITH_ICON), m = () => o("incorrect", i.INCORRECT), h = () => o("incorrect-icon", i.INCORRECT_WITH_ICON), g = () => o("incorrect-secondary", i.INCORRECT_SECONDARY), _ = () => o("missing", i.MISSING), v = () => o("missing-icon", i.MISSING_WITH_ICON), y = () => o("primary", i.PRIMARY), b = () => o("primary-light", i.PRIMARY_LIGHT), x = () => o("primary-dark", i.PRIMARY_DARK), S = () => o("primary-text", "text", i.TEXT), C = () => o("faded-primary", i.FADED_PRIMARY), w = () => o("secondary", i.SECONDARY), T = () => o("secondary-light", i.SECONDARY_LIGHT), E = () => o("secondary-dark", i.SECONDARY_DARK), D = () => o("secondary-text", "text", i.TEXT), O = () => o("background", i.BACKGROUND), k = () => o("background-dark", i.BACKGROUND_DARK), A = () => o("secondary-background", i.SECONDARY_BACKGROUND), j = () => o("dropdown-background", i.DROPDOWN_BACKGROUND), re = () => o("surface", i.SURFACE), M = () => o("tertiary", i.TERTIARY), N = () => o("tertiary-light", i.TERTIARY_LIGHT), P = () => o("border", i.BORDER), F = () => o("border-light", i.BORDER_LIGHT), I = () => o("border-dark", i.BORDER_DARK), L = () => o("border-gray", i.BORDER_GRAY), R = () => o("table-grid", "text", i.TABLE_GRID), z = () => o("table-grid-light", "border-light", i.TABLE_GRID_LIGHT), B = () => o("table-stripe", "background-dark", i.TABLE_STRIPE), V = () => o("black", i.BLACK), H = () => o("white", i.WHITE), U = () => i.TRANSPARENT, W = () => o("focus-checked", i.FOCUS_CHECKED), G = () => o("focus-checked-border", i.FOCUS_CHECKED_BORDER), K = () => o("focus-unchecked", i.FOCUS_UNCHECKED), q = () => o("focus-unchecked-border", i.FOCUS_UNCHECKED_BORDER), J = () => o("button-focus-outline", i.BUTTON_FOCUS_OUTLINE), Y = () => o("blue-grey-100", i.BLUE_GREY100), X = () => o("blue-grey-300", i.BLUE_GREY300), Z = () => o("blue-grey-600", i.BLUE_GREY600), Q = () => o("blue-grey-900", i.BLUE_GREY900), ie = () => o("keypad-button", i.KEYPAD_BUTTON), ae = () => o("keypad-button-operator", i.KEYPAD_BUTTON_OPERATOR), oe = () => o("keypad-empty-placeholder", i.KEYPAD_EMPTY_PLACEHOLDER), $ = () => o("keypad-button-hover", i.KEYPAD_BUTTON_HOVER), se = () => o("keypad-button-operator-hover", i.KEYPAD_BUTTON_OPERATOR_HOVER), ce = () => o("keyboard-focus-indicator", i.KEY_BOARD_FOCUS_INDICATOR), le = () => o("button-border", i.BUTTON_BORDER), ue = () => o("button-hover-bg", i.BUTTON_HOVER_BG), de = {
+}, o = a("pie"), s = () => o("text", i.TEXT), c = () => o("disabled", i.DISABLED), l = () => o("disabled-secondary", i.DISABLED_SECONDARY), u = () => o("disabled-text", "text", i.DISABLED_TEXT), d = () => o("correct", i.CORRECT), f = () => o("correct-secondary", i.CORRECT_SECONDARY), p = () => o("correct-tertiary", i.CORRECT_TERTIARY), m = () => o("correct-icon", i.CORRECT_WITH_ICON), h = () => o("incorrect", i.INCORRECT), g = () => o("incorrect-icon", i.INCORRECT_WITH_ICON), _ = () => o("incorrect-secondary", i.INCORRECT_SECONDARY), v = () => o("missing", i.MISSING), y = () => o("missing-icon", i.MISSING_WITH_ICON), b = () => o("primary", i.PRIMARY), x = () => o("primary-light", i.PRIMARY_LIGHT), S = () => o("primary-dark", i.PRIMARY_DARK), C = () => o("primary-text", "text", i.TEXT), w = () => o("faded-primary", i.FADED_PRIMARY), T = () => o("secondary", i.SECONDARY), E = () => o("secondary-light", i.SECONDARY_LIGHT), D = () => o("secondary-dark", i.SECONDARY_DARK), O = () => o("secondary-text", "text", i.TEXT), k = () => o("background", i.BACKGROUND), A = () => o("background-dark", i.BACKGROUND_DARK), j = () => o("secondary-background", i.SECONDARY_BACKGROUND), re = () => o("dropdown-background", i.DROPDOWN_BACKGROUND), M = () => o("surface", i.SURFACE), N = () => o("tertiary", i.TERTIARY), P = () => o("tertiary-light", i.TERTIARY_LIGHT), F = () => o("border", i.BORDER), I = () => o("border-light", i.BORDER_LIGHT), L = () => o("border-dark", i.BORDER_DARK), R = () => o("border-gray", i.BORDER_GRAY), z = () => o("table-grid", "text", i.TABLE_GRID), B = () => o("table-grid-light", "border-light", i.TABLE_GRID_LIGHT), V = () => o("table-stripe", "background-dark", i.TABLE_STRIPE), H = () => o("black", i.BLACK), U = () => o("white", i.WHITE), W = () => i.TRANSPARENT, G = () => o("focus-checked", i.FOCUS_CHECKED), K = () => o("focus-checked-border", i.FOCUS_CHECKED_BORDER), q = () => o("focus-unchecked", i.FOCUS_UNCHECKED), J = () => o("focus-unchecked-border", i.FOCUS_UNCHECKED_BORDER), Y = () => o("button-focus-outline", i.BUTTON_FOCUS_OUTLINE), X = () => o("blue-grey-100", i.BLUE_GREY100), Z = () => o("blue-grey-300", i.BLUE_GREY300), Q = () => o("blue-grey-600", i.BLUE_GREY600), ie = () => o("blue-grey-900", i.BLUE_GREY900), ae = () => o("keypad-button", i.KEYPAD_BUTTON), oe = () => o("keypad-button-operator", i.KEYPAD_BUTTON_OPERATOR), $ = () => o("keypad-empty-placeholder", i.KEYPAD_EMPTY_PLACEHOLDER), se = () => o("keypad-button-hover", i.KEYPAD_BUTTON_HOVER), ce = () => o("keypad-button-operator-hover", i.KEYPAD_BUTTON_OPERATOR_HOVER), le = () => o("keyboard-focus-indicator", i.KEY_BOARD_FOCUS_INDICATOR), ue = () => o("button-border", i.BUTTON_BORDER), de = () => o("button-hover-bg", i.BUTTON_HOVER_BG), fe = {
 	AXIS_LINE_COLOR: "#5A53C9",
 	ROLLOVER_FILL_BAR_COLOR: "#050F2D",
 	GRIDLINES_COLOR: "#8E88EA",
@@ -127,4 +129,4 @@ var a = (ee) => (...e) => {
 	SHAPES_FILL_COLOR: "#7986cb"
 };
 //#endregion
-export { O as background, k as backgroundDark, V as black, Y as blueGrey100, X as blueGrey300, Z as blueGrey600, Q as blueGrey900, P as border, I as borderDark, L as borderGray, F as borderLight, le as buttonBorder, J as buttonFocusOutline, ue as buttonHoverBg, ne as color_exports, u as correct, d as correctSecondary, f as correctTertiary, p as correctWithIcon, i as defaults, c as disabled, l as disabledSecondary, j as dropdownBackground, C as fadedPrimary, W as focusChecked, G as focusCheckedBorder, K as focusUnchecked, q as focusUncheckedBorder, m as incorrect, g as incorrectSecondary, h as incorrectWithIcon, ce as keyBoardFocusIndicator, ie as keypadButton, $ as keypadButtonHover, ae as keypadButtonOperator, se as keypadButtonOperatorHover, oe as keypadEmptyPlaceholder, _ as missing, v as missingWithIcon, y as primary, x as primaryDark, b as primaryLight, S as primaryText, w as secondary, A as secondaryBackground, E as secondaryDark, T as secondaryLight, D as secondaryText, re as surface, R as tableGrid, z as tableGridLight, B as tableStripe, M as tertiary, N as tertiaryLight, s as text, U as transparent, a as v, de as visualElementsColors, H as white };
+export { k as background, A as backgroundDark, H as black, X as blueGrey100, Z as blueGrey300, Q as blueGrey600, ie as blueGrey900, F as border, L as borderDark, R as borderGray, I as borderLight, ue as buttonBorder, Y as buttonFocusOutline, de as buttonHoverBg, ne as color_exports, d as correct, f as correctSecondary, p as correctTertiary, m as correctWithIcon, i as defaults, c as disabled, l as disabledSecondary, u as disabledText, re as dropdownBackground, w as fadedPrimary, G as focusChecked, K as focusCheckedBorder, q as focusUnchecked, J as focusUncheckedBorder, h as incorrect, _ as incorrectSecondary, g as incorrectWithIcon, le as keyBoardFocusIndicator, ae as keypadButton, se as keypadButtonHover, oe as keypadButtonOperator, ce as keypadButtonOperatorHover, $ as keypadEmptyPlaceholder, v as missing, y as missingWithIcon, b as primary, S as primaryDark, x as primaryLight, C as primaryText, T as secondary, j as secondaryBackground, D as secondaryDark, E as secondaryLight, O as secondaryText, M as surface, z as tableGrid, B as tableGridLight, V as tableStripe, N as tertiary, P as tertiaryLight, s as text, W as transparent, a as v, fe as visualElementsColors, U as white };

package/dist/preview-prompt.js

@@ -54,37 +54,37 @@ var l = o("div")(({ theme: r, tagName: i }) => ({
 	static defaultProps = { onClick: () => {} };
 	promptRef = r.createRef();
 	parsedText = (e) => {
-		let { customAudioButton: t } = this.props, n = document.createElement("div");
-		n.innerHTML = e;
-		let r = n.querySelector("audio");
-		if (r) {
+		let { autoplayAudioEnabled: t, customAudioButton: n } = this.props, r = document.createElement("div");
+		r.innerHTML = e;
+		let i = r.querySelector("audio");
+		if (i) {
 			let e = document.createElement("source");
-			if (e.setAttribute("type", "audio/mp3"), e.setAttribute("src", r.getAttribute("src")), r.removeAttribute("src"), r.setAttribute("id", "pie-prompt-audio-player"), r.appendChild(e), t) {
-				r.style.display = "none";
+			if (e.setAttribute("type", "audio/mp3"), e.setAttribute("src", i.getAttribute("src")), i.removeAttribute("src"), i.setAttribute("id", "pie-prompt-audio-player"), i.appendChild(e), n) {
+				i.style.display = "none";
 				let e = document.createElement("div");
 				e.id = "play-audio-button", Object.assign(e.style, {
 					cursor: "pointer",
 					display: "block",
 					width: "128px",
 					height: "128px",
-					backgroundImage: `url(${t.pauseImage})`,
+					backgroundImage: `url(${t ? n.pauseImage : n.playImage})`,
 					backgroundSize: "cover",
 					borderRadius: "50%",
 					border: "1px solid #326295"
-				}), r.parentNode.insertBefore(e, r);
+				}), i.parentNode.insertBefore(e, i);
 			}
 		}
-		return n.innerHTML;
+		return r.innerHTML;
 	};
 	addCustomAudioButtonControls() {
 		let { autoplayAudioEnabled: e, customAudioButton: t } = this.props, n = document.getElementById("play-audio-button"), r = document.getElementById("pie-prompt-audio-player");
 		if (e && r && r.play().then(() => {
 			n && t && r.addEventListener("ended", a);
 		}).catch((e) => {
-			console.error("Error playing audio", e);
+			n && t && (n.style.backgroundImage = `url(${t.playImage})`), console.error("Error playing audio", e);
 		}), !n || !r || !t) return;
 		let i = () => {
-			r.paused && (n.style.backgroundImage.includes(t.pauseImage) || r.play());
+			r.paused && r.play();
 		}, a = () => {
 			n.style.backgroundImage = `url(${t.playImage})`;
 		}, o = () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/render-ui",
-  "version": "6.2.0-next.40",
+  "version": "6.2.0-next.42",
   "description": "Some shared ui elements when rendering - but not worthy of their own package yet.",
   "repository": {
     "type": "git",
@@ -12,8 +12,8 @@
     "@emotion/styled": "^11.14.1",
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
-    "@pie-lib/icons": "4.0.2",
-    "@pie-lib/test-utils": "2.0.2",
+    "@pie-lib/icons": "5.0.0-next.0",
+    "@pie-lib/test-utils": "3.0.0-next.1",
     "debug": "^4.1.1",
     "prop-types": "^15.7.2",
     "react-transition-group": "^4.4.5",
@@ -38,13 +38,6 @@
     "dev": "bun x vite",
     "test": "bun x vitest run"
   },
-  "devDependencies": {
-    "vite": "^8.0.1",
-    "typescript": "^5.9.3",
-    "@vitejs/plugin-react": "^6.0.1",
-    "@types/react": "^18.2.0",
-    "@types/react-dom": "^18.2.0"
-  },
   "peerDependencies": {
     "react": "^18.0.0",
     "react-dom": "^18.0.0"