npm - @san-siva/blogkit - Versions diffs - 1.1.41 → 1.1.43 - Mend

@san-siva/blogkit 1.1.41 → 1.1.43

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.

Files changed (86) hide show

package/dist/cjs/staticComponents/BlogStatic.js CHANGED Viewed

@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var Blog_module = require('../styles/Blog.module.scss.js');
-const BlogStatic = ({ children, jsonLd }) => {
-    return (jsxRuntime.jsxs("div", { className: Blog_module.default.blog, children: [jsonLd && (jsxRuntime.jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(jsonLd) } })), jsxRuntime.jsx("div", { className: Blog_module.default['blog__content'], children: children })] }));
+const BlogStatic = ({ children, jsonLd, increasedWidthMode = false }) => {
+    return (jsxRuntime.jsxs("div", { className: `${Blog_module.default.blog} ${increasedWidthMode ? Blog_module.default['blog--increased-width'] : ''}`, children: [jsonLd && (jsxRuntime.jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(jsonLd) } })), jsxRuntime.jsx("div", { className: Blog_module.default['blog__content'], children: children })] }));
 };
 exports.default = BlogStatic;

package/dist/cjs/staticComponents/BlogStatic.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BlogStatic.js","sources":["../../../src/staticComponents/BlogStatic.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { Thing, WithContext } from 'schema-dts';\nimport styles from '../styles/Blog.module.scss';\n\ninterface BlogStaticProperties {\n\tchildren: ReactNode;\n\tjsonLd?: WithContext<Thing>;\n}\n\nconst BlogStatic = ({ children, jsonLd }: BlogStaticProperties) => {\n\treturn (\n\t\t<div className={styles.blog}>\n\t\t\t{jsonLd && (\n\t\t\t\t<script\n\t\t\t\t\ttype=\"application/ld+json\"\n\t\t\t\t\tdangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<div className={styles['blog__content']}>{children}</div>\n\t\t</div>\n\t);\n};\n\nexport default BlogStatic;\n"],"names":["_jsxs","styles","_jsx"],"mappings":";;;;;;;~~AASA~~,MAAM,UAAU,GAAG,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAwB,KAAI;~~AACjE~~,~~IAAA,~~QACCA,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,~~EAAEC~~,mBAAM,CAAC,IAAI,EAAA,QAAA,EAAA,~~CACzB~~,MAAM,KACNC,cAAA,CAAA,QAAA,EAAA,EACC,IAAI,EAAC,qBAAqB,EAC1B,uBAAuB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,EAAA,CAC1D,CACF,EACDA,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAED,mBAAM,CAAC,eAAe,CAAC,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAO,CAAA,EAAA,CACpD;AAER;;;;"}
1	+ {"version":3,"file":"BlogStatic.js","sources":["../../../src/staticComponents/BlogStatic.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { Thing, WithContext } from 'schema-dts';\nimport styles from '../styles/Blog.module.scss';\n\ninterface BlogStaticProperties {\n\tchildren: ReactNode;\n\tjsonLd?: WithContext<Thing>;\n\tincreasedWidthMode?: boolean;\n}\n\nconst BlogStatic = ({ children, jsonLd, increasedWidthMode = false }: BlogStaticProperties) => {\n\treturn (\n\t\t<div className={`${styles.blog} ${increasedWidthMode ? styles['blog--increased-width'] : ''}`}>\n\n\t\t\t{jsonLd && (\n\t\t\t\t<script\n\t\t\t\t\ttype=\"application/ld+json\"\n\t\t\t\t\tdangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<div className={styles['blog__content']}>{children}</div>\n\t\t</div>\n\t);\n};\n\nexport default BlogStatic;\n"],"names":["_jsxs","styles","_jsx"],"mappings":";;;;;;;AAUA,MAAM,UAAU,GAAG,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,kBAAkB,GAAG,KAAK,EAAwB,KAAI;IAC7F,QACCA,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAA,EAAGC,mBAAM,CAAC,IAAI,CAAA,CAAA,EAAI,kBAAkB,GAAGA,mBAAM,CAAC,uBAAuB,CAAC,GAAG,EAAE,CAAA,CAAE,EAAA,QAAA,EAAA,CAE3F,MAAM,KACNC,cAAA,CAAA,QAAA,EAAA,EACC,IAAI,EAAC,qBAAqB,EAC1B,uBAAuB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,EAAA,CAC1D,CACF,EACDA,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAED,mBAAM,CAAC,eAAe,CAAC,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAO,CAAA,EAAA,CACpD;AAER;;;;"}

package/dist/cjs/staticComponents/TocNodeStatic.js CHANGED Viewed

@@ -10,7 +10,7 @@ const TocNode = ({ node, index, visibleTitle, onClick }) => (jsxRuntime.jsxs("di
                 node.id === visibleTitle ? TocNode_module.default['toc-node__title--active'] : '',
                 node.depth === 1 ? TocNode_module.default['toc-node__title--sub'] : '',
                 node.depth === 2 ? TocNode_module.default['toc-node__title--sub-sub'] : '',
-            ].join(' '), onClick: onClick, children: node.title }), node.children.length > 0 && (jsxRuntime.jsx("div", { className: `${TocNode_module.default['toc-node__children']} ${TocNode_module.default[`toc-node__children--${node.depth === 0 ? 'sub' : 'sub-sub'}`]}`, children: node.children.map((child, i) => (jsxRuntime.jsx(TocNode, { node: child, index: i, visibleTitle: visibleTitle, onClick: onClick }, child.id))) }))] }));
+            ].join(' '), onClick: onClick, children: node.title }), node.children.length > 0 && (jsxRuntime.jsx("div", { className: `${TocNode_module.default['toc-node__children']} ${TocNode_module.default[`toc-node__children--${node.depth === 0 ? 'sub' : 'sub-sub'}`]}`, children: node.children.map((child, i) => (jsxRuntime.jsx(TocNode, { node: child, index: i, visibleTitle: visibleTitle, onClick: onClick }, `${node.id}-${child.id}`))) }))] }));
 exports.default = TocNode;
 //# sourceMappingURL=TocNodeStatic.js.map

