sanity-plugin-seofields 1.4.1 → 1.5.0

package/README.md

@@ -6,7 +6,7 @@
 [![GitHub issues](https://img.shields.io/github/issues/hardik-143/sanity-plugin-seofields?color=orange)](https://github.com/hardik-143/sanity-plugin-seofields/issues)
 [![GitHub stars](https://img.shields.io/github/stars/hardik-143/sanity-plugin-seofields?style=social)](https://github.com/hardik-143/sanity-plugin-seofields)
 
-A comprehensive Sanity Studio v3 plugin to manage SEO fields like meta titles, descriptions, Open Graph tags, and X (Formerly Twitter) Cards for structured, search-optimized content.
+A comprehensive Sanity Studio (v3/v4/v5) plugin to manage SEO fields like meta titles, descriptions, Open Graph tags, and X (Formerly Twitter) Cards for structured, search-optimized content.
 
 ## ✨ Features
 

package/dist/SeoHealthDashboard-3VBITMWT.cjs

@@ -0,0 +1,10 @@
+'use strict';
+
+var chunkDYVCCQHT_cjs = require('./chunk-DYVCCQHT.cjs');
+require('./chunk-S367Y35J.cjs');
+
+
+
+module.exports = chunkDYVCCQHT_cjs.SeoHealthDashboard_default;
+//# sourceMappingURL=SeoHealthDashboard-3VBITMWT.cjs.map
+//# sourceMappingURL=SeoHealthDashboard-3VBITMWT.cjs.map

package/dist/SeoHealthDashboard-3VBITMWT.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"SeoHealthDashboard-3VBITMWT.cjs"}

package/dist/SeoHealthDashboard-BNJBRQVN.js

@@ -0,0 +1,4 @@
+export { SeoHealthDashboard_default as default } from './chunk-WUIZN7VI.js';
+import './chunk-2NMEKWO5.js';
+//# sourceMappingURL=SeoHealthDashboard-BNJBRQVN.js.map
+//# sourceMappingURL=SeoHealthDashboard-BNJBRQVN.js.map

package/dist/SeoHealthDashboard-BNJBRQVN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"SeoHealthDashboard-BNJBRQVN.js"}

package/dist/SeoHealthTool-4P6JST5S.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+var chunkDYVCCQHT_cjs = require('./chunk-DYVCCQHT.cjs');
+var chunkS367Y35J_cjs = require('./chunk-S367Y35J.cjs');
+var jsxRuntime = require('react/jsx-runtime');
+
+var SeoHealthTool = (props) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkDYVCCQHT_cjs.SeoHealthDashboard_default, chunkS367Y35J_cjs.__spreadValues({}, props));
+};
+var SeoHealthTool_default = SeoHealthTool;
+
+module.exports = SeoHealthTool_default;
+//# sourceMappingURL=SeoHealthTool-4P6JST5S.cjs.map
+//# sourceMappingURL=SeoHealthTool-4P6JST5S.cjs.map

package/dist/SeoHealthTool-4P6JST5S.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SeoHealthTool.tsx"],"names":["jsx","SeoHealthDashboard_default"],"mappings":";;;;;;AAMA,IAAM,aAAA,GAAgB,CAAC,KAAA,KAAmC;AACxD,EAAA,uBAAOA,cAAA,CAACC,mFAAuB,KAAA,CAAO,CAAA;AACxC,CAAA;AAEA,IAAO,qBAAA,GAAQ","file":"SeoHealthTool-4P6JST5S.cjs","sourcesContent":["import SeoHealthDashboard, {SeoHealthDashboardProps} from './SeoHealthDashboard'\n\n/**\n * Sanity Tool component for the SEO Health Dashboard\n * This component wraps the SeoHealthDashboard for use as a custom tool in Sanity Studio\n */\nconst SeoHealthTool = (props: SeoHealthDashboardProps) => {\n  return <SeoHealthDashboard {...props} />\n}\n\nexport default SeoHealthTool\n"]}

package/dist/SeoHealthTool-MQBE5YGN.js

