@san-siva/blogkit 1.1.8 → 1.1.10

package/dist/esm/staticComponents/TableStatic.js

@@ -1,13 +1,13 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import styles from '../styles/Table.module.scss.js';
 
-const Table = ({ rows = [], headers = [], hasMarginUp = false, hasMarginDown = false, }) => {
+const Table = ({ rows = [], headers = [], hasMarginUp = false, hasMarginDown = false, fontSize, }) => {
     const columnCount = headers.length;
     return (jsxs("div", { className: `${styles.table}
 				${hasMarginUp ? styles['margin-top--1'] : ''}
 				${hasMarginDown ? styles['margin-bottom--2'] : ''}`, style: {
-            gridTemplateColumns: `repeat(${columnCount}, 1fr)`,
-        }, children: [jsx("div", { className: `${styles['table__header']}`, children: headers.map((header, index) => (jsx("div", { className: `${styles['table__header__cell']}`, children: header }, typeof header === 'string' ? header : index))) }), rows.map((row, index) => (jsx("div", { className: `${styles['table__row']}`, children: row.map((cell, cellIndex) => (jsx("div", { className: `${styles['table__row__cell']}`, children: cell }, typeof cell === 'string' ? cell : cellIndex))) }, index)))] }));
+            gridTemplateColumns: `repeat(${columnCount}, auto)`,
+        }, children: [jsx("div", { className: `${styles['table__header']}`, children: headers.map((header, index) => (jsx("div", { className: `${styles['table__header__cell']}`, style: fontSize ? { fontSize } : undefined, children: header }, typeof header === 'string' ? header : index))) }), rows.map((row, index) => (jsx("div", { className: `${styles['table__row']}`, children: row.map((cell, cellIndex) => (jsx("div", { className: `${styles['table__row__cell']}`, style: fontSize ? { fontSize } : undefined, children: cell }, typeof cell === 'string' ? cell : cellIndex))) }, index)))] }));
 };
 
 export { Table as default };

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

