import { jsxs as a, Fragment as n, jsx as e } from "react/jsx-runtime";
import { H as s, C as o, a as r, bq as l, c as d } from "../index-sdOMz8GW.js";
import { LayoutDashboard as i, Plus as m, ChevronLeft as c } from "lucide-react";
import "react-router-dom";
import "react";
import "react-dom";
const w = () => /* @__PURE__ */ a(n, { children: [
  /* @__PURE__ */ e(
    s,
    {
      title: "MacOSSonomaLayoutContent",
      description: "Content shell for Sonoma layouts. Combines a toolbar with leading / center / trailing slots and a scrollable main area with consistent padding.",
      icon: /* @__PURE__ */ e("div", { className: "w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-emerald-400 via-green-500 to-teal-600 rounded-full flex items-center justify-center shadow-lg border border-emerald-400/50", children: /* @__PURE__ */ e(i, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
    }
  ),
  /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(r, { title: "With Toolbar Slots", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e("div", { className: "h-80 rounded-xl overflow-hidden border border-(--color-semantic-line-primary-subtle) shadow-(--shadow-card)", children: /* @__PURE__ */ e(
    l,
    {
      toolbarLeading: /* @__PURE__ */ a("button", { className: "flex items-center gap-1.5 text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200", children: [
        /* @__PURE__ */ e(c, { className: "h-4 w-4" }),
        "Back"
      ] }),
      toolbarCenter: /* @__PURE__ */ e("span", { className: "text-[13px] font-semibold text-gray-800 dark:text-gray-100", children: "Dashboard" }),
      toolbarTrailing: /* @__PURE__ */ a("button", { className: "flex items-center gap-1.5 rounded-md px-3 py-1 text-sm bg-blue-500 text-white hover:bg-blue-600", children: [
        /* @__PURE__ */ e(m, { className: "h-3.5 w-3.5" }),
        "New"
      ] }),
      children: /* @__PURE__ */ e("div", { className: "grid grid-cols-3 gap-4", children: ["Revenue", "Users", "Sessions"].map((t) => /* @__PURE__ */ a(
        "div",
        {
          className: "rounded-[10px] border border-(--color-semantic-line-primary-subtle) bg-white/60 dark:bg-white/5 p-4",
          children: [
            /* @__PURE__ */ e("p", { className: "text-xs text-gray-400 mb-1", children: t }),
            /* @__PURE__ */ e("p", { className: "text-xl font-semibold text-gray-800 dark:text-gray-100", children: "—" })
          ]
        },
        t
      )) })
    }
  ) }) }) }) }),
  /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(r, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
    d,
    {
      language: "tsx",
      code: `import { MacOSSonomaLayoutContent } from '@e-burgos/tucu-ui';

function PageLayout() {
  return (
    <div className="flex h-screen">
      <Sidebar />
      <MacOSSonomaLayoutContent
        toolbarLeading={<BackButton />}
        toolbarCenter={<span>Dashboard</span>}
        toolbarTrailing={<NewButton />}
      >
        <YourPageContent />
      </MacOSSonomaLayoutContent>
    </div>
  );
}`
    }
  ) }) }) })
] });
export {
  w as SonomaLayoutContentSection,
  w as default
};
