@docubook/mdx 1.0.0 → 1.1.0

package/dist/core/server.cjs

@@ -116,6 +116,7 @@ function Card({
     "div",
     {
       className: (0, import_clsx.default)(
+        "dbk-card",
         "border rounded-lg shadow-sm p-4 transition-all duration-200",
         "bg-card text-card-foreground border-border",
         "hover:bg-accent/5 hover:border-accent/30",
@@ -123,20 +124,21 @@ function Card({
         horizontal ? "flex-row items-start gap-1" : "flex-col space-y-1",
         className
       ),
+      "data-docubook": "card",
       children: [
-        Icon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { className: (0, import_clsx.default)("w-5 h-5 text-primary shrink-0", horizontal && "mt-0.5") }),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex-1 min-w-0", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "text-base font-semibold text-foreground leading-6", children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "text-sm text-muted-foreground -mt-3", children })
+        Icon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { className: (0, import_clsx.default)("dbk-card__icon", "w-5 h-5 text-primary shrink-0", horizontal && "mt-0.5"), "data-docubook": "card-icon" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "dbk-card__body flex-1 min-w-0", "data-docubook": "card-body", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "dbk-card__title text-base font-semibold text-foreground leading-6", "data-docubook": "card-title", children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "dbk-card__content text-sm text-muted-foreground -mt-3", "data-docubook": "card-content", children })
         ] })
       ]
     }
   );
   if (!href) return content;
   if (LinkComponent) {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LinkComponent, { href, className: "no-underline block", children: content });
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LinkComponent, { href, className: "dbk-card__link no-underline block", "data-docubook": "card-link", children: content });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("a", { className: "no-underline block", href, children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("a", { className: "dbk-card__link no-underline block", href, "data-docubook": "card-link", children: content });
 }
 
 // src/core/components/CardGroup.tsx
@@ -221,7 +223,8 @@ function Kbd({
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     "kbd",
     {
-      className: "inline-flex items-center justify-center px-2 py-1 mx-0.5 text-xs font-mono font-medium text-foreground bg-secondary/70 border rounded-md",
+      className: "dbk-kbd inline-flex items-center justify-center px-2 py-1 mx-0.5 text-xs font-mono font-medium text-foreground bg-secondary/70 border rounded-md",
+      "data-docubook": "kbd",
       ...props,
       children: renderContent()
     }
@@ -284,6 +287,12 @@ var iconMap = {
   warning: import_lucide_react.AlertTriangle,
   success: import_lucide_react.CheckCircle2
 };
+var noteDefaultClasses = {
+  icon: "h-5 w-5",
+  contentWrapper: "pl-8",
+  title: "mb-1 font-medium leading-none tracking-tight",
+  content: "text-sm [&_p]:leading-relaxed opacity-90"
+};
 function Note({
   className,
   title = "Note",
@@ -292,13 +301,24 @@ function Note({
   ...props
 }) {
   const Icon = iconMap[type] || import_lucide_react.Info;
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: cn(noteVariants({ variant: type }), className), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Icon, { className: "h-5 w-5" }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "pl-8", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h5", { className: "mb-1 font-medium leading-none tracking-tight", children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "text-sm [&_p]:leading-relaxed opacity-90", children })
-    ] })
-  ] });
+  const noteRole = type === "danger" ? "alert" : "status";
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+    "div",
+    {
+      className: cn("dbk-note", noteVariants({ variant: type }), className),
+      "data-docubook": "note",
+      "data-variant": type,
+      role: noteRole,
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Icon, { className: cn("dbk-note__icon", noteDefaultClasses.icon), "data-docubook": "note-icon" }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: cn("dbk-note__content-wrapper", noteDefaultClasses.contentWrapper), "data-docubook": "note-content-wrapper", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h5", { className: cn("dbk-note__title", noteDefaultClasses.title), "data-docubook": "note-title", children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn("dbk-note__content", noteDefaultClasses.content), "data-docubook": "note-content", children })
+        ] })
+      ]
+    }
+  );
 }
 
 // src/core/components/Release.tsx