@@ -1 +1 @@
-{"version":3,"file":"TableStatic.js","sources":["../../../src/staticComponents/TableStatic.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport styles from '../styles/Table.module.scss';\n\ninterface TableProperties {\n\trows?: ReactNode[][];\n\theaders?: ReactNode[];\n\thasMarginUp?: boolean;\n\thasMarginDown?: boolean;\n}\n\nconst Table = ({\n\trows = [],\n\theaders = [],\n\thasMarginUp = false,\n\thasMarginDown = false,\n}: TableProperties) => {\n\tconst columnCount = headers.length;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={`${styles.table}\n\t\t\t\t${hasMarginUp ? styles['margin-top--1'] : ''}\n\t\t\t\t${hasMarginDown ? styles['margin-bottom--2'] : ''}`}\n\t\t\tstyle={{\n\t\t\t\tgridTemplateColumns: `repeat(${columnCount}, 1fr)`,\n\t\t\t}}\n\t\t>\n\t\t\t<div className={`${styles['table__header']}`}>\n\t\t\t\t{headers.map((header, index) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tkey={typeof header === 'string' ? header : index}\n\t\t\t\t\t\tclassName={`${styles['table__header__cell']}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t{header}\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t\t{rows.map((row, index) => (\n\t\t\t\t<div key={index} className={`${styles['table__row']}`}>\n\t\t\t\t\t{row.map((cell, cellIndex) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={typeof cell === 'string' ? cell : cellIndex}\n\t\t\t\t\t\t\tclassName={`${styles['table__row__cell']}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{cell}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</div>\n\t);\n};\n\nexport default Table;\n"],"names":["_jsxs","_jsx"],"mappings":";;;AAUA,MAAM,KAAK,GAAG,CAAC,EACd,IAAI,GAAG,EAAE,EACT,OAAO,GAAG,EAAE,EACZ,WAAW,GAAG,KAAK,EACnB,aAAa,GAAG,KAAK,GACJ,KAAI;AACrB,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM;AAElC,IAAA,QACCA,IAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,KAAK;MACvB,WAAW,GAAG,MAAM,CAAC,eAAe,CAAC,GAAG,EAAE;AAC1C,IAAA,EAAA,aAAa,GAAG,MAAM,CAAC,kBAAkB,CAAC,GAAG,EAAE,CAAA,CAAE,EACpD,KAAK,EAAE;YACN,mBAAmB,EAAE,CAAA,OAAA,EAAU,WAAW,CAAA,MAAA,CAAQ;SAClD,EAAA,QAAA,EAAA,CAEDC,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,eAAe,CAAC,CAAA,CAAE,EAAA,QAAA,EAC1C,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,MAC1BA,GAAA,CAAA,KAAA,EAAA,EAEC,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,qBAAqB,CAAC,CAAA,CAAE,EAAA,QAAA,EAE5C,MAAM,EAAA,EAHF,OAAO,MAAM,KAAK,QAAQ,GAAG,MAAM,GAAG,KAAK,CAI3C,CACN,CAAC,EAAA,CACG,EACL,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,MACpBA,GAAA,CAAA,KAAA,EAAA,EAAiB,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,YAAY,CAAC,CAAA,CAAE,EAAA,QAAA,EACnD,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,MACxBA,GAAA,CAAA,KAAA,EAAA,EAEC,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,kBAAkB,CAAC,CAAA,CAAE,EAAA,QAAA,EAEzC,IAAI,EAAA,EAHA,OAAO,IAAI,KAAK,QAAQ,GAAG,IAAI,GAAG,SAAS,CAI3C,CACN,CAAC,EAAA,EARO,KAAK,CAST,CACN,CAAC,CAAA,EAAA,CACG;AAER;;;;"}
+{"version":3,"file":"TableStatic.js","sources":["../../../src/staticComponents/TableStatic.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport styles from '../styles/Table.module.scss';\n\ninterface TableProperties {\n\trows?: ReactNode[][];\n\theaders?: ReactNode[];\n\thasMarginUp?: boolean;\n\thasMarginDown?: boolean;\n\tfontSize?: string;\n}\n\nconst Table = ({\n\trows = [],\n\theaders = [],\n\thasMarginUp = false,\n\thasMarginDown = false,\n\tfontSize,\n}: TableProperties) => {\n\tconst columnCount = headers.length;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={`${styles.table}\n\t\t\t\t${hasMarginUp ? styles['margin-top--1'] : ''}\n\t\t\t\t${hasMarginDown ? styles['margin-bottom--2'] : ''}`}\n\t\t\tstyle={{\n\t\t\t\tgridTemplateColumns: `repeat(${columnCount}, auto)`,\n\t\t\t}}\n\t\t>\n\t\t\t<div className={`${styles['table__header']}`}>\n\t\t\t\t{headers.map((header, index) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tkey={typeof header === 'string' ? header : index}\n\t\t\t\t\t\tclassName={`${styles['table__header__cell']}`}\n\t\t\t\t\t\tstyle={fontSize ? { fontSize } : undefined}\n\t\t\t\t\t>\n\t\t\t\t\t\t{header}\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t\t{rows.map((row, index) => (\n\t\t\t\t<div key={index} className={`${styles['table__row']}`}>\n\t\t\t\t\t{row.map((cell, cellIndex) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={typeof cell === 'string' ? cell : cellIndex}\n\t\t\t\t\t\t\tclassName={`${styles['table__row__cell']}`}\n\t\t\t\t\t\t\tstyle={fontSize ? { fontSize } : undefined}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{cell}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</div>\n\t);\n};\n\nexport default Table;\n"],"names":["_jsxs","_jsx"],"mappings":";;;AAWA,MAAM,KAAK,GAAG,CAAC,EACd,IAAI,GAAG,EAAE,EACT,OAAO,GAAG,EAAE,EACZ,WAAW,GAAG,KAAK,EACnB,aAAa,GAAG,KAAK,EACrB,QAAQ,GACS,KAAI;AACrB,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM;AAElC,IAAA,QACCA,IAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,KAAK;MACvB,WAAW,GAAG,MAAM,CAAC,eAAe,CAAC,GAAG,EAAE;AAC1C,IAAA,EAAA,aAAa,GAAG,MAAM,CAAC,kBAAkB,CAAC,GAAG,EAAE,CAAA,CAAE,EACpD,KAAK,EAAE;YACN,mBAAmB,EAAE,CAAA,OAAA,EAAU,WAAW,CAAA,OAAA,CAAS;AACnD,SAAA,EAAA,QAAA,EAAA,CAEDC,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,eAAe,CAAC,CAAA,CAAE,EAAA,QAAA,EAC1C,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,MAC1BA,aAEC,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,qBAAqB,CAAC,CAAA,CAAE,EAC7C,KAAK,EAAE,QAAQ,GAAG,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAA,QAAA,EAEzC,MAAM,EAAA,EAJF,OAAO,MAAM,KAAK,QAAQ,GAAG,MAAM,GAAG,KAAK,CAK3C,CACN,CAAC,EAAA,CACG,EACL,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,MACpBA,GAAA,CAAA,KAAA,EAAA,EAAiB,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,YAAY,CAAC,CAAA,CAAE,EAAA,QAAA,EACnD,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,MACxBA,GAAA,CAAA,KAAA,EAAA,EAEC,SAAS,EAAE,CAAA,EAAG,MAAM,CAAC,kBAAkB,CAAC,CAAA,CAAE,EAC1C,KAAK,EAAE,QAAQ,GAAG,EAAE,QAAQ,EAAE,GAAG,SAAS,YAEzC,IAAI,EAAA,EAJA,OAAO,IAAI,KAAK,QAAQ,GAAG,IAAI,GAAG,SAAS,CAK3C,CACN,CAAC,EAAA,EATO,KAAK,CAUT,CACN,CAAC,CAAA,EAAA,CACG;AAER;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@san-siva/blogkit",
-	"version": "1.1.8",
+	"version": "1.1.10",
 	"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/Table.tsx

@@ -6,6 +6,7 @@ interface TableProperties {
 	headers?: ReactNode[];
 	hasMarginUp?: boolean;
 	hasMarginDown?: boolean;
+	fontSize?: string;
 }
 
 const Table = ({
@@ -13,6 +14,7 @@ const Table = ({
 	headers = [],
 	hasMarginUp = false,
 	hasMarginDown = false,
+	fontSize,
 }: TableProperties) => {
 	return (
 		<TableStatic
@@ -20,6 +22,7 @@ const Table = ({
 			headers={headers}
 			hasMarginUp={hasMarginUp}
 			hasMarginDown={hasMarginDown}
+			fontSize={fontSize}
 		/>
 	);
 };

package/src/staticComponents/TableStatic.tsx

@@ -6,6 +6,7 @@ interface TableProperties {
 	headers?: ReactNode[];
 	hasMarginUp?: boolean;
 	hasMarginDown?: boolean;
+	fontSize?: string;
 }
 
 const Table = ({
@@ -13,6 +14,7 @@ const Table = ({
 	headers = [],
 	hasMarginUp = false,
 	hasMarginDown = false,
+	fontSize,
 }: TableProperties) => {
 	const columnCount = headers.length;
 
@@ -22,7 +24,7 @@ const Table = ({
 				${hasMarginUp ? styles['margin-top--1'] : ''}
 				${hasMarginDown ? styles['margin-bottom--2'] : ''}`}
 			style={{
-				gridTemplateColumns: `repeat(${columnCount}, 1fr)`,
+				gridTemplateColumns: `repeat(${columnCount}, auto)`,
 			}}
 		>
 			<div className={`${styles['table__header']}`}>
@@ -30,6 +32,7 @@ const Table = ({
 					<div
 						key={typeof header === 'string' ? header : index}
 						className={`${styles['table__header__cell']}`}
+						style={fontSize ? { fontSize } : undefined}
 					>
 						{header}
 					</div>
@@ -41,6 +44,7 @@ const Table = ({
 						<div
 							key={typeof cell === 'string' ? cell : cellIndex}
 							className={`${styles['table__row__cell']}`}
+							style={fontSize ? { fontSize } : undefined}
 						>
 							{cell}
 						</div>

package/src/styles/Blog.module.scss

@@ -17,6 +17,7 @@
 		top: var(--topbar-height);
 		padding: styles.space(6);
     padding-top: styles.rem(66);
+    padding-right: 0;
 		border-radius: styles.$border-radius--1;
 
 		> .category__title {

package/src/styles/Table.module.scss

@@ -2,7 +2,7 @@
 
 @mixin cell-base {
 	padding: styles.rem(12) styles.rem(16);
-	font-size: styles.$font-size--small;
+	font-size: styles.$font-size--p-small;
 	font-family: styles.$font-family--code;
 	word-wrap: break-word;
 	overflow-wrap: break-word;
@@ -13,7 +13,8 @@
 }
 
 .table {
-	width: 100%;
+	width: max-content;
+  margin-right: auto;
 	overflow: hidden;
 	overflow-x: auto;
 	display: grid;
@@ -32,7 +33,7 @@
 		}
 
     &__cell * {
-      font-size: styles.$font-size--small;
+      font-size: inherit;
     }
 	}
 
@@ -45,7 +46,7 @@
 		}
 
     &__cell * {
-      font-size: styles.$font-size--small;
+      font-size: inherit;
     }
 	}
 }