@dndbuilder.com/react
Version:
Drag and drop builder for React
76 lines (75 loc) • 2.95 kB
JavaScript
import { jsxs as l, jsx as s } from "react/jsx-runtime";
import N from "../../../components/base/add-new-section.js";
import { EditorRenderBlock as T } from "../../../components/base/editor-render-block.js";
import { RenderIcon as x } from "../../../components/shared/render-icon.js";
import { useBlockSettings as d } from "../../../hooks/use-block-settings.js";
import { Root as _, List as w, Trigger as B, Content as I } from "../../../../../../node_modules/.pnpm/@radix-ui_react-tabs@1.1.3_@types_react-dom@19.0.4_@types_react@19.0.10__@types_react@19.0.10_zw2jd7lnncg2lbtqb4feedrihy/node_modules/@radix-ui/react-tabs/dist/index.js";
import { l as k } from "../../../../../../_virtual/lodash.js";
const j = ({ settings: c, id: n, meta: r, isEditable: p }) => {
const [m, h] = d(n, "activeTabId"), { 0: u } = d(
n,
"list.orientation.{{BREAKPOINT}}"
), b = (r == null ? void 0 : r.locale) || "en", { 1: f } = d(n, "tabs");
return /* @__PURE__ */ l(
_,
{
className: "tabs",
value: m ?? c.tabs[0].id,
onValueChange: (o) => h(o),
orientation: u,
children: [
/* @__PURE__ */ s(w, { className: "tab-list", children: c.tabs.map((o) => {
var e, t, a, i;
return /* @__PURE__ */ s(B, { value: o.id, asChild: !0, children: /* @__PURE__ */ l(
"div",
{
role: "button",
className: "tab-button data-[state=active]:text-primary-500 gap-2 whitespace-nowrap px-2 py-1 transition-colors duration-150 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current",
children: [
/* @__PURE__ */ s(
x,
{
iconSet: (e = o.icon) == null ? void 0 : e.iconSet,
iconName: (t = o.icon) == null ? void 0 : t.iconName,
size: 24
}
),
((a = o.label) == null ? void 0 : a[b]) || ((i = o.label) == null ? void 0 : i.en)
]
}
) }, o.id);
}) }),
c.tabs.map((o) => /* @__PURE__ */ l(I, { value: o.id, className: "tab-content", children: [
o.children.map((e, t) => /* @__PURE__ */ s(
T,
{
block: e,
index: t,
meta: r,
isEditable: p ?? !1
},
e
)),
p && /* @__PURE__ */ s(
N,
{
blockId: n,
showBlockLibrary: !1,
className: "p-4",
onBlockAdded: (e) => {
f((t) => {
const a = k.cloneDeep(t), i = a.find((v) => v.id === o.id);
return i && i.children.push(e.id), a;
});
}
}
)
] }, o.id))
]
}
);
};
export {
j as default
};
//# sourceMappingURL=tabs.block.js.map