react-cheminfo 0.3.0 → 0.4.1

package/lib/pedagogy/ui/ReferenceSectionBlock.js

@@ -0,0 +1,78 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { SyntaxTooltip } from "./SyntaxTooltip.js";
+/**
+ * A titled block of reference rows.
+ *
+ * The rows are spans in a flex column rather than a table: a tooltip target is
+ * wrapped in a `<span>`, which a browser hoists straight out of a `<tbody>`,
+ * and a table also breaks across pages far worse than a column does.
+ * @param props - The section, and how wide its syntax column is.
+ * @returns The block, kept whole across a page break.
+ */
+export function ReferenceSectionBlock(props) {
+    const { section, syntaxWidth = 150, className } = props;
+    return (_jsxs("section", { id: section.id, className: blockClassName(section, className), style: SECTION_STYLE, children: [_jsx("h4", { style: headingStyle(section.color), children: section.title }), section.intro !== undefined && (_jsx("p", { style: INTRO_STYLE, children: section.intro })), section.rows.map((row) => (_jsx(ReferenceRowLine, { row: row, width: syntaxWidth }, row.syntax)))] }));
+}
+function ReferenceRowLine(props) {
+    const { row, width } = props;
+    const interactive = row.tooltip !== undefined;
+    const line = (_jsxs("span", { style: interactive ? INTERACTIVE_ROW_STYLE : ROW_STYLE, children: [_jsx("span", { style: syntaxStyle(width, interactive), children: row.syntax }), _jsx("span", { style: DESCRIPTION_STYLE, children: row.description })] }));
+    if (row.tooltip === undefined)
+        return line;
+    return (_jsx(SyntaxTooltip, { content: row.tooltip, placement: "right", children: line }));
+}
+function blockClassName(section, className) {
+    const names = ['reference-section'];
+    if (section.noPrint === true)
+        names.push('no-print');
+    if (className !== undefined)
+        names.push(className);
+    return names.join(' ');
+}
+function headingStyle(color) {
+    return {
+        margin: '0 0 4px',
+        paddingBottom: 2,
+        fontSize: 13,
+        ...(color === undefined
+            ? {}
+            : { color, borderBottom: `2px solid ${color}` }),
+    };
+}
+function syntaxStyle(width, interactive) {
+    return {
+        flex: `0 0 ${typeof width === 'number' ? `${width}px` : width}`,
+        fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Consolas, monospace',
+        fontSize: 12,
+        fontWeight: 600,
+        color: '#1c2127',
+        ...(interactive
+            ? { borderBottom: '1px dotted #5b6875', alignSelf: 'flex-start' }
+            : {}),
+    };
+}
+const SECTION_STYLE = {
+    display: 'flex',
+    flexDirection: 'column',
+    breakInside: 'avoid',
+};
+const INTRO_STYLE = {
+    margin: '0 0 4px',
+    color: '#5b6875',
+    fontSize: 12,
+};
+const ROW_STYLE = {
+    display: 'flex',
+    gap: 8,
+    padding: '3px 0',
+    borderTop: '1px solid #e5e7eb',
+    width: '100%',
+};
+const INTERACTIVE_ROW_STYLE = { ...ROW_STYLE, cursor: 'help' };
+const DESCRIPTION_STYLE = {
+    flex: '1 1 auto',
+    fontSize: 12,
+    lineHeight: 1.4,
+    color: '#404854',
+};
+//# sourceMappingURL=ReferenceSectionBlock.js.map

package/lib/pedagogy/ui/ReferenceSectionBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReferenceSectionBlock.js","sourceRoot":"","sources":["../../../src/pedagogy/ui/ReferenceSectionBlock.tsx"],"names":[],"mappings":"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"}

package/lib/pedagogy/ui/SyntaxTooltip.d.ts

