myst-to-react 0.2.9 → 0.3.0

package/dist/esm/admonitions.js

@@ -0,0 +1,146 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import InformationCircleIcon from '@heroicons/react/24/outline/InformationCircleIcon';
+import OExclamationIcon from '@heroicons/react/24/outline/ExclamationCircleIcon';
+import MegaphoneIcon from '@heroicons/react/24/outline/MegaphoneIcon';
+import PencilSquareIcon from '@heroicons/react/24/outline/PencilSquareIcon';
+import ArrowRightCircleIcon from '@heroicons/react/24/outline/ArrowRightCircleIcon';
+import LightBulbIcon from '@heroicons/react/24/outline/LightBulbIcon';
+import SExclamationIcon from '@heroicons/react/24/solid/ExclamationTriangleIcon';
+import SExclamationCircleIcon from '@heroicons/react/24/solid/ExclamationCircleIcon';
+import XCircleIcon from '@heroicons/react/24/solid/XCircleIcon';
+import BoltIcon from '@heroicons/react/24/solid/BoltIcon';
+import ChevronRightIcon from '@heroicons/react/24/solid/ChevronRightIcon';
+import classNames from 'classnames';
+// import { AdmonitionKind } from 'myst-common';
+// TODO: get this from myst-spec?
+export var AdmonitionKind;
+(function (AdmonitionKind) {
+    AdmonitionKind["admonition"] = "admonition";
+    AdmonitionKind["attention"] = "attention";
+    AdmonitionKind["caution"] = "caution";
+    AdmonitionKind["danger"] = "danger";
+    AdmonitionKind["error"] = "error";
+    AdmonitionKind["important"] = "important";
+    AdmonitionKind["hint"] = "hint";
+    AdmonitionKind["note"] = "note";
+    AdmonitionKind["seealso"] = "seealso";
+    AdmonitionKind["tip"] = "tip";
+    AdmonitionKind["warning"] = "warning";
+})(AdmonitionKind || (AdmonitionKind = {}));
+function getClasses(className) {
+    var _a;
+    const classes = (_a = className === null || className === void 0 ? void 0 : className.split(' ').map((s) => s.trim().toLowerCase()).filter((s) => !!s)) !== null && _a !== void 0 ? _a : [];
+    return [...new Set(classes)];
+}
+function getFirstKind({ kind, classes = [], }) {
+    if (kind === AdmonitionKind.note || classes.includes('note')) {
+        return { kind: AdmonitionKind.note, color: 'blue' };
+    }
+    if (kind === AdmonitionKind.important || classes.includes('important')) {
+        return { kind: AdmonitionKind.important, color: 'blue' };
+    }
+    if (kind === AdmonitionKind.hint || classes.includes('hint')) {
+        return { kind: AdmonitionKind.hint, color: 'green' };
+    }
+    if (kind === AdmonitionKind.seealso || classes.includes('seealso')) {
+        return { kind: AdmonitionKind.seealso, color: 'green' };
+    }
+    if (kind === AdmonitionKind.tip || classes.includes('tip')) {
+        return { kind: AdmonitionKind.tip, color: 'green' };
+    }
+    if (kind === AdmonitionKind.attention || classes.includes('attention')) {
+        return { kind: AdmonitionKind.attention, color: 'yellow' };
+    }
+    if (kind === AdmonitionKind.warning || classes.includes('warning')) {
+        return { kind: AdmonitionKind.warning, color: 'yellow' };
+    }
+    if (kind === AdmonitionKind.caution || classes.includes('caution')) {
+        return { kind: AdmonitionKind.caution, color: 'yellow' };
+    }
+    if (kind === AdmonitionKind.danger || classes.includes('danger')) {
+        return { kind: AdmonitionKind.danger, color: 'red' };
+    }
+    if (kind === AdmonitionKind.error || classes.includes('error')) {
+        return { kind: AdmonitionKind.error, color: 'red' };
+    }
+    return { kind: AdmonitionKind.note, color: 'blue' };
+}
+const iconClass = 'h-8 w-8 inline-block pl-2 mr-2 self-center flex-none';
+function AdmonitionIcon({ kind, className }) {
+    const cn = classNames(iconClass, className);
+    if (kind === AdmonitionKind.note)
+        return _jsx(InformationCircleIcon, { className: cn });
+    if (kind === AdmonitionKind.caution)
+        return _jsx(OExclamationIcon, { className: cn });
+    if (kind === AdmonitionKind.warning)
+        return _jsx(SExclamationIcon, { className: cn });
+    if (kind === AdmonitionKind.danger)
+        return _jsx(SExclamationCircleIcon, { className: cn });
+    if (kind === AdmonitionKind.error)
+        return _jsx(XCircleIcon, { className: cn });
+    if (kind === AdmonitionKind.attention)
+        return _jsx(MegaphoneIcon, { className: cn });
+    if (kind === AdmonitionKind.tip)
+        return _jsx(PencilSquareIcon, { className: cn });
+    if (kind === AdmonitionKind.hint)
+        return _jsx(LightBulbIcon, { className: cn });
+    if (kind === AdmonitionKind.important)
+        return _jsx(BoltIcon, { className: cn });
+    if (kind === AdmonitionKind.seealso)
+        return _jsx(ArrowRightCircleIcon, { className: cn });
+    return _jsx(InformationCircleIcon, { className: cn });
+}
+export const AdmonitionTitle = (node, children) => {
+    return children;
+};
+const WrapperElement = ({ dropdown, className, children, }) => {
+    if (dropdown)
+        return _jsx("details", Object.assign({ className: className }, { children: children }));
+    return _jsx("aside", Object.assign({ className: className }, { children: children }));
+};
+const HeaderElement = ({ dropdown, className, children, }) => {
+    if (dropdown)
+        return _jsx("summary", Object.assign({ className: className }, { children: children }));
+    return _jsx("div", Object.assign({ className: className }, { children: children }));
+};
+export function Admonition({ title, kind, color, simple, dropdown, children, hideIcon, }) {
+    return (_jsxs(WrapperElement, Object.assign({ dropdown: dropdown, className: classNames('my-5 shadow-md dark:shadow-2xl dark:shadow-neutral-900', 'bg-gray-50/10 dark:bg-stone-800', 'overflow-hidden', {
+            'rounded border-l-4': !simple,
+            'border-l-2': simple,
+            'border-blue-500': !color || color === 'blue',
+            'border-green-600': color === 'green',
+            'border-amber-600': color === 'yellow',
+            'border-red-600': color === 'red',
+        }) }, { children: [title && (_jsxs(HeaderElement, Object.assign({ dropdown: dropdown, className: classNames('m-0 font-medium py-1 flex min-w-0', {
+                    'text-lg': !simple,
+                    'text-md': simple,
+                    'bg-gray-100 dark:bg-stone-700': simple,
+                    'text-blue-600 bg-blue-50 dark:bg-slate-900': !simple && (!color || color === 'blue'),
+                    'text-green-600 bg-green-50 dark:bg-slate-900': !simple && color === 'green',
+                    'text-amber-600 bg-amber-50 dark:bg-slate-900': !simple && color === 'yellow',
+                    'text-red-600 bg-red-50 dark:bg-slate-900': !simple && color === 'red',
+                    'cursor-pointer hover:shadow-[inset_0_0_0px_30px_#00000003] dark:hover:shadow-[inset_0_0_0px_30px_#FFFFFF03]': dropdown,
+                }) }, { children: [!hideIcon && (_jsx(AdmonitionIcon, { kind: kind !== null && kind !== void 0 ? kind : AdmonitionKind.note, className: classNames({
+                            // Needed for simple!
+                            'text-blue-600': !color || color === 'blue',
+                            'text-green-600': color === 'green',
+                            'text-amber-600': color === 'yellow',
+                            'text-red-600': color === 'red',
+                        }) })), _jsx("div", Object.assign({ className: classNames('text-neutral-900 dark:text-white grow self-center overflow-hidden break-words', { 'ml-4': hideIcon }) }, { children: title })), dropdown && (_jsx("div", Object.assign({ className: "font-thin text-sm text-neutral-700 dark:text-neutral-200 self-center flex-none" }, { children: _jsx(ChevronRightIcon, { className: classNames(iconClass, 'transition-transform details-toggle') }) })))] }))), _jsx("div", Object.assign({ className: classNames('px-4', { 'py-1': !simple, 'details-body': dropdown }) }, { children: children }))] })));
+}
+export const AdmonitionRenderer = (node, children) => {
+    var _a;
+    const [title, ...rest] = children;
+    const classes = getClasses(node.class);
+    const { kind, color } = getFirstKind({ kind: node.kind, classes });
+    const isDropdown = classes.includes('dropdown');
+    const isSimple = classes.includes('simple');
+    const hideIcon = node.icon === false;
+    const useTitle = ((_a = node.children) === null || _a === void 0 ? void 0 : _a[0].type) === 'admonitionTitle';
+    return (_jsxs(Admonition, Object.assign({ title: useTitle ? title : undefined, kind: kind, color: color, dropdown: isDropdown, simple: isSimple, hideIcon: hideIcon }, { children: [!useTitle && title, rest] }), node.key));
+};
+const ADMONITION_RENDERERS = {
+    admonition: AdmonitionRenderer,
+    admonitionTitle: AdmonitionTitle,
+};
+export default ADMONITION_RENDERERS;

