@erudit-js/prose 3.0.0-dev.25

package/dist/elements/math/inliner.js

@@ -0,0 +1,85 @@
+import { defineRegistryItem, defineSchema, ensureTagChild, ProseError, textSchema } from "@jsprose/core";
+import { defineEruditTag } from "../../tag.js";
+import { latexToHtml, normalizeKatex } from "./katex.js";
+/**
+* Apply typographical replacements to improve math rendering
+*/
+function prettifyMathString(mathString) {
+	mathString = mathString.replace(/([\w\(\[\)\]])\s*([-+=])\s*([\w\(\[\)\]])/g, "$1 $2 $3").replace(/-/g, "–");
+	return mathString;
+}
+/**
+* Try to use simple text mode for inline math as it is significantly better for SEO, faster and smaller.
+*/
+export function tryTextInlinerMath(expression) {
+	if (!expression) return undefined;
+	expression = prettifyMathString(expression);
+	const tokens = (() => {
+		const hasComplexSymbols = /[\^\\{}_]/gm.test(expression);
+		if (hasComplexSymbols) return false;
+		const wordRegexp = /([\p{L}']+)|([^\p{L}']+)/gu;
+		const _tokens = [];
+		let match;
+		while ((match = wordRegexp.exec(expression)) !== null) {
+			if (match[1]) _tokens.push({
+				type: "word",
+				value: match[1]
+			});
+			else if (match[2]) _tokens.push({
+				type: "other",
+				value: match[2]
+			});
+		}
+		return _tokens;
+	})();
+	if (tokens) {
+		return {
+			type: "text",
+			tokens
+		};
+	}
+	return undefined;
+}
+//
+//
+//
+export const inlinerMathSchema = defineSchema({
+	name: "inlinerMath",
+	type: "inliner",
+	linkable: true
+})();
+export const M = defineEruditTag({
+	tagName: "M",
+	schema: inlinerMathSchema
+})(({ element, tagName, children }) => {
+	ensureTagChild(tagName, children, textSchema);
+	const katex = normalizeKatex(children[0].data);
+	if (!katex) {
+		throw new ProseError(`<${tagName}> tag must contain non-empty KaTeX math expression.`);
+	}
+	element.data = katex;
+	element.storageKey = `$ ${katex} $`;
+});
+export const inlinerMathRegistryItem = defineRegistryItem({
+	schema: inlinerMathSchema,
+	tags: [M],
+	async createStorage(element) {
+		return createInlinerMathStorage(element.data);
+	}
+});
+export async function createInlinerMathStorage(katex) {
+	const tokens = tryTextInlinerMath(katex);
+	if (tokens) {
+		return tokens;
+	}
+	let mathHtml = "<span style=\"color: red\">KaTeX Error!</span>";
+	try {
+		mathHtml = await latexToHtml(katex, "inline");
+	} catch (error) {
+		console.error("Error while rendering math:", error);
+	}
+	return {
+		type: "katex",
+		mathHtml
+	};
+}

package/dist/elements/math/katex.d.ts

@@ -0,0 +1,8 @@
+export declare const katexDependency: {
+    katex: {
+        optimise: boolean;
+        transpile: boolean;
+    };
+};
+export declare function normalizeKatex(katex: string): string;
+export declare function latexToHtml(katex: string, mode: 'block' | 'inline'): Promise<string>;

package/dist/elements/math/katex.js

@@ -0,0 +1,18 @@
+export const katexDependency = { katex: {
+	optimise: true,
+	transpile: true
+} };
+export function normalizeKatex(katex) {
+	katex = katex.replace(/[\s\n]+/g, " ").trim();
+	return katex;
+}
+export async function latexToHtml(katex, mode) {
+	const katexLib = (await import("katex")).default;
+	const macros = (await import("./macros.js")).default;
+	const html = katexLib.renderToString(katex, {
+		displayMode: mode === "block",
+		strict: false,
+		macros
+	});
+	return html;
+}

package/dist/elements/math/languages/en.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    element_name: string;
+};
+export default _default;

package/dist/elements/math/languages/en.js

@@ -0,0 +1,2 @@
+import { defineElementLanguage } from "../../../app/language/element.js";
+export default defineElementLanguage({ element_name: "Math" });

package/dist/elements/math/languages/ru.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    element_name: string;
+};
+export default _default;

package/dist/elements/math/languages/ru.js

@@ -0,0 +1,2 @@
+import { defineElementLanguage } from "../../../app/language/element.js";
+export default defineElementLanguage({ element_name: "Математика" });

package/dist/elements/math/macros.d.ts

