@san-siva/blogkit 1.1.21 → 1.1.22

package/dist/esm/staticComponents/BlogSectionStatic.js

@@ -2,13 +2,10 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import styles from '../styles/BlogSection.module.scss.js';
 import { generateIdForBlogTitle } from '../utils/index.js';
 
-const BlogSectionStatic = ({ title = '', category = '', children = null, increaseMarginBottom = false, }) => {
+const BlogSectionStatic = ({ title = '', category = '', children = null, }) => {
     const titleWithCategory = category ? `${category} - ${title}` : title;
     const id = generateIdForBlogTitle(titleWithCategory);
-    return (jsxs("div", { className: `${styles['blog-section']}
-				${increaseMarginBottom
-            ? styles['margin-bottom--9']
-            : styles['margin-bottom--6']}`, "data-title": title, "data-id": id, children: [title ? (jsx("h4", { className: styles['blog-section__title'], children: title })) : null, children] }));
+    return (jsxs("div", { className: styles['blog-section'], "data-title": title, "data-id": id, children: [title ? (jsx("h3", { className: styles['blog-section__title'], children: title })) : null, children] }));
 };
 
 export { BlogSectionStatic as default };

package/dist/esm/staticComponents/BlogSectionStatic.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlogSectionStatic.js","sources":["../../../src/staticComponents/BlogSectionStatic.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport styles from '../styles/BlogSection.module.scss';\nimport { generateIdForBlogTitle } from '../utils';\n\ninterface BlogSectionStaticProperties {\n\ttitle?: string;\n\tcategory?: string;\n\tchildren?: ReactNode;\n\tincreaseMarginBottom?: boolean;\n}\n\nconst BlogSectionStatic = ({\n\ttitle = '',\n\tcategory = '',\n\tchildren = null,\n\tincreaseMarginBottom = false,\n}: BlogSectionStaticProperties) => {\n\tconst titleWithCategory = category ? `${category} - ${title}` : title;\n\tconst id = generateIdForBlogTitle(titleWithCategory);\n\n\treturn (\n\t\t<div\n\t\t\tclassName={`${styles['blog-section']}\n\t\t\t\t${\n\t\t\t\t\tincreaseMarginBottom\n\t\t\t\t\t\t? styles['margin-bottom--9']\n\t\t\t\t\t\t: styles['margin-bottom--6']\n\t\t\t\t}`}\n\t\t\tdata-title={title}\n\t\t\tdata-id={id}\n\t\t>\n\t\t\t{title ? (\n\t\t\t\t<h4 className={styles['blog-section__title']}>{title}</h4>\n\t\t\t) : null}\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\nexport default BlogSectionStatic;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;AAWA,MAAM,iBAAiB,GAAG,CAAC,EAC1B,KAAK,GAAG,EAAE,EACV,QAAQ,GAAG,EAAE,EACb,QAAQ,GAAG,IAAI,EACf,oBAAoB,GAAG,KAAK,GACC,KAAI;AACjC,IAAA,MAAM,iBAAiB,GAAG,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,GAAA,EAAM,KAAK,CAAA,CAAE,GAAG,KAAK;AACrE,IAAA,MAAM,EAAE,GAAG,sBAAsB,CAAC,iBAAiB,CAAC;IAEpD,QACCA,cACC,SAAS,EAAE,GAAG,MAAM,CAAC,cAAc,CAAC;MAElC;AACC,cAAE,MAAM,CAAC,kBAAkB;AAC3B,cAAE,MAAM,CAAC,kBAAkB,CAC7B,CAAA,CAAE,EAAA,YAAA,EACS,KAAK,EAAA,SAAA,EACR,EAAE,EAAA,QAAA,EAAA,CAEV,KAAK,IACLC,GAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC,EAAA,QAAA,EAAG,KAAK,EAAA,CAAM,IACvD,IAAI,EACP,QAAQ,CAAA,EAAA,CACJ;AAER;;;;"}
+{"version":3,"file":"BlogSectionStatic.js","sources":["../../../src/staticComponents/BlogSectionStatic.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport styles from '../styles/BlogSection.module.scss';\nimport { generateIdForBlogTitle } from '../utils';\n\ninterface BlogSectionStaticProperties {\n\ttitle?: string;\n\tcategory?: string;\n\tchildren?: ReactNode;\n}\n\nconst BlogSectionStatic = ({\n\ttitle = '',\n\tcategory = '',\n\tchildren = null,\n}: BlogSectionStaticProperties) => {\n\tconst titleWithCategory = category ? `${category} - ${title}` : title;\n\tconst id = generateIdForBlogTitle(titleWithCategory);\n\n\treturn (\n\t\t<div className={styles['blog-section']} data-title={title} data-id={id}>\n\t\t\t{title ? (\n\t\t\t\t<h3 className={styles['blog-section__title']}>{title}</h3>\n\t\t\t) : null}\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\nexport default BlogSectionStatic;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;AAUA,MAAM,iBAAiB,GAAG,CAAC,EAC1B,KAAK,GAAG,EAAE,EACV,QAAQ,GAAG,EAAE,EACb,QAAQ,GAAG,IAAI,GACc,KAAI;AACjC,IAAA,MAAM,iBAAiB,GAAG,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,GAAA,EAAM,KAAK,CAAA,CAAE,GAAG,KAAK;AACrE,IAAA,MAAM,EAAE,GAAG,sBAAsB,CAAC,iBAAiB,CAAC;AAEpD,IAAA,QACCA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,EAAA,YAAA,EAAc,KAAK,aAAW,EAAE,EAAA,QAAA,EAAA,CACpE,KAAK,IACLC,GAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC,YAAG,KAAK,EAAA,CAAM,IACvD,IAAI,EACP,QAAQ,CAAA,EAAA,CACJ;AAER;;;;"}

package/dist/esm/styles/BlogSection.module.scss.js

@@ -1,4 +1,4 @@
-var styles = {"margin-bottom--6":"BlogSection-module_margin-bottom--6__-hlAO","margin-bottom--9":"BlogSection-module_margin-bottom--9__xU5rE","blog-section__title":"BlogSection-module_blog-section__title__5-4Oy","blog-section__title-link":"BlogSection-module_blog-section__title-link__Q4R5T","blog-section":"BlogSection-module_blog-section__NTDM4"};
+var styles = {"blog-section":"BlogSection-module_blog-section__NTDM4","blog-section__title":"BlogSection-module_blog-section__title__5-4Oy","blog-section__title--empty":"BlogSection-module_blog-section__title--empty__-di-F","blog-section__title-link":"BlogSection-module_blog-section__title-link__Q4R5T"};
 
 export { styles as default };
 //# sourceMappingURL=BlogSection.module.scss.js.map

package/dist/types/components/BlogSection.d.ts

@@ -5,7 +5,6 @@ interface BlogSectionProperties {
     title?: string;
     category?: string;
     children?: ReactNode;
-    increaseMarginBottom?: boolean;
 }
 declare const BlogSection: import("react").ForwardRefExoticComponent<BlogSectionProperties & import("react").RefAttributes<ForwardedReference>>;
 export default BlogSection;

package/dist/types/components/BlogSection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BlogSection.d.ts","sourceRoot":"","sources":["../../../src/components/BlogSection.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AAC3E,YAAY,EAAE,kBAAkB,EAAE,CAAC;AAMnC,UAAU,qBAAqB;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED,QAAA,MAAM,WAAW,sHAiChB,CAAC;AAIF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"BlogSection.d.ts","sourceRoot":"","sources":["../../../src/components/BlogSection.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AAC3E,YAAY,EAAE,kBAAkB,EAAE,CAAC;AAMnC,UAAU,qBAAqB;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,QAAA,MAAM,WAAW,sHA8BhB,CAAC;AAIF,eAAe,WAAW,CAAC"}

package/dist/types/dynamicComponents/BlogSectionDynamic.d.ts

@@ -4,7 +4,6 @@ interface BlogProperties {
     title?: string;
     category?: string;
     children?: ReactNode;
-    increaseMarginBottom?: boolean;
 }
 declare const BlogSection: import("react").ForwardRefExoticComponent<BlogProperties & RefAttributes<ForwardedReference>>;
 export default BlogSection;

package/dist/types/dynamicComponents/BlogSectionDynamic.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BlogSectionDynamic.d.ts","sourceRoot":"","sources":["../../../src/dynamicComponents/BlogSectionDynamic.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAItD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAGxD,UAAU,cAAc;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED,QAAA,MAAM,WAAW,+FA+EhB,CAAC;AAIF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"BlogSectionDynamic.d.ts","sourceRoot":"","sources":["../../../src/dynamicComponents/BlogSectionDynamic.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAItD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAGxD,UAAU,cAAc;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,QAAA,MAAM,WAAW,+FAmFhB,CAAC;AAIF,eAAe,WAAW,CAAC"}

package/dist/types/staticComponents/BlogSectionStatic.d.ts

@@ -3,8 +3,7 @@ interface BlogSectionStaticProperties {
     title?: string;
     category?: string;
     children?: ReactNode;
-    increaseMarginBottom?: boolean;
 }
-declare const BlogSectionStatic: ({ title, category, children, increaseMarginBottom, }: BlogSectionStaticProperties) => import("react/jsx-runtime").JSX.Element;
+declare const BlogSectionStatic: ({ title, category, children, }: BlogSectionStaticProperties) => import("react/jsx-runtime").JSX.Element;
 export default BlogSectionStatic;
 //# sourceMappingURL=BlogSectionStatic.d.ts.map

package/dist/types/staticComponents/BlogSectionStatic.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BlogSectionStatic.d.ts","sourceRoot":"","sources":["../../../src/staticComponents/BlogSectionStatic.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,UAAU,2BAA2B;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED,QAAA,MAAM,iBAAiB,GAAI,sDAKxB,2BAA2B,4CAqB7B,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"BlogSectionStatic.d.ts","sourceRoot":"","sources":["../../../src/staticComponents/BlogSectionStatic.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,UAAU,2BAA2B;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,QAAA,MAAM,iBAAiB,GAAI,gCAIxB,2BAA2B,4CAY7B,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@san-siva/blogkit",
-	"version": "1.1.21",
+	"version": "1.1.22",
 	"description": "A reusable blog component library for React/Next.js applications with code highlighting, diagrams, and rich content features",
 	"main": "dist/cjs/index.js",
 	"module": "dist/esm/index.js",

package/src/components/BlogSection.tsx

@@ -14,7 +14,6 @@ interface BlogSectionProperties {
 	title?: string;
 	category?: string;
 	children?: ReactNode;
-	increaseMarginBottom?: boolean;
 }
 
 const BlogSection = forwardRef<ForwardedReference, BlogSectionProperties>(
@@ -23,7 +22,6 @@ const BlogSection = forwardRef<ForwardedReference, BlogSectionProperties>(
 			title = '',
 			category = '',
 			children = null,
-			increaseMarginBottom = false,
 		},
 		ref
 	) => {
@@ -33,7 +31,6 @@ const BlogSection = forwardRef<ForwardedReference, BlogSectionProperties>(
 					<BlogSectionStatic
 						title={title}
 						category={category}
-						increaseMarginBottom={increaseMarginBottom}
 					>
 						{children}
 					</BlogSectionStatic>
@@ -43,7 +40,6 @@ const BlogSection = forwardRef<ForwardedReference, BlogSectionProperties>(
 					ref={ref}
 					title={title}
 					category={category}
-					increaseMarginBottom={increaseMarginBottom}
 				>
 					{children}
 				</BlogSectionDynamic>

package/src/dynamicComponents/BlogSectionDynamic.tsx

@@ -21,17 +21,11 @@ interface BlogProperties {
 	title?: string;
 	category?: string;
 	children?: ReactNode;
-	increaseMarginBottom?: boolean;
 }
 
 const BlogSection = forwardRef<ForwardedReference, BlogProperties>(
 	(
-		{
-			title = '',
-			category = '',
-			children = null,
-			increaseMarginBottom = false,
-		}: BlogProperties,
+		{ title = '', category = '', children = null }: BlogProperties,
 		forwardedReference
 	) => {
 		const titleWithCategory = category ? `${category} - ${title}` : title;
@@ -52,7 +46,10 @@ const BlogSection = forwardRef<ForwardedReference, BlogProperties>(
 
 		// Re-register when title or category changes so the TOC reflects the updated heading
 		useEffect(() => {
-			if (typeof forwardedReference === 'function' && imperativeHandleRef.current) {
+			if (
+				typeof forwardedReference === 'function' &&
+				imperativeHandleRef.current
+			) {
 				forwardedReference(imperativeHandleRef.current);
 			}
 		}, [title, category]); // eslint-disable-line react-hooks/exhaustive-deps
@@ -63,37 +60,43 @@ const BlogSection = forwardRef<ForwardedReference, BlogProperties>(
 			if (!subParentReference) return;
 
 			// Avoid registering the same child section twice
-		const alreadyRegistered = childReferences.current.some(
+			const alreadyRegistered = childReferences.current.some(
 				ref => ref.parentRef === subParentReference
 			);
 			if (!alreadyRegistered) {
 				childReferences.current.push(element);
 			}
 
-			if (typeof forwardedReference === 'function' && imperativeHandleRef.current) {
+			if (
+				typeof forwardedReference === 'function' &&
+				imperativeHandleRef.current
+			) {
 				forwardedReference(imperativeHandleRef.current);
 			}
 		};
 
 		return (
 			<div
-				className={`${styles['blog-section']}
-					${
-						increaseMarginBottom
-							? styles['margin-bottom--9']
-							: styles['margin-bottom--6']
-					}`}
+				className={styles['blog-section']}
 				data-title={title}
 				data-id={id}
 				ref={parentReference}
 			>
-				{title ? (
-					<h4 className={styles['blog-section__title']}>
-						<a href={generateSectionHref(id)} className={styles['blog-section__title-link']} onClick={e => e.preventDefault()}>
+				<h3
+					className={`${styles['blog-section__title']} ${title ? '' : styles['blog-section__title--empty']}`}
+				>
+					{title ? (
+						<a
+							href={generateSectionHref(id)}
+							className={styles['blog-section__title-link']}
+							onClick={e => e.preventDefault()}
+						>
 							{title}
 						</a>
-					</h4>
-				) : null}
+					) : (
+						<p>No title</p>
+					)}
+				</h3>
 				{Children.map(children, child => {
 					if (!isValidElement(child)) return child;
 					return cloneElement(child, {

package/src/staticComponents/BlogSectionStatic.tsx

@@ -6,31 +6,20 @@ interface BlogSectionStaticProperties {
 	title?: string;
 	category?: string;
 	children?: ReactNode;
-	increaseMarginBottom?: boolean;
 }
 
 const BlogSectionStatic = ({
 	title = '',
 	category = '',
 	children = null,
-	increaseMarginBottom = false,
 }: BlogSectionStaticProperties) => {
 	const titleWithCategory = category ? `${category} - ${title}` : title;
 	const id = generateIdForBlogTitle(titleWithCategory);
 
 	return (
-		<div
-			className={`${styles['blog-section']}
-				${
-					increaseMarginBottom
-						? styles['margin-bottom--9']
-						: styles['margin-bottom--6']
-				}`}
-			data-title={title}
-			data-id={id}
-		>
+		<div className={styles['blog-section']} data-title={title} data-id={id}>
 			{title ? (
-				<h4 className={styles['blog-section__title']}>{title}</h4>
+				<h3 className={styles['blog-section__title']}>{title}</h3>
 			) : null}
 			{children}
 		</div>

package/src/styles/BlogHeader.module.scss

@@ -1,12 +1,13 @@
 @use '@san-siva/stylekit/styles/index.module.scss' as stylekit;
 
 .blog-header {
-  line-height: stylekit.$line-height--small;
+	line-height: stylekit.$line-height--small;
+	font-weight: stylekit.$font-weight--800;
 }
 
 .blog-date {
-  display: block;
-  margin-bottom: calc(#{stylekit.space(8)} * 2);
-  color: stylekit.$color--dark;
-  font-style: italic;
+	display: block;
+	margin-bottom: calc(#{stylekit.space(8)} * 2);
+	color: stylekit.$color--dark;
+	font-style: italic;
 }

package/src/styles/BlogSection.module.scss

@@ -1,8 +1,18 @@
 @use '@san-siva/stylekit/styles/index.module.scss' as stylekit;
 
 .blog-section {
+	margin-bottom: stylekit.space(9);
+
 	&__title {
+		margin-top: stylekit.space(4);
 		margin-bottom: stylekit.space(2);
+		font-size: stylekit.$font-size--h3;
+		font-weight: stylekit.$font-weight--700;
+
+		&--empty > p {
+			color: transparent;
+			font-size: 0;
+		}
 	}
 
 	&__title-link {
@@ -19,51 +29,23 @@
 		}
 	}
 
-	// Sub-section (depth 1)
 	.blog-section {
-		> .blog-section__title {
-			font-size: stylekit.$font-size--h6;
-			margin-bottom: stylekit.space(2);
-		}
+		margin-bottom: stylekit.space(6);
 
-		> *:first-child {
-			margin-top: stylekit.space(4);
+		> .blog-section__title {
+			margin-top: stylekit.space(6);
+			font-weight: stylekit.$font-weight--600;
+			font-size: stylekit.$font-size--h5;
 		}
 
-		&:not(:last-child) {
+		.blog-section {
 			margin-bottom: stylekit.space(4);
-		}
 
-		&:last-child {
-			margin-bottom: stylekit.space(8);
-		}
-
-		// Sub-sub-section (depth 2)
-		.blog-section {
 			> .blog-section__title {
-				font-size: stylekit.$font-size--p;
-				margin-bottom: stylekit.space(1);
-			}
-
-			> *:first-child {
-				margin-top: stylekit.space(2);
-			}
-
-			&:not(:last-child) {
-				margin-bottom: stylekit.space(2);
-			}
-
-			&:last-child {
-				margin-bottom: stylekit.space(4);
+				margin-top: stylekit.space(4);
+				font-weight: stylekit.$font-weight--500;
+				font-size: stylekit.$font-size--h6;
 			}
 		}
 	}
 }
-
-.margin-bottom--6 {
-	margin-bottom: stylekit.space(6);
-}
-
-.margin-bottom--9 {
-	margin-bottom: stylekit.space(9);
-}

package/src/styles/BlogSection.module.scss.d.ts

@@ -1,9 +1,8 @@
 declare const styles: {
   readonly 'blog-section': string;
   readonly 'blog-section__title': string;
+  readonly 'blog-section__title--empty': string;
   readonly 'blog-section__title-link': string;
-  readonly 'margin-bottom--6': string;
-  readonly 'margin-bottom--9': string;
 };
 
 export default styles;