package/dist/esm/basic.d.ts

@@ -0,0 +1,64 @@
+import type * as spec from 'myst-spec';
+import type { NodeRenderer } from '@myst-theme/providers';
+type TableExts = {
+    rowspan?: number;
+    colspan?: number;
+};
+type Delete = {
+    type: 'delete';
+};
+type Underline = {
+    type: 'underline';
+};
+type SmallCaps = {
+    type: 'smallcaps';
+};
+type DefinitionList = {
+    type: 'definitionList';
+};
+type DefinitionTerm = {
+    type: 'definitionTerm';
+};
+type DefinitionDescription = {
+    type: 'definitionDescription';
+};
+type CaptionNumber = {
+    type: 'captionNumber';
+    kind: string;
+    identifier: string;
+};
+type BasicNodeRenderers = {
+    strong: NodeRenderer<spec.Strong>;
+    emphasis: NodeRenderer<spec.Emphasis>;
+    link: NodeRenderer<spec.Link>;
+    paragraph: NodeRenderer<spec.Paragraph>;
+    break: NodeRenderer<spec.Break>;
+    inlineMath: NodeRenderer<spec.InlineMath>;
+    math: NodeRenderer<spec.Math>;
+    list: NodeRenderer<spec.List>;
+    listItem: NodeRenderer<spec.ListItem & {
+        checked?: boolean;
+    }>;
+    container: NodeRenderer<spec.Container>;
+    caption: NodeRenderer<spec.Caption>;
+    blockquote: NodeRenderer<spec.Blockquote>;
+    thematicBreak: NodeRenderer<spec.ThematicBreak>;
+    subscript: NodeRenderer<spec.Subscript>;
+    superscript: NodeRenderer<spec.Superscript>;
+    abbreviation: NodeRenderer<spec.Abbreviation>;
+    table: NodeRenderer<spec.Table>;
+    tableRow: NodeRenderer<spec.TableRow>;
+    tableCell: NodeRenderer<spec.TableCell & TableExts>;
+    comment: NodeRenderer<spec.Comment>;
+    mystComment: NodeRenderer<spec.Comment>;
+    captionNumber: NodeRenderer<CaptionNumber>;
+    delete: NodeRenderer<Delete>;
+    underline: NodeRenderer<Underline>;
+    smallcaps: NodeRenderer<SmallCaps>;
+    definitionList: NodeRenderer<DefinitionList>;
+    definitionTerm: NodeRenderer<DefinitionTerm>;
+    definitionDescription: NodeRenderer<DefinitionDescription>;
+};
+declare const BASIC_RENDERERS: BasicNodeRenderers;
+export default BASIC_RENDERERS;
+//# sourceMappingURL=basic.d.ts.map