@@ -0,0 +1,13 @@
+declare const _default: {
+    '\\brand': string;
+    '\\blue': string;
+    '\\green': string;
+    '\\yellow': string;
+    '\\red': string;
+    '\\default': string;
+    '\\set': string;
+    '\\floor': string;
+    '\\andcases': string;
+    '\\orcases': string;
+};
+export default _default;

package/dist/elements/math/macros.js

@@ -0,0 +1,12 @@
+export default {
+	"\\brand": "\\textcolor{##100000}{#1}",
+	"\\blue": "\\textcolor{##200000}{#1}",
+	"\\green": "\\textcolor{##300000}{#1}",
+	"\\yellow": "\\textcolor{##400000}{#1}",
+	"\\red": "\\textcolor{##500000}{#1}",
+	"\\default": "\\textcolor{##600000}{#1}",
+	"\\set": "\\left\\{#1\\right\\}",
+	"\\floor": "\\left\\lfloor #1 \\right\\rfloor",
+	"\\andcases": "\\begin{cases}#1\\end{cases}",
+	"\\orcases": "\\left[\\begin{array}{ll} #1 \\end{array}\\right."
+};

package/dist/elements/paragraph/Paragraph.vue

@@ -0,0 +1,27 @@
+<script setup lang="ts">
+import type { ProseElement } from '@jsprose/core';
+
+import type { paragraphSchema } from './core.js';
+import Block from '../../app/shared/block/Block.vue';
+import Render from '../../app/shared/Render.vue';
+
+defineProps<{ element: ProseElement<typeof paragraphSchema> }>();
+</script>
+
+<template>
+    <Block :element>
+        <div
+            :class="[
+                'wrap-break-word transition-[color]',
+                element.data?.center
+                    ? 'text-center'
+                    : 'micro:text-justify text-left',
+                {
+                    'font-serif': element.data?.serif,
+                },
+            ]"
+        >
+            <Render v-for="child of element.children" :element="child" />
+        </div>
+    </Block>
+</template>

package/dist/elements/paragraph/_global.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Paragraph are general prose containers.
+ *
+ * When writing paragraphs, stick to **"rule of 3"**:
+ * * Ideally **3** sentences per paragraph.
+ * * After each **3** paragraphs use a different block: heading, list, image, formula, etc.
+ *
+ * Paragraphs can be centered via `center` prop, and can use serif font style via `serif` prop.
+ * Use these with extra caution, as they reduce readability if overused!
+ *
+ * @title Paragraph
+ * @layout block
+ * @example
+ * ```tsx
+ * <P>Normal Paragraph</P>
+ *
+ * <P center>Centered Paragraph</P>
+ * <P serif>Paragraph with serif font style</P>
+ * <P center serif>Centered Paragraph with serif font style</P>
+ *
+ * <P>
+ *   Paragraph<Br />
+ *   With Line Break
+ * </P>
+ * ```
+ */
+export const P = '_tag_';

package/dist/elements/paragraph/app.d.ts

@@ -0,0 +1,9 @@
+declare const _default: import("../../app/appElement.js").AppElement<{
+    name: "paragraph";
+    type: "block";
+    linkable: true;
+    Data: import("./core.js").ParagraphData;
+    Storage: undefined;
+    Children: import("@jsprose/core").InlinerSchema[];
+}>;
+export default _default;

package/dist/elements/paragraph/app.js

@@ -0,0 +1,11 @@
+import { defineEruditProseAppElement } from "../../app/appElement.js";
+import { paragraphSchema } from "./core.js";
+export default defineEruditProseAppElement({
+	schema: paragraphSchema,
+	component: () => import("./Paragraph.vue"),
+	languages: {
+		en: () => import("./languages/en.js"),
+		ru: () => import("./languages/ru.js")
+	},
+	icon: () => import("./icon.svg?raw")
+});

package/dist/elements/paragraph/core.d.ts