@@ -0,0 +1,94 @@
+import type { Placement } from '@blueprintjs/core';
+import type { ReactElement, ReactNode } from 'react';
+/** The one worked example a documented construct carries. */
+export interface SyntaxTooltipExample {
+    /** The construct in use: a pattern, a SMILES, a LaTeX fragment, a layer. */
+    code: string;
+    /**
+     * What it is shown working on, for a construct whose example takes an input.
+     * @default undefined — the example is about notation only
+     */
+    input?: string;
+    /**
+     * What the example demonstrates, in one line.
+     * @default undefined
+     */
+    note?: string;
+}
+/** Everything the rich tooltip says about one construct. */
+export interface SyntaxTooltipContent {
+    /** The construct itself, shown in the highlighted chip. */
+    syntax: string;
+    /** Its name, in words: `Word boundary`, `Aromatic atom`, `Layer /c`. */
+    name: string;
+    /**
+     * Where it comes from, in small grey type: `RegExp.prototype.global`.
+     * @default undefined
+     */
+    tag?: string;
+    /** The one-line headline. */
+    summary: string;
+    /** The longer story, in a sentence or two. */
+    detail: string;
+    example: SyntaxTooltipExample;
+}
+export interface SyntaxTooltipProps {
+    /** What to explain. */
+    content: SyntaxTooltipContent;
+    /** What the student hovers: a cheatsheet row, a chip, a help icon. */
+    children: ReactNode;
+    /**
+     * Side the tooltip opens on. A cheatsheet row opens to its right, a chip in
+     * a toolbar below itself.
+     * @default 'bottom'
+     */
+    placement?: Placement;
+    /**
+     * Label of the example's code line.
+     * @default 'Example'
+     */
+    codeLabel?: string;
+    /**
+     * Label of the example's input line.
+     * @default 'Input'
+     */
+    inputLabel?: string;
+    /**
+     * Holds the tooltip open regardless of the pointer, for a page that pins one
+     * open on click and for showing the body on its own.
+     * @default undefined — the tooltip follows the pointer
+     */
+    isOpen?: boolean;
+}
+/**
+ * The one rich tooltip of a tool: cheatsheet rows, option chips and inline help
+ * icons all open this, so every documented construct is described at the same
+ * level of detail and adding a construct means adding the same five fields.
+ * @param props - The construct, and what opens it.
+ * @returns The hovered element, with its tooltip.
+ */
+export declare function SyntaxTooltip(props: SyntaxTooltipProps): ReactElement;
+export interface SyntaxTooltipBodyProps {
+    /** What to explain. */
+    content: SyntaxTooltipContent;
+    /**
+     * Label of the example's code line.
+     * @default 'Example'
+     */
+    codeLabel?: string;
+    /**
+     * Label of the example's input line.
+     * @default 'Input'
+     */
+    inputLabel?: string;
+}
+/**
+ * The body of the rich tooltip, on its own.
+ *
+ * A reference page that prints the same description under each construct shows
+ * this rather than restating the fields in a second layout.
+ * @param props - The construct, and how its example is labelled.
+ * @returns The body.
+ */
+export declare function SyntaxTooltipBody(props: SyntaxTooltipBodyProps): ReactElement;
+//# sourceMappingURL=SyntaxTooltip.d.ts.map

package/lib/pedagogy/ui/SyntaxTooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SyntaxTooltip.d.ts","sourceRoot":"","sources":["../../../src/pedagogy/ui/SyntaxTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEnD,OAAO,KAAK,EAAiB,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEpE,6DAA6D;AAC7D,MAAM,WAAW,oBAAoB;IACnC,4EAA4E;IAC5E,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,4DAA4D;AAC5D,MAAM,WAAW,oBAAoB;IACnC,2DAA2D;IAC3D,MAAM,EAAE,MAAM,CAAC;IACf,wEAAwE;IACxE,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,6BAA6B;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,8CAA8C;IAC9C,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,oBAAoB,CAAC;CAC/B;AAED,MAAM,WAAW,kBAAkB;IACjC,uBAAuB;IACvB,OAAO,EAAE,oBAAoB,CAAC;IAC9B,sEAAsE;IACtE,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CA0BrE;AAED,MAAM,WAAW,sBAAsB;IACrC,uBAAuB;IACvB,OAAO,EAAE,oBAAoB,CAAC;IAC9B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,YAAY,CA8B7E"}

package/lib/pedagogy/ui/SyntaxTooltip.js