package/dist/esm/basic.d.ts.map

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

package/dist/esm/basic.js

@@ -0,0 +1,128 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { HashLink } from './heading';
+import classNames from 'classnames';
+import { HoverPopover } from './components/HoverPopover';
+const BASIC_RENDERERS = {
+    delete(node, children) {
+        return _jsx("del", { children: children }, node.key);
+    },
+    strong(node, children) {
+        return _jsx("strong", { children: children }, node.key);
+    },
+    emphasis(node, children) {
+        return _jsx("em", { children: children }, node.key);
+    },
+    underline(node, children) {
+        return (_jsx("span", Object.assign({ style: { textDecoration: 'underline' } }, { children: children }), node.key));
+    },
+    smallcaps(node, children) {
+        return (_jsx("span", Object.assign({ style: { fontVariant: 'small-caps' } }, { children: children }), node.key));
+    },
+    link(node, children) {
+        return (_jsx("a", Object.assign({ target: "_blank", href: node.url, rel: "noreferrer" }, { children: children }), node.key));
+    },
+    paragraph(node, children) {
+        return (_jsx("p", Object.assign({ id: node.html_id }, { children: children }), node.key));
+    },
+    break(node) {
+        return _jsx("br", {}, node.key);
+    },
+    inlineMath(node) {
+        return _jsx("code", { children: node.value }, node.key);
+    },
+    math(node) {
+        return _jsx("code", { children: node.value }, node.key);
+    },
+    list(node, children) {
+        if (node.ordered) {
+            return (_jsx("ol", Object.assign({ start: node.start || undefined, id: node.html_id }, { children: children }), node.key));
+        }
+        return (_jsx("ul", Object.assign({ id: node.html_id }, { children: children }), node.key));
+    },
+    listItem(node, children) {
+        if (node.checked == null) {
+            return _jsx("li", { children: children }, node.key);
+        }
+        return (_jsxs("li", Object.assign({ className: "task-list-item" }, { children: [_jsx("input", { type: "checkbox", className: "task-list-item-checkbox", defaultChecked: node.checked }), children] }), node.key));
+    },
+    container(node, children) {
+        return (_jsx("figure", Object.assign({ id: node.html_id || node.identifier || node.key, className: classNames(node.kind, node.class) }, { children: children }), node.key));
+    },
+    caption(node, children) {
+        return (_jsx("figcaption", Object.assign({ className: "group" }, { children: children }), node.key));
+    },
+    blockquote(node, children) {
+        return (_jsx("blockquote", Object.assign({ id: node.html_id }, { children: children }), node.key));
+    },
+    thematicBreak(node) {
+        return _jsx("hr", { className: "py-2 my-5 translate-y-2" }, node.key);
+    },
+    captionNumber(node, children) {
+        function backwardsCompatibleLabel(value, kind) {
+            var _a, _b;
+            const capital = (_a = kind === null || kind === void 0 ? void 0 : kind.slice(0, 1).toUpperCase()) !== null && _a !== void 0 ? _a : 'F';
+            const body = (_b = kind === null || kind === void 0 ? void 0 : kind.slice(1)) !== null && _b !== void 0 ? _b : 'igure';
+            return `${capital}${body}: ${children}`;
+        }
+        const label = typeof children === 'string' ? backwardsCompatibleLabel(children, node.kind) : children;
+        const id = node.html_id || node.identifier || node.key;
+        return (_jsx(HashLink, Object.assign({ id: id, kind: node.kind, className: "mr-1 text-inherit hover:text-inherit font-semibold hover:font-semibold" }, { children: label }), node.key));
+    },
+    table(node, children) {
+        // TODO: actually render the tbody on the server if it isn't included here.
+        return (_jsx("table", { children: _jsx("tbody", { children: children }) }, node.key));
+    },
+    tableRow(node, children) {
+        return _jsx("tr", { children: children }, node.key);
+    },
+    tableCell(node, children) {
+        const ifGreaterThanOne = (num) => (num === 1 ? undefined : num);
+        const attrs = {
+            key: node.key,
+            rowSpan: ifGreaterThanOne(node.rowspan),
+            colSpan: ifGreaterThanOne(node.colspan),
+        };
+        if (node.header)
+            return _jsx("th", Object.assign({}, attrs, { children: children }));
+        return _jsx("td", Object.assign({}, attrs, { children: children }));
+    },
+    subscript(node, children) {
+        return _jsx("sub", { children: children }, node.key);
+    },
+    superscript(node, children) {
+        return _jsx("sup", { children: children }, node.key);
+    },
+    abbreviation(node, children) {
+        return (_jsx(HoverPopover, Object.assign({ side: "top", card: _jsx("div", Object.assign({ className: "bg-blue-900 text-white dark:bg-white dark:text-black text-xs p-1" }, { children: node.title })), arrowClass: "fill-blue-900 dark:fill-white" }, { children: _jsx("abbr", Object.assign({ "aria-label": node.title, className: "cursor-help border-b border-dotted" }, { children: children })) }), node.key));
+    },
+    mystComment() {
+        return null;
+    },
+    comment() {
+        return null;
+    },
+    definitionList(node, children) {
+        return (_jsx("dl", Object.assign({ className: "my-5", id: node.html_id }, { children: children }), node.key));
+    },
+    definitionTerm(node, children) {
+        let strongChildren = children;
+        if (Array.isArray(children)) {
+            const allowedStrongTypes = new Set(['emphasis']);
+            strongChildren = children.map((child, i) => {
+                if (typeof child === 'string')
+                    return _jsx("strong", { children: child }, node.key + i);
+                if (allowedStrongTypes.has(child === null || child === void 0 ? void 0 : child.type))
+                    return _jsx("strong", { children: child }, node.key + i);
+                return child;
+            });
+        }
+        else if (typeof children === 'string') {
+            strongChildren = _jsx("strong", { children: children }, node.key + '0');
+        }
+        return (_jsx("dt", Object.assign({ id: node.html_id }, { children: strongChildren }), node.key));
+    },
+    definitionDescription(node, children) {
+        return _jsx("dd", { children: children }, node.key);
+    },
+};
+export default BASIC_RENDERERS;