@@ -0,0 +1,67 @@
+import { type InlinerSchema, type TagChildren } from '@jsprose/core';
+export declare const paragraphSchema: {
+    name: "paragraph";
+    type: "block";
+    linkable: true;
+    Data: ParagraphData;
+    Storage: undefined;
+    Children: InlinerSchema[];
+};
+export type ParagraphData = undefined | {
+    center?: boolean;
+    serif?: boolean;
+};
+export declare const P: import("@jsprose/core").Tag<"P", {
+    name: "paragraph";
+    type: "block";
+    linkable: true;
+    Data: ParagraphData;
+    Storage: undefined;
+    Children: InlinerSchema[];
+}, {
+    center?: true;
+    serif?: true;
+} & TagChildren & import("../../toc.js").ObjPropToc & import("../../snippet.js").ObjPropSnippet & import("../../snippet.js").ObjPropSearch & import("../../snippet.js").ObjPropQuick & import("../../snippet.js").ObjPropSeo>;
+export declare const paragraphRegistryItem: import("@jsprose/core").RegistryItem<{
+    name: "paragraph";
+    type: "block";
+    linkable: true;
+    Data: ParagraphData;
+    Storage: undefined;
+    Children: InlinerSchema[];
+}, {
+    P: import("@jsprose/core").Tag<"P", {
+        name: "paragraph";
+        type: "block";
+        linkable: true;
+        Data: ParagraphData;
+        Storage: undefined;
+        Children: InlinerSchema[];
+    }, {
+        center?: true;
+        serif?: true;
+    } & TagChildren & import("../../toc.js").ObjPropToc & import("../../snippet.js").ObjPropSnippet & import("../../snippet.js").ObjPropSearch & import("../../snippet.js").ObjPropQuick & import("../../snippet.js").ObjPropSeo>;
+}, undefined>;
+declare const _default: {
+    registryItem: import("@jsprose/core").RegistryItem<{
+        name: "paragraph";
+        type: "block";
+        linkable: true;
+        Data: ParagraphData;
+        Storage: undefined;
+        Children: InlinerSchema[];
+    }, {
+        P: import("@jsprose/core").Tag<"P", {
+            name: "paragraph";
+            type: "block";
+            linkable: true;
+            Data: ParagraphData;
+            Storage: undefined;
+            Children: InlinerSchema[];
+        }, {
+            center?: true;
+            serif?: true;
+        } & TagChildren & import("../../toc.js").ObjPropToc & import("../../snippet.js").ObjPropSnippet & import("../../snippet.js").ObjPropSearch & import("../../snippet.js").ObjPropQuick & import("../../snippet.js").ObjPropSeo>;
+    }, undefined>;
+};
+export default _default;

package/dist/elements/paragraph/core.js

@@ -0,0 +1,29 @@
+import { defineRegistryItem, defineSchema, ensureTagInlinerChildren } from "@jsprose/core";
+import { defineEruditProseCoreElement } from "../../coreElement.js";
+import { defineEruditTag } from "../../tag.js";
+export const paragraphSchema = defineSchema({
+	name: "paragraph",
+	type: "block",
+	linkable: true
+})();
+export const P = defineEruditTag({
+	tagName: "P",
+	schema: paragraphSchema
+})(({ element, tagName, props, children, registry }) => {
+	ensureTagInlinerChildren(tagName, children, registry);
+	element.children = children;
+	if (props.center || props.serif) {
+		element.data = {};
+		if (props.center) {
+			element.data.center = true;
+		}
+		if (props.serif) {
+			element.data.serif = true;
+		}
+	}
+});
+export const paragraphRegistryItem = defineRegistryItem({
+	schema: paragraphSchema,
+	tags: [P]
+});
+export default defineEruditProseCoreElement({ registryItem: paragraphRegistryItem });

package/dist/elements/paragraph/icon.svg

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="a" data-name="Слой 1" xmlns="http://www.w3.org/2000/svg" width="960" height="960" viewBox="0 0 960 960">
+  <path d="M143.89,732.05c-11.9,0-21.9-4.02-29.94-12.05-8.04-8.04-12.05-18.04-12.05-29.94s4.02-21.9,12.05-29.94c8.04-8.04,18.04-12.05,29.94-12.05h420.12c11.9,0,21.9,4.02,29.94,12.05s12.05,18.04,12.05,29.94-4.02,21.9-12.05,29.94-18.04,12.05-29.94,12.05H143.89ZM143.89,521.95c-11.9,0-21.9-4.02-29.94-12.05-8.04-8.04-12.05-18.04-12.05-29.94s4.02-21.9,12.05-29.94c8.04-8.04,18.04-12.05,29.94-12.05h672.21c11.9,0,21.9,4.02,29.94,12.05,8.04,8.04,12.05,18.04,12.05,29.94s-4.02,21.9-12.05,29.94c-8.04,8.04-18.04,12.05-29.94,12.05H143.89ZM143.89,311.93c-11.9,0-21.9-4.02-29.94-12.05-8.04-8.04-12.05-18.04-12.05-29.94s4.02-21.9,12.05-29.94c8.04-8.04,18.04-12.05,29.94-12.05h672.21c11.9,0,21.9,4.02,29.94,12.05s12.05,18.04,12.05,29.94-4.02,21.9-12.05,29.94-18.04,12.05-29.94,12.05H143.89Z"/>
+</svg>

