@haroonwaves/blog-kit-react 1.0.7 → 1.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -13,20 +13,18 @@ pnpm add @haroonwaves/blog-kit-react
13
13
  yarn add @haroonwaves/blog-kit-react
14
14
  ```
15
15
 
16
- **Note:** This package requires React 18+ as a peer dependency.
16
+ **Note:** This package requires React 19+ as a peer dependency.
17
17
 
18
18
  ## Documentation
19
19
 
20
20
  For complete documentation, API reference, and examples, please visit the
21
- [main documentation](https://github.com/haroonwaves/blog-kit).
21
+ [main documentation](https://blog-kit.pages.dev).
22
22
 
23
23
  ## Quick Links
24
24
 
25
- - [React Package Usage](https://github.com/haroonwaves/blog-kit#react-package)
26
- - [Components Reference](https://github.com/haroonwaves/blog-kit#react-package)
27
- - [useBlogs Hook](https://github.com/haroonwaves/blog-kit#useblogs-hook)
28
- - [Complete Example](https://github.com/haroonwaves/blog-kit#complete-example)
29
- - [Next.js Integration](https://github.com/haroonwaves/blog-kit#nextjs-integration)
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)
30
28
 
31
29
  ## Related Packages
32
30
 
package/dist/index.cjs CHANGED
@@ -39,6 +39,7 @@ __export(src_exports, {
39
39
  module.exports = __toCommonJS(src_exports);
40
40
 
41
41
  // src/components/BlogRenderer.tsx
42
+ var import_react = require("react");
42
43
  var import_react_markdown = __toESM(require("react-markdown"), 1);
43
44
  var import_remark_gfm = __toESM(require("remark-gfm"), 1);
44
45
  var import_rehype_prism_plus = __toESM(require("rehype-prism-plus"), 1);
@@ -58,14 +59,34 @@ function Badge({ children, className }) {
58
59
 
59
60
  // src/components/BlogRenderer.tsx
60
61
  var import_jsx_runtime2 = require("react/jsx-runtime");
61
- function BlogRenderer({ content, metadata, className = "", components }) {
62
+ function BlogRenderer({
63
+ content,
64
+ metadata,
65
+ className = "",
66
+ components,
67
+ showCategory = true,
68
+ showReadingTime = true,
69
+ showDate = true
70
+ }) {
62
71
  const defaultComponents = {
63
- h1: ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h1", { className: "text-4xl font-bold mb-4 mt-8 text-gray-800 dark:text-gray-100", ...props }),
64
- h2: ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h2", { className: "text-3xl font-bold mb-3 mt-6 text-gray-800 dark:text-gray-100", ...props }),
72
+ h1: ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
73
+ "h1",
74
+ {
75
+ className: "text-2xl sm:text-3xl md:text-4xl font-bold mb-4 mt-8 text-gray-800 dark:text-gray-100",
76
+ ...props
77
+ }
78
+ ),
79
+ h2: ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
80
+ "h2",
81
+ {
82
+ className: "text-xl sm:text-2xl md:text-3xl font-bold mb-3 mt-6 text-gray-800 dark:text-gray-100",
83
+ ...props
84
+ }
85
+ ),
65
86
  h3: ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
66
87
  "h3",
67
88
  {
68
- className: "text-2xl font-semibold mb-2 mt-4 text-gray-800 dark:text-gray-100",
89
+ className: "text-lg sm:text-xl md:text-2xl font-semibold mb-2 mt-4 text-gray-800 dark:text-gray-100",
69
90
  ...props
70
91
  }
71
92
  ),
@@ -151,12 +172,12 @@ function BlogRenderer({ content, metadata, className = "", components }) {
151
172
  };
152
173
  const mergedComponents = { ...defaultComponents, ...components };
153
174
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
154
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-3 mb-4", children: [
155
- metadata.category && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Badge, { children: metadata.category }),
156
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400", children: [
157
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: metadata.readingTime }),
158
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: "\u2022" }),
159
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("time", { dateTime: metadata.date, children: new Date(metadata.date).toLocaleDateString("en-US", {
175
+ 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
+ (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
+ showReadingTime && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: metadata.readingTime }),
179
+ showReadingTime && showDate && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: "\u2022" }),
180
+ showDate && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("time", { dateTime: metadata.date, children: new Date(metadata.date).toLocaleDateString("en-US", {
160
181
  year: "numeric",
161
182
  month: "long",
162
183
  day: "numeric"
@@ -176,6 +197,7 @@ function BlogRenderer({ content, metadata, className = "", components }) {
176
197
  }
177
198
 
178
199
  // src/components/BlogCard.tsx
200
+ var import_react2 = require("react");
179
201
  var import_jsx_runtime3 = require("react/jsx-runtime");
180
202
  function BlogCard({
181
203
  metadata,
@@ -194,7 +216,7 @@ function BlogCard({
194
216
  {
195
217
  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}`,