package/dist/esm/card.d.ts

@@ -0,0 +1,27 @@
+import type { NodeRenderer } from '@myst-theme/providers';
+type CardSpec = {
+    type: 'card';
+    url?: string;
+    static?: boolean;
+};
+type CardTitleSpec = {
+    type: 'cardTitle';
+};
+type HeaderSpec = {
+    type: 'header';
+};
+type FooterSpec = {
+    type: 'footer';
+};
+export declare const Header: NodeRenderer<HeaderSpec>;
+export declare const Footer: NodeRenderer<FooterSpec>;
+export declare const CardTitle: NodeRenderer<CardTitleSpec>;
+export declare const CardRenderer: NodeRenderer<CardSpec>;
+declare const CARD_RENDERERS: {
+    card: NodeRenderer<CardSpec>;
+    cardTitle: NodeRenderer<CardTitleSpec>;
+    header: NodeRenderer<HeaderSpec>;
+    footer: NodeRenderer<FooterSpec>;
+};
+export default CARD_RENDERERS;
+//# sourceMappingURL=card.d.ts.map

package/dist/esm/card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/card.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAI1D,KAAK,QAAQ,GAAG;IACd,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AACF,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,WAAW,CAAC;CACnB,CAAC;AACF,KAAK,UAAU,GAAG;IAChB,IAAI,EAAE,QAAQ,CAAC;CAChB,CAAC;AACF,KAAK,UAAU,GAAG;IAChB,IAAI,EAAE,QAAQ,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,YAAY,CAAC,UAAU,CAS3C,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,YAAY,CAAC,UAAU,CAS3C,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,YAAY,CAAC,aAAa,CAMjD,CAAC;AA2FF,eAAO,MAAM,YAAY,EAAE,YAAY,CAAC,QAAQ,CAM/C,CAAC;AAEF,QAAA,MAAM,cAAc;;;;;CAKnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/esm/card.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { useLinkProvider, useBaseurl, withBaseurl } from '@myst-theme/providers';
+export const Header = (node, children) => {
+    return (_jsx("header", Object.assign({ className: "m-0 py-1 pl-3 bg-gray-50 dark:bg-slate-900 border-b border-gray-100 dark:border-gray-800" }, { children: children }), node.key));
+};
+export const Footer = (node, children) => {
+    return (_jsx("footer", Object.assign({ className: "m-0 py-1 pl-3 bg-gray-50 dark:bg-slate-900 border-t border-gray-100 dark:border-gray-800" }, { children: children }), node.key));
+};
+export const CardTitle = (node, children) => {
+    return (_jsx("div", Object.assign({ className: "pt-3 font-bold group-hover:underline" }, { children: children }), node.key));
+};
+function getParts(children) {
+    var _a, _b;
+    const parts = {};
+    if (!Array.isArray(children))
+        return parts;
+    const next = [...children];
+    if (((_a = next[0]) === null || _a === void 0 ? void 0 : _a.type) === 'header') {
+        parts.header = next.splice(0, 1);
+    }
+    if (((_b = next[next.length - 1]) === null || _b === void 0 ? void 0 : _b.type) === 'footer') {
+        parts.footer = next.splice(-1, 1);
+    }
+    parts.body = next;
+    return parts;
+}
+function ExternalOrInternalLink({ to, className, isStatic, prefetch = 'intent', children, }) {
+    const Link = useLinkProvider();
+    const baseurl = useBaseurl();
+    if (to.startsWith('http') || isStatic) {
+        return (_jsx("a", Object.assign({ href: to, className: className, target: "_blank", rel: "noopener noreferrer" }, { children: children })));
+    }
+    return (_jsx(Link, Object.assign({ to: withBaseurl(to, baseurl), className: className, prefetch: prefetch }, { children: children })));
+}
+function Card({ children, url, isStatic, }) {
+    const parts = getParts(children);
+    const link = !!url;
+    const sharedStyle = 'my-5 rounded shadow dark:shadow-neutral-800 overflow-hidden border border-gray-100 dark:border-gray-800 flex flex-col';
+    if (link) {
+        return (_jsxs(ExternalOrInternalLink, Object.assign({ to: url, isStatic: isStatic, className: classNames(sharedStyle, 'text-inherit hover:text-inherit', 'block font-normal no-underline hover:no-underline cursor-pointer group', 'hover:border-blue-500 dark:hover:border-blue-400') }, { children: [parts.header, _jsx("div", Object.assign({ className: "py-2 px-4 flex-grow" }, { children: parts.body })), parts.footer] })));
+    }
+    return (_jsxs("div", Object.assign({ className: sharedStyle }, { children: [parts.header, _jsx("div", Object.assign({ className: "py-2 px-4 flex-grow" }, { children: parts.body })), parts.footer] })));
+}
+export const CardRenderer = (node, children) => {
+    return (_jsx(Card, Object.assign({ url: node.url, isStatic: node.static || false }, { children: children }), node.key));
+};
+const CARD_RENDERERS = {
+    card: CardRenderer,
+    cardTitle: CardTitle,
+    header: Header,
+    footer: Footer,
+};
+export default CARD_RENDERERS;