package/dist/elements/paragraph/languages/en.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    element_name: string;
+};
+export default _default;

package/dist/elements/paragraph/languages/en.js

@@ -0,0 +1,2 @@
+import { defineElementLanguage } from "../../../app/language/element.js";
+export default defineElementLanguage({ element_name: "Paragraph" });

package/dist/elements/paragraph/languages/ru.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    element_name: string;
+};
+export default _default;

package/dist/elements/paragraph/languages/ru.js

@@ -0,0 +1,2 @@
+import { defineElementLanguage } from "../../../app/language/element.js";
+export default defineElementLanguage({ element_name: "Параграф" });

package/dist/elements/problem/_global.d.ts

@@ -0,0 +1,112 @@
+import type { ProblemCustomAttribute as PAC } from './shared.js';
+
+/**
+ * Problems are used to present exercises and questions to the reader.
+ * See the example for a full breakdown of the sub-elements available.
+ *
+ * All problems are added to TOC and search by default (can be disabled via tag properties).
+ *
+ * @title Problem
+ * @layout block
+ * @example
+ * ```tsx
+ * // Static problem
+ * <Problem title="Find the square" level="easy">
+ *   <ProblemDescription>
+ *     <P>What is the square of 2?</P>
+ *     <P>Think carefully about your answer before proceeding to the hints and solution.</P>
+ *   </ProblemDescription>
+ *
+ *   <ProblemHint>
+ *     <P>Recall that squaring a number means multiplying it by itself.</P>
+ *   </ProblemHint>
+ *   <ProblemHint>
+ *     <P>For example, the square of 3 is 9, since 3 * 3 = 9.</P>
+ *   </ProblemHint>
+ *   // More hints...
+ *
+ *   <ProblemSolution>
+ *     <P>Some general phrases visible immediately.</P>
+ *
+ *     <ProblemSection title="Detailed Solution">
+ *       <P>The square of 2 is 4, since 2 * 2 = 4.</P>
+ *     </ProblemSection>
+ *     // More sections...
+ *
+ *   </ProblemSolution>
+ *
+ *   <ProblemAnswer>
+ *     <P><M>4</M></P>
+ *   </ProblemAnswer>
+ *
+ *   <ProblemCheck label="The square of 2 is" answer={4} />
+ *   // More checks...
+ *
+ *   <ProblemNote>
+ *     In fact, you can find the square of any number by multiplying it by itself!
+ *   </ProblemNote>
+ * </Problem>
+ *
+ * // Script problem
+ * export const fooScript = defineProblemScript({
+ *   isGenerator: true,
+ * })(({ initial, random }) => {
+ *   const a = initial.nextInt(1, 10);
+ *   const b = initial.nextInt(1, 10);
+ *
+ *   return (
+ *     <>
+ *       <ProblemDescription>
+ *         What is <M>{a} + {b}</M>?
+ *       </ProblemDescription>
+ *       <ProblemAnswer>
+ *         <M>{a + b}</M>
+ *       </ProblemAnswer>
+ *       <ProblemCheck label="The answer is" answer={a + b} />
+ *     </>
+ *   );
+ * });
+ *
+ * <Problem title="Addition Problem" level="medium" script={fooScript} />
+ * ```
+ */
+export const Problem = '_tag_';
+export const ProblemDescription = '_tag_';
+export const ProblemHint = '_tag_';
+export const ProblemSection = '_tag_';
+export const ProblemSolution = '_tag_';
+export const ProblemAnswer = '_tag_';
+export const ProblemNote = '_tag_';
+export const ProblemCheck = '_tag_';
+
+/**
+ * Problem set is a collection of related problems presented together.
+ * `<Problems>` tag contains general problem information and insude can have multiple `<SubProblem>` tags.
+ *
+ * Each `<SubProblem>` contains the same problem content tags as single `<Problem>` tag.
+ *
+ * All problems are added to TOC and search by default (can be disabled via tag properties).
+ *
+ * @title Problems
+ * @layout block
+ * @example
+ * ```tsx
+ * // export const problemScript = defineProblemScript(...) ~> see Problem docs for details
+ * <Problems title="Sample Problem Set" level="hard">
+ *   <SubProblem label="Example">
+ *     <ProblemDescription>
+ *       This is an example sub-problem.
+ *     </ProblemDescription>
+ *   </SubProblem>
+ *
+ *   <SubProblem script={problemScript} />
+ * </Problems>
+ * ```
+ */
+export const Problems = '_tag_';
+export const SubProblem = '_tag_';
+
+/**
+ * Typeguard for creating custom problem attributes.
+ */
+export type ProblemCustomAttribute = PAC;