@@ -0,0 +1,79 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tooltip } from '@blueprintjs/core';
+/**
+ * The one rich tooltip of a tool: cheatsheet rows, option chips and inline help
+ * icons all open this, so every documented construct is described at the same
+ * level of detail and adding a construct means adding the same five fields.
+ * @param props - The construct, and what opens it.
+ * @returns The hovered element, with its tooltip.
+ */
+export function SyntaxTooltip(props) {
+    const { content, children, placement = 'bottom', codeLabel, inputLabel, isOpen, } = props;
+    return (_jsx(Tooltip, { content: _jsx(SyntaxTooltipBody, { content: content, codeLabel: codeLabel, inputLabel: inputLabel }), hoverOpenDelay: HOVER_OPEN_DELAY, placement: placement, isOpen: isOpen, children: children }));
+}
+/**
+ * The body of the rich tooltip, on its own.
+ *
+ * A reference page that prints the same description under each construct shows
+ * this rather than restating the fields in a second layout.
+ * @param props - The construct, and how its example is labelled.
+ * @returns The body.
+ */
+export function SyntaxTooltipBody(props) {
+    const { content, codeLabel = 'Example', inputLabel = 'Input' } = props;
+    const { syntax, name, tag, summary, detail, example } = content;
+    return (_jsxs("div", { style: BODY_STYLE, children: [_jsxs("div", { style: HEADER_STYLE, children: [_jsx("code", { style: SYNTAX_STYLE, children: syntax }), _jsx("span", { style: NAME_STYLE, children: name }), tag !== undefined && _jsx("span", { style: TAG_STYLE, children: tag })] }), _jsx("div", { style: SUMMARY_STYLE, children: summary }), _jsx("div", { style: DETAIL_STYLE, children: detail }), _jsxs("div", { style: EXAMPLE_STYLE, children: [_jsxs("div", { style: ROW_STYLE, children: [_jsx("span", { style: LABEL_STYLE, children: codeLabel }), _jsx("code", { style: VALUE_STYLE, children: example.code })] }), example.input !== undefined && (_jsxs("div", { style: ROW_STYLE, children: [_jsx("span", { style: LABEL_STYLE, children: inputLabel }), _jsx("code", { style: VALUE_STYLE, children: example.input })] })), example.note !== undefined && (_jsx("div", { style: NOTE_STYLE, children: example.note }))] })] }));
+}
+/** Long enough that the pointer can cross a row without opening it. */
+const HOVER_OPEN_DELAY = 150;
+const MONOSPACE = 'ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';
+const BODY_STYLE = {
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 6,
+    maxWidth: 360,
+};
+const HEADER_STYLE = {
+    display: 'flex',
+    alignItems: 'baseline',
+    flexWrap: 'wrap',
+    gap: 6,
+};
+const SYNTAX_STYLE = {
+    background: 'rgb(255 255 255 / 15%)',
+    borderRadius: 3,
+    color: '#ffffff',
+    fontFamily: MONOSPACE,
+    fontSize: 14,
+    fontWeight: 600,
+    padding: '1px 6px',
+};
+const NAME_STYLE = { fontWeight: 600, fontSize: 13 };
+const TAG_STYLE = { color: '#abb3bf', fontSize: 11 };
+const SUMMARY_STYLE = { fontSize: 12, lineHeight: 1.4 };
+const DETAIL_STYLE = {
+    color: '#d3d8de',
+    fontSize: 12,
+    lineHeight: 1.45,
+};
+const EXAMPLE_STYLE = {
+    borderTop: '1px solid rgb(255 255 255 / 15%)',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 2,
+    paddingTop: 6,
+};
+const ROW_STYLE = { display: 'flex', gap: 6, fontSize: 12 };
+const LABEL_STYLE = { color: '#abb3bf', flex: '0 0 68px' };
+const VALUE_STYLE = {
+    color: '#f6f7f9',
+    fontFamily: MONOSPACE,
+    overflowWrap: 'anywhere',
+};
+const NOTE_STYLE = {
+    color: '#abb3bf',
+    fontSize: 12,
+    fontStyle: 'italic',
+    marginTop: 2,
+};
+//# sourceMappingURL=SyntaxTooltip.js.map

package/lib/pedagogy/ui/SyntaxTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SyntaxTooltip.js","sourceRoot":"","sources":["../../../src/pedagogy/ui/SyntaxTooltip.tsx"],"names":[],"mappings":"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"}

package/lib/pedagogy/ui/TestCaseList.d.ts

