@lapismd/mira 0.0.1

package/dist/preview/styles/callouts.css

@@ -0,0 +1,171 @@
+.markdown-rendered .callout,
+.markdown-preview-surface .markdown .callout {
+  --callout-border-opacity: 0;
+  --callout-color: var(--callout-default);
+  --callout-border-width: 2px;
+  background-color: rgba(var(--callout-color), 0.1);
+  border: var(--callout-border-width) solid
+    rgba(var(--callout-color), var(--callout-border-opacity));
+  border-radius: var(--radius-s);
+  margin: 1rem 0;
+  padding: 12px 12px 12px 24px;
+  white-space: normal;
+}
+
+.markdown-rendered .callout:hover,
+.markdown-preview-surface .markdown .callout:hover {
+  border-color: var(--border);
+  box-shadow: 0 1px 2px rgb(0 0 0 / 6%);
+}
+
+.markdown-rendered .callout[data-callout="abstract"],
+.markdown-rendered .callout[data-callout="summary"],
+.markdown-rendered .callout[data-callout="tldr"],
+.markdown-preview-surface .markdown .callout[data-callout="abstract"],
+.markdown-preview-surface .markdown .callout[data-callout="summary"],
+.markdown-preview-surface .markdown .callout[data-callout="tldr"] {
+  --callout-color: var(--callout-summary);
+}
+
+.markdown-rendered .callout[data-callout="info"],
+.markdown-preview-surface .markdown .callout[data-callout="info"],
+.markdown-rendered .callout[data-callout="todo"],
+.markdown-preview-surface .markdown .callout[data-callout="todo"] {
+  --callout-color: var(--callout-info);
+}
+
+.markdown-rendered .callout[data-callout="important"],
+.markdown-preview-surface .markdown .callout[data-callout="important"],
+.markdown-rendered .callout[data-callout="tip"],
+.markdown-preview-surface .markdown .callout[data-callout="tip"],
+.markdown-rendered .callout[data-callout="hint"],
+.markdown-preview-surface .markdown .callout[data-callout="hint"] {
+  --callout-color: var(--callout-tip);
+}
+
+.markdown-rendered .callout[data-callout="success"],
+.markdown-rendered .callout[data-callout="check"],
+.markdown-rendered .callout[data-callout="done"],
+.markdown-preview-surface .markdown .callout[data-callout="success"],
+.markdown-preview-surface .markdown .callout[data-callout="check"],
+.markdown-preview-surface .markdown .callout[data-callout="done"] {
+  --callout-color: var(--callout-success);
+}
+
+.markdown-rendered .callout[data-callout="question"],
+.markdown-rendered .callout[data-callout="help"],
+.markdown-rendered .callout[data-callout="faq"],
+.markdown-preview-surface .markdown .callout[data-callout="question"],
+.markdown-preview-surface .markdown .callout[data-callout="help"],
+.markdown-preview-surface .markdown .callout[data-callout="faq"] {
+  --callout-color: var(--callout-question);
+}
+
+.markdown-rendered .callout[data-callout="warning"],
+.markdown-rendered .callout[data-callout="caution"],
+.markdown-rendered .callout[data-callout="attention"],
+.markdown-preview-surface .markdown .callout[data-callout="warning"],
+.markdown-preview-surface .markdown .callout[data-callout="caution"],
+.markdown-preview-surface .markdown .callout[data-callout="attention"] {
+  --callout-color: var(--callout-warning);
+}
+
+.markdown-rendered .callout[data-callout="failure"],
+.markdown-rendered .callout[data-callout="fail"],
+.markdown-rendered .callout[data-callout="missing"],
+.markdown-preview-surface .markdown .callout[data-callout="failure"],
+.markdown-preview-surface .markdown .callout[data-callout="fail"],
+.markdown-preview-surface .markdown .callout[data-callout="missing"] {
+  --callout-color: var(--callout-fail);
+}
+
+.markdown-rendered .callout[data-callout="danger"],
+.markdown-rendered .callout[data-callout="error"],
+.markdown-preview-surface .markdown .callout[data-callout="danger"],
+.markdown-preview-surface .markdown .callout[data-callout="error"] {
+  --callout-color: var(--callout-error);
+}
+
+.markdown-rendered .callout[data-callout="bug"],
+.markdown-preview-surface .markdown .callout[data-callout="bug"] {
+  --callout-color: var(--callout-bug);
+}
+
+.markdown-rendered .callout[data-callout="example"],
+.markdown-preview-surface .markdown .callout[data-callout="example"] {
+  --callout-color: var(--callout-example);
+}
+
+.markdown-rendered .callout[data-callout="quote"],
+.markdown-rendered .callout[data-callout="cite"],
+.markdown-preview-surface .markdown .callout[data-callout="quote"],
+.markdown-preview-surface .markdown .callout[data-callout="cite"] {
+  --callout-color: var(--callout-quote);
+}
+
+.callout-title {
+  align-items: flex-start;
+  color: light-dark(
+    color-mix(in srgb, rgb(var(--callout-color)) 65%, #111827),
+    rgb(var(--callout-color))
+  );
+  display: flex;
+  gap: 4px;
+  line-height: 1.3;
+}
+
+button.callout-title {
+  appearance: none;
+  background: transparent;
+  border: 0;
+  cursor: pointer;
+  font: inherit;
+  line-height: 1.3;
+  padding: 0;
+  text-align: left;
+  width: 100%;
+}
+
+.callout-title-inner {
+  font-weight: 600;
+}
+
+.callout-title-inner p {
+  margin-block: 0;
+}
+
+.callout-icon {
+  align-items: center;
+  display: flex;
+  flex: 0 0 auto;
+}
+
+.callout-icon svg {
+  height: 18px;
+  width: 18px;
+}
+
+.callout-fold {
+  align-items: center;
+  display: flex;
+  padding-inline-end: 8px;
+}
+
+.mira-callout__fold-icon {
+  height: 1.25rem;
+  transition: transform 120ms ease;
+  width: 1.25rem;
+}
+
+.mira-callout__fold-icon[data-open="true"] {
+  transform: rotate(90deg);
+}
+
+.callout-content {
+  overflow-x: auto;
+  padding: 0;
+}
+
+.callout-content p:empty {
+  display: none;
+}

package/dist/preview/styles/code-katex.css

@@ -0,0 +1,213 @@
+.markdown-rendered code,
+.markdown-preview-surface .markdown code,
+.markdown-widget-shell code {
+  background-color: var(--markdown-code-background);
+  border: var(--markdown-code-border-width) solid
+    var(--markdown-code-border-color);
+  border-radius: var(--markdown-code-radius);
+  color: var(--markdown-code-normal);
+  font-family: var(--font-monospace);
+  font-size: var(--markdown-code-size);
+  padding: 0.15em 0.3em;
+  text-wrap: pretty;
+}
+
+.markdown-rendered pre,
+.markdown-preview-surface .markdown pre,
+.markdown-widget-shell pre {
+  margin-block: 1rem;
+}
+
+.markdown-rendered pre > div,
+.markdown-preview-surface .markdown pre > div,
+.markdown-widget-shell pre > div {
+  background: color-mix(in oklab, var(--secondary) 60%, transparent);
+  border: 2px solid var(--secondary);
+  border-radius: var(--radius-s);
+  display: flex;
+  margin: 0;
+  overflow-x: auto;
+  overflow-y: hidden;
+  padding: 1rem;
+  position: relative;
+  white-space: pre;
+}
+
+.markdown-rendered .mira-code-block__copy,
+.markdown-preview-surface .markdown .mira-code-block__copy,
+.markdown-widget-shell .mira-code-block__copy {
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 120ms ease;
+}
+
+.markdown-rendered .mira-code-block:hover .mira-code-block__copy,
+.markdown-rendered .mira-code-block:focus-within .mira-code-block__copy,
+.markdown-preview-surface
+  .markdown
+  .mira-code-block:hover
+  .mira-code-block__copy,
+.markdown-preview-surface
+  .markdown
+  .mira-code-block:focus-within
+  .mira-code-block__copy,
+.markdown-widget-shell .mira-code-block:hover .mira-code-block__copy,
+.markdown-widget-shell .mira-code-block:focus-within .mira-code-block__copy {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.markdown-rendered .mira-code-block__copy-button,
+.markdown-preview-surface .markdown .mira-code-block__copy-button,
+.markdown-widget-shell .mira-code-block__copy-button {
+  border: 1px solid var(--background-modifier-border);
+  color: var(--text-muted, var(--mira-muted-foreground));
+  gap: 0.375rem;
+  height: 1.75rem;
+  padding: 0 0.375rem;
+  width: auto;
+}
+
+.markdown-rendered .mira-code-block__copy-button:hover,
+.markdown-rendered .mira-code-block__copy-button:focus-visible,
+.markdown-preview-surface .markdown .mira-code-block__copy-button:hover,
+.markdown-preview-surface .markdown .mira-code-block__copy-button:focus-visible,
+.markdown-widget-shell .mira-code-block__copy-button:hover,
+.markdown-widget-shell .mira-code-block__copy-button:focus-visible {
+  color: var(--text-normal, var(--mira-foreground));
+  outline: none;
+}
+
+.markdown-rendered .mira-code-block__copy-icon,
+.markdown-preview-surface .markdown .mira-code-block__copy-icon,
+.markdown-widget-shell .mira-code-block__copy-icon {
+  flex: 0 0 auto;
+  height: 1rem;
+  width: 1rem;
+}
+
+.markdown-rendered .mira-code-block__language,
+.markdown-preview-surface .markdown .mira-code-block__language,
+.markdown-widget-shell .mira-code-block__language {
+  font-family: var(--font-monospace);
+  font-size: var(--font-smallest, 0.75rem);
+  line-height: 1;
+  white-space: nowrap;
+}
+
+.markdown-rendered pre code,
+.markdown-preview-surface .markdown pre code,
+.markdown-widget-shell pre code {
+  background-color: transparent;
+  border: 0;
+  padding: 0;
+}
+
+.markdown-rendered .code-line,
+.markdown-preview-surface .markdown .code-line,
+.markdown-widget-shell .code-line {
+  border-left: 4px solid transparent;
+  display: inline-block;
+  margin-left: -12px;
+  margin-right: -12px;
+  min-width: 100%;
+  padding-left: 12px;
+  padding-right: 12px;
+}
+
+.markdown-rendered .numbered-code-line,
+.markdown-preview-surface .markdown .numbered-code-line,
+.markdown-widget-shell .numbered-code-line {
+  margin-left: 0;
+  margin-right: 0;
+  padding-left: calc(1ch * var(--numbered-code-line-size));
+}
+
+.markdown-rendered .numbered-code-line::before,
+.markdown-preview-surface .markdown .numbered-code-line::before,
+.markdown-widget-shell .numbered-code-line::before {
+  color: var(--color-text-weak, var(--mira-muted-foreground));
+  content: attr(data-line-number);
+  display: inline-flex;
+  font-family: var(--font-monospace);
+  justify-content: end;
+  margin-right: 1ch;
+  opacity: 0.5;
+  padding: 0 3px 0 5px;
+  text-align: right;
+  width: calc(1ch * var(--numbered-code-line-size));
+}
+
+.markdown-rendered .highlighted-code-line,
+.markdown-preview-surface .markdown .highlighted-code-line,
+.markdown-widget-shell .highlighted-code-line {
+  background-color: var(--code-highlighted-line, rgb(204 238 255 / 0.27));
+  border-left-color: var(
+    --code-highlighted-line-indicator,
+    var(--interactive-accent)
+  );
+}
+
+.markdown-rendered code[data-muted="true"] .code-line,
+.markdown-preview-surface .markdown code[data-muted="true"] .code-line,
+.markdown-widget-shell code[data-muted="true"] .code-line {
+  opacity: 0.3;
+}
+
+.markdown-rendered code[data-muted="true"] .highlighted-code-line,
+.markdown-preview-surface
+  .markdown
+  code[data-muted="true"]
+  .highlighted-code-line,
+.markdown-widget-shell code[data-muted="true"] .highlighted-code-line {
+  background-color: transparent;
+  border-left-color: transparent;
+  opacity: 1;
+}
+
+.markdown-rendered kbd,
+.markdown-preview-surface .markdown kbd,
+.markdown-widget-shell kbd {
+  align-items: center;
+  background-color: var(--muted, var(--background-modifier-hover));
+  border: 1px solid var(--border, var(--background-modifier-border));
+  border-bottom-width: 2px;
+  border-radius: calc(var(--radius, var(--radius-s)) - 2px);
+  box-shadow: inset 0 -1px 0 var(--border, var(--background-modifier-border));
+  color: var(--foreground, var(--text-normal));
+  display: inline-flex;
+  font-family: var(--font-monospace);
+  font-size: 0.75em;
+  font-weight: 500;
+  justify-content: center;
+  line-height: 1;
+  min-height: 1.35em;
+  padding: 0.125rem 0.375rem;
+  vertical-align: baseline;
+  white-space: nowrap;
+}
+
+.mira-inline-math-widget,
+.mira-inline-math-widget p,
+.mira-inline-math-widget .katex,
+.mira-inline-math-widget .katex-display {
+  display: inline;
+  margin: 0;
+}
+
+.mira-inline-math-widget {
+  cursor: text;
+  white-space: normal;
+}
+
+.mira-inline-markdown-widget {
+  cursor: text;
+  display: inline;
+  white-space: normal;
+}
+
+.mira-inline-markdown-widget p,
+.mira-inline-markdown-widget .mira-link-preview {
+  display: inline;
+  margin: 0;
+}

package/dist/preview/styles/editor-shared.css

@@ -0,0 +1,132 @@
+.markdown-editor-surface,
+.markdown-preview-surface,
+.markdown-embed-surface,
+.markdown-widget-shell {
+  --markdown-surface-background: var(--background-primary, var(--background));
+  --markdown-surface-background-alt: var(--background-primary-alt, var(--card));
+  --markdown-surface-border: var(--background-modifier-border, var(--border));
+  --markdown-normal-color: var(--text-normal, var(--foreground));
+  --markdown-muted-color: var(--text-muted, var(--muted-foreground));
+  --markdown-faint-color: var(--text-faint, var(--muted-foreground));
+  --markdown-accent: var(--interactive-accent);
+  --markdown-blockquote-color: var(--blockquote-color);
+  --markdown-blockquote-font-style: var(--blockquote-font-style);
+  --markdown-blockquote-background-color: var(--blockquote-background-color);
+  --markdown-blockquote-border-thickness: var(--blockquote-border-thickness);
+  --markdown-blockquote-border-color: var(--blockquote-border-color);
+  --markdown-code-background: var(--code-background);
+  --markdown-code-normal: var(--code-normal);
+  --markdown-code-comment: var(--code-comment);
+  --markdown-code-function: var(--code-function);
+  --markdown-code-keyword: var(--code-keyword);
+  --markdown-code-operator: var(--code-operator);
+  --markdown-code-property: var(--code-property);
+  --markdown-code-punctuation: var(--code-punctuation);
+  --markdown-code-string: var(--code-string);
+  --markdown-code-tag: var(--code-tag);
+  --markdown-code-value: var(--code-value);
+  --markdown-code-radius: var(--code-radius);
+  --markdown-code-size: var(--code-size);
+  --markdown-code-border-width: var(--code-border-width);
+  --markdown-code-border-color: var(--code-border-color);
+  --markdown-tag-color: var(--tag-color);
+  --markdown-tag-color-hover: var(--tag-color-hover);
+  --markdown-tag-background: var(--tag-background);
+  --markdown-tag-background-hover: var(--tag-background-hover);
+  --markdown-tag-border-width: var(--tag-border-width);
+  --markdown-tag-border-color: var(--tag-border-color);
+  --markdown-tag-border-color-hover: var(--tag-border-color-hover);
+  --markdown-tag-radius: var(--tag-radius);
+  --markdown-tag-size: var(--tag-size);
+  --markdown-tag-weight: var(--tag-weight);
+  --markdown-tag-padding-x: var(--tag-padding-x);
+  --markdown-tag-padding-y: var(--tag-padding-y);
+  --markdown-link-color: var(--link-color);
+  --markdown-link-color-hover: var(--link-color-hover);
+  --markdown-link-weight: var(--link-weight);
+  --markdown-link-decoration: var(--link-decoration);
+  --markdown-link-decoration-hover: var(--link-decoration-hover);
+  --markdown-link-decoration-thickness: var(--link-decoration-thickness);
+  --markdown-link-external-color: var(--link-external-color);
+  --markdown-link-external-decoration: var(--link-external-decoration);
+  --markdown-link-external-filter: var(--link-external-filter);
+  --markdown-list-marker-color-hover: var(--list-marker-color-hover);
+  --markdown-indentation-guide-color: var(--indentation-guide-color);
+  --markdown-indentation-guide-color-active: var(
+    --indentation-guide-color-active
+  );
+  --markdown-indentation-guide-width: var(--indentation-guide-width);
+  --markdown-indentation-guide-width-active: var(
+    --indentation-guide-width-active
+  );
+  --markdown-collapse-icon-color: var(--collapse-icon-color);
+  --markdown-collapse-icon-color-collapsed: var(
+    --collapse-icon-color-collapsed
+  );
+  --markdown-h1-color: var(--h1-color);
+  --markdown-h1-font: var(--h1-font);
+  --markdown-h1-line-height: var(--h1-line-height);
+  --markdown-h1-size: var(--h1-size);
+  --markdown-h1-style: var(--h1-style);
+  --markdown-h1-variant: var(--h1-variant);
+  --markdown-h1-weight: var(--h1-weight);
+  --markdown-h2-color: var(--h2-color);
+  --markdown-h2-font: var(--h2-font);
+  --markdown-h2-line-height: var(--h2-line-height);
+  --markdown-h2-size: var(--h2-size);
+  --markdown-h2-style: var(--h2-style);
+  --markdown-h2-variant: var(--h2-variant);
+  --markdown-h2-weight: var(--h2-weight);
+  --markdown-h3-color: var(--h3-color);
+  --markdown-h3-font: var(--h3-font);
+  --markdown-h3-line-height: var(--h3-line-height);
+  --markdown-h3-size: var(--h3-size);
+  --markdown-h3-style: var(--h3-style);
+  --markdown-h3-variant: var(--h3-variant);
+  --markdown-h3-weight: var(--h3-weight);
+  --markdown-h4-color: var(--h4-color);
+  --markdown-h4-font: var(--h4-font);
+  --markdown-h4-line-height: var(--h4-line-height);
+  --markdown-h4-size: var(--h4-size);
+  --markdown-h4-style: var(--h4-style);
+  --markdown-h4-variant: var(--h4-variant);
+  --markdown-h4-weight: var(--h4-weight);
+  --markdown-h5-color: var(--h5-color);
+  --markdown-h5-font: var(--h5-font);
+  --markdown-h5-line-height: var(--h5-line-height);
+  --markdown-h5-size: var(--h5-size);
+  --markdown-h5-style: var(--h5-style);
+  --markdown-h5-variant: var(--h5-variant);
+  --markdown-h5-weight: var(--h5-weight);
+  --markdown-h6-color: var(--h6-color);
+  --markdown-h6-font: var(--h6-font);
+  --markdown-h6-line-height: var(--h6-line-height);
+  --markdown-h6-size: var(--h6-size);
+  --markdown-h6-style: var(--h6-style);
+  --markdown-h6-variant: var(--h6-variant);
+  --markdown-h6-weight: var(--h6-weight);
+  background: var(--markdown-surface-background);
+  color: var(--markdown-normal-color);
+}
+
+.markdown-preview-surface .markdown,
+.markdown-rendered,
+.markdown-widget-shell .markdown,
+.markdown-embed-surface .markdown {
+  color: var(--markdown-normal-color);
+  font-family: var(--font-sans);
+  font-size: var(--font-text-size);
+  line-height: var(--line-height-normal);
+}
+
+.markdown-widget-shell p,
+.markdown-widget-shell .markdown > :first-child,
+.markdown-widget-shell .markdown > :last-child {
+  margin-block: 0;
+}
+
+.markdown-editor-surface *,
+.markdown-preview-surface *,
+.markdown-widget-shell * {
+  box-sizing: border-box;
+}

package/dist/preview/styles/frontmatter-collapsible.css

@@ -0,0 +1,94 @@
+.md-frontmatter {
+  font-family: var(--font-interface);
+  margin: 0;
+  padding: 0;
+}
+
+.md-frontmatter__collapsible {
+  border-radius: var(--radius-s);
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+  width: 100%;
+}
+
+.md-frontmatter__trigger {
+  align-items: center;
+  background: transparent;
+  border: 0;
+  border-radius: var(--radius-m);
+  color: var(--text-normal);
+  cursor: pointer;
+  display: flex;
+  font: inherit;
+  font-size: 0.875rem;
+  font-weight: 500;
+  gap: 0.5rem;
+  height: 2.25rem;
+  justify-content: center;
+  margin: 0;
+  outline: none;
+  padding: 0.5rem 1rem 0.5rem 0;
+  transition:
+    background-color 150ms ease,
+    color 150ms ease,
+    box-shadow 150ms ease;
+  user-select: none;
+  white-space: nowrap;
+  width: 100%;
+}
+
+.md-frontmatter__trigger:hover {
+  background: transparent;
+}
+
+.md-frontmatter__trigger:focus-visible {
+  border-color: var(--ring);
+  box-shadow: 0 0 0 2px color-mix(in oklab, var(--ring) 50%, transparent);
+}
+
+.md-frontmatter__chevron {
+  color: var(--text-accent);
+  flex: 0 0 auto;
+  height: 0.875rem;
+  margin-left: -6px;
+  transition: transform 150ms ease;
+  width: 0.875rem;
+}
+
+.md-frontmatter__collapsible[data-state="open"] .md-frontmatter__chevron {
+  transform: rotate(90deg);
+}
+
+.md-frontmatter__title {
+  flex: 1 1 auto;
+  min-width: 0;
+  text-align: left;
+}
+
+.md-frontmatter__content {
+  width: 100%;
+}
+
+.markdown-live-preview-mode .md-frontmatter__content {
+  padding-block-end: 0;
+}
+
+.markdown-live-preview-mode .cm-formatting-block.markdown-rendered > *,
+.markdown-live-preview-mode .markdown-widget-shell > *,
+.markdown-live-preview-mode .cm-table-widget,
+.markdown-live-preview-mode .md-frontmatter {
+  margin-block: 0;
+}
+
+.markdown-live-preview-mode .mira-rich-widget--frontmatter .md-frontmatter {
+  padding-block: 0;
+}
+
+.markdown-live-preview-mode .HyperMD-task-line[data-task="x"] > span:last-child,
+.markdown-live-preview-mode
+  .HyperMD-task-line[data-task="X"]
+  > span:last-child {
+  color: inherit;
+  text-decoration: none;
+}