package/dist/elements/problem/app.d.ts

@@ -0,0 +1,30 @@
+declare const _default: (import("../../app/appElement.js").AppElement<{
+    name: "problem";
+    type: "block";
+    linkable: true;
+    Data: import("./problem.js").ProblemData;
+    Storage: import("./storage.js").ProblemScriptStorage;
+    Children: import("./problemContent.js").ProblemContentChild[];
+}> | import("../../app/appElement.js").AppElement<{
+    name: "subProblem";
+    type: "block";
+    linkable: false;
+    Data: import("./problems.js").SubProblemData;
+    Storage: import("./storage.js").ProblemScriptStorage;
+    Children: import("./problemContent.js").ProblemContentChild[];
+}> | import("../../app/appElement.js").AppElement<{
+    name: "problems";
+    type: "block";
+    linkable: true;
+    Data: import("./shared.js").ProblemInfo;
+    Storage: undefined;
+    Children: (import("@jsprose/core").BlockSchema | {
+        name: "subProblem";
+        type: "block";
+        linkable: false;
+        Data: import("./problems.js").SubProblemData;
+        Storage: import("./storage.js").ProblemScriptStorage;
+        Children: import("./problemContent.js").ProblemContentChild[];
+    })[];
+}>)[];
+export default _default;

package/dist/elements/problem/app.js

@@ -0,0 +1,27 @@
+import { defineEruditProseAppElement } from "../../app/appElement.js";
+import { problemSchema } from "./problem.js";
+import { problemsSchema, subProblemSchema } from "./problems.js";
+export default [
+	defineEruditProseAppElement({
+		schema: problemSchema,
+		component: () => import("./components/Problem.vue"),
+		languages: {
+			en: () => import("./languages/en.js"),
+			ru: () => import("./languages/ru.js")
+		},
+		icon: () => import("./assets/icon.svg?raw")
+	}),
+	defineEruditProseAppElement({
+		schema: subProblemSchema,
+		component: () => import("./components/SubProblem.vue")
+	}),
+	defineEruditProseAppElement({
+		schema: problemsSchema,
+		component: () => import("./components/Problems.vue"),
+		languages: {
+			en: () => import("./languages/en.js"),
+			ru: () => import("./languages/ru.js")
+		},
+		icon: () => import("./assets/icon.svg?raw")
+	})
+];

package/dist/elements/problem/assets/actions/answer.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+  <path d="M8.86,13.75l5.75-5.75-1.14-1.14-4.61,4.61-2.32-2.32-1.14,1.14,3.47,3.47ZM10,18.15c-1.13,0-2.19-.21-3.18-.64-.99-.43-1.86-1.01-2.59-1.74-.73-.73-1.31-1.6-1.74-2.59-.43-.99-.64-2.05-.64-3.18,0-1.13.21-2.19.64-3.18s1.01-1.86,1.74-2.59c.73-.73,1.6-1.31,2.59-1.74s2.05-.64,3.18-.64c1.13,0,2.19.21,3.18.64.99.43,1.86,1.01,2.59,1.74.73.73,1.31,1.6,1.74,2.59.43.99.64,2.05.64,3.18s-.22,2.19-.64,3.18c-.43.99-1.01,1.86-1.74,2.59s-1.6,1.31-2.59,1.74c-.99.43-2.05.64-3.18.64M10,16.52c1.82,0,3.36-.63,4.63-1.9s1.9-2.81,1.9-4.63-.63-3.36-1.9-4.63c-1.26-1.26-2.81-1.9-4.63-1.9-1.82,0-3.36.63-4.63,1.9s-1.9,2.81-1.9,4.63c0,1.82.63,3.36,1.9,4.63,1.26,1.26,2.81,1.9,4.63,1.9"/>
+</svg>

package/dist/elements/problem/assets/actions/check.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <path d="M28.58,6.4l-7.8,20.14c-.26.67-1.01,1-1.68.74-.16-.06-.3-.15-.43-.27l-4.39-4.21-2.7,2.7c-.26.26-.66.26-.92,0-.12-.12-.19-.29-.19-.46v-5.87l-6.74-6.46c-.52-.5-.54-1.32-.04-1.84.17-.18.38-.3.62-.36l22.74-5.84c.7-.18,1.4.24,1.58.94.06.26.05.54-.05.79h0ZM25.42,7.88l-14.25,9.29,2.26,2.16,12-11.45h0Z"/>
+</svg>

