@muibook/components 11.0.1 → 13.0.0

package/dist/esm/index.js

@@ -1,4 +1,4 @@
-import { PartTypes as ct, Parts as dt, getPartMap as ht } from "./utils/part-map/index.js";
+import { PartTypes as dt, Parts as ht, getPartMap as jt } from "./utils/part-map/index.js";
 import "./components/mui-field/index.js";
 import "./components/mui-form-section/index.js";
 import "./components/mui-form-section-footer/index.js";
@@ -36,7 +36,7 @@ import "./components/mui-list/item/index.js";
 import "./components/mui-list/list/index.js";
 import "./components/mui-quote/index.js";
 import "./components/mui-code/index.js";
-import "./components/mui-markdown/index.js";
+import "./components/mui-slide-frame/index.js";
 import "./components/mui-dialog/index.js";
 import "./components/mui-drawer/index.js";
 import "./components/mui-avatar/index.js";
@@ -104,6 +104,7 @@ import "./components/mui-card/body/index.js";
 import "./components/mui-card/footer/index.js";
 import "./components/mui-chip/index.js";
 import "./components/mui-loader/index.js";
+import "./components/mui-skeleton/index.js";
 import "./components/mui-spinner/index.js";
 import "./components/mui-media-player/index.js";
 import "./components/mui-range-input/index.js";
@@ -123,7 +124,7 @@ import "./components/mui-carousel/panel/index.js";
 import "./components/mui-stepper/stepper/index.js";
 import "./components/mui-stepper/step/index.js";
 export {
-  ct as PartTypes,
-  dt as Parts,
-  ht as getPartMap
+  dt as PartTypes,
+  ht as Parts,
+  jt as getPartMap
 };

package/dist/types/components/mui-prompt-preview/index.d.ts

@@ -4,4 +4,5 @@ import "../mui-button";
 import "../mui-icons/close";
 import "../mui-icons/play-rectangle";
 import "../mui-icons/music-microphone";
+import "../mui-spinner";
 import "../mui-stack/vstack";

package/dist/types/components/mui-slide-frame/index.d.ts

@@ -0,0 +1,7 @@
+import "../mui-heading";
+import "../mui-body";
+import "../mui-stack/vstack";
+import "../mui-stack/hstack";
+import "../mui-button";
+import "../mui-icons/warning";
+import "../mui-dialog";

package/dist/types/index.d.ts

@@ -37,7 +37,7 @@ export * from "./components/mui-list/item";
 export * from "./components/mui-list/list";
 export * from "./components/mui-quote";
 export * from "./components/mui-code";
-export * from "./components/mui-markdown";
+export * from "./components/mui-slide-frame";
 export * from "./components/mui-dialog";
 export * from "./components/mui-drawer";
 export * from "./components/mui-avatar";
@@ -105,6 +105,7 @@ export * from "./components/mui-card/body";
 export * from "./components/mui-card/footer";
 export * from "./components/mui-chip";
 export * from "./components/mui-loader";
+export * from "./components/mui-skeleton";
 export * from "./components/mui-spinner";
 export * from "./components/mui-media-player";
 export * from "./components/mui-range-input";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@muibook/components",
-  "version": "11.0.1",
+  "version": "13.0.0",
   "type": "module",
   "description": "A library of MUI-based design system components.",
   "author": "Michael Trilford",
@@ -108,9 +108,9 @@
       "import": "./dist/esm/components/mui-code/index.js",
       "types": "./dist/types/components/mui-code/index.d.ts"
     },
-    "./mui-markdown": {
-      "import": "./dist/esm/components/mui-markdown/index.js",
-      "types": "./dist/types/components/mui-markdown/index.d.ts"
+    "./mui-slide-frame": {
+      "import": "./dist/esm/components/mui-slide-frame/index.js",
+      "types": "./dist/types/components/mui-slide-frame/index.d.ts"
     },
     "./mui-container": {
       "import": "./dist/esm/components/mui-container/index.js",
@@ -540,6 +540,10 @@
       "import": "./dist/esm/components/mui-loader/index.js",
       "types": "./dist/types/components/mui-loader/index.d.ts"
     },
+    "./mui-skeleton": {
+      "import": "./dist/esm/components/mui-skeleton/index.js",
+      "types": "./dist/types/components/mui-skeleton/index.d.ts"
+    },
     "./mui-spinner": {
       "import": "./dist/esm/components/mui-spinner/index.js",
       "types": "./dist/types/components/mui-spinner/index.d.ts"
@@ -576,7 +580,7 @@
   },
   "scripts": {
     "dev": "vite",
-    "build": "npm run cem && tsc && vite build && npm run copy-cem",
+    "build": "npm run cem && rm -rf dist && tsc && vite build && npm run copy-cem",
     "preview": "vite preview",
     "build:muibook": "vite build --config vite.muibook.config.ts",
     "preview:muibook": "vite preview --config vite.muibook.config.ts",
@@ -609,11 +613,7 @@
     "typescript": "~5.8.3",
     "vite": "^6.3.5"
   },
-  "peerDependencies": {
-    "marked": "^12.0.0"
-  },
-  "dependencies": {
-    "marked": "^12.0.0"
-  },
+  "peerDependencies": {},
+  "dependencies": {},
   "customElements": "public/custom-elements.json"
 }

