@tomako/tools-runtime 0.1.0 → 0.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tomako/tools-runtime",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Shared interactive tools runtime for Tomako-FE workspace dialogs and Tomako-SEO tool pages",
   "type": "module",
   "exports": {
@@ -579,7 +579,6 @@
   ],
   "sideEffects": false,
   "peerDependencies": {
-    "@tomako/public-chrome": ">=0.1.0",
     "@tomako/ui": ">=0.1.0",
     "next": ">=15",
     "next-intl": ">=4",
@@ -619,8 +618,7 @@
     "react-dom": "^19.0.0",
     "typescript": "^5.8.0",
     "zod": "^4.4.3",
-    "@tomako/ui": "0.1.0",
-    "@tomako/public-chrome": "0.1.0"
+    "@tomako/ui": "0.1.0"
   },
   "license": "UNLICENSED",
   "publishConfig": {

package/src/components/tomato-logo.tsx

@@ -0,0 +1,71 @@
+import type { CSSProperties } from "react";
+
+export type TomatoLogoProps = {
+  href: string;
+  className?: string;
+  label?: string;
+  showUnionMark?: boolean;
+  inverted?: boolean;
+  target?: "_blank" | "_self" | "_parent" | "_top";
+  rel?: string;
+  /**
+   * When running behind an asset host / CDN.
+   * Keep it optional since SEO/public routes typically serve assets from `/`.
+   */
+  assetPrefix?: string;
+};
+
+export function TomatoLogo({
+  href,
+  className,
+  label = "Tomako",
+  showUnionMark,
+  inverted = false,
+  target,
+  rel,
+  assetPrefix = "",
+}: TomatoLogoProps) {
+  const shouldShowUnionMark = showUnionMark ?? className === undefined;
+  const resolvedClassName =
+    className ??
+    "group flex w-[172px] shrink-0 cursor-pointer items-center justify-start gap-3 border-r border-[#DDD8CF] px-5 transition-colors hover:bg-white";
+
+  const backgroundImageBase: CSSProperties = {
+    backgroundRepeat: "no-repeat",
+    backgroundPosition: "center",
+    backgroundSize: "contain",
+    imageRendering: "pixelated" as CSSProperties["imageRendering"],
+  };
+
+  return (
+    <a
+      href={href}
+      className={resolvedClassName}
+      target={target}
+      rel={rel}
+      aria-label={label}
+    >
+      <span
+        aria-hidden
+        className="block h-[29px] w-[35px] bg-contain bg-center bg-no-repeat [image-rendering:pixelated]"
+        style={{
+          ...backgroundImageBase,
+          backgroundImage: `url('${assetPrefix}/landing/tomato-mark.svg')`,
+        }}
+      />
+      {shouldShowUnionMark ? (
+        <span
+          aria-hidden
+          className={`block h-[18px] w-[88px] bg-contain bg-left bg-no-repeat ${inverted ? "invert" : ""}`}
+          style={{
+            ...backgroundImageBase,
+            backgroundImage: `url('${assetPrefix}/landing/tomako-union-mark.svg')`,
+          }}
+        />
+      ) : null}
+    </a>
+  );
+}
+
+export default TomatoLogo;
+

package/src/features/tools/shared/tool-page-shell.tsx

@@ -3,18 +3,8 @@ import Image from "next/image";
 import type { ReactNode } from "react";
 
 import { relatedToolSlugsByTool } from "../../../constants/related-tools";
-import {
-  RelatedTools,
-  SiteFooter,
-  SiteNavigation,
-  getAuthClientMessages,
-  siteConfig,
-  type SiteNavigationCopy,
-} from "../../../host/server";
-import { bcp47ByLocale } from "../../../i18n/locale-fallback";
+import { RelatedTools } from "../../../host/server";
 import type { AppLocale } from "../../../i18n/locale";
-import { localizedPath } from "../../../lib/routing/locale-paths";
-import { serializeJsonLd } from "../../../lib/seo-meta";
 import { resolveToolLocaleCopy } from "../../../lib/tools/resolve-tool-locale-copy";
 
 import type { ToolSpec } from "../types";
@@ -62,136 +52,20 @@ export async function ToolPageShell({
   handoffSlot?: ReactNode;
   children: React.ReactNode;
 }) {
+  // ToolMarketingShell 在 SEO route 层输出 JSON-LD / 导航 / 页脚；
+  // runtime 仅保留 hero / 内容 / related tools 的布局。
+  void faqItems;
+  void handoffSlot;
+
   const copy = resolveToolLocaleCopy(spec, locale);
   const relatedToolSlugs = relatedToolSlugsByTool[spec.slug];
   const displayTitle = copy.displayTitle ?? copy.title;
   // Full messages: public getRequestConfig omits toolsPages; client tools layout alone is not enough for RSC.
   const messages = await loadToolMessages(locale);
   const t = createToolMessageTranslator(locale, messages, "toolsPages.shared");
-  const navT = createToolMessageTranslator(locale, messages, "page.landing.hero");
-  const navigationCopy: SiteNavigationCopy = {
-    languageLabel: navT("languageLabel"),
-    productCapabilities: navT.raw("atomicCapabilities") as SiteNavigationCopy["productCapabilities"],
-    nav: {
-      tools: navT("nav.tools"),
-      viewAllTools: navT("nav.viewAllTools"),
-      pricing: navT("nav.pricing"),
-      blog: navT("nav.blog"),
-      skills: navT("nav.skills"),
-    },
-  };
-  const authMessages = await getAuthClientMessages(locale);
-  const toolUrl = new URL(
-    localizedPath(locale, `tools/${spec.slug}`),
-    siteConfig.url,
-  ).href;
-  const toolJsonLd = {
-    "@context": "https://schema.org",
-    "@type": "WebApplication",
-    name: copy.title,
-    description: copy.description,
-    url: toolUrl,
-    applicationCategory: "BusinessApplication",
-    operatingSystem: "Web",
-    inLanguage: bcp47ByLocale[locale],
-    isAccessibleForFree: true,
-    offers: {
-      "@type": "Offer",
-      price: "0",
-      priceCurrency: "USD",
-    },
-  };
-
-  const breadcrumbJsonLd = {
-    "@context": "https://schema.org",
-    "@type": "BreadcrumbList",
-    itemListElement: [
-      {
-        "@type": "ListItem",
-        position: 1,
-        name: siteConfig.name,
-        item: new URL(localizedPath(locale), siteConfig.url).href,
-      },
-      {
-        "@type": "ListItem",
-        position: 2,
-        name: t("breadcrumbTools"),
-        item: new URL(localizedPath(locale, "tools"), siteConfig.url).href,
-      },
-      {
-        "@type": "ListItem",
-        position: 3,
-        name: copy.title,
-        item: toolUrl,
-      },
-    ],
-  };
-
-  // FAQ 来源优先级：显式 faqItems（package 工具）→ toolsPages.{camelSlug}.guide.faqItems；都缺失时不输出 FAQPage
-  let resolvedFaqItems: Array<{ question: string; answer: string }> =
-    faqItems ?? [];
-  if (resolvedFaqItems.length === 0) {
-    const camelSlug = spec.slug.replace(/-([a-z0-9])/g, (_, char: string) =>
-      char.toUpperCase(),
-    );
-    try {
-      const guideT = createToolMessageTranslator(
-        locale,
-        messages,
-        `toolsPages.${camelSlug}.guide`,
-      );
-      const rawFaqItems = guideT.raw("faqItems") as unknown;
-      resolvedFaqItems = Array.isArray(rawFaqItems)
-        ? rawFaqItems.filter(
-            (item): item is { question: string; answer: string } =>
-              typeof item?.question === "string" &&
-              typeof item?.answer === "string",
-          )
-        : [];
-    } catch {
-      resolvedFaqItems = [];
-    }
-  }
-  const faqJsonLd: Record<string, unknown> | null =
-    resolvedFaqItems.length > 0
-      ? {
-          "@context": "https://schema.org",
-          "@type": "FAQPage",
-          mainEntity: resolvedFaqItems.map((item) => ({
-            "@type": "Question",
-            name: item.question,
-            acceptedAnswer: {
-              "@type": "Answer",
-              text: item.answer,
-            },
-          })),
-        }
-      : null;
 
   return (
     <div className="min-h-screen overflow-x-clip bg-white text-[#111111]">
-      <script
-        type="application/ld+json"
-        dangerouslySetInnerHTML={{ __html: serializeJsonLd(toolJsonLd) }}
-      />
-      <script
-        type="application/ld+json"
-        dangerouslySetInnerHTML={{ __html: serializeJsonLd(breadcrumbJsonLd) }}
-      />
-      {faqJsonLd ? (
-        <script
-          type="application/ld+json"
-          dangerouslySetInnerHTML={{ __html: serializeJsonLd(faqJsonLd) }}
-        />
-      ) : null}
-      <SiteNavigation
-        locale={locale}
-        copy={navigationCopy}
-        authMessages={authMessages}
-        surface="solid"
-        className="sticky top-0 z-50 border-t-0"
-      />
-      {handoffSlot}
       <main className="overflow-x-clip">
       {heroVariant === "immersive" ? (
         <>
@@ -342,7 +216,6 @@ export async function ToolPageShell({
         </div>
       ) : null}
       </main>
-      <SiteFooter locale={locale} />
     </div>
   );
 }

package/src/features/tools/tarot-reading/tarot-reading.container.tsx

@@ -2,16 +2,12 @@ import {
     ArrowRight,
     CopyCheck,
 } from "lucide-react";
-import { TomatoLogo } from "@tomako/public-chrome";
+import { TomatoLogo } from "../../../components/tomato-logo";
 import { createToolGuideTranslator } from "../shared/tool-message-translator";
 import type { CSSProperties } from "react";
-import { siteConfig } from "../../../host/server";
 import { isZhRouteLocale } from "../../../i18n/locale-fallback";
 import type { AppLocale } from "../../../i18n/locale";
 import { buildAppHomeUrl } from "../../../lib/app-origin";
-import { localizedPath } from "../../../lib/routing/locale-paths";
-import { serializeJsonLd } from "../../../lib/seo-meta";
-import { resolveToolLocaleCopy } from "../../../lib/tools/resolve-tool-locale-copy";
 import { TarotReadingWidget } from "./widget";
 import { ToolCta } from "../shared/tool-cta";
 import {
@@ -288,33 +284,16 @@ function TimelineRows({ items }: { items: readonly TextCard[] }) {
 
 export async function TarotReadingContainer({ locale, spec }: ToolPageProps) {
   const t = await createToolGuideTranslator(locale, "toolsPages.tarotReading.guide");
-  const copy = resolveToolLocaleCopy(spec, locale);
   const valueItems = t.raw("valueItems") as readonly TextCard[];
   const flowItems = t.raw("flowItems") as readonly TextCard[];
   const marketingItems = t.raw("marketingItems") as readonly TextCard[];
   const boundaryItems = t.raw("boundaryItems") as readonly TextCard[];
   const faqItems = t.raw("faqItems") as readonly FaqItem[];
-  const toolUrl = new URL(localizedPath(locale, `tools/${spec.slug}`), siteConfig.url).href;
-  const toolJsonLd = {
-    "@context": "https://schema.org",
-    "@type": "WebApplication",
-    name: copy.title,
-    description: copy.description,
-    url: toolUrl,
-    applicationCategory: "LifestyleApplication",
-    operatingSystem: "Web",
-    inLanguage: locale,
-    isAccessibleForFree: true,
-  };
 
   return (
     <main className="min-h-screen bg-[#F7F6F2] text-[#111111]">
       {/* eslint-disable-next-line @next/next/no-css-tags -- keep tarot-only styles off every /tools/[slug] page. */}
       <link rel="stylesheet" href="/tools/tarot-reading.css" />
-      <script
-        type="application/ld+json"
-        dangerouslySetInnerHTML={{ __html: serializeJsonLd(toolJsonLd) }}
-      />
       <section className="relative min-h-svh overflow-hidden bg-black text-[#F7F0DE]">
         <TarotAtmosphere />
         <HeroChrome locale={locale} />