package/dist/elements/problem/assets/actions/generate.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+  <path d="M2,2v1.5h2.1l-.37.3c-.6.6-1.02,1.25-1.27,1.95-.3.7-.45,1.42-.45,2.17,0,1.4.42,2.65,1.27,3.75.8,1.05,1.87,1.77,3.22,2.17v-1.57c-.9-.35-1.62-.92-2.17-1.72-.55-.75-.82-1.62-.82-2.62,0-.55.1-1.07.3-1.57.2-.55.55-1.05,1.05-1.5l.15-.15v1.8h1.5V2H2ZM9.5,2.23v1.57c.9.3,1.62.85,2.17,1.65.55.75.82,1.62.82,2.62,0,.55-.1,1.07-.3,1.57-.25.55-.57,1.05-.97,1.5l-.22.15v-1.8h-1.5v4.5h4.5v-1.5h-2.02l.22-.22c.65-.65,1.1-1.32,1.35-2.02.3-.75.45-1.47.45-2.17,0-1.4-.42-2.65-1.27-3.75-.8-1.1-1.87-1.82-3.22-2.17v.07Z"/>
+</svg>

package/dist/elements/problem/assets/actions/hint.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22">
+  <path d="M11,6.36c2.56,0,4.64,2.08,4.64,4.64,0,1.72-.93,3.21-2.32,4.02v1.39c0,.43-.35.77-.77.77h-3.09c-.43,0-.77-.35-.77-.77v-1.39c-1.38-.8-2.32-2.3-2.32-4.02,0-2.56,2.08-4.64,4.64-4.64M12.55,17.95v.77c0,.43-.35.77-.77.77h-1.55c-.43,0-.77-.35-.77-.77v-.77h3.09ZM17.18,10.23h2.32v1.55h-2.32v-1.55ZM2.5,10.23h2.32v1.55h-2.32v-1.55ZM11.77,2.5v2.32h-1.55v-2.32h1.55ZM5.53,4.43l1.65,1.65-1.1,1.09-1.65-1.64,1.1-1.1ZM14.83,6.08l1.64-1.65,1.11,1.1-1.65,1.64-1.1-1.1Z"/>
+</svg>

package/dist/elements/problem/assets/actions/note.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.97 16.97">
+  <path d="M10.41,4.64c0-.31.2-.57.43-.79.21-.2.34-.45.34-.72,0-.63-.69-1.15-1.53-1.15s-1.53.51-1.53,1.15c0,.28.13.53.35.73.22.2.42.46.42.76,0,.41-.33.74-.74.75-.02,0-.03,0-.05,0-.77-.05-1.54-.13-2.31-.23-.31-.04-.6.17-.65.49,0,.05,0,.11,0,.16.11.76.19,1.53.23,2.31.02.41-.29.76-.7.78-.02,0-.03,0-.05,0-.3,0-.56-.19-.76-.42-.2-.22-.45-.35-.73-.35-.63,0-1.15.69-1.15,1.53s.51,1.53,1.15,1.53c.27,0,.52-.13.72-.34.21-.23.48-.43.79-.43.42,0,.77.34.77.76,0,.01,0,.02,0,.03-.04.96-.12,1.91-.24,2.86-.04.31.18.6.49.64.8.11,1.62.19,2.44.24.41.02.76-.29.78-.7,0-.02,0-.03,0-.05,0-.3-.19-.56-.42-.76-.22-.2-.35-.45-.35-.73,0-.63.69-1.15,1.53-1.15s1.53.51,1.53,1.15c0,.27-.13.52-.34.72-.23.21-.43.48-.43.79,0,.42.34.77.76.77,0,0,.02,0,.03,0,1.02-.04,2.04-.12,3.03-.26.26-.03.46-.24.49-.49.13-1,.22-2.01.26-3.03.01-.42-.32-.78-.74-.79,0,0-.02,0-.03,0-.31,0-.57.2-.79.43-.2.21-.45.34-.72.34-.63,0-1.15-.69-1.15-1.53s.51-1.53,1.15-1.53c.28,0,.53.13.73.35.2.22.46.42.76.42.41,0,.75-.33.75-.74,0-.02,0-.03,0-.05-.05-.82-.13-1.63-.24-2.44-.04-.31-.33-.53-.64-.49-.94.13-1.89.21-2.86.24-.42.01-.77-.32-.79-.74,0-.01,0-.02,0-.03"/>
+</svg>

