@typecaast/skins 0.1.0 → 0.2.0

package/dist/chunk-CCT33UVA.cjs

@@ -0,0 +1,591 @@
+"use client";
+'use strict';
+
+var zod = require('zod');
+var skinKit = require('@typecaast/skin-kit');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/slack/index.ts
+
+// src/slack/tokens.ts
+var SLACK_COLORS = {
+  light: {
+    bg: "#ffffff",
+    text: "#1d1c1d",
+    subtle: "#616061",
+    border: "#e2e2e2",
+    headerBg: "#ffffff",
+    link: "#1264a3",
+    mentionText: "#1264a3",
+    mentionBg: "#e8f5fa",
+    codeText: "#e01e5a",
+    codeBg: "#f6f6f6",
+    codeBorder: "#e2e2e2",
+    reactionBg: "#f8f8f8",
+    reactionBorder: "#e2e2e2",
+    reactionText: "#454245",
+    composerBg: "#ffffff",
+    composerBorder: "#8d8d8d",
+    placeholder: "#8d8d8d",
+    primary: "#007a5a",
+    primaryText: "#ffffff",
+    buttonBorder: "#d1d1d1",
+    buttonText: "#1d1c1d",
+    appBadgeBg: "#e8e8e8",
+    appBadgeText: "#616061",
+    cardBar: "#dddddd",
+    caret: "#1264a3"
+  },
+  dark: {
+    bg: "#1a1d21",
+    text: "#d1d2d3",
+    subtle: "#ababad",
+    border: "#35373b",
+    headerBg: "#1a1d21",
+    link: "#1d9bd1",
+    mentionText: "#1d9bd1",
+    mentionBg: "rgba(29,155,209,0.12)",
+    codeText: "#e06c9a",
+    codeBg: "#222529",
+    codeBorder: "#35373b",
+    reactionBg: "#222529",
+    reactionBorder: "#35373b",
+    reactionText: "#d1d2d3",
+    composerBg: "#222529",
+    composerBorder: "#565856",
+    placeholder: "#9a9b9d",
+    primary: "#007a5a",
+    primaryText: "#ffffff",
+    buttonBorder: "#565856",
+    buttonText: "#d1d2d3",
+    appBadgeBg: "#35373b",
+    appBadgeText: "#ababad",
+    cardBar: "#35373b",
+    caret: "#1d9bd1"
+  }
+};
+var slackTokens = {
+  light: { colors: SLACK_COLORS.light },
+  dark: { colors: SLACK_COLORS.dark }
+};
+
+// src/slack/fonts.ts
+var slackFonts = [
+  {
+    family: "Lato",
+    weights: [400, 700, 900],
+    sources: [
+      {
+        url: "https://fonts.gstatic.com/s/lato/v24/S6uyw4BMUTPHjx4wXiWtFCc.woff2",
+        weight: 400,
+        format: "woff2"
+      },
+      {
+        url: "https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2",
+        weight: 700,
+        format: "woff2"
+      },
+      {
+        url: "https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh50XSwiPGQ3q5d0.woff2",
+        weight: 900,
+        format: "woff2"
+      }
+    ]
+  }
+];
+var SLACK_FONT_STACK = 'Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif';
+var AVATAR_RADIUS = 8;
+function joinNames(names) {
+  if (names.length <= 1) return names[0] ?? "";
+  if (names.length === 2) return `${names[0]} and ${names[1]}`;
+  return `${names.slice(0, -1).join(", ")}, and ${names[names.length - 1]}`;
+}
+function formatTime(atMs) {
+  const base = 9 * 3600 * 1e3;
+  const total = Math.floor((base + atMs) / 1e3);
+  const h = Math.floor(total / 3600) % 24;
+  const m = Math.floor(total % 3600 / 60);
+  const ampm = h >= 12 ? "PM" : "AM";
+  const hr = h % 12 === 0 ? 12 : h % 12;
+  return `${hr}:${String(m).padStart(2, "0")} ${ampm}`;
+}
+function initials(name) {
+  return name.split(/\s+/).map((w) => w.charAt(0)).slice(0, 2).join("").toUpperCase();
+}
+function markStyles(c) {
+  return {
+    link: { color: c.link, textDecoration: "none" },
+    mention: {
+      color: c.mentionText,
+      background: c.mentionBg,
+      borderRadius: 3,
+      padding: "0 2px",
+      fontWeight: 600
+    },
+    code: {
+      color: c.codeText,
+      background: c.codeBg,
+      border: `1px solid ${c.codeBorder}`,
+      borderRadius: 3,
+      padding: "1px 4px",
+      fontFamily: "Menlo, Monaco, Consolas, monospace",
+      fontSize: "0.85em"
+    }
+  };
+}
+var AppBadge = ({ c }) => /* @__PURE__ */ jsxRuntime.jsx(
+  "span",
+  {
+    style: {
+      fontSize: 10,
+      fontWeight: 700,
+      letterSpacing: 0.4,
+      background: c.appBadgeBg,
+      color: c.appBadgeText,
+      borderRadius: 2,
+      padding: "1px 4px"
+    },
+    children: "APP"
+  }
+);
+var Avatar = ({ theme, participant, size = 36 }) => {
+  const c = SLACK_COLORS[theme];
+  if (participant.avatar) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "img",
+      {
+        src: participant.avatar,
+        alt: participant.name,
+        width: size,
+        height: size,
+        style: {
+          width: size,
+          height: size,
+          borderRadius: AVATAR_RADIUS,
+          objectFit: "cover",
+          display: "block"
+        }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "aria-label": participant.name,
+      style: {
+        width: size,
+        height: size,
+        borderRadius: AVATAR_RADIUS,
+        background: participant.color ?? "#4a154b",
+        color: "#ffffff",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        fontWeight: 700,
+        fontSize: size * 0.4,
+        border: theme === "dark" ? `1px solid ${c.border}` : void 0
+      },
+      children: initials(participant.name)
+    }
+  );
+};
+function clippingAncestor(el) {
+  let node = el?.parentElement ?? null;
+  while (node) {
+    const o = getComputedStyle(node).overflow;
+    if (o && o !== "visible") return node;
+    node = node.parentElement;
+  }
+  return null;
+}
+var ReactionTooltip = ({
+  reaction
+}) => {
+  const ref = react.useRef(null);
+  const [dx, setDx] = react.useState(0);
+  const code = reaction.shortcode;
+  react.useLayoutEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    const bound = clippingAncestor(el)?.getBoundingClientRect();
+    if (!bound) return;
+    const rect = el.getBoundingClientRect();
+    const m = 8;
+    let shift = 0;
+    if (rect.left < bound.left + m) shift = bound.left + m - rect.left;
+    else if (rect.right > bound.right - m) shift = bound.right - m - rect.right;
+    setDx(shift);
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      ref,
+      role: "tooltip",
+      style: {
+        position: "absolute",
+        bottom: "calc(100% + 9px)",
+        left: "50%",
+        transform: `translateX(calc(-50% + ${dx}px))`,
+        zIndex: 20,
+        width: 220,
+        boxSizing: "border-box",
+        background: "#1a1d21",
+        color: "#e8e8e8",
+        borderRadius: 12,
+        padding: "16px 16px 14px",
+        textAlign: "center",
+        fontSize: 15,
+        lineHeight: 1.4,
+        boxShadow: "0 4px 14px rgba(0,0,0,0.4)",
+        pointerEvents: "none"
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "block", fontSize: 36, marginBottom: 8 }, children: reaction.emoji }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 700 }, children: joinNames(reaction.byNames) }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#ababad" }, children: " reacted with " }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#ababad" }, children: code ? `:${code}:` : reaction.emoji }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            style: {
+              position: "absolute",
+              top: "100%",
+              left: `calc(50% - ${dx}px)`,
+              transform: "translateX(-50%)",
+              width: 0,
+              height: 0,
+              borderLeft: "7px solid transparent",
+              borderRight: "7px solid transparent",
+              borderTop: "7px solid #1a1d21"
+            }
+          }
+        )
+      ]
+    }
+  );
+};
+var Reaction = ({ theme, reaction }) => {
+  const c = SLACK_COLORS[theme];
+  const [hover, setHover] = react.useState(false);
+  const hasReactors = reaction.byNames.length > 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      style: {
+        position: "relative",
+        display: "inline-flex",
+        ...skinKit.popIn(reaction.progress)
+      },
+      onMouseEnter: () => setHover(true),
+      onMouseLeave: () => setHover(false),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "span",
+          {
+            style: {
+              display: "inline-flex",
+              alignItems: "center",
+              gap: 4,
+              background: c.reactionBg,
+              border: `1px solid ${c.reactionBorder}`,
+              color: c.reactionText,
+              borderRadius: 12,
+              padding: "1px 7px",
+              height: 22,
+              fontSize: 12,
+              cursor: hasReactors ? "pointer" : "default"
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 13 }, children: reaction.emoji }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 600, fontVariantNumeric: "tabular-nums" }, children: reaction.count })
+            ]
+          }
+        ),
+        hover && hasReactors ? /* @__PURE__ */ jsxRuntime.jsx(ReactionTooltip, { reaction }) : null
+      ]
+    }
+  );
+};
+var TypingIndicator = ({ theme, author }) => {
+  const c = SLACK_COLORS[theme];
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      style: {
+        display: "flex",
+        alignItems: "center",
+        padding: "2px 16px 4px 60px",
+        color: c.subtle,
+        fontSize: 12,
+        fontStyle: "italic"
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+        author.name,
+        " is typing\u2026"
+      ] })
+    }
+  );
+};
+var Caret = ({ color }) => /* @__PURE__ */ jsxRuntime.jsx(
+  "span",
+  {
+    style: {
+      display: "inline-block",
+      width: 1.5,
+      height: "1.05em",
+      background: color,
+      marginLeft: 1,
+      verticalAlign: "text-bottom"
+    }
+  }
+);
+var Composer = ({ theme, composer }) => {
+  const c = SLACK_COLORS[theme];
+  const hasText = composer.text.length > 0;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { flex: "0 0 auto", padding: "4px 16px 14px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      style: {
+        border: `1px solid ${c.composerBorder}`,
+        borderRadius: 8,
+        background: c.composerBg,
+        padding: "9px 12px",
+        minHeight: 22,
+        fontSize: 15,
+        color: c.text
+      },
+      children: hasText ? /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+        composer.text,
+        /* @__PURE__ */ jsxRuntime.jsx(Caret, { color: c.caret })
+      ] }) : /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: c.placeholder }, children: "Reply\u2026" })
+    }
+  ) });
+};
+function buttonStyle(c, primary) {
+  const base = {
+    borderRadius: 4,
+    padding: "7px 12px",
+    fontWeight: 700,
+    fontSize: 13,
+    cursor: "default",
+    fontFamily: "inherit",
+    lineHeight: 1
+  };
+  return primary ? { ...base, background: c.primary, color: c.primaryText, border: "none" } : {
+    ...base,
+    background: "transparent",
+    color: c.buttonText,
+    border: `1px solid ${c.buttonBorder}`
+  };
+}
+var SystemMessage = ({ theme, message, author }) => {
+  const c = SLACK_COLORS[theme];
+  const actions = message.system?.actions ?? [];
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      style: {
+        display: "flex",
+        gap: 8,
+        padding: "8px 16px 2px",
+        ...skinKit.fadeSlideIn(message.revealProgress)
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: { flex: "0 0 36px", width: 36 }, children: author ? /* @__PURE__ */ jsxRuntime.jsx(Avatar, { theme, participant: author, size: 36 }) : null }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 700, color: c.text }, children: author?.name ?? "App" }),
+            /* @__PURE__ */ jsxRuntime.jsx(AppBadge, { c }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 12, color: c.subtle }, children: formatTime(message.atMs) })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              style: {
+                marginTop: 4,
+                borderLeft: `4px solid ${c.cardBar}`,
+                borderRadius: 2,
+                paddingLeft: 12
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: c.text }, children: /* @__PURE__ */ jsxRuntime.jsx(skinKit.MessageContent, { nodes: message.content, styles: markStyles(c) }) }),
+                actions.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", gap: 8, marginTop: 8 }, children: actions.map((a, i) => /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", style: buttonStyle(c, i === 0), children: a.label }, i)) }) : null
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+var Message = ({ theme, message, author }) => {
+  const c = SLACK_COLORS[theme];
+  const grouped = message.isGrouped;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      style: {
+        display: "flex",
+        gap: 8,
+        padding: grouped ? "2px 16px" : "8px 16px 2px",
+        ...skinKit.fadeSlideIn(message.revealProgress)
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: { flex: "0 0 36px", width: 36 }, children: grouped ? null : /* @__PURE__ */ jsxRuntime.jsx(Avatar, { theme, participant: author, size: 36 }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
+          grouped ? null : /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "baseline", gap: 6 }, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 700, color: c.text }, children: author.name }),
+            author.kind === "app" ? /* @__PURE__ */ jsxRuntime.jsx(AppBadge, { c }) : null,
+            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 12, color: c.subtle, marginLeft: 2 }, children: formatTime(message.atMs) })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: c.text, wordBreak: "break-word" }, children: /* @__PURE__ */ jsxRuntime.jsx(
+            skinKit.MessageContent,
+            {
+              nodes: message.content,
+              styles: markStyles(c),
+              imageStyle: {
+                borderRadius: 8,
+                marginTop: 4,
+                border: `1px solid ${c.border}`,
+                maxWidth: 360
+              }
+            }
+          ) }),
+          message.reactions.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              style: {
+                display: "flex",
+                gap: 4,
+                marginTop: 4,
+                flexWrap: "wrap"
+              },
+              children: message.reactions.map((r, i) => /* @__PURE__ */ jsxRuntime.jsx(Reaction, { theme, reaction: r }, i))
+            }
+          ) : null
+        ] })
+      ]
+    }
+  );
+};
+var Frame = ({
+  theme,
+  options,
+  children
+}) => {
+  const c = SLACK_COLORS[theme];
+  const channel = typeof options?.channel === "string" ? options.channel : "#general";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      style: {
+        fontFamily: SLACK_FONT_STACK,
+        background: c.bg,
+        color: c.text,
+        display: "flex",
+        flexDirection: "column",
+        height: "100%",
+        width: "100%",
+        fontSize: 15,
+        lineHeight: 1.46668,
+        WebkitFontSmoothing: "antialiased"
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "header",
+          {
+            style: {
+              flex: "0 0 auto",
+              padding: "10px 16px",
+              borderBottom: `1px solid ${c.border}`,
+              display: "flex",
+              alignItems: "baseline",
+              gap: 8
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 900, fontSize: 18, color: c.text }, children: "Thread" }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: c.subtle, fontSize: 13 }, children: channel })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            style: {
+              flex: "1 1 auto",
+              minHeight: 0,
+              display: "flex",
+              flexDirection: "column",
+              // Breathing room so the last message/card never touches the bottom edge.
+              paddingBottom: 12
+            },
+            children
+          }
+        )
+      ]
+    }
+  );
+};
+var slackComponents = {
+  Frame,
+  Message,
+  TypingIndicator,
+  Reaction,
+  Composer,
+  SystemMessage,
+  Avatar
+};
+
+// src/slack/capabilities.ts
+var slackCapabilities = {
+  events: {
+    message: "native",
+    reaction: "native",
+    typing: "native",
+    // "X is typing…"
+    composerType: "native",
+    send: "native",
+    edit: "native",
+    delete: "native",
+    readReceipt: "unsupported",
+    // Slack has no per-message read receipts in threads
+    system: "native",
+    // app/PR cards
+    beat: "native"
+  },
+  content: {
+    text: true,
+    image: true
+  },
+  reactions: true,
+  threads: true,
+  readReceipts: false
+};
+
+// src/slack/index.ts
+var slackOptionsSchema = zod.z.object({
+  /** Channel label shown in the thread header (e.g. `"#alerts"`). */
+  channel: zod.z.string().optional(),
+  showThreadHeader: zod.z.boolean().optional()
+});
+var slack = skinKit.defineSkin({
+  id: "slack",
+  meta: {
+    name: "Slack",
+    defaultCanvas: { width: 880, height: 720 },
+    supportsThemes: ["light", "dark"],
+    capabilities: slackCapabilities,
+    optionsSchema: slackOptionsSchema,
+    fonts: slackFonts
+  },
+  components: slackComponents,
+  tokens: slackTokens
+});
+var slack_default = slack;
+
+exports.SLACK_COLORS = SLACK_COLORS;
+exports.slack = slack;
+exports.slack_default = slack_default;
+//# sourceMappingURL=chunk-CCT33UVA.cjs.map
+//# sourceMappingURL=chunk-CCT33UVA.cjs.map

