@haroonwaves/blog-kit-react 1.2.9 → 1.3.1

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/dist/index.cjs CHANGED
@@ -49,15 +49,15 @@ var import_rehype_slug_custom_id = __toESM(require("rehype-slug-custom-id"), 1);
49
49
  // src/components/Badge.tsx
50
50
  var import_jsx_runtime = require("react/jsx-runtime");
51
51
  var colorVariants = [
52
- "bg-blue-100 dark:bg-blue-900/30 text-blue-500 dark:text-blue-300",
53
- "bg-orange-100 dark:bg-orange-900/30 text-orange-500 dark:text-orange-300",
54
- "bg-emerald-100 dark:bg-emerald-900/30 text-emerald-500 dark:text-emerald-300",
55
- "bg-violet-100 dark:bg-violet-900/30 text-violet-500 dark:text-violet-300",
56
- "bg-amber-100 dark:bg-amber-900/30 text-amber-500 dark:text-amber-300",
57
- "bg-rose-100 dark:bg-rose-900/30 text-rose-500 dark:text-rose-300",
58
- "bg-cyan-100 dark:bg-cyan-900/30 text-cyan-500 dark:text-cyan-300",
59
- "bg-fuchsia-100 dark:bg-fuchsia-900/30 text-fuchsia-500 dark:text-fuchsia-300",
60
- "bg-teal-100 dark:bg-teal-900/30 text-teal-500 dark:text-teal-300"
52
+ "bk:bg-blue-100 bk:dark:bg-blue-900/30 bk:text-blue-500 bk:dark:text-blue-300",
53
+ "bk:bg-orange-100 bk:dark:bg-orange-900/30 bk:text-orange-500 bk:dark:text-orange-300",
54
+ "bk:bg-emerald-100 bk:dark:bg-emerald-900/30 bk:text-emerald-500 bk:dark:text-emerald-300",
55
+ "bk:bg-violet-100 bk:dark:bg-violet-900/30 bk:text-violet-500 bk:dark:text-violet-300",
56
+ "bk:bg-amber-100 bk:dark:bg-amber-900/30 bk:text-amber-500 bk:dark:text-amber-300",
57
+ "bk:bg-rose-100 bk:dark:bg-rose-900/30 bk:text-rose-500 bk:dark:text-rose-300",
58
+ "bk:bg-cyan-100 bk:dark:bg-cyan-900/30 bk:text-cyan-500 bk:dark:text-cyan-300",
59
+ "bk:bg-fuchsia-100 bk:dark:bg-fuchsia-900/30 bk:text-fuchsia-500 bk:dark:text-fuchsia-300",
60
+ "bk:bg-teal-100 bk:dark:bg-teal-900/30 bk:text-teal-500 bk:dark:text-teal-300"
61
61
  ];
62
62
  function getColorIndex(text) {
63
63
  let hash = 5381;
@@ -72,7 +72,7 @@ function Badge({ children, className }) {
72
72
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
73
73
  "span",
74
74
  {
75
- className: `inline-flex items-center rounded-full border border-transparent px-2.5 py-0.5 text-xs font-semibold shrink-0 ${colorClass} ${className ?? ""}`,
75
+ className: `bk:inline-flex bk:items-center bk:rounded-full bk:border bk:border-transparent bk:px-2.5 bk:py-0.5 bk:text-xs bk:font-semibold bk:shrink-0 ${colorClass} ${className ?? ""}`,
76
76
  children
77
77
  }
78
78
  );
@@ -84,55 +84,55 @@ var defaultComponents = {
84
84
  h1: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
85
85
  "h1",
86
86
  {
87
- className: "mt-10 first:mt-0 mb-5 text-3xl md:text-4xl font-semibold tracking-tight text-gray-800 dark:text-gray-200",
87
+ className: "bk:mt-10 bk:first:mt-0 bk:mb-5 bk:text-3xl bk:md:text-4xl bk:font-semibold bk:tracking-tight bk:text-gray-800 bk:dark:text-gray-200",
88
88
  ...props
89
89
  }
90
90
  ),
91
91
  h2: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
92
92
  "h2",
93
93
  {
94
- className: "mt-8 first:mt-0 mb-4 text-2xl md:text-3xl font-semibold tracking-tight text-gray-800 dark:text-gray-200",
94
+ className: "bk:mt-8 bk:first:mt-0 bk:mb-4 bk:text-2xl bk:md:text-3xl bk:font-semibold bk:tracking-tight bk:text-gray-800 bk:dark:text-gray-200",
95
95
  ...props
96
96
  }
97
97
  ),
98
98
  h3: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
99
99
  "h3",
100
100
  {
101
- className: "mt-6 mb-4 first:mt-0 text-xl md:text-2xl font-semibold text-gray-800 dark:text-gray-200",
101
+ className: "bk:mt-6 bk:mb-4 bk:first:mt-0 bk:text-xl bk:md:text-2xl bk:font-semibold bk:text-gray-800 bk:dark:text-gray-200",
102
102
  ...props
103
103
  }
104
104
  ),
105
105
  h4: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
106
106
  "h4",
107
107
  {
108
- className: "mt-5 mb-3 first:mt-0 text-lg font-semibold text-gray-800 dark:text-gray-200",
108
+ className: "bk:mt-5 bk:mb-3 bk:first:mt-0 bk:text-lg bk:font-semibold bk:text-gray-800 bk:dark:text-gray-200",
109
109
  ...props
110
110
  }
111
111
  ),
112
112
  h5: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
113
113
  "h5",
114
114
  {
115
- className: "mt-4 mb-2 first:mt-0 text-base font-semibold text-gray-700 dark:text-gray-200",
115
+ className: "bk:mt-4 bk:mb-2 bk:first:mt-0 bk:text-base bk:font-semibold bk:text-gray-700 bk:dark:text-gray-200",
116
116
  ...props
117
117
  }
118
118
  ),
119
119
  h6: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
120
120
  "h6",
121
121
  {
122
- className: "mt-4 mb-2 text-sm first:mt-0 font-semibold uppercase tracking-wide text-gray-600 dark:text-gray-300",
122
+ className: "bk:mt-4 bk:mb-2 bk:text-sm bk:first:mt-0 bk:font-semibold bk:uppercase bk:tracking-wide bk:text-gray-600 bk:dark:text-gray-300",
123
123
  ...props
124
124
  }
125
125
  ),
126
- p: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "mb-4 leading-7 text-gray-700 dark:text-gray-300", ...props }),
127
- ul: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ul", { className: "mb-4 ml-6 list-disc space-y-2 text-gray-700 dark:text-gray-300", ...props }),
128
- ol: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ol", { className: "mb-4 ml-6 list-decimal space-y-2 text-gray-700 dark:text-gray-300", ...props }),
126
+ p: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "bk:mb-4 bk:leading-7 bk:text-gray-700 bk:dark:text-gray-300", ...props }),
127
+ ul: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ul", { className: "bk:mb-4 bk:ml-6 bk:list-disc bk:space-y-2 bk:text-gray-700 bk:dark:text-gray-300", ...props }),
128
+ ol: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ol", { className: "bk:mb-4 bk:ml-6 bk:list-decimal bk:space-y-2 bk:text-gray-700 bk:dark:text-gray-300", ...props }),
129
129
  li: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("li", { ...props }),