package/dist/cjs/staticComponents/TocNodeStatic.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TocNodeStatic.js","sources":["../../../src/staticComponents/TocNodeStatic.tsx"],"sourcesContent":["import type { MouseEvent } from 'react';\n\nimport styles from '../styles/TocNode.module.scss';\n\nexport interface TocNode {\n\tid: string;\n\ttitle: string;\n\tdepth: number;\n\tchildren: TocNode[];\n}\n\ninterface TocNodeProperties {\n\tnode: TocNode;\n\tindex: number;\n\tvisibleTitle: string \| null;\n\tonClick: (e: MouseEvent<HTMLParagraphElement>) => void;\n}\n\nconst TocNode = ({ node, index, visibleTitle, onClick }: TocNodeProperties) => (\n\t<div>\n\t\t<p\n\t\t\tdata-idx={index}\n\t\t\tdata-id={node.id}\n\t\t\tclassName={[\n\t\t\t\tstyles['toc-node__title'],\n\t\t\t\tnode.id === visibleTitle ? styles['toc-node__title--active'] : '',\n\t\t\t\tnode.depth === 1 ? styles['toc-node__title--sub'] : '',\n\t\t\t\tnode.depth === 2 ? styles['toc-node__title--sub-sub'] : '',\n\t\t\t].join(' ')}\n\t\t\tonClick={onClick}\n\t\t>\n\t\t\t{node.title}\n\t\t</p>\n\t\t{node.children.length > 0 && (\n\t\t\t<div\n\t\t\t\tclassName={`${styles['toc-node__children']} ${styles[`toc-node__children--${node.depth === 0 ? 'sub' : 'sub-sub'}`]}`}\n\t\t\t>\n\t\t\t\t{node.children.map((child, i) => (\n\t\t\t\t\t<TocNode\n\t\t\t\t\t\tkey={child.id}\n\t\t\t\t\t\tnode={child}\n\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\tvisibleTitle={visibleTitle}\n\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t)}\n\t</div>\n);\n\nexport default TocNode;\n"],"names":["_jsxs","_jsx","styles"],"mappings":";;;;;;;AAkBA,MAAM,OAAO,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,OAAO,EAAqB,MACzEA,eAAA,CAAA,KAAA,EAAA,EAAA,QAAA,EAAA,CACCC,cAAA,CAAA,GAAA,EAAA,EAAA,UAAA,EACW,KAAK,EAAA,SAAA,EACN,IAAI,CAAC,EAAE,EAChB,SAAS,EAAE;gBACVC,sBAAM,CAAC,iBAAiB,CAAC;AACzB,gBAAA,IAAI,CAAC,EAAE,KAAK,YAAY,GAAGA,sBAAM,CAAC,yBAAyB,CAAC,GAAG,EAAE;AACjE,gBAAA,IAAI,CAAC,KAAK,KAAK,CAAC,GAAGA,sBAAM,CAAC,sBAAsB,CAAC,GAAG,EAAE;AACtD,gBAAA,IAAI,CAAC,KAAK,KAAK,CAAC,GAAGA,sBAAM,CAAC,0BAA0B,CAAC,GAAG,EAAE;aAC1D,CAAC,IAAI,CAAC,GAAG,CAAC,EACX,OAAO,EAAE,OAAO,EAAA,QAAA,EAEf,IAAI,CAAC,KAAK,EAAA,CACR,EACH,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,KACxBD,cAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,CAAA,EAAGC,sBAAM,CAAC,oBAAoB,CAAC,~~IAAIA~~,sBAAM,CAAC,~~uBAAuB~~,IAAI,CAAC,KAAK,KAAK,CAAC,GAAG,KAAK,GAAG,SAAS,CAAA,CAAE,CAAC,EAAE,EAAA,QAAA,EAEpH,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,MAC3BD,~~cAAA~~,~~CAAC,~~OAAO,EAAA,EAEP,IAAI,EAAE,KAAK,EACX,KAAK,EAAE,CAAC,EACR,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,~~IAJX~~,KAAK,CAAC,EAAE,~~CAKZ~~,CACF,CAAC,EAAA,CACG,CACN,CAAA,EAAA,CACI;;;;"}
1	+ {"version":3,"file":"TocNodeStatic.js","sources":["../../../src/staticComponents/TocNodeStatic.tsx"],"sourcesContent":["import type { MouseEvent } from 'react';\n\nimport styles from '../styles/TocNode.module.scss';\n\nexport interface TocNode {\n\tid: string;\n\ttitle: string;\n\tdepth: number;\n\tchildren: TocNode[];\n}\n\ninterface TocNodeProperties {\n\tnode: TocNode;\n\tindex: number;\n\tvisibleTitle: string \| null;\n\tonClick: (e: MouseEvent<HTMLParagraphElement>) => void;\n}\n\nconst TocNode = ({ node, index, visibleTitle, onClick }: TocNodeProperties) => (\n\t<div>\n\t\t<p\n\t\t\tdata-idx={index}\n\t\t\tdata-id={node.id}\n\t\t\tclassName={[\n\t\t\t\tstyles['toc-node__title'],\n\t\t\t\tnode.id === visibleTitle ? styles['toc-node__title--active'] : '',\n\t\t\t\tnode.depth === 1 ? styles['toc-node__title--sub'] : '',\n\t\t\t\tnode.depth === 2 ? styles['toc-node__title--sub-sub'] : '',\n\t\t\t].join(' ')}\n\t\t\tonClick={onClick}\n\t\t>\n\t\t\t{node.title}\n\t\t</p>\n\t\t{node.children.length > 0 && (\n\t\t\t<div\n\t\t\t\tclassName={`${styles['toc-node__children']} ${styles[`toc-node__children--${node.depth === 0 ? 'sub' : 'sub-sub'}`]}`}\n\t\t\t>\n\t\t\t\t{node.children.map((child, i) => (\n\t\t\t\t\t<TocNode\n\t\t\t\t\t\tkey={`${node.id}-${child.id}`}\n\t\t\t\t\t\tnode={child}\n\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\tvisibleTitle={visibleTitle}\n\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t)}\n\t</div>\n);\n\nexport default TocNode;\n"],"names":["_jsxs","_jsx","styles"],"mappings":";;;;;;;AAkBA,MAAM,OAAO,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,OAAO,EAAqB,MACzEA,eAAA,CAAA,KAAA,EAAA,EAAA,QAAA,EAAA,CACCC,cAAA,CAAA,GAAA,EAAA,EAAA,UAAA,EACW,KAAK,EAAA,SAAA,EACN,IAAI,CAAC,EAAE,EAChB,SAAS,EAAE;gBACVC,sBAAM,CAAC,iBAAiB,CAAC;AACzB,gBAAA,IAAI,CAAC,EAAE,KAAK,YAAY,GAAGA,sBAAM,CAAC,yBAAyB,CAAC,GAAG,EAAE;AACjE,gBAAA,IAAI,CAAC,KAAK,KAAK,CAAC,GAAGA,sBAAM,CAAC,sBAAsB,CAAC,GAAG,EAAE;AACtD,gBAAA,IAAI,CAAC,KAAK,KAAK,CAAC,GAAGA,sBAAM,CAAC,0BAA0B,CAAC,GAAG,EAAE;aAC1D,CAAC,IAAI,CAAC,GAAG,CAAC,EACX,OAAO,EAAE,OAAO,EAAA,QAAA,EAEf,IAAI,CAAC,KAAK,EAAA,CACR,EACH,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,KACxBD,cAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,CAAA,EAAGC,sBAAM,CAAC,oBAAoB,CAAC,CAAA,CAAA,EAAIA,sBAAM,CAAC,CAAA,oBAAA,EAAuB,IAAI,CAAC,KAAK,KAAK,CAAC,GAAG,KAAK,GAAG,SAAS,CAAA,CAAE,CAAC,EAAE,EAAA,QAAA,EAEpH,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,MAC3BD,eAAC,OAAO,EAAA,EAEP,IAAI,EAAE,KAAK,EACX,KAAK,EAAE,CAAC,EACR,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,EAAA,EAJX,CAAA,EAAG,IAAI,CAAC,EAAE,IAAI,KAAK,CAAC,EAAE,CAAA,CAAE,CAK5B,CACF,CAAC,EAAA,CACG,CACN,CAAA,EAAA,CACI;;;;"}

package/dist/cjs/styles/Blog.module.scss.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-var styles = {"margin-bottom--3":"Blog-module_margin-bottom--3__ir35O","category__header":"Blog-module_category__header__F1K0V","blog":"Blog-module_blog__Lpv6Z","blog__content":"Blog-module_blog__content__RMDiY","blog__sidebar":"Blog-module_blog__sidebar__uSu3l"};
+var styles = {"margin-bottom--3":"Blog-module_margin-bottom--3__ir35O","category__header":"Blog-module_category__header__F1K0V","blog":"Blog-module_blog__Lpv6Z","blog__content":"Blog-module_blog__content__RMDiY","blog__sidebar":"Blog-module_blog__sidebar__uSu3l","blog--increased-width":"Blog-module_blog--increased-width__QxyOD"};
 exports.default = styles;
 //# sourceMappingURL=Blog.module.scss.js.map

package/dist/esm/components/Blog.js CHANGED Viewed

@@ -4,8 +4,8 @@ import { lazy, Suspense } from 'react';
 import BlogStatic from '../staticComponents/BlogStatic.js';
 const BlogDynamic = lazy(() => import('../dynamicComponents/BlogDynamic.js'));
-const Blog = ({ children, title = 'In this article', jsonLd }) => {
-    return (jsx(Suspense, { fallback: jsx(BlogStatic, { jsonLd: jsonLd, children: children }), children: jsx(BlogDynamic, { title: title, jsonLd: jsonLd, children: children }) }));
+const Blog = ({ children, title = 'In this article', jsonLd, increasedWidthMode = false }) => {
+    return (jsx(Suspense, { fallback: jsx(BlogStatic, { jsonLd: jsonLd, increasedWidthMode: increasedWidthMode, children: children }), children: jsx(BlogDynamic, { title: title, jsonLd: jsonLd, increasedWidthMode: increasedWidthMode, children: children }) }));
 };
 export { Blog as default };

package/dist/esm/components/Blog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Blog.js","sources":["../../../src/components/Blog.tsx"],"sourcesContent":["'use client';\n\nimport { lazy, Suspense } from 'react';\nimport type { ReactNode } from 'react';\nimport type { Thing, WithContext } from 'schema-dts';\nimport BlogStatic from '../staticComponents/BlogStatic';\n\nconst BlogDynamic = lazy(() => import('../dynamicComponents/BlogDynamic'));\n\ninterface BlogProperties {\n\tchildren: ReactNode;\n\ttitle?: string;\n\tjsonLd?: WithContext<Thing>;\n}\n\nconst Blog = ({ children, title = 'In this article', jsonLd }: BlogProperties) => {\n\treturn (\n\t\t<Suspense fallback={<BlogStatic jsonLd={jsonLd}>{children}</BlogStatic>}>\n\t\t\t<BlogDynamic title={title} jsonLd={jsonLd}>{children}</BlogDynamic>\n\t\t</Suspense>\n\t);\n};\n\nexport default Blog;\n"],"names":["_jsx"],"mappings":";;;;AAOA,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,OAAO,qCAAkC,CAAC,CAAC;~~AAQ1E~~,MAAM,IAAI,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,GAAG,iBAAiB,EAAE,MAAM,EAAkB,KAAI;~~AAChF~~,IAAA,QACCA,GAAA,CAAC,QAAQ,EAAA,EAAC,QAAQ,EAAEA,GAAA,CAAC,UAAU,EAAA,EAAC,MAAM,EAAE,MAAM,YAAG,QAAQ,EAAA,CAAc,EAAA,QAAA,~~EACtEA~~,GAAA,CAAC,WAAW,EAAA,EAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAe,EAAA,~~CACzD~~;AAEb;;;;"}
1	+ {"version":3,"file":"Blog.js","sources":["../../../src/components/Blog.tsx"],"sourcesContent":["'use client';\n\nimport { lazy, Suspense } from 'react';\nimport type { ReactNode } from 'react';\nimport type { Thing, WithContext } from 'schema-dts';\nimport BlogStatic from '../staticComponents/BlogStatic';\n\nconst BlogDynamic = lazy(() => import('../dynamicComponents/BlogDynamic'));\n\ninterface BlogProperties {\n\tchildren: ReactNode;\n\ttitle?: string;\n\tjsonLd?: WithContext<Thing>;\n\tincreasedWidthMode?: boolean;\n}\n\nconst Blog = ({ children, title = 'In this article', jsonLd, increasedWidthMode = false }: BlogProperties) => {\n\treturn (\n\t\t<Suspense fallback={<BlogStatic jsonLd={jsonLd} increasedWidthMode={increasedWidthMode}>{children}</BlogStatic>}>\n\t\t\t<BlogDynamic title={title} jsonLd={jsonLd} increasedWidthMode={increasedWidthMode}>{children}</BlogDynamic>\n\t\t</Suspense>\n\t);\n};\n\nexport default Blog;\n"],"names":["_jsx"],"mappings":";;;;AAOA,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,OAAO,qCAAkC,CAAC,CAAC;AAS1E,MAAM,IAAI,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,GAAG,iBAAiB,EAAE,MAAM,EAAE,kBAAkB,GAAG,KAAK,EAAkB,KAAI;AAC5G,IAAA,QACCA,GAAA,CAAC,QAAQ,EAAA,EAAC,QAAQ,EAAEA,GAAA,CAAC,UAAU,EAAA,EAAC,MAAM,EAAE,MAAM,EAAE,kBAAkB,EAAE,kBAAkB,YAAG,QAAQ,EAAA,CAAc,EAAA,QAAA,EAC9GA,GAAA,CAAC,WAAW,EAAA,EAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,kBAAkB,EAAE,kBAAkB,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAe,EAAA,CACjG;AAEb;;;;"}

package/dist/esm/components/MermaidViewport.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MermaidViewport.js","sources":["../../../src/components/MermaidViewport.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nimport type { PanZoom } from '../hooks/usePanZoom';\n\ninterface MermaidViewportProps {\n\tclassName: string;\n\tdraggingClassName: string;\n\tpan: PanZoom;\n\tcontentRef: React.RefObject<HTMLDivElement>;\n\tcontentId?: string;\n\thidden?: boolean;\n}\n\nconst MermaidViewport = ({\n\tclassName,\n\tdraggingClassName,\n\tpan,\n\tcontentRef,\n\tcontentId,\n\thidden,\n}: MermaidViewportProps) => {\n\tconst viewportRef = useRef<HTMLDivElement>(null);\n\tconst { zoomAtPoint } = pan;\n\n\tuseEffect(() => {\n\t\tconst el = viewportRef.current;\n\t\tif (!el) return;\n\t\tconst onWheel = (e: WheelEvent) => {\n\t\t\tif (!e.ctrlKey) return;\n\t\t\te.preventDefault();\n\t\t\tconst rect = el.getBoundingClientRect();\n\t\t\tzoomAtPoint(e.deltaY, e.clientX - rect.left, e.clientY - rect.top);\n\t\t};\n\t\tel.addEventListener('wheel', onWheel, { passive: false });\n\t\treturn () => el.removeEventListener('wheel', onWheel);\n\t}, [zoomAtPoint]);\n\n\treturn (\n\t\t<div\n\t\t\tref={viewportRef}\n\t\t\tclassName={`${className} ${pan.isDragging ? draggingClassName : ''}`}\n\t\t\tstyle={hidden ? { display: 'none' } : undefined}\n\t\t\tonMouseDown={pan.onMouseDown}\n\t\t\tonMouseMove={pan.onMouseMove}\n\t\t\tonMouseUp={pan.onMouseUp}\n\t\t\tonMouseLeave={pan.onMouseUp}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\ttransform: `translate(${pan.transform.x}px, ${pan.transform.y}px) scale(${pan.transform.scale})`,\n\t\t\t\t\ttransformOrigin: '0 0',\n\t\t\t\t\ttransition: pan.isDragging ? 'none' : 'transform 0.1s ease',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div ref={contentRef} id={contentId} />\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default MermaidViewport;\n"],"names":["_jsx"],"mappings":";;;AAaA,MAAM,eAAe,GAAG,CAAC,EACxB,SAAS,EACT,iBAAiB,EACjB,GAAG,EACH,UAAU,EACV,SAAS,EACT,MAAM,GACgB,KAAI;AAC1B,IAAA,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC;AAChD,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,GAAG;IAE3B,SAAS,CAAC,MAAK;AACd,QAAA,MAAM,EAAE,GAAG,WAAW,CAAC,OAAO;AAC9B,QAAA,IAAI,CAAC,EAAE;YAAE;AACT,QAAA,MAAM,OAAO,GAAG,CAAC,CAAa,KAAI;YACjC,IAAI,CAAC,CAAC,CAAC,OAAO;gBAAE;YAChB,CAAC,CAAC,cAAc,EAAE;AAClB,YAAA,MAAM,IAAI,GAAG,EAAE,CAAC,qBAAqB,EAAE;YACvC,WAAW,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC;AACnE,QAAA,CAAC;AACD,QAAA,EAAE,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QACzD,OAAO,MAAM,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,CAAC;AACtD,IAAA,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC;AAEjB,IAAA,QACCA,GAAA,CAAA,KAAA,EAAA,EACC,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,CAAA,EAAG,SAAS,CAAA,CAAA,EAAI,GAAG,CAAC,UAAU,GAAG,iBAAiB,GAAG,EAAE,CAAA,CAAE,EACpE,KAAK,EAAE,MAAM,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,SAAS,EAC/C,WAAW,EAAE,GAAG,CAAC,WAAW,EAC5B,WAAW,EAAE,GAAG,CAAC,WAAW,EAC5B,SAAS,EAAE,GAAG,CAAC,SAAS,EACxB,YAAY,EAAE,GAAG,CAAC,SAAS,EAAA,QAAA,EAE3BA,GAAA,CAAA,KAAA,EAAA,EACC,KAAK,EAAE;AACN,gBAAA,SAAS,EAAE,CAAA,UAAA,EAAa,GAAG,CAAC,SAAS,CAAC,CAAC,CAAA,IAAA,EAAO,GAAG,CAAC,SAAS,CAAC,CAAC,CAAA,UAAA,EAAa,GAAG,CAAC,SAAS,CAAC,KAAK,CAAA,CAAA,CAAG;AAChG,gBAAA,eAAe,EAAE,KAAK;gBACtB,UAAU,EAAE,GAAG,CAAC,UAAU,GAAG,MAAM,GAAG,qBAAqB;AAC3D,aAAA,EAAA,QAAA,EAEDA,GAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,UAAU,EAAE,EAAE,EAAE,SAAS,EAAA,CAAI,EAAA,CAClC,EAAA,CACD;AAER;;;;"}
1	+ {"version":3,"file":"MermaidViewport.js","sources":["../../../src/components/MermaidViewport.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nimport type { PanZoom } from '../hooks/usePanZoom';\n\ninterface MermaidViewportProps {\n\tclassName: string;\n\tdraggingClassName: string;\n\tpan: PanZoom;\n\tcontentRef: React.RefObject<HTMLDivElement \| null>;\n\tcontentId?: string;\n\thidden?: boolean;\n}\n\nconst MermaidViewport = ({\n\tclassName,\n\tdraggingClassName,\n\tpan,\n\tcontentRef,\n\tcontentId,\n\thidden,\n}: MermaidViewportProps) => {\n\tconst viewportRef = useRef<HTMLDivElement>(null);\n\tconst { zoomAtPoint } = pan;\n\n\tuseEffect(() => {\n\t\tconst el = viewportRef.current;\n\t\tif (!el) return;\n\t\tconst onWheel = (e: WheelEvent) => {\n\t\t\tif (!e.ctrlKey) return;\n\t\t\te.preventDefault();\n\t\t\tconst rect = el.getBoundingClientRect();\n\t\t\tzoomAtPoint(e.deltaY, e.clientX - rect.left, e.clientY - rect.top);\n\t\t};\n\t\tel.addEventListener('wheel', onWheel, { passive: false });\n\t\treturn () => el.removeEventListener('wheel', onWheel);\n\t}, [zoomAtPoint]);\n\n\treturn (\n\t\t<div\n\t\t\tref={viewportRef}\n\t\t\tclassName={`${className} ${pan.isDragging ? draggingClassName : ''}`}\n\t\t\tstyle={hidden ? { display: 'none' } : undefined}\n\t\t\tonMouseDown={pan.onMouseDown}\n\t\t\tonMouseMove={pan.onMouseMove}\n\t\t\tonMouseUp={pan.onMouseUp}\n\t\t\tonMouseLeave={pan.onMouseUp}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\ttransform: `translate(${pan.transform.x}px, ${pan.transform.y}px) scale(${pan.transform.scale})`,\n\t\t\t\t\ttransformOrigin: '0 0',\n\t\t\t\t\ttransition: pan.isDragging ? 'none' : 'transform 0.1s ease',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div ref={contentRef} id={contentId} />\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default MermaidViewport;\n"],"names":["_jsx"],"mappings":";;;AAaA,MAAM,eAAe,GAAG,CAAC,EACxB,SAAS,EACT,iBAAiB,EACjB,GAAG,EACH,UAAU,EACV,SAAS,EACT,MAAM,GACgB,KAAI;AAC1B,IAAA,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC;AAChD,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,GAAG;IAE3B,SAAS,CAAC,MAAK;AACd,QAAA,MAAM,EAAE,GAAG,WAAW,CAAC,OAAO;AAC9B,QAAA,IAAI,CAAC,EAAE;YAAE;AACT,QAAA,MAAM,OAAO,GAAG,CAAC,CAAa,KAAI;YACjC,IAAI,CAAC,CAAC,CAAC,OAAO;gBAAE;YAChB,CAAC,CAAC,cAAc,EAAE;AAClB,YAAA,MAAM,IAAI,GAAG,EAAE,CAAC,qBAAqB,EAAE;YACvC,WAAW,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC;AACnE,QAAA,CAAC;AACD,QAAA,EAAE,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QACzD,OAAO,MAAM,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,CAAC;AACtD,IAAA,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC;AAEjB,IAAA,QACCA,GAAA,CAAA,KAAA,EAAA,EACC,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,CAAA,EAAG,SAAS,CAAA,CAAA,EAAI,GAAG,CAAC,UAAU,GAAG,iBAAiB,GAAG,EAAE,CAAA,CAAE,EACpE,KAAK,EAAE,MAAM,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,SAAS,EAC/C,WAAW,EAAE,GAAG,CAAC,WAAW,EAC5B,WAAW,EAAE,GAAG,CAAC,WAAW,EAC5B,SAAS,EAAE,GAAG,CAAC,SAAS,EACxB,YAAY,EAAE,GAAG,CAAC,SAAS,EAAA,QAAA,EAE3BA,GAAA,CAAA,KAAA,EAAA,EACC,KAAK,EAAE;AACN,gBAAA,SAAS,EAAE,CAAA,UAAA,EAAa,GAAG,CAAC,SAAS,CAAC,CAAC,CAAA,IAAA,EAAO,GAAG,CAAC,SAAS,CAAC,CAAC,CAAA,UAAA,EAAa,GAAG,CAAC,SAAS,CAAC,KAAK,CAAA,CAAA,CAAG;AAChG,gBAAA,eAAe,EAAE,KAAK;gBACtB,UAAU,EAAE,GAAG,CAAC,UAAU,GAAG,MAAM,GAAG,qBAAqB;AAC3D,aAAA,EAAA,QAAA,EAEDA,GAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,UAAU,EAAE,EAAE,EAAE,SAAS,EAAA,CAAI,EAAA,CAClC,EAAA,CACD;AAER;;;;"}

package/dist/esm/dynamicComponents/BlogDynamic.js CHANGED Viewed

@@ -26,7 +26,7 @@ const buildTocTree = (entries) => {
     }
     return roots;
 };
-const Blog = ({ children, title = 'In this article', jsonLd, }) => {
+const Blog = ({ children, title = 'In this article', jsonLd, increasedWidthMode = false, }) => {
     const [visibleTitle, setVisibleTitle] = useState(null);
     const [showTOC, setShowTOC] = useState(false);
     const { categoryTitles, handleSectionReference } = useCategoryTitles({
@@ -43,7 +43,7 @@ const Blog = ({ children, title = 'In this article', jsonLd, }) => {
         transform: showTOC ? 'translateX(0)' : 'translateX(40px)',
         config: config.gentle,
     });
-    return (jsxs("div", { className: styles.blog, children: [jsonLd && (jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(jsonLd) } })), jsx("div", { className: styles['blog__content'], children: Children.map(children, child => {
+    return (jsxs("div", { className: `${styles.blog} ${increasedWidthMode ? styles['blog--increased-width'] : ''}`, children: [jsonLd && (jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(jsonLd) } })), jsx("div", { className: styles['blog__content'], children: Children.map(children, child => {
                     if (!isValidElement(child))
                         return child;
                     return cloneElement(child, {

package/dist/esm/dynamicComponents/BlogDynamic.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BlogDynamic.js","sources":["../../../src/dynamicComponents/BlogDynamic.tsx"],"sourcesContent":["'use client';\n\nimport {\n\tChildren,\n\tcloneElement,\n\tisValidElement,\n\tuseState,\n} from 'react';\nimport { useSpring, animated, config } from '@react-spring/web';\n\nimport type { ReactNode, RefAttributes } from 'react';\nimport type { Thing, WithContext } from 'schema-dts';\n\nimport styles from '../styles/Blog.module.scss';\nimport { useCategoryTitles } from '../hooks/useCategoryTitles';\nimport { useSectionObserver } from '../hooks/useSectionObserver';\nimport type { CategoryTitleValue } from '../hooks/useCategoryTitles';\nimport TocNodeStatic from '../staticComponents/TocNodeStatic';\nimport type { TocNode } from '../staticComponents/TocNodeStatic';\n\ninterface BlogProperties {\n\tchildren: ReactNode;\n\ttitle?: string;\n\tjsonLd?: WithContext<Thing>;\n}\n\nexport interface ForwardedReference {\n\tparentRef: HTMLDivElement;\n\tchildRefs: ForwardedReference[];\n}\n\nconst MAX_TOC_DEPTH = 2;\n\nconst buildTocTree = (entries: [string, CategoryTitleValue][]): TocNode[] => {\n\tconst roots: TocNode[] = [];\n\tconst stack: TocNode[] = [];\n\tfor (const [id, { title, depth }] of entries.filter(([, { depth }]) => depth <= MAX_TOC_DEPTH)) {\n\t\tconst node: TocNode = { id, title, depth, children: [] };\n\t\twhile (stack.length > 0 && stack[stack.length - 1].depth >= depth) {\n\t\t\tstack.pop();\n\t\t}\n\t\tif (stack.length === 0) {\n\t\t\troots.push(node);\n\t\t} else {\n\t\t\tstack[stack.length - 1].children.push(node);\n\t\t}\n\t\tstack.push(node);\n\t}\n\treturn roots;\n};\n\nconst Blog = ({\n\tchildren,\n\ttitle = 'In this article',\n\tjsonLd,\n}: BlogProperties) => {\n\tconst [visibleTitle, setVisibleTitle] = useState<string \| null>(null);\n\tconst [showTOC, setShowTOC] = useState(false);\n\n\tconst { categoryTitles, handleSectionReference } = useCategoryTitles({\n\t\tvisibleTitle,\n\t\tsetVisibleTitle,\n\t\tsetShowTOC,\n\t});\n\n\tconst { handleClickCategoryTitle } = useSectionObserver({\n\t\tcategoryTitles,\n\t\tsetVisibleTitle,\n\t});\n\n\tconst sidebarStyle = useSpring({\n\t\topacity: showTOC ? 1 : 0,\n\t\ttransform: showTOC ? 'translateX(0)' : 'translateX(40px)',\n\t\tconfig: config.gentle,\n\t});\n\n\treturn (\n\t\t<div className={styles.blog}>\n\t\t\t{jsonLd && (\n\t\t\t\t<script\n\t\t\t\t\ttype=\"application/ld+json\"\n\t\t\t\t\tdangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<div className={styles['blog__content']}>\n\t\t\t\t{Children.map(children, child => {\n\t\t\t\t\tif (!isValidElement(child)) return child;\n\t\t\t\t\treturn cloneElement(child, {\n\t\t\t\t\t\tref: handleSectionReference,\n\t\t\t\t\t} as RefAttributes<ForwardedReference>);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t\t<animated.div className={styles['blog__sidebar']} style={sidebarStyle}>\n\t\t\t\t<p\n\t\t\t\t\tclassName={`${styles['margin-bottom--3']} ${styles['category__header']}`}\n\t\t\t\t>\n\t\t\t\t\t{title}\n\t\t\t\t</p>\n\t\t\t\t{buildTocTree([...categoryTitles]).map((node, i) => (\n\t\t\t\t\t<TocNodeStatic\n\t\t\t\t\t\tkey={node.id}\n\t\t\t\t\t\tnode={node}\n\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\tvisibleTitle={visibleTitle}\n\t\t\t\t\t\tonClick={handleClickCategoryTitle}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</animated.div>\n\t\t</div>\n\t);\n};\n\nexport default Blog;\n"],"names":["_jsxs","_jsx","TocNodeStatic"],"mappings":";;;;;;;;~~AA+BA~~,MAAM,aAAa,GAAG,CAAC;AAEvB,MAAM,YAAY,GAAG,CAAC,OAAuC,KAAe;IAC3E,MAAM,KAAK,GAAc,EAAE;IAC3B,MAAM,KAAK,GAAc,EAAE;AAC3B,IAAA,KAAK,MAAM,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,IAAI,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,CAAC,KAAK,KAAK,IAAI,aAAa,CAAC,EAAE;AAC/F,QAAA,MAAM,IAAI,GAAY,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;AACxD,QAAA,OAAO,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,KAAK,IAAI,KAAK,EAAE;YAClE,KAAK,CAAC,GAAG,EAAE;QACZ;AACA,QAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;AACvB,YAAA,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC;QACjB;aAAO;AACN,YAAA,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;QAC5C;AACA,QAAA,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC;IACjB;AACA,IAAA,OAAO,KAAK;AACb,CAAC;AAED,MAAM,IAAI,GAAG,CAAC,EACb,QAAQ,EACR,KAAK,GAAG,iBAAiB,EACzB,MAAM,~~GACU~~,KAAI;IACpB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC;IACrE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;AAE7C,IAAA,MAAM,EAAE,cAAc,EAAE,sBAAsB,EAAE,GAAG,iBAAiB,CAAC;QACpE,YAAY;QACZ,eAAe;QACf,UAAU;AACV,KAAA,CAAC;AAEF,IAAA,MAAM,EAAE,wBAAwB,EAAE,GAAG,kBAAkB,CAAC;QACvD,cAAc;QACd,eAAe;AACf,KAAA,CAAC;IAEF,MAAM,YAAY,GAAG,SAAS,CAAC;QAC9B,OAAO,EAAE,OAAO,GAAG,CAAC,GAAG,CAAC;QACxB,SAAS,EAAE,OAAO,GAAG,eAAe,GAAG,kBAAkB;QACzD,MAAM,EAAE,MAAM,CAAC,MAAM;AACrB,KAAA,CAAC;~~IAEF~~,QACCA,~~cAAK~~,SAAS,EAAE,MAAM,CAAC,IAAI,~~aACzB~~,MAAM,KACNC,GAAA,CAAA,QAAA,EAAA,EACC,IAAI,EAAC,qBAAqB,EAC1B,uBAAuB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,EAAA,CAC1D,CACF,EACDA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,EAAA,QAAA,EACrC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,IAAG;AAC/B,oBAAA,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC;AAAE,wBAAA,OAAO,KAAK;oBACxC,OAAO,YAAY,CAAC,KAAK,EAAE;AAC1B,wBAAA,GAAG,EAAE,sBAAsB;AACU,qBAAA,CAAC;AACxC,gBAAA,CAAC,CAAC,EAAA,CACG,EACND,IAAA,CAAC,QAAQ,CAAC,GAAG,EAAA,EAAC,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,EAAE,KAAK,EAAE,YAAY,EAAA,QAAA,EAAA,CACpEC,GAAA,CAAA,GAAA,EAAA,EACC,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,kBAAkB,CAAC,IAAI,MAAM,CAAC,kBAAkB,CAAC,EAAE,EAAA,QAAA,EAEvE,KAAK,GACH,EACH,YAAY,CAAC,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,MAC9CA,GAAA,CAACC,OAAa,IAEb,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,CAAC,EACR,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,wBAAwB,EAAA,EAJ5B,IAAI,CAAC,EAAE,CAKX,CACF,CAAC,CAAA,EAAA,CACY,CAAA,EAAA,CACV;AAER;;;;"}
1	+ {"version":3,"file":"BlogDynamic.js","sources":["../../../src/dynamicComponents/BlogDynamic.tsx"],"sourcesContent":["'use client';\n\nimport {\n\tChildren,\n\tcloneElement,\n\tisValidElement,\n\tuseState,\n} from 'react';\nimport { useSpring, animated, config } from '@react-spring/web';\n\nimport type { ReactNode, RefAttributes } from 'react';\nimport type { Thing, WithContext } from 'schema-dts';\n\nimport styles from '../styles/Blog.module.scss';\nimport { useCategoryTitles } from '../hooks/useCategoryTitles';\nimport { useSectionObserver } from '../hooks/useSectionObserver';\nimport type { CategoryTitleValue } from '../hooks/useCategoryTitles';\nimport TocNodeStatic from '../staticComponents/TocNodeStatic';\nimport type { TocNode } from '../staticComponents/TocNodeStatic';\n\ninterface BlogProperties {\n\tchildren: ReactNode;\n\ttitle?: string;\n\tjsonLd?: WithContext<Thing>;\n\tincreasedWidthMode?: boolean;\n}\n\nexport interface ForwardedReference {\n\tparentRef: HTMLDivElement;\n\tchildRefs: ForwardedReference[];\n}\n\nconst MAX_TOC_DEPTH = 2;\n\nconst buildTocTree = (entries: [string, CategoryTitleValue][]): TocNode[] => {\n\tconst roots: TocNode[] = [];\n\tconst stack: TocNode[] = [];\n\tfor (const [id, { title, depth }] of entries.filter(([, { depth }]) => depth <= MAX_TOC_DEPTH)) {\n\t\tconst node: TocNode = { id, title, depth, children: [] };\n\t\twhile (stack.length > 0 && stack[stack.length - 1].depth >= depth) {\n\t\t\tstack.pop();\n\t\t}\n\t\tif (stack.length === 0) {\n\t\t\troots.push(node);\n\t\t} else {\n\t\t\tstack[stack.length - 1].children.push(node);\n\t\t}\n\t\tstack.push(node);\n\t}\n\treturn roots;\n};\n\nconst Blog = ({\n\tchildren,\n\ttitle = 'In this article',\n\tjsonLd,\n\tincreasedWidthMode = false,\n}: BlogProperties) => {\n\tconst [visibleTitle, setVisibleTitle] = useState<string \| null>(null);\n\tconst [showTOC, setShowTOC] = useState(false);\n\n\tconst { categoryTitles, handleSectionReference } = useCategoryTitles({\n\t\tvisibleTitle,\n\t\tsetVisibleTitle,\n\t\tsetShowTOC,\n\t});\n\n\tconst { handleClickCategoryTitle } = useSectionObserver({\n\t\tcategoryTitles,\n\t\tsetVisibleTitle,\n\t});\n\n\tconst sidebarStyle = useSpring({\n\t\topacity: showTOC ? 1 : 0,\n\t\ttransform: showTOC ? 'translateX(0)' : 'translateX(40px)',\n\t\tconfig: config.gentle,\n\t});\n\n\treturn (\n\t\t<div className={`${styles.blog} ${increasedWidthMode ? styles['blog--increased-width'] : ''}`}>\n\t\t\t{jsonLd && (\n\t\t\t\t<script\n\t\t\t\t\ttype=\"application/ld+json\"\n\t\t\t\t\tdangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<div className={styles['blog__content']}>\n\t\t\t\t{Children.map(children, child => {\n\t\t\t\t\tif (!isValidElement(child)) return child;\n\t\t\t\t\treturn cloneElement(child, {\n\t\t\t\t\t\tref: handleSectionReference,\n\t\t\t\t\t} as RefAttributes<ForwardedReference>);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t\t<animated.div className={styles['blog__sidebar']} style={sidebarStyle}>\n\t\t\t\t<p\n\t\t\t\t\tclassName={`${styles['margin-bottom--3']} ${styles['category__header']}`}\n\t\t\t\t>\n\t\t\t\t\t{title}\n\t\t\t\t</p>\n\t\t\t\t{buildTocTree([...categoryTitles]).map((node, i) => (\n\t\t\t\t\t<TocNodeStatic\n\t\t\t\t\t\tkey={node.id}\n\t\t\t\t\t\tnode={node}\n\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\tvisibleTitle={visibleTitle}\n\t\t\t\t\t\tonClick={handleClickCategoryTitle}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</animated.div>\n\t\t</div>\n\t);\n};\n\nexport default Blog;\n"],"names":["_jsxs","_jsx","TocNodeStatic"],"mappings":"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"}

package/dist/esm/hooks/useCategoryTitles.js CHANGED Viewed

@@ -21,7 +21,11 @@ function useCategoryTitles({ visibleTitle, setVisibleTitle, setShowTOC, }) {
         const sectionsArray = Array.from(sectionReferences.current.entries());
         sectionsArray.sort(sortByDomPosition);
         let firstSectionId = null;
-        for (const [id, { title, el, depth }] of sectionsArray) {
+        const baseIdCounts = new Map();
+        for (const [, { title, el, depth, baseId }] of sectionsArray) {
+            const occurrence = (baseIdCounts.get(baseId) ?? 0) + 1;
+            baseIdCounts.set(baseId, occurrence);
+            const id = occurrence === 1 ? baseId : `${baseId}-${occurrence}`;
             if (!firstSectionId) {
                 firstSectionId = id;
             }
@@ -48,19 +52,10 @@ function useCategoryTitles({ visibleTitle, setVisibleTitle, setShowTOC, }) {
             updateCategoryTitles();
         }, 200);
     }, [updateCategoryTitles]);
-    const removeStaleRefs = (ref) => {
-        for (const [existingId, { el }] of sectionReferences.current) {
-            if (el !== ref) {
-                continue;
-            }
-            sectionReferences.current.delete(existingId);
-            break;
-        }
-    };
     const handleCategoryTitle = (ref) => {
-        const id = ref.dataset.id;
+        const baseId = ref.dataset.id;
         const title = ref.dataset.title;
-        if (!id || !title)
+        if (!baseId || !title)
             return;
         let depth = 0;
         let parent = ref.parentElement;
@@ -69,8 +64,7 @@ function useCategoryTitles({ visibleTitle, setVisibleTitle, setShowTOC, }) {
                 depth++;
             parent = parent.parentElement;
         }
-        removeStaleRefs(ref);
-        sectionReferences.current.set(id, { el: ref, title, depth });
+        sectionReferences.current.set(ref, { el: ref, title, depth, baseId });
     };
     const processSection = (element) => {
         const { parentRef, childRefs } = element;

package/dist/esm/hooks/useCategoryTitles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useCategoryTitles.js","sources":["../../../src/hooks/useCategoryTitles.ts"],"sourcesContent":["'use client';\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport type { Dispatch, SetStateAction } from 'react';\n\nimport type { ForwardedReference } from '../dynamicComponents/BlogDynamic';\n\nexport interface SectionReferenceValue {\n\tel: HTMLElement;\n\ttitle: string;\n\tdepth: number;\n}\n\nexport interface CategoryTitleValue extends SectionReferenceValue {\n\tlastUpdatedAt: number;\n}\n\nexport type CategoryTitle = Map<string, CategoryTitleValue>;\n\ntype SectionReference = Map<~~string~~, ~~SectionReferenceValue~~>;\n\ninterface Options {\n\tvisibleTitle: string \| null;\n\tsetVisibleTitle: Dispatch<SetStateAction<string \| null>>;\n\tsetShowTOC: Dispatch<SetStateAction<boolean>>;\n}\n\nexport function useCategoryTitles({\n\tvisibleTitle,\n\tsetVisibleTitle,\n\tsetShowTOC,\n}: Options) {\n\tconst sectionReferences = useRef<SectionReference>(new Map());\n\tconst [categoryTitles, setCategoryTitles] = useState<CategoryTitle>(\n\t\tnew Map()\n\t);\n\tconst updateTimerRef = useRef<ReturnType<typeof setTimeout> \| null>(null);\n\n\tconst sortByDomPosition = useCallback(\n\t\t(\n\t\t\t[, a]: [~~string~~, ~~SectionReferenceValue~~],\n\t\t\t[, b]: [~~string~~, ~~SectionReferenceValue~~]\n\t\t) => {\n\t\t\tconst position = a.el.compareDocumentPosition(b.el);\n\t\t\tif (position & Node.DOCUMENT_POSITION_FOLLOWING) {\n\t\t\t\treturn -1;\n\t\t\t} else if (position & Node.DOCUMENT_POSITION_PRECEDING) {\n\t\t\t\treturn 1;\n\t\t\t}\n\t\t\treturn 0;\n\t\t},\n\t\t[]\n\t);\n\n\tconst updateCategoryTitles = useCallback(() => {\n\t\tconst now = Date.now();\n\t\tconst newCategoryTitles = new Map<string, CategoryTitleValue>();\n\n\t\tconst sectionsArray = Array.from(sectionReferences.current.entries());\n\t\tsectionsArray.sort(sortByDomPosition);\n\n\t\tlet firstSectionId: string \| null = null;\n\t\tfor (const [id, { title, el, depth }] of sectionsArray) {\n\t\t\tif (!firstSectionId) {\n\t\t\t\tfirstSectionId = id;\n\t\t\t}\n\t\t\tnewCategoryTitles.set(id, {\n\t\t\t\tel,\n\t\t\t\ttitle,\n\t\t\t\tlastUpdatedAt: now,\n\t\t\t\tdepth,\n\t\t\t});\n\t\t}\n\n\t\tif (newCategoryTitles.size === 0) return;\n\n\t\tsetCategoryTitles(newCategoryTitles);\n\t\tsetShowTOC(true);\n\n\t\tif (visibleTitle) return;\n\t\tsetVisibleTitle(firstSectionId);\n\t}, [visibleTitle, sortByDomPosition, setShowTOC, setVisibleTitle]);\n\n\tconst debounceUpdateCategoryTitles = useCallback(() => {\n\t\tif (updateTimerRef.current) {\n\t\t\tclearTimeout(updateTimerRef.current);\n\t\t}\n\t\tupdateTimerRef.current = setTimeout(() => {\n\t\t\tupdateCategoryTitles();\n\t\t}, 200);\n\t}, [updateCategoryTitles]);\n\n\tconst removeStaleRefs = (ref: HTMLDivElement) => {\n\t\tfor (const [existingId, { el }] of sectionReferences.current) {\n\t\t\tif (el !== ref) {\n\t\t\t\tcontinue;\n\t\t\t}\n\t\t\tsectionReferences.current.delete(existingId);\n\t\t\tbreak;\n\t\t}\n\t};\n\n\tconst handleCategoryTitle = (ref: HTMLDivElement) => {\n\t\tconst id = ref.dataset.id;\n\t\tconst title = ref.dataset.title;\n\t\tif (!id \|\| !title) return;\n\n\t\tlet depth = 0;\n\t\tlet parent = ref.parentElement;\n\t\twhile (parent) {\n\t\t\tif (parent.hasAttribute('data-id')) depth++;\n\t\t\tparent = parent.parentElement;\n\t\t}\n\n\t\~~tremoveStaleRefs(ref);\n\t\~~tsectionReferences.current.set(id, { el: ref, title, depth });\n\t};\n\n\tconst processSection = (element: ForwardedReference) => {\n\t\tconst { parentRef, childRefs } = element;\n\t\tif (parentRef) handleCategoryTitle(parentRef);\n\t\tif (Array.isArray(childRefs)) {\n\t\t\tfor (const childRef of childRefs) {\n\t\t\t\tprocessSection(childRef);\n\t\t\t}\n\t\t}\n\t};\n\n\tconst handleSectionReference = useCallback(\n\t\t(element: ForwardedReference) => {\n\t\t\tif (!element) return;\n\t\t\tprocessSection(element);\n\t\t\tdebounceUpdateCategoryTitles();\n\t\t},\n\t\t[debounceUpdateCategoryTitles]\n\t);\n\n\tuseEffect(() => {\n\t\treturn () => {\n\t\t\tif (updateTimerRef.current) {\n\t\t\t\tclearTimeout(updateTimerRef.current);\n\t\t\t}\n\t\t};\n\t}, []);\n\n\treturn { categoryTitles, handleSectionReference };\n}\n"],"names":[],"mappings":";;~~AA4BM~~,SAAU,iBAAiB,CAAC,EACjC,YAAY,EACZ,eAAe,EACf,UAAU,GACD,EAAA;IACT,MAAM,iBAAiB,GAAG,MAAM,CAAmB,IAAI,GAAG,EAAE,CAAC;AAC7D,IAAA,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CACnD,IAAI,GAAG,EAAE,CACT;AACD,IAAA,MAAM,cAAc,GAAG,MAAM,CAAuC,IAAI,CAAC;AAEzE,IAAA,MAAM,iBAAiB,GAAG,WAAW,CACpC,CACC,GAAG,CAAC,~~CAAkC~~,~~EACtC~~,GAAG,CAAC,~~CAAkC~~,~~KACnC~~;AACH,QAAA,MAAM,QAAQ,GAAG,CAAC,CAAC,EAAE,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE,CAAC;AACnD,QAAA,IAAI,QAAQ,GAAG,IAAI,CAAC,2BAA2B,EAAE;YAChD,OAAO,EAAE;QACV;AAAO,aAAA,IAAI,QAAQ,GAAG,IAAI,CAAC,2BAA2B,EAAE;AACvD,YAAA,OAAO,CAAC;QACT;AACA,QAAA,OAAO,CAAC;IACT,CAAC,EACD,EAAE,CACF;AAED,IAAA,MAAM,oBAAoB,GAAG,WAAW,CAAC,MAAK;AAC7C,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE;AACtB,QAAA,MAAM,iBAAiB,GAAG,IAAI,GAAG,EAA8B;AAE/D,QAAA,MAAM,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;AACrE,QAAA,aAAa,CAAC,IAAI,CAAC,iBAAiB,CAAC;QAErC,IAAI,cAAc,GAAkB,IAAI;AACxC,QAAA,KAAK,MAAM,~~CAAC~~,EAAE,EAAE,EAAE,KAAK,EAAE,~~EAAE~~,EAAE,~~KAAK~~,EAAE,CAAC,IAAI,~~aAAa~~,EAAE;~~YACvD~~,IAAI,CAAC,cAAc,EAAE;gBACpB,cAAc,GAAG,EAAE;YACpB;AACA,YAAA,iBAAiB,CAAC,GAAG,CAAC,EAAE,EAAE;gBACzB,EAAE;gBACF,KAAK;AACL,gBAAA,aAAa,EAAE,GAAG;gBAClB,KAAK;AACL,aAAA,CAAC;QACH;AAEA,QAAA,IAAI,iBAAiB,CAAC,IAAI,KAAK,CAAC;YAAE;QAElC,iBAAiB,CAAC,iBAAiB,CAAC;QACpC,UAAU,CAAC,IAAI,CAAC;AAEhB,QAAA,IAAI,YAAY;YAAE;QAClB,eAAe,CAAC,cAAc,CAAC;IAChC,CAAC,EAAE,CAAC,YAAY,EAAE,iBAAiB,EAAE,UAAU,EAAE,eAAe,CAAC,CAAC;AAElE,IAAA,MAAM,4BAA4B,GAAG,WAAW,CAAC,MAAK;AACrD,QAAA,IAAI,cAAc,CAAC,OAAO,EAAE;AAC3B,YAAA,YAAY,CAAC,cAAc,CAAC,OAAO,CAAC;QACrC;AACA,QAAA,cAAc,CAAC,OAAO,GAAG,UAAU,CAAC,MAAK;AACxC,YAAA,oBAAoB,EAAE;QACvB,CAAC,EAAE,GAAG,CAAC;AACR,IAAA,CAAC,EAAE,CAAC,oBAAoB,CAAC,CAAC;AAE1B,IAAA,MAAM,eAAe,GAAG,CAAC,GAAmB,KAAI;AAC/C,QAAA,KAAK,MAAM,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,CAAC,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC7D,YAAA,IAAI,EAAE,KAAK,GAAG,EAAE;gBACf;YACD;AACA,YAAA,iBAAiB,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,CAAC;YAC5C;QACD;AACD,IAAA,CAAC;AAED,IAAA,MAAM,mBAAmB,GAAG,CAAC,GAAmB,KAAI;AACnD,QAAA,MAAM,~~EAAE~~,GAAG,GAAG,CAAC,OAAO,CAAC,EAAE;~~AACzB~~,QAAA,MAAM,KAAK,GAAG,GAAG,CAAC,OAAO,CAAC,KAAK;AAC/B,QAAA,IAAI,CAAC,~~EAAE~~,IAAI,CAAC,KAAK;YAAE;~~QAEnB~~,IAAI,KAAK,GAAG,CAAC;AACb,QAAA,IAAI,MAAM,GAAG,GAAG,CAAC,aAAa;QAC9B,OAAO,MAAM,EAAE;AACd,YAAA,IAAI,MAAM,CAAC,YAAY,CAAC,SAAS,CAAC;AAAE,gBAAA,KAAK,EAAE;AAC3C,YAAA,MAAM,GAAG,MAAM,CAAC,aAAa;QAC9B;~~QAEA~~,~~eAAe,CAAC,GAAG,CAAC;AACpB,~~QAAA,iBAAiB,CAAC,OAAO,CAAC,GAAG,CAAC,~~EAAE~~,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC;~~AAC7D~~,IAAA,CAAC;AAED,IAAA,MAAM,cAAc,GAAG,CAAC,OAA2B,KAAI;AACtD,QAAA,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,OAAO;AACxC,QAAA,IAAI,SAAS;YAAE,mBAAmB,CAAC,SAAS,CAAC;AAC7C,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE;AAC7B,YAAA,KAAK,MAAM,QAAQ,IAAI,SAAS,EAAE;gBACjC,cAAc,CAAC,QAAQ,CAAC;YACzB;QACD;AACD,IAAA,CAAC;AAED,IAAA,MAAM,sBAAsB,GAAG,WAAW,CACzC,CAAC,OAA2B,KAAI;AAC/B,QAAA,IAAI,CAAC,OAAO;YAAE;QACd,cAAc,CAAC,OAAO,CAAC;AACvB,QAAA,4BAA4B,EAAE;AAC/B,IAAA,CAAC,EACD,CAAC,4BAA4B,CAAC,CAC9B;IAED,SAAS,CAAC,MAAK;AACd,QAAA,OAAO,MAAK;AACX,YAAA,IAAI,cAAc,CAAC,OAAO,EAAE;AAC3B,gBAAA,YAAY,CAAC,cAAc,CAAC,OAAO,CAAC;YACrC;AACD,QAAA,CAAC;IACF,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,OAAO,EAAE,cAAc,EAAE,sBAAsB,EAAE;AAClD;;;;"}
1	+ {"version":3,"file":"useCategoryTitles.js","sources":["../../../src/hooks/useCategoryTitles.ts"],"sourcesContent":["'use client';\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport type { Dispatch, SetStateAction } from 'react';\n\nimport type { ForwardedReference } from '../dynamicComponents/BlogDynamic';\n\nexport interface SectionReferenceValue {\n\tel: HTMLElement;\n\ttitle: string;\n\tdepth: number;\n}\n\nexport interface CategoryTitleValue extends SectionReferenceValue {\n\tlastUpdatedAt: number;\n}\n\nexport type CategoryTitle = Map<string, CategoryTitleValue>;\n\ninterface SectionReferenceEntry extends SectionReferenceValue {\n\tbaseId: string;\n}\n\ntype SectionReference = Map<HTMLElement, SectionReferenceEntry>;\n\ninterface Options {\n\tvisibleTitle: string \| null;\n\tsetVisibleTitle: Dispatch<SetStateAction<string \| null>>;\n\tsetShowTOC: Dispatch<SetStateAction<boolean>>;\n}\n\nexport function useCategoryTitles({\n\tvisibleTitle,\n\tsetVisibleTitle,\n\tsetShowTOC,\n}: Options) {\n\tconst sectionReferences = useRef<SectionReference>(new Map());\n\tconst [categoryTitles, setCategoryTitles] = useState<CategoryTitle>(\n\t\tnew Map()\n\t);\n\tconst updateTimerRef = useRef<ReturnType<typeof setTimeout> \| null>(null);\n\n\tconst sortByDomPosition = useCallback(\n\t\t(\n\t\t\t[, a]: [HTMLElement, SectionReferenceEntry],\n\t\t\t[, b]: [HTMLElement, SectionReferenceEntry]\n\t\t) => {\n\t\t\tconst position = a.el.compareDocumentPosition(b.el);\n\t\t\tif (position & Node.DOCUMENT_POSITION_FOLLOWING) {\n\t\t\t\treturn -1;\n\t\t\t} else if (position & Node.DOCUMENT_POSITION_PRECEDING) {\n\t\t\t\treturn 1;\n\t\t\t}\n\t\t\treturn 0;\n\t\t},\n\t\t[]\n\t);\n\n\tconst updateCategoryTitles = useCallback(() => {\n\t\tconst now = Date.now();\n\t\tconst newCategoryTitles = new Map<string, CategoryTitleValue>();\n\n\t\tconst sectionsArray = Array.from(sectionReferences.current.entries());\n\t\tsectionsArray.sort(sortByDomPosition);\n\n\t\tlet firstSectionId: string \| null = null;\n\t\tconst baseIdCounts = new Map<string, number>();\n\t\tfor (const [, { title, el, depth, baseId }] of sectionsArray) {\n\t\t\tconst occurrence = (baseIdCounts.get(baseId) ?? 0) + 1;\n\t\t\tbaseIdCounts.set(baseId, occurrence);\n\t\t\tconst id = occurrence === 1 ? baseId : `${baseId}-${occurrence}`;\n\n\t\t\tif (!firstSectionId) {\n\t\t\t\tfirstSectionId = id;\n\t\t\t}\n\t\t\tnewCategoryTitles.set(id, {\n\t\t\t\tel,\n\t\t\t\ttitle,\n\t\t\t\tlastUpdatedAt: now,\n\t\t\t\tdepth,\n\t\t\t});\n\t\t}\n\n\t\tif (newCategoryTitles.size === 0) return;\n\n\t\tsetCategoryTitles(newCategoryTitles);\n\t\tsetShowTOC(true);\n\n\t\tif (visibleTitle) return;\n\t\tsetVisibleTitle(firstSectionId);\n\t}, [visibleTitle, sortByDomPosition, setShowTOC, setVisibleTitle]);\n\n\tconst debounceUpdateCategoryTitles = useCallback(() => {\n\t\tif (updateTimerRef.current) {\n\t\t\tclearTimeout(updateTimerRef.current);\n\t\t}\n\t\tupdateTimerRef.current = setTimeout(() => {\n\t\t\tupdateCategoryTitles();\n\t\t}, 200);\n\t}, [updateCategoryTitles]);\n\n\tconst handleCategoryTitle = (ref: HTMLDivElement) => {\n\t\tconst baseId = ref.dataset.id;\n\t\tconst title = ref.dataset.title;\n\t\tif (!baseId \|\| !title) return;\n\n\t\tlet depth = 0;\n\t\tlet parent = ref.parentElement;\n\t\twhile (parent) {\n\t\t\tif (parent.hasAttribute('data-id')) depth++;\n\t\t\tparent = parent.parentElement;\n\t\t}\n\n\t\tsectionReferences.current.set(ref, { el: ref, title, depth, baseId });\n\t};\n\n\tconst processSection = (element: ForwardedReference) => {\n\t\tconst { parentRef, childRefs } = element;\n\t\tif (parentRef) handleCategoryTitle(parentRef);\n\t\tif (Array.isArray(childRefs)) {\n\t\t\tfor (const childRef of childRefs) {\n\t\t\t\tprocessSection(childRef);\n\t\t\t}\n\t\t}\n\t};\n\n\tconst handleSectionReference = useCallback(\n\t\t(element: ForwardedReference) => {\n\t\t\tif (!element) return;\n\t\t\tprocessSection(element);\n\t\t\tdebounceUpdateCategoryTitles();\n\t\t},\n\t\t[debounceUpdateCategoryTitles]\n\t);\n\n\tuseEffect(() => {\n\t\treturn () => {\n\t\t\tif (updateTimerRef.current) {\n\t\t\t\tclearTimeout(updateTimerRef.current);\n\t\t\t}\n\t\t};\n\t}, []);\n\n\treturn { categoryTitles, handleSectionReference };\n}\n"],"names":[],"mappings":"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"}