@@ -0,0 +1,35 @@
+import type { ReactElement, ReactNode } from 'react';
+import type { TestCaseResult } from '../core/validation.ts';
+export interface TestCaseListProps<TCase extends TestCaseResult = TestCaseResult> {
+    /** The graded cases, in the order the validator returned them. */
+    results: readonly TCase[];
+    /**
+     * What names a case: the input it was run on, the atom it asked about. A
+     * tool that carries no such name lets the sentence speak for itself.
+     * @default undefined — the row shows only the reason
+     */
+    label?: (result: TCase, position: number) => ReactNode;
+    /**
+     * Whether the answer could not be graded at all — it does not compile, or
+     * there is nothing to mark yet. Every case is then drawn neutral rather than
+     * red, since none of them actually failed.
+     * @default false
+     */
+    pending?: boolean;
+    /**
+     * Class the list carries, so a site can reach it from its stylesheet.
+     * @default undefined
+     */
+    className?: string;
+}
+/**
+ * One row per graded case: whether it passes, and the sentence saying why not.
+ *
+ * The sentence is the validator's own — `match was "cat", expected "cats"` —
+ * and is never rewritten here: the explanation is the teaching, and a
+ * paraphrase would drop the value the student has to compare.
+ * @param props - The cases, and whether they could be graded at all.
+ * @returns The list, or nothing when there is no case to show.
+ */
+export declare function TestCaseList<TCase extends TestCaseResult>(props: TestCaseListProps<TCase>): ReactElement | null;
+//# sourceMappingURL=TestCaseList.d.ts.map

package/lib/pedagogy/ui/TestCaseList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TestCaseList.d.ts","sourceRoot":"","sources":["../../../src/pedagogy/ui/TestCaseList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEpE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAE5D,MAAM,WAAW,iBAAiB,CAChC,KAAK,SAAS,cAAc,GAAG,cAAc;IAE7C,kEAAkE;IAClE,OAAO,EAAE,SAAS,KAAK,EAAE,CAAC;IAC1B;;;;OAIG;IACH,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,SAAS,CAAC;IACvD;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAAC,KAAK,SAAS,cAAc,EACvD,KAAK,EAAE,iBAAiB,CAAC,KAAK,CAAC,GAC9B,YAAY,GAAG,IAAI,CA8BrB"}

package/lib/pedagogy/ui/TestCaseList.js

@@ -0,0 +1,63 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from '@blueprintjs/core';
+/**
+ * One row per graded case: whether it passes, and the sentence saying why not.
+ *
+ * The sentence is the validator's own — `match was "cat", expected "cats"` —
+ * and is never rewritten here: the explanation is the teaching, and a
+ * paraphrase would drop the value the student has to compare.
+ * @param props - The cases, and whether they could be graded at all.
+ * @returns The list, or nothing when there is no case to show.
+ */
+export function TestCaseList(props) {
+    const { results, label, pending = false, className } = props;
+    if (results.length === 0)
+        return null;
+    const rows = [];
+    for (let position = 0; position < results.length; position++) {
+        const result = results[position];
+        rows.push(_jsxs("li", { style: itemStyle(result.passed, pending), children: [_jsx(Icon, { icon: caseIcon(result.passed, pending), intent: caseIntent(result.passed, pending) }), _jsxs("span", { children: [label !== undefined && (_jsx("strong", { style: LABEL_STYLE, children: label(result, position) })), result.reason !== '' && (_jsx("span", { style: REASON_STYLE, children: result.reason }))] })] }, `case-${position}`));
+    }
+    return (_jsx("ul", { className: className, style: LIST_STYLE, children: rows }));
+}
+function caseIcon(passed, pending) {
+    if (passed)
+        return 'tick-circle';
+    return pending ? 'circle' : 'cross-circle';
+}
+function caseIntent(passed, pending) {
+    if (passed)
+        return 'success';
+    return pending ? 'none' : 'danger';
+}
+function itemStyle(passed, pending) {
+    const failed = !passed && !pending;
+    return {
+        display: 'flex',
+        alignItems: 'start',
+        gap: 8,
+        padding: '4px 8px',
+        borderRadius: 3,
+        borderLeft: `3px solid ${passed ? '#1c6e42' : failed ? '#cd4246' : '#c5cbd3'}`,
+        background: passed
+            ? 'rgb(236 253 245)'
+            : failed
+                ? 'rgb(254 243 242)'
+                : 'rgb(245 248 250)',
+    };
+}
+const LIST_STYLE = {
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 4,
+    listStyle: 'none',
+    margin: 0,
+    padding: 0,
+};
+const LABEL_STYLE = { marginRight: 6 };
+const REASON_STYLE = {
+    display: 'block',
+    color: 'rgb(65 75 90)',
+    lineHeight: 1.4,
+};
+//# sourceMappingURL=TestCaseList.js.map