130
130
  code: ({ className, children, ...props }) => {
131
131
  const isInline = !className;
132
132
  return isInline ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
133
133
  "code",
134
134
  {
135
- className: "rounded bg-gray-100 dark:bg-gray-800 px-1.5 py-0.5 text-sm font-mono text-rose-600 dark:text-rose-400",
135
+ className: "bk:rounded bk:bg-gray-100 bk:dark:bg-gray-800 bk:px-1.5 bk:py-0.5 bk:text-sm bk:font-mono bk:text-rose-600 bk:dark:text-rose-400",
136
136
  ...props,
137
137
  children
138
138
  }
@@ -142,7 +142,7 @@ var defaultComponents = {
142
142
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
143
143
  "pre",
144
144
  {
145
- className: `mb-4 rounded-lg overflow-x-auto [&>code]:block [&>code]:p-4 ${preClassName || ""}`,
145
+ className: `bk:mb-4 bk:rounded-lg bk:overflow-x-auto [&>code]:bk:block [&>code]:bk:p-4 ${preClassName || ""}`,
146
146
  ...props,
147
147
  children
148
148
  }
@@ -151,36 +151,36 @@ var defaultComponents = {
151
151
  blockquote: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
152
152
  "blockquote",
153
153
  {
154
- className: "my-6 border-l-4 border-blue-500 pl-4 italic text-gray-600 dark:text-gray-400",
154
+ className: "bk:my-6 bk:border-l-4 bk:border-blue-500 bk:pl-4 bk:italic bk:text-gray-600 bk:dark:text-gray-400",
155
155
  ...props
156
156
  }
157
157
  ),
158
158
  a: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
159
159
  "a",
160
160
  {
161
- className: "text-blue-600 dark:text-blue-400 underline underline-offset-4 hover:text-blue-800 dark:hover:text-blue-300",
161
+ className: "bk:text-blue-600 bk:dark:text-blue-400 bk:underline bk:underline-offset-4 bk:hover:text-blue-800 bk:dark:hover:text-blue-300",
162
162
  ...props
163
163
  }
164
164
  ),
165
- strong: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("strong", { className: "font-semibold text-gray-800 dark:text-gray-200", ...props }),
166
- em: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("em", { className: "italic text-gray-800 dark:text-gray-200", ...props }),
167
- del: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("del", { className: "text-gray-500 dark:text-gray-400", ...props }),
168
- hr: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("hr", { className: "my-9 border-gray-200 dark:border-neutral-900", ...props }),
165
+ strong: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("strong", { className: "bk:font-semibold bk:text-gray-800 bk:dark:text-gray-200", ...props }),
166
+ em: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("em", { className: "bk:italic bk:text-gray-800 bk:dark:text-gray-200", ...props }),
167
+ del: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("del", { className: "bk:text-gray-500 bk:dark:text-gray-400", ...props }),
168
+ hr: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("hr", { className: "bk:my-9 bk:border-gray-200 bk:dark:border-neutral-900", ...props }),
169
169
  br: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("br", { ...props }),
170
- img: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("img", { className: "my-6 rounded-xl max-w-full h-auto", ...props }),
171
- table: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "my-6 overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
170
+ img: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("img", { className: "bk:my-6 bk:rounded-xl bk:max-w-full bk:h-auto", ...props }),
171
+ table: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "bk:my-6 bk:overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
172
172
  "table",
173
173
  {
174
- className: "w-full border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden text-sm",
174
+ className: "bk:w-full bk:border bk:border-gray-200 bk:dark:border-gray-700 bk:rounded-lg bk:overflow-hidden bk:text-sm",
175
175
  ...props
176
176
  }
177
177
  ) }),
178
- thead: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("thead", { className: "bg-gray-50 dark:bg-gray-800 text-gray-700 dark:text-gray-200", ...props }),
178
+ thead: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("thead", { className: "bk:bg-gray-50 bk:dark:bg-gray-800 bk:text-gray-700 bk:dark:text-gray-200", ...props }),
179
179
  tbody: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("tbody", { ...props }),
180
- tr: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("tr", { className: "border-b last:border-b-0 border-gray-200 dark:border-gray-700", ...props }),
181
- th: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { className: "px-4 py-3 text-left font-semibold", ...props }),
182
- td: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("td", { className: "px-4 py-3 text-gray-700 dark:text-gray-300", ...props }),
183
- input: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("input", { type: "checkbox", disabled: true, className: "mr-2 accent-blue-600", ...props })
180
+ tr: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("tr", { className: "bk:border-b bk:last:border-b-0 bk:border-gray-200 bk:dark:border-gray-700", ...props }),
181
+ th: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { className: "bk:px-4 bk:py-3 bk:text-left bk:font-semibold", ...props }),
182
+ td: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("td", { className: "bk:px-4 bk:py-3 bk:text-gray-700 bk:dark:text-gray-300", ...props }),
183
+ input: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("input", { type: "checkbox", disabled: true, className: "bk:mr-2 bk:accent-blue-600", ...props })
184
184
  };
185
185
  function BlogRenderer({
186
186
  content,
@@ -193,9 +193,9 @@ function BlogRenderer({
193
193
  }) {
194
194
  const mergedComponents = { ...defaultComponents, ...components };
195
195
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
196
- (showCategory || showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-3 mb-4", children: [
197
- 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,
198
- (showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap", children: [
196
+ (showCategory || showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "bk:flex bk:items-center bk:gap-3 bk:mb-4", children: [
197
+ showCategory && metadata.categories?.length ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "bk:flex bk:items-center bk:gap-1.5 bk:flex-wrap", children: metadata.categories.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Badge, { children: cat }, cat)) }) : null,
198
+ (showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "bk:flex bk:items-center bk:gap-2 bk:text-sm bk:text-gray-500 bk:dark:text-gray-400 bk:whitespace-nowrap", children: [
199
199
  showReadingTime && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: metadata.readingTime }),
200
200
  showReadingTime && showDate && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: "\u2022" }),
201
201
  showDate && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("time", { dateTime: metadata.date, children: new Date(metadata.date).toLocaleDateString("en-US", {
@@ -205,7 +205,7 @@ function BlogRenderer({
205
205
  }) })
206
206
  ] })
207
207
  ] }),
208
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: `prose prose-slate dark:prose-invert max-w-none ${className}`, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
208
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: `bk:prose bk:prose-slate bk:dark:prose-invert bk:max-w-none ${className}`, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
209
209
  import_react_markdown.default,