package/dist/esm/cite.d.ts

@@ -0,0 +1,11 @@
+import type { NodeRenderer } from '@myst-theme/providers';
+export declare const CiteGroup: NodeRenderer;
+export declare const Cite: ({ label, error, children, }: {
+    label?: string | undefined;
+    error?: boolean | undefined;
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const CiteRenderer: NodeRenderer;
+declare const CITE_RENDERERS: Record<string, NodeRenderer>;
+export default CITE_RENDERERS;
+//# sourceMappingURL=cite.d.ts.map

package/dist/esm/cite.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cite.d.ts","sourceRoot":"","sources":["../../src/cite.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAc1D,eAAO,MAAM,SAAS,EAAE,YAYvB,CAAC;AAEF,eAAO,MAAM,IAAI;;;cAOL,MAAM,SAAS;6CAuB1B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,YAM1B,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAGhD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/esm/cite.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { useReferences } from '@myst-theme/providers';
+import { doi } from 'doi-utils';
+import { InlineError } from './inlineError';
+import { HoverPopover } from './components/HoverPopover';
+function CiteChild({ html }) {
+    return (_jsx("div", { className: "hover-document w-[500px] sm:max-w-[500px] p-3", dangerouslySetInnerHTML: { __html: html || '' } }));
+}
+export const CiteGroup = (node, children) => {
+    return (_jsx("span", Object.assign({ className: classNames('cite-group', {
+            narrative: node.kind === 'narrative',
+            parenthetical: node.kind === 'parenthetical',
+        }) }, { children: children }), node.key));
+};
+export const Cite = ({ label, error, children, }) => {
+    var _a, _b;
+    const references = useReferences();
+    if (!label) {
+        return _jsx(InlineError, { value: "cite (no label)", message: 'Citation Has No Label' });
+    }
+    const { html, doi: doiString } = (_b = (_a = references === null || references === void 0 ? void 0 : references.cite) === null || _a === void 0 ? void 0 : _a.data[label]) !== null && _b !== void 0 ? _b : {};
+    if (error) {
+        return _jsx(InlineError, { value: label, message: 'Citation Not Found' });
+    }
+    const doiUrl = doiString ? doi.buildUrl(doiString) : null;
+    return (_jsx(HoverPopover, Object.assign({ openDelay: 300, card: _jsx(CiteChild, { html: html }) }, { children: _jsxs("cite", Object.assign({ className: "hover-link" }, { children: [doiUrl && (_jsx("a", Object.assign({ href: doiUrl, target: "_blank", rel: "noreferrer", className: "hover-link" }, { children: children }))), !doiUrl && children] })) })));
+};
+export const CiteRenderer = (node, children) => {
+    return (_jsx(Cite, Object.assign({ label: node.label, error: node.error }, { children: children }), node.key));
+};
+const CITE_RENDERERS = {
+    citeGroup: CiteGroup,
+    cite: CiteRenderer,
+};
+export default CITE_RENDERERS;

package/dist/esm/code.d.ts

@@ -0,0 +1,61 @@
+import type { InlineCode } from 'myst-spec';
+import type { NodeRenderer } from '@myst-theme/providers';
+type Props = {
+    value: string;
+    identifier?: string;
+    lang?: string;
+    showCopy?: boolean;
+    showLineNumbers?: boolean;
+    startingLineNumber?: number;
+    emphasizeLines?: number[];
+    filename?: string;
+    shadow?: boolean;
+    background?: boolean;
+    border?: boolean;
+    className?: string;
+};
+export declare function CodeBlock(props: Props): import("react/jsx-runtime").JSX.Element;
+declare const CODE_RENDERERS: {
+    code: NodeRenderer<{
+        type?: "code" | undefined;
+        lang?: string | undefined;
+        meta?: string | undefined;
+        class?: string | undefined;
+        showLineNumbers?: boolean | undefined;
+        startingLineNumber?: number | undefined;
+        emphasizeLines?: number[] | undefined;
+        identifier?: unknown;
+        label?: unknown;
+        value?: unknown;
+        position?: unknown;
+        data?: unknown;
+    } & {
+        identifier?: string | undefined;
+        label?: string | undefined;
+    } & {
+        value: string;
+    } & {
+        type: string;
+        data?: {
+            [k: string]: unknown;
+        } | undefined;
+        position?: {
+            start: {
+                line: number;
+                column: number;
+                offset?: number | undefined;
+            };
+            end: {
+                line: number;
+                column: number;
+                offset?: number | undefined;
+            };
+            indent?: number[] | undefined;
+        } | undefined;
+    } & {
+        executable: boolean;
+    }>;
+    inlineCode: NodeRenderer<InlineCode>;
+};
+export default CODE_RENDERERS;
+//# sourceMappingURL=code.d.ts.map

package/dist/esm/code.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code.d.ts","sourceRoot":"","sources":["../../src/code.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,UAAU,EAAE,MAAM,WAAW,CAAC;AAClD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAQ1D,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAWF,wBAAgB,SAAS,CAAC,KAAK,EAAE,KAAK,2CAgErC;AAiDD,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBA/C0B,OAAO;;;CAkDpD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/esm/code.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTheme } from '@myst-theme/providers';
+import { LightAsync as SyntaxHighlighter } from 'react-syntax-highlighter';
+import light from 'react-syntax-highlighter/dist/cjs/styles/hljs/xcode';
+import dark from 'react-syntax-highlighter/dist/cjs/styles/hljs/vs2015';
+import classNames from 'classnames';
+import { CopyIcon } from './components/CopyIcon';
+function normalizeLanguage(lang) {
+    switch (lang) {
+        case 'html':
+            return 'xml';
+        default:
+            return lang;
+    }
+}
+export function CodeBlock(props) {
+    const { isLight } = useTheme();
+    const { value, lang, identifier, emphasizeLines, showLineNumbers, className, showCopy = true, startingLineNumber = 1, filename, shadow, background, border, } = props;
+    const highlightLines = new Set(emphasizeLines);
+    return (_jsxs("div", Object.assign({ id: identifier, className: classNames('relative group not-prose overflow-auto', className, {
+            'shadow hover:shadow-md dark:shadow-2xl dark:shadow-neutral-900 my-5 text-sm': shadow,
+            'bg-stone-200/10': background,
+            'border border-l-4 border-l-blue-400 border-gray-200 dark:border-l-blue-400 dark:border-gray-800': border,
+        }) }, { children: [filename && _jsx("div", Object.assign({ className: "leading-3 mt-1 p-1" }, { children: filename })), _jsx(SyntaxHighlighter, Object.assign({ language: normalizeLanguage(lang), startingLineNumber: startingLineNumber, showLineNumbers: showLineNumbers, style: isLight ? Object.assign(Object.assign({}, light), { hljs: Object.assign(Object.assign({}, light.hljs), { background: 'transparent' }) }) : dark, wrapLines: true, lineNumberContainerStyle: {
+                    // This stops page content shifts
+                    display: 'inline-block',
+                    float: 'left',
+                    minWidth: '1.25em',
+                    paddingRight: '1em',
+                    textAlign: 'right',
+                    userSelect: 'none',
+                    borderLeft: '4px solid transparent',
+                }, lineProps: (line) => {
+                    if (typeof line === 'boolean')
+                        return {};
+                    return highlightLines.has(line)
+                        ? {
+                            'data-line-number': `${line}`,
+                            'data-highlight': 'true',
+                        }
+                        : { 'data-line-number': `${line}` };
+                }, customStyle: { padding: '0.8rem' } }, { children: value })), showCopy && (_jsx("div", Object.assign({ className: "absolute hidden top-1 right-1 group-hover:block" }, { children: _jsx(CopyIcon, { text: value }) })))] })));
+}
+const code = (node) => {
+    return (_jsx(CodeBlock, { identifier: node.html_id, "data-mdast-node-type": node.type, "data-mdast-node-id": node.key, value: node.value || '', lang: node.lang, emphasizeLines: node.emphasizeLines, showLineNumbers: node.showLineNumbers, startingLineNumber: node.startingLineNumber, shadow: true, border: node.executable, background: !node.executable }, node.key));
+};
+function isColor(maybeColorHash) {
+    if (!maybeColorHash || maybeColorHash.length > 9)
+        return undefined;
+    if (!new Set([4, 7, 9]).has(maybeColorHash.length))
+        return undefined;
+    const match = /^#([0-9A-Fa-f]{3,8})$/.exec(maybeColorHash);
+    if (!match)
+        return undefined;
+    const color = match[1];
+    return color;
+}
+const inlineCode = (node, children) => {
+    if (isColor(node.value)) {
+        return (_jsxs("code", Object.assign({ className: "bg-slate-100 text-slate-700 dark:bg-slate-800 dark:text-slate-100 px-1 rounded" }, { children: [children, _jsx("span", { style: { backgroundColor: node.value }, className: "inline-block w-[10px] h-[10px] rounded-full ml-1" })] }), node.key));
+    }
+    return _jsx("code", { children: children }, node.key);
+};
+const CODE_RENDERERS = {
+    code,
+    inlineCode,
+};
+export default CODE_RENDERERS;

package/dist/esm/components/CopyIcon.d.ts

@@ -0,0 +1,4 @@
+export declare function CopyIcon({ text }: {
+    text: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CopyIcon.d.ts.map

package/dist/esm/components/CopyIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CopyIcon.d.ts","sourceRoot":"","sources":["../../../src/components/CopyIcon.tsx"],"names":[],"mappings":"AAKA,wBAAgB,QAAQ,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,2CA+BlD"}

package/dist/esm/components/CopyIcon.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import DocumentDuplicateIcon from '@heroicons/react/24/outline/DocumentDuplicateIcon';
+import CheckIcon from '@heroicons/react/24/outline/CheckIcon';
+import { useState } from 'react';
+import classNames from 'classnames';
+export function CopyIcon({ text }) {
+    const [copied, setCopied] = useState(false);
+    const onClick = () => {
+        if (copied)
+            return;
+        navigator.clipboard.writeText(text).then(() => {
+            setCopied(true);
+            setTimeout(() => setCopied(false), 3000);
+        });
+    };
+    return (_jsx("button", Object.assign({ title: copied ? 'Copied!!' : 'Copy to Clipboard', className: classNames('inline-flex items-center opacity-60 hover:opacity-100 active:opacity-40 cursor-pointer ml-2', 'transition-color duration-200 ease-in-out', {
+            'text-blue-500 border-blue-500': !copied,
+            'text-green-500 border-green-500 ': copied,
+        }), onClick: onClick, "aria-pressed": copied ? 'true' : 'false', "aria-label": "Copy code to clipboard" }, { children: copied ? (_jsx(CheckIcon, { className: "w-[24px] h-[24px] text-success" })) : (_jsx(DocumentDuplicateIcon, { className: "w-[24px] h-[24px]" })) })));
+}