package/lib/pedagogy/ui/TestCaseList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TestCaseList.js","sourceRoot":"","sources":["../../../src/pedagogy/ui/TestCaseList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AA8BzC;;;;;;;;GAQG;AACH,MAAM,UAAU,YAAY,CAC1B,KAA+B;IAE/B,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,GAAG,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC7D,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAC;IAEtC,MAAM,IAAI,GAAgB,EAAE,CAAC;IAC7B,KAAK,IAAI,QAAQ,GAAG,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE,CAAC;QAC7D,MAAM,MAAM,GAAG,OAAO,CAAC,QAAQ,CAAU,CAAC;QAC1C,IAAI,CAAC,IAAI,CACP,cAA6B,KAAK,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,aACnE,KAAC,IAAI,IACH,IAAI,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACtC,MAAM,EAAE,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAC1C,EACF,2BACG,KAAK,KAAK,SAAS,IAAI,CACtB,iBAAQ,KAAK,EAAE,WAAW,YAAG,KAAK,CAAC,MAAM,EAAE,QAAQ,CAAC,GAAU,CAC/D,EACA,MAAM,CAAC,MAAM,KAAK,EAAE,IAAI,CACvB,eAAM,KAAK,EAAE,YAAY,YAAG,MAAM,CAAC,MAAM,GAAQ,CAClD,IACI,KAZA,QAAQ,QAAQ,EAAE,CAatB,CACN,CAAC;IACJ,CAAC;IAED,OAAO,CACL,aAAI,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,YACxC,IAAI,GACF,CACN,CAAC;AACJ,CAAC;AAED,SAAS,QAAQ,CACf,MAAe,EACf,OAAgB;IAEhB,IAAI,MAAM;QAAE,OAAO,aAAa,CAAC;IACjC,OAAO,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC;AAC7C,CAAC;AAED,SAAS,UAAU,CACjB,MAAe,EACf,OAAgB;IAEhB,IAAI,MAAM;QAAE,OAAO,SAAS,CAAC;IAC7B,OAAO,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC;AACrC,CAAC;AAED,SAAS,SAAS,CAAC,MAAe,EAAE,OAAgB;IAClD,MAAM,MAAM,GAAG,CAAC,MAAM,IAAI,CAAC,OAAO,CAAC;IACnC,OAAO;QACL,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,OAAO;QACnB,GAAG,EAAE,CAAC;QACN,OAAO,EAAE,SAAS;QAClB,YAAY,EAAE,CAAC;QACf,UAAU,EAAE,aAAa,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE;QAC9E,UAAU,EAAE,MAAM;YAChB,CAAC,CAAC,kBAAkB;YACpB,CAAC,CAAC,MAAM;gBACN,CAAC,CAAC,kBAAkB;gBACpB,CAAC,CAAC,kBAAkB;KACzB,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,GAAkB;IAChC,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,QAAQ;IACvB,GAAG,EAAE,CAAC;IACN,SAAS,EAAE,MAAM;IACjB,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,CAAC;CACX,CAAC;AAEF,MAAM,WAAW,GAAkB,EAAE,WAAW,EAAE,CAAC,EAAE,CAAC;AAEtD,MAAM,YAAY,GAAkB;IAClC,OAAO,EAAE,OAAO;IAChB,KAAK,EAAE,eAAe;IACtB,UAAU,EAAE,GAAG;CAChB,CAAC"}

package/lib/pedagogy/ui/TutorialStepStrip.d.ts

