@dreamlake/dockit 0.2.23 → 0.2.25

package/dist/components/CodeBlock.js

@@ -99,7 +99,7 @@ function CodeBlock({ children, filename, lang }) {
           "div",
           {
             className: "absolute top-0 right-0 z-10 flex items-center opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity duration-150",
-            style: { gap: 6, padding: embedded ? "3px 8px" : "8px 8px", isolation: "isolate" },
+            style: { gap: embedded ? 8 : 6, padding: embedded ? "3px 0 3px 8px" : "8px 8px", isolation: "isolate" },
             children: [
               /* @__PURE__ */ jsx(
                 "span",

package/dist/components/CodeTabs.js

@@ -12,7 +12,7 @@ function CodeTabs({ children, "aria-label": label = "Code examples" }) {
   const id = useId();
   const buttons = useRef([]);
   if (!examples.length) return null;
-  return /* @__PURE__ */ jsx("div", { "data-code-tabs": true, className: "dockit-code-tabs group relative", children: /* @__PURE__ */ jsxs(Tabs, { value: String(active), onValueChange: (value) => setSelected(Number(value)), children: [
+  return /* @__PURE__ */ jsx("div", { "data-code-tabs": true, "data-first-active": active === 0, className: "dockit-code-tabs group relative", children: /* @__PURE__ */ jsxs(Tabs, { value: String(active), onValueChange: (value) => setSelected(Number(value)), children: [
     /* @__PURE__ */ jsx("div", { className: "dockit-code-tabs-header", children: /* @__PURE__ */ jsx(TabsList, { "aria-label": label, className: "dockit-code-tabs-list border-0 font-doc-template-ui", children: examples.map((example, index) => /* @__PURE__ */ jsx(
       TabsTrigger,
       {

package/dist/styles.css

@@ -383,18 +383,17 @@
    their code/control state but are absent from keyboard and accessibility flow. */
 .dockit-code-tabs {
   margin: 18px 0 22px;
-  border-radius: var(--radius-doc-template);
+  border-radius: 6px 6px var(--radius-doc-template) var(--radius-doc-template);
   overflow: hidden;
 }
 .dockit-code-tabs-header {
   background: var(--color-doc-template-bg);
-  box-shadow: inset 0 -1px var(--color-doc-template-faint);
   min-height: 30px;
-  padding: 0 156px 0 12px;
+  padding: 0 156px 0 0;
 }
 .dockit-code-tabs-list { overflow-x: auto; min-height: 30px; gap: 2px; }
 /* Raised file-tab geometry follows Studio's chat TabStrip. UIKit supplies the
-   compound primitives; the active page-colored bottom edge opens the baseline. */
+   compound primitives; the active code-colored bottom edge opens the baseline. */
 .dockit-code-tabs-list [role='tab'] {
   margin: 0 1px;
   padding: 3px 9px 4px;
@@ -403,10 +402,17 @@
   background: transparent;
   line-height: 18px;
 }
+.dockit-code-tabs-list [role='tab']:first-child { margin-left: 0; }
+.dockit-code-tabs-list [role='tab'][aria-selected='false']:hover {
+  border-color: var(--color-doc-template-faint);
+  border-bottom-color: transparent;
+  color: var(--color-doc-template-ink);
+}
 .dockit-code-tabs-list [role='tab'][aria-selected='true'] {
+  z-index: 1;
   border-color: var(--color-doc-template-faint);
-  border-bottom-color: var(--color-doc-template-bg);
-  background: var(--color-doc-template-bg);
+  border-bottom-color: var(--color-doc-template-code);
+  background: var(--color-doc-template-code);
 }
 .dockit-code-tabs-list [role='tab']:focus-visible,
 .dockit-code-tabs [role='tabpanel']:focus-visible {
@@ -415,8 +421,9 @@
 }
 .dockit-code-tabs [role='tabpanel'] {
   border: 1px solid var(--color-doc-template-faint);
-  border-top: 0;
-  border-radius: 0 0 var(--radius-doc-template) var(--radius-doc-template);
+  margin-top: -1px;
+  border-radius: var(--radius-doc-template);
   background: var(--color-doc-template-code);
 }
+.dockit-code-tabs[data-first-active='true'] [role='tabpanel'] { border-top-left-radius: 0; }
 .dockit-code-tabs [role='tabpanel'][hidden] { display: none; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dreamlake/dockit",
-  "version": "0.2.23",
+  "version": "0.2.25",
   "description": "The DreamLake documentation shell — Vike + React + Tailwind v4 + MDX docs framework with sidebar, TOC, search, and theming",
   "license": "MIT",
   "type": "module",