196
218
  children: [
197
- /* @__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: [
219
+ 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: [
198
220
  showCategory && metadata.category && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Badge, { children: metadata.category }),
199
221
  (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: [
200
222
  showReadingTime && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: metadata.readingTime }),
@@ -263,12 +285,12 @@ function BlogPlaceholder({ count = 3, className = "" }) {
263
285
  }
264
286
 
265
287
  // src/hooks/useBlogs.ts
266
- var import_react = require("react");
288
+ var import_react3 = require("react");
267
289
  function useBlogs(blogsMeta) {
268
- const [filteredBlogs, setFilteredBlogs] = (0, import_react.useState)(blogsMeta);
269
- const [searchTerm, setSearchTerm] = (0, import_react.useState)("");
270
- const [selectedCategory, setSelectedCategory] = (0, import_react.useState)(null);
271
- (0, import_react.useEffect)(() => {
290
+ const [filteredBlogs, setFilteredBlogs] = (0, import_react3.useState)(blogsMeta);
291
+ const [searchTerm, setSearchTerm] = (0, import_react3.useState)("");
292
+ const [selectedCategory, setSelectedCategory] = (0, import_react3.useState)(null);
293
+ (0, import_react3.useEffect)(() => {
272
294
  let filtered = blogsMeta;
273
295
  if (searchTerm) {
274
296
  filtered = filtered.filter(
package/dist/index.d.cts CHANGED
@@ -24,8 +24,11 @@ interface BlogRendererProps {
24
24
  metadata: BlogMeta;
25
25
  className?: string;
26
26
  components?: Record<string, react__default.ComponentType<any>>;
27
+ showCategory?: boolean;
28
+ showReadingTime?: boolean;
29
+ showDate?: boolean;
27
30
  }
28
- declare function BlogRenderer({ content, metadata, className, components }: BlogRendererProps): react_jsx_runtime.JSX.Element;
31
+ declare function BlogRenderer({ content, metadata, className, components, showCategory, showReadingTime, showDate, }: BlogRendererProps): react_jsx_runtime.JSX.Element;
29
32
 
30
33
  interface BlogCardProps {
31
34
  metadata: BlogMeta;
package/dist/index.d.ts CHANGED
@@ -24,8 +24,11 @@ interface BlogRendererProps {
24
24
  metadata: BlogMeta;
25
25
  className?: string;
26
26
  components?: Record<string, react__default.ComponentType<any>>;
27
+ showCategory?: boolean;
28
+ showReadingTime?: boolean;
29
+ showDate?: boolean;
27
30
  }
28
- declare function BlogRenderer({ content, metadata, className, components }: BlogRendererProps): react_jsx_runtime.JSX.Element;
31
+ declare function BlogRenderer({ content, metadata, className, components, showCategory, showReadingTime, showDate, }: BlogRendererProps): react_jsx_runtime.JSX.Element;
29
32
 
30
33
  interface BlogCardProps {
31
34
  metadata: BlogMeta;
package/dist/index.js CHANGED
@@ -1,4 +1,5 @@
1
1
  // src/components/BlogRenderer.tsx
2
+ import "react";
2
3
  import ReactMarkdown from "react-markdown";
3
4
  import remarkGfm from "remark-gfm";
4
5
  import rehypePrismPlus from "rehype-prism-plus";
@@ -18,14 +19,34 @@ function Badge({ children, className }) {
18
19
 
19
20
  // src/components/BlogRenderer.tsx
20
21
  import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
21
- function BlogRenderer({ content, metadata, className = "", components }) {
22
+ function BlogRenderer({
23
+ content,
24
+ metadata,
25
+ className = "",
26
+ components,
27
+ showCategory = true,
28
+ showReadingTime = true,
29
+ showDate = true
30
+ }) {
22
31
  const defaultComponents = {
23
- h1: ({ ...props }) => /* @__PURE__ */ jsx2("h1", { className: "text-4xl font-bold mb-4 mt-8 text-gray-800 dark:text-gray-100", ...props }),
24
- h2: ({ ...props }) => /* @__PURE__ */ jsx2("h2", { className: "text-3xl font-bold mb-3 mt-6 text-gray-800 dark:text-gray-100", ...props }),
32
+ h1: ({ ...props }) => /* @__PURE__ */ jsx2(
33
+ "h1",
34
+ {
35
+ className: "text-2xl sm:text-3xl md:text-4xl font-bold mb-4 mt-8 text-gray-800 dark:text-gray-100",
36
+ ...props
37
+ }
38
+ ),
39
+ h2: ({ ...props }) => /* @__PURE__ */ jsx2(
40
+ "h2",
41
+ {
42
+ className: "text-xl sm:text-2xl md:text-3xl font-bold mb-3 mt-6 text-gray-800 dark:text-gray-100",
43
+ ...props
44
+ }
45
+ ),
25
46
  h3: ({ ...props }) => /* @__PURE__ */ jsx2(
26
47
  "h3",
27
48
  {
28
- className: "text-2xl font-semibold mb-2 mt-4 text-gray-800 dark:text-gray-100",
49
+ className: "text-lg sm:text-xl md:text-2xl font-semibold mb-2 mt-4 text-gray-800 dark:text-gray-100",
29
50
  ...props
30
51
  }
31
52
  ),
@@ -111,12 +132,12 @@ function BlogRenderer({ content, metadata, className = "", components }) {
111
132
  };
112
133
  const mergedComponents = { ...defaultComponents, ...components };
113
134
  return /* @__PURE__ */ jsxs(Fragment, { children: [
114
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 mb-4", children: [
115
- metadata.category && /* @__PURE__ */ jsx2(Badge, { children: metadata.category }),
116
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400", children: [
117
- /* @__PURE__ */ jsx2("span", { children: metadata.readingTime }),
118
- /* @__PURE__ */ jsx2("span", { children: "\u2022" }),
119
- /* @__PURE__ */ jsx2("time", { dateTime: metadata.date, children: new Date(metadata.date).toLocaleDateString("en-US", {
135
+ 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
+ (showReadingTime || showDate) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400", children: [
138
+ showReadingTime && /* @__PURE__ */ jsx2("span", { children: metadata.readingTime }),
139
+ showReadingTime && showDate && /* @__PURE__ */ jsx2("span", { children: "\u2022" }),
140
+ showDate && /* @__PURE__ */ jsx2("time", { dateTime: metadata.date, children: new Date(metadata.date).toLocaleDateString("en-US", {
120
141
  year: "numeric",
121
142
  month: "long",
122
143
  day: "numeric"
@@ -136,6 +157,7 @@ function BlogRenderer({ content, metadata, className = "", components }) {
136
157
  }
137
158
 
138
159
  // src/components/BlogCard.tsx
160
+ import "react";
139
161
  import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
140
162
  function BlogCard({
141
163
  metadata,
@@ -154,7 +176,7 @@ function BlogCard({
154
176
  {
155
177
  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}`,
156
178
  children: [
157
- /* @__PURE__ */ jsx3("div", { className: "flex items-center justify-between mb-3", children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-3", children: [
179
+ 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: [
158
180
  showCategory && metadata.category && /* @__PURE__ */ jsx3(Badge, { children: metadata.category }),
159
181
  (showReadingTime || showDate) && /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400", children: [
160
182
  showReadingTime && /* @__PURE__ */ jsx3("span", { children: metadata.readingTime }),
package/dist/style.css CHANGED
@@ -1,2 +1,2 @@
1
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}}}@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-red-400:oklch(70.4% .191 22.216);--color-red-600:oklch(57.7% .245 27.325);--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-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-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;--font-weight-bold:700;--radius-lg:.5rem;--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-4{margin-block:calc(var(--spacing)*4)}.my-8{margin-block:calc(var(--spacing)*8)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-4{margin-top:calc(var(--spacing)*4)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-8{margin-top:calc(var(--spacing)*8)}.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)}.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%}.max-w-full{max-width:100%}.max-w-none{max-width:none}.min-w-full{min-width:100%}.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-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-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.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-gray-300{border-color:var(--color-gray-300)}.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-2{padding-block:calc(var(--spacing)*2)}.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}.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-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--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-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.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)}.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-red-600{color:var(--color-red-600)}.italic{font-style:italic}.line-through{text-decoration-line:line-through}.underline{text-decoration-line:underline}.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))}@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}}.dark\:border-blue-400:is(html.dark *){border-color:var(--color-blue-400)}.dark\:border-gray-700:is(html.dark *){border-color:var(--color-gray-700)}.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-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-red-400:is(html.dark *){color:var(--color-red-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}@keyframes pulse{50%{opacity:.5}}
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}}}@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-red-400:oklch(70.4% .191 22.216);--color-red-600:oklch(57.7% .245 27.325);--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-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-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;--font-weight-bold:700;--radius-lg:.5rem;--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-4{margin-block:calc(var(--spacing)*4)}.my-8{margin-block:calc(var(--spacing)*8)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-4{margin-top:calc(var(--spacing)*4)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-8{margin-top:calc(var(--spacing)*8)}.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)}.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%}.max-w-full{max-width:100%}.max-w-none{max-width:none}.min-w-full{min-width:100%}.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-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-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.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-gray-300{border-color:var(--color-gray-300)}.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-2{padding-block:calc(var(--spacing)*2)}.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}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--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-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.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)}.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-red-600{color:var(--color-red-600)}.italic{font-style:italic}.line-through{text-decoration-line:line-through}.underline{text-decoration-line:underline}.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))}@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:40rem){.sm\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.sm\:text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}}@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-blue-400:is(html.dark *){border-color:var(--color-blue-400)}.dark\:border-gray-700:is(html.dark *){border-color:var(--color-gray-700)}.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-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-red-400:is(html.dark *){color:var(--color-red-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}@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.0.7",
3
+ "version": "1.0.9",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",
@@ -37,8 +37,7 @@
37
37
  "autoprefixer": "^10.4.22",
38
38
  "postcss": "^8.5.6",
39
39
  "tailwindcss": "^4.1.17",
40
- "tsup": "^7.2.0",
41
- "typescript": "^5.5.0"
40
+ "tsup": "^7.2.0"
42
41
  },
43
42
  "scripts": {
44
43
  "build:css": "pnpm exec tailwindcss -i ./src/tailwind.css -o ./dist/style.css --minify",