@opinly/next 0.1.10 → 0.1.12
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 +6 -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.12",
|
|
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.12"
|
|
33
33
|
},
|
|
34
34
|
"engines": {
|
|
35
35
|
"node": ">=16"
|
|
@@ -49,6 +49,10 @@
|
|
|
49
49
|
"./components": {
|
|
50
50
|
"import": "./dist/components/*.js",
|
|
51
51
|
"require": "./dist/components/*.cjs"
|
|
52
|
+
},
|
|
53
|
+
"./utils": {
|
|
54
|
+
"import": "./dist/utils/*.js",
|
|
55
|
+
"require": "./dist/utils/*.cjs"
|
|
52
56
|
}
|
|
53
57
|
},
|
|
54
58
|
"typesVersions": {
|