@dreamlake/dockit 0.2.24 → 0.2.25
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.
|
@@ -99,7 +99,7 @@ function CodeBlock({ children, filename, lang }) {
|
|
|
99
99
|
"div",
|
|
100
100
|
{
|
|
101
101
|
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",
|
|
102
|
-
style: { gap: 6, padding: embedded ? "3px 8px" : "8px 8px", isolation: "isolate" },
|
|
102
|
+
style: { gap: embedded ? 8 : 6, padding: embedded ? "3px 0 3px 8px" : "8px 8px", isolation: "isolate" },
|
|
103
103
|
children: [
|
|
104
104
|
/* @__PURE__ */ jsx(
|
|
105
105
|
"span",
|
|
@@ -12,7 +12,7 @@ function CodeTabs({ children, "aria-label": label = "Code examples" }) {
|
|
|
12
12
|
const id = useId();
|
|
13
13
|
const buttons = useRef([]);
|
|
14
14
|
if (!examples.length) return null;
|
|
15
|
-
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: [
|
|
15
|
+
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: [
|
|
16
16
|
/* @__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(
|
|
17
17
|
TabsTrigger,
|
|
18
18
|
{
|
package/dist/styles.css
CHANGED
|
@@ -383,13 +383,13 @@
|
|
|
383
383
|
their code/control state but are absent from keyboard and accessibility flow. */
|
|
384
384
|
.dockit-code-tabs {
|
|
385
385
|
margin: 18px 0 22px;
|
|
386
|
-
border-radius: var(--radius-doc-template);
|
|
386
|
+
border-radius: 6px 6px var(--radius-doc-template) var(--radius-doc-template);
|
|
387
387
|
overflow: hidden;
|
|
388
388
|
}
|
|
389
389
|
.dockit-code-tabs-header {
|
|
390
390
|
background: var(--color-doc-template-bg);
|
|
391
391
|
min-height: 30px;
|
|
392
|
-
padding: 0 156px 0
|
|
392
|
+
padding: 0 156px 0 0;
|
|
393
393
|
}
|
|
394
394
|
.dockit-code-tabs-list { overflow-x: auto; min-height: 30px; gap: 2px; }
|
|
395
395
|
/* Raised file-tab geometry follows Studio's chat TabStrip. UIKit supplies the
|
|
@@ -402,8 +402,10 @@
|
|
|
402
402
|
background: transparent;
|
|
403
403
|
line-height: 18px;
|
|
404
404
|
}
|
|
405
|
+
.dockit-code-tabs-list [role='tab']:first-child { margin-left: 0; }
|
|
405
406
|
.dockit-code-tabs-list [role='tab'][aria-selected='false']:hover {
|
|
406
407
|
border-color: var(--color-doc-template-faint);
|
|
408
|
+
border-bottom-color: transparent;
|
|
407
409
|
color: var(--color-doc-template-ink);
|
|
408
410
|
}
|
|
409
411
|
.dockit-code-tabs-list [role='tab'][aria-selected='true'] {
|
|
@@ -423,4 +425,5 @@
|
|
|
423
425
|
border-radius: var(--radius-doc-template);
|
|
424
426
|
background: var(--color-doc-template-code);
|
|
425
427
|
}
|
|
428
|
+
.dockit-code-tabs[data-first-active='true'] [role='tabpanel'] { border-top-left-radius: 0; }
|
|
426
429
|
.dockit-code-tabs [role='tabpanel'][hidden] { display: none; }
|
package/package.json
CHANGED