@owomark/processor 0.1.6 → 0.1.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@owomark/processor",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "description": "Node-safe Markdown and MDX processor, plugins, and built-in MDX components for OwoMark.",
   "type": "module",
   "main": "./dist/index.js",
@@ -38,6 +38,7 @@
     "access": "public"
   },
   "dependencies": {
+    "@owomark/core": "^0.1.8",
     "rehype-katex": "^6.0.3",
     "rehype-pretty-code": "^0.14.1",
     "rehype-slug": "^6.0.0",

package/src/mdx-components/mdx-components.css

@@ -27,8 +27,8 @@
   line-height: 1;
 }
 
-.mdx-callout-content > :first-child { margin-top: 0; }
-.mdx-callout-content > :last-child  { margin-bottom: 0; }
+.mdx-callout .mdx-callout-content > :first-child { margin-top: 0; }
+.mdx-callout .mdx-callout-content > :last-child  { margin-bottom: 0; }
 
 .mdx-callout-info {
   background-color: color-mix(in srgb, var(--owo-brand, #3b82f6) 6%, transparent);
@@ -75,8 +75,8 @@
   color: var(--owo-text-muted, #64748b);
 }
 
-.mdx-note-body > :first-child { margin-top: 0; }
-.mdx-note-body > :last-child  { margin-bottom: 0; }
+.mdx-note .mdx-note-body > :first-child { margin-top: 0; }
+.mdx-note .mdx-note-body > :last-child  { margin-bottom: 0; }
 
 /* --- CodeDemo --- */
 
@@ -88,6 +88,45 @@
   font-weight: 500;
 }
 
+.mdx-code-demo[data-code-demo] pre {
+  background-color: var(--owo-surface-raised, #f8fafc);
+  padding: 1rem;
+  border: 1px solid var(--owo-border, #e2e8f0);
+  border-radius: 8px;
+  box-shadow: none;
+  overflow-x: auto;
+  margin: 0;
+}
+
+.mdx-code-demo[data-code-demo] pre code {
+  background-color: transparent;
+  padding: 0;
+  border: none;
+  border-radius: 0;
+  color: inherit;
+  font-size: inherit;
+}
+
+.mdx-code-demo[data-code-demo] code {
+  font-family: var(--owo-font-mono, ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace);
+}
+
+.mdx-code-demo[data-code-demo] pre.shiki {
+  background-color: var(--owo-surface-raised, #f8fafc);
+  padding: 1rem;
+  border: 1px solid var(--owo-border, #e2e8f0);
+  border-radius: 8px;
+  box-shadow: none;
+}
+
+.mdx-code-demo[data-code-demo] figure[data-rehype-pretty-code-figure] {
+  margin: 0;
+}
+
+.mdx-code-demo[data-code-demo] figure[data-rehype-pretty-code-figure] pre {
+  margin: 0;
+}
+
 /* --- Steps --- */
 
 .mdx-steps { margin-bottom: 1.5rem; }
@@ -140,8 +179,8 @@
   margin: 0 0 0.5rem;
 }
 
-.mdx-step-body > :first-child { margin-top: 0; }
-.mdx-step-body > :last-child  { margin-bottom: 0; }
+.mdx-step .mdx-step-body > :first-child { margin-top: 0; }
+.mdx-step .mdx-step-body > :last-child  { margin-bottom: 0; }
 
 /* --- Tabs --- */
 
@@ -181,8 +220,8 @@
   padding: 1rem;
 }
 
-.mdx-tabs-panel > :first-child { margin-top: 0; }
-.mdx-tabs-panel > :last-child  { margin-bottom: 0; }
+.mdx-tabs .mdx-tabs-panel > :first-child { margin-top: 0; }
+.mdx-tabs .mdx-tabs-panel > :last-child  { margin-bottom: 0; }
 
 /* CSS-only tab switching via :has() */
 .mdx-tabs-list:has(.mdx-tabs-trigger:nth-child(1) .mdx-tabs-radio:checked) ~ .mdx-tabs-panel:nth-of-type(1),
@@ -234,6 +273,113 @@
   vertical-align: baseline;
 }
 
+/* --- Details --- */
+
+.mdx-details {
+  margin-bottom: 1.25rem;
+  border: 1px solid var(--owo-border, #e2e8f0);
+  border-radius: 8px;
+  overflow: hidden;
+}
+
+.mdx-details-summary {
+  padding: 0.625rem 1rem;
+  font-size: 0.95rem;
+  font-weight: 600;
+  cursor: pointer;
+  color: var(--owo-text, #1e293b);
+  background-color: var(--owo-surface-raised, #f8fafc);
+  list-style: none;
+}
+
+.mdx-details-summary::-webkit-details-marker { display: none; }
+
+.mdx-details-summary::before {
+  content: "▸";
+  display: inline-block;
+  margin-right: 0.5rem;
+  transition: transform 0.15s;
+}
+
+.mdx-details[open] > .mdx-details-summary::before {
+  transform: rotate(90deg);
+}
+
+.mdx-details-body {
+  padding: 0.875rem 1rem;
+  border-top: 1px solid var(--owo-border, #e2e8f0);
+}
+
+.mdx-details .mdx-details-body > :first-child { margin-top: 0; }
+.mdx-details .mdx-details-body > :last-child  { margin-bottom: 0; }
+
+/* --- LinkCard --- */
+
+.mdx-link-card {
+  display: block;
+  margin-bottom: 1.25rem;
+  padding: 0.875rem 1rem;
+  border: 1px solid var(--owo-border, #e2e8f0);
+  border-radius: 8px;
+  text-decoration: none;
+  color: inherit;
+  transition: border-color 0.15s, box-shadow 0.15s;
+}
+
+.mdx-link-card:hover {
+  border-color: var(--owo-brand, #3b82f6);
+  box-shadow: 0 2px 8px color-mix(in srgb, var(--owo-brand, #3b82f6) 12%, transparent);
+}
+
+.mdx-link-card-title {
+  font-size: 0.95rem;
+  font-weight: 600;
+  color: var(--owo-text, #1e293b);
+  margin-bottom: 0.25rem;
+}
+
+.mdx-link-card-desc {
+  font-size: 0.85rem;
+  color: var(--owo-text-muted, #64748b);
+  line-height: 1.5;
+  margin-bottom: 0.35rem;
+}
+
+.mdx-link-card-domain {
+  font-size: 0.75rem;
+  font-family: var(--owo-font-mono, ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace);
+  color: var(--owo-text-muted, #64748b);
+  opacity: 0.7;
+}
+
+/* --- CodeTab --- */
+
+.mdx-code-tab {
+  margin-bottom: 0;
+}
+
+.mdx-code-tab > :first-child { margin-top: 0; }
+.mdx-code-tab > :last-child  { margin-bottom: 0; }
+
+.mdx-code-tab pre {
+  background-color: var(--owo-surface-raised, #f8fafc);
+  padding: 1rem;
+  border: 1px solid var(--owo-border, #e2e8f0);
+  border-radius: 8px;
+  box-shadow: none;
+  overflow-x: auto;
+  margin: 0;
+}
+
+.mdx-code-tab pre code {
+  background-color: transparent;
+  padding: 0;
+  border: none;
+  border-radius: 0;
+  color: inherit;
+  font-size: inherit;
+}
+
 /* --- Unregistered component fallback --- */
 
 [data-mdx-missing] {
@@ -253,6 +399,79 @@
   margin-bottom: 0.25rem;
 }
 
+/* --- Prose isolation for content-bearing component containers ---
+ * Two-class selectors (0,2,1) beat .owomark-prose element (0,1,1). */
+
+.mdx-tabs .mdx-tabs-panel p,
+.mdx-steps .mdx-step-body p,
+.mdx-callout .mdx-callout-content p,
+.mdx-note .mdx-note-body p,
+.mdx-details .mdx-details-body p {
+  margin-bottom: 0.625rem;
+}
+
+.mdx-tabs .mdx-tabs-panel ul,
+.mdx-steps .mdx-step-body ul,
+.mdx-callout .mdx-callout-content ul,
+.mdx-note .mdx-note-body ul,
+.mdx-details .mdx-details-body ul {
+  list-style-type: disc;
+  padding-left: 1.25rem;
+  margin-bottom: 0.625rem;
+}
+
+.mdx-tabs .mdx-tabs-panel ol,
+.mdx-steps .mdx-step-body ol,
+.mdx-callout .mdx-callout-content ol,
+.mdx-note .mdx-note-body ol,
+.mdx-details .mdx-details-body ol {
+  list-style-type: decimal;
+  padding-left: 1.25rem;
+  margin-bottom: 0.625rem;
+}
+
+.mdx-tabs .mdx-tabs-panel pre,
+.mdx-steps .mdx-step-body pre,
+.mdx-callout .mdx-callout-content pre,
+.mdx-note .mdx-note-body pre,
+.mdx-details .mdx-details-body pre {
+  background-color: var(--owo-surface-raised, #f8fafc);
+  padding: 0.75rem 1rem;
+  border: 1px solid var(--owo-border, #e2e8f0);
+  border-radius: 6px;
+  box-shadow: none;
+  overflow-x: auto;
+  margin-top: 0.375rem;
+  margin-bottom: 0.375rem;
+}
+
+.mdx-tabs .mdx-tabs-panel pre code,
+.mdx-steps .mdx-step-body pre code,
+.mdx-callout .mdx-callout-content pre code,
+.mdx-note .mdx-note-body pre code,
+.mdx-details .mdx-details-body pre code {
+  background-color: transparent;
+  padding: 0;
+  border: none;
+  border-radius: 0;
+  color: inherit;
+  font-size: inherit;
+}
+
+.mdx-tabs .mdx-tabs-panel code,
+.mdx-steps .mdx-step-body code,
+.mdx-callout .mdx-callout-content code,
+.mdx-note .mdx-note-body code,
+.mdx-details .mdx-details-body code {
+  font-family: var(--owo-font-mono, ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace);
+  background-color: rgba(148, 163, 184, 0.12);
+  padding: 0.08em 0.28em;
+  border-radius: 3px;
+  border: 1px solid rgba(226, 232, 240, 0.7);
+  color: inherit;
+  font-size: 0.88em;
+}
+
 /* --- Markdown Sandbox --- */
 
 .owo-markdown-sandbox {