package/dist/chunk-CCT33UVA.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/slack/tokens.ts","../src/slack/fonts.ts","../src/slack/components.tsx","../src/slack/capabilities.ts","../src/slack/index.ts"],"names":["jsx","useRef","useState","useLayoutEffect","jsxs","popIn","fadeSlideIn","MessageContent","z","defineSkin"],"mappings":"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","file":"chunk-CCT33UVA.cjs","sourcesContent":["import type { ResolvedTheme } from \"@typecaast/core\";\nimport type { SkinTokens } from \"@typecaast/skin-kit\";\n\n/** The Slack-style palette per theme (matched to the real app's spacing/color). */\nexport interface SlackColors {\n  bg: string;\n  text: string;\n  subtle: string;\n  border: string;\n  headerBg: string;\n  link: string;\n  mentionText: string;\n  mentionBg: string;\n  codeText: string;\n  codeBg: string;\n  codeBorder: string;\n  reactionBg: string;\n  reactionBorder: string;\n  reactionText: string;\n  composerBg: string;\n  composerBorder: string;\n  placeholder: string;\n  primary: string;\n  primaryText: string;\n  buttonBorder: string;\n  buttonText: string;\n  appBadgeBg: string;\n  appBadgeText: string;\n  cardBar: string;\n  caret: string;\n}\n\nexport const SLACK_COLORS: Record<ResolvedTheme, SlackColors> = {\n  light: {\n    bg: \"#ffffff\",\n    text: \"#1d1c1d\",\n    subtle: \"#616061\",\n    border: \"#e2e2e2\",\n    headerBg: \"#ffffff\",\n    link: \"#1264a3\",\n    mentionText: \"#1264a3\",\n    mentionBg: \"#e8f5fa\",\n    codeText: \"#e01e5a\",\n    codeBg: \"#f6f6f6\",\n    codeBorder: \"#e2e2e2\",\n    reactionBg: \"#f8f8f8\",\n    reactionBorder: \"#e2e2e2\",\n    reactionText: \"#454245\",\n    composerBg: \"#ffffff\",\n    composerBorder: \"#8d8d8d\",\n    placeholder: \"#8d8d8d\",\n    primary: \"#007a5a\",\n    primaryText: \"#ffffff\",\n    buttonBorder: \"#d1d1d1\",\n    buttonText: \"#1d1c1d\",\n    appBadgeBg: \"#e8e8e8\",\n    appBadgeText: \"#616061\",\n    cardBar: \"#dddddd\",\n    caret: \"#1264a3\",\n  },\n  dark: {\n    bg: \"#1a1d21\",\n    text: \"#d1d2d3\",\n    subtle: \"#ababad\",\n    border: \"#35373b\",\n    headerBg: \"#1a1d21\",\n    link: \"#1d9bd1\",\n    mentionText: \"#1d9bd1\",\n    mentionBg: \"rgba(29,155,209,0.12)\",\n    codeText: \"#e06c9a\",\n    codeBg: \"#222529\",\n    codeBorder: \"#35373b\",\n    reactionBg: \"#222529\",\n    reactionBorder: \"#35373b\",\n    reactionText: \"#d1d2d3\",\n    composerBg: \"#222529\",\n    composerBorder: \"#565856\",\n    placeholder: \"#9a9b9d\",\n    primary: \"#007a5a\",\n    primaryText: \"#ffffff\",\n    buttonBorder: \"#565856\",\n    buttonText: \"#d1d2d3\",\n    appBadgeBg: \"#35373b\",\n    appBadgeText: \"#ababad\",\n    cardBar: \"#35373b\",\n    caret: \"#1d9bd1\",\n  },\n};\n\n/** Pack the color sets into the generic `SkinTokens` shape for the contract. */\nexport const slackTokens: { light: SkinTokens; dark: SkinTokens } = {\n  light: { colors: SLACK_COLORS.light as unknown as Record<string, string> },\n  dark: { colors: SLACK_COLORS.dark as unknown as Record<string, string> },\n};\n","import type { FontDeclaration } from \"@typecaast/skin-kit\";\n\n/**\n * Slack uses **Lato** (OFL, bundleable) — the real font, not a substitute\n * (PLAN §19). Sources point at the OFL woff2 files; real bundling/pinning of\n * the font assets lands with the font-map gate (M3a / video runtime).\n */\nexport const slackFonts: FontDeclaration[] = [\n  {\n    family: \"Lato\",\n    weights: [400, 700, 900],\n    sources: [\n      {\n        url: \"https://fonts.gstatic.com/s/lato/v24/S6uyw4BMUTPHjx4wXiWtFCc.woff2\",\n        weight: 400,\n        format: \"woff2\",\n      },\n      {\n        url: \"https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2\",\n        weight: 700,\n        format: \"woff2\",\n      },\n      {\n        url: \"https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh50XSwiPGQ3q5d0.woff2\",\n        weight: 900,\n        format: \"woff2\",\n      },\n    ],\n  },\n];\n\n/** The CSS font stack the skin renders with (declared font first). */\nexport const SLACK_FONT_STACK =\n  'Lato, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif';\n","import {\n  useLayoutEffect,\n  useRef,\n  useState,\n  type CSSProperties,\n  type FC,\n  type ReactNode,\n} from \"react\";\nimport type {\n  AvatarProps,\n  ComposerProps,\n  FrameProps,\n  MessageProps,\n  ReactionProps,\n  SystemProps,\n  TypingProps,\n} from \"@typecaast/core\";\nimport {\n  fadeSlideIn,\n  MessageContent,\n  popIn,\n  type ContentStyles,\n} from \"@typecaast/skin-kit\";\nimport { SLACK_COLORS, type SlackColors } from \"./tokens.js\";\nimport { SLACK_FONT_STACK } from \"./fonts.js\";\n\nconst AVATAR_RADIUS = 8;\n\n/** Join reactor names the way Slack does (\"A\", \"A and B\", \"A, B, and C\"). */\nfunction joinNames(names: string[]): string {\n  if (names.length <= 1) return names[0] ?? \"\";\n  if (names.length === 2) return `${names[0]} and ${names[1]}`;\n  return `${names.slice(0, -1).join(\", \")}, and ${names[names.length - 1]}`;\n}\n\n/** Fabricate a stable wall-clock time from a timeline offset (sim starts 9:00am). */\nfunction formatTime(atMs: number): string {\n  const base = 9 * 3600 * 1000;\n  const total = Math.floor((base + atMs) / 1000);\n  const h = Math.floor(total / 3600) % 24;\n  const m = Math.floor((total % 3600) / 60);\n  const ampm = h >= 12 ? \"PM\" : \"AM\";\n  const hr = h % 12 === 0 ? 12 : h % 12;\n  return `${hr}:${String(m).padStart(2, \"0\")} ${ampm}`;\n}\n\nfunction initials(name: string): string {\n  return name\n    .split(/\\s+/)\n    .map((w) => w.charAt(0))\n    .slice(0, 2)\n    .join(\"\")\n    .toUpperCase();\n}\n\nfunction markStyles(c: SlackColors): ContentStyles {\n  return {\n    link: { color: c.link, textDecoration: \"none\" },\n    mention: {\n      color: c.mentionText,\n      background: c.mentionBg,\n      borderRadius: 3,\n      padding: \"0 2px\",\n      fontWeight: 600,\n    },\n    code: {\n      color: c.codeText,\n      background: c.codeBg,\n      border: `1px solid ${c.codeBorder}`,\n      borderRadius: 3,\n      padding: \"1px 4px\",\n      fontFamily: \"Menlo, Monaco, Consolas, monospace\",\n      fontSize: \"0.85em\",\n    },\n  };\n}\n\nconst AppBadge: FC<{ c: SlackColors }> = ({ c }) => (\n  <span\n    style={{\n      fontSize: 10,\n      fontWeight: 700,\n      letterSpacing: 0.4,\n      background: c.appBadgeBg,\n      color: c.appBadgeText,\n      borderRadius: 2,\n      padding: \"1px 4px\",\n    }}\n  >\n    APP\n  </span>\n);\n\nconst Avatar: FC<AvatarProps> = ({ theme, participant, size = 36 }) => {\n  const c = SLACK_COLORS[theme];\n  if (participant.avatar) {\n    return (\n      <img\n        src={participant.avatar}\n        alt={participant.name}\n        width={size}\n        height={size}\n        style={{\n          width: size,\n          height: size,\n          borderRadius: AVATAR_RADIUS,\n          objectFit: \"cover\",\n          display: \"block\",\n        }}\n      />\n    );\n  }\n  return (\n    <div\n      aria-label={participant.name}\n      style={{\n        width: size,\n        height: size,\n        borderRadius: AVATAR_RADIUS,\n        background: participant.color ?? \"#4a154b\",\n        color: \"#ffffff\",\n        display: \"flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        fontWeight: 700,\n        fontSize: size * 0.4,\n        border: theme === \"dark\" ? `1px solid ${c.border}` : undefined,\n      }}\n    >\n      {initials(participant.name)}\n    </div>\n  );\n};\n\n/** Nearest ancestor that clips overflow — the bound to keep the tooltip inside. */\nfunction clippingAncestor(el: HTMLElement | null): HTMLElement | null {\n  let node = el?.parentElement ?? null;\n  while (node) {\n    const o = getComputedStyle(node).overflow;\n    if (o && o !== \"visible\") return node;\n    node = node.parentElement;\n  }\n  return null;\n}\n\n/**\n * Slack's custom hover tooltip: big emoji over \"<names> reacted with :code:\",\n * with a tail pointing at the reaction. Centered, but **clamped** to stay\n * inside the sim viewport (like Slack clamps to the window) — the tail tracks\n * the reaction so it still points correctly after a shift.\n */\nconst ReactionTooltip: FC<{ reaction: ReactionProps[\"reaction\"] }> = ({\n  reaction,\n}) => {\n  const ref = useRef<HTMLSpanElement>(null);\n  const [dx, setDx] = useState(0);\n  const code = reaction.shortcode;\n\n  useLayoutEffect(() => {\n    const el = ref.current;\n    if (!el) return;\n    const bound = clippingAncestor(el)?.getBoundingClientRect();\n    if (!bound) return;\n    const rect = el.getBoundingClientRect();\n    const m = 8;\n    let shift = 0;\n    if (rect.left < bound.left + m) shift = bound.left + m - rect.left;\n    else if (rect.right > bound.right - m) shift = bound.right - m - rect.right;\n    setDx(shift);\n  }, []);\n\n  return (\n    <span\n      ref={ref}\n      role=\"tooltip\"\n      style={{\n        position: \"absolute\",\n        bottom: \"calc(100% + 9px)\",\n        left: \"50%\",\n        transform: `translateX(calc(-50% + ${dx}px))`,\n        zIndex: 20,\n        width: 220,\n        boxSizing: \"border-box\",\n        background: \"#1a1d21\",\n        color: \"#e8e8e8\",\n        borderRadius: 12,\n        padding: \"16px 16px 14px\",\n        textAlign: \"center\",\n        fontSize: 15,\n        lineHeight: 1.4,\n        boxShadow: \"0 4px 14px rgba(0,0,0,0.4)\",\n        pointerEvents: \"none\",\n      }}\n    >\n      <span style={{ display: \"block\", fontSize: 36, marginBottom: 8 }}>\n        {reaction.emoji}\n      </span>\n      <span style={{ fontWeight: 700 }}>{joinNames(reaction.byNames)}</span>\n      <span style={{ color: \"#ababad\" }}> reacted with </span>\n      <span style={{ color: \"#ababad\" }}>\n        {code ? `:${code}:` : reaction.emoji}\n      </span>\n      {/* downward tail — offset opposite the clamp shift so it stays on the chip */}\n      <span\n        style={{\n          position: \"absolute\",\n          top: \"100%\",\n          left: `calc(50% - ${dx}px)`,\n          transform: \"translateX(-50%)\",\n          width: 0,\n          height: 0,\n          borderLeft: \"7px solid transparent\",\n          borderRight: \"7px solid transparent\",\n          borderTop: \"7px solid #1a1d21\",\n        }}\n      />\n    </span>\n  );\n};\n\nconst Reaction: FC<ReactionProps> = ({ theme, reaction }) => {\n  const c = SLACK_COLORS[theme];\n  const [hover, setHover] = useState(false);\n  const hasReactors = reaction.byNames.length > 0;\n  return (\n    <span\n      style={{\n        position: \"relative\",\n        display: \"inline-flex\",\n        ...popIn(reaction.progress),\n      }}\n      onMouseEnter={() => setHover(true)}\n      onMouseLeave={() => setHover(false)}\n    >\n      <span\n        style={{\n          display: \"inline-flex\",\n          alignItems: \"center\",\n          gap: 4,\n          background: c.reactionBg,\n          border: `1px solid ${c.reactionBorder}`,\n          color: c.reactionText,\n          borderRadius: 12,\n          padding: \"1px 7px\",\n          height: 22,\n          fontSize: 12,\n          cursor: hasReactors ? \"pointer\" : \"default\",\n        }}\n      >\n        <span style={{ fontSize: 13 }}>{reaction.emoji}</span>\n        <span style={{ fontWeight: 600, fontVariantNumeric: \"tabular-nums\" }}>\n          {reaction.count}\n        </span>\n      </span>\n      {hover && hasReactors ? <ReactionTooltip reaction={reaction} /> : null}\n    </span>\n  );\n};\n\n// Slack shows a plain italicized \"<name> is typing…\" line — no bouncing dots\n// (those are an iMessage/WhatsApp idiom, not Slack's).\nconst TypingIndicator: FC<TypingProps> = ({ theme, author }) => {\n  const c = SLACK_COLORS[theme];\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        alignItems: \"center\",\n        padding: \"2px 16px 4px 60px\",\n        color: c.subtle,\n        fontSize: 12,\n        fontStyle: \"italic\",\n      }}\n    >\n      <span>{author.name} is typing…</span>\n    </div>\n  );\n};\n\nconst Caret: FC<{ color: string }> = ({ color }) => (\n  <span\n    style={{\n      display: \"inline-block\",\n      width: 1.5,\n      height: \"1.05em\",\n      background: color,\n      marginLeft: 1,\n      verticalAlign: \"text-bottom\",\n    }}\n  />\n);\n\nconst Composer: FC<ComposerProps> = ({ theme, composer }) => {\n  const c = SLACK_COLORS[theme];\n  const hasText = composer.text.length > 0;\n  return (\n    <div style={{ flex: \"0 0 auto\", padding: \"4px 16px 14px\" }}>\n      <div\n        style={{\n          border: `1px solid ${c.composerBorder}`,\n          borderRadius: 8,\n          background: c.composerBg,\n          padding: \"9px 12px\",\n          minHeight: 22,\n          fontSize: 15,\n          color: c.text,\n        }}\n      >\n        {hasText ? (\n          <span>\n            {composer.text}\n            <Caret color={c.caret} />\n          </span>\n        ) : (\n          <span style={{ color: c.placeholder }}>Reply…</span>\n        )}\n      </div>\n    </div>\n  );\n};\n\nfunction buttonStyle(c: SlackColors, primary: boolean): CSSProperties {\n  const base: CSSProperties = {\n    borderRadius: 4,\n    padding: \"7px 12px\",\n    fontWeight: 700,\n    fontSize: 13,\n    cursor: \"default\",\n    fontFamily: \"inherit\",\n    lineHeight: 1,\n  };\n  return primary\n    ? { ...base, background: c.primary, color: c.primaryText, border: \"none\" }\n    : {\n        ...base,\n        background: \"transparent\",\n        color: c.buttonText,\n        border: `1px solid ${c.buttonBorder}`,\n      };\n}\n\nconst SystemMessage: FC<SystemProps> = ({ theme, message, author }) => {\n  const c = SLACK_COLORS[theme];\n  const actions = message.system?.actions ?? [];\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        gap: 8,\n        padding: \"8px 16px 2px\",\n        ...fadeSlideIn(message.revealProgress),\n      }}\n    >\n      <div style={{ flex: \"0 0 36px\", width: 36 }}>\n        {author ? (\n          <Avatar theme={theme} participant={author} size={36} />\n        ) : null}\n      </div>\n      <div style={{ flex: 1, minWidth: 0 }}>\n        <div style={{ display: \"flex\", alignItems: \"center\", gap: 6 }}>\n          <span style={{ fontWeight: 700, color: c.text }}>\n            {author?.name ?? \"App\"}\n          </span>\n          <AppBadge c={c} />\n          <span style={{ fontSize: 12, color: c.subtle }}>\n            {formatTime(message.atMs)}\n          </span>\n        </div>\n        <div\n          style={{\n            marginTop: 4,\n            borderLeft: `4px solid ${c.cardBar}`,\n            borderRadius: 2,\n            paddingLeft: 12,\n          }}\n        >\n          <div style={{ color: c.text }}>\n            <MessageContent nodes={message.content} styles={markStyles(c)} />\n          </div>\n          {actions.length > 0 ? (\n            <div style={{ display: \"flex\", gap: 8, marginTop: 8 }}>\n              {actions.map((a, i) => (\n                <button key={i} type=\"button\" style={buttonStyle(c, i === 0)}>\n                  {a.label}\n                </button>\n              ))}\n            </div>\n          ) : null}\n        </div>\n      </div>\n    </div>\n  );\n};\n\nconst Message: FC<MessageProps> = ({ theme, message, author }) => {\n  const c = SLACK_COLORS[theme];\n  const grouped = message.isGrouped;\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        gap: 8,\n        padding: grouped ? \"2px 16px\" : \"8px 16px 2px\",\n        ...fadeSlideIn(message.revealProgress),\n      }}\n    >\n      <div style={{ flex: \"0 0 36px\", width: 36 }}>\n        {grouped ? null : (\n          <Avatar theme={theme} participant={author} size={36} />\n        )}\n      </div>\n      <div style={{ flex: 1, minWidth: 0 }}>\n        {grouped ? null : (\n          <div style={{ display: \"flex\", alignItems: \"baseline\", gap: 6 }}>\n            <span style={{ fontWeight: 700, color: c.text }}>\n              {author.name}\n            </span>\n            {author.kind === \"app\" ? <AppBadge c={c} /> : null}\n            <span style={{ fontSize: 12, color: c.subtle, marginLeft: 2 }}>\n              {formatTime(message.atMs)}\n            </span>\n          </div>\n        )}\n        <div style={{ color: c.text, wordBreak: \"break-word\" }}>\n          <MessageContent\n            nodes={message.content}\n            styles={markStyles(c)}\n            imageStyle={{\n              borderRadius: 8,\n              marginTop: 4,\n              border: `1px solid ${c.border}`,\n              maxWidth: 360,\n            }}\n          />\n        </div>\n        {message.reactions.length > 0 ? (\n          <div\n            style={{\n              display: \"flex\",\n              gap: 4,\n              marginTop: 4,\n              flexWrap: \"wrap\",\n            }}\n          >\n            {message.reactions.map((r, i) => (\n              <Reaction key={i} theme={theme} reaction={r} />\n            ))}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  );\n};\n\nconst Frame: FC<FrameProps & { children?: ReactNode }> = ({\n  theme,\n  options,\n  children,\n}) => {\n  const c = SLACK_COLORS[theme];\n  const channel =\n    typeof options?.channel === \"string\" ? options.channel : \"#general\";\n  return (\n    <div\n      style={{\n        fontFamily: SLACK_FONT_STACK,\n        background: c.bg,\n        color: c.text,\n        display: \"flex\",\n        flexDirection: \"column\",\n        height: \"100%\",\n        width: \"100%\",\n        fontSize: 15,\n        lineHeight: 1.46668,\n        WebkitFontSmoothing: \"antialiased\",\n      }}\n    >\n      <header\n        style={{\n          flex: \"0 0 auto\",\n          padding: \"10px 16px\",\n          borderBottom: `1px solid ${c.border}`,\n          display: \"flex\",\n          alignItems: \"baseline\",\n          gap: 8,\n        }}\n      >\n        <span style={{ fontWeight: 900, fontSize: 18, color: c.text }}>\n          Thread\n        </span>\n        <span style={{ color: c.subtle, fontSize: 13 }}>{channel}</span>\n      </header>\n      <div\n        style={{\n          flex: \"1 1 auto\",\n          minHeight: 0,\n          display: \"flex\",\n          flexDirection: \"column\",\n          // Breathing room so the last message/card never touches the bottom edge.\n          paddingBottom: 12,\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n\nexport const slackComponents = {\n  Frame,\n  Message,\n  TypingIndicator,\n  Reaction,\n  Composer,\n  SystemMessage,\n  Avatar,\n};\n","import type { Capabilities } from \"@typecaast/skin-kit\";\n\n/** What the Slack skin supports and how it represents each event/content type. */\nexport const slackCapabilities: Capabilities = {\n  events: {\n    message: \"native\",\n    reaction: \"native\",\n    typing: \"native\", // \"X is typing…\"\n    composerType: \"native\",\n    send: \"native\",\n    edit: \"native\",\n    delete: \"native\",\n    readReceipt: \"unsupported\", // Slack has no per-message read receipts in threads\n    system: \"native\", // app/PR cards\n    beat: \"native\",\n  },\n  content: {\n    text: true,\n    image: true,\n  },\n  reactions: true,\n  threads: true,\n  readReceipts: false,\n};\n","import { z } from \"zod\";\nimport { defineSkin } from \"@typecaast/skin-kit\";\nimport { slackComponents } from \"./components.js\";\nimport { slackCapabilities } from \"./capabilities.js\";\nimport { slackFonts } from \"./fonts.js\";\nimport { slackTokens } from \"./tokens.js\";\n\nconst slackOptionsSchema = z.object({\n  /** Channel label shown in the thread header (e.g. `\"#alerts\"`). */\n  channel: z.string().optional(),\n  showThreadHeader: z.boolean().optional(),\n});\n\n/** A Slack-style thread skin (light + dark). Pixel-faithful, inert chrome. */\nexport const slack = defineSkin({\n  id: \"slack\",\n  meta: {\n    name: \"Slack\",\n    defaultCanvas: { width: 880, height: 720 },\n    supportsThemes: [\"light\", \"dark\"],\n    capabilities: slackCapabilities,\n    optionsSchema: slackOptionsSchema,\n    fonts: slackFonts,\n  },\n  components: slackComponents,\n  tokens: slackTokens,\n});\n\n/** Default export so `@typecaast/skins/slack` can be lazy-imported uniformly. */\nexport default slack;\n"]}