package/dist/esm/components/mui-markdown/index.js

@@ -1,149 +0,0 @@
-import { marked as m } from "marked";
-const u = (n) => n.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\"/g, "&quot;").replace(/'/g, "&#39;"), p = (n) => {
-  const i = n.split(`
-`);
-  let d = !1, t = !1;
-  const o = [];
-  for (const e of i) {
-    if (e.match(/^--\s*box\s*--$/i)) {
-      t ? (o.push("</div>"), t = !1) : (o.push("<div>"), t = !0);
-      continue;
-    }
-    if (e.match(/^--\s*rule\s*--$/i)) {
-      o.push("<mui-rule></mui-rule>");
-      continue;
-    }
-    const c = e.match(/^--\s*space-(\d{3})\s*--$/i);
-    if (c) {
-      const l = c[1];
-      o.push(`<div style="height:var(--space-${l});"></div>`);
-      continue;
-    }
-    const r = e.match(/^--\s*grid-col-([^-]+(?:-[^-]+)*)\s*--$/);
-    if (r) {
-      if (d)
-        o.push("</div>"), d = !1;
-      else {
-        const l = r[1].split("-").join(" ");
-        o.push(
-          `<div style="display:grid;grid-template-columns:${l};gap:var(--space-300);align-items:start;">`
-        ), d = !0;
-      }
-      continue;
-    }
-    o.push(e);
-  }
-  return d && o.push("</div>"), t && o.push("</div>"), o.join(`
-`);
-}, h = (n) => n.toLowerCase().trim().replace(/<[^>]+>/g, "").replace(/[^\w\s-]/g, "").replace(/\s+/g, "-"), b = (n) => {
-  const { bodySize: i, codeSize: d } = n, t = new m.Renderer(), o = /* @__PURE__ */ new Map();
-  return t.heading = (e, s) => {
-    const a = {
-      1: { size: "2", level: "2" },
-      2: { size: "2", level: "2" },
-      3: { size: "4", level: "4" },
-      4: { size: "5", level: "5" },
-      5: { size: "5", level: "5" },
-      6: { size: "5", level: "5" }
-    }, c = a[s] ?? a[4], r = h(e), l = (o.get(r) ?? 0) + 1;
-    return o.set(r, l), `<mui-heading id="${l > 1 ? `${r}-${l}` : r}" size="${c.size}" level="${c.level}">${e}</mui-heading>`;
-  }, t.paragraph = (e) => `<mui-body size="${i}" weight="regular" variant="default">${e}</mui-body>`, t.link = (e, s, a) => {
-    const c = e ? u(e) : "", r = s ? ` title="${u(s)}"` : "";
-    return `<mui-link href="${c}"${r}>${a}</mui-link>`;
-  }, t.list = (e, s) => `<mui-list size="${i}" as="${s ? "ol" : "ul"}">${e}</mui-list>`, t.listitem = (e) => `<mui-list-item size="${i}">${e}</mui-list-item>`, t.hr = () => "<mui-rule></mui-rule>", t.blockquote = (e) => `<mui-quote>${e}</mui-quote>`, t.codespan = (e) => `<span class="md-inline-code">${u(e)}</span>`, t.code = (e) => `<div class="md-code-block">
-      <mui-button class="md-code-copy" size="x-small" variant="tertiary" data-copy-code>Copy</mui-button>
-      <mui-code size="${d}" scrollable>${u(e)}</mui-code>
-    </div>`, t.image = (e, s, a) => {
-    const c = e ? u(e) : "", r = a ? u(a) : "", l = s ? ` title="${u(s)}"` : "";
-    return `<mui-image src="${c}" alt="${r}"${l}></mui-image>`;
-  }, t.table = (e, s) => `<mui-card class="md-table-card">
-      <mui-card-body condensed>
-        <div class="md-table-scroll">
-          <mui-table class="md-table">
-            <mui-row-group heading>${e}</mui-row-group>
-            <mui-row-group>${s}</mui-row-group>
-          </mui-table>
-        </div>
-      </mui-card-body>
-    </mui-card>`, t.tablerow = (e) => {
-    const s = (e.match(/<mui-cell\b/g) || []).length;
-    return `<mui-row columns="${s ? Array(s).fill("1fr").join(" ") : "1fr"}">${e}</mui-row>`;
-  }, t.tablecell = (e) => `<mui-cell>${e}</mui-cell>`, t;
-};
-class g extends HTMLElement {
-  static get observedAttributes() {
-    return ["markdown", "body-size", "code-size"];
-  }
-  constructor() {
-    super(), this.attachShadow({ mode: "open" });
-  }
-  connectedCallback() {
-    this.render(), this.hasAttribute("markdown") || (this.observer = new MutationObserver(() => this.render()), this.observer.observe(this, { childList: !0, subtree: !0, characterData: !0 }));
-  }
-  disconnectedCallback() {
-    this.observer && this.observer.disconnect();
-  }
-  attributeChangedCallback() {
-    this.render();
-  }
-  getBodySize() {
-    const i = this.getAttribute("body-size");
-    return i || "small";
-  }
-  getCodeSize() {
-    const i = this.getAttribute("code-size");
-    return i || "x-small";
-  }
-  getMarkdown() {
-    const i = this.getAttribute("markdown");
-    return i !== null ? i : this.textContent ?? "";
-  }
-  render() {
-    if (!this.shadowRoot) return;
-    const i = this.getMarkdown(), d = p(i), t = b({
-      bodySize: this.getBodySize(),
-      codeSize: this.getCodeSize()
-    }), o = m.parse(d, { renderer: t, gfm: !0 });
-    this.shadowRoot.innerHTML = /*html*/
-    `
-      <style>
-        :host { display: block; }
-        .md-inline-code {
-          display: inline-block;
-          padding: var(--space-025) var(--space-050) var(--space-050);
-          border-radius: var(--radius-100);
-          background: var(--surface-recessed-200);
-          font-size: var(--text-font-size-xs);
-          line-height: 1;
-        }
-        .md-code-block {
-          position: relative;
-        }
-        .md-code-copy {
-          position: absolute;
-          top: var(--space-200);
-          right: var(--space-200);
-          z-index: 1;
-        }
-        .md-table-card {
-          overflow-x: auto;
-        }
-        .md-table-scroll {
-          overflow-x: auto;
-        }
-        .md-table {
-          min-width: 888px;
-        }
-      </style>
-      <div class="md-root">${o}</div>
-    `, this.shadowRoot.querySelectorAll("[data-copy-code]").forEach((s) => {
-      s.onclick = () => {
-        var l;
-        const a = s.closest(".md-code-block"), c = a == null ? void 0 : a.querySelector("mui-code"), r = (c == null ? void 0 : c.textContent) ?? "";
-        r && ((l = navigator.clipboard) == null || l.writeText(r).catch(() => {
-        }));
-      };
-    });
-  }
-}
-customElements.get("mui-markdown") || customElements.define("mui-markdown", g);

