xertica-ui 2.1.2 → 2.1.3

package/dist/rich-text-editor-DNsdpN64.cjs

@@ -0,0 +1,2359 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const RechartsPrimitive = require("recharts");
+const tooltip = require("./tooltip-Ded96neP.cjs");
+const classVarianceAuthority = require("class-variance-authority");
+const lucideReact = require("lucide-react");
+const select = require("./select-Bkbr0f-Z.cjs");
+const TabsPrimitive = require("@radix-ui/react-tabs");
+const DialogPrimitive = require("@radix-ui/react-dialog");
+const dropdownMenu = require("./dropdown-menu-BDB5CmQs.cjs");
+const input = require("./input-DWANSKGb.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const RechartsPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(RechartsPrimitive);
+const TabsPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(TabsPrimitive);
+const DialogPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(DialogPrimitive);
+const alertVariants = classVarianceAuthority.cva(
+  "relative w-full rounded-[var(--radius)] border-l-4 px-4 py-3 grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-5 [&>svg]:translate-y-0.5 [&>svg]:text-current",
+  {
+    variants: {
+      variant: {
+        default: "bg-muted/50 border-l-border text-foreground [&>svg]:text-muted-foreground",
+        success: "bg-[color:var(--success)]/10 dark:bg-[color:var(--success)]/20 border-l-[color:var(--success)] text-foreground [&>svg]:text-[color:var(--success)]",
+        info: "bg-[color:var(--info)]/10 dark:bg-[color:var(--info)]/20 border-l-[color:var(--info)] text-foreground [&>svg]:text-[color:var(--info)]",
+        warning: "bg-[color:var(--warning)]/10 dark:bg-[color:var(--warning)]/20 border-l-[color:var(--warning)] text-foreground [&>svg]:text-[color:var(--warning)]",
+        destructive: "bg-[color:var(--destructive)]/10 dark:bg-[color:var(--destructive)]/20 border-l-[color:var(--destructive)] text-foreground [&>svg]:text-[color:var(--destructive)]"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+const alertIcons = {
+  default: lucideReact.Info,
+  success: lucideReact.CheckCircle,
+  info: lucideReact.Info,
+  warning: lucideReact.AlertTriangle,
+  destructive: lucideReact.XCircle
+};
+function Alert({
+  className,
+  variant,
+  icon,
+  children,
+  ...props
+}) {
+  const alertVariant = variant && variant in alertIcons ? variant : "default";
+  const DefaultIcon = alertIcons[alertVariant];
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-slot": "alert",
+      role: "alert",
+      className: tooltip.cn(alertVariants({ variant }), className),
+      ...props,
+      children: [
+        icon !== void 0 ? icon : /* @__PURE__ */ jsxRuntime.jsx(DefaultIcon, { className: "flex-shrink-0" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1", children })
+      ]
+    }
+  );
+}
+function AlertTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "alert-title",
+      className: tooltip.cn(
+        "font-medium mb-1 leading-tight",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "alert-description",
+      className: tooltip.cn(
+        "leading-relaxed",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function Card({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "card",
+      className: tooltip.cn(
+        "bg-card text-card-foreground flex flex-col gap-6 rounded-[var(--radius-card)]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "card-header",
+      className: tooltip.cn(
+        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 pt-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "h4",
+    {
+      "data-slot": "card-title",
+      className: tooltip.cn("leading-none", className),
+      ...props
+    }
+  );
+}
+function CardDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "p",
+    {
+      "data-slot": "card-description",
+      className: tooltip.cn("text-muted-foreground", className),
+      ...props
+    }
+  );
+}
+function CardAction({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "card-action",
+      className: tooltip.cn(
+        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardContent({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "card-content",
+      className: tooltip.cn("px-6 [&:last-child]:pb-6", className),
+      ...props
+    }
+  );
+}
+function CardFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "card-footer",
+      className: tooltip.cn("flex items-center px-6 pb-6 [.border-t]:pt-6", className),
+      ...props
+    }
+  );
+}
+const Empty = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    className: tooltip.cn(
+      "flex min-h-[400px] flex-col items-center justify-center rounded-[var(--radius-card)] border border-dashed border-border p-8 text-center animate-in fade-in-50",
+      className
+    ),
+    ...props
+  }
+));
+Empty.displayName = "Empty";
+const EmptyIcon = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    className: tooltip.cn(
+      "mx-auto flex h-20 w-20 items-center justify-center rounded-full bg-muted",
+      className
+    ),
+    ...props
+  }
+));
+EmptyIcon.displayName = "EmptyIcon";
+const EmptyImage = React__namespace.forwardRef(({ className, alt, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "img",
+  {
+    ref,
+    alt,
+    className: tooltip.cn("mx-auto mb-4 h-48 w-48 object-contain opacity-50", className),
+    ...props
+  }
+));
+EmptyImage.displayName = "EmptyImage";
+const EmptyTitle = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "h3",
+  {
+    ref,
+    className: tooltip.cn("mt-4 font-semibold text-foreground", className),
+    ...props
+  }
+));
+EmptyTitle.displayName = "EmptyTitle";
+const EmptyDescription = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "p",
+  {
+    ref,
+    className: tooltip.cn("mt-2 text-sm text-muted-foreground max-w-sm mx-auto", className),
+    ...props
+  }
+));
+EmptyDescription.displayName = "EmptyDescription";
+const EmptyAction = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    className: tooltip.cn("mt-6 flex flex-col gap-2 sm:flex-row sm:gap-4", className),
+    ...props
+  }
+));
+EmptyAction.displayName = "EmptyAction";
+function Skeleton({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "skeleton",
+      className: tooltip.cn("bg-accent animate-pulse rounded-md", className),
+      ...props
+    }
+  );
+}
+function Tabs({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Root,
+    {
+      "data-slot": "tabs",
+      className: tooltip.cn("flex flex-col gap-2", className),
+      ...props
+    }
+  );
+}
+function TabsList({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.List,
+    {
+      "data-slot": "tabs-list",
+      className: tooltip.cn(
+        "relative inline-flex h-12 w-fit items-end justify-start border-b border-border bg-transparent",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TabsTrigger({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Trigger,
+    {
+      "data-slot": "tabs-trigger",
+      className: tooltip.cn(
+        "relative inline-flex h-12 items-center justify-center gap-1.5 bg-transparent px-4 py-3 text-sm font-medium whitespace-nowrap transition-all duration-200 ease-in-out border-b-2 border-transparent text-muted-foreground hover:text-foreground hover:bg-accent/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50 data-[state=active]:text-primary data-[state=active]:border-primary data-[state=active]:bg-transparent [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TabsContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Content,
+    {
+      "data-slot": "tabs-content",
+      className: tooltip.cn("flex-1 outline-none", className),
+      ...props
+    }
+  );
+}
+const THEMES = { light: "", dark: ".dark" };
+const defaultPeriods = [
+  { value: "7d", label: "7 days" },
+  { value: "30d", label: "30 days" },
+  { value: "90d", label: "90 days" }
+];
+const defaultChartColors = [
+  "var(--chart-1)",
+  "var(--chart-2)",
+  "var(--chart-3)",
+  "var(--chart-4)",
+  "var(--chart-5)"
+];
+const ChartContext = React__namespace.createContext(null);
+function useChart() {
+  const context = React__namespace.useContext(ChartContext);
+  if (!context) {
+    throw new Error("useChart must be used within a <ChartContainer />");
+  }
+  return context;
+}
+function ChartContainer({
+  id,
+  className,
+  children,
+  config,
+  ...props
+}) {
+  const uniqueId = React__namespace.useId();
+  const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
+  return /* @__PURE__ */ jsxRuntime.jsx(ChartContext.Provider, { value: { config }, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-slot": "chart",
+      "data-chart": chartId,
+      className: tooltip.cn(
+        "[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border flex justify-center text-xs overflow-hidden [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden h-[300px] w-full",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ChartStyle, { id: chartId, config }),
+        /* @__PURE__ */ jsxRuntime.jsx(RechartsPrimitive__namespace.ResponsiveContainer, { width: "100%", height: "100%", children })
+      ]
+    }
+  ) });
+}
+const ChartStyle = ({ id, config }) => {
+  const colorConfig = Object.entries(config).filter(
+    ([, config2]) => config2.theme || config2.color
+  );
+  if (!colorConfig.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "style",
+    {
+      dangerouslySetInnerHTML: {
+        __html: Object.entries(THEMES).map(
+          ([theme, prefix]) => `
+${prefix} [data-chart=${id}] {
+${colorConfig.map(([key, itemConfig]) => {
+            var _a;
+            const color = ((_a = itemConfig.theme) == null ? void 0 : _a[theme]) || itemConfig.color;
+            return color ? `  --color-${key}: ${color};` : null;
+          }).join("\n")}
+}
+`
+        ).join("\n")
+      }
+    }
+  );
+};
+const ChartTooltip = RechartsPrimitive__namespace.Tooltip;
+function ChartTooltipContent({
+  active,
+  payload,
+  className,
+  indicator = "dot",
+  hideLabel = false,
+  hideIndicator = false,
+  label,
+  labelFormatter,
+  labelClassName,
+  formatter,
+  color,
+  nameKey,
+  labelKey
+}) {
+  const { config } = useChart();
+  const tooltipLabel = React__namespace.useMemo(() => {
+    var _a;
+    if (hideLabel || !(payload == null ? void 0 : payload.length)) {
+      return null;
+    }
+    const [item] = payload;
+    const key = `${labelKey || (item == null ? void 0 : item.dataKey) || (item == null ? void 0 : item.name) || "value"}`;
+    const itemConfig = getPayloadConfigFromPayload(config, item, key);
+    const value = !labelKey && typeof label === "string" ? ((_a = config[label]) == null ? void 0 : _a.label) || label : itemConfig == null ? void 0 : itemConfig.label;
+    if (labelFormatter) {
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: tooltip.cn("font-medium", labelClassName), children: labelFormatter(value, payload) });
+    }
+    if (!value) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: tooltip.cn("font-medium", labelClassName), children: value });
+  }, [
+    label,
+    labelFormatter,
+    payload,
+    hideLabel,
+    labelClassName,
+    config,
+    labelKey
+  ]);
+  if (!active || !(payload == null ? void 0 : payload.length)) {
+    return null;
+  }
+  const nestLabel = payload.length === 1 && indicator !== "dot";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: tooltip.cn(
+        "border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl",
+        className
+      ),
+      children: [
+        !nestLabel ? tooltipLabel : null,
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-1.5", children: payload.map((item, index) => {
+          var _a;
+          const key = `${nameKey || item.name || item.dataKey || "value"}`;
+          const itemConfig = getPayloadConfigFromPayload(config, item, key);
+          const indicatorColor = color || ((_a = item.payload) == null ? void 0 : _a.fill) || item.color;
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: tooltip.cn(
+                "[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5",
+                indicator === "dot" && "items-center"
+              ),
+              children: formatter && (item == null ? void 0 : item.value) !== void 0 && item.name ? formatter(item.value, item.name, item, index, item.payload) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                (itemConfig == null ? void 0 : itemConfig.icon) ? /* @__PURE__ */ jsxRuntime.jsx(itemConfig.icon, {}) : !hideIndicator && /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: tooltip.cn(
+                      "shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)",
+                      {
+                        "h-2.5 w-2.5": indicator === "dot",
+                        "w-1": indicator === "line",
+                        "w-0 border-[1.5px] border-dashed bg-transparent": indicator === "dashed",
+                        "my-0.5": nestLabel && indicator === "dashed"
+                      }
+                    ),
+                    style: {
+                      "--color-bg": indicatorColor,
+                      "--color-border": indicatorColor
+                    }
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsxs(
+                  "div",
+                  {
+                    className: tooltip.cn(
+                      "flex flex-1 justify-between leading-none",
+                      nestLabel ? "items-end" : "items-center"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-1.5", children: [
+                        nestLabel ? tooltipLabel : null,
+                        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: (itemConfig == null ? void 0 : itemConfig.label) || item.name })
+                      ] }),
+                      item.value && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground font-mono font-medium tabular-nums", children: item.value.toLocaleString() })
+                    ]
+                  }
+                )
+              ] })
+            },
+            item.dataKey
+          );
+        }) })
+      ]
+    }
+  );
+}
+const ChartLegend = RechartsPrimitive__namespace.Legend;
+function ChartLegendContent({
+  className,
+  hideIcon = false,
+  payload,
+  verticalAlign = "bottom",
+  nameKey
+}) {
+  const { config } = useChart();
+  if (!(payload == null ? void 0 : payload.length)) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: tooltip.cn(
+        "flex items-center justify-center gap-4",
+        verticalAlign === "top" ? "pb-3" : "pt-3",
+        className
+      ),
+      children: payload.map((item) => {
+        const key = `${nameKey ? item.value : item.dataKey || item.value || "value"}`;
+        const itemConfig = getPayloadConfigFromPayload(config, item, key);
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: tooltip.cn(
+              "[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"
+            ),
+            children: [
+              (itemConfig == null ? void 0 : itemConfig.icon) && !hideIcon ? /* @__PURE__ */ jsxRuntime.jsx(itemConfig.icon, {}) : /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: "h-2 w-2 shrink-0 rounded-[2px] bg-(--color-bg)",
+                  style: {
+                    "--color-bg": item.color || `var(--color-${key})`
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: (itemConfig == null ? void 0 : itemConfig.label) || item.value })
+            ]
+          },
+          item.value
+        );
+      })
+    }
+  );
+}
+function getPayloadConfigFromPayload(config, payload, key) {
+  if (typeof payload !== "object" || payload === null) {
+    return void 0;
+  }
+  const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null ? payload.payload : void 0;
+  let configLabelKey = key;
+  if (key in payload && typeof payload[key] === "string") {
+    configLabelKey = payload[key];
+  } else if (payloadPayload && key in payloadPayload && typeof payloadPayload[key] === "string") {
+    configLabelKey = payloadPayload[key];
+  }
+  return configLabelKey in config ? config[configLabelKey] : config[key];
+}
+function getChartSeries(config, series) {
+  if (series == null ? void 0 : series.length) {
+    return series;
+  }
+  return Object.entries(config).map(([key, item]) => ({
+    key,
+    label: item.label
+  }));
+}
+function getSeriesColor(key, index, colors) {
+  if (Array.isArray(colors)) {
+    return colors[index] || defaultChartColors[index % defaultChartColors.length];
+  }
+  return (colors == null ? void 0 : colors[key]) || defaultChartColors[index % defaultChartColors.length];
+}
+function getChartConfigWithColors(config, keys, colors) {
+  return keys.reduce((nextConfig, key, index) => {
+    const item = config[key];
+    if ((item == null ? void 0 : item.theme) && !colors) {
+      nextConfig[key] = item;
+      return nextConfig;
+    }
+    nextConfig[key] = {
+      label: (item == null ? void 0 : item.label) || key,
+      icon: item == null ? void 0 : item.icon,
+      color: colors ? getSeriesColor(key, index, colors) : (item == null ? void 0 : item.color) || getSeriesColor(key, index)
+    };
+    return nextConfig;
+  }, {});
+}
+function formatTick(value) {
+  if (typeof value !== "number") {
+    return value;
+  }
+  return Intl.NumberFormat("en", {
+    notation: "compact",
+    maximumFractionDigits: 1
+  }).format(value);
+}
+function defaultFilterData(data, period) {
+  const match = period.match(/^(\d+)/);
+  if (!match) {
+    return data;
+  }
+  const limit = Number(match[1]);
+  return data.slice(Math.max(data.length - limit, 0));
+}
+function getErrorDescription(error) {
+  if (typeof error === "string") {
+    return error;
+  }
+  if (error instanceof Error) {
+    return error.message;
+  }
+  return void 0;
+}
+function hasChartData(data, series) {
+  if (!data.length || !series.length) {
+    return false;
+  }
+  return data.some(
+    (item) => series.some((serie) => {
+      const value = item[serie.key];
+      return value !== null && value !== void 0 && value !== "";
+    })
+  );
+}
+function hasPieData(data, nameKey, valueKey) {
+  return data.some((item) => {
+    const name = item[nameKey];
+    const value = item[valueKey];
+    return name !== null && name !== void 0 && name !== "" && value !== null && value !== void 0 && value !== "";
+  });
+}
+function ChartState({
+  type,
+  className,
+  error,
+  onRetry,
+  retryLabel = "Try again",
+  emptyTitle = "No data available",
+  emptyDescription = "There is no data available for this chart yet.",
+  errorTitle = "Connection error",
+  errorDescription,
+  loadingLabel = "Loading chart data"
+}) {
+  if (type === "loading") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: tooltip.cn(
+          "flex min-h-[240px] flex-col justify-end gap-3 rounded-[var(--radius-card)] border border-border p-6",
+          className
+        ),
+        "aria-label": typeof loadingLabel === "string" ? loadingLabel : void 0,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-8 w-2/5" }),
+          /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-14 w-3/5" }),
+          /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-24 w-4/5" }),
+          /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-36 w-full" })
+        ]
+      }
+    );
+  }
+  if (type === "error") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: tooltip.cn(
+          "flex min-h-[240px] items-center justify-center rounded-[var(--radius-card)] border border-border p-6",
+          className
+        ),
+        children: /* @__PURE__ */ jsxRuntime.jsxs(Alert, { variant: "destructive", className: "max-w-xl", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(AlertTitle, { children: errorTitle }),
+          /* @__PURE__ */ jsxRuntime.jsx(AlertDescription, { children: errorDescription || getErrorDescription(error) || "Unable to load chart data. Check your connection and try again." }),
+          onRetry ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3", children: /* @__PURE__ */ jsxRuntime.jsxs(tooltip.Button, { size: "sm", variant: "outline", onClick: onRetry, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RefreshCw, { className: "size-4" }),
+            retryLabel
+          ] }) }) : null
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(Empty, { className: tooltip.cn("min-h-[240px]", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(EmptyIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.BarChart3, { className: "size-10 text-muted-foreground" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(EmptyTitle, { children: emptyTitle }),
+    /* @__PURE__ */ jsxRuntime.jsx(EmptyDescription, { children: emptyDescription }),
+    onRetry ? /* @__PURE__ */ jsxRuntime.jsx(EmptyAction, { children: /* @__PURE__ */ jsxRuntime.jsxs(tooltip.Button, { size: "sm", variant: "outline", onClick: onRetry, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.WifiOff, { className: "size-4" }),
+      retryLabel
+    ] }) }) : null
+  ] });
+}
+function getChartState(state, hasData, className) {
+  if (state.isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ChartState, { ...state, type: "loading", className });
+  }
+  if (state.error) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ChartState, { ...state, type: "error", className });
+  }
+  if (!hasData) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ChartState, { ...state, type: "empty", className });
+  }
+  return null;
+}
+function ChartCard({
+  title,
+  description,
+  action,
+  footer,
+  children,
+  className,
+  contentClassName,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Card, { className: tooltip.cn("overflow-hidden", className), ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(CardHeader, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(CardTitle, { children: title }),
+      description ? /* @__PURE__ */ jsxRuntime.jsx(CardDescription, { children: description }) : null,
+      action ? /* @__PURE__ */ jsxRuntime.jsx(CardAction, { children: action }) : null
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(CardContent, { className: contentClassName, children }),
+    footer ? /* @__PURE__ */ jsxRuntime.jsx(CardFooter, { children: footer }) : null
+  ] });
+}
+function DashboardBarChart({
+  data,
+  config,
+  indexKey = "name",
+  series,
+  colors,
+  stacked = false,
+  showGrid = true,
+  showLegend = true,
+  valueFormatter = formatTick,
+  isLoading,
+  error,
+  onRetry,
+  retryLabel,
+  emptyTitle,
+  emptyDescription,
+  errorTitle,
+  errorDescription,
+  loadingLabel,
+  stateClassName,
+  className,
+  ...props
+}) {
+  const chartSeries = getChartSeries(config, series);
+  const chartConfig = getChartConfigWithColors(
+    config,
+    chartSeries.map((item) => item.key),
+    colors
+  );
+  const chartState = getChartState(
+    {
+      isLoading,
+      error,
+      onRetry,
+      retryLabel,
+      emptyTitle,
+      emptyDescription,
+      errorTitle,
+      errorDescription,
+      loadingLabel
+    },
+    hasChartData(data, chartSeries),
+    tooltip.cn("h-[320px]", stateClassName)
+  );
+  if (chartState) {
+    return chartState;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ChartContainer,
+    {
+      config: chartConfig,
+      className: tooltip.cn("h-[320px] w-full", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.BarChart, { data, accessibilityLayer: true, children: [
+        showGrid ? /* @__PURE__ */ jsxRuntime.jsx(RechartsPrimitive__namespace.CartesianGrid, { vertical: false }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          RechartsPrimitive__namespace.XAxis,
+          {
+            dataKey: indexKey,
+            tickLine: false,
+            axisLine: false,
+            tickMargin: 8
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          RechartsPrimitive__namespace.YAxis,
+          {
+            tickLine: false,
+            axisLine: false,
+            tickMargin: 8,
+            tickFormatter: valueFormatter
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(ChartTooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, {}) }),
+        showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
+        chartSeries.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+          RechartsPrimitive__namespace.Bar,
+          {
+            dataKey: item.key,
+            fill: `var(--color-${item.key})`,
+            radius: [4, 4, 0, 0],
+            stackId: stacked ? item.stackId || "total" : item.stackId
+          },
+          item.key
+        ))
+      ] })
+    }
+  );
+}
+function DashboardLineChart({
+  data,
+  config,
+  indexKey = "name",
+  series,
+  colors,
+  showDots = false,
+  showGrid = true,
+  showLegend = true,
+  valueFormatter = formatTick,
+  isLoading,
+  error,
+  onRetry,
+  retryLabel,
+  emptyTitle,
+  emptyDescription,
+  errorTitle,
+  errorDescription,
+  loadingLabel,
+  stateClassName,
+  className,
+  ...props
+}) {
+  const chartSeries = getChartSeries(config, series);
+  const chartConfig = getChartConfigWithColors(
+    config,
+    chartSeries.map((item) => item.key),
+    colors
+  );
+  const chartState = getChartState(
+    {
+      isLoading,
+      error,
+      onRetry,
+      retryLabel,
+      emptyTitle,
+      emptyDescription,
+      errorTitle,
+      errorDescription,
+      loadingLabel
+    },
+    hasChartData(data, chartSeries),
+    tooltip.cn("h-[320px]", stateClassName)
+  );
+  if (chartState) {
+    return chartState;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ChartContainer,
+    {
+      config: chartConfig,
+      className: tooltip.cn("h-[320px] w-full", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.LineChart, { data, accessibilityLayer: true, children: [
+        showGrid ? /* @__PURE__ */ jsxRuntime.jsx(RechartsPrimitive__namespace.CartesianGrid, { vertical: false }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          RechartsPrimitive__namespace.XAxis,
+          {
+            dataKey: indexKey,
+            tickLine: false,
+            axisLine: false,
+            tickMargin: 8
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          RechartsPrimitive__namespace.YAxis,
+          {
+            tickLine: false,
+            axisLine: false,
+            tickMargin: 8,
+            tickFormatter: valueFormatter
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(ChartTooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, { indicator: "line" }) }),
+        showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
+        chartSeries.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+          RechartsPrimitive__namespace.Line,
+          {
+            type: "monotone",
+            dataKey: item.key,
+            stroke: `var(--color-${item.key})`,
+            strokeWidth: 2,
+            dot: showDots ? { r: 3, fill: `var(--color-${item.key})` } : false,
+            activeDot: { r: 5 },
+            yAxisId: item.yAxisId
+          },
+          item.key
+        ))
+      ] })
+    }
+  );
+}
+function HorizontalBarChart({
+  data,
+  config,
+  indexKey = "name",
+  series,
+  colors,
+  stacked = false,
+  categoryWidth = 96,
+  showGrid = true,
+  showLegend = true,
+  valueFormatter = formatTick,
+  isLoading,
+  error,
+  onRetry,
+  retryLabel,
+  emptyTitle,
+  emptyDescription,
+  errorTitle,
+  errorDescription,
+  loadingLabel,
+  stateClassName,
+  className,
+  ...props
+}) {
+  const chartSeries = getChartSeries(config, series);
+  const chartConfig = getChartConfigWithColors(
+    config,
+    chartSeries.map((item) => item.key),
+    colors
+  );
+  const chartState = getChartState(
+    {
+      isLoading,
+      error,
+      onRetry,
+      retryLabel,
+      emptyTitle,
+      emptyDescription,
+      errorTitle,
+      errorDescription,
+      loadingLabel
+    },
+    hasChartData(data, chartSeries),
+    tooltip.cn("h-[320px]", stateClassName)
+  );
+  if (chartState) {
+    return chartState;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ChartContainer,
+    {
+      config: chartConfig,
+      className: tooltip.cn("h-[320px] w-full", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        RechartsPrimitive__namespace.BarChart,
+        {
+          data,
+          layout: "vertical",
+          accessibilityLayer: true,
+          margin: { left: 8, right: 16 },
+          children: [
+            showGrid ? /* @__PURE__ */ jsxRuntime.jsx(RechartsPrimitive__namespace.CartesianGrid, { horizontal: false }) : null,
+            /* @__PURE__ */ jsxRuntime.jsx(
+              RechartsPrimitive__namespace.XAxis,
+              {
+                type: "number",
+                tickLine: false,
+                axisLine: false,
+                tickMargin: 8,
+                tickFormatter: valueFormatter
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              RechartsPrimitive__namespace.YAxis,
+              {
+                dataKey: indexKey,
+                type: "category",
+                tickLine: false,
+                axisLine: false,
+                tickMargin: 8,
+                width: categoryWidth
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(ChartTooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, {}) }),
+            showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
+            chartSeries.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+              RechartsPrimitive__namespace.Bar,
+              {
+                dataKey: item.key,
+                fill: `var(--color-${item.key})`,
+                radius: [0, 4, 4, 0],
+                stackId: stacked ? item.stackId || "total" : item.stackId
+              },
+              item.key
+            ))
+          ]
+        }
+      )
+    }
+  );
+}
+function InteractiveTimeSeriesChart({
+  data,
+  config,
+  indexKey = "date",
+  series,
+  colors,
+  periods = defaultPeriods,
+  defaultPeriod = ((_a) => (_a = periods[1]) == null ? void 0 : _a.value)() || ((_b) => (_b = periods[0]) == null ? void 0 : _b.value)() || "30d",
+  defaultSeries,
+  filterData = defaultFilterData,
+  showGrid = true,
+  showLegend = false,
+  valueFormatter = formatTick,
+  isLoading,
+  error,
+  onRetry,
+  retryLabel,
+  emptyTitle,
+  emptyDescription,
+  errorTitle,
+  errorDescription,
+  loadingLabel,
+  stateClassName,
+  className,
+  ...props
+}) {
+  var _a2;
+  const chartSeries = getChartSeries(config, series);
+  const chartConfig = getChartConfigWithColors(
+    config,
+    chartSeries.map((item) => item.key),
+    colors
+  );
+  const [period, setPeriod] = React__namespace.useState(defaultPeriod);
+  const [activeSeries, setActiveSeries] = React__namespace.useState(
+    defaultSeries || ((_a2 = chartSeries[0]) == null ? void 0 : _a2.key) || ""
+  );
+  const filteredData = React__namespace.useMemo(
+    () => filterData(data, period),
+    [data, filterData, period]
+  );
+  const visibleSeries = chartSeries.length > 1 ? chartSeries.filter((item) => item.key === activeSeries) : chartSeries;
+  const chartState = getChartState(
+    {
+      isLoading,
+      error,
+      onRetry,
+      retryLabel,
+      emptyTitle,
+      emptyDescription,
+      errorTitle,
+      errorDescription,
+      loadingLabel
+    },
+    hasChartData(filteredData, visibleSeries),
+    tooltip.cn("h-[320px]", stateClassName)
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", children: [
+      chartSeries.length > 1 ? /* @__PURE__ */ jsxRuntime.jsx(Tabs, { value: activeSeries, onValueChange: setActiveSeries, children: /* @__PURE__ */ jsxRuntime.jsx(TabsList, { className: "h-10", children: chartSeries.map((item) => {
+        var _a3;
+        return /* @__PURE__ */ jsxRuntime.jsx(TabsTrigger, { value: item.key, className: "h-10", children: item.label || ((_a3 = config[item.key]) == null ? void 0 : _a3.label) || item.key }, item.key);
+      }) }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", {}),
+      /* @__PURE__ */ jsxRuntime.jsxs(select.Select, { value: period, onValueChange: setPeriod, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(select.SelectTrigger, { className: "w-full sm:w-[160px]", size: "sm", children: /* @__PURE__ */ jsxRuntime.jsx(select.SelectValue, { placeholder: "Period" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(select.SelectContent, { children: periods.map((item) => /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: item.value, children: item.label }, item.value)) })
+      ] })
+    ] }),
+    chartState || /* @__PURE__ */ jsxRuntime.jsx(
+      ChartContainer,
+      {
+        config: chartConfig,
+        className: tooltip.cn("h-[320px] w-full", className),
+        ...props,
+        children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.AreaChart, { data: filteredData, accessibilityLayer: true, children: [
+          showGrid ? /* @__PURE__ */ jsxRuntime.jsx(RechartsPrimitive__namespace.CartesianGrid, { vertical: false }) : null,
+          /* @__PURE__ */ jsxRuntime.jsx(
+            RechartsPrimitive__namespace.XAxis,
+            {
+              dataKey: indexKey,
+              tickLine: false,
+              axisLine: false,
+              tickMargin: 8
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            RechartsPrimitive__namespace.YAxis,
+            {
+              tickLine: false,
+              axisLine: false,
+              tickMargin: 8,
+              tickFormatter: valueFormatter
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(ChartTooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, { indicator: "line" }) }),
+          showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
+          visibleSeries.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+            RechartsPrimitive__namespace.Area,
+            {
+              type: "monotone",
+              dataKey: item.key,
+              stroke: `var(--color-${item.key})`,
+              fill: `var(--color-${item.key})`,
+              fillOpacity: 0.16,
+              strokeWidth: 2,
+              dot: false
+            },
+            item.key
+          ))
+        ] })
+      }
+    )
+  ] });
+}
+function ComboMetricChart({
+  data,
+  config,
+  indexKey = "name",
+  series,
+  colors,
+  showGrid = true,
+  showLegend = true,
+  valueFormatter = formatTick,
+  isLoading,
+  error,
+  onRetry,
+  retryLabel,
+  emptyTitle,
+  emptyDescription,
+  errorTitle,
+  errorDescription,
+  loadingLabel,
+  stateClassName,
+  className,
+  ...props
+}) {
+  const chartSeries = getChartSeries(config, series);
+  const chartConfig = getChartConfigWithColors(
+    config,
+    chartSeries.map((item) => item.key),
+    colors
+  );
+  const chartState = getChartState(
+    {
+      isLoading,
+      error,
+      onRetry,
+      retryLabel,
+      emptyTitle,
+      emptyDescription,
+      errorTitle,
+      errorDescription,
+      loadingLabel
+    },
+    hasChartData(data, chartSeries),
+    tooltip.cn("h-[340px]", stateClassName)
+  );
+  if (chartState) {
+    return chartState;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ChartContainer,
+    {
+      config: chartConfig,
+      className: tooltip.cn("h-[340px] w-full", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.ComposedChart, { data, accessibilityLayer: true, children: [
+        showGrid ? /* @__PURE__ */ jsxRuntime.jsx(RechartsPrimitive__namespace.CartesianGrid, { vertical: false }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          RechartsPrimitive__namespace.XAxis,
+          {
+            dataKey: indexKey,
+            tickLine: false,
+            axisLine: false,
+            tickMargin: 8
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          RechartsPrimitive__namespace.YAxis,
+          {
+            tickLine: false,
+            axisLine: false,
+            tickMargin: 8,
+            tickFormatter: valueFormatter
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(ChartTooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, {}) }),
+        showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
+        chartSeries.map(
+          (item) => item.type === "line" ? /* @__PURE__ */ jsxRuntime.jsx(
+            RechartsPrimitive__namespace.Line,
+            {
+              type: "monotone",
+              dataKey: item.key,
+              stroke: `var(--color-${item.key})`,
+              strokeWidth: 2,
+              dot: false,
+              yAxisId: item.yAxisId
+            },
+            item.key
+          ) : item.type === "area" ? /* @__PURE__ */ jsxRuntime.jsx(
+            RechartsPrimitive__namespace.Area,
+            {
+              type: "monotone",
+              dataKey: item.key,
+              stroke: `var(--color-${item.key})`,
+              fill: `var(--color-${item.key})`,
+              fillOpacity: 0.12,
+              strokeWidth: 2,
+              dot: false,
+              yAxisId: item.yAxisId
+            },
+            item.key
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            RechartsPrimitive__namespace.Bar,
+            {
+              dataKey: item.key,
+              fill: `var(--color-${item.key})`,
+              radius: [4, 4, 0, 0],
+              yAxisId: item.yAxisId
+            },
+            item.key
+          )
+        )
+      ] })
+    }
+  );
+}
+function DonutBreakdownChart({
+  data,
+  config,
+  nameKey = "name",
+  valueKey = "value",
+  colors,
+  centerLabel,
+  centerValue,
+  showLegend = true,
+  isLoading,
+  error,
+  onRetry,
+  retryLabel,
+  emptyTitle,
+  emptyDescription,
+  errorTitle,
+  errorDescription,
+  loadingLabel,
+  stateClassName,
+  className,
+  ...props
+}) {
+  const [activeIndex, setActiveIndex] = React__namespace.useState(0);
+  const chartKeys = data.map(
+    (entry, index) => String(entry[nameKey] || `segment-${index}`)
+  );
+  const chartConfig = getChartConfigWithColors(config, chartKeys, colors);
+  const chartState = getChartState(
+    {
+      isLoading,
+      error,
+      onRetry,
+      retryLabel,
+      emptyTitle,
+      emptyDescription,
+      errorTitle,
+      errorDescription,
+      loadingLabel
+    },
+    hasPieData(data, nameKey, valueKey),
+    tooltip.cn("h-[320px]", stateClassName)
+  );
+  if (chartState) {
+    return chartState;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ChartContainer,
+    {
+      config: chartConfig,
+      className: tooltip.cn("h-[320px] w-full", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.PieChart, { accessibilityLayer: true, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ChartTooltip,
+          {
+            cursor: false,
+            content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, { hideLabel: true, nameKey })
+          }
+        ),
+        showLegend ? /* @__PURE__ */ jsxRuntime.jsx(
+          ChartLegend,
+          {
+            content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, { nameKey }),
+            verticalAlign: "bottom"
+          }
+        ) : null,
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          RechartsPrimitive__namespace.Pie,
+          {
+            data,
+            dataKey: valueKey,
+            nameKey,
+            innerRadius: "58%",
+            outerRadius: "82%",
+            paddingAngle: 2,
+            activeIndex,
+            onMouseEnter: (_, index) => setActiveIndex(index),
+            children: [
+              data.map((entry, index) => {
+                const key = String(entry[nameKey] || `segment-${index}`);
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  RechartsPrimitive__namespace.Cell,
+                  {
+                    fill: `var(--color-${key})`,
+                    opacity: index === activeIndex ? 1 : 0.72
+                  },
+                  key
+                );
+              }),
+              centerValue || centerLabel ? /* @__PURE__ */ jsxRuntime.jsx(
+                RechartsPrimitive__namespace.Label,
+                {
+                  position: "center",
+                  content: ({ viewBox }) => {
+                    if (!viewBox || !("cx" in viewBox) || !("cy" in viewBox)) {
+                      return null;
+                    }
+                    return /* @__PURE__ */ jsxRuntime.jsxs(
+                      "text",
+                      {
+                        x: viewBox.cx,
+                        y: viewBox.cy,
+                        textAnchor: "middle",
+                        dominantBaseline: "middle",
+                        children: [
+                          centerValue ? /* @__PURE__ */ jsxRuntime.jsx(
+                            "tspan",
+                            {
+                              x: viewBox.cx,
+                              y: viewBox.cy,
+                              className: "fill-foreground text-2xl font-semibold",
+                              children: centerValue
+                            }
+                          ) : null,
+                          centerLabel ? /* @__PURE__ */ jsxRuntime.jsx(
+                            "tspan",
+                            {
+                              x: viewBox.cx,
+                              y: Number(viewBox.cy) + 22,
+                              className: "fill-muted-foreground text-xs",
+                              children: centerLabel
+                            }
+                          ) : null
+                        ]
+                      }
+                    );
+                  }
+                }
+              ) : null
+            ]
+          }
+        )
+      ] })
+    }
+  );
+}
+function Table({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "table-container",
+      className: "relative w-full overflow-x-auto",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "table",
+        {
+          "data-slot": "table",
+          className: tooltip.cn("w-full caption-bottom text-sm", className),
+          ...props
+        }
+      )
+    }
+  );
+}
+function TableHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "thead",
+    {
+      "data-slot": "table-header",
+      className: tooltip.cn("[&_tr]:border-b", className),
+      ...props
+    }
+  );
+}
+function TableBody({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "tbody",
+    {
+      "data-slot": "table-body",
+      className: tooltip.cn("[&_tr:last-child]:border-0", className),
+      ...props
+    }
+  );
+}
+function TableFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "tfoot",
+    {
+      "data-slot": "table-footer",
+      className: tooltip.cn(
+        "bg-muted/50 border-t font-medium [&>tr]:last:border-b-0",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableRow({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "tr",
+    {
+      "data-slot": "table-row",
+      className: tooltip.cn(
+        "hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableHead({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "th",
+    {
+      "data-slot": "table-head",
+      className: tooltip.cn(
+        "text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableCell({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "td",
+    {
+      "data-slot": "table-cell",
+      className: tooltip.cn(
+        "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableCaption({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "caption",
+    {
+      "data-slot": "table-caption",
+      className: tooltip.cn("text-muted-foreground mt-4 text-sm", className),
+      ...props
+    }
+  );
+}
+function Dialog({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Root, { "data-slot": "dialog", ...props });
+}
+function DialogTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Trigger, { "data-slot": "dialog-trigger", ...props });
+}
+function DialogPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Portal, { "data-slot": "dialog-portal", ...props });
+}
+function DialogClose({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Close, { "data-slot": "dialog-close", ...props });
+}
+const DialogOverlay = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  DialogPrimitive__namespace.Overlay,
+  {
+    ref,
+    "data-slot": "dialog-overlay",
+    className: tooltip.cn(
+      "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/40 backdrop-blur-sm",
+      className
+    ),
+    ...props
+  }
+));
+DialogOverlay.displayName = DialogPrimitive__namespace.Overlay.displayName;
+const dialogVariants = classVarianceAuthority.cva(
+  "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 flex flex-col w-full translate-x-[-50%] translate-y-[-50%] border shadow-elevation-sm duration-200 rounded-[var(--radius-card)] overflow-hidden max-h-[calc(100dvh-2rem)]",
+  {
+    variants: {
+      size: {
+        sm: "max-w-sm",
+        md: "max-w-md",
+        lg: "max-w-lg",
+        xl: "max-w-xl",
+        "2xl": "max-w-2xl",
+        "3xl": "max-w-3xl",
+        "4xl": "max-w-4xl",
+        "5xl": "max-w-5xl",
+        full: "max-w-[calc(100vw-2rem)] h-[calc(100dvh-2rem)]"
+      }
+    },
+    defaultVariants: {
+      size: "lg"
+    }
+  }
+);
+const DialogContent = React__namespace.forwardRef(({ className, children, size, showClose = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { "data-slot": "dialog-portal", children: [
+  /* @__PURE__ */ jsxRuntime.jsx(DialogOverlay, {}),
+  /* @__PURE__ */ jsxRuntime.jsxs(
+    DialogPrimitive__namespace.Content,
+    {
+      ref,
+      "data-slot": "dialog-content",
+      className: tooltip.cn(dialogVariants({ size }), className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 p-6 overflow-y-auto flex-1 min-h-0", children }),
+        showClose && /* @__PURE__ */ jsxRuntime.jsxs(DialogPrimitive__namespace.Close, { className: "absolute top-4 right-4 z-10 rounded-full p-2 opacity-70 transition-all hover:opacity-100 hover:bg-accent focus:ring-2 focus:ring-primary focus:ring-offset-2 focus:outline-none disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, {}),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+DialogContent.displayName = DialogPrimitive__namespace.Content.displayName;
+function DialogHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "dialog-header",
+      className: tooltip.cn("flex flex-col gap-2 text-left shrink-0", className),
+      ...props
+    }
+  );
+}
+function DialogBody({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "dialog-body",
+      className: tooltip.cn("flex-1 overflow-y-auto min-h-0 -mx-6 px-6", className),
+      ...props
+    }
+  );
+}
+function DialogFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "dialog-footer",
+      className: tooltip.cn(
+        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end shrink-0",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function DialogTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    DialogPrimitive__namespace.Title,
+    {
+      "data-slot": "dialog-title",
+      className: tooltip.cn("text-foreground font-semibold leading-tight text-[length:var(--text-h4)]", className),
+      ...props
+    }
+  );
+}
+function DialogDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    DialogPrimitive__namespace.Description,
+    {
+      "data-slot": "dialog-description",
+      className: tooltip.cn("text-muted-foreground", className),
+      ...props
+    }
+  );
+}
+const Textarea = React__namespace.forwardRef(
+  ({ className, size = "md", ...props }, ref) => {
+    const sizeClasses = {
+      sm: "px-2 py-1 text-sm",
+      md: "px-3 py-2 text-base",
+      lg: "px-4 py-3 text-base"
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "textarea",
+      {
+        "data-slot": "textarea",
+        className: tooltip.cn(
+          "flex min-h-16 w-full bg-background rounded-[var(--radius)] border border-border transition-colors outline-none resize-none text-foreground",
+          "placeholder:text-muted-foreground",
+          "focus:ring-2 focus:ring-primary focus:border-transparent",
+          "disabled:cursor-not-allowed disabled:opacity-50",
+          sizeClasses[size],
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Textarea.displayName = "Textarea";
+function RichTextEditor({
+  value,
+  onChange,
+  placeholder,
+  className,
+  actionButton,
+  allowSearch = true,
+  allowLinks = true,
+  allowUndoRedo = true,
+  allowHeadings = true,
+  allowFormatting = true,
+  allowAlignment = true,
+  allowLists = true,
+  showWordCount = true,
+  showCharacterCount = true,
+  disabled = false,
+  readOnly = false,
+  onFocus,
+  onBlur,
+  minHeight,
+  maxHeight
+}) {
+  const isEditable = !disabled && !readOnly;
+  const showToolbar = isEditable;
+  const editorRef = React.useRef(null);
+  const [activeFormats, setActiveFormats] = React.useState({});
+  const [isSearchOpen, setIsSearchOpen] = React.useState(false);
+  const [searchQuery, setSearchQuery] = React.useState("");
+  const [linkUrl, setLinkUrl] = React.useState("https://");
+  const [isLinkOpen, setIsLinkOpen] = React.useState(false);
+  const searchInputRef = React.useRef(null);
+  const linkInputRef = React.useRef(null);
+  const savedSelection = React.useRef(null);
+  const findParentTag = (node, tagName) => {
+    let current = node;
+    while (current && current !== editorRef.current) {
+      if (current.nodeName === tagName) return current;
+      current = current.parentNode;
+    }
+    return null;
+  };
+  const updateActiveFormats = () => {
+    let formatBlock = "";
+    try {
+      formatBlock = document.queryCommandValue("formatBlock");
+    } catch (e) {
+    }
+    const selection = window.getSelection();
+    const anchorNode = selection == null ? void 0 : selection.anchorNode;
+    const focusNode = selection == null ? void 0 : selection.focusNode;
+    setActiveFormats({
+      bold: document.queryCommandState("bold"),
+      italic: document.queryCommandState("italic"),
+      underline: document.queryCommandState("underline"),
+      justifyLeft: document.queryCommandState("justifyLeft"),
+      justifyCenter: document.queryCommandState("justifyCenter"),
+      justifyRight: document.queryCommandState("justifyRight"),
+      insertUnorderedList: document.queryCommandState("insertUnorderedList"),
+      insertOrderedList: document.queryCommandState("insertOrderedList"),
+      link: !!(findParentTag(anchorNode || null, "A") || findParentTag(focusNode || null, "A")),
+      h1: formatBlock === "h1" || formatBlock === "H1",
+      h2: formatBlock === "h2" || formatBlock === "H2",
+      h3: formatBlock === "h3" || formatBlock === "H3",
+      p: formatBlock === "p" || formatBlock === "P" || formatBlock === "div" || formatBlock === "DIV" || formatBlock === ""
+    });
+  };
+  const getCurrentBlockLabel = () => {
+    if (activeFormats.h1) return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading1, { className: "w-4 h-4 mr-1 shrink-0" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: "Título 1" })
+    ] });
+    if (activeFormats.h2) return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading2, { className: "w-4 h-4 mr-1 shrink-0" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: "Título 2" })
+    ] });
+    if (activeFormats.h3) return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading3, { className: "w-4 h-4 mr-1 shrink-0" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: "Título 3" })
+    ] });
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Type, { className: "w-4 h-4 mr-1 shrink-0" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: "Parágrafo" })
+    ] });
+  };
+  React.useEffect(() => {
+    if (editorRef.current && editorRef.current.innerHTML !== value) {
+      editorRef.current.innerHTML = value;
+    }
+    const handleSelectionChange = () => {
+      if (document.activeElement === editorRef.current) {
+        updateActiveFormats();
+      }
+    };
+    document.addEventListener("selectionchange", handleSelectionChange);
+    return () => document.removeEventListener("selectionchange", handleSelectionChange);
+  }, []);
+  const execCommand = (command, value2 = "") => {
+    var _a;
+    document.execCommand(command, false, value2);
+    updateActiveFormats();
+    (_a = editorRef.current) == null ? void 0 : _a.focus();
+    handleInput();
+  };
+  const handleInput = () => {
+    if (editorRef.current) {
+      onChange == null ? void 0 : onChange(editorRef.current.innerHTML);
+      updateActiveFormats();
+    }
+  };
+  const getWordCount = () => {
+    var _a;
+    const text = ((_a = editorRef.current) == null ? void 0 : _a.innerText) || "";
+    return text.trim() ? text.trim().split(/\s+/).length : 0;
+  };
+  const getCharacterCount = () => {
+    var _a;
+    const text = ((_a = editorRef.current) == null ? void 0 : _a.innerText) || "";
+    return text.trim() ? text.length : 0;
+  };
+  const performSearch = (text, backward = false) => {
+    var _a, _b;
+    if (!text || !editorRef.current) return;
+    const editor = editorRef.current;
+    const selection = window.getSelection();
+    if (!selection) return;
+    const walker = document.createTreeWalker(editor, NodeFilter.SHOW_TEXT);
+    const segments = [];
+    let offset = 0;
+    let node;
+    while (node = walker.nextNode()) {
+      segments.push({ node, start: offset });
+      offset += node.length;
+    }
+    const fullText = segments.reduce((acc, s) => acc + (s.node.textContent ?? ""), "");
+    let searchFrom = 0;
+    if (selection.rangeCount > 0) {
+      const range2 = selection.getRangeAt(0);
+      if (editor.contains(range2.startContainer)) {
+        const seg = segments.find((s) => s.node === range2.startContainer);
+        if (seg) {
+          searchFrom = backward ? seg.start + range2.startOffset - 1 : seg.start + range2.endOffset;
+        }
+      }
+    }
+    const lowerFull = fullText.toLowerCase();
+    const lowerQuery = text.toLowerCase();
+    let matchStart = -1;
+    if (backward) {
+      matchStart = lowerFull.lastIndexOf(lowerQuery, Math.max(0, searchFrom));
+      if (matchStart === -1) matchStart = lowerFull.lastIndexOf(lowerQuery);
+    } else {
+      matchStart = lowerFull.indexOf(lowerQuery, searchFrom);
+      if (matchStart === -1) matchStart = lowerFull.indexOf(lowerQuery);
+    }
+    if (matchStart === -1) return;
+    const matchEnd = matchStart + text.length;
+    const range = document.createRange();
+    let startSet = false;
+    let endSet = false;
+    for (let i = 0; i < segments.length && !endSet; i++) {
+      const seg = segments[i];
+      const segEnd = seg.start + seg.node.length;
+      if (!startSet && matchStart < segEnd && matchStart >= seg.start) {
+        range.setStart(seg.node, matchStart - seg.start);
+        startSet = true;
+      }
+      if (startSet && matchEnd <= segEnd) {
+        range.setEnd(seg.node, matchEnd - seg.start);
+        endSet = true;
+      }
+    }
+    if (startSet && endSet) {
+      selection.removeAllRanges();
+      selection.addRange(range);
+      (_b = (_a = range.startContainer.parentElement) == null ? void 0 : _a.scrollIntoView) == null ? void 0 : _b.call(_a, { block: "nearest" });
+    }
+  };
+  const handleCreateLink = () => {
+    if (savedSelection.current) {
+      const selection2 = window.getSelection();
+      selection2 == null ? void 0 : selection2.removeAllRanges();
+      selection2 == null ? void 0 : selection2.addRange(savedSelection.current);
+    }
+    const selection = window.getSelection();
+    const anchorNode = selection == null ? void 0 : selection.anchorNode;
+    const existingLink = findParentTag(anchorNode || null, "A");
+    if (existingLink) {
+      if (linkUrl) {
+        existingLink.setAttribute("href", linkUrl);
+        existingLink.setAttribute("target", "_blank");
+        existingLink.setAttribute("rel", "noopener noreferrer");
+        existingLink.style.color = "hsl(var(--primary))";
+        existingLink.style.textDecoration = "underline";
+        existingLink.style.cursor = "pointer";
+      }
+      handleInput();
+      setIsLinkOpen(false);
+      savedSelection.current = null;
+      return;
+    }
+    if (!selection || selection.rangeCount === 0 || selection.isCollapsed) {
+      return;
+    }
+    if (linkUrl) {
+      execCommand("createLink", linkUrl);
+      setTimeout(() => {
+        var _a;
+        const anchor = findParentTag(((_a = window.getSelection()) == null ? void 0 : _a.anchorNode) || null, "A");
+        if (anchor) {
+          anchor.setAttribute("target", "_blank");
+          anchor.setAttribute("rel", "noopener noreferrer");
+          anchor.style.color = "hsl(var(--primary))";
+          anchor.style.textDecoration = "underline";
+          anchor.style.cursor = "pointer";
+        }
+        handleInput();
+      }, 10);
+      setIsLinkOpen(false);
+      savedSelection.current = null;
+    }
+  };
+  const handleUnlink = () => {
+    const selection = window.getSelection();
+    const anchorNode = selection == null ? void 0 : selection.anchorNode;
+    const existingLink = findParentTag(anchorNode || null, "A");
+    if (existingLink) {
+      const parent = existingLink.parentNode;
+      while (existingLink.firstChild) {
+        parent == null ? void 0 : parent.insertBefore(existingLink.firstChild, existingLink);
+      }
+      parent == null ? void 0 : parent.removeChild(existingLink);
+      handleInput();
+    } else {
+      execCommand("unlink");
+    }
+  };
+  const onLinkPopoverOpenChange = (open) => {
+    if (open) {
+      const selection = window.getSelection();
+      const anchorNode = selection == null ? void 0 : selection.anchorNode;
+      const focusNode = selection == null ? void 0 : selection.focusNode;
+      const existingLink = findParentTag(anchorNode || null, "A") || findParentTag(focusNode || null, "A");
+      if (existingLink) {
+        setLinkUrl(existingLink.getAttribute("href") || "https://");
+      } else {
+        setLinkUrl("https://");
+      }
+      if (selection && selection.rangeCount > 0 && (!selection.isCollapsed || existingLink)) {
+        savedSelection.current = selection.getRangeAt(0).cloneRange();
+      } else {
+        savedSelection.current = null;
+      }
+      setTimeout(() => {
+        var _a;
+        return (_a = linkInputRef.current) == null ? void 0 : _a.focus();
+      }, 100);
+    }
+    setIsLinkOpen(open);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tooltip.cn("flex flex-col h-full w-full bg-background sm:border border-border sm:shadow-sm sm:rounded-lg overflow-hidden", disabled && "opacity-50 pointer-events-none", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
+        [contenteditable]:empty:before {
+          content: attr(data-placeholder);
+          color: hsl(var(--muted-foreground));
+          pointer-events: none;
+          display: block;
+        }
+        .prose-editor ul {
+          list-style-type: disc !important;
+          padding-left: 1.5rem !important;
+          margin-top: 0.5rem !important;
+          margin-bottom: 0.5rem !important;
+        }
+        .prose-editor ol {
+          list-style-type: decimal !important;
+          padding-left: 1.5rem !important;
+          margin-top: 0.5rem !important;
+          margin-bottom: 0.5rem !important;
+        }
+        .prose-editor b, .prose-editor strong {
+          font-weight: 600 !important;
+        }
+        .prose-editor i, .prose-editor em {
+          font-style: italic !important;
+        }
+        .prose-editor u {
+          text-decoration: underline !important;
+        }
+        .prose-editor h1 {
+          font-size: 2.25rem !important;
+          font-weight: 700 !important;
+          margin-bottom: 1.25rem !important;
+          line-height: 1.2 !important;
+          margin-top: 2rem !important;
+          color: hsl(var(--foreground));
+        }
+        .prose-editor h2 {
+          font-size: 1.75rem !important;
+          font-weight: 600 !important;
+          margin-bottom: 1rem !important;
+          margin-top: 1.5rem !important;
+          color: hsl(var(--foreground));
+        }
+        .prose-editor h3 {
+          font-size: 1.35rem !important;
+          font-weight: 600 !important;
+          margin-bottom: 0.75rem !important;
+          margin-top: 1.25rem !important;
+          color: hsl(var(--foreground));
+        }
+        .prose-editor p {
+          margin-bottom: 1rem !important;
+          line-height: 1.6 !important;
+        }
+        .prose-editor a {
+          color: var(--info) !important;
+          text-decoration: underline !important;
+          cursor: pointer !important;
+        }
+        .prose-editor h1:first-child, .prose-editor h2:first-child, .prose-editor h3:first-child, .prose-editor p:first-child {
+          margin-top: 0 !important;
+        }
+        .prose-editor {
+          outline: none !important;
+        }
+      ` }),
+    showToolbar && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 py-2 border-b border-border bg-muted/30 flex items-center gap-1 flex-wrap shrink-0", children: [
+      allowUndoRedo && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: "h-8 w-8 text-muted-foreground",
+            onClick: () => execCommand("undo"),
+            title: "Desfazer",
+            "aria-label": "Desfazer",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Undo, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: "h-8 w-8 text-muted-foreground",
+            onClick: () => execCommand("redo"),
+            title: "Refazer",
+            "aria-label": "Refazer",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Redo, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
+      ] }),
+      allowHeadings && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu, { modal: false, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(tooltip.Button, { variant: "ghost", size: "sm", className: "h-8 gap-0 text-muted-foreground w-[120px] justify-start px-2", children: [
+            getCurrentBlockLabel(),
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "w-3 h-3 ml-auto opacity-50 shrink-0" })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenuContent, { align: "start", className: "w-[160px]", style: { zIndex: 9999 }, children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem, { onPointerDown: (e) => e.preventDefault(), onClick: () => execCommand("formatBlock", "P"), className: "gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Type, { className: "w-4 h-4 text-muted-foreground" }),
+              " Parágrafo"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem, { onPointerDown: (e) => e.preventDefault(), onClick: () => execCommand("formatBlock", "H1"), className: "gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading1, { className: "w-4 h-4 text-muted-foreground" }),
+              " Título 1"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem, { onPointerDown: (e) => e.preventDefault(), onClick: () => execCommand("formatBlock", "H2"), className: "gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading2, { className: "w-4 h-4 text-muted-foreground" }),
+              " Título 2"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem, { onPointerDown: (e) => e.preventDefault(), onClick: () => execCommand("formatBlock", "H3"), className: "gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading3, { className: "w-4 h-4 text-muted-foreground" }),
+              " Título 3"
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
+      ] }),
+      allowFormatting && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: tooltip.cn("h-8 w-8 text-muted-foreground", activeFormats.bold && "bg-muted text-foreground"),
+            onClick: () => execCommand("bold"),
+            title: "Negrito",
+            "aria-label": "Negrito",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bold, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: tooltip.cn("h-8 w-8 text-muted-foreground", activeFormats.italic && "bg-muted text-foreground"),
+            onClick: () => execCommand("italic"),
+            title: "Itálico",
+            "aria-label": "Itálico",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Italic, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: tooltip.cn("h-8 w-8 text-muted-foreground", activeFormats.underline && "bg-muted text-foreground"),
+            onClick: () => execCommand("underline"),
+            title: "Sublinhado",
+            "aria-label": "Sublinhado",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Underline, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
+      ] }),
+      allowAlignment && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: tooltip.cn("h-8 w-8 text-muted-foreground", activeFormats.justifyLeft && "bg-muted text-foreground"),
+            onClick: () => execCommand("justifyLeft"),
+            title: "Alinhar à esquerda",
+            "aria-label": "Alinhar à esquerda",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlignLeft, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: tooltip.cn("h-8 w-8 text-muted-foreground", activeFormats.justifyCenter && "bg-muted text-foreground"),
+            onClick: () => execCommand("justifyCenter"),
+            title: "Centralizar",
+            "aria-label": "Centralizar",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlignCenter, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: tooltip.cn("h-8 w-8 text-muted-foreground", activeFormats.justifyRight && "bg-muted text-foreground"),
+            onClick: () => execCommand("justifyRight"),
+            title: "Alinhar à direita",
+            "aria-label": "Alinhar à direita",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlignRight, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
+      ] }),
+      allowLists && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: tooltip.cn("h-8 w-8 text-muted-foreground", activeFormats.insertUnorderedList && "bg-muted text-foreground"),
+            onClick: () => execCommand("insertUnorderedList"),
+            title: "Lista com marcadores",
+            "aria-label": "Lista com marcadores",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.List, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: tooltip.cn("h-8 w-8 text-muted-foreground", activeFormats.insertOrderedList && "bg-muted text-foreground"),
+            onClick: () => execCommand("insertOrderedList"),
+            title: "Lista numerada",
+            "aria-label": "Lista numerada",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ListOrdered, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
+      ] }),
+      allowLinks && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(input.Popover, { open: isLinkOpen, onOpenChange: onLinkPopoverOpenChange, modal: false, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(input.PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+            tooltip.Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: tooltip.cn("h-8 w-8 text-muted-foreground", (activeFormats.link || isLinkOpen) && "bg-muted text-foreground"),
+              title: "Inserir link",
+              "aria-label": "Inserir link",
+              children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Link, { className: "w-4 h-4" })
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsx(input.PopoverContent, { className: "w-80 p-3", align: "start", style: { zIndex: 9999 }, children: !savedSelection.current && !activeFormats.link ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground py-1", children: "Selecione um texto para criar um link." }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium", children: activeFormats.link ? "Editar Link" : "Inserir Link" }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                input.Input,
+                {
+                  ref: linkInputRef,
+                  placeholder: "https://...",
+                  value: linkUrl,
+                  onChange: (e) => setLinkUrl(e.target.value),
+                  onKeyDown: (e) => e.key === "Enter" && handleCreateLink(),
+                  className: "h-8 text-xs"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(tooltip.Button, { size: "sm", className: "h-8", onClick: handleCreateLink, children: "Aplicar" })
+            ] })
+          ] }) })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: "h-8 w-8 text-muted-foreground",
+            onClick: handleUnlink,
+            title: "Remover link",
+            "aria-label": "Remover link",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
+      ] }),
+      (allowFormatting || allowHeadings || allowAlignment || allowLists || allowLinks) && /* @__PURE__ */ jsxRuntime.jsx(
+        tooltip.Button,
+        {
+          variant: "ghost",
+          size: "icon",
+          className: "h-8 w-8 text-muted-foreground",
+          onClick: () => execCommand("removeFormat"),
+          title: "Limpar formatação",
+          "aria-label": "Limpar formatação",
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Type, { className: "w-4 h-4" })
+        }
+      ),
+      allowSearch && /* @__PURE__ */ jsxRuntime.jsx(
+        tooltip.Button,
+        {
+          variant: "ghost",
+          size: "icon",
+          className: tooltip.cn("h-8 w-8 text-muted-foreground", isSearchOpen && "bg-muted text-foreground"),
+          onClick: () => {
+            setIsSearchOpen(!isSearchOpen);
+            if (!isSearchOpen) setTimeout(() => {
+              var _a;
+              return (_a = searchInputRef.current) == null ? void 0 : _a.focus();
+            }, 100);
+          },
+          title: "Buscar",
+          "aria-label": "Buscar",
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "w-4 h-4" })
+        }
+      ),
+      actionButton && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
+        actionButton
+      ] })
+    ] }),
+    isSearchOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 py-1.5 border-b border-border bg-muted/20 flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-1 max-w-sm", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-muted-foreground" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          input.Input,
+          {
+            ref: searchInputRef,
+            placeholder: "Buscar no texto...",
+            value: searchQuery,
+            onChange: (e) => setSearchQuery(e.target.value),
+            onKeyDown: (e) => {
+              if (e.key === "Enter") {
+                e.preventDefault();
+                performSearch(searchQuery, e.shiftKey);
+              }
+              if (e.key === "Escape") {
+                setIsSearchOpen(false);
+              }
+            },
+            className: "h-8 pl-8 text-xs bg-background"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: "h-7 w-7",
+            onMouseDown: (e) => e.preventDefault(),
+            onClick: () => performSearch(searchQuery, true),
+            title: "Anterior",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: "h-7 w-7",
+            onMouseDown: (e) => e.preventDefault(),
+            onClick: () => performSearch(searchQuery, false),
+            title: "Próximo",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-4 bg-border mx-1" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          tooltip.Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            className: "h-7 w-7 text-muted-foreground hover:text-foreground",
+            onClick: () => setIsSearchOpen(false),
+            title: "Fechar busca",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-4 h-4" })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden sm:block text-[10px] text-muted-foreground ml-auto uppercase tracking-wider font-medium", children: "Pressione Enter para buscar" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "flex-1 overflow-y-auto p-4 sm:p-8 bg-background scrollbar-thin",
+        style: { minHeight, maxHeight },
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            ref: editorRef,
+            contentEditable: isEditable,
+            onInput: handleInput,
+            onSelect: isEditable ? updateActiveFormats : void 0,
+            onFocus: () => {
+              updateActiveFormats();
+              onFocus == null ? void 0 : onFocus();
+            },
+            onBlur,
+            className: "prose-editor min-h-full max-w-none focus:outline-none",
+            "data-placeholder": placeholder
+          }
+        )
+      }
+    ),
+    (showWordCount || showCharacterCount) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-4 py-2 border-t border-border bg-muted/20 flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[10px] sm:text-xs text-muted-foreground font-medium uppercase tracking-wider flex items-center gap-2", children: [
+        showWordCount && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+          getWordCount(),
+          " ",
+          getWordCount() === 1 ? "palavra" : "palavras"
+        ] }),
+        showWordCount && showCharacterCount && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground/40", children: "•" }),
+        showCharacterCount && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+          getCharacterCount(),
+          " ",
+          getCharacterCount() === 1 ? "caractere" : "caracteres"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[10px] sm:text-xs text-muted-foreground/60 italic", children: "Auto-save ativo" })
+    ] })
+  ] });
+}
+exports.Alert = Alert;
+exports.AlertDescription = AlertDescription;
+exports.AlertTitle = AlertTitle;
+exports.Card = Card;
+exports.CardAction = CardAction;
+exports.CardContent = CardContent;
+exports.CardDescription = CardDescription;
+exports.CardFooter = CardFooter;
+exports.CardHeader = CardHeader;
+exports.CardTitle = CardTitle;
+exports.ChartCard = ChartCard;
+exports.ChartContainer = ChartContainer;
+exports.ChartLegend = ChartLegend;
+exports.ChartLegendContent = ChartLegendContent;
+exports.ChartStyle = ChartStyle;
+exports.ChartTooltip = ChartTooltip;
+exports.ChartTooltipContent = ChartTooltipContent;
+exports.ComboMetricChart = ComboMetricChart;
+exports.DashboardBarChart = DashboardBarChart;
+exports.DashboardLineChart = DashboardLineChart;
+exports.Dialog = Dialog;
+exports.DialogBody = DialogBody;
+exports.DialogClose = DialogClose;
+exports.DialogContent = DialogContent;
+exports.DialogDescription = DialogDescription;
+exports.DialogFooter = DialogFooter;
+exports.DialogHeader = DialogHeader;
+exports.DialogOverlay = DialogOverlay;
+exports.DialogPortal = DialogPortal;
+exports.DialogTitle = DialogTitle;
+exports.DialogTrigger = DialogTrigger;
+exports.DonutBreakdownChart = DonutBreakdownChart;
+exports.Empty = Empty;
+exports.EmptyAction = EmptyAction;
+exports.EmptyDescription = EmptyDescription;
+exports.EmptyIcon = EmptyIcon;
+exports.EmptyImage = EmptyImage;
+exports.EmptyTitle = EmptyTitle;
+exports.HorizontalBarChart = HorizontalBarChart;
+exports.InteractiveTimeSeriesChart = InteractiveTimeSeriesChart;
+exports.RichTextEditor = RichTextEditor;
+exports.Skeleton = Skeleton;
+exports.Table = Table;
+exports.TableBody = TableBody;
+exports.TableCaption = TableCaption;
+exports.TableCell = TableCell;
+exports.TableFooter = TableFooter;
+exports.TableHead = TableHead;
+exports.TableHeader = TableHeader;
+exports.TableRow = TableRow;
+exports.Tabs = Tabs;
+exports.TabsContent = TabsContent;
+exports.TabsList = TabsList;
+exports.TabsTrigger = TabsTrigger;
+exports.Textarea = Textarea;