@@ -0,0 +1,42 @@
+import type { ReactElement, ReactNode } from 'react';
+import type { ExerciseLevel, TutorialStep } from '../core/types.ts';
+export interface TutorialStepStripProps {
+    /** The whole tour, in teaching order. */
+    steps: readonly TutorialStep[];
+    /**
+     * Which step is open, as its position in `steps`. A position outside the
+     * tour is read as one of its ends, so a hand-edited link still opens.
+     */
+    activeIndex: number;
+    /** Called with the position of the step to open. */
+    onSelect: (index: number) => void;
+    /**
+     * What each strip is called — `Basics`, `π bonds, planarity, conjugation`.
+     * @default undefined — the level names its own strip
+     */
+    levelLabels?: Partial<Record<ExerciseLevel, string>>;
+    /**
+     * Whether Previous and Next sit under the strips. Both exist on purpose: the
+     * strips show the shape of the course and let a lecturer jump into it, the
+     * pager is how a student actually walks through it.
+     * @default true
+     */
+    pager?: boolean;
+    /**
+     * A word after the pager, for a tool whose steps also answer the keyboard.
+     * @default undefined
+     */
+    pagerHint?: ReactNode;
+    /**
+     * Class the strips carry, so a site can reach them from its stylesheet.
+     * @default undefined
+     */
+    className?: string;
+}
+/**
+ * The numbered steps of the tour, one coloured strip per level, plus a pager.
+ * @param props - The tour, the open step, and how to move.
+ * @returns The strips and the pager.
+ */
+export declare function TutorialStepStrip(props: TutorialStepStripProps): ReactElement;
+//# sourceMappingURL=TutorialStepStrip.d.ts.map

package/lib/pedagogy/ui/TutorialStepStrip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TutorialStepStrip.d.ts","sourceRoot":"","sources":["../../../src/pedagogy/ui/TutorialStepStrip.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEpE,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAMpE,MAAM,WAAW,sBAAsB;IACrC,yCAAyC;IACzC,KAAK,EAAE,SAAS,YAAY,EAAE,CAAC;IAC/B;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB,oDAAoD;IACpD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC;IACrD;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,YAAY,CA6D7E"}

package/lib/pedagogy/ui/TutorialStepStrip.js