@@ -0,0 +1,12 @@
+import { SeoHealthDashboard_default } from './chunk-WUIZN7VI.js';
+import { __spreadValues } from './chunk-2NMEKWO5.js';
+import { jsx } from 'react/jsx-runtime';
+
+var SeoHealthTool = (props) => {
+  return /* @__PURE__ */ jsx(SeoHealthDashboard_default, __spreadValues({}, props));
+};
+var SeoHealthTool_default = SeoHealthTool;
+
+export { SeoHealthTool_default as default };
+//# sourceMappingURL=SeoHealthTool-MQBE5YGN.js.map
+//# sourceMappingURL=SeoHealthTool-MQBE5YGN.js.map

package/dist/SeoHealthTool-MQBE5YGN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SeoHealthTool.tsx"],"names":[],"mappings":";;;;AAMA,IAAM,aAAA,GAAgB,CAAC,KAAA,KAAmC;AACxD,EAAA,uBAAO,GAAA,CAAC,+CAAuB,KAAA,CAAO,CAAA;AACxC,CAAA;AAEA,IAAO,qBAAA,GAAQ","file":"SeoHealthTool-MQBE5YGN.js","sourcesContent":["import SeoHealthDashboard, {SeoHealthDashboardProps} from './SeoHealthDashboard'\n\n/**\n * Sanity Tool component for the SEO Health Dashboard\n * This component wraps the SeoHealthDashboard for use as a custom tool in Sanity Studio\n */\nconst SeoHealthTool = (props: SeoHealthDashboardProps) => {\n  return <SeoHealthDashboard {...props} />\n}\n\nexport default SeoHealthTool\n"]}

package/dist/SeoPreview-G3LPA7GV.js