package/dist/types/components/mui-agent-bubble/index.d.ts

@@ -1 +0,0 @@
-import "../mui-prompt-message";

package/dist/types/components/mui-agent-prompt/index.d.ts

@@ -1 +0,0 @@
-import "../mui-prompt";

package/dist/types/components/mui-markdown/doc.d.ts

@@ -1,2 +0,0 @@
-import type { MuiDocs } from '../../types/guidelines';
-export declare const muiDocs: MuiDocs;

package/dist/types/components/mui-markdown/index.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/components/mui-prompt-chip/index.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/components/mui-slat/accessory/index.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/tokens/js/mui-brand.d.ts

@@ -1,140 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-export declare const FontFamily = "system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\"";
-export declare const FontSize15 = "1.1rem";
-export declare const FontSize25 = "1.2rem";
-export declare const FontSize50 = "1.4rem";
-export declare const FontSize100 = "1.6rem";
-export declare const FontSize200 = "1.8rem";
-export declare const FontSize300 = "2.1rem";
-export declare const FontSize400 = "2.4rem";
-export declare const FontSize500 = "3.6rem";
-export declare const FontSize600 = "4.8rem";
-export declare const FontSize700 = "6rem";
-export declare const FontSize800 = "7.2rem";
-export declare const FontSize900 = "8.4rem";
-export declare const FontSize1000 = "9.6rem";
-export declare const FontWeight400 = 400;
-export declare const FontWeight500 = 500;
-export declare const FontWeight600 = 600;
-export declare const FontWeight700 = 700;
-export declare const LineHeight15 = 1.63636364;
-export declare const LineHeight25 = 1.5;
-export declare const LineHeight50 = 1.5;
-export declare const LineHeight100 = 1.5;
-export declare const LineHeight200 = 1.33333333;
-export declare const LineHeight300 = 1.14285714;
-export declare const LineHeight400 = 1.5;
-export declare const LineHeight500 = 1.33333333;
-export declare const LineHeight600 = 1.25;
-export declare const LineHeight700 = 1.2;
-export declare const LineHeight800 = 1.16666667;
-export declare const LineHeight900 = 1.14285714;
-export declare const LineHeight1000 = 1.125;
-export declare const Black = "black";
-export declare const BlackOpacity0 = "oklch(0% 0 0 / 0)";
-export declare const BlackOpacity10 = "oklch(0% 0 0 / 0.1)";
-export declare const BlackOpacity20 = "oklch(0% 0 0 / 0.2)";
-export declare const BlackOpacity30 = "oklch(0% 0 0 / 0.3)";
-export declare const BlackOpacity40 = "oklch(0% 0 0 / 0.4)";
-export declare const BlackOpacity50 = "oklch(0% 0 0 / 0.5)";
-export declare const BlackOpacity60 = "oklch(0% 0 0 / 0.6)";
-export declare const BlackOpacity70 = "oklch(0% 0 0 / 0.7)";
-export declare const BlackOpacity80 = "oklch(0% 0 0 / 0.8)";
-export declare const BlackOpacity90 = "oklch(0% 0 0 / 0.9)";
-export declare const BlackOpacity100 = "oklch(0% 0 0)";
-export declare const White = "#ffffff";
-export declare const WhiteOpacity0 = "oklch(100% 0.00011 271.152 / 0)";
-export declare const WhiteOpacity10 = "oklch(100% 0.00011 271.152 / 0.1)";
-export declare const WhiteOpacity20 = "oklch(100% 0.00011 271.152 / 0.2)";
-export declare const WhiteOpacity30 = "oklch(100% 0.00011 271.152 / 0.3)";
-export declare const WhiteOpacity40 = "oklch(100% 0.00011 271.152 / 0.4)";
-export declare const WhiteOpacity50 = "oklch(100% 0.00011 271.152 / 0.5)";
-export declare const WhiteOpacity60 = "oklch(100% 0.00011 271.152 / 0.6)";
-export declare const WhiteOpacity70 = "oklch(100% 0.00011 271.152 / 0.7)";
-export declare const WhiteOpacity80 = "oklch(100% 0.00011 271.152 / 0.8)";
-export declare const WhiteOpacity90 = "oklch(100% 0.00011 271.152 / 0.9)";
-export declare const WhiteOpacity100 = "oklch(100% 0.00011 271.152)";
-export declare const Grey100 = "oklch(97.015% 0.00011 271.152)";
-export declare const Grey200 = "oklch(92.191% 0.0001 271.152)";
-export declare const Grey300 = "oklch(84.522% 0.0001 271.152)";
-export declare const Grey400 = "oklch(73.802% 0.00008 271.152)";
-export declare const Grey500 = "oklch(62.675% 0.00007 271.152)";
-export declare const Grey600 = "oklch(51.028% 0.00006 271.152)";
-export declare const Grey700 = "oklch(44.953% 0.00005 271.152)";
-export declare const Grey800 = "oklch(38.666% 0.00004 271.152)";
-export declare const Grey900 = "oklch(32.109% 0.00004 271.152)";
-export declare const Grey1000 = "oklch(25.197% 0.00003 271.152)";
-export declare const Grey1100 = "oklch(17.764% 0.00002 271.152)";
-export declare const Grey1200 = "oklch(11.492% 0.00001 271.152)";
-export declare const Red100 = "oklch(94.298% 0.02856 17.464)";
-export declare const Red200 = "oklch(85.257% 0.073 18.621)";
-export declare const Red300 = "oklch(76.955% 0.11971 20.149)";
-export declare const Red400 = "oklch(69.42% 0.16807 22.436)";
-export declare const Red500 = "oklch(66.109% 0.20567 24.731)";
-export declare const Red600 = "oklch(61.071% 0.19405 24.981)";
-export declare const Red700 = "oklch(55.216% 0.17078 24.663)";
-export declare const Red800 = "oklch(49.227% 0.14654 24.242)";
-export declare const Red900 = "oklch(43.091% 0.12105 23.663)";
-export declare const Red1000 = "oklch(36.492% 0.10188 23.605)";
-export declare const Orange100 = "oklch(96.185% 0.05114 91.378)";
-export declare const Orange200 = "oklch(91.836% 0.08462 83.908)";
-export declare const Orange300 = "oklch(87.407% 0.11015 76.468)";
-export declare const Orange400 = "oklch(83.05% 0.14525 74.174)";
-export declare const Orange500 = "oklch(79.268% 0.17097 70.665)";
-export declare const Orange600 = "oklch(73.132% 0.15757 70.839)";
-export declare const Orange700 = "oklch(66.987% 0.14451 70.626)";
-export declare const Orange800 = "oklch(60.887% 0.131 71.081)";
-export declare const Orange900 = "oklch(54.307% 0.11663 71.398)";
-export declare const Orange1000 = "oklch(47.653% 0.10248 71.169)";
-export declare const Green100 = "oklch(96.2% 0.03372 145.458)";
-export declare const Green200 = "oklch(92.081% 0.07615 144.989)";
-export declare const Green300 = "oklch(88.132% 0.1196 144.516)";
-export declare const Green400 = "oklch(84.505% 0.16079 144.017)";
-export declare const Green500 = "oklch(69.175% 0.23537 142.511)";
-export declare const Green600 = "oklch(63.389% 0.21568 142.511)";
-export declare const Green700 = "oklch(57.753% 0.1965 142.511)";
-export declare const Green800 = "oklch(51.683% 0.17585 142.511)";
-export declare const Green900 = "oklch(45.731% 0.1556 142.511)";
-export declare const Green1000 = "oklch(39.578% 0.13466 142.511)";
-export declare const Blue100 = "oklch(95.602% 0.0218 250.322)";
-export declare const Blue200 = "oklch(90.972% 0.04516 251.46)";
-export declare const Blue300 = "oklch(82.385% 0.0912 250.939)";
-export declare const Blue400 = "oklch(78.78% 0.1052 250.12)";
-export declare const Blue500 = "oklch(75.415% 0.12865 244.876)";
-export declare const Blue600 = "oklch(63.51% 0.14875 249.18)";
-export declare const Blue700 = "oklch(65.713% 0.15534 248.849)";
-export declare const Blue800 = "oklch(61.155% 0.16718 250.868)";
-export declare const Blue900 = "oklch(56.802% 0.17759 253.446)";
-export declare const Blue1000 = "oklch(48.635% 0.15054 253.129)";
-export declare const Radius100 = "4px";
-export declare const Radius150 = "6px";
-export declare const Radius200 = "8px";
-export declare const Radius300 = "16px";
-export declare const Radius400 = "24px";
-export declare const Radius500 = "36px";
-export declare const Radius600 = "48px";
-export declare const Radius000 = "0";
-export declare const Space100 = "0.6rem";
-export declare const Space200 = "0.8rem";
-export declare const Space300 = "1.2rem";
-export declare const Space400 = "1.6rem";
-export declare const Space500 = "2.4rem";
-export declare const Space600 = "3.6rem";
-export declare const Space700 = "4.8rem";
-export declare const Space800 = "6rem";
-export declare const Space000 = "0";
-export declare const Space025 = "0.2rem";
-export declare const Space050 = "0.4rem";
-export declare const StrokeSize100 = "1px";
-export declare const StrokeSize200 = "2px";
-export declare const StrokeSize300 = "3px";
-export declare const StrokeSize400 = "4px";
-export declare const StrokeSize500 = "5px";
-export declare const StrokeSolid = "solid";
-export declare const StrokeOutset = "outset";
-export declare const Speed100 = "0.1s";
-export declare const Speed200 = "0.2s";
-export declare const Speed300 = "0.3s";
-export declare const Speed400 = "0.4s";