@@ -0,0 +1,98 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Tag, Tooltip } from '@blueprintjs/core';
+import { LEVEL_ORDER } from "./exerciseMeta.js";
+import { TUTORIAL_LEVEL_COLOURS } from "./tutorialLevels.js";
+/**
+ * The numbered steps of the tour, one coloured strip per level, plus a pager.
+ * @param props - The tour, the open step, and how to move.
+ * @returns The strips and the pager.
+ */
+export function TutorialStepStrip(props) {
+    const { steps, activeIndex, onSelect, levelLabels, pager = true, pagerHint, className, } = props;
+    const active = clampIndex(activeIndex, steps.length);
+    return (_jsxs("div", { className: className, style: ROOT_STYLE, children: [LEVEL_ORDER.map((level) => {
+                const positions = positionsOfLevel(steps, level);
+                if (positions.length === 0)
+                    return null;
+                return (_jsx(LevelStrip, { steps: steps, positions: positions, colours: TUTORIAL_LEVEL_COLOURS[level], label: levelLabels?.[level] ?? level, activeIndex: active, onSelect: onSelect }, level));
+            }), pager && (_jsxs("div", { style: PAGER_STYLE, children: [_jsx(Button, { size: "small", icon: "chevron-left", text: "Previous", disabled: active === 0, onClick: () => {
+                            onSelect(active - 1);
+                        } }), _jsx(Tag, { minimal: true, round: true, children: `Step ${active + 1} of ${steps.length}` }), _jsx(Button, { size: "small", endIcon: "chevron-right", text: "Next", intent: "primary", disabled: active >= steps.length - 1, onClick: () => {
+                            onSelect(active + 1);
+                        } }), pagerHint !== undefined && (_jsx("span", { style: HINT_STYLE, children: pagerHint }))] }))] }));
+}
+function LevelStrip(props) {
+    const { steps, positions, colours, label, activeIndex, onSelect } = props;
+    const buttons = [];
+    for (const position of positions) {
+        const step = steps[position];
+        const active = position === activeIndex;
+        buttons.push(_jsx(Tooltip, { content: step.title, hoverOpenDelay: HOVER_OPEN_DELAY, placement: "bottom", children: _jsx("button", { type: "button", "aria-label": `Step ${position + 1}: ${step.title}`, "aria-current": active ? 'step' : undefined, style: numberStyle(colours, active), onClick: () => {
+                    onSelect(position);
+                }, children: position + 1 }) }, step.id));
+    }
+    return (_jsxs("div", { style: { ...STRIP_STYLE, background: colours.background }, children: [_jsx("span", { style: LABEL_STYLE, children: label }), buttons] }));
+}
+function positionsOfLevel(steps, level) {
+    const positions = [];
+    for (let index = 0; index < steps.length; index++) {
+        if (steps[index]?.level === level)
+            positions.push(index);
+    }
+    return positions;
+}
+function clampIndex(index, total) {
+    if (!Number.isFinite(index) || index <= 0)
+        return 0;
+    return Math.min(Math.floor(index), Math.max(total - 1, 0));
+}
+/**
+ * The open step takes the darker shade of its own level, plus a border.
+ * @param colours - The two shades of the level the step belongs to.
+ * @param active - Whether this is the step on screen.
+ * @returns The style of one numbered button.
+ */
+function numberStyle(colours, active) {
+    return {
+        background: active ? colours.activeBackground : '#ffffff',
+        border: active ? '2px solid #1c2127' : '1px solid rgb(17 20 24 / 20%)',
+        borderRadius: 4,
+        color: '#1c2127',
+        cursor: 'pointer',
+        font: 'inherit',
+        fontSize: 12,
+        fontWeight: active ? 700 : 500,
+        lineHeight: 1,
+        minWidth: 26,
+        padding: active ? '5px 6px' : '6px 7px',
+    };
+}
+/** Long enough that the pointer can cross the strip without opening a title. */
+const HOVER_OPEN_DELAY = 150;
+const ROOT_STYLE = {
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 4,
+};
+const STRIP_STYLE = {
+    display: 'flex',
+    flexWrap: 'wrap',
+    alignItems: 'center',
+    gap: 4,
+    borderRadius: 4,
+    padding: '4px 6px',
+};
+const LABEL_STYLE = {
+    flex: '0 0 220px',
+    fontSize: 12,
+    fontWeight: 600,
+    color: '#1c2127',
+};
+const PAGER_STYLE = {
+    display: 'flex',
+    alignItems: 'center',
+    gap: 8,
+    paddingTop: 2,
+};
+const HINT_STYLE = { color: '#5b6875', fontSize: 11 };
+//# sourceMappingURL=TutorialStepStrip.js.map

package/lib/pedagogy/ui/TutorialStepStrip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TutorialStepStrip.js","sourceRoot":"","sources":["../../../src/pedagogy/ui/TutorialStepStrip.tsx"],"names":[],"mappings":"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"}

package/lib/pedagogy/ui/exerciseMeta.d.ts

@@ -0,0 +1,24 @@
+/**
+ * What a level and a status look like, in one place.
+ *
+ * A level means the same thing in the tutorial, in the exercise list and on the
+ * cheatsheet, so it is coloured from here rather than decided again per page.
+ */
+import type { IconName, Intent } from '@blueprintjs/core';
+import type { ExerciseLevel, ExerciseStatus } from '../core/types.ts';
+/** Green for a beginner, amber for an intermediate, red for an advanced one. */
+export declare const LEVEL_INTENT: Record<ExerciseLevel, Intent>;
+/** The three levels in teaching order, for a page listing all of them. */
+export declare const LEVEL_ORDER: readonly ExerciseLevel[];
+/** An empty circle, a warning sign, a tick: untouched, handed in, right. */
+export declare const STATUS_ICON: Record<ExerciseStatus, IconName>;
+/**
+ * Colour per status.
+ *
+ * `idle` is the one uncoloured value in the package: an exercise nobody has
+ * opened has nothing to report, and painting it would make a fresh list read as
+ * a list of mistakes. Every other value keeps its colour wherever it is shown,
+ * including on a tag that is switched off.
+ */
+export declare const STATUS_INTENT: Record<ExerciseStatus, Intent>;
+//# sourceMappingURL=exerciseMeta.d.ts.map