@@ -0,0 +1,148 @@
+import { truncate } from './chunk-25JLWVEU.js';
+import './chunk-2NMEKWO5.js';
+import { Box } from '@sanity/ui';
+import { useFormValue } from 'sanity';
+import styled from 'styled-components';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var PreviewContainer = styled.div`
+  max-width: 600px;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  background: #ffffff;
+  border: 1px solid #dadce0;
+  border-radius: 8px;
+  overflow: hidden;
+`;
+var PreviewHeader = styled.div`
+  background: #f8f9fa;
+  padding: 12px 16px;
+  border-bottom: 1px solid #dadce0;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+`;
+var PreviewBody = styled.div`
+  padding: 16px;
+`;
+var SerpUrl = styled.p`
+  margin: 0 0 4px;
+  color: #006621;
+  font-size: 13px;
+  line-height: 1.4;
+  word-break: break-word;
+`;
+var SerpTitle = styled.h3`
+  margin: 0 0 8px;
+  color: #1a0dab;
+  font-size: 18px;
+  font-weight: 500;
+  line-height: 1.4;
+  word-break: break-word;
+
+  &:hover {
+    text-decoration: underline;
+  }
+`;
+var SerpDescription = styled.p`
+  margin: 0;
+  color: #545454;
+  font-size: 14px;
+  line-height: 1.6;
+  word-break: break-word;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+`;
+var LiveIndicator = styled.span`
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 11px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: #4f46e5;
+  background: #f0f4ff;
+  padding: 4px 8px;
+  border-radius: 4px;
+`;
+var SeoPreview = (props) => {
+  var _a, _b;
+  const { path, schemaType } = props;
+  const { options } = schemaType;
+  const baseUrl = (options == null ? void 0 : options.baseUrl) || "https://www.example.com";
+  const prefixFunction = options == null ? void 0 : options.prefix;
+  const parent = useFormValue([path[0]]) || {
+    title: "",
+    description: "",
+    canonicalUrl: ""
+  };
+  const rootDoc = useFormValue([]) || {
+    slug: { current: "" }
+  };
+  const slug = ((_a = rootDoc == null ? void 0 : rootDoc.slug) == null ? void 0 : _a.current) || "";
+  const {
+    title,
+    description,
+    canonicalUrl: url
+  } = parent;
+  const base = (_b = url || baseUrl) == null ? void 0 : _b.replace(/\/+$/, "");
+  const slugStr = String(slug || "").replace(/^\/+/, "");
+  const pref = String(
+    prefixFunction ? prefixFunction(rootDoc) : ""
+  ).replace(/^\/+|\/+$/g, "");
+  const urlPath = [pref, slugStr].filter(Boolean).join("/");
+  const finalUrl = urlPath ? `${base}/${urlPath}` : base;
+  const domain = (() => {
+    try {
+      const u = new URL(finalUrl || base);
+      return u.hostname;
+    } catch (e) {
+      return "example.com";
+    }
+  })();
+  const urlDisplay = `${domain}${urlPath ? ` \u203A ${urlPath.split("/").slice(-1)[0]}` : ""}`;
+  return /* @__PURE__ */ jsx(Box, { padding: 3, children: /* @__PURE__ */ jsxs(PreviewContainer, { children: [
+    /* @__PURE__ */ jsxs(PreviewHeader, { children: [
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          style: {
+            fontSize: "11px",
+            color: "#5f6368",
+            textTransform: "uppercase",
+            letterSpacing: "0.05em"
+          },
+          children: "Search Preview"
+        }
+      ),
+      /* @__PURE__ */ jsxs(LiveIndicator, { children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            style: {
+              width: "4px",
+              height: "4px",
+              borderRadius: "50%",
+              backgroundColor: "#4f46e5",
+              display: "inline-block"
+            }
+          }
+        ),
+        "Live"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(PreviewBody, { children: [
+      /* @__PURE__ */ jsx(SerpUrl, { children: finalUrl ? urlDisplay : "example.com \u203A page-url" }),
+      /* @__PURE__ */ jsx(SerpTitle, { children: title && title.length > 0 ? truncate(title, 60) : "Your SEO Title will appear here" }),
+      /* @__PURE__ */ jsx(SerpDescription, { children: description && description.length > 0 ? truncate(description, 160) : "Your meta description will show up here. Make it compelling!" })
+    ] })
+  ] }) });
+};
+var SeoPreview_default = SeoPreview;
+
+export { SeoPreview_default as default };
+//# sourceMappingURL=SeoPreview-G3LPA7GV.js.map
+//# sourceMappingURL=SeoPreview-G3LPA7GV.js.map

package/dist/SeoPreview-G3LPA7GV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SeoPreview.tsx"],"names":[],"mappings":"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","file":"SeoPreview-G3LPA7GV.js","sourcesContent":["import {Box, Stack, Text} from '@sanity/ui'\nimport React from 'react'\nimport {StringInputProps, useFormValue} from 'sanity'\nimport styled from 'styled-components'\n\nimport {truncate} from '../utils/seoUtils'\n\nconst PreviewContainer = styled.div`\n  max-width: 600px;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n  background: #ffffff;\n  border: 1px solid #dadce0;\n  border-radius: 8px;\n  overflow: hidden;\n`\n\nconst PreviewHeader = styled.div`\n  background: #f8f9fa;\n  padding: 12px 16px;\n  border-bottom: 1px solid #dadce0;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n`\n\nconst PreviewBody = styled.div`\n  padding: 16px;\n`\n\nconst SerpUrl = styled.p`\n  margin: 0 0 4px;\n  color: #006621;\n  font-size: 13px;\n  line-height: 1.4;\n  word-break: break-word;\n`\n\nconst SerpTitle = styled.h3`\n  margin: 0 0 8px;\n  color: #1a0dab;\n  font-size: 18px;\n  font-weight: 500;\n  line-height: 1.4;\n  word-break: break-word;\n\n  &:hover {\n    text-decoration: underline;\n  }\n`\n\nconst SerpDescription = styled.p`\n  margin: 0;\n  color: #545454;\n  font-size: 14px;\n  line-height: 1.6;\n  word-break: break-word;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n`\n\nconst LiveIndicator = styled.span`\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: #4f46e5;\n  background: #f0f4ff;\n  padding: 4px 8px;\n  border-radius: 4px;\n`\n\nconst SeoPreview = (props: StringInputProps): React.ReactElement => {\n  const {path, schemaType} = props\n  const {options} = schemaType as {\n    options?: {\n      baseUrl?: string\n      prefix?: ((doc: {_type?: string} & Record<string, unknown>) => string) | string\n    }\n  }\n  const baseUrl = options?.baseUrl || 'https://www.example.com'\n  const prefixFunction = options?.prefix as\n    | ((doc: {_type?: string} & Record<string, unknown>) => string)\n    | undefined\n  const parent = useFormValue([path[0]]) || {\n    title: '',\n    description: '',\n    canonicalUrl: '',\n  }\n  const rootDoc: {\n    slug?: {current: string}\n  } = useFormValue([]) || {\n    slug: {current: ''},\n  }\n  const slug: string = rootDoc?.slug?.current || ''\n\n  const {\n    title,\n    description,\n    canonicalUrl: url,\n  } = parent as {\n    title?: string\n    description?: string\n    canonicalUrl?: string\n  }\n\n  // Build full URL\n  const base = (url || baseUrl)?.replace(/\\/+$/, '')\n  const slugStr = String(slug || '').replace(/^\\/+/, '')\n  const pref = String(\n    prefixFunction ? prefixFunction(rootDoc as {slug?: {current: string}}) : '',\n  ).replace(/^\\/+|\\/+$/g, '')\n  const urlPath = [pref, slugStr].filter(Boolean).join('/')\n  const finalUrl = urlPath ? `${base}/${urlPath}` : base\n\n  // Extract domain for display\n  const domain = (() => {\n    try {\n      const u = new URL(finalUrl || base)\n      return u.hostname\n    } catch {\n      return 'example.com'\n    }\n  })()\n\n  // Format URL display with › separator\n  const urlDisplay = `${domain}${urlPath ? ` › ${urlPath.split('/').slice(-1)[0]}` : ''}`\n\n  return (\n    <Box padding={3}>\n      <PreviewContainer>\n        <PreviewHeader>\n          <span\n            style={{\n              fontSize: '11px',\n              color: '#5f6368',\n              textTransform: 'uppercase',\n              letterSpacing: '0.05em',\n            }}\n          >\n            Search Preview\n          </span>\n          <LiveIndicator>\n            <span\n              style={{\n                width: '4px',\n                height: '4px',\n                borderRadius: '50%',\n                backgroundColor: '#4f46e5',\n                display: 'inline-block',\n              }}\n            />\n            Live\n          </LiveIndicator>\n        </PreviewHeader>\n\n        <PreviewBody>\n          <SerpUrl>{finalUrl ? urlDisplay : 'example.com › page-url'}</SerpUrl>\n          <SerpTitle>\n            {title && title.length > 0 ? truncate(title, 60) : 'Your SEO Title will appear here'}\n          </SerpTitle>\n          <SerpDescription>\n            {description && description.length > 0\n              ? truncate(description, 160)\n              : 'Your meta description will show up here. Make it compelling!'}\n          </SerpDescription>\n        </PreviewBody>\n      </PreviewContainer>\n    </Box>\n  )\n}\n\nexport default SeoPreview\n"]}

package/dist/SeoPreview-Y3CFDVBR.cjs

@@ -0,0 +1,154 @@
+'use strict';
+
+var chunkIFDLKZET_cjs = require('./chunk-IFDLKZET.cjs');
+require('./chunk-S367Y35J.cjs');
+var ui = require('@sanity/ui');
+var sanity = require('sanity');
+var styled = require('styled-components');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+var PreviewContainer = styled__default.default.div`
+  max-width: 600px;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  background: #ffffff;
+  border: 1px solid #dadce0;
+  border-radius: 8px;
+  overflow: hidden;
+`;
+var PreviewHeader = styled__default.default.div`
+  background: #f8f9fa;
+  padding: 12px 16px;
+  border-bottom: 1px solid #dadce0;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+`;
+var PreviewBody = styled__default.default.div`
+  padding: 16px;
+`;
+var SerpUrl = styled__default.default.p`
+  margin: 0 0 4px;
+  color: #006621;
+  font-size: 13px;
+  line-height: 1.4;
+  word-break: break-word;
+`;
+var SerpTitle = styled__default.default.h3`
+  margin: 0 0 8px;
+  color: #1a0dab;
+  font-size: 18px;
+  font-weight: 500;
+  line-height: 1.4;
+  word-break: break-word;
+
+  &:hover {
+    text-decoration: underline;
+  }
+`;
+var SerpDescription = styled__default.default.p`
+  margin: 0;
+  color: #545454;
+  font-size: 14px;
+  line-height: 1.6;
+  word-break: break-word;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+`;
+var LiveIndicator = styled__default.default.span`
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 11px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: #4f46e5;
+  background: #f0f4ff;
+  padding: 4px 8px;
+  border-radius: 4px;
+`;
+var SeoPreview = (props) => {
+  var _a, _b;
+  const { path, schemaType } = props;
+  const { options } = schemaType;
+  const baseUrl = (options == null ? void 0 : options.baseUrl) || "https://www.example.com";
+  const prefixFunction = options == null ? void 0 : options.prefix;
+  const parent = sanity.useFormValue([path[0]]) || {
+    title: "",
+    description: "",
+    canonicalUrl: ""
+  };
+  const rootDoc = sanity.useFormValue([]) || {
+    slug: { current: "" }
+  };
+  const slug = ((_a = rootDoc == null ? void 0 : rootDoc.slug) == null ? void 0 : _a.current) || "";
+  const {
+    title,
+    description,
+    canonicalUrl: url
+  } = parent;
+  const base = (_b = url || baseUrl) == null ? void 0 : _b.replace(/\/+$/, "");
+  const slugStr = String(slug || "").replace(/^\/+/, "");
+  const pref = String(
+    prefixFunction ? prefixFunction(rootDoc) : ""
+  ).replace(/^\/+|\/+$/g, "");
+  const urlPath = [pref, slugStr].filter(Boolean).join("/");
+  const finalUrl = urlPath ? `${base}/${urlPath}` : base;
+  const domain = (() => {
+    try {
+      const u = new URL(finalUrl || base);
+      return u.hostname;
+    } catch (e) {
+      return "example.com";
+    }
+  })();
+  const urlDisplay = `${domain}${urlPath ? ` \u203A ${urlPath.split("/").slice(-1)[0]}` : ""}`;
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(PreviewContainer, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(PreviewHeader, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          style: {
+            fontSize: "11px",
+            color: "#5f6368",
+            textTransform: "uppercase",
+            letterSpacing: "0.05em"
+          },
+          children: "Search Preview"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(LiveIndicator, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            style: {
+              width: "4px",
+              height: "4px",
+              borderRadius: "50%",
+              backgroundColor: "#4f46e5",
+              display: "inline-block"
+            }
+          }
+        ),
+        "Live"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs(PreviewBody, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(SerpUrl, { children: finalUrl ? urlDisplay : "example.com \u203A page-url" }),
+      /* @__PURE__ */ jsxRuntime.jsx(SerpTitle, { children: title && title.length > 0 ? chunkIFDLKZET_cjs.truncate(title, 60) : "Your SEO Title will appear here" }),
+      /* @__PURE__ */ jsxRuntime.jsx(SerpDescription, { children: description && description.length > 0 ? chunkIFDLKZET_cjs.truncate(description, 160) : "Your meta description will show up here. Make it compelling!" })
+    ] })
+  ] }) });
+};
+var SeoPreview_default = SeoPreview;
+
+module.exports = SeoPreview_default;
+//# sourceMappingURL=SeoPreview-Y3CFDVBR.cjs.map
+//# sourceMappingURL=SeoPreview-Y3CFDVBR.cjs.map