package/dist/elements/problem/assets/actions/solution.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 560">
+  <path d="M119.1,480c-8.15,0-14.95-2.75-20.41-8.26-5.51-5.45-8.26-12.25-8.26-20.41s2.75-14.9,8.26-20.41c5.45-5.45,12.25-8.18,20.41-8.18h229.09c8.15,0,14.95,2.73,20.41,8.18s8.26,12.31,8.26,20.41c0,8.15-2.75,14.95-8.26,20.41-5.45,5.51-12.25,8.26-20.41,8.26H119.1ZM119.1,365.42c-8.1,0-14.9-2.75-20.41-8.26-5.45-5.45-8.18-12.25-8.18-20.41s2.73-14.9,8.18-20.41c5.51-5.45,12.31-8.18,20.41-8.18h401c8.15,0,14.95,2.73,20.41,8.18,5.51,5.51,8.26,12.31,8.26,20.41s-2.75,14.95-8.26,20.41c-5.45,5.51-12.25,8.26-20.41,8.26H119.1ZM119.1,250.83c-8.1,0-14.9-2.73-20.41-8.18-5.45-5.51-8.18-12.31-8.18-20.41s2.73-14.95,8.18-20.41c5.51-5.51,12.31-8.26,20.41-8.26h401c8.15,0,14.95,2.75,20.41,8.26,5.51,5.45,8.26,12.25,8.26,20.41s-2.75,14.9-8.26,20.41c-5.45,5.45-12.25,8.18-20.41,8.18H119.1ZM119.1,136.25c-8.1,0-14.9-2.73-20.41-8.18-5.45-5.51-8.18-12.31-8.18-20.41s2.73-14.95,8.18-20.41c5.51-5.51,12.31-8.26,20.41-8.26h401c8.15,0,14.95,2.75,20.41,8.26,5.51,5.45,8.26,12.25,8.26,20.41s-2.75,14.9-8.26,20.41c-5.45,5.45-12.25,8.18-20.41,8.18H119.1Z"/>
+</svg>

package/dist/elements/problem/assets/attributes/applied.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+    <path d="M6.125 12.15q.65-1.65 1.563-3.175T9.75 6.1l-1.3-.275q-.5-.1-.975.05t-.825.5L3.5 9.525q-.375.375-.288.9t.588.725zm14.7-9.75q-2.65-.125-5.037 1.025T11.525 6.45q-1.2 1.2-2.113 2.6T7.826 12q-.125.325-.125.663t.25.587l3.125 3.125q.25.25.588.25t.662-.125q1.55-.675 2.95-1.588t2.6-2.112q1.875-1.875 3.025-4.262T21.925 3.5q0-.2-.1-.4t-.25-.35t-.35-.25t-.4-.1m-6.35 7.45q-.575-.575-.575-1.412t.575-1.413t1.413-.575t1.412.575t.575 1.413T17.3 9.85t-1.412.575t-1.413-.575m-2.3 8.35l1 2.325q.2.5.725.6t.9-.275l3.15-3.15q.35-.35.5-.837t.05-.988l-.25-1.3q-1.375 1.15-2.887 2.063T12.175 18.2M4.05 16.05q.875-.875 2.125-.888t2.125.863t.875 2.125t-.875 2.125q-1.2 1.2-2.838 1.425t-3.287.45q.225-1.65.463-3.287T4.05 16.05"/>
+</svg>

package/dist/elements/problem/assets/attributes/inter.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
+    <path d="M174.63 81.37a80 80 0 1 0-93.26 93.26a80 80 0 1 0 93.26-93.26M32 96a64 64 0 0 1 126-16a80.08 80.08 0 0 0-77.95 78A64.11 64.11 0 0 1 32 96m128 128a64.11 64.11 0 0 1-62-48a80.08 80.08 0 0 0 78-78a64 64 0 0 1-16 126"/>
+</svg>

package/dist/elements/problem/assets/attributes/method.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+    <path d="M12.67 13.67c-.47.46-1.04.83-1.67 1.06V23H8v-2H5v-3h3v-3.28c-1.74-.62-3-2.26-3-4.22C5 8 7 6 9.5 6h.1c-.47.95-.68 2-.57 3.08c-.59.2-1.03.76-1.03 1.42c0 .83.67 1.5 1.5 1.5c.23 0 .45-.06.65-.15c.64.84 1.52 1.47 2.52 1.82m8.06 5.77l-2.76 1.16l-.78-1.84l-2.76 1.17l-1.17-2.77L16.03 16l-1.27-3c-1.85.08-3.65-.95-4.41-2.75c-.96-2.29.12-4.93 2.41-5.9c.24-.1.5-.17.74-.23C12.84 2.87 11.5 2 10 2C7.79 2 6 3.79 6 6v.24c-.3.26-.6.58-.85.91C5.06 6.78 5 6.4 5 6c0-2.76 2.24-5 5-5s5 2.24 5 5c0 1.42-.6 2.67-1.55 3.57c.42.43 1.05.56 1.63.31c.77-.32 1.12-1.2.8-1.96a1 1 0 0 0-.14-.26C15.9 7.13 16 6.58 16 6c0-.63-.1-1.24-.28-1.81c1.28.36 2.38 1.25 2.93 2.57c.76 1.8.24 3.81-1.15 5.05zM13 8.6c.37-.41.65-.89.82-1.42c-.54.27-.85.82-.82 1.42"/>
+</svg>