@@ -306,30 +326,31 @@ var import_react2 = require("react");
 var import_lucide_react2 = require("lucide-react");
 var import_jsx_runtime7 = require("react/jsx-runtime");
 function Release({ version, title, date, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "mb-16 group", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-3 mt-6 mb-2", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dbk-release mb-16 group", "data-docubook": "release", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dbk-release__header flex items-center gap-3 mt-6 mb-2", "data-docubook": "release-header", children: [
       /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
         "div",
         {
           id: version,
-          className: "inline-flex items-center rounded-full border border-primary/20 bg-primary/10 px-3 py-1 text-sm font-semibold text-primary transition-colors hover:bg-primary/15 scroll-m-20 backdrop-blur-sm",
+          className: "dbk-release__version inline-flex items-center rounded-full border border-primary/20 bg-primary/10 px-3 py-1 text-sm font-semibold text-primary transition-colors hover:bg-primary/15 scroll-m-20 backdrop-blur-sm",
+          "data-docubook": "release-version",
           children: [
             "v",
             version
           ]
         }
       ),
-      date && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-3 text-sm font-medium text-muted-foreground", children: [
+      date && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dbk-release__date-wrapper flex items-center gap-3 text-sm font-medium text-muted-foreground", "data-docubook": "release-date-wrapper", children: [
         /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "h-1 w-1 rounded-full bg-muted-foreground/30" }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("time", { dateTime: date, children: new Date(date).toLocaleDateString("en-US", {
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("time", { className: "dbk-release__date", "data-docubook": "release-date", dateTime: date, children: new Date(date).toLocaleDateString("en-US", {
           year: "numeric",
           month: "long",
           day: "numeric"
         }) })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h3", { className: "text-2xl font-bold text-foreground/90 mb-6 mt-0!", children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "space-y-8", children })
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h3", { className: "dbk-release__title text-2xl font-bold text-foreground/90 mb-6 mt-0!", "data-docubook": "release-title", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "dbk-release__content space-y-8", "data-docubook": "release-content", children })
   ] });
 }
 var typeConfig = {
@@ -361,23 +382,25 @@ var typeConfig = {
 };
 function Changes({ type, children }) {
   const config = typeConfig[type] || typeConfig.added;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "space-y-3 mb-8", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dbk-release-changes space-y-3 mb-8", "data-docubook": "release-changes", "data-type": type, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "dbk-release-changes__header flex items-center gap-2", "data-docubook": "release-changes-header", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
       "div",
       {
         className: cn(
+          "dbk-release-changes__badge",
           "px-3 py-1 rounded-full text-sm font-medium flex items-center gap-1.5",
           config.className
         ),
+        "data-docubook": "release-changes-badge",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(config.icon, { className: "h-3.5 w-3.5" }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: config.label })
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(config.icon, { className: "dbk-release-changes__icon h-3.5 w-3.5", "data-docubook": "release-changes-icon" }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dbk-release-changes__label", "data-docubook": "release-changes-label", children: config.label })
         ]
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("ul", { className: "list-none pl-0 space-y-2 text-foreground/80", children: import_react2.Children.map(children, (child, index) => {
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("ul", { className: "dbk-release-changes__list list-none pl-0 space-y-2 text-foreground/80", "data-docubook": "release-changes-list", children: import_react2.Children.map(children, (child, index) => {
       const processedChild = typeof child === "string" ? child.trim().replace(/^[-*]\s+/, "") : child;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("li", { className: "leading-relaxed", children: processedChild }, index);
+      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("li", { className: "dbk-release-changes__item leading-relaxed", "data-docubook": "release-changes-item", children: processedChild }, index);
     }) })
   ] });
 }
@@ -386,20 +409,35 @@ function Changes({ type, children }) {
 var import_clsx4 = __toESM(require("clsx"), 1);
 var import_react3 = require("react");
 var import_jsx_runtime8 = require("react/jsx-runtime");
-function Stepper({ children }) {
+var stepperDefaultClasses = {
+  root: "flex flex-col",
+  item: "border-l border-muted pl-9 ml-3 relative",
+  itemWithConnector: "pb-5 ",
+  number: "bg-muted text-muted-foreground w-8 h-8 text-xs font-medium rounded-md border border-border/50 flex items-center justify-center absolute -left-4 font-code"
+};
+var stepperItemDefaultClasses = {
+  root: "pt-0.5",
+  title: "mt-0",
+  content: ""
+};
+function Stepper({
+  children
+}) {
   const length = import_react3.Children.count(children);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "flex flex-col", children: import_react3.Children.map(children, (child, index) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("ol", { className: cn("dbk-stepper", stepperDefaultClasses.root), "data-docubook": "stepper", children: import_react3.Children.map(children, (child, index) => {
     return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-      "div",
+      "li",
       {
         className: cn(
-          "border-l border-muted pl-9 ml-3 relative",
+          "dbk-stepper__item",
+          stepperDefaultClasses.item,
           (0, import_clsx4.default)({
-            "pb-5 ": index < length - 1
+            [stepperDefaultClasses.itemWithConnector]: index < length - 1
           })
         ),
+        "data-docubook": "stepper-item",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "bg-muted text-muted-foreground w-8 h-8 text-xs font-medium rounded-md border border-border/50 flex items-center justify-center absolute -left-4 font-code", children: index + 1 }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: cn("dbk-stepper__number", stepperDefaultClasses.number), "data-docubook": "stepper-number", "aria-hidden": "true", children: index + 1 }),
           child
         ]
       }
@@ -410,9 +448,9 @@ function StepperItem({
   children,
   title
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "pt-0.5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h4", { className: "mt-0", children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { children })
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: cn("dbk-stepper-item", stepperItemDefaultClasses.root), "data-docubook": "stepper-item-content", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h4", { className: cn("dbk-stepper-item__title", stepperItemDefaultClasses.title), "data-docubook": "stepper-item-title", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: cn("dbk-stepper-item__content", stepperItemDefaultClasses.content), "data-docubook": "stepper-item-body", children })
   ] });
 }
 

package/dist/core/server.d.cts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { C as CardGroup, K as Kbd, N as Note, S as Stepper, a as StepperItem, Y as YoutubeProps, R as Release, b as Changes, L as Link } from '../Stepper-B7xt0Dyr.cjs';
-export { c as Youtube } from '../Stepper-B7xt0Dyr.cjs';
+import { C as CardGroup, K as Kbd, N as Note, S as Stepper, a as StepperItem, Y as YoutubeProps, R as Release, b as Changes, L as Link } from '../Stepper-I9nywkZb.cjs';
+export { c as Youtube } from '../Stepper-I9nywkZb.cjs';
 import { B as Button, C as Card } from '../Card-L5O7G4xG.cjs';
 export { L as LinkLikeProps, a as LinkRenderer } from '../Card-L5O7G4xG.cjs';
 import 'react/jsx-runtime';

package/dist/core/server.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { C as CardGroup, K as Kbd, N as Note, S as Stepper, a as StepperItem, Y as YoutubeProps, R as Release, b as Changes, L as Link } from '../Stepper-B7xt0Dyr.js';
-export { c as Youtube } from '../Stepper-B7xt0Dyr.js';
+import { C as CardGroup, K as Kbd, N as Note, S as Stepper, a as StepperItem, Y as YoutubeProps, R as Release, b as Changes, L as Link } from '../Stepper-I9nywkZb.js';
+export { c as Youtube } from '../Stepper-I9nywkZb.js';
 import { B as Button, C as Card } from '../Card-L5O7G4xG.js';
 export { L as LinkLikeProps, a as LinkRenderer } from '../Card-L5O7G4xG.js';
 import 'react/jsx-runtime';

package/dist/core/server.js

@@ -69,6 +69,7 @@ function Card({
     "div",
     {
       className: clsx(
+        "dbk-card",
         "border rounded-lg shadow-sm p-4 transition-all duration-200",
         "bg-card text-card-foreground border-border",
         "hover:bg-accent/5 hover:border-accent/30",
@@ -76,20 +77,21 @@ function Card({
         horizontal ? "flex-row items-start gap-1" : "flex-col space-y-1",
         className
       ),
+      "data-docubook": "card",
       children: [
-        Icon && /* @__PURE__ */ jsx2(Icon, { className: clsx("w-5 h-5 text-primary shrink-0", horizontal && "mt-0.5") }),
-        /* @__PURE__ */ jsxs2("div", { className: "flex-1 min-w-0", children: [
-          /* @__PURE__ */ jsx2("div", { className: "text-base font-semibold text-foreground leading-6", children: title }),
-          /* @__PURE__ */ jsx2("div", { className: "text-sm text-muted-foreground -mt-3", children })
+        Icon && /* @__PURE__ */ jsx2(Icon, { className: clsx("dbk-card__icon", "w-5 h-5 text-primary shrink-0", horizontal && "mt-0.5"), "data-docubook": "card-icon" }),
+        /* @__PURE__ */ jsxs2("div", { className: "dbk-card__body flex-1 min-w-0", "data-docubook": "card-body", children: [
+          /* @__PURE__ */ jsx2("div", { className: "dbk-card__title text-base font-semibold text-foreground leading-6", "data-docubook": "card-title", children: title }),
+          /* @__PURE__ */ jsx2("div", { className: "dbk-card__content text-sm text-muted-foreground -mt-3", "data-docubook": "card-content", children })
         ] })
       ]
     }
   );
   if (!href) return content;
   if (LinkComponent) {
-    return /* @__PURE__ */ jsx2(LinkComponent, { href, className: "no-underline block", children: content });
+    return /* @__PURE__ */ jsx2(LinkComponent, { href, className: "dbk-card__link no-underline block", "data-docubook": "card-link", children: content });
   }
-  return /* @__PURE__ */ jsx2("a", { className: "no-underline block", href, children: content });
+  return /* @__PURE__ */ jsx2("a", { className: "dbk-card__link no-underline block", href, "data-docubook": "card-link", children: content });
 }
 
 // src/core/components/CardGroup.tsx
@@ -174,7 +176,8 @@ function Kbd({
   return /* @__PURE__ */ jsx4(
     "kbd",
     {
-      className: "inline-flex items-center justify-center px-2 py-1 mx-0.5 text-xs font-mono font-medium text-foreground bg-secondary/70 border rounded-md",
+      className: "dbk-kbd inline-flex items-center justify-center px-2 py-1 mx-0.5 text-xs font-mono font-medium text-foreground bg-secondary/70 border rounded-md",
+      "data-docubook": "kbd",
       ...props,
       children: renderContent()
     }
@@ -242,6 +245,12 @@ var iconMap = {
   warning: AlertTriangle,
   success: CheckCircle2
 };
+var noteDefaultClasses = {
+  icon: "h-5 w-5",
+  contentWrapper: "pl-8",
+  title: "mb-1 font-medium leading-none tracking-tight",
+  content: "text-sm [&_p]:leading-relaxed opacity-90"
+};
 function Note({
   className,
   title = "Note",
@@ -250,13 +259,24 @@ function Note({
   ...props
 }) {
   const Icon = iconMap[type] || Info;
-  return /* @__PURE__ */ jsxs3("div", { className: cn(noteVariants({ variant: type }), className), ...props, children: [
-    /* @__PURE__ */ jsx6(Icon, { className: "h-5 w-5" }),
-    /* @__PURE__ */ jsxs3("div", { className: "pl-8", children: [
-      /* @__PURE__ */ jsx6("h5", { className: "mb-1 font-medium leading-none tracking-tight", children: title }),
-      /* @__PURE__ */ jsx6("div", { className: "text-sm [&_p]:leading-relaxed opacity-90", children })
-    ] })
-  ] });
+  const noteRole = type === "danger" ? "alert" : "status";
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      className: cn("dbk-note", noteVariants({ variant: type }), className),
+      "data-docubook": "note",
+      "data-variant": type,
+      role: noteRole,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx6(Icon, { className: cn("dbk-note__icon", noteDefaultClasses.icon), "data-docubook": "note-icon" }),
+        /* @__PURE__ */ jsxs3("div", { className: cn("dbk-note__content-wrapper", noteDefaultClasses.contentWrapper), "data-docubook": "note-content-wrapper", children: [
+          /* @__PURE__ */ jsx6("h5", { className: cn("dbk-note__title", noteDefaultClasses.title), "data-docubook": "note-title", children: title }),
+          /* @__PURE__ */ jsx6("div", { className: cn("dbk-note__content", noteDefaultClasses.content), "data-docubook": "note-content", children })
+        ] })
+      ]
+    }
+  );
 }
 
 // src/core/components/Release.tsx
@@ -270,30 +290,31 @@ import {
 } from "lucide-react";
 import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
 function Release({ version, title, date, children }) {
-  return /* @__PURE__ */ jsxs4("div", { className: "mb-16 group", children: [
-    /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-3 mt-6 mb-2", children: [
+  return /* @__PURE__ */ jsxs4("div", { className: "dbk-release mb-16 group", "data-docubook": "release", children: [
+    /* @__PURE__ */ jsxs4("div", { className: "dbk-release__header flex items-center gap-3 mt-6 mb-2", "data-docubook": "release-header", children: [
       /* @__PURE__ */ jsxs4(
         "div",
         {
           id: version,
-          className: "inline-flex items-center rounded-full border border-primary/20 bg-primary/10 px-3 py-1 text-sm font-semibold text-primary transition-colors hover:bg-primary/15 scroll-m-20 backdrop-blur-sm",
+          className: "dbk-release__version inline-flex items-center rounded-full border border-primary/20 bg-primary/10 px-3 py-1 text-sm font-semibold text-primary transition-colors hover:bg-primary/15 scroll-m-20 backdrop-blur-sm",
+          "data-docubook": "release-version",
           children: [
             "v",
             version
           ]
         }
       ),
-      date && /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-3 text-sm font-medium text-muted-foreground", children: [
+      date && /* @__PURE__ */ jsxs4("div", { className: "dbk-release__date-wrapper flex items-center gap-3 text-sm font-medium text-muted-foreground", "data-docubook": "release-date-wrapper", children: [
         /* @__PURE__ */ jsx7("span", { className: "h-1 w-1 rounded-full bg-muted-foreground/30" }),
-        /* @__PURE__ */ jsx7("time", { dateTime: date, children: new Date(date).toLocaleDateString("en-US", {
+        /* @__PURE__ */ jsx7("time", { className: "dbk-release__date", "data-docubook": "release-date", dateTime: date, children: new Date(date).toLocaleDateString("en-US", {
           year: "numeric",
           month: "long",
           day: "numeric"
         }) })
       ] })
     ] }),
-    /* @__PURE__ */ jsx7("h3", { className: "text-2xl font-bold text-foreground/90 mb-6 mt-0!", children: title }),
-    /* @__PURE__ */ jsx7("div", { className: "space-y-8", children })
+    /* @__PURE__ */ jsx7("h3", { className: "dbk-release__title text-2xl font-bold text-foreground/90 mb-6 mt-0!", "data-docubook": "release-title", children: title }),
+    /* @__PURE__ */ jsx7("div", { className: "dbk-release__content space-y-8", "data-docubook": "release-content", children })
   ] });
 }
 var typeConfig = {
@@ -325,23 +346,25 @@ var typeConfig = {
 };
 function Changes({ type, children }) {
   const config = typeConfig[type] || typeConfig.added;
-  return /* @__PURE__ */ jsxs4("div", { className: "space-y-3 mb-8", children: [
-    /* @__PURE__ */ jsx7("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs4("div", { className: "dbk-release-changes space-y-3 mb-8", "data-docubook": "release-changes", "data-type": type, children: [
+    /* @__PURE__ */ jsx7("div", { className: "dbk-release-changes__header flex items-center gap-2", "data-docubook": "release-changes-header", children: /* @__PURE__ */ jsxs4(
       "div",
       {
         className: cn(
+          "dbk-release-changes__badge",
           "px-3 py-1 rounded-full text-sm font-medium flex items-center gap-1.5",
           config.className
         ),
+        "data-docubook": "release-changes-badge",
         children: [
-          /* @__PURE__ */ jsx7(config.icon, { className: "h-3.5 w-3.5" }),
-          /* @__PURE__ */ jsx7("span", { children: config.label })
+          /* @__PURE__ */ jsx7(config.icon, { className: "dbk-release-changes__icon h-3.5 w-3.5", "data-docubook": "release-changes-icon" }),
+          /* @__PURE__ */ jsx7("span", { className: "dbk-release-changes__label", "data-docubook": "release-changes-label", children: config.label })
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx7("ul", { className: "list-none pl-0 space-y-2 text-foreground/80", children: Children.map(children, (child, index) => {
+    /* @__PURE__ */ jsx7("ul", { className: "dbk-release-changes__list list-none pl-0 space-y-2 text-foreground/80", "data-docubook": "release-changes-list", children: Children.map(children, (child, index) => {
       const processedChild = typeof child === "string" ? child.trim().replace(/^[-*]\s+/, "") : child;
-      return /* @__PURE__ */ jsx7("li", { className: "leading-relaxed", children: processedChild }, index);
+      return /* @__PURE__ */ jsx7("li", { className: "dbk-release-changes__item leading-relaxed", "data-docubook": "release-changes-item", children: processedChild }, index);
     }) })
   ] });
 }
@@ -350,20 +373,35 @@ function Changes({ type, children }) {
 import clsx4 from "clsx";
 import { Children as Children2 } from "react";
 import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
-function Stepper({ children }) {
+var stepperDefaultClasses = {
+  root: "flex flex-col",
+  item: "border-l border-muted pl-9 ml-3 relative",
+  itemWithConnector: "pb-5 ",
+  number: "bg-muted text-muted-foreground w-8 h-8 text-xs font-medium rounded-md border border-border/50 flex items-center justify-center absolute -left-4 font-code"
+};
+var stepperItemDefaultClasses = {
+  root: "pt-0.5",
+  title: "mt-0",
+  content: ""
+};
+function Stepper({
+  children
+}) {
   const length = Children2.count(children);
-  return /* @__PURE__ */ jsx8("div", { className: "flex flex-col", children: Children2.map(children, (child, index) => {
+  return /* @__PURE__ */ jsx8("ol", { className: cn("dbk-stepper", stepperDefaultClasses.root), "data-docubook": "stepper", children: Children2.map(children, (child, index) => {
     return /* @__PURE__ */ jsxs5(
-      "div",
+      "li",
       {
         className: cn(
-          "border-l border-muted pl-9 ml-3 relative",
+          "dbk-stepper__item",
+          stepperDefaultClasses.item,
           clsx4({
-            "pb-5 ": index < length - 1
+            [stepperDefaultClasses.itemWithConnector]: index < length - 1
           })
         ),
+        "data-docubook": "stepper-item",
         children: [
-          /* @__PURE__ */ jsx8("div", { className: "bg-muted text-muted-foreground w-8 h-8 text-xs font-medium rounded-md border border-border/50 flex items-center justify-center absolute -left-4 font-code", children: index + 1 }),
+          /* @__PURE__ */ jsx8("div", { className: cn("dbk-stepper__number", stepperDefaultClasses.number), "data-docubook": "stepper-number", "aria-hidden": "true", children: index + 1 }),
           child
         ]
       }
@@ -374,9 +412,9 @@ function StepperItem({
   children,
   title
 }) {
-  return /* @__PURE__ */ jsxs5("div", { className: "pt-0.5", children: [
-    /* @__PURE__ */ jsx8("h4", { className: "mt-0", children: title }),
-    /* @__PURE__ */ jsx8("div", { children })
+  return /* @__PURE__ */ jsxs5("div", { className: cn("dbk-stepper-item", stepperItemDefaultClasses.root), "data-docubook": "stepper-item-content", children: [
+    /* @__PURE__ */ jsx8("h4", { className: cn("dbk-stepper-item__title", stepperItemDefaultClasses.title), "data-docubook": "stepper-item-title", children: title }),
+    /* @__PURE__ */ jsx8("div", { className: cn("dbk-stepper-item__content", stepperItemDefaultClasses.content), "data-docubook": "stepper-item-body", children })
   ] });
 }