package/dist/SeoPreview-Y3CFDVBR.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SeoPreview.tsx"],"names":["styled","useFormValue","jsx","Box","jsxs","truncate"],"mappings":"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","file":"SeoPreview-Y3CFDVBR.cjs","sourcesContent":["import {Box, Stack, Text} from '@sanity/ui'\nimport React from 'react'\nimport {StringInputProps, useFormValue} from 'sanity'\nimport styled from 'styled-components'\n\nimport {truncate} from '../utils/seoUtils'\n\nconst PreviewContainer = styled.div`\n  max-width: 600px;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n  background: #ffffff;\n  border: 1px solid #dadce0;\n  border-radius: 8px;\n  overflow: hidden;\n`\n\nconst PreviewHeader = styled.div`\n  background: #f8f9fa;\n  padding: 12px 16px;\n  border-bottom: 1px solid #dadce0;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n`\n\nconst PreviewBody = styled.div`\n  padding: 16px;\n`\n\nconst SerpUrl = styled.p`\n  margin: 0 0 4px;\n  color: #006621;\n  font-size: 13px;\n  line-height: 1.4;\n  word-break: break-word;\n`\n\nconst SerpTitle = styled.h3`\n  margin: 0 0 8px;\n  color: #1a0dab;\n  font-size: 18px;\n  font-weight: 500;\n  line-height: 1.4;\n  word-break: break-word;\n\n  &:hover {\n    text-decoration: underline;\n  }\n`\n\nconst SerpDescription = styled.p`\n  margin: 0;\n  color: #545454;\n  font-size: 14px;\n  line-height: 1.6;\n  word-break: break-word;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n`\n\nconst LiveIndicator = styled.span`\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: #4f46e5;\n  background: #f0f4ff;\n  padding: 4px 8px;\n  border-radius: 4px;\n`\n\nconst SeoPreview = (props: StringInputProps): React.ReactElement => {\n  const {path, schemaType} = props\n  const {options} = schemaType as {\n    options?: {\n      baseUrl?: string\n      prefix?: ((doc: {_type?: string} & Record<string, unknown>) => string) | string\n    }\n  }\n  const baseUrl = options?.baseUrl || 'https://www.example.com'\n  const prefixFunction = options?.prefix as\n    | ((doc: {_type?: string} & Record<string, unknown>) => string)\n    | undefined\n  const parent = useFormValue([path[0]]) || {\n    title: '',\n    description: '',\n    canonicalUrl: '',\n  }\n  const rootDoc: {\n    slug?: {current: string}\n  } = useFormValue([]) || {\n    slug: {current: ''},\n  }\n  const slug: string = rootDoc?.slug?.current || ''\n\n  const {\n    title,\n    description,\n    canonicalUrl: url,\n  } = parent as {\n    title?: string\n    description?: string\n    canonicalUrl?: string\n  }\n\n  // Build full URL\n  const base = (url || baseUrl)?.replace(/\\/+$/, '')\n  const slugStr = String(slug || '').replace(/^\\/+/, '')\n  const pref = String(\n    prefixFunction ? prefixFunction(rootDoc as {slug?: {current: string}}) : '',\n  ).replace(/^\\/+|\\/+$/g, '')\n  const urlPath = [pref, slugStr].filter(Boolean).join('/')\n  const finalUrl = urlPath ? `${base}/${urlPath}` : base\n\n  // Extract domain for display\n  const domain = (() => {\n    try {\n      const u = new URL(finalUrl || base)\n      return u.hostname\n    } catch {\n      return 'example.com'\n    }\n  })()\n\n  // Format URL display with › separator\n  const urlDisplay = `${domain}${urlPath ? ` › ${urlPath.split('/').slice(-1)[0]}` : ''}`\n\n  return (\n    <Box padding={3}>\n      <PreviewContainer>\n        <PreviewHeader>\n          <span\n            style={{\n              fontSize: '11px',\n              color: '#5f6368',\n              textTransform: 'uppercase',\n              letterSpacing: '0.05em',\n            }}\n          >\n            Search Preview\n          </span>\n          <LiveIndicator>\n            <span\n              style={{\n                width: '4px',\n                height: '4px',\n                borderRadius: '50%',\n                backgroundColor: '#4f46e5',\n                display: 'inline-block',\n              }}\n            />\n            Live\n          </LiveIndicator>\n        </PreviewHeader>\n\n        <PreviewBody>\n          <SerpUrl>{finalUrl ? urlDisplay : 'example.com › page-url'}</SerpUrl>\n          <SerpTitle>\n            {title && title.length > 0 ? truncate(title, 60) : 'Your SEO Title will appear here'}\n          </SerpTitle>\n          <SerpDescription>\n            {description && description.length > 0\n              ? truncate(description, 160)\n              : 'Your meta description will show up here. Make it compelling!'}\n          </SerpDescription>\n        </PreviewBody>\n      </PreviewContainer>\n    </Box>\n  )\n}\n\nexport default SeoPreview\n"]}