210
210
  {
211
211
  remarkPlugins: [import_remark_gfm.default],
@@ -235,11 +235,11 @@ function BlogCard({
235
235
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
236
236
  "article",
237
237
  {
238
- 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 min-h-[200px] flex flex-col ${className}`,
238
+ className: `bk:rounded-lg bk:border bk:border-gray-200 bk:dark:border-gray-700 bk:hover:border-gray-300 bk:dark:hover:border-gray-600 bk:bg-white bk:dark:bg-gray-800 bk:p-6 bk:transition-colors bk:min-h-[200px] bk:flex bk:flex-col ${className}`,
239
239
  children: [
240
- (showCategory || showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center gap-3 justify-between", children: [
241
- showCategory && metadata.categories?.length ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "flex items-center gap-1.5 flex-nowrap overflow-hidden", children: metadata.categories.slice(0, 2).map((cat) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Badge, { children: cat }, cat)) }) : null,
242
- (showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap", children: [
240
+ (showCategory || showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "bk:mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "bk:flex bk:items-center bk:gap-3 bk:justify-between", children: [
241
+ showCategory && metadata.categories?.length ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "bk:flex bk:items-center bk:gap-1.5 bk:flex-nowrap bk:overflow-hidden", children: metadata.categories.slice(0, 2).map((cat) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Badge, { children: cat }, cat)) }) : null,
242
+ (showReadingTime || showDate) && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "bk:flex bk:items-center bk:gap-2 bk:text-sm bk:text-gray-500 bk:dark:text-gray-400 bk:whitespace-nowrap", children: [
243
243
  showReadingTime && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: metadata.readingTime }),
244
244
  showReadingTime && showDate && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: "\u2022" }),
245
245
  showDate && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("time", { dateTime: metadata.date, children: new Date(metadata.date).toLocaleDateString("en-US", {
@@ -251,12 +251,12 @@ function BlogCard({
251
251
  ] }) }),
252
252
  Link(
253
253
  href,
254
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("h2", { className: "font-semibold text-xl text-gray-700 dark:text-gray-100 mb-2 hover:underline transition-colors line-clamp-2", children: metadata.title })
254
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("h2", { className: "bk:font-semibold bk:text-xl bk:text-gray-700 bk:dark:text-gray-100 bk:mb-2 bk:hover:underline bk:transition-colors bk:line-clamp-2", children: metadata.title })
255
255
  ),
256
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "text-sm text-gray-500 dark:text-gray-300 mb-2 leading-6 line-clamp-2", children: metadata.description }),
257
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "mt-auto", children: Link(
256
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "bk:text-sm bk:text-gray-500 bk:dark:text-gray-300 bk:mb-2 bk:leading-6 bk:line-clamp-2", children: metadata.description }),
257
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "bk:mt-auto", children: Link(
258
258
  href,
259
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "inline-flex items-center text-blue-600 dark:text-blue-400 hover:text-blue-700 dark:hover:text-blue-300 font-medium text-sm", children: "Read more \u2192" })
259
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "bk:inline-flex bk:items-center bk:text-blue-600 bk:dark:text-blue-400 bk:hover:text-blue-700 bk:dark:hover:text-blue-300 bk:font-medium bk:text-sm", children: "Read more \u2192" })
260
260
  ) })
261
261
  ]
262
262
  }
@@ -274,9 +274,9 @@ function BlogList({
274
274
  cardProps
275
275
  }) {
276
276
  if (metadata.length === 0) {
277
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: `text-center text-gray-500 dark:text-gray-400 py-12 ${className}`, children: emptyMessage });
277
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: `bk:text-center bk:text-gray-500 bk:dark:text-gray-400 bk:py-12 ${className}`, children: emptyMessage });
278
278
  }
279
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: `flex flex-col gap-6 ${className}`, children: metadata.map((meta) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
279
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: `bk:flex bk:flex-col bk:gap-6 ${className}`, children: metadata.map((meta) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
280
280
  BlogCard,
281
281
  {
282
282
  metadata: meta,
@@ -294,11 +294,11 @@ function BlogPlaceholder({ count = 3, className = "" }) {
294
294
  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: `${className}`, children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
295
295
  "div",
296
296
  {
297
- className: "bg-white dark:bg-gray-800 rounded-lg border border-gray-200 dark:border-gray-700 p-6 animate-pulse",
297
+ className: "bk:bg-white bk:dark:bg-gray-800 bk:rounded-lg bk:border bk:border-gray-200 bk:dark:border-gray-700 bk:p-6 bk:animate-pulse",
298
298
  children: [
299
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "h-4 bg-gray-200 dark:bg-gray-700 rounded mb-3" }),
300
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "h-6 bg-gray-200 dark:bg-gray-700 rounded mb-2" }),
301
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "h-4 bg-gray-200 dark:bg-gray-700 rounded w-3/4" })
299
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "bk:h-4 bk:bg-gray-200 bk:dark:bg-gray-700 bk:rounded bk:mb-3" }),
300
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "bk:h-6 bk:bg-gray-200 bk:dark:bg-gray-700 bk:rounded bk:mb-2" }),
301
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "bk:h-4 bk:bg-gray-200 bk:dark:bg-gray-700 bk:rounded bk:w-3/4" })
302
302
  ]
303
303
  },
304
304
  i
@@ -306,19 +306,37 @@ function BlogPlaceholder({ count = 3, className = "" }) {
306
306
  }
307
307
 
308
308
  // src/hooks/useBlogs.ts
309
+ var import_react4 = require("react");
310
+
311
+ // src/hooks/useDebounce.ts
309
312
  var import_react3 = require("react");
313
+ function useDebounce(value, delay) {
314
+ const [debouncedValue, setDebouncedValue] = (0, import_react3.useState)(value);
315
+ (0, import_react3.useEffect)(() => {
316
+ const timer = setTimeout(() => {
317
+ setDebouncedValue(value);
318
+ }, delay);
319
+ return () => {
320
+ clearTimeout(timer);
321
+ };
322
+ }, [value, delay]);
323
+ return debouncedValue;
324
+ }
325
+
326
+ // src/hooks/useBlogs.ts
310
327
  function useBlogs(blogsMeta) {
311
- const [filteredBlogs, setFilteredBlogs] = (0, import_react3.useState)(blogsMeta);
312
- const [searchTerm, setSearchTerm] = (0, import_react3.useState)("");
313
- const [selectedCategory, setSelectedCategory] = (0, import_react3.useState)(null);
328
+ const [filteredBlogs, setFilteredBlogs] = (0, import_react4.useState)(blogsMeta);
329
+ const [searchTerm, setSearchTerm] = (0, import_react4.useState)("");
330
+ const [selectedCategory, setSelectedCategory] = (0, import_react4.useState)(null);
331
+ const debouncedSearchTerm = useDebounce(searchTerm, 500);
314
332
  const getBlogCategories = (blog) => {
315
333
  return blog.categories ?? [];
316
334
  };
317
- (0, import_react3.useEffect)(() => {
335
+ (0, import_react4.useEffect)(() => {
318
336
  let filtered = blogsMeta;
319
- if (searchTerm) {
337
+ if (debouncedSearchTerm) {
320
338
  filtered = filtered.filter(
321
- (blog) => blog.title.toLowerCase().includes(searchTerm.toLowerCase()) || blog.description.toLowerCase().includes(searchTerm.toLowerCase())
339
+ (blog) => blog.title.toLowerCase().includes(debouncedSearchTerm.toLowerCase()) || blog.description.toLowerCase().includes(debouncedSearchTerm.toLowerCase())
322
340
  );
323
341
  }
324
342
  if (selectedCategory) {
@@ -328,7 +346,7 @@ function useBlogs(blogsMeta) {
328
346
  });
329
347
  }
330
348
  setFilteredBlogs(filtered);
331
- }, [blogsMeta, searchTerm, selectedCategory]);
349
+ }, [blogsMeta, debouncedSearchTerm, selectedCategory]);
332
350
  const categories = Array.from(new Set(blogsMeta.flatMap((blog) => getBlogCategories(blog))));
333
351
  return {
334
352
  metadata: filteredBlogs,
package/dist/index.js CHANGED
@@ -9,15 +9,15 @@ import rehypeSlugCustomId from "rehype-slug-custom-id";
9
9
  // src/components/Badge.tsx
10
10
  import { jsx } from "react/jsx-runtime";
11
11
  var colorVariants = [
12
- "bg-blue-100 dark:bg-blue-900/30 text-blue-500 dark:text-blue-300",
13
- "bg-orange-100 dark:bg-orange-900/30 text-orange-500 dark:text-orange-300",
14
- "bg-emerald-100 dark:bg-emerald-900/30 text-emerald-500 dark:text-emerald-300",
15
- "bg-violet-100 dark:bg-violet-900/30 text-violet-500 dark:text-violet-300",
16
- "bg-amber-100 dark:bg-amber-900/30 text-amber-500 dark:text-amber-300",
17
- "bg-rose-100 dark:bg-rose-900/30 text-rose-500 dark:text-rose-300",
18
- "bg-cyan-100 dark:bg-cyan-900/30 text-cyan-500 dark:text-cyan-300",
19
- "bg-fuchsia-100 dark:bg-fuchsia-900/30 text-fuchsia-500 dark:text-fuchsia-300",
20
- "bg-teal-100 dark:bg-teal-900/30 text-teal-500 dark:text-teal-300"
12
+ "bk:bg-blue-100 bk:dark:bg-blue-900/30 bk:text-blue-500 bk:dark:text-blue-300",
13
+ "bk:bg-orange-100 bk:dark:bg-orange-900/30 bk:text-orange-500 bk:dark:text-orange-300",
14
+ "bk:bg-emerald-100 bk:dark:bg-emerald-900/30 bk:text-emerald-500 bk:dark:text-emerald-300",
15
+ "bk:bg-violet-100 bk:dark:bg-violet-900/30 bk:text-violet-500 bk:dark:text-violet-300",
16
+ "bk:bg-amber-100 bk:dark:bg-amber-900/30 bk:text-amber-500 bk:dark:text-amber-300",
17
+ "bk:bg-rose-100 bk:dark:bg-rose-900/30 bk:text-rose-500 bk:dark:text-rose-300",
18
+ "bk:bg-cyan-100 bk:dark:bg-cyan-900/30 bk:text-cyan-500 bk:dark:text-cyan-300",
19
+ "bk:bg-fuchsia-100 bk:dark:bg-fuchsia-900/30 bk:text-fuchsia-500 bk:dark:text-fuchsia-300",
20
+ "bk:bg-teal-100 bk:dark:bg-teal-900/30 bk:text-teal-500 bk:dark:text-teal-300"
21
21
  ];
22
22
  function getColorIndex(text) {
23
23
  let hash = 5381;
@@ -32,7 +32,7 @@ function Badge({ children, className }) {
32
32
  return /* @__PURE__ */ jsx(
33
33
  "span",
34
34
  {
35
- className: `inline-flex items-center rounded-full border border-transparent px-2.5 py-0.5 text-xs font-semibold shrink-0 ${colorClass} ${className ?? ""}`,
35
+ className: `bk:inline-flex bk:items-center bk:rounded-full bk:border bk:border-transparent bk:px-2.5 bk:py-0.5 bk:text-xs bk:font-semibold bk:shrink-0 ${colorClass} ${className ?? ""}`,
36
36
  children
37
37
  }
38
38
  );
@@ -44,55 +44,55 @@ var defaultComponents = {
44
44
  h1: (props) => /* @__PURE__ */ jsx2(
45
45
  "h1",
46
46
  {
47
- className: "mt-10 first:mt-0 mb-5 text-3xl md:text-4xl font-semibold tracking-tight text-gray-800 dark:text-gray-200",
47
+ className: "bk:mt-10 bk:first:mt-0 bk:mb-5 bk:text-3xl bk:md:text-4xl bk:font-semibold bk:tracking-tight bk:text-gray-800 bk:dark:text-gray-200",
48
48
  ...props
49
49
  }
50
50
  ),
51
51
  h2: (props) => /* @__PURE__ */ jsx2(
52
52
  "h2",
53
53
  {
54
- className: "mt-8 first:mt-0 mb-4 text-2xl md:text-3xl font-semibold tracking-tight text-gray-800 dark:text-gray-200",
54
+ className: "bk:mt-8 bk:first:mt-0 bk:mb-4 bk:text-2xl bk:md:text-3xl bk:font-semibold bk:tracking-tight bk:text-gray-800 bk:dark:text-gray-200",
55
55
  ...props
56
56
  }
57
57
  ),
58
58
  h3: (props) => /* @__PURE__ */ jsx2(
59
59
  "h3",
60
60
  {
61
- className: "mt-6 mb-4 first:mt-0 text-xl md:text-2xl font-semibold text-gray-800 dark:text-gray-200",
61
+ className: "bk:mt-6 bk:mb-4 bk:first:mt-0 bk:text-xl bk:md:text-2xl bk:font-semibold bk:text-gray-800 bk:dark:text-gray-200",
62
62
  ...props
63
63
  }
64
64
  ),
65
65
  h4: (props) => /* @__PURE__ */ jsx2(
66
66
  "h4",
67
67
  {
68
- className: "mt-5 mb-3 first:mt-0 text-lg font-semibold text-gray-800 dark:text-gray-200",
68
+ className: "bk:mt-5 bk:mb-3 bk:first:mt-0 bk:text-lg bk:font-semibold bk:text-gray-800 bk:dark:text-gray-200",
69
69
  ...props
70
70
  }
71
71
  ),
72
72
  h5: (props) => /* @__PURE__ */ jsx2(
73
73
  "h5",
74
74
  {
75
- className: "mt-4 mb-2 first:mt-0 text-base font-semibold text-gray-700 dark:text-gray-200",
75
+ className: "bk:mt-4 bk:mb-2 bk:first:mt-0 bk:text-base bk:font-semibold bk:text-gray-700 bk:dark:text-gray-200",
76
76
  ...props
77
77
  }
78
78
  ),
79
79
  h6: (props) => /* @__PURE__ */ jsx2(
80
80
  "h6",
81
81
  {
82
- className: "mt-4 mb-2 text-sm first:mt-0 font-semibold uppercase tracking-wide text-gray-600 dark:text-gray-300",
82
+ className: "bk:mt-4 bk:mb-2 bk:text-sm bk:first:mt-0 bk:font-semibold bk:uppercase bk:tracking-wide bk:text-gray-600 bk:dark:text-gray-300",
83
83
  ...props
84
84
  }
85
85
  ),
86
- p: (props) => /* @__PURE__ */ jsx2("p", { className: "mb-4 leading-7 text-gray-700 dark:text-gray-300", ...props }),
87
- ul: (props) => /* @__PURE__ */ jsx2("ul", { className: "mb-4 ml-6 list-disc space-y-2 text-gray-700 dark:text-gray-300", ...props }),
88
- ol: (props) => /* @__PURE__ */ jsx2("ol", { className: "mb-4 ml-6 list-decimal space-y-2 text-gray-700 dark:text-gray-300", ...props }),
86
+ p: (props) => /* @__PURE__ */ jsx2("p", { className: "bk:mb-4 bk:leading-7 bk:text-gray-700 bk:dark:text-gray-300", ...props }),
87
+ ul: (props) => /* @__PURE__ */ jsx2("ul", { className: "bk:mb-4 bk:ml-6 bk:list-disc bk:space-y-2 bk:text-gray-700 bk:dark:text-gray-300", ...props }),
88
+ ol: (props) => /* @__PURE__ */ jsx2("ol", { className: "bk:mb-4 bk:ml-6 bk:list-decimal bk:space-y-2 bk:text-gray-700 bk:dark:text-gray-300", ...props }),
89
89
  li: (props) => /* @__PURE__ */ jsx2("li", { ...props }),
90
90
  code: ({ className, children, ...props }) => {
91
91
  const isInline = !className;
92
92
  return isInline ? /* @__PURE__ */ jsx2(
93
93
  "code",
94
94
  {
95
- className: "rounded bg-gray-100 dark:bg-gray-800 px-1.5 py-0.5 text-sm font-mono text-rose-600 dark:text-rose-400",
95
+ className: "bk:rounded bk:bg-gray-100 bk:dark:bg-gray-800 bk:px-1.5 bk:py-0.5 bk:text-sm bk:font-mono bk:text-rose-600 bk:dark:text-rose-400",
96
96
  ...props,
97
97
  children
98
98
  }
@@ -102,7 +102,7 @@ var defaultComponents = {
102
102
  return /* @__PURE__ */ jsx2(
103
103
  "pre",
104
104
  {
105
- className: `mb-4 rounded-lg overflow-x-auto [&>code]:block [&>code]:p-4 ${preClassName || ""}`,
105
+ className: `bk:mb-4 bk:rounded-lg bk:overflow-x-auto [&>code]:bk:block [&>code]:bk:p-4 ${preClassName || ""}`,
106
106
  ...props,
107
107
  children
108
108
  }
@@ -111,36 +111,36 @@ var defaultComponents = {
111
111
  blockquote: (props) => /* @__PURE__ */ jsx2(
112
112
  "blockquote",
113
113
  {
114
- className: "my-6 border-l-4 border-blue-500 pl-4 italic text-gray-600 dark:text-gray-400",
114
+ className: "bk:my-6 bk:border-l-4 bk:border-blue-500 bk:pl-4 bk:italic bk:text-gray-600 bk:dark:text-gray-400",
115
115
  ...props
116
116
  }
117
117
  ),
118
118
  a: (props) => /* @__PURE__ */ jsx2(
119
119
  "a",
120
120
  {
121
- className: "text-blue-600 dark:text-blue-400 underline underline-offset-4 hover:text-blue-800 dark:hover:text-blue-300",
121
+ className: "bk:text-blue-600 bk:dark:text-blue-400 bk:underline bk:underline-offset-4 bk:hover:text-blue-800 bk:dark:hover:text-blue-300",
122
122
  ...props
123
123
  }
124
124
  ),
125
- strong: (props) => /* @__PURE__ */ jsx2("strong", { className: "font-semibold text-gray-800 dark:text-gray-200", ...props }),
126
- em: (props) => /* @__PURE__ */ jsx2("em", { className: "italic text-gray-800 dark:text-gray-200", ...props }),
127
- del: (props) => /* @__PURE__ */ jsx2("del", { className: "text-gray-500 dark:text-gray-400", ...props }),
128
- hr: (props) => /* @__PURE__ */ jsx2("hr", { className: "my-9 border-gray-200 dark:border-neutral-900", ...props }),
125
+ strong: (props) => /* @__PURE__ */ jsx2("strong", { className: "bk:font-semibold bk:text-gray-800 bk:dark:text-gray-200", ...props }),
126
+ em: (props) => /* @__PURE__ */ jsx2("em", { className: "bk:italic bk:text-gray-800 bk:dark:text-gray-200", ...props }),
127
+ del: (props) => /* @__PURE__ */ jsx2("del", { className: "bk:text-gray-500 bk:dark:text-gray-400", ...props }),
128
+ hr: (props) => /* @__PURE__ */ jsx2("hr", { className: "bk:my-9 bk:border-gray-200 bk:dark:border-neutral-900", ...props }),
129
129
  br: (props) => /* @__PURE__ */ jsx2("br", { ...props }),
130
- img: (props) => /* @__PURE__ */ jsx2("img", { className: "my-6 rounded-xl max-w-full h-auto", ...props }),
131
- table: (props) => /* @__PURE__ */ jsx2("div", { className: "my-6 overflow-x-auto", children: /* @__PURE__ */ jsx2(
130
+ img: (props) => /* @__PURE__ */ jsx2("img", { className: "bk:my-6 bk:rounded-xl bk:max-w-full bk:h-auto", ...props }),
131
+ table: (props) => /* @__PURE__ */ jsx2("div", { className: "bk:my-6 bk:overflow-x-auto", children: /* @__PURE__ */ jsx2(
132
132
  "table",
133
133
  {
134
- className: "w-full border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden text-sm",
134
+ className: "bk:w-full bk:border bk:border-gray-200 bk:dark:border-gray-700 bk:rounded-lg bk:overflow-hidden bk:text-sm",
135
135
  ...props
136
136
  }
137
137
  ) }),
138
- thead: (props) => /* @__PURE__ */ jsx2("thead", { className: "bg-gray-50 dark:bg-gray-800 text-gray-700 dark:text-gray-200", ...props }),
138
+ thead: (props) => /* @__PURE__ */ jsx2("thead", { className: "bk:bg-gray-50 bk:dark:bg-gray-800 bk:text-gray-700 bk:dark:text-gray-200", ...props }),
139
139
  tbody: (props) => /* @__PURE__ */ jsx2("tbody", { ...props }),
140
- tr: (props) => /* @__PURE__ */ jsx2("tr", { className: "border-b last:border-b-0 border-gray-200 dark:border-gray-700", ...props }),
141
- th: (props) => /* @__PURE__ */ jsx2("th", { className: "px-4 py-3 text-left font-semibold", ...props }),
142
- td: (props) => /* @__PURE__ */ jsx2("td", { className: "px-4 py-3 text-gray-700 dark:text-gray-300", ...props }),
143
- input: (props) => /* @__PURE__ */ jsx2("input", { type: "checkbox", disabled: true, className: "mr-2 accent-blue-600", ...props })
140
+ tr: (props) => /* @__PURE__ */ jsx2("tr", { className: "bk:border-b bk:last:border-b-0 bk:border-gray-200 bk:dark:border-gray-700", ...props }),
141
+ th: (props) => /* @__PURE__ */ jsx2("th", { className: "bk:px-4 bk:py-3 bk:text-left bk:font-semibold", ...props }),
142
+ td: (props) => /* @__PURE__ */ jsx2("td", { className: "bk:px-4 bk:py-3 bk:text-gray-700 bk:dark:text-gray-300", ...props }),
143
+ input: (props) => /* @__PURE__ */ jsx2("input", { type: "checkbox", disabled: true, className: "bk:mr-2 bk:accent-blue-600", ...props })
144
144
  };
145
145
  function BlogRenderer({
146
146
  content,
@@ -153,9 +153,9 @@ function BlogRenderer({
153
153
  }) {
154
154
  const mergedComponents = { ...defaultComponents, ...components };
155
155
  return /* @__PURE__ */ jsxs(Fragment, { children: [
156
- (showCategory || showReadingTime || showDate) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 mb-4", children: [
157
- 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,
158
- (showReadingTime || showDate) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap", children: [
156
+ (showCategory || showReadingTime || showDate) && /* @__PURE__ */ jsxs("div", { className: "bk:flex bk:items-center bk:gap-3 bk:mb-4", children: [
157
+ showCategory && metadata.categories?.length ? /* @__PURE__ */ jsx2("div", { className: "bk:flex bk:items-center bk:gap-1.5 bk:flex-wrap", children: metadata.categories.map((cat) => /* @__PURE__ */ jsx2(Badge, { children: cat }, cat)) }) : null,
158
+ (showReadingTime || showDate) && /* @__PURE__ */ jsxs("div", { className: "bk:flex bk:items-center bk:gap-2 bk:text-sm bk:text-gray-500 bk:dark:text-gray-400 bk:whitespace-nowrap", children: [
159
159
  showReadingTime && /* @__PURE__ */ jsx2("span", { children: metadata.readingTime }),
160
160
  showReadingTime && showDate && /* @__PURE__ */ jsx2("span", { children: "\u2022" }),
161
161
  showDate && /* @__PURE__ */ jsx2("time", { dateTime: metadata.date, children: new Date(metadata.date).toLocaleDateString("en-US", {
@@ -165,7 +165,7 @@ function BlogRenderer({
165
165
  }) })
166
166
  ] })
167
167
  ] }),
168
- /* @__PURE__ */ jsx2("div", { className: `prose prose-slate dark:prose-invert max-w-none ${className}`, children: /* @__PURE__ */ jsx2(
168
+ /* @__PURE__ */ jsx2("div", { className: `bk:prose bk:prose-slate bk:dark:prose-invert bk:max-w-none ${className}`, children: /* @__PURE__ */ jsx2(
169
169
  ReactMarkdown,
170
170
  {
171
171
  remarkPlugins: [remarkGfm],
@@ -195,11 +195,11 @@ function BlogCard({
195
195
  return /* @__PURE__ */ jsxs2(
196
196
  "article",
197
197
  {
198
- 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 min-h-[200px] flex flex-col ${className}`,
198
+ className: `bk:rounded-lg bk:border bk:border-gray-200 bk:dark:border-gray-700 bk:hover:border-gray-300 bk:dark:hover:border-gray-600 bk:bg-white bk:dark:bg-gray-800 bk:p-6 bk:transition-colors bk:min-h-[200px] bk:flex bk:flex-col ${className}`,
199
199
  children: [
200
- (showCategory || showReadingTime || showDate) && /* @__PURE__ */ jsx3("div", { className: "mb-3", children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-3 justify-between", children: [
201
- showCategory && metadata.categories?.length ? /* @__PURE__ */ jsx3("div", { className: "flex items-center gap-1.5 flex-nowrap overflow-hidden", children: metadata.categories.slice(0, 2).map((cat) => /* @__PURE__ */ jsx3(Badge, { children: cat }, cat)) }) : null,
202
- (showReadingTime || showDate) && /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap", children: [
200
+ (showCategory || showReadingTime || showDate) && /* @__PURE__ */ jsx3("div", { className: "bk:mb-3", children: /* @__PURE__ */ jsxs2("div", { className: "bk:flex bk:items-center bk:gap-3 bk:justify-between", children: [
201
+ showCategory && metadata.categories?.length ? /* @__PURE__ */ jsx3("div", { className: "bk:flex bk:items-center bk:gap-1.5 bk:flex-nowrap bk:overflow-hidden", children: metadata.categories.slice(0, 2).map((cat) => /* @__PURE__ */ jsx3(Badge, { children: cat }, cat)) }) : null,
202
+ (showReadingTime || showDate) && /* @__PURE__ */ jsxs2("div", { className: "bk:flex bk:items-center bk:gap-2 bk:text-sm bk:text-gray-500 bk:dark:text-gray-400 bk:whitespace-nowrap", children: [
203
203
  showReadingTime && /* @__PURE__ */ jsx3("span", { children: metadata.readingTime }),
204
204
  showReadingTime && showDate && /* @__PURE__ */ jsx3("span", { children: "\u2022" }),
205
205
  showDate && /* @__PURE__ */ jsx3("time", { dateTime: metadata.date, children: new Date(metadata.date).toLocaleDateString("en-US", {
@@ -211,12 +211,12 @@ function BlogCard({
211
211
  ] }) }),
212
212
  Link(
213
213
  href,
214
- /* @__PURE__ */ jsx3("h2", { className: "font-semibold text-xl text-gray-700 dark:text-gray-100 mb-2 hover:underline transition-colors line-clamp-2", children: metadata.title })
214
+ /* @__PURE__ */ jsx3("h2", { className: "bk:font-semibold bk:text-xl bk:text-gray-700 bk:dark:text-gray-100 bk:mb-2 bk:hover:underline bk:transition-colors bk:line-clamp-2", children: metadata.title })
215
215
  ),
216
- /* @__PURE__ */ jsx3("p", { className: "text-sm text-gray-500 dark:text-gray-300 mb-2 leading-6 line-clamp-2", children: metadata.description }),
217
- /* @__PURE__ */ jsx3("div", { className: "mt-auto", children: Link(
216
+ /* @__PURE__ */ jsx3("p", { className: "bk:text-sm bk:text-gray-500 bk:dark:text-gray-300 bk:mb-2 bk:leading-6 bk:line-clamp-2", children: metadata.description }),
217
+ /* @__PURE__ */ jsx3("div", { className: "bk:mt-auto", children: Link(
218
218
  href,
219
- /* @__PURE__ */ jsx3("span", { className: "inline-flex items-center text-blue-600 dark:text-blue-400 hover:text-blue-700 dark:hover:text-blue-300 font-medium text-sm", children: "Read more \u2192" })
219
+ /* @__PURE__ */ jsx3("span", { className: "bk:inline-flex bk:items-center bk:text-blue-600 bk:dark:text-blue-400 bk:hover:text-blue-700 bk:dark:hover:text-blue-300 bk:font-medium bk:text-sm", children: "Read more \u2192" })
220
220
  ) })
221
221
  ]
222
222
  }
@@ -234,9 +234,9 @@ function BlogList({
234
234
  cardProps
235
235
  }) {
236
236
  if (metadata.length === 0) {
237
- return /* @__PURE__ */ jsx4("div", { className: `text-center text-gray-500 dark:text-gray-400 py-12 ${className}`, children: emptyMessage });
237
+ return /* @__PURE__ */ jsx4("div", { className: `bk:text-center bk:text-gray-500 bk:dark:text-gray-400 bk:py-12 ${className}`, children: emptyMessage });
238
238
  }
239
- return /* @__PURE__ */ jsx4("div", { className: `flex flex-col gap-6 ${className}`, children: metadata.map((meta) => /* @__PURE__ */ jsx4(
239
+ return /* @__PURE__ */ jsx4("div", { className: `bk:flex bk:flex-col bk:gap-6 ${className}`, children: metadata.map((meta) => /* @__PURE__ */ jsx4(
240
240
  BlogCard,
241
241
  {
242
242
  metadata: meta,
@@ -254,11 +254,11 @@ function BlogPlaceholder({ count = 3, className = "" }) {
254
254
  return /* @__PURE__ */ jsx5("div", { className: `${className}`, children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ jsxs3(
255
255
  "div",
256
256
  {
257
- className: "bg-white dark:bg-gray-800 rounded-lg border border-gray-200 dark:border-gray-700 p-6 animate-pulse",
257
+ className: "bk:bg-white bk:dark:bg-gray-800 bk:rounded-lg bk:border bk:border-gray-200 bk:dark:border-gray-700 bk:p-6 bk:animate-pulse",
258
258
  children: [
259
- /* @__PURE__ */ jsx5("div", { className: "h-4 bg-gray-200 dark:bg-gray-700 rounded mb-3" }),
260
- /* @__PURE__ */ jsx5("div", { className: "h-6 bg-gray-200 dark:bg-gray-700 rounded mb-2" }),
261
- /* @__PURE__ */ jsx5("div", { className: "h-4 bg-gray-200 dark:bg-gray-700 rounded w-3/4" })
259
+ /* @__PURE__ */ jsx5("div", { className: "bk:h-4 bk:bg-gray-200 bk:dark:bg-gray-700 bk:rounded bk:mb-3" }),
260
+ /* @__PURE__ */ jsx5("div", { className: "bk:h-6 bk:bg-gray-200 bk:dark:bg-gray-700 bk:rounded bk:mb-2" }),
261
+ /* @__PURE__ */ jsx5("div", { className: "bk:h-4 bk:bg-gray-200 bk:dark:bg-gray-700 bk:rounded bk:w-3/4" })
262
262
  ]
263
263
  },
264
264
  i
@@ -266,19 +266,37 @@ function BlogPlaceholder({ count = 3, className = "" }) {
266
266
  }
267
267
 
268
268
  // src/hooks/useBlogs.ts
269
- import { useState, useEffect } from "react";
269
+ import { useState as useState2, useEffect as useEffect2 } from "react";
270
+
271
+ // src/hooks/useDebounce.ts
272
+ import { useEffect, useState } from "react";
273
+ function useDebounce(value, delay) {
274
+ const [debouncedValue, setDebouncedValue] = useState(value);
275
+ useEffect(() => {
276
+ const timer = setTimeout(() => {
277
+ setDebouncedValue(value);
278
+ }, delay);
279
+ return () => {
280
+ clearTimeout(timer);
281
+ };
282
+ }, [value, delay]);
283
+ return debouncedValue;
284
+ }
285
+
286
+ // src/hooks/useBlogs.ts
270
287
  function useBlogs(blogsMeta) {
271
- const [filteredBlogs, setFilteredBlogs] = useState(blogsMeta);
272
- const [searchTerm, setSearchTerm] = useState("");
273
- const [selectedCategory, setSelectedCategory] = useState(null);
288
+ const [filteredBlogs, setFilteredBlogs] = useState2(blogsMeta);
289
+ const [searchTerm, setSearchTerm] = useState2("");
290
+ const [selectedCategory, setSelectedCategory] = useState2(null);
291
+ const debouncedSearchTerm = useDebounce(searchTerm, 500);
274
292
  const getBlogCategories = (blog) => {
275
293
  return blog.categories ?? [];
276
294
  };
277
- useEffect(() => {
295
+ useEffect2(() => {
278
296
  let filtered = blogsMeta;
279
- if (searchTerm) {
297
+ if (debouncedSearchTerm) {
280
298
  filtered = filtered.filter(
281
- (blog) => blog.title.toLowerCase().includes(searchTerm.toLowerCase()) || blog.description.toLowerCase().includes(searchTerm.toLowerCase())
299
+ (blog) => blog.title.toLowerCase().includes(debouncedSearchTerm.toLowerCase()) || blog.description.toLowerCase().includes(debouncedSearchTerm.toLowerCase())
282
300
  );
283
301
  }
284
302
  if (selectedCategory) {
@@ -288,7 +306,7 @@ function useBlogs(blogsMeta) {
288
306
  });
289
307
  }
290
308
  setFilteredBlogs(filtered);
291
- }, [blogsMeta, searchTerm, selectedCategory]);
309
+ }, [blogsMeta, debouncedSearchTerm, selectedCategory]);
292
310
  const categories = Array.from(new Set(blogsMeta.flatMap((blog) => getBlogCategories(blog))));
293
311
  return {
294
312
  metadata: filteredBlogs,
package/dist/style.css CHANGED
@@ -1,2 +1,2 @@
1
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-amber-100:oklch(96.2% .059 95.617);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-500:oklch(76.9% .188 70.08);--color-amber-900:oklch(41.4% .112 45.904);--color-emerald-100:oklch(95% .052 163.051);--color-emerald-300:oklch(84.5% .143 164.978);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-900:oklch(37.8% .077 168.94);--color-teal-100:oklch(95.3% .051 180.801);--color-teal-300:oklch(85.5% .138 181.071);--color-teal-500:oklch(70.4% .14 182.503);--color-teal-900:oklch(38.6% .063 188.416);--color-cyan-100:oklch(95.6% .045 203.388);--color-cyan-300:oklch(86.5% .127 207.078);--color-cyan-500:oklch(71.5% .143 215.221);--color-cyan-900:oklch(39.8% .07 227.392);--color-blue-100:oklch(93.2% .032 255.585);--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-blue-900:oklch(37.9% .146 265.522);--color-violet-100:oklch(94.3% .029 294.588);--color-violet-300:oklch(81.1% .111 293.571);--color-violet-500:oklch(60.6% .25 292.717);--color-violet-900:oklch(38% .189 293.745);--color-fuchsia-100:oklch(95.2% .037 318.852);--color-fuchsia-300:oklch(83.3% .145 321.434);--color-fuchsia-500:oklch(66.7% .295 322.15);--color-fuchsia-900:oklch(40.1% .17 325.612);--color-rose-100:oklch(94.1% .03 12.58);--color-rose-300:oklch(81% .117 11.638);--color-rose-400:oklch(71.2% .194 13.428);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-600:oklch(58.6% .253 17.585);--color-rose-900:oklch(41% .159 10.272);--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)}.mt-auto{margin-top:auto}.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)}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.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}.min-h-\[200px\]{min-height:200px}.w-3\/4{width:75%}.w-full{width:100%}.max-w-full{max-width:100%}.max-w-none{max-width:none}.shrink-0{flex-shrink:0}.animate-pulse{animation:var(--animate-pulse)}.list-decimal{list-style-type:decimal}.list-disc{list-style-type:disc}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.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)}.gap-6{gap:calc(var(--spacing)*6)}: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)))}.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-amber-100{background-color:var(--color-amber-100)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-cyan-100{background-color:var(--color-cyan-100)}.bg-emerald-100{background-color:var(--color-emerald-100)}.bg-fuchsia-100{background-color:var(--color-fuchsia-100)}.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-rose-100{background-color:var(--color-rose-100)}.bg-teal-100{background-color:var(--color-teal-100)}.bg-violet-100{background-color:var(--color-violet-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)}.whitespace-nowrap{white-space:nowrap}.text-amber-500{color:var(--color-amber-500)}.text-blue-500{color:var(--color-blue-500)}.text-blue-600{color:var(--color-blue-600)}.text-cyan-500{color:var(--color-cyan-500)}.text-emerald-500{color:var(--color-emerald-500)}.text-fuchsia-500{color:var(--color-fuchsia-500)}.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-500{color:var(--color-rose-500)}.text-rose-600{color:var(--color-rose-600)}.text-teal-500{color:var(--color-teal-500)}.text-violet-500{color:var(--color-violet-500)}.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-amber-900\/30:is(html.dark *){background-color:#7b33064d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-amber-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-amber-900)30%,transparent)}}.dark\:bg-blue-900\/30:is(html.dark *){background-color:#1c398e4d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-blue-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-blue-900)30%,transparent)}}.dark\:bg-cyan-900\/30:is(html.dark *){background-color:#104e644d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-cyan-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-cyan-900)30%,transparent)}}.dark\:bg-emerald-900\/30:is(html.dark *){background-color:#004e3b4d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-emerald-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-emerald-900)30%,transparent)}}.dark\:bg-fuchsia-900\/30:is(html.dark *){background-color:#7213784d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-fuchsia-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-fuchsia-900)30%,transparent)}}.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\:bg-rose-900\/30:is(html.dark *){background-color:#8b08364d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-rose-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-rose-900)30%,transparent)}}.dark\:bg-teal-900\/30:is(html.dark *){background-color:#0b4f4a4d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-teal-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-teal-900)30%,transparent)}}.dark\:bg-violet-900\/30:is(html.dark *){background-color:#4d179a4d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-violet-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--color-violet-900)30%,transparent)}}.dark\:text-amber-300:is(html.dark *){color:var(--color-amber-300)}.dark\:text-blue-300:is(html.dark *){color:var(--color-blue-300)}.dark\:text-blue-400:is(html.dark *){color:var(--color-blue-400)}.dark\:text-cyan-300:is(html.dark *){color:var(--color-cyan-300)}.dark\:text-emerald-300:is(html.dark *){color:var(--color-emerald-300)}.dark\:text-fuchsia-300:is(html.dark *){color:var(--color-fuchsia-300)}.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-300:is(html.dark *){color:var(--color-rose-300)}.dark\:text-rose-400:is(html.dark *){color:var(--color-rose-400)}.dark\:text-teal-300:is(html.dark *){color:var(--color-teal-300)}.dark\:text-violet-300:is(html.dark *){color:var(--color-violet-300)}@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}}
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{--bk-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bk-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bk-color-orange-100:oklch(95.4% .038 75.164);--bk-color-orange-300:oklch(83.7% .128 66.29);--bk-color-orange-500:oklch(70.5% .213 47.604);--bk-color-orange-900:oklch(40.8% .123 38.172);--bk-color-amber-100:oklch(96.2% .059 95.617);--bk-color-amber-300:oklch(87.9% .169 91.605);--bk-color-amber-500:oklch(76.9% .188 70.08);--bk-color-amber-900:oklch(41.4% .112 45.904);--bk-color-emerald-100:oklch(95% .052 163.051);--bk-color-emerald-300:oklch(84.5% .143 164.978);--bk-color-emerald-500:oklch(69.6% .17 162.48);--bk-color-emerald-900:oklch(37.8% .077 168.94);--bk-color-teal-100:oklch(95.3% .051 180.801);--bk-color-teal-300:oklch(85.5% .138 181.071);--bk-color-teal-500:oklch(70.4% .14 182.503);--bk-color-teal-900:oklch(38.6% .063 188.416);--bk-color-cyan-100:oklch(95.6% .045 203.388);--bk-color-cyan-300:oklch(86.5% .127 207.078);--bk-color-cyan-500:oklch(71.5% .143 215.221);--bk-color-cyan-900:oklch(39.8% .07 227.392);--bk-color-blue-100:oklch(93.2% .032 255.585);--bk-color-blue-300:oklch(80.9% .105 251.813);--bk-color-blue-400:oklch(70.7% .165 254.624);--bk-color-blue-500:oklch(62.3% .214 259.815);--bk-color-blue-600:oklch(54.6% .245 262.881);--bk-color-blue-700:oklch(48.8% .243 264.376);--bk-color-blue-800:oklch(42.4% .199 265.638);--bk-color-blue-900:oklch(37.9% .146 265.522);--bk-color-violet-100:oklch(94.3% .029 294.588);--bk-color-violet-300:oklch(81.1% .111 293.571);--bk-color-violet-500:oklch(60.6% .25 292.717);--bk-color-violet-900:oklch(38% .189 293.745);--bk-color-fuchsia-100:oklch(95.2% .037 318.852);--bk-color-fuchsia-300:oklch(83.3% .145 321.434);--bk-color-fuchsia-500:oklch(66.7% .295 322.15);--bk-color-fuchsia-900:oklch(40.1% .17 325.612);--bk-color-rose-100:oklch(94.1% .03 12.58);--bk-color-rose-300:oklch(81% .117 11.638);--bk-color-rose-400:oklch(71.2% .194 13.428);--bk-color-rose-500:oklch(64.5% .246 16.439);--bk-color-rose-600:oklch(58.6% .253 17.585);--bk-color-rose-900:oklch(41% .159 10.272);--bk-color-gray-50:oklch(98.5% .002 247.839);--bk-color-gray-100:oklch(96.7% .003 264.542);--bk-color-gray-200:oklch(92.8% .006 264.531);--bk-color-gray-300:oklch(87.2% .01 258.338);--bk-color-gray-400:oklch(70.7% .022 261.325);--bk-color-gray-500:oklch(55.1% .027 264.364);--bk-color-gray-600:oklch(44.6% .03 256.802);--bk-color-gray-700:oklch(37.3% .034 259.733);--bk-color-gray-800:oklch(27.8% .033 256.848);--bk-color-neutral-900:oklch(20.5% 0 0);--bk-color-white:#fff;--bk-spacing:.25rem;--bk-text-xs:.75rem;--bk-text-xs--line-height:calc(1/.75);--bk-text-sm:.875rem;--bk-text-sm--line-height:calc(1.25/.875);--bk-text-base:1rem;--bk-text-base--line-height:calc(1.5/1);--bk-text-lg:1.125rem;--bk-text-lg--line-height:calc(1.75/1.125);--bk-text-xl:1.25rem;--bk-text-xl--line-height:calc(1.75/1.25);--bk-text-2xl:1.5rem;--bk-text-2xl--line-height:calc(2/1.5);--bk-text-3xl:1.875rem;--bk-text-3xl--line-height:calc(2.25/1.875);--bk-text-4xl:2.25rem;--bk-text-4xl--line-height:calc(2.5/2.25);--bk-font-weight-medium:500;--bk-font-weight-semibold:600;--bk-tracking-tight:-.025em;--bk-tracking-wide:.025em;--bk-radius-lg:.5rem;--bk-radius-xl:.75rem;--bk-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--bk-default-font-family:var(--bk-font-sans);--bk-default-mono-font-family:var(--bk-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(--bk-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(--bk-default-font-feature-settings,normal);font-variation-settings:var(--bk-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(--bk-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--bk-default-mono-font-feature-settings,normal);font-variation-settings:var(--bk-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{.bk\:my-6{margin-block:calc(var(--bk-spacing)*6)}.bk\:my-9{margin-block:calc(var(--bk-spacing)*9)}.bk\:mt-4{margin-top:calc(var(--bk-spacing)*4)}.bk\:mt-5{margin-top:calc(var(--bk-spacing)*5)}.bk\:mt-6{margin-top:calc(var(--bk-spacing)*6)}.bk\:mt-8{margin-top:calc(var(--bk-spacing)*8)}.bk\:mt-10{margin-top:calc(var(--bk-spacing)*10)}.bk\:mt-auto{margin-top:auto}.bk\:mr-2{margin-right:calc(var(--bk-spacing)*2)}.bk\:mb-2{margin-bottom:calc(var(--bk-spacing)*2)}.bk\:mb-3{margin-bottom:calc(var(--bk-spacing)*3)}.bk\:mb-4{margin-bottom:calc(var(--bk-spacing)*4)}.bk\:mb-5{margin-bottom:calc(var(--bk-spacing)*5)}.bk\:ml-6{margin-left:calc(var(--bk-spacing)*6)}.bk\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.bk\:flex{display:flex}.bk\:inline-flex{display:inline-flex}.bk\:h-4{height:calc(var(--bk-spacing)*4)}.bk\:h-6{height:calc(var(--bk-spacing)*6)}.bk\:h-auto{height:auto}.bk\:min-h-\[200px\]{min-height:200px}.bk\:w-3\/4{width:75%}.bk\:w-full{width:100%}.bk\:max-w-full{max-width:100%}.bk\:max-w-none{max-width:none}.bk\:shrink-0{flex-shrink:0}.bk\:animate-pulse{animation:var(--bk-animate-pulse)}.bk\:list-decimal{list-style-type:decimal}.bk\:list-disc{list-style-type:disc}.bk\:flex-col{flex-direction:column}.bk\:flex-nowrap{flex-wrap:nowrap}.bk\:flex-wrap{flex-wrap:wrap}.bk\:items-center{align-items:center}.bk\:justify-between{justify-content:space-between}.bk\:gap-1\.5{gap:calc(var(--bk-spacing)*1.5)}.bk\:gap-2{gap:calc(var(--bk-spacing)*2)}.bk\:gap-3{gap:calc(var(--bk-spacing)*3)}.bk\:gap-6{gap:calc(var(--bk-spacing)*6)}:where(.bk\:space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--bk-spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--bk-spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}.bk\:overflow-hidden{overflow:hidden}.bk\:overflow-x-auto{overflow-x:auto}.bk\:rounded{border-radius:.25rem}.bk\:rounded-full{border-radius:3.40282e38px}.bk\:rounded-lg{border-radius:var(--bk-radius-lg)}.bk\:rounded-xl{border-radius:var(--bk-radius-xl)}.bk\:border{border-style:var(--tw-border-style);border-width:1px}.bk\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.bk\:border-l-4{border-left-style:var(--tw-border-style);border-left-width:4px}.bk\:border-blue-500{border-color:var(--bk-color-blue-500)}.bk\:border-gray-200{border-color:var(--bk-color-gray-200)}.bk\:border-transparent{border-color:#0000}.bk\:bg-amber-100{background-color:var(--bk-color-amber-100)}.bk\:bg-blue-100{background-color:var(--bk-color-blue-100)}.bk\:bg-cyan-100{background-color:var(--bk-color-cyan-100)}.bk\:bg-emerald-100{background-color:var(--bk-color-emerald-100)}.bk\:bg-fuchsia-100{background-color:var(--bk-color-fuchsia-100)}.bk\:bg-gray-50{background-color:var(--bk-color-gray-50)}.bk\:bg-gray-100{background-color:var(--bk-color-gray-100)}.bk\:bg-gray-200{background-color:var(--bk-color-gray-200)}.bk\:bg-orange-100{background-color:var(--bk-color-orange-100)}.bk\:bg-rose-100{background-color:var(--bk-color-rose-100)}.bk\:bg-teal-100{background-color:var(--bk-color-teal-100)}.bk\:bg-violet-100{background-color:var(--bk-color-violet-100)}.bk\:bg-white{background-color:var(--bk-color-white)}.bk\:p-6{padding:calc(var(--bk-spacing)*6)}.bk\:px-1\.5{padding-inline:calc(var(--bk-spacing)*1.5)}.bk\:px-2\.5{padding-inline:calc(var(--bk-spacing)*2.5)}.bk\:px-4{padding-inline:calc(var(--bk-spacing)*4)}.bk\:py-0\.5{padding-block:calc(var(--bk-spacing)*.5)}.bk\:py-3{padding-block:calc(var(--bk-spacing)*3)}.bk\:py-12{padding-block:calc(var(--bk-spacing)*12)}.bk\:pl-4{padding-left:calc(var(--bk-spacing)*4)}.bk\:text-center{text-align:center}.bk\:text-left{text-align:left}.bk\:font-mono{font-family:var(--bk-font-mono)}.bk\:text-2xl{font-size:var(--bk-text-2xl);line-height:var(--tw-leading,var(--bk-text-2xl--line-height))}.bk\:text-3xl{font-size:var(--bk-text-3xl);line-height:var(--tw-leading,var(--bk-text-3xl--line-height))}.bk\:text-base{font-size:var(--bk-text-base);line-height:var(--tw-leading,var(--bk-text-base--line-height))}.bk\:text-lg{font-size:var(--bk-text-lg);line-height:var(--tw-leading,var(--bk-text-lg--line-height))}.bk\:text-sm{font-size:var(--bk-text-sm);line-height:var(--tw-leading,var(--bk-text-sm--line-height))}.bk\:text-xl{font-size:var(--bk-text-xl);line-height:var(--tw-leading,var(--bk-text-xl--line-height))}.bk\:text-xs{font-size:var(--bk-text-xs);line-height:var(--tw-leading,var(--bk-text-xs--line-height))}.bk\:leading-6{--tw-leading:calc(var(--bk-spacing)*6);line-height:calc(var(--bk-spacing)*6)}.bk\:leading-7{--tw-leading:calc(var(--bk-spacing)*7);line-height:calc(var(--bk-spacing)*7)}.bk\:font-medium{--tw-font-weight:var(--bk-font-weight-medium);font-weight:var(--bk-font-weight-medium)}.bk\:font-semibold{--tw-font-weight:var(--bk-font-weight-semibold);font-weight:var(--bk-font-weight-semibold)}.bk\:tracking-tight{--tw-tracking:var(--bk-tracking-tight);letter-spacing:var(--bk-tracking-tight)}.bk\:tracking-wide{--tw-tracking:var(--bk-tracking-wide);letter-spacing:var(--bk-tracking-wide)}.bk\:whitespace-nowrap{white-space:nowrap}.bk\:text-amber-500{color:var(--bk-color-amber-500)}.bk\:text-blue-500{color:var(--bk-color-blue-500)}.bk\:text-blue-600{color:var(--bk-color-blue-600)}.bk\:text-cyan-500{color:var(--bk-color-cyan-500)}.bk\:text-emerald-500{color:var(--bk-color-emerald-500)}.bk\:text-fuchsia-500{color:var(--bk-color-fuchsia-500)}.bk\:text-gray-500{color:var(--bk-color-gray-500)}.bk\:text-gray-600{color:var(--bk-color-gray-600)}.bk\:text-gray-700{color:var(--bk-color-gray-700)}.bk\:text-gray-800{color:var(--bk-color-gray-800)}.bk\:text-orange-500{color:var(--bk-color-orange-500)}.bk\:text-rose-500{color:var(--bk-color-rose-500)}.bk\:text-rose-600{color:var(--bk-color-rose-600)}.bk\:text-teal-500{color:var(--bk-color-teal-500)}.bk\:text-violet-500{color:var(--bk-color-violet-500)}.bk\:uppercase{text-transform:uppercase}.bk\:italic{font-style:italic}.bk\:underline{text-decoration-line:underline}.bk\:underline-offset-4{text-underline-offset:4px}.bk\:accent-blue-600{accent-color:var(--bk-color-blue-600)}.bk\: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))}.bk\:first\:mt-0:first-child{margin-top:calc(var(--bk-spacing)*0)}.bk\:last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.bk\:hover\:border-gray-300:hover{border-color:var(--bk-color-gray-300)}.bk\:hover\:text-blue-700:hover{color:var(--bk-color-blue-700)}.bk\:hover\:text-blue-800:hover{color:var(--bk-color-blue-800)}.bk\:hover\:underline:hover{text-decoration-line:underline}}@media (min-width:48rem){.bk\:md\:text-2xl{font-size:var(--bk-text-2xl);line-height:var(--tw-leading,var(--bk-text-2xl--line-height))}.bk\:md\:text-3xl{font-size:var(--bk-text-3xl);line-height:var(--tw-leading,var(--bk-text-3xl--line-height))}.bk\:md\:text-4xl{font-size:var(--bk-text-4xl);line-height:var(--tw-leading,var(--bk-text-4xl--line-height))}}.bk\:dark\:border-gray-700:is(html.dark *){border-color:var(--bk-color-gray-700)}.bk\:dark\:border-neutral-900:is(html.dark *){border-color:var(--bk-color-neutral-900)}.bk\:dark\:bg-amber-900\/30:is(html.dark *){background-color:var(--bk-color-amber-900)}@supports (color:color-mix(in lab, red, red)){.bk\:dark\:bg-amber-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--bk-color-amber-900)30%,transparent)}}.bk\:dark\:bg-blue-900\/30:is(html.dark *){background-color:var(--bk-color-blue-900)}@supports (color:color-mix(in lab, red, red)){.bk\:dark\:bg-blue-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--bk-color-blue-900)30%,transparent)}}.bk\:dark\:bg-cyan-900\/30:is(html.dark *){background-color:var(--bk-color-cyan-900)}@supports (color:color-mix(in lab, red, red)){.bk\:dark\:bg-cyan-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--bk-color-cyan-900)30%,transparent)}}.bk\:dark\:bg-emerald-900\/30:is(html.dark *){background-color:var(--bk-color-emerald-900)}@supports (color:color-mix(in lab, red, red)){.bk\:dark\:bg-emerald-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--bk-color-emerald-900)30%,transparent)}}.bk\:dark\:bg-fuchsia-900\/30:is(html.dark *){background-color:var(--bk-color-fuchsia-900)}@supports (color:color-mix(in lab, red, red)){.bk\:dark\:bg-fuchsia-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--bk-color-fuchsia-900)30%,transparent)}}.bk\:dark\:bg-gray-700:is(html.dark *){background-color:var(--bk-color-gray-700)}.bk\:dark\:bg-gray-800:is(html.dark *){background-color:var(--bk-color-gray-800)}.bk\:dark\:bg-orange-900\/30:is(html.dark *){background-color:var(--bk-color-orange-900)}@supports (color:color-mix(in lab, red, red)){.bk\:dark\:bg-orange-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--bk-color-orange-900)30%,transparent)}}.bk\:dark\:bg-rose-900\/30:is(html.dark *){background-color:var(--bk-color-rose-900)}@supports (color:color-mix(in lab, red, red)){.bk\:dark\:bg-rose-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--bk-color-rose-900)30%,transparent)}}.bk\:dark\:bg-teal-900\/30:is(html.dark *){background-color:var(--bk-color-teal-900)}@supports (color:color-mix(in lab, red, red)){.bk\:dark\:bg-teal-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--bk-color-teal-900)30%,transparent)}}.bk\:dark\:bg-violet-900\/30:is(html.dark *){background-color:var(--bk-color-violet-900)}@supports (color:color-mix(in lab, red, red)){.bk\:dark\:bg-violet-900\/30:is(html.dark *){background-color:color-mix(in oklab,var(--bk-color-violet-900)30%,transparent)}}.bk\:dark\:text-amber-300:is(html.dark *){color:var(--bk-color-amber-300)}.bk\:dark\:text-blue-300:is(html.dark *){color:var(--bk-color-blue-300)}.bk\:dark\:text-blue-400:is(html.dark *){color:var(--bk-color-blue-400)}.bk\:dark\:text-cyan-300:is(html.dark *){color:var(--bk-color-cyan-300)}.bk\:dark\:text-emerald-300:is(html.dark *){color:var(--bk-color-emerald-300)}.bk\:dark\:text-fuchsia-300:is(html.dark *){color:var(--bk-color-fuchsia-300)}.bk\:dark\:text-gray-100:is(html.dark *){color:var(--bk-color-gray-100)}.bk\:dark\:text-gray-200:is(html.dark *){color:var(--bk-color-gray-200)}.bk\:dark\:text-gray-300:is(html.dark *){color:var(--bk-color-gray-300)}.bk\:dark\:text-gray-400:is(html.dark *){color:var(--bk-color-gray-400)}.bk\:dark\:text-orange-300:is(html.dark *){color:var(--bk-color-orange-300)}.bk\:dark\:text-rose-300:is(html.dark *){color:var(--bk-color-rose-300)}.bk\:dark\:text-rose-400:is(html.dark *){color:var(--bk-color-rose-400)}.bk\:dark\:text-teal-300:is(html.dark *){color:var(--bk-color-teal-300)}.bk\:dark\:text-violet-300:is(html.dark *){color:var(--bk-color-violet-300)}@media (hover:hover){.bk\:dark\:hover\:border-gray-600:is(html.dark *):hover{border-color:var(--bk-color-gray-600)}.bk\:dark\:hover\:text-blue-300:is(html.dark *):hover{color:var(--bk-color-blue-300)}}}@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.2.9",
3
+ "version": "1.3.1",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",
@@ -14,8 +14,10 @@
14
14
  "markdown",
15
15
  "react",
16
16
  "nextjs",
17
+ "nextjs-blog",
17
18
  "blog-engine",
18
19
  "ssg",
20
+ "server-components",
19
21
  "blog-kit"
20
22
  ],
21
23
  "author": "Haroon (https://github.com/haroonwaves)",