package/lib/pedagogy/ui/exerciseMeta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"exerciseMeta.d.ts","sourceRoot":"","sources":["../../../src/pedagogy/ui/exerciseMeta.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE1D,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEtE,gFAAgF;AAChF,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,CAItD,CAAC;AAEF,0EAA0E;AAC1E,eAAO,MAAM,WAAW,EAAE,SAAS,aAAa,EAI/C,CAAC;AAEF,4EAA4E;AAC5E,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,cAAc,EAAE,QAAQ,CAIxD,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAIxD,CAAC"}

package/lib/pedagogy/ui/exerciseMeta.js

@@ -0,0 +1,38 @@
+/**
+ * What a level and a status look like, in one place.
+ *
+ * A level means the same thing in the tutorial, in the exercise list and on the
+ * cheatsheet, so it is coloured from here rather than decided again per page.
+ */
+/** Green for a beginner, amber for an intermediate, red for an advanced one. */
+export const LEVEL_INTENT = {
+    beginner: 'success',
+    intermediate: 'warning',
+    advanced: 'danger',
+};
+/** The three levels in teaching order, for a page listing all of them. */
+export const LEVEL_ORDER = [
+    'beginner',
+    'intermediate',
+    'advanced',
+];
+/** An empty circle, a warning sign, a tick: untouched, handed in, right. */
+export const STATUS_ICON = {
+    idle: 'circle',
+    attempted: 'warning-sign',
+    solved: 'tick-circle',
+};
+/**
+ * Colour per status.
+ *
+ * `idle` is the one uncoloured value in the package: an exercise nobody has
+ * opened has nothing to report, and painting it would make a fresh list read as
+ * a list of mistakes. Every other value keeps its colour wherever it is shown,
+ * including on a tag that is switched off.
+ */
+export const STATUS_INTENT = {
+    idle: 'none',
+    attempted: 'warning',
+    solved: 'success',
+};
+//# sourceMappingURL=exerciseMeta.js.map

package/lib/pedagogy/ui/exerciseMeta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"exerciseMeta.js","sourceRoot":"","sources":["../../../src/pedagogy/ui/exerciseMeta.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAMH,gFAAgF;AAChF,MAAM,CAAC,MAAM,YAAY,GAAkC;IACzD,QAAQ,EAAE,SAAS;IACnB,YAAY,EAAE,SAAS;IACvB,QAAQ,EAAE,QAAQ;CACnB,CAAC;AAEF,0EAA0E;AAC1E,MAAM,CAAC,MAAM,WAAW,GAA6B;IACnD,UAAU;IACV,cAAc;IACd,UAAU;CACX,CAAC;AAEF,4EAA4E;AAC5E,MAAM,CAAC,MAAM,WAAW,GAAqC;IAC3D,IAAI,EAAE,QAAQ;IACd,SAAS,EAAE,cAAc;IACzB,MAAM,EAAE,aAAa;CACtB,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,aAAa,GAAmC;IAC3D,IAAI,EAAE,MAAM;IACZ,SAAS,EAAE,SAAS;IACpB,MAAM,EAAE,SAAS;CAClB,CAAC"}

package/lib/pedagogy/ui/glossaryContext.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Where the terms a site defines are kept while the page is open.
+ *
+ * Prose is rendered deep inside a card, a callout or a tooltip, and threading
+ * the glossary down to each of those as a prop is what makes a site stop
+ * linking its jargon. It is read from the surrounding provider instead.
+ */
+import type { Glossary } from '../core/glossary.ts';
+/**
+ * The glossary the surrounding provider holds.
+ * @returns Every term the site defines, and no term at all when nothing wraps
+ * the tree — prose then renders its markers as plain words.
+ */
+export declare function useGlossary(): Glossary;
+/** Holder of the glossary, written by `GlossaryProvider` and read by prose. */
+export declare const GlossaryContext: import("react").Context<Glossary>;
+//# sourceMappingURL=glossaryContext.d.ts.map

package/lib/pedagogy/ui/glossaryContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"glossaryContext.d.ts","sourceRoot":"","sources":["../../../src/pedagogy/ui/glossaryContext.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAEpD;;;;GAIG;AACH,wBAAgB,WAAW,IAAI,QAAQ,CAEtC;AAED,+EAA+E;AAC/E,eAAO,MAAM,eAAe,mCAA8B,CAAC"}