@opinly/next 0.1.10 → 0.1.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/blog-post/_components/content.cjs +19 -7
- package/dist/components/blog-post/_components/content.cjs.map +1 -1
- package/dist/components/blog-post/_components/content.js +19 -7
- package/dist/components/blog-post/_components/content.js.map +1 -1
- package/dist/components/blog-post/_components/table-of-contents.cjs +0 -1
- package/dist/components/blog-post/_components/table-of-contents.cjs.map +1 -1
- package/dist/components/blog-post/_components/table-of-contents.js +0 -1
- package/dist/components/blog-post/_components/table-of-contents.js.map +1 -1
- package/dist/components/blog-post/index.cjs +0 -1
- package/dist/components/blog-post/index.cjs.map +1 -1
- package/dist/components/blog-post/index.js +0 -1
- package/dist/components/blog-post/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -36,6 +36,7 @@ var import_merge = require("../../../utils/merge");
|
|
|
36
36
|
var import_link = __toESM(require("next/link"), 1);
|
|
37
37
|
var import_image = __toESM(require("next/image"), 1);
|
|
38
38
|
var import_sdk_config = require("../../../utils/sdk-config");
|
|
39
|
+
var import_react2 = __toESM(require("react"), 1);
|
|
39
40
|
function renderTiptapContent(content, classNames) {
|
|
40
41
|
if (!content?.content) return [];
|
|
41
42
|
return content.content.map((node, index) => {
|
|
@@ -87,8 +88,8 @@ function renderTiptapContent(content, classNames) {
|
|
|
87
88
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
88
89
|
"ul",
|
|
89
90
|
{
|
|
90
|
-
className:
|
|
91
|
-
children:
|
|
91
|
+
className: (0, import_merge.cn)("list-disc pl-6 my-4", classNames.bulletList),
|
|
92
|
+
children: renderTiptapContent(node, classNames)
|
|
92
93
|
},
|
|
93
94
|
index
|
|
94
95
|
);
|
|
@@ -96,13 +97,16 @@ function renderTiptapContent(content, classNames) {
|
|
|
96
97
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
97
98
|
"ol",
|
|
98
99
|
{
|
|
99
|
-
className:
|
|
100
|
-
children:
|
|
100
|
+
className: (0, import_merge.cn)("list-decimal pl-6 my-4", classNames.orderedList),
|
|
101
|
+
children: renderTiptapContent(node, classNames)
|
|
101
102
|
},
|
|
102
103
|
index
|
|
103
104
|
);
|
|
104
105
|
case "listItem":
|
|
105
|
-
|
|
106
|
+
if (node.content && node.content.length === 1 && node.content[0].type === "paragraph") {
|
|
107
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { className: (0, import_merge.cn)("my-1", classNames.listItem), children: renderChildren(node.content[0].content, classNames) }, index);
|
|
108
|
+
}
|
|
109
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { className: (0, import_merge.cn)("my-1", classNames.listItem), children: renderChildren(node.content, classNames) }, index);
|
|
106
110
|
default:
|
|
107
111
|
return null;
|
|
108
112
|
}
|
|
@@ -115,7 +119,10 @@ const Content = ({
|
|
|
115
119
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "prose min-w-full", children: renderTiptapContent(content, classNames) });
|
|
116
120
|
};
|
|
117
121
|
function renderChildren(nodes, classNames) {
|
|
118
|
-
if (!nodes)
|
|
122
|
+
if (!nodes) {
|
|
123
|
+
console.log("no nodes");
|
|
124
|
+
return [];
|
|
125
|
+
}
|
|
119
126
|
return nodes.map((child, idx) => {
|
|
120
127
|
if (child.type === "text") {
|
|
121
128
|
let text = child.text;
|
|
@@ -136,8 +143,13 @@ function renderChildren(nodes, classNames) {
|
|
|
136
143
|
});
|
|
137
144
|
}
|
|
138
145
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: text }, idx);
|
|
146
|
+
} else {
|
|
147
|
+
console.log("child", child);
|
|
148
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react2.default.Fragment, { children: renderTiptapContent(
|
|
149
|
+
{ ...child, content: child.content },
|
|
150
|
+
classNames
|
|
151
|
+
) }, idx);
|
|
139
152
|
}
|
|
140
|
-
return null;
|
|
141
153
|
}).filter(Boolean);
|
|
142
154
|
}
|
|
143
155
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/blog-post/_components/content.tsx"],"sourcesContent":["import type { JSONContent } from \"@tiptap/core\";\nimport { BlogComponentClassNames } from \"../_types/class-names\";\nimport { cn } from \"../../../utils/merge\";\nimport Link from \"next/link\";\nimport { JSX } from \"react\";\nimport Image from \"next/image\";\nimport { opinlyConfig } from \"../../../utils/sdk-config\";\n\nfunction renderTiptapContent(\n content: JSONContent,\n classNames: BlogComponentClassNames\n): React.ReactNode[] {\n if (!content?.content) return [];\n\n return content.content\n .map((node, index) => {\n switch (node.type) {\n case \"paragraph\":\n return (\n <p key={index} className={classNames.paragraph || \"mb-4\"}>\n {renderChildren(node.content, classNames)}\n </p>\n );\n case \"heading\": {\n const text = node.content?.[0]?.text ?? \"\";\n const slug = text\n .toLowerCase()\n .replace(/[^a-z0-9]+/g, \"-\")\n .replace(/^-+|-+$/g, \"\");\n const Tag = `h${\n node.attrs?.level || 1\n }` as keyof JSX.IntrinsicElements;\n return (\n <Tag\n key={index}\n id={slug}\n className={\n classNames.heading || \"mt-8 mb-4 font-bold text-gray-800\"\n }\n >\n {renderChildren(node.content, classNames)}\n </Tag>\n );\n }\n case \"image\":\n const fileKey = node.attrs?.fileKey;\n\n if (!fileKey) {\n return null;\n }\n\n return (\n <div\n key={index}\n className={cn(\n \"relative w-full max-w-[800px] my-6\",\n classNames.image\n )}\n style={{ aspectRatio: \"2 / 1\" }}\n >\n <Image\n src={`${opinlyConfig.imagesPrefix}/${fileKey}`}\n title={node.attrs?.title || \"\"}\n alt={node.attrs?.alt || \"\"}\n fill\n className=\"object-contain rounded-lg\"\n sizes=\"(max-width: 800px) 100vw, 800px\"\n />\n </div>\n );\n case \"bulletList\":\n return (\n <ul\n key={index}\n className={
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/blog-post/_components/content.tsx"],"sourcesContent":["import type { JSONContent } from \"@tiptap/core\";\nimport { BlogComponentClassNames } from \"../_types/class-names\";\nimport { cn } from \"../../../utils/merge\";\nimport Link from \"next/link\";\nimport { JSX } from \"react\";\nimport Image from \"next/image\";\nimport { opinlyConfig } from \"../../../utils/sdk-config\";\nimport React from \"react\";\n\nfunction renderTiptapContent(\n content: JSONContent,\n classNames: BlogComponentClassNames\n): React.ReactNode[] {\n if (!content?.content) return [];\n\n return content.content\n .map((node, index) => {\n switch (node.type) {\n case \"paragraph\":\n return (\n <p key={index} className={classNames.paragraph || \"mb-4\"}>\n {renderChildren(node.content, classNames)}\n </p>\n );\n case \"heading\": {\n const text = node.content?.[0]?.text ?? \"\";\n const slug = text\n .toLowerCase()\n .replace(/[^a-z0-9]+/g, \"-\")\n .replace(/^-+|-+$/g, \"\");\n const Tag = `h${\n node.attrs?.level || 1\n }` as keyof JSX.IntrinsicElements;\n return (\n <Tag\n key={index}\n id={slug}\n className={\n classNames.heading || \"mt-8 mb-4 font-bold text-gray-800\"\n }\n >\n {renderChildren(node.content, classNames)}\n </Tag>\n );\n }\n case \"image\":\n const fileKey = node.attrs?.fileKey;\n\n if (!fileKey) {\n return null;\n }\n\n return (\n <div\n key={index}\n className={cn(\n \"relative w-full max-w-[800px] my-6\",\n classNames.image\n )}\n style={{ aspectRatio: \"2 / 1\" }}\n >\n <Image\n src={`${opinlyConfig.imagesPrefix}/${fileKey}`}\n title={node.attrs?.title || \"\"}\n alt={node.attrs?.alt || \"\"}\n fill\n className=\"object-contain rounded-lg\"\n sizes=\"(max-width: 800px) 100vw, 800px\"\n />\n </div>\n );\n case \"bulletList\":\n return (\n <ul\n key={index}\n className={cn(\"list-disc pl-6 my-4\", classNames.bulletList)}\n >\n {renderTiptapContent(node, classNames)}\n </ul>\n );\n case \"orderedList\":\n return (\n <ol\n key={index}\n className={cn(\"list-decimal pl-6 my-4\", classNames.orderedList)}\n >\n {renderTiptapContent(node, classNames)}\n </ol>\n );\n case \"listItem\":\n if (\n node.content &&\n node.content.length === 1 &&\n node.content[0].type === \"paragraph\"\n ) {\n return (\n <li key={index} className={cn(\"my-1\", classNames.listItem)}>\n {renderChildren(node.content[0].content, classNames)}\n </li>\n );\n }\n return (\n <li key={index} className={cn(\"my-1\", classNames.listItem)}>\n {renderChildren(node.content, classNames)}\n </li>\n );\n default:\n return null;\n }\n })\n .filter(Boolean);\n}\n\nexport const Content = ({\n content,\n classNames,\n}: {\n content: JSONContent;\n classNames: BlogComponentClassNames;\n}) => {\n return (\n <div className=\"prose min-w-full\">\n {renderTiptapContent(content, classNames)}\n </div>\n );\n};\n\nfunction renderChildren(\n nodes: JSONContent[\"content\"] | undefined,\n classNames: BlogComponentClassNames\n): JSX.Element[] {\n if (!nodes) {\n console.log(\"no nodes\");\n return [];\n }\n\n return nodes\n .map((child, idx) => {\n if (child.type === \"text\") {\n let text: React.ReactNode = child.text;\n if (child.marks) {\n child.marks.forEach((mark) => {\n if (mark.type === \"bold\") text = <strong key={idx}>{text}</strong>;\n if (mark.type === \"italic\") text = <em key={idx}>{text}</em>;\n if (mark.type === \"link\")\n text = (\n <Link\n key={idx}\n href={mark.attrs?.href}\n className={classNames.link || \"text-blue-600 underline\"}\n >\n {text}\n </Link>\n );\n });\n }\n return <span key={idx}>{text}</span>;\n } else {\n console.log(\"child\", child);\n\n // Recursively render non-text nodes (e.g., paragraph, listItem, etc.)\n return (\n <React.Fragment key={idx}>\n {renderTiptapContent(\n { ...child, content: child.content },\n classNames\n )}\n </React.Fragment>\n );\n }\n })\n .filter(Boolean) as JSX.Element[];\n}\n"],"mappings":"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","names":["import_react","Image","Link","React"]}
|
|
@@ -3,6 +3,7 @@ import { cn } from "../../../utils/merge";
|
|
|
3
3
|
import Link from "next/link";
|
|
4
4
|
import Image from "next/image";
|
|
5
5
|
import { opinlyConfig } from "../../../utils/sdk-config";
|
|
6
|
+
import React from "react";
|
|
6
7
|
function renderTiptapContent(content, classNames) {
|
|
7
8
|
if (!content?.content) return [];
|
|
8
9
|
return content.content.map((node, index) => {
|
|
@@ -54,8 +55,8 @@ function renderTiptapContent(content, classNames) {
|
|
|
54
55
|
return /* @__PURE__ */ jsx(
|
|
55
56
|
"ul",
|
|
56
57
|
{
|
|
57
|
-
className:
|
|
58
|
-
children:
|
|
58
|
+
className: cn("list-disc pl-6 my-4", classNames.bulletList),
|
|
59
|
+
children: renderTiptapContent(node, classNames)
|
|
59
60
|
},
|
|
60
61
|
index
|
|
61
62
|
);
|
|
@@ -63,13 +64,16 @@ function renderTiptapContent(content, classNames) {
|
|
|
63
64
|
return /* @__PURE__ */ jsx(
|
|
64
65
|
"ol",
|
|
65
66
|
{
|
|
66
|
-
className:
|
|
67
|
-
children:
|
|
67
|
+
className: cn("list-decimal pl-6 my-4", classNames.orderedList),
|
|
68
|
+
children: renderTiptapContent(node, classNames)
|
|
68
69
|
},
|
|
69
70
|
index
|
|
70
71
|
);
|
|
71
72
|
case "listItem":
|
|
72
|
-
|
|
73
|
+
if (node.content && node.content.length === 1 && node.content[0].type === "paragraph") {
|
|
74
|
+
return /* @__PURE__ */ jsx("li", { className: cn("my-1", classNames.listItem), children: renderChildren(node.content[0].content, classNames) }, index);
|
|
75
|
+
}
|
|
76
|
+
return /* @__PURE__ */ jsx("li", { className: cn("my-1", classNames.listItem), children: renderChildren(node.content, classNames) }, index);
|
|
73
77
|
default:
|
|
74
78
|
return null;
|
|
75
79
|
}
|
|
@@ -82,7 +86,10 @@ const Content = ({
|
|
|
82
86
|
return /* @__PURE__ */ jsx("div", { className: "prose min-w-full", children: renderTiptapContent(content, classNames) });
|
|
83
87
|
};
|
|
84
88
|
function renderChildren(nodes, classNames) {
|
|
85
|
-
if (!nodes)
|
|
89
|
+
if (!nodes) {
|
|
90
|
+
console.log("no nodes");
|
|
91
|
+
return [];
|
|
92
|
+
}
|
|
86
93
|
return nodes.map((child, idx) => {
|
|
87
94
|
if (child.type === "text") {
|
|
88
95
|
let text = child.text;
|
|
@@ -103,8 +110,13 @@ function renderChildren(nodes, classNames) {
|
|
|
103
110
|
});
|
|
104
111
|
}
|
|
105
112
|
return /* @__PURE__ */ jsx("span", { children: text }, idx);
|
|
113
|
+
} else {
|
|
114
|
+
console.log("child", child);
|
|
115
|
+
return /* @__PURE__ */ jsx(React.Fragment, { children: renderTiptapContent(
|
|
116
|
+
{ ...child, content: child.content },
|
|
117
|
+
classNames
|
|
118
|
+
) }, idx);
|
|
106
119
|
}
|
|
107
|
-
return null;
|
|
108
120
|
}).filter(Boolean);
|
|
109
121
|
}
|
|
110
122
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/blog-post/_components/content.tsx"],"sourcesContent":["import type { JSONContent } from \"@tiptap/core\";\nimport { BlogComponentClassNames } from \"../_types/class-names\";\nimport { cn } from \"../../../utils/merge\";\nimport Link from \"next/link\";\nimport { JSX } from \"react\";\nimport Image from \"next/image\";\nimport { opinlyConfig } from \"../../../utils/sdk-config\";\n\nfunction renderTiptapContent(\n content: JSONContent,\n classNames: BlogComponentClassNames\n): React.ReactNode[] {\n if (!content?.content) return [];\n\n return content.content\n .map((node, index) => {\n switch (node.type) {\n case \"paragraph\":\n return (\n <p key={index} className={classNames.paragraph || \"mb-4\"}>\n {renderChildren(node.content, classNames)}\n </p>\n );\n case \"heading\": {\n const text = node.content?.[0]?.text ?? \"\";\n const slug = text\n .toLowerCase()\n .replace(/[^a-z0-9]+/g, \"-\")\n .replace(/^-+|-+$/g, \"\");\n const Tag = `h${\n node.attrs?.level || 1\n }` as keyof JSX.IntrinsicElements;\n return (\n <Tag\n key={index}\n id={slug}\n className={\n classNames.heading || \"mt-8 mb-4 font-bold text-gray-800\"\n }\n >\n {renderChildren(node.content, classNames)}\n </Tag>\n );\n }\n case \"image\":\n const fileKey = node.attrs?.fileKey;\n\n if (!fileKey) {\n return null;\n }\n\n return (\n <div\n key={index}\n className={cn(\n \"relative w-full max-w-[800px] my-6\",\n classNames.image\n )}\n style={{ aspectRatio: \"2 / 1\" }}\n >\n <Image\n src={`${opinlyConfig.imagesPrefix}/${fileKey}`}\n title={node.attrs?.title || \"\"}\n alt={node.attrs?.alt || \"\"}\n fill\n className=\"object-contain rounded-lg\"\n sizes=\"(max-width: 800px) 100vw, 800px\"\n />\n </div>\n );\n case \"bulletList\":\n return (\n <ul\n key={index}\n className={
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/blog-post/_components/content.tsx"],"sourcesContent":["import type { JSONContent } from \"@tiptap/core\";\nimport { BlogComponentClassNames } from \"../_types/class-names\";\nimport { cn } from \"../../../utils/merge\";\nimport Link from \"next/link\";\nimport { JSX } from \"react\";\nimport Image from \"next/image\";\nimport { opinlyConfig } from \"../../../utils/sdk-config\";\nimport React from \"react\";\n\nfunction renderTiptapContent(\n content: JSONContent,\n classNames: BlogComponentClassNames\n): React.ReactNode[] {\n if (!content?.content) return [];\n\n return content.content\n .map((node, index) => {\n switch (node.type) {\n case \"paragraph\":\n return (\n <p key={index} className={classNames.paragraph || \"mb-4\"}>\n {renderChildren(node.content, classNames)}\n </p>\n );\n case \"heading\": {\n const text = node.content?.[0]?.text ?? \"\";\n const slug = text\n .toLowerCase()\n .replace(/[^a-z0-9]+/g, \"-\")\n .replace(/^-+|-+$/g, \"\");\n const Tag = `h${\n node.attrs?.level || 1\n }` as keyof JSX.IntrinsicElements;\n return (\n <Tag\n key={index}\n id={slug}\n className={\n classNames.heading || \"mt-8 mb-4 font-bold text-gray-800\"\n }\n >\n {renderChildren(node.content, classNames)}\n </Tag>\n );\n }\n case \"image\":\n const fileKey = node.attrs?.fileKey;\n\n if (!fileKey) {\n return null;\n }\n\n return (\n <div\n key={index}\n className={cn(\n \"relative w-full max-w-[800px] my-6\",\n classNames.image\n )}\n style={{ aspectRatio: \"2 / 1\" }}\n >\n <Image\n src={`${opinlyConfig.imagesPrefix}/${fileKey}`}\n title={node.attrs?.title || \"\"}\n alt={node.attrs?.alt || \"\"}\n fill\n className=\"object-contain rounded-lg\"\n sizes=\"(max-width: 800px) 100vw, 800px\"\n />\n </div>\n );\n case \"bulletList\":\n return (\n <ul\n key={index}\n className={cn(\"list-disc pl-6 my-4\", classNames.bulletList)}\n >\n {renderTiptapContent(node, classNames)}\n </ul>\n );\n case \"orderedList\":\n return (\n <ol\n key={index}\n className={cn(\"list-decimal pl-6 my-4\", classNames.orderedList)}\n >\n {renderTiptapContent(node, classNames)}\n </ol>\n );\n case \"listItem\":\n if (\n node.content &&\n node.content.length === 1 &&\n node.content[0].type === \"paragraph\"\n ) {\n return (\n <li key={index} className={cn(\"my-1\", classNames.listItem)}>\n {renderChildren(node.content[0].content, classNames)}\n </li>\n );\n }\n return (\n <li key={index} className={cn(\"my-1\", classNames.listItem)}>\n {renderChildren(node.content, classNames)}\n </li>\n );\n default:\n return null;\n }\n })\n .filter(Boolean);\n}\n\nexport const Content = ({\n content,\n classNames,\n}: {\n content: JSONContent;\n classNames: BlogComponentClassNames;\n}) => {\n return (\n <div className=\"prose min-w-full\">\n {renderTiptapContent(content, classNames)}\n </div>\n );\n};\n\nfunction renderChildren(\n nodes: JSONContent[\"content\"] | undefined,\n classNames: BlogComponentClassNames\n): JSX.Element[] {\n if (!nodes) {\n console.log(\"no nodes\");\n return [];\n }\n\n return nodes\n .map((child, idx) => {\n if (child.type === \"text\") {\n let text: React.ReactNode = child.text;\n if (child.marks) {\n child.marks.forEach((mark) => {\n if (mark.type === \"bold\") text = <strong key={idx}>{text}</strong>;\n if (mark.type === \"italic\") text = <em key={idx}>{text}</em>;\n if (mark.type === \"link\")\n text = (\n <Link\n key={idx}\n href={mark.attrs?.href}\n className={classNames.link || \"text-blue-600 underline\"}\n >\n {text}\n </Link>\n );\n });\n }\n return <span key={idx}>{text}</span>;\n } else {\n console.log(\"child\", child);\n\n // Recursively render non-text nodes (e.g., paragraph, listItem, etc.)\n return (\n <React.Fragment key={idx}>\n {renderTiptapContent(\n { ...child, content: child.content },\n classNames\n )}\n </React.Fragment>\n );\n }\n })\n .filter(Boolean) as JSX.Element[];\n}\n"],"mappings":"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","names":[]}
|
|
@@ -43,7 +43,6 @@ const TableOfContents = ({
|
|
|
43
43
|
author,
|
|
44
44
|
post
|
|
45
45
|
}) => {
|
|
46
|
-
console.log("author file key", author?.fileKey);
|
|
47
46
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("aside", { className: (0, import_merge.cn)("w-full lg:w-1/3 lg:sticky lg:top-20 lg:self-start"), children: [
|
|
48
47
|
author && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "w-full mb-6 border p-4 rounded-md text-sm", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-3 mb-3", children: [
|
|
49
48
|
author.fileKey && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/blog-post/_components/table-of-contents.tsx"],"sourcesContent":["import { JSONContent } from \"@tiptap/core\";\nimport { BlogPostRes } from \"../_types/blog-post\";\nimport { cn } from \"../../../utils/merge\";\nimport Image from \"next/image\";\nimport { opinlyConfig } from \"../../../utils/sdk-config\";\nimport { extractHeadings } from \"../_helpers/extract-headings\";\nimport { Share } from \"./share\";\nimport Link from \"next/link\";\n\ntype TableOfContentsProps = {\n content: JSONContent;\n author: BlogPostRes[\"author\"] | null;\n post: BlogPostRes;\n};\n\nexport const TableOfContents = ({\n content,\n author,\n post,\n}: TableOfContentsProps) => {\n
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/blog-post/_components/table-of-contents.tsx"],"sourcesContent":["import { JSONContent } from \"@tiptap/core\";\nimport { BlogPostRes } from \"../_types/blog-post\";\nimport { cn } from \"../../../utils/merge\";\nimport Image from \"next/image\";\nimport { opinlyConfig } from \"../../../utils/sdk-config\";\nimport { extractHeadings } from \"../_helpers/extract-headings\";\nimport { Share } from \"./share\";\nimport Link from \"next/link\";\n\ntype TableOfContentsProps = {\n content: JSONContent;\n author: BlogPostRes[\"author\"] | null;\n post: BlogPostRes;\n};\n\nexport const TableOfContents = ({\n content,\n author,\n post,\n}: TableOfContentsProps) => {\n return (\n <aside className={cn(\"w-full lg:w-1/3 lg:sticky lg:top-20 lg:self-start\")}>\n {author && (\n <div className=\"w-full mb-6 border p-4 rounded-md text-sm\">\n <div className=\"flex items-center gap-3 mb-3\">\n {author.fileKey && (\n <Image\n src={`${opinlyConfig.imagesPrefix}/${author.fileKey}`}\n alt={author.name}\n width={48}\n height={48}\n className=\"rounded-full\"\n />\n )}\n <div>\n <Link\n href={`${opinlyConfig.blogPrefix}/authors/${author.slug}`}\n className=\"text-xs uppercase text-muted-foreground font-medium\"\n >\n {author.name}\n </Link>\n <div className=\"text-muted-foreground text-sm\">{author.bio}</div>\n </div>\n </div>\n </div>\n )}\n <Share post={post} />\n <div className=\"border-l-4 border-opinlyAccent pl-4 mb-4\">\n <h2 className=\"text-lg font-semibold mb-2\">TABLE OF CONTENTS</h2>\n <ul className=\"text-sm text-gray-700 space-y-1\">\n {(extractHeadings(content) || []).map((heading) => (\n <li key={heading.slug}>\n <a href={`#${heading.slug}`} className=\"hover:underline\">\n {heading.text}\n </a>\n </li>\n ))}\n </ul>\n </div>\n </aside>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0Bc;AAxBd,mBAAmB;AACnB,mBAAkB;AAClB,wBAA6B;AAC7B,8BAAgC;AAChC,mBAAsB;AACtB,kBAAiB;AAQV,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACF,MAA4B;AAC1B,SACE,6CAAC,WAAM,eAAW,iBAAG,mDAAmD,GACrE;AAAA,cACC,4CAAC,SAAI,WAAU,6CACb,uDAAC,SAAI,WAAU,gCACZ;AAAA,aAAO,WACN;AAAA,QAAC,aAAAA;AAAA,QAAA;AAAA,UACC,KAAK,GAAG,+BAAa,YAAY,IAAI,OAAO,OAAO;AAAA,UACnD,KAAK,OAAO;AAAA,UACZ,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,WAAU;AAAA;AAAA,MACZ;AAAA,MAEF,6CAAC,SACC;AAAA;AAAA,UAAC,YAAAC;AAAA,UAAA;AAAA,YACC,MAAM,GAAG,+BAAa,UAAU,YAAY,OAAO,IAAI;AAAA,YACvD,WAAU;AAAA,YAET,iBAAO;AAAA;AAAA,QACV;AAAA,QACA,4CAAC,SAAI,WAAU,iCAAiC,iBAAO,KAAI;AAAA,SAC7D;AAAA,OACF,GACF;AAAA,IAEF,4CAAC,sBAAM,MAAY;AAAA,IACnB,6CAAC,SAAI,WAAU,4CACb;AAAA,kDAAC,QAAG,WAAU,8BAA6B,+BAAiB;AAAA,MAC5D,4CAAC,QAAG,WAAU,mCACV,wDAAgB,OAAO,KAAK,CAAC,GAAG,IAAI,CAAC,YACrC,4CAAC,QACC,sDAAC,OAAE,MAAM,IAAI,QAAQ,IAAI,IAAI,WAAU,mBACpC,kBAAQ,MACX,KAHO,QAAQ,IAIjB,CACD,GACH;AAAA,OACF;AAAA,KACF;AAEJ;","names":["Image","Link"]}
|
|
@@ -10,7 +10,6 @@ const TableOfContents = ({
|
|
|
10
10
|
author,
|
|
11
11
|
post
|
|
12
12
|
}) => {
|
|
13
|
-
console.log("author file key", author?.fileKey);
|
|
14
13
|
return /* @__PURE__ */ jsxs("aside", { className: cn("w-full lg:w-1/3 lg:sticky lg:top-20 lg:self-start"), children: [
|
|
15
14
|
author && /* @__PURE__ */ jsx("div", { className: "w-full mb-6 border p-4 rounded-md text-sm", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 mb-3", children: [
|
|
16
15
|
author.fileKey && /* @__PURE__ */ jsx(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/blog-post/_components/table-of-contents.tsx"],"sourcesContent":["import { JSONContent } from \"@tiptap/core\";\nimport { BlogPostRes } from \"../_types/blog-post\";\nimport { cn } from \"../../../utils/merge\";\nimport Image from \"next/image\";\nimport { opinlyConfig } from \"../../../utils/sdk-config\";\nimport { extractHeadings } from \"../_helpers/extract-headings\";\nimport { Share } from \"./share\";\nimport Link from \"next/link\";\n\ntype TableOfContentsProps = {\n content: JSONContent;\n author: BlogPostRes[\"author\"] | null;\n post: BlogPostRes;\n};\n\nexport const TableOfContents = ({\n content,\n author,\n post,\n}: TableOfContentsProps) => {\n
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/blog-post/_components/table-of-contents.tsx"],"sourcesContent":["import { JSONContent } from \"@tiptap/core\";\nimport { BlogPostRes } from \"../_types/blog-post\";\nimport { cn } from \"../../../utils/merge\";\nimport Image from \"next/image\";\nimport { opinlyConfig } from \"../../../utils/sdk-config\";\nimport { extractHeadings } from \"../_helpers/extract-headings\";\nimport { Share } from \"./share\";\nimport Link from \"next/link\";\n\ntype TableOfContentsProps = {\n content: JSONContent;\n author: BlogPostRes[\"author\"] | null;\n post: BlogPostRes;\n};\n\nexport const TableOfContents = ({\n content,\n author,\n post,\n}: TableOfContentsProps) => {\n return (\n <aside className={cn(\"w-full lg:w-1/3 lg:sticky lg:top-20 lg:self-start\")}>\n {author && (\n <div className=\"w-full mb-6 border p-4 rounded-md text-sm\">\n <div className=\"flex items-center gap-3 mb-3\">\n {author.fileKey && (\n <Image\n src={`${opinlyConfig.imagesPrefix}/${author.fileKey}`}\n alt={author.name}\n width={48}\n height={48}\n className=\"rounded-full\"\n />\n )}\n <div>\n <Link\n href={`${opinlyConfig.blogPrefix}/authors/${author.slug}`}\n className=\"text-xs uppercase text-muted-foreground font-medium\"\n >\n {author.name}\n </Link>\n <div className=\"text-muted-foreground text-sm\">{author.bio}</div>\n </div>\n </div>\n </div>\n )}\n <Share post={post} />\n <div className=\"border-l-4 border-opinlyAccent pl-4 mb-4\">\n <h2 className=\"text-lg font-semibold mb-2\">TABLE OF CONTENTS</h2>\n <ul className=\"text-sm text-gray-700 space-y-1\">\n {(extractHeadings(content) || []).map((heading) => (\n <li key={heading.slug}>\n <a href={`#${heading.slug}`} className=\"hover:underline\">\n {heading.text}\n </a>\n </li>\n ))}\n </ul>\n </div>\n </aside>\n );\n};\n"],"mappings":"AA0Bc,cAQF,YARE;AAxBd,SAAS,UAAU;AACnB,OAAO,WAAW;AAClB,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,SAAS,aAAa;AACtB,OAAO,UAAU;AAQV,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACF,MAA4B;AAC1B,SACE,qBAAC,WAAM,WAAW,GAAG,mDAAmD,GACrE;AAAA,cACC,oBAAC,SAAI,WAAU,6CACb,+BAAC,SAAI,WAAU,gCACZ;AAAA,aAAO,WACN;AAAA,QAAC;AAAA;AAAA,UACC,KAAK,GAAG,aAAa,YAAY,IAAI,OAAO,OAAO;AAAA,UACnD,KAAK,OAAO;AAAA,UACZ,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,WAAU;AAAA;AAAA,MACZ;AAAA,MAEF,qBAAC,SACC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,GAAG,aAAa,UAAU,YAAY,OAAO,IAAI;AAAA,YACvD,WAAU;AAAA,YAET,iBAAO;AAAA;AAAA,QACV;AAAA,QACA,oBAAC,SAAI,WAAU,iCAAiC,iBAAO,KAAI;AAAA,SAC7D;AAAA,OACF,GACF;AAAA,IAEF,oBAAC,SAAM,MAAY;AAAA,IACnB,qBAAC,SAAI,WAAU,4CACb;AAAA,0BAAC,QAAG,WAAU,8BAA6B,+BAAiB;AAAA,MAC5D,oBAAC,QAAG,WAAU,mCACV,2BAAgB,OAAO,KAAK,CAAC,GAAG,IAAI,CAAC,YACrC,oBAAC,QACC,8BAAC,OAAE,MAAM,IAAI,QAAQ,IAAI,IAAI,WAAU,mBACpC,kBAAQ,MACX,KAHO,QAAQ,IAIjB,CACD,GACH;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -48,7 +48,6 @@ const BlogPost = ({
|
|
|
48
48
|
classNames = {}
|
|
49
49
|
}) => {
|
|
50
50
|
const content = post.content;
|
|
51
|
-
console.log("content", content);
|
|
52
51
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
53
52
|
post.faqs && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
54
53
|
import_script.default,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/blog-post/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { JSONContent } from \"@tiptap/core\";\nimport Link from \"next/link\";\nimport { cn } from \"../../utils/merge\";\nimport { opinlyConfig } from \"../../utils/sdk-config\";\nimport { BlogPostRes } from \"./_types/blog-post\";\nimport {\n genBlogPostingJSONLD,\n genBreadcrumbJSONLD,\n genFaqJSONLD,\n} from \"./_helpers/json-ld\";\nimport { BlogComponentClassNames } from \"./_types/class-names\";\nimport { FAQS } from \"./_components/faq\";\nimport { calculateReadingTime } from \"./_helpers/reading-time\";\nimport { Content } from \"./_components/content\";\nimport { TableOfContents } from \"./_components/table-of-contents\";\nimport { BreadCrumbs } from \"../bread-crumbs\";\nimport { formatDate } from \"../../utils/dates\";\nimport
|
|
1
|
+
{"version":3,"sources":["../../../src/components/blog-post/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { JSONContent } from \"@tiptap/core\";\nimport Link from \"next/link\";\nimport { cn } from \"../../utils/merge\";\nimport { opinlyConfig } from \"../../utils/sdk-config\";\nimport { BlogPostRes } from \"./_types/blog-post\";\nimport {\n genBlogPostingJSONLD,\n genBreadcrumbJSONLD,\n genFaqJSONLD,\n} from \"./_helpers/json-ld\";\nimport { BlogComponentClassNames } from \"./_types/class-names\";\nimport { FAQS } from \"./_components/faq\";\nimport { calculateReadingTime } from \"./_helpers/reading-time\";\nimport { Content } from \"./_components/content\";\nimport { TableOfContents } from \"./_components/table-of-contents\";\nimport { BreadCrumbs } from \"../bread-crumbs\";\nimport { formatDate } from \"../../utils/dates\";\nimport Script from \"next/script\";\n\nexport const BlogPost = ({\n post,\n classNames = {},\n}: {\n post: BlogPostRes;\n classNames?: BlogComponentClassNames;\n notFoundComponent?: React.ReactNode;\n}) => {\n const content = post.content as JSONContent;\n\n return (\n <>\n {/* <Head>\n <> */}\n {post.faqs && (\n <Script\n strategy=\"beforeInteractive\"\n type=\"application/ld+json\"\n dangerouslySetInnerHTML={{\n __html: JSON.stringify(genFaqJSONLD(post.faqs)).replace(\n /</g,\n \"\\\\u003c\"\n ),\n }}\n />\n )}\n <Script\n strategy=\"beforeInteractive\"\n type=\"application/ld+json\"\n dangerouslySetInnerHTML={{\n __html: JSON.stringify(genBlogPostingJSONLD(post)),\n }}\n />\n <Script\n strategy=\"beforeInteractive\"\n type=\"application/ld+json\"\n dangerouslySetInnerHTML={{\n __html: JSON.stringify(genBreadcrumbJSONLD(post)),\n }}\n />\n {/* </>\n </Head> */}\n\n <div className=\"max-w-7xl mx-auto px-4 py-24 flex items-start space-x-8\">\n <div className=\"flex flex-col gap-12 w-full\">\n <div className=\"bg-orange-600\">\n <BreadCrumbs\n breadcrumbs={[\n post.folder && {\n url: `${opinlyConfig.blogPrefix}/${post.folder.slug}`,\n name: post.folder.name,\n },\n ]}\n />\n\n <h1 className=\"text-4xl font-bold mb-2 leading-tight\">\n {post.title}\n </h1>\n <div className=\"text-sm mb-4\">\n Author:{\" \"}\n <Link\n href={`${opinlyConfig.blogPrefix}/authors/${post.author?.slug}`}\n className=\"font-medium\"\n >\n {post.author?.name}\n </Link>{\" \"}\n · {calculateReadingTime(content)} min read ·{\" \"}\n {formatDate(post.firstPublishedAt as string) || \"Today\"}\n </div>\n </div>\n\n <div\n className={cn(\n \"flex flex-col-reverse md:flex-row mx-auto mt-10 gap-12 relative w-full \",\n classNames.container\n )}\n >\n <article className=\"w-full lg:w-2/3 order-2 lg:order-1 flex items-start space-x-4\">\n <div className=\"prose w-full\">\n <Content content={content} classNames={classNames} />\n <FAQS faqs={post.faqs} />\n </div>\n </article>\n <div className=\"block md:min-w-72 md:sticky md:top-20 md:self-start\">\n <TableOfContents\n content={content}\n author={post.author}\n post={post}\n />\n </div>\n </div>\n </div>\n {/* <div className=\"hidden md:block \">\n <TableOfContents\n content={content}\n author={post.post.author}\n post={post}\n />\n </div> */}\n </div>\n </>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA+BI;AA7BJ,kBAAiB;AACjB,mBAAmB;AACnB,wBAA6B;AAE7B,qBAIO;AAEP,iBAAqB;AACrB,0BAAqC;AACrC,qBAAwB;AACxB,+BAAgC;AAChC,0BAA4B;AAC5B,mBAA2B;AAC3B,oBAAmB;AAEZ,MAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA,aAAa,CAAC;AAChB,MAIM;AACJ,QAAM,UAAU,KAAK;AAErB,SACE,4EAGG;AAAA,SAAK,QACJ;AAAA,MAAC,cAAAA;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,yBAAyB;AAAA,UACvB,QAAQ,KAAK,cAAU,6BAAa,KAAK,IAAI,CAAC,EAAE;AAAA,YAC9C;AAAA,YACA;AAAA,UACF;AAAA,QACF;AAAA;AAAA,IACF;AAAA,IAEF;AAAA,MAAC,cAAAA;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,yBAAyB;AAAA,UACvB,QAAQ,KAAK,cAAU,qCAAqB,IAAI,CAAC;AAAA,QACnD;AAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC,cAAAA;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,yBAAyB;AAAA,UACvB,QAAQ,KAAK,cAAU,oCAAoB,IAAI,CAAC;AAAA,QAClD;AAAA;AAAA,IACF;AAAA,IAIA,4CAAC,SAAI,WAAU,2DACb,uDAAC,SAAI,WAAU,+BACb;AAAA,mDAAC,SAAI,WAAU,iBACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,aAAa;AAAA,cACX,KAAK,UAAU;AAAA,gBACb,KAAK,GAAG,+BAAa,UAAU,IAAI,KAAK,OAAO,IAAI;AAAA,gBACnD,MAAM,KAAK,OAAO;AAAA,cACpB;AAAA,YACF;AAAA;AAAA,QACF;AAAA,QAEA,4CAAC,QAAG,WAAU,yCACX,eAAK,OACR;AAAA,QACA,6CAAC,SAAI,WAAU,gBAAe;AAAA;AAAA,UACpB;AAAA,UACR;AAAA,YAAC,YAAAC;AAAA,YAAA;AAAA,cACC,MAAM,GAAG,+BAAa,UAAU,YAAY,KAAK,QAAQ,IAAI;AAAA,cAC7D,WAAU;AAAA,cAET,eAAK,QAAQ;AAAA;AAAA,UAChB;AAAA,UAAQ;AAAA,UAAI;AAAA,cACT,0CAAqB,OAAO;AAAA,UAAE;AAAA,UAAY;AAAA,cAC5C,yBAAW,KAAK,gBAA0B,KAAK;AAAA,WAClD;AAAA,SACF;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,eAAW;AAAA,YACT;AAAA,YACA,WAAW;AAAA,UACb;AAAA,UAEA;AAAA,wDAAC,aAAQ,WAAU,iEACjB,uDAAC,SAAI,WAAU,gBACb;AAAA,0DAAC,0BAAQ,SAAkB,YAAwB;AAAA,cACnD,4CAAC,mBAAK,MAAM,KAAK,MAAM;AAAA,eACzB,GACF;AAAA,YACA,4CAAC,SAAI,WAAU,uDACb;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA,QAAQ,KAAK;AAAA,gBACb;AAAA;AAAA,YACF,GACF;AAAA;AAAA;AAAA,MACF;AAAA,OACF,GAQF;AAAA,KACF;AAEJ;","names":["Script","Link"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/blog-post/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { JSONContent } from \"@tiptap/core\";\nimport Link from \"next/link\";\nimport { cn } from \"../../utils/merge\";\nimport { opinlyConfig } from \"../../utils/sdk-config\";\nimport { BlogPostRes } from \"./_types/blog-post\";\nimport {\n genBlogPostingJSONLD,\n genBreadcrumbJSONLD,\n genFaqJSONLD,\n} from \"./_helpers/json-ld\";\nimport { BlogComponentClassNames } from \"./_types/class-names\";\nimport { FAQS } from \"./_components/faq\";\nimport { calculateReadingTime } from \"./_helpers/reading-time\";\nimport { Content } from \"./_components/content\";\nimport { TableOfContents } from \"./_components/table-of-contents\";\nimport { BreadCrumbs } from \"../bread-crumbs\";\nimport { formatDate } from \"../../utils/dates\";\nimport
|
|
1
|
+
{"version":3,"sources":["../../../src/components/blog-post/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { JSONContent } from \"@tiptap/core\";\nimport Link from \"next/link\";\nimport { cn } from \"../../utils/merge\";\nimport { opinlyConfig } from \"../../utils/sdk-config\";\nimport { BlogPostRes } from \"./_types/blog-post\";\nimport {\n genBlogPostingJSONLD,\n genBreadcrumbJSONLD,\n genFaqJSONLD,\n} from \"./_helpers/json-ld\";\nimport { BlogComponentClassNames } from \"./_types/class-names\";\nimport { FAQS } from \"./_components/faq\";\nimport { calculateReadingTime } from \"./_helpers/reading-time\";\nimport { Content } from \"./_components/content\";\nimport { TableOfContents } from \"./_components/table-of-contents\";\nimport { BreadCrumbs } from \"../bread-crumbs\";\nimport { formatDate } from \"../../utils/dates\";\nimport Script from \"next/script\";\n\nexport const BlogPost = ({\n post,\n classNames = {},\n}: {\n post: BlogPostRes;\n classNames?: BlogComponentClassNames;\n notFoundComponent?: React.ReactNode;\n}) => {\n const content = post.content as JSONContent;\n\n return (\n <>\n {/* <Head>\n <> */}\n {post.faqs && (\n <Script\n strategy=\"beforeInteractive\"\n type=\"application/ld+json\"\n dangerouslySetInnerHTML={{\n __html: JSON.stringify(genFaqJSONLD(post.faqs)).replace(\n /</g,\n \"\\\\u003c\"\n ),\n }}\n />\n )}\n <Script\n strategy=\"beforeInteractive\"\n type=\"application/ld+json\"\n dangerouslySetInnerHTML={{\n __html: JSON.stringify(genBlogPostingJSONLD(post)),\n }}\n />\n <Script\n strategy=\"beforeInteractive\"\n type=\"application/ld+json\"\n dangerouslySetInnerHTML={{\n __html: JSON.stringify(genBreadcrumbJSONLD(post)),\n }}\n />\n {/* </>\n </Head> */}\n\n <div className=\"max-w-7xl mx-auto px-4 py-24 flex items-start space-x-8\">\n <div className=\"flex flex-col gap-12 w-full\">\n <div className=\"bg-orange-600\">\n <BreadCrumbs\n breadcrumbs={[\n post.folder && {\n url: `${opinlyConfig.blogPrefix}/${post.folder.slug}`,\n name: post.folder.name,\n },\n ]}\n />\n\n <h1 className=\"text-4xl font-bold mb-2 leading-tight\">\n {post.title}\n </h1>\n <div className=\"text-sm mb-4\">\n Author:{\" \"}\n <Link\n href={`${opinlyConfig.blogPrefix}/authors/${post.author?.slug}`}\n className=\"font-medium\"\n >\n {post.author?.name}\n </Link>{\" \"}\n · {calculateReadingTime(content)} min read ·{\" \"}\n {formatDate(post.firstPublishedAt as string) || \"Today\"}\n </div>\n </div>\n\n <div\n className={cn(\n \"flex flex-col-reverse md:flex-row mx-auto mt-10 gap-12 relative w-full \",\n classNames.container\n )}\n >\n <article className=\"w-full lg:w-2/3 order-2 lg:order-1 flex items-start space-x-4\">\n <div className=\"prose w-full\">\n <Content content={content} classNames={classNames} />\n <FAQS faqs={post.faqs} />\n </div>\n </article>\n <div className=\"block md:min-w-72 md:sticky md:top-20 md:self-start\">\n <TableOfContents\n content={content}\n author={post.author}\n post={post}\n />\n </div>\n </div>\n </div>\n {/* <div className=\"hidden md:block \">\n <TableOfContents\n content={content}\n author={post.post.author}\n post={post}\n />\n </div> */}\n </div>\n </>\n );\n};\n"],"mappings":"AA+BI,mBAII,KA2CI,YA/CR;AA7BJ,OAAO,UAAU;AACjB,SAAS,UAAU;AACnB,SAAS,oBAAoB;AAE7B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,YAAY;AACrB,SAAS,4BAA4B;AACrC,SAAS,eAAe;AACxB,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,OAAO,YAAY;AAEZ,MAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA,aAAa,CAAC;AAChB,MAIM;AACJ,QAAM,UAAU,KAAK;AAErB,SACE,iCAGG;AAAA,SAAK,QACJ;AAAA,MAAC;AAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,yBAAyB;AAAA,UACvB,QAAQ,KAAK,UAAU,aAAa,KAAK,IAAI,CAAC,EAAE;AAAA,YAC9C;AAAA,YACA;AAAA,UACF;AAAA,QACF;AAAA;AAAA,IACF;AAAA,IAEF;AAAA,MAAC;AAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,yBAAyB;AAAA,UACvB,QAAQ,KAAK,UAAU,qBAAqB,IAAI,CAAC;AAAA,QACnD;AAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,yBAAyB;AAAA,UACvB,QAAQ,KAAK,UAAU,oBAAoB,IAAI,CAAC;AAAA,QAClD;AAAA;AAAA,IACF;AAAA,IAIA,oBAAC,SAAI,WAAU,2DACb,+BAAC,SAAI,WAAU,+BACb;AAAA,2BAAC,SAAI,WAAU,iBACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,aAAa;AAAA,cACX,KAAK,UAAU;AAAA,gBACb,KAAK,GAAG,aAAa,UAAU,IAAI,KAAK,OAAO,IAAI;AAAA,gBACnD,MAAM,KAAK,OAAO;AAAA,cACpB;AAAA,YACF;AAAA;AAAA,QACF;AAAA,QAEA,oBAAC,QAAG,WAAU,yCACX,eAAK,OACR;AAAA,QACA,qBAAC,SAAI,WAAU,gBAAe;AAAA;AAAA,UACpB;AAAA,UACR;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,GAAG,aAAa,UAAU,YAAY,KAAK,QAAQ,IAAI;AAAA,cAC7D,WAAU;AAAA,cAET,eAAK,QAAQ;AAAA;AAAA,UAChB;AAAA,UAAQ;AAAA,UAAI;AAAA,UACT,qBAAqB,OAAO;AAAA,UAAE;AAAA,UAAY;AAAA,UAC5C,WAAW,KAAK,gBAA0B,KAAK;AAAA,WAClD;AAAA,SACF;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,WAAW;AAAA,YACT;AAAA,YACA,WAAW;AAAA,UACb;AAAA,UAEA;AAAA,gCAAC,aAAQ,WAAU,iEACjB,+BAAC,SAAI,WAAU,gBACb;AAAA,kCAAC,WAAQ,SAAkB,YAAwB;AAAA,cACnD,oBAAC,QAAK,MAAM,KAAK,MAAM;AAAA,eACzB,GACF;AAAA,YACA,oBAAC,SAAI,WAAU,uDACb;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA,QAAQ,KAAK;AAAA,gBACb;AAAA;AAAA,YACF,GACF;AAAA;AAAA;AAAA,MACF;AAAA,OACF,GAQF;AAAA,KACF;AAEJ;","names":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@opinly/next",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.11",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"private": false,
|
|
6
6
|
"main": "dist/index.cjs",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"react-syntax-highlighter": "^15.6.1",
|
|
30
30
|
"schema-dts": "^1.1.5",
|
|
31
31
|
"tailwind-merge": "^1.14.0",
|
|
32
|
-
"@opinly/backend": "0.1.
|
|
32
|
+
"@opinly/backend": "0.1.11"
|
|
33
33
|
},
|
|
34
34
|
"engines": {
|
|
35
35
|
"node": ">=16"
|