package/dist/elements/problem/assets/attributes/pretty.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g fill="none" fill-rule="evenodd"><path d="m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z"/><path fill="currentColor" d="M17 3a2 2 0 0 1 1.492.668l.108.132l3.704 4.939a2 2 0 0 1-.012 2.416l-.108.13l-9.259 10.184a1.25 1.25 0 0 1-1.753.096l-.097-.096l-9.259-10.185a2 2 0 0 1-.215-2.407l.095-.138L5.4 3.8a2 2 0 0 1 1.43-.793L7 3zm-2.477 8H9.477L12 17.307zm5.217 0h-3.063l-2.406 6.015zM7.323 11H4.261l5.468 6.015zm5.059-6h-.764l-2 4h4.764zM17 5h-2.382l2 4H20zM9.382 5H7L4 9h3.382z"/></g></svg>

package/dist/elements/problem/assets/icon.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 800">
+  <path d="M400,715.16c-43.6,0-84.57-8.27-122.91-24.82-38.34-16.55-71.7-39-100.06-67.37-28.36-28.36-50.82-61.72-67.37-100.06-16.55-38.34-24.82-79.32-24.82-122.91s8.27-84.57,24.82-122.91c16.55-38.34,39-71.7,67.37-100.06,28.36-28.36,61.72-50.82,100.06-67.37,38.34-16.55,79.32-24.82,122.91-24.82,34.14,0,66.45,4.99,96.91,14.97,30.47,9.98,58.57,23.9,84.31,41.76l-45.7,46.49c-19.96-12.61-41.23-22.46-63.82-29.55-22.59-7.09-46.49-10.64-71.7-10.64-69.86,0-129.35,24.56-178.46,73.67-49.11,49.11-73.67,108.6-73.67,178.46s24.56,129.35,73.67,178.46c49.11,49.11,108.6,73.67,178.46,73.67s129.35-24.56,178.46-73.67c49.11-49.11,73.67-108.6,73.67-178.46,0-9.45-.53-18.91-1.58-28.36-1.05-9.45-2.63-18.65-4.73-27.58l51.21-51.21c5.78,16.81,10.24,34.14,13.39,52,3.15,17.86,4.73,36.24,4.73,55.15,0,43.6-8.27,84.57-24.82,122.91-16.55,38.34-39,71.7-67.37,100.06-28.36,28.36-61.72,50.82-100.06,67.37-38.34,16.55-79.32,24.82-122.91,24.82ZM355.88,544.97l-133.94-133.94,44.12-44.12,89.82,89.82,315.16-315.95,44.12,44.12-359.29,360.07Z"/>
+</svg>

package/dist/elements/problem/components/Problem.vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+import type { ProseElement } from '@jsprose/core';
+
+import { problemSchema } from '../problem.js';
+import Block from '../../../app/shared/block/Block.vue';
+import ProblemContainer from './ProblemContainer.vue';
+import ProblemHeader from './ProblemHeader.vue';
+import ProblemContent from './ProblemContent.vue';
+
+const { element } = defineProps<{
+    element: ProseElement<typeof problemSchema>;
+}>();
+</script>
+
+<template>
+    <Block :element>
+        <ProblemContainer>
+            <ProblemHeader :info="element.data.info" />
+            <ProblemContent :element :initialElements="element.children" />
+        </ProblemContainer>
+    </Block>
+</template>

package/dist/elements/problem/components/ProblemButton.vue

@@ -0,0 +1,21 @@
+<script lang="ts" setup>
+defineProps<{ active?: boolean }>();
+</script>
+
+<template>
+    <button
+        :class="[
+            `bg-bg-main border-border/80 text-main-xs min-w-[50px]
+            cursor-pointer rounded border px-2.5 py-[5px] font-semibold shadow
+            shadow-[light-dark(#d9d9d9,#3c3c3c)]
+            transition-[color,background,border,box-shadow]`,
+            {
+                'border-brand/50 bg-brand/10 text-brand': active,
+                ['text-text-muted hocus:text-brand hocus:border-brand/50']:
+                    !active,
+            },
+        ]"
+    >
+        <slot></slot>
+    </button>
+</template>