@haroonwaves/blog-kit-react 1.1.2 → 1.2.0

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 (7) hide show
  1. package/README.md +4 -4
  2. package/dist/index.cjs +12 -7
  3. package/dist/index.d.cts +1 -1
  4. package/dist/index.d.ts +1 -1
  5. package/dist/index.js +12 -7
  6. package/dist/style.css +2 -2
  7. package/package.json +2 -1
package/README.md CHANGED
@@ -18,13 +18,13 @@ yarn add @haroonwaves/blog-kit-react
18
18
  ## Documentation
19
19
 
20
20
  For complete documentation, API reference, and examples, please visit the
21
- [main documentation](https://blog-kit.pages.dev).
21
+ [main documentation](https://blog-kit.haroonwaves.com).
22
22
 
23
23
  ## Quick Links
24
24
 
25
- - [Quick Start](https://blog-kit.pages.dev/docs/quick-start)
26
- - [React Package Usage](https://blog-kit.pages.dev/docs/react-package)
27
- - [API Reference](https://blog-kit.pages.dev/docs/api-reference)
25
+ - [Quick Start](https://blog-kit.haroonwaves.com/docs/quick-start)
26
+ - [React Package Usage](https://blog-kit.haroonwaves.com/docs/react-package)
27
+ - [API Reference](https://blog-kit.haroonwaves.com/docs/api-reference)
28
28
 
29
29
  ## Related Packages
30
30
 
package/dist/index.cjs CHANGED
@@ -44,6 +44,7 @@ var import_react_markdown = __toESM(require("react-markdown"), 1);
44
44
  var import_remark_gfm = __toESM(require("remark-gfm"), 1);
45
45
  var import_rehype_prism_plus = __toESM(require("rehype-prism-plus"), 1);
46
46
  var import_rehype_raw = __toESM(require("rehype-raw"), 1);
47
+ var import_rehype_slug_custom_id = __toESM(require("rehype-slug-custom-id"), 1);
47
48
 
48
49
  // src/components/Badge.tsx
49
50
  var import_jsx_runtime = require("react/jsx-runtime");
@@ -173,7 +174,7 @@ function BlogRenderer({
173
174
  const mergedComponents = { ...defaultComponents, ...components };
174
175
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
175
176
  (showCategory || showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-3 mb-4", children: [
176
- showCategory && metadata.category && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Badge, { children: metadata.category }),
177
+ showCategory && metadata.categories?.length ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex items-center gap-1.5 flex-wrap", children: metadata.categories.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Badge, { children: cat }, cat)) }) : null,
177
178
  (showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400", children: [
178
179
  showReadingTime && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: metadata.readingTime }),
179
180
  showReadingTime && showDate && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: "\u2022" }),
@@ -188,7 +189,7 @@ function BlogRenderer({
188
189
  import_react_markdown.default,
189
190
  {
190
191
  remarkPlugins: [import_remark_gfm.default],
191
- rehypePlugins: [import_rehype_raw.default, import_rehype_prism_plus.default],
192
+ rehypePlugins: [import_rehype_raw.default, import_rehype_prism_plus.default, import_rehype_slug_custom_id.default],
192
193
  components: mergedComponents,
193
194
  children: content
194
195
  }
@@ -217,7 +218,7 @@ function BlogCard({
217
218
  className: `rounded-lg border border-gray-200 dark:border-gray-700 hover:border-gray-300 dark:hover:border-gray-600 bg-white dark:bg-gray-800 p-6 transition-colors ${className}`,
218
219
  children: [
219
220
  (showCategory || showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "flex items-center justify-between mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center gap-3", children: [
220
- showCategory && metadata.category && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Badge, { children: metadata.category }),
221
+ showCategory && metadata.categories?.length ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "flex items-center gap-1.5 flex-wrap", children: metadata.categories.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Badge, { children: cat }, cat)) }) : null,
221
222
  (showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400", children: [
222
223
  showReadingTime && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: metadata.readingTime }),
223
224
  showReadingTime && showDate && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: "\u2022" }),
@@ -290,6 +291,9 @@ function useBlogs(blogsMeta) {
290
291
  const [filteredBlogs, setFilteredBlogs] = (0, import_react3.useState)(blogsMeta);
291
292
  const [searchTerm, setSearchTerm] = (0, import_react3.useState)("");
292
293
  const [selectedCategory, setSelectedCategory] = (0, import_react3.useState)(null);
294
+ const getBlogCategories = (blog) => {
295
+ return blog.categories ?? [];
296
+ };
293
297
  (0, import_react3.useEffect)(() => {
294
298
  let filtered = blogsMeta;
295
299
  if (searchTerm) {
@@ -298,13 +302,14 @@ function useBlogs(blogsMeta) {
298
302
  );
299
303
  }
300
304
  if (selectedCategory) {
301
- filtered = filtered.filter((blog) => blog.category === selectedCategory);
305
+ filtered = filtered.filter((blog) => {
306
+ const blogCategories = getBlogCategories(blog);
307
+ return blogCategories.includes(selectedCategory);
308
+ });
302
309
  }
303
310
  setFilteredBlogs(filtered);
304
311
  }, [blogsMeta, searchTerm, selectedCategory]);
305
- const categories = Array.from(
306
- new Set(blogsMeta.map((blog) => blog.category).filter(Boolean))
307
- );
312
+ const categories = Array.from(new Set(blogsMeta.flatMap((blog) => getBlogCategories(blog))));
308
313
  return {
309
314
  metadata: filteredBlogs,
310
315
  searchTerm,
package/dist/index.d.cts CHANGED
@@ -6,7 +6,7 @@ interface BlogMeta {
6
6
  title: string;
7
7
  description: string;
8
8
  date: string;
9
- category?: string;
9
+ categories?: string[];
10
10
  slug: string;
11
11
  readingTime: string;
12
12
  }
package/dist/index.d.ts CHANGED
@@ -6,7 +6,7 @@ interface BlogMeta {
6
6
  title: string;
7
7
  description: string;
8
8
  date: string;
9
- category?: string;
9
+ categories?: string[];
10
10
  slug: string;
11
11
  readingTime: string;
12
12
  }
package/dist/index.js CHANGED
@@ -4,6 +4,7 @@ import ReactMarkdown from "react-markdown";
4
4
  import remarkGfm from "remark-gfm";
5
5
  import rehypePrismPlus from "rehype-prism-plus";
6
6
  import rehypeRaw from "rehype-raw";
7
+ import rehypeSlugCustomId from "rehype-slug-custom-id";
7
8
 
8
9
  // src/components/Badge.tsx
9
10
  import { jsx } from "react/jsx-runtime";
@@ -133,7 +134,7 @@ function BlogRenderer({
133
134
  const mergedComponents = { ...defaultComponents, ...components };
134
135
  return /* @__PURE__ */ jsxs(Fragment, { children: [
135
136
  (showCategory || showReadingTime || showDate) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 mb-4", children: [
136
- showCategory && metadata.category && /* @__PURE__ */ jsx2(Badge, { children: metadata.category }),
137
+ showCategory && metadata.categories?.length ? /* @__PURE__ */ jsx2("div", { className: "flex items-center gap-1.5 flex-wrap", children: metadata.categories.map((cat) => /* @__PURE__ */ jsx2(Badge, { children: cat }, cat)) }) : null,
137
138
  (showReadingTime || showDate) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400", children: [
138
139
  showReadingTime && /* @__PURE__ */ jsx2("span", { children: metadata.readingTime }),
139
140
  showReadingTime && showDate && /* @__PURE__ */ jsx2("span", { children: "\u2022" }),
@@ -148,7 +149,7 @@ function BlogRenderer({
148
149
  ReactMarkdown,
149
150
  {
150
151
  remarkPlugins: [remarkGfm],
151
- rehypePlugins: [rehypeRaw, rehypePrismPlus],
152
+ rehypePlugins: [rehypeRaw, rehypePrismPlus, rehypeSlugCustomId],
152
153
  components: mergedComponents,
153
154
  children: content
154
155
  }
@@ -177,7 +178,7 @@ function BlogCard({
177
178
  className: `rounded-lg border border-gray-200 dark:border-gray-700 hover:border-gray-300 dark:hover:border-gray-600 bg-white dark:bg-gray-800 p-6 transition-colors ${className}`,
178
179
  children: [
179
180
  (showCategory || showReadingTime || showDate) && /* @__PURE__ */ jsx3("div", { className: "flex items-center justify-between mb-3", children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-3", children: [
180
- showCategory && metadata.category && /* @__PURE__ */ jsx3(Badge, { children: metadata.category }),
181
+ showCategory && metadata.categories?.length ? /* @__PURE__ */ jsx3("div", { className: "flex items-center gap-1.5 flex-wrap", children: metadata.categories.map((cat) => /* @__PURE__ */ jsx3(Badge, { children: cat }, cat)) }) : null,
181
182
  (showReadingTime || showDate) && /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400", children: [
182
183
  showReadingTime && /* @__PURE__ */ jsx3("span", { children: metadata.readingTime }),
183
184
  showReadingTime && showDate && /* @__PURE__ */ jsx3("span", { children: "\u2022" }),
@@ -250,6 +251,9 @@ function useBlogs(blogsMeta) {
250
251
  const [filteredBlogs, setFilteredBlogs] = useState(blogsMeta);
251
252
  const [searchTerm, setSearchTerm] = useState("");
252
253
  const [selectedCategory, setSelectedCategory] = useState(null);
254
+ const getBlogCategories = (blog) => {
255
+ return blog.categories ?? [];
256
+ };
253
257
  useEffect(() => {
254
258
  let filtered = blogsMeta;
255
259
  if (searchTerm) {
@@ -258,13 +262,14 @@ function useBlogs(blogsMeta) {
258
262
  );
259
263
  }
260
264
  if (selectedCategory) {
261
- filtered = filtered.filter((blog) => blog.category === selectedCategory);
265
+ filtered = filtered.filter((blog) => {
266
+ const blogCategories = getBlogCategories(blog);
267
+ return blogCategories.includes(selectedCategory);
268
+ });
262
269
  }
263
270
  setFilteredBlogs(filtered);
264
271
  }, [blogsMeta, searchTerm, selectedCategory]);
265
- const categories = Array.from(
266
- new Set(blogsMeta.map((blog) => blog.category).filter(Boolean))
267
- );
272
+ const categories = Array.from(new Set(blogsMeta.flatMap((blog) => getBlogCategories(blog))));
268
273
  return {
269
274
  metadata: filteredBlogs,
270
275
  searchTerm,
package/dist/style.css CHANGED
@@ -1,2 +1,2 @@
1
- /*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
2
- @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-orange-100:oklch(95.4% .038 75.164);--color-orange-300:oklch(83.7% .128 66.29);--color-orange-500:oklch(70.5% .213 47.604);--color-orange-900:oklch(40.8% .123 38.172);--color-blue-300:oklch(80.9% .105 251.813);--color-blue-400:oklch(70.7% .165 254.624);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-800:oklch(42.4% .199 265.638);--color-rose-400:oklch(71.2% .194 13.428);--color-rose-600:oklch(58.6% .253 17.585);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-neutral-900:oklch(20.5% 0 0);--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height:calc(1.5/1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25/1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5/2.25);--font-weight-medium:500;--font-weight-semibold:600;--tracking-tight:-.025em;--tracking-wide:.025em;--radius-lg:.5rem;--radius-xl:.75rem;--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.my-6{margin-block:calc(var(--spacing)*6)}.my-9{margin-block:calc(var(--spacing)*9)}.mt-4{margin-top:calc(var(--spacing)*4)}.mt-5{margin-top:calc(var(--spacing)*5)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-8{margin-top:calc(var(--spacing)*8)}.mt-10{margin-top:calc(var(--spacing)*10)}.mr-2{margin-right:calc(var(--spacing)*2)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-5{margin-bottom:calc(var(--spacing)*5)}.ml-6{margin-left:calc(var(--spacing)*6)}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.h-4{height:calc(var(--spacing)*4)}.h-6{height:calc(var(--spacing)*6)}.h-auto{height:auto}.w-3\/4{width:75%}.w-full{width:100%}.max-w-full{max-width:100%}.max-w-none{max-width:none}.animate-pulse{animation:var(--animate-pulse)}.list-decimal{list-style-type:decimal}.list-disc{list-style-type:disc}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*6)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*6)*calc(1 - var(--tw-space-y-reverse)))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-4{border-left-style:var(--tw-border-style);border-left-width:4px}.border-blue-500{border-color:var(--color-blue-500)}.border-gray-200{border-color:var(--color-gray-200)}.border-transparent{border-color:#0000}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-orange-100{background-color:var(--color-orange-100)}.bg-white{background-color:var(--color-white)}.p-6{padding:calc(var(--spacing)*6)}.px-1\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2\.5{padding-inline:calc(var(--spacing)*2.5)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-0\.5{padding-block:calc(var(--spacing)*.5)}.py-3{padding-block:calc(var(--spacing)*3)}.py-12{padding-block:calc(var(--spacing)*12)}.pl-4{padding-left:calc(var(--spacing)*4)}.text-center{text-align:center}.text-left{text-align:left}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-6{--tw-leading:calc(var(--spacing)*6);line-height:calc(var(--spacing)*6)}.leading-7{--tw-leading:calc(var(--spacing)*7);line-height:calc(var(--spacing)*7)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-blue-600{color:var(--color-blue-600)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-orange-500{color:var(--color-orange-500)}.text-rose-600{color:var(--color-rose-600)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.underline{text-decoration-line:underline}.underline-offset-4{text-underline-offset:4px}.accent-blue-600{accent-color:var(--color-blue-600)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.first\:mt-0:first-child{margin-top:calc(var(--spacing)*0)}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:border-gray-300:hover{border-color:var(--color-gray-300)}.hover\:text-blue-700:hover{color:var(--color-blue-700)}.hover\:text-blue-800:hover{color:var(--color-blue-800)}.hover\:underline:hover{text-decoration-line:underline}}@media (min-width:48rem){.md\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.md\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.md\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}}.dark\:border-gray-700:is(html.dark *){border-color:var(--color-gray-700)}.dark\:border-neutral-900:is(html.dark *){border-color:var(--color-neutral-900)}.dark\:bg-gray-700:is(html.dark *){background-color:var(--color-gray-700)}.dark\:bg-gray-800:is(html.dark *){background-color:var(--color-gray-800)}.dark\:bg-orange-900\/30:is(html.dark *){background-color:#7e2a0c4d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-orange-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-orange-900)30%,transparent)}}.dark\:text-blue-400:is(html.dark *){color:var(--color-blue-400)}.dark\:text-gray-100:is(html.dark *){color:var(--color-gray-100)}.dark\:text-gray-200:is(html.dark *){color:var(--color-gray-200)}.dark\:text-gray-300:is(html.dark *){color:var(--color-gray-300)}.dark\:text-gray-400:is(html.dark *){color:var(--color-gray-400)}.dark\:text-orange-300:is(html.dark *){color:var(--color-orange-300)}.dark\:text-rose-400:is(html.dark *){color:var(--color-rose-400)}@media (hover:hover){.dark\:hover\:border-gray-600:is(html.dark *):hover{border-color:var(--color-gray-600)}.dark\:hover\:text-blue-300:is(html.dark *):hover{color:var(--color-blue-300)}}.\[\&\>code\]\:block>code{display:block}.\[\&\>code\]\:p-4>code{padding:calc(var(--spacing)*4)}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@keyframes pulse{50%{opacity:.5}}
1
+ /*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
2
+ @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-orange-100:oklch(95.4% .038 75.164);--color-orange-300:oklch(83.7% .128 66.29);--color-orange-500:oklch(70.5% .213 47.604);--color-orange-900:oklch(40.8% .123 38.172);--color-blue-300:oklch(80.9% .105 251.813);--color-blue-400:oklch(70.7% .165 254.624);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-800:oklch(42.4% .199 265.638);--color-rose-400:oklch(71.2% .194 13.428);--color-rose-600:oklch(58.6% .253 17.585);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-neutral-900:oklch(20.5% 0 0);--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height:calc(1.5/1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25/1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5/2.25);--font-weight-medium:500;--font-weight-semibold:600;--tracking-tight:-.025em;--tracking-wide:.025em;--radius-lg:.5rem;--radius-xl:.75rem;--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.my-6{margin-block:calc(var(--spacing)*6)}.my-9{margin-block:calc(var(--spacing)*9)}.mt-4{margin-top:calc(var(--spacing)*4)}.mt-5{margin-top:calc(var(--spacing)*5)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-8{margin-top:calc(var(--spacing)*8)}.mt-10{margin-top:calc(var(--spacing)*10)}.mr-2{margin-right:calc(var(--spacing)*2)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-5{margin-bottom:calc(var(--spacing)*5)}.ml-6{margin-left:calc(var(--spacing)*6)}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.h-4{height:calc(var(--spacing)*4)}.h-6{height:calc(var(--spacing)*6)}.h-auto{height:auto}.w-3\/4{width:75%}.w-full{width:100%}.max-w-full{max-width:100%}.max-w-none{max-width:none}.animate-pulse{animation:var(--animate-pulse)}.list-decimal{list-style-type:decimal}.list-disc{list-style-type:disc}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*6)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*6)*calc(1 - var(--tw-space-y-reverse)))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-4{border-left-style:var(--tw-border-style);border-left-width:4px}.border-blue-500{border-color:var(--color-blue-500)}.border-gray-200{border-color:var(--color-gray-200)}.border-transparent{border-color:#0000}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-orange-100{background-color:var(--color-orange-100)}.bg-white{background-color:var(--color-white)}.p-6{padding:calc(var(--spacing)*6)}.px-1\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2\.5{padding-inline:calc(var(--spacing)*2.5)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-0\.5{padding-block:calc(var(--spacing)*.5)}.py-3{padding-block:calc(var(--spacing)*3)}.py-12{padding-block:calc(var(--spacing)*12)}.pl-4{padding-left:calc(var(--spacing)*4)}.text-center{text-align:center}.text-left{text-align:left}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-6{--tw-leading:calc(var(--spacing)*6);line-height:calc(var(--spacing)*6)}.leading-7{--tw-leading:calc(var(--spacing)*7);line-height:calc(var(--spacing)*7)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-blue-600{color:var(--color-blue-600)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-orange-500{color:var(--color-orange-500)}.text-rose-600{color:var(--color-rose-600)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.underline{text-decoration-line:underline}.underline-offset-4{text-underline-offset:4px}.accent-blue-600{accent-color:var(--color-blue-600)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.first\:mt-0:first-child{margin-top:calc(var(--spacing)*0)}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:border-gray-300:hover{border-color:var(--color-gray-300)}.hover\:text-blue-700:hover{color:var(--color-blue-700)}.hover\:text-blue-800:hover{color:var(--color-blue-800)}.hover\:underline:hover{text-decoration-line:underline}}@media (min-width:48rem){.md\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.md\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.md\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}}.dark\:border-gray-700:is(html.dark *){border-color:var(--color-gray-700)}.dark\:border-neutral-900:is(html.dark *){border-color:var(--color-neutral-900)}.dark\:bg-gray-700:is(html.dark *){background-color:var(--color-gray-700)}.dark\:bg-gray-800:is(html.dark *){background-color:var(--color-gray-800)}.dark\:bg-orange-900\/30:is(html.dark *){background-color:#7e2a0c4d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-orange-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-orange-900)30%,transparent)}}.dark\:text-blue-400:is(html.dark *){color:var(--color-blue-400)}.dark\:text-gray-100:is(html.dark *){color:var(--color-gray-100)}.dark\:text-gray-200:is(html.dark *){color:var(--color-gray-200)}.dark\:text-gray-300:is(html.dark *){color:var(--color-gray-300)}.dark\:text-gray-400:is(html.dark *){color:var(--color-gray-400)}.dark\:text-orange-300:is(html.dark *){color:var(--color-orange-300)}.dark\:text-rose-400:is(html.dark *){color:var(--color-rose-400)}@media (hover:hover){.dark\:hover\:border-gray-600:is(html.dark *):hover{border-color:var(--color-gray-600)}.dark\:hover\:text-blue-300:is(html.dark *):hover{color:var(--color-blue-300)}}.\[\&\>code\]\:block>code{display:block}.\[\&\>code\]\:p-4>code{padding:calc(var(--spacing)*4)}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@keyframes pulse{50%{opacity:.5}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@haroonwaves/blog-kit-react",
3
- "version": "1.1.2",
3
+ "version": "1.2.0",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",
@@ -29,6 +29,7 @@
29
29
  "react-markdown": "^10.1.0",
30
30
  "rehype-prism-plus": "^2.0.1",
31
31
  "rehype-raw": "^7.0.0",
32
+ "rehype-slug-custom-id": "^2.0.0",
32
33
  "remark-gfm": "^4.0.1"
33
34
  },
34
35
  "devDependencies": {