@rozaqi02/reusable-dashboard 1.1.4 → 1.2.0

package/dist/index.cjs

@@ -29,6 +29,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.js
 var index_exports = {};
 __export(index_exports, {
+  AutoDashboard: () => AutoDashboard,
   Badge: () => Badge,
   Button: () => Button,
   ChartCard: () => ChartCard,
@@ -50,6 +51,7 @@ __export(index_exports, {
   adaptCidikaDashboardData: () => adaptCidikaDashboardData,
   adaptDummyUmkmData: () => adaptDummyUmkmData,
   adaptTokoSepatuData: () => adaptTokoSepatuData,
+  adaptUniversalData: () => adaptUniversalData,
   buildDayBuckets: () => buildDayBuckets,
   cidikaWidgetConfig: () => cidikaWidgetConfig,
   createCidikaSupabaseSource: () => createCidikaSupabaseSource,
@@ -59,7 +61,10 @@ __export(index_exports, {
   createEmptyDashboardData: () => createEmptyDashboardData,
   createEmptyDummyUmkmData: () => createEmptyDummyUmkmData,
   createEmptyTokoSepatuData: () => createEmptyTokoSepatuData,
+  createEmptyUniversalData: () => createEmptyUniversalData,
   createTokoSepatuSupabaseSource: () => createTokoSepatuSupabaseSource,
+  createUniversalSource: () => createUniversalSource,
+  createUniversalWidgetConfig: () => createUniversalWidgetConfig,
   dummyUmkmWidgetConfig: () => dummyUmkmWidgetConfig,
   formatDate: () => formatDate,
   formatIDR: () => formatIDR,
@@ -387,6 +392,111 @@ function validateDashboardConfig(dashboardConfig) {
   return { valid: issues.length === 0, issues };
 }
 
+// src/config/createUniversalWidgetConfig.js
+function createUniversalWidgetConfig(columns = {}, opts = {}) {
+  const hasAudience = Boolean(columns.audience);
+  const hasItem = Boolean(columns.item);
+  const hasCustomer = Boolean(columns.customer);
+  const hasTotal = Boolean(columns.total);
+  const charts = [
+    { id: "dailyTrends", type: "dailyArea", label: "dailyTrends", icon: "BarChart3" },
+    { id: "statusDistribution", type: "statusPie", label: "statusDistribution", icon: "PieChart" }
+  ];
+  if (hasAudience) {
+    charts.push({
+      id: "audienceDistribution",
+      type: "audiencePie",
+      label: "audienceDistribution",
+      icon: "Users"
+    });
+  }
+  if (hasItem) {
+    charts.push({
+      id: "topPackages",
+      type: "topPackagesBar",
+      label: "topPackages",
+      icon: "TrendingUp"
+    });
+  }
+  const tableColumns = [
+    { id: "date", label: "date", accessor: "createdAt", type: "date" }
+  ];
+  if (hasCustomer) {
+    tableColumns.push({ id: "customer", label: "customer", accessor: "customerName" });
+  }
+  if (hasItem) {
+    tableColumns.push({ id: "package", label: "package", accessor: "packageName" });
+  }
+  if (hasAudience) {
+    tableColumns.push({ id: "audience", label: "audience", accessor: "audienceLabel" });
+  }
+  if (hasTotal) {
+    tableColumns.push({ id: "total", label: "total", accessor: "totalIDR", type: "currency" });
+  }
+  tableColumns.push({
+    id: "status",
+    label: "status",
+    accessor: "statusLabel",
+    type: "statusBadge",
+    statusAccessor: "status"
+  });
+  return {
+    id: opts.id || "universal.dashboard",
+    defaultFilters: {
+      statusScope: "confirmed",
+      includePendingOverlay: false,
+      audience: "",
+      daysPreset: 30,
+      sortPkgBy: "bookings",
+      sortPkgDir: "desc"
+    },
+    widgets: {
+      stats: [
+        {
+          id: "bookingsConfirm",
+          label: "confirmedBookings",
+          icon: "TrendingUp",
+          valueKey: "bookingsConfirm",
+          format: "number",
+          accentColor: "blue"
+        },
+        {
+          id: "revenueConfirm",
+          label: "confirmedRevenue",
+          icon: "DollarSign",
+          valueKey: "revenueConfirm",
+          format: "currency",
+          accentColor: "green"
+        },
+        {
+          id: "avgRevenue",
+          label: "avgRevenue",
+          icon: "Users",
+          valueKey: "avgRevenue",
+          format: "currency",
+          accentColor: "violet"
+        },
+        {
+          id: "conversionRate",
+          label: "conversionRate",
+          icon: "PieChart",
+          valueKey: "conversionRate",
+          format: "percent",
+          accentColor: "orange"
+        }
+      ],
+      charts,
+      table: {
+        id: "recentBookings",
+        label: "recentBookings",
+        icon: "Calendar",
+        emptyLabel: "noRecentBookings",
+        columns: tableColumns
+      }
+    }
+  };
+}
+
 // src/utils/formatters.js
 function formatIDR(value) {
   try {
@@ -792,6 +902,131 @@ function adaptTokoSepatuData({ raw, filters, range, dateLocale, labels }) {
   };
 }
 
+// src/data-adapter/universalAdapter.js
+function createEmptyUniversalData() {
+  return {
+    stats: {
+      bookingsConfirm: 0,
+      bookingsPending: 0,
+      revenueConfirm: 0,
+      avgRevenue: 0,
+      conversionRate: 0
+    },
+    charts: {
+      dailyTrends: [],
+      statusDistribution: [],
+      audienceDistribution: [],
+      topPackages: []
+    },
+    table: {
+      recentBookings: []
+    }
+  };
+}
+function adaptUniversalData({
+  raw,
+  filters = {},
+  range,
+  dateLocale = "id-ID",
+  labels = {},
+  options = {}
+}) {
+  if (!raw) return createEmptyUniversalData();
+  const confirmedValue = String(options.confirmedValue || "confirmed").toLowerCase();
+  const pendingValue = String(options.pendingValue || "pending").toLowerCase();
+  const dailyBuckets = buildDayBuckets(range.daysWindow, range.fromISO, dateLocale);
+  const dayLookup = new Map(dailyBuckets.map((bucket) => [bucket.dateKey, bucket]));
+  const statusMap = /* @__PURE__ */ new Map();
+  const audienceMap = /* @__PURE__ */ new Map();
+  const itemCountMap = /* @__PURE__ */ new Map();
+  const itemRevenueMap = /* @__PURE__ */ new Map();
+  let bookingsConfirm = 0;
+  let bookingsPending = 0;
+  let revenueConfirm = 0;
+  const safeStatusLabel = typeof labels.formatStatusLabel === "function" ? labels.formatStatusLabel : (s) => String(s);
+  const safeAudienceLabel = typeof labels.formatAudienceLabel === "function" ? labels.formatAudienceLabel : (a) => String(a);
+  (raw.bookings || []).forEach((row) => {
+    const dayKey = String(row.created_at || "").slice(0, 10);
+    const status = String(row.status || pendingValue).toLowerCase();
+    const total = toNumber(row.total_idr);
+    const audience = row.audience || "unknown";
+    const item = row.item || "-";
+    statusMap.set(status, (statusMap.get(status) || 0) + 1);
+    audienceMap.set(audience, (audienceMap.get(audience) || 0) + 1);
+    const bucket = dayLookup.get(dayKey);
+    if (bucket) {
+      if (status === confirmedValue) {
+        bucket.count += 1;
+        bucket.revenue += total;
+      }
+      if (status === pendingValue) {
+        bucket.pendingCount += 1;
+      }
+    }
+    if (status === confirmedValue) {
+      bookingsConfirm += 1;
+      revenueConfirm += total;
+      itemCountMap.set(item, (itemCountMap.get(item) || 0) + 1);
+      itemRevenueMap.set(item, (itemRevenueMap.get(item) || 0) + total);
+    } else if (status === pendingValue) {
+      bookingsPending += 1;
+    }
+  });
+  const statusDistribution = sortMapEntries(statusMap, "desc").map(
+    ([status, count]) => ({
+      status,
+      label: safeStatusLabel(status),
+      count
+    })
+  );
+  const audienceDistribution = sortMapEntries(audienceMap, "desc").map(
+    ([audience, count]) => ({
+      audience,
+      label: safeAudienceLabel(audience),
+      count
+    })
+  );
+  const metricMap = filters.sortPkgBy === "revenue" ? itemRevenueMap : itemCountMap;
+  const topPackages = sortMapEntries(metricMap, filters.sortPkgDir || "desc").slice(0, 5).map(([item, value]) => ({
+    packageId: item,
+    name: item,
+    value: toNumber(value)
+  }));
+  const recentBookings = (raw.recent || []).map((row) => {
+    const status = String(row.status || pendingValue).toLowerCase();
+    return {
+      id: row.id,
+      createdAt: row.created_at,
+      customerName: row.customer_name || "-",
+      packageName: row.item || "-",
+      audienceLabel: safeAudienceLabel(row.audience),
+      totalIDR: toNumber(row.total_idr),
+      status,
+      statusLabel: safeStatusLabel(status)
+    };
+  });
+  const avgRevenue = bookingsConfirm > 0 ? Math.round(revenueConfirm / bookingsConfirm) : 0;
+  const conversionRate = bookingsConfirm + bookingsPending > 0 ? Math.round(bookingsConfirm / (bookingsConfirm + bookingsPending) * 100) : 0;
+  return {
+    stats: {
+      bookingsConfirm,
+      bookingsPending,
+      revenueConfirm,
+      avgRevenue,
+      conversionRate
+    },
+    charts: {
+      dailyTrends: dailyBuckets,
+      statusDistribution,
+      audienceDistribution,
+      topPackages
+    },
+    table: {
+      recentBookings
+    }
+  };
+}
+
 // src/data-source/cidikaSupabaseSource.js
 function ensureNoError(response, message) {
   if (response == null ? void 0 : response.error) {
@@ -965,6 +1200,84 @@ function createTokoSepatuSupabaseSource(supabase) {
   };
 }
 
+// src/data-source/universalSupabaseSource.js
+function createUniversalSource(supabase, { table, columns = {} } = {}) {
+  if (!supabase) {
+    throw new Error("createUniversalSource: prop 'supabase' wajib diisi.");
+  }
+  if (!table) {
+    throw new Error("createUniversalSource: opsi 'table' wajib diisi.");
+  }
+  if (!columns.date) {
+    throw new Error(
+      "createUniversalSource: columns.date wajib diisi (kolom timestamp)."
+    );
+  }
+  const map = {
+    date: columns.date,
+    status: columns.status || null,
+    total: columns.total || null,
+    customer: columns.customer || null,
+    item: columns.item || null,
+    audience: columns.audience || null
+  };
+  const selectCols = Array.from(
+    /* @__PURE__ */ new Set(["id", ...Object.values(map).filter(Boolean)])
+  ).join(", ");
+  const normalize = (row) => ({
+    id: row.id ?? row[map.date],
+    created_at: row[map.date],
+    status: map.status ? row[map.status] : "confirmed",
+    total_idr: map.total ? row[map.total] : 0,
+    item: map.item ? row[map.item] : null,
+    customer_name: map.customer ? row[map.customer] : null,
+    audience: map.audience ? row[map.audience] : "unknown"
+  });
+  return {
+    async fetchDashboardSnapshot({ fromISO, toISO, audience, statusScope }) {
+      const baseQuery = () => supabase.from(table).select(selectCols).gte(map.date, fromISO).lte(map.date, toISO);
+      const bookingsQuery = baseQuery().order(map.date, { ascending: true });
+      if (audience && map.audience) bookingsQuery.eq(map.audience, audience);
+      const recentQuery = baseQuery().order(map.date, { ascending: false }).limit(10);
+      if (audience && map.audience) recentQuery.eq(map.audience, audience);
+      if (statusScope && statusScope !== "all" && map.status) {
+        recentQuery.eq(map.status, statusScope);
+      }
+      const [bookingsRes, recentRes] = await Promise.all([
+        bookingsQuery,
+        recentQuery
+      ]);
+      if (bookingsRes == null ? void 0 : bookingsRes.error) {
+        const err = new Error(
+          `Gagal membaca tabel "${table}". Periksa nama tabel/kolom & RLS policy.`
+        );
+        err.cause = bookingsRes.error;
+        throw err;
+      }
+      const bookings = (bookingsRes.data || []).map(normalize);
+      const recent = (recentRes.error ? [] : recentRes.data || []).map(
+        normalize
+      );
+      return {
+        bookings,
+        recent,
+        packageLocales: [],
+        staticCounts: {}
+      };
+    },
+    subscribeLiveUpdate(onEvent) {
+      const channel = supabase.channel(`reusable-dashboard-universal-${table}`).on(
+        "postgres_changes",
+        { event: "*", schema: "public", table },
+        onEvent
+      ).subscribe();
+      return () => {
+        supabase.removeChannel(channel);
+      };
+    }
+  };
+}
+
 // src/hooks/useReusableDashboard.js
 var import_react2 = require("react");
 
@@ -1913,80 +2226,95 @@ var import_prop_types18 = __toESM(require("prop-types"), 1);
 var import_react19 = __toESM(require("react"), 1);
 var import_prop_types17 = __toESM(require("prop-types"), 1);
 var PRESET_SIGNATURES = {
-  cidika: {
-    name: "Cidika Travel",
-    tables: ["bookings", "packages", "package_locales"]
-  },
-  tokoSepatu: {
-    name: "Toko Sepatu / E-Commerce",
-    tables: ["orders", "products", "customers"]
-  }
+  cidika: { name: "Cidika Travel", tables: ["bookings", "packages", "package_locales"] },
+  tokoSepatu: { name: "Toko Sepatu / E-Commerce", tables: ["orders", "products", "customers"] }
 };
 function detectPreset(tables) {
-  if (!tables || tables.length === 0) return null;
-  const tSet = new Set(tables);
-  if (PRESET_SIGNATURES.cidika.tables.every((t) => tSet.has(t))) return "cidika";
-  if (PRESET_SIGNATURES.tokoSepatu.tables.every((t) => tSet.has(t))) return "tokoSepatu";
+  if (!(tables == null ? void 0 : tables.length)) return null;
+  const s = new Set(tables);
+  if (PRESET_SIGNATURES.cidika.tables.every((t) => s.has(t))) return "cidika";
+  if (PRESET_SIGNATURES.tokoSepatu.tables.every((t) => s.has(t))) return "tokoSepatu";
   return null;
 }
-function generateCode(mapping) {
-  const {
-    tableName,
-    colDate,
-    colStatus,
-    colTotal,
-    colCustomer,
-    colItem,
-    dashTitle,
-    confirmedValue,
-    pendingValue
-  } = mapping;
-  const safeTitle = dashTitle || "Dashboard";
+var SQL_GRANT_SCHEMA = `GRANT SELECT ON information_schema.tables  TO anon;
+GRANT SELECT ON information_schema.columns TO anon;`;
+var sqlRls = (tbl) => `-- Pilih salah satu sesuai kebutuhan (jalankan di Supabase SQL Editor):
+
+-- Opsi 1: Untuk DEVELOPMENT \u2014 nonaktifkan RLS (paling cepat)
+ALTER TABLE public.${tbl} DISABLE ROW LEVEL SECURITY;
+
+-- Opsi 2: Untuk PRODUCTION \u2014 izinkan semua orang baca
+ALTER TABLE public.${tbl} ENABLE ROW LEVEL SECURITY;
+CREATE POLICY "dashboard_read" ON public.${tbl}
+  FOR SELECT TO anon USING (true);
+
+-- Opsi 3: Untuk PRODUCTION \u2014 hanya user yang login
+ALTER TABLE public.${tbl} ENABLE ROW LEVEL SECURITY;
+CREATE POLICY "dashboard_auth" ON public.${tbl}
+  FOR SELECT TO authenticated USING (true);`;
+function generateCode({
+  tableName,
+  colDate,
+  colStatus,
+  colTotal,
+  colCustomer,
+  colItem,
+  dashTitle,
+  confirmedValue,
+  pendingValue
+}) {
+  const title = dashTitle || "Dashboard";
   const confirmed = confirmedValue || "confirmed";
   const pending = pendingValue || "pending";
-  const safeCustomer = colCustomer || "customer_name";
-  const safeItem = colItem || "-";
-  const colTotalFull = colTotal || "total";
+  const custCol = colCustomer || "customer_name";
+  const itemCol = colItem || "-";
+  const totalCol = colTotal || "total";
+  const cols = [
+    "id",
+    colDate,
+    colStatus,
+    totalCol,
+    ...custCol !== "customer_name" ? [custCol] : ["customer_name"],
+    ...itemCol !== "-" ? [itemCol] : []
+  ].filter(Boolean).join(", ");
   const dataSource = `// src/datasources/myDashboardSource.js
 // AUTO-GENERATED oleh Setup Wizard @rozaqi02/reusable-dashboard
-// Tabel: ${tableName}
 
 export function createMyDashboardSource(supabase) {
   return {
     async fetchDashboardSnapshot({ fromISO, toISO, statusScope }) {
-      const allQuery = supabase
+      const allQ = supabase
         .from("${tableName}")
-        .select("id, ${colDate}, ${colStatus}, ${colTotalFull}${colCustomer !== "customer_name" ? `, ${colCustomer}` : ", customer_name"}${colItem !== "-" ? `, ${colItem}` : ""}")
+        .select("${cols}")
         .gte("${colDate}", fromISO)
         .lte("${colDate}", toISO)
         .order("${colDate}", { ascending: true });
 
-      const recentQuery = supabase
+      const recentQ = supabase
         .from("${tableName}")
-        .select("id, ${colDate}, ${colStatus}, ${colTotalFull}${colCustomer !== "customer_name" ? `, ${colCustomer}` : ", customer_name"}${colItem !== "-" ? `, ${colItem}` : ""}")
+        .select("${cols}")
         .gte("${colDate}", fromISO)
         .lte("${colDate}", toISO)
         .order("${colDate}", { ascending: false })
         .limit(10);
 
       if (statusScope && statusScope !== "all") {
-        recentQuery.eq("${colStatus}", statusScope);
+        recentQ.eq("${colStatus}", statusScope);
       }
 
-      const [allRes, recentRes] = await Promise.all([allQuery, recentQuery]);
-
+      const [all, recent] = await Promise.all([allQ, recentQ]);
       return {
-        bookings: allRes.data   || [],  // semua transaksi (untuk chart & stats)
-        recent:   recentRes.data || [], // 10 terbaru (untuk tabel)
+        bookings: all.data    || [],
+        recent:   recent.data || [],
         packageLocales: [],
         staticCounts: { packages: 0, sections: 0 },
       };
     },
 
     subscribeLiveUpdate(onEvent) {
-      const ch = supabase
-        .channel("rdb-dashboard-live")
-        .on("postgres_changes", { event: "*", schema: "public", table: "${tableName}" }, onEvent)
+      const ch = supabase.channel("rdb-${tableName}-live")
+        .on("postgres_changes",
+            { event: "*", schema: "public", table: "${tableName}" }, onEvent)
         .subscribe();
       return () => supabase.removeChannel(ch);
     },
@@ -1994,15 +2322,13 @@ export function createMyDashboardSource(supabase) {
 }`;
   const adapter = `// src/adapters/myDashboardAdapter.js
 // AUTO-GENERATED oleh Setup Wizard @rozaqi02/reusable-dashboard
-// Mapping kolom: status="${colStatus}", total="${colTotalFull}", tanggal="${colDate}"
 
 import { toNumber, buildDayBuckets } from "@rozaqi02/reusable-dashboard";
 
 export function createEmptyMyDashboardData() {
   return {
-    stats:  { bookingsConfirm: 0, revenueConfirm: 0 },
-    charts: { dailyTrends: [], statusDistribution: [],
-              audienceDistribution: [], topPackages: [] },
+    stats:  { bookingsConfirm: 0, revenueConfirm: 0, avgRevenue: 0, conversionRate: 0 },
+    charts: { dailyTrends: [], statusDistribution: [], audienceDistribution: [], topPackages: [] },
     table:  { recentBookings: [] },
   };
 }
@@ -2016,51 +2342,45 @@ export function adaptMyDashboardData({ raw, range, dateLocale, labels }) {
   let confirmed = 0, revenue = 0;
 
   (raw.bookings || []).forEach(row => {
-    const status = String(row["${colStatus}"] || "pending").toLowerCase();
-    const amount = toNumber(row["${colTotalFull}"]);
-    const dayKey = String(row["${colDate}"] || "").slice(0, 10);
+    const st  = String(row["${colStatus}"] || "").toLowerCase();
+    const amt = toNumber(row["${totalCol}"]);
+    const dk  = String(row["${colDate}"] || "").slice(0, 10);
 
-    statusMap.set(status, (statusMap.get(status) || 0) + 1);
-    const bucket = dayMap.get(dayKey);
-    if (bucket) {
-      if (status === "${confirmed}") { bucket.count++; bucket.revenue += amount; }
-      if (status === "${pending}")   { bucket.pendingCount++; }
+    statusMap.set(st, (statusMap.get(st) || 0) + 1);
+    const b = dayMap.get(dk);
+    if (b) {
+      if (st === "${confirmed}") { b.count++;         b.revenue += amt; }
+      if (st === "${pending}")   { b.pendingCount++;                   }
     }
-    if (status === "${confirmed}") { confirmed++; revenue += amount; }
+    if (st === "${confirmed}") { confirmed++; revenue += amt; }
   });
 
-  const avgRevenue     = confirmed > 0 ? Math.round(revenue / confirmed) : 0;
-  const totalTx        = (raw.bookings || []).length;
-  const conversionRate = totalTx > 0 ? Math.round((confirmed / totalTx) * 100) : 0;
-
+  const total = (raw.bookings || []).length;
   return {
     stats: {
       bookingsConfirm: confirmed,
       revenueConfirm:  revenue,
-      avgRevenue,
-      conversionRate,
+      avgRevenue:      confirmed > 0 ? Math.round(revenue / confirmed) : 0,
+      conversionRate:  total > 0 ? Math.round((confirmed / total) * 100) : 0,
     },
     charts: {
       dailyTrends: buckets,
       statusDistribution: Array.from(statusMap.entries())
         .sort((a, b) => b[1] - a[1])
-        .map(([status, count]) => ({
-          status, count,
-          label: labels?.formatStatusLabel?.(status) || status,
-        })),
+        .map(([s, c]) => ({ status: s, count: c, label: labels?.formatStatusLabel?.(s) || s })),
       audienceDistribution: [],
       topPackages: [],
     },
     table: {
       recentBookings: (raw.recent || []).map(row => ({
-        id:           row.id,
-        createdAt:    row["${colDate}"],
-        customerName: row["${colCustomer}"] || "-",
-        packageName:  ${colItem !== "-" ? `row["${colItem}"] || "-"` : '"-"'},
+        id:            row.id,
+        createdAt:     row["${colDate}"],
+        customerName:  row["${custCol}"] || "-",
+        packageName:   ${itemCol !== "-" ? `row["${itemCol}"] || "-"` : '"-"'},
         audienceLabel: "-",
-        totalIDR:     toNumber(row["${colTotalFull}"]),
-        status:       String(row["${colStatus}"] || "pending").toLowerCase(),
-        statusLabel:  labels?.formatStatusLabel?.(row["${colStatus}"]) || row["${colStatus}"],
+        totalIDR:      toNumber(row["${totalCol}"]),
+        status:        String(row["${colStatus}"] || "").toLowerCase(),
+        statusLabel:   labels?.formatStatusLabel?.(row["${colStatus}"]) || row["${colStatus}"] || "-",
       })),
     },
   };
@@ -2070,151 +2390,120 @@ export function adaptMyDashboardData({ raw, range, dateLocale, labels }) {
 
 export const myDashboardConfig = {
   id: "my.custom.dashboard",
-  defaultFilters: {
-    statusScope: "${confirmed}",
-    daysPreset: 30,
-    sortPkgBy: "bookings",
-    sortPkgDir: "desc",
-  },
+  defaultFilters: { statusScope: "${confirmed}", daysPreset: 30,
+                    sortPkgBy: "bookings", sortPkgDir: "desc" },
   widgets: {
     stats: [
-      { id: "orders",     label: "confirmedBookings", icon: "TrendingUp",
-        valueKey: "bookingsConfirm", format: "number",   accentColor: "blue" },
-      { id: "revenue",    label: "confirmedRevenue",  icon: "DollarSign",
-        valueKey: "revenueConfirm",  format: "currency", accentColor: "green" },
-      { id: "avg",        label: "avgRevenue",         icon: "Users",
-        valueKey: "avgRevenue",       format: "currency", accentColor: "violet" },
-      { id: "conversion", label: "conversionRate",     icon: "PieChart",
-        valueKey: "conversionRate",   format: "percent",  accentColor: "orange" },
+      { id:"orders",     label:"confirmedBookings", icon:"TrendingUp",
+        valueKey:"bookingsConfirm", format:"number",   accentColor:"blue"   },
+      { id:"revenue",    label:"confirmedRevenue",  icon:"DollarSign",
+        valueKey:"revenueConfirm",  format:"currency", accentColor:"green"  },
+      { id:"avg",        label:"avgRevenue",         icon:"Users",
+        valueKey:"avgRevenue",       format:"currency", accentColor:"violet" },
+      { id:"conversion", label:"conversionRate",     icon:"PieChart",
+        valueKey:"conversionRate",   format:"percent",  accentColor:"orange" },
     ],
     charts: [
-      { id: "trend",  type: "dailyArea", label: "dailyTrends",        icon: "BarChart3" },
-      { id: "status", type: "statusPie", label: "statusDistribution", icon: "PieChart" },
+      { id:"trend",  type:"dailyArea", label:"dailyTrends",        icon:"BarChart3" },
+      { id:"status", type:"statusPie", label:"statusDistribution", icon:"PieChart"  },
     ],
     table: {
-      id: "recentTx", label: "recentBookings", icon: "Calendar",
-      emptyLabel: "noRecentBookings",
+      id:"recentTx", label:"recentBookings", icon:"Calendar", emptyLabel:"noRecentBookings",
       columns: [
-        { id: "date",     label: "date",     accessor: "createdAt",  type: "date" },
-        { id: "customer", label: "customer", accessor: "customerName" },${colItem !== "-" ? `
-        { id: "item",     label: "package",  accessor: "packageName" },` : ""}
-        { id: "total",    label: "total",    accessor: "totalIDR",   type: "currency" },
-        { id: "status",   label: "status",   accessor: "statusLabel",
-          type: "statusBadge", statusAccessor: "status" },
+        { id:"date",     label:"date",     accessor:"createdAt",  type:"date"     },
+        { id:"customer", label:"customer", accessor:"customerName"                },${itemCol !== "-" ? `
+        { id:"item",     label:"package",  accessor:"packageName"                  },` : ""}
+        { id:"total",    label:"total",    accessor:"totalIDR",   type:"currency" },
+        { id:"status",   label:"status",   accessor:"statusLabel",
+          type:"statusBadge", statusAccessor:"status"                             },
       ],
     },
   },
 };`;
   const dashboard = `// src/pages/admin/Dashboard.jsx
 // AUTO-GENERATED oleh Setup Wizard @rozaqi02/reusable-dashboard
-// Salin file ini ke halaman dashboard kamu.
 
 import React from "react";
 import { supabase } from "../../lib/supabaseClient.js";
 import {
-  ReusableDashboardView,
-  useReusableDashboard,
-  createDashboardConfig,
+  ReusableDashboardView, useReusableDashboard, createDashboardConfig,
 } from "@rozaqi02/reusable-dashboard";
 
-// Import 3 file yang digenerate wizard
-import { myDashboardConfig }    from "./myDashboardConfig";
-import { createMyDashboardSource } from "./myDashboardSource";
-import { adaptMyDashboardData, createEmptyMyDashboardData } from "./myDashboardAdapter";
+// Tiga file hasil generate wizard
+import { myDashboardConfig }                              from "../../config/myDashboardConfig";
+import { createMyDashboardSource }                        from "../../datasources/myDashboardSource";
+import { adaptMyDashboardData, createEmptyMyDashboardData } from "../../adapters/myDashboardAdapter";
 
-// Data source \u2014 dibuat sekali di luar komponen
 const source = createMyDashboardSource(supabase);
 
-// Label UI \u2014 sesuaikan teks dengan bahasa/konteks bisnis kamu
 const labels = {
-  title: "${safeTitle}",
-  refresh: "Refresh",
-  liveUpdate: "Live update",
-  loadFailed: "Gagal memuat data.",
-  retry: "Coba Lagi",
-  confirmedOnly: "Selesai",
-  pendingOnly: "Proses",
-  allStatus: "Semua Status",
-  showPendingOverlay: "Tampilkan pending",
-  reset: "Reset",
-  confirmedBookings: "Total Transaksi",
-  confirmedRevenue: "Total Pendapatan",
-  avgRevenue: "Rata-rata / Transaksi",
-  conversionRate: "Conversion Rate",
-  dailyTrends: "Tren Harian",
-  statusDistribution: "Distribusi Status",
-  recentBookings: "Transaksi Terbaru",
-  noRecentBookings: "Belum ada transaksi",
-  date: "Tanggal",
-  customer: "Pelanggan",
-  package: "Item",
-  total: "Total",
-  status: "Status",
-  bookingsMetric: "Transaksi",
-  revenueMetric: "Pendapatan",
+  title: "${title}", refresh: "Refresh", liveUpdate: "Live update",
+  loadFailed: "Gagal memuat data.", retry: "Coba Lagi",
+  confirmedOnly: "Selesai", pendingOnly: "Proses", allStatus: "Semua Status",
+  showPendingOverlay: "Tampilkan pending", reset: "Reset",
+  confirmedBookings: "Total Transaksi",  confirmedRevenue: "Total Pendapatan",
+  avgRevenue: "Rata-rata / Transaksi",   conversionRate: "Conversion Rate",
+  dailyTrends: "Tren Harian",            statusDistribution: "Distribusi Status",
+  recentBookings: "Transaksi Terbaru",   noRecentBookings: "Belum ada transaksi",
+  date: "Tanggal", customer: "Pelanggan", package: "Item",
+  total: "Total",  status: "Status",
+  bookingsMetric: "Transaksi",           revenueMetric: "Pendapatan",
   confirmedBookingMetric: "Transaksi (Selesai)",
   confirmedRevenueMetric: "Pendapatan (Selesai)",
   dayLabel: n => n + " hari",
-  formatStatusLabel: s =>
-    ({ "${confirmed}": "Selesai", "${pending}": "Proses" })[s] || (s || "-"),
+  formatStatusLabel:  s => ({ "${confirmed}":"Selesai", "${pending}":"Proses" })[s] || s || "-",
   formatAudienceLabel: v => v || "-",
 };
 
-// Kemas semua jadi 1 objek
 const dashboardConfig = createDashboardConfig({
-  widgetConfig: myDashboardConfig,
-  dataSource:   source,
-  adapter:      adaptMyDashboardData,
-  createEmptyState: createEmptyMyDashboardData,
-  languageCode: "id",
-  dateLocale:   "id-ID",
-  labels,
+  widgetConfig: myDashboardConfig, dataSource: source,
+  adapter: adaptMyDashboardData,   createEmptyState: createEmptyMyDashboardData,
+  languageCode: "id", dateLocale: "id-ID", labels,
 });
 
 export default function Dashboard() {
   const state = useReusableDashboard({ ...dashboardConfig, labels });
   return (
     <ReusableDashboardView
-      config={dashboardConfig.config}
-      labels={labels}
-      loading={state.loading}
-      error={state.error}
-      filters={state.filters}
-      onFilterChange={state.updateFilter}
-      onResetFilters={state.resetFilters}
-      onRefresh={state.refresh}
-      data={state.data}
-      dateLocale={dashboardConfig.dateLocale}
+      config={dashboardConfig.config}   labels={labels}
+      loading={state.loading}           error={state.error}
+      filters={state.filters}           onFilterChange={state.updateFilter}
+      onResetFilters={state.resetFilters} onRefresh={state.refresh}
+      data={state.data}                 dateLocale={dashboardConfig.dateLocale}
       liveUpdateEnabled={state.liveUpdateEnabled}
-      supabase={supabase}
-      dashboardConfig={dashboardConfig}
+      supabase={supabase}               dashboardConfig={dashboardConfig}
     />
   );
 }`;
   return { dataSource, adapter, widgetConfig, dashboard };
 }
 function SetupWizard({ issues = [], onDismiss, supabase }) {
+  var _a, _b;
   const [dismissed, setDismissed] = (0, import_react19.useState)(false);
   const [step, setStep] = (0, import_react19.useState)(0);
   const [detecting, setDetecting] = (0, import_react19.useState)(true);
   const [tables, setTables] = (0, import_react19.useState)([]);
   const [columns, setColumns] = (0, import_react19.useState)({});
+  const [sampleData, setSampleData] = (0, import_react19.useState)({});
+  const [statusValues, setStatusValues] = (0, import_react19.useState)({});
   const [supabaseOk, setSupabaseOk] = (0, import_react19.useState)(false);
   const [detectionDone, setDetectionDone] = (0, import_react19.useState)(false);
-  const [userHasDashboard, setUserHasDashboard] = (0, import_react19.useState)(null);
+  const [tableBlocked, setTableBlocked] = (0, import_react19.useState)(false);
   const [selectedTable, setSelectedTable] = (0, import_react19.useState)("");
   const [colDate, setColDate] = (0, import_react19.useState)("");
   const [colStatus, setColStatus] = (0, import_react19.useState)("");
   const [colTotal, setColTotal] = (0, import_react19.useState)("");
   const [colCustomer, setColCustomer] = (0, import_react19.useState)("");
   const [colItem, setColItem] = (0, import_react19.useState)("");
-  const [confirmedVal, setConfirmedVal] = (0, import_react19.useState)("confirmed");
-  const [pendingVal, setPendingVal] = (0, import_react19.useState)("pending");
+  const [confirmedVal, setConfirmedVal] = (0, import_react19.useState)("");
+  const [pendingVal, setPendingVal] = (0, import_react19.useState)("");
   const [dashTitle, setDashTitle] = (0, import_react19.useState)("Dashboard");
-  const [loadingColumns, setLoadingColumns] = (0, import_react19.useState)(false);
+  const [loadingCols, setLoadingCols] = (0, import_react19.useState)(false);
+  const [colsBlocked, setColsBlocked] = (0, import_react19.useState)(false);
   const [generatedCode, setGeneratedCode] = (0, import_react19.useState)(null);
-  const [activeCodeTab, setActiveCodeTab] = (0, import_react19.useState)("dataSource");
+  const [activeTab, setActiveTab] = (0, import_react19.useState)("dashboard");
   const [copied, setCopied] = (0, import_react19.useState)("");
+  const [showRls, setShowRls] = (0, import_react19.useState)(false);
   (0, import_react19.useEffect)(() => {
     if (!supabase) {
       setDetecting(false);
@@ -2223,388 +2512,376 @@ function SetupWizard({ issues = [], onDismiss, supabase }) {
     }
     (async () => {
       try {
-        const { data: rpcData, error: rpcErr } = await supabase.rpc("rdb_get_tables");
-        if (!rpcErr && Array.isArray(rpcData)) {
-          setTables(rpcData.map((r) => typeof r === "string" ? r : r.table_name || r.name || r));
+        const { data: d1, error: e1 } = await supabase.from("information_schema.tables").select("table_name").eq("table_schema", "public").eq("table_type", "BASE TABLE").order("table_name");
+        if (!e1 && (d1 == null ? void 0 : d1.length)) {
+          setTables(d1.map((r) => r.table_name));
           setSupabaseOk(true);
+          return;
+        }
+        const { data: d2, error: e2 } = await supabase.rpc("rdb_get_tables");
+        if (!e2 && Array.isArray(d2)) {
+          setTables(d2.map((r) => typeof r === "string" ? r : r.table_name || r));
+          setSupabaseOk(true);
+          return;
+        }
+        const { error: ping } = await supabase.from("_rdb_wizard_ping_").select("*").limit(1);
+        if (!ping || ping.code === "42P01" || ping.code === "PGRST116" || ping.code === "PGRST200" || ping.message && (ping.message.includes("does not exist") || ping.message.includes("not found") || ping.message.includes("relation"))) {
+          setSupabaseOk(true);
+          setTableBlocked(true);
         } else {
-          const { data: schemaData, error: schemaErr } = await supabase.from("information_schema.tables").select("table_name").eq("table_schema", "public").eq("table_type", "BASE TABLE").order("table_name");
-          if (!schemaErr && schemaData) {
-            setTables(schemaData.map((r) => r.table_name));
-            setSupabaseOk(true);
-          } else {
-            const { error: pingErr } = await supabase.from("_rdb_ping_").select("*").limit(1);
-            const connected = !pingErr || pingErr.code === "42P01" || pingErr.code === "PGRST116" || (pingErr.message || "").includes("does not exist");
-            setSupabaseOk(connected);
-            setTables([]);
-          }
+          setSupabaseOk(!!supabase);
+          setTableBlocked(true);
         }
       } catch {
-        setSupabaseOk(false);
+        setSupabaseOk(!!supabase);
+        setTableBlocked(true);
       } finally {
         setDetecting(false);
         setDetectionDone(true);
       }
     })();
   }, [supabase]);
-  const loadColumns = (0, import_react19.useCallback)(async (tbl) => {
-    if (!supabase || !tbl || columns[tbl]) return;
-    setLoadingColumns(true);
+  const analyzeTable = (0, import_react19.useCallback)(async (tbl) => {
+    var _a2;
+    if (!supabase || !tbl) return;
+    if (columns[tbl]) {
+      autoDetect(tbl, columns[tbl]);
+      return;
+    }
+    setLoadingCols(true);
+    setColsBlocked(false);
     try {
-      const { data: rpcCols, error: rpcErr } = await supabase.rpc("rdb_get_columns", { p_table: tbl });
-      if (!rpcErr && Array.isArray(rpcCols)) {
-        const colObjs = rpcCols.map(
-          (c) => typeof c === "string" ? { column_name: c, data_type: "unknown" } : { column_name: c.column_name || c.name || c, data_type: c.data_type || "unknown" }
-        );
-        setColumns((prev) => ({ ...prev, [tbl]: colObjs }));
-        autoDetectCols(colObjs);
-        return;
+      let cols = null;
+      const { data: ca, error: ea } = await supabase.from("information_schema.columns").select("column_name, data_type").eq("table_schema", "public").eq("table_name", tbl).order("ordinal_position");
+      if (!ea && (ca == null ? void 0 : ca.length)) cols = ca;
+      if (!cols) {
+        const { data: sb, error: eb } = await supabase.from(tbl).select("*").limit(1);
+        if (!eb && (sb == null ? void 0 : sb.length) > 0)
+          cols = Object.keys(sb[0]).map((k) => ({ column_name: k, data_type: typeof sb[0][k] }));
       }
-      const { data: schemaCols, error: schemaErr } = await supabase.from("information_schema.columns").select("column_name, data_type").eq("table_schema", "public").eq("table_name", tbl).order("ordinal_position");
-      if (!schemaErr && schemaCols) {
-        setColumns((prev) => ({ ...prev, [tbl]: schemaCols }));
-        autoDetectCols(schemaCols);
-        return;
+      if (cols) {
+        setColumns((p) => ({ ...p, [tbl]: cols }));
+        autoDetect(tbl, cols);
+      } else {
+        setColsBlocked(true);
       }
-      const { data: sampleRow, error: sampleErr } = await supabase.from(tbl).select("*").limit(1);
-      if (!sampleErr && sampleRow && sampleRow.length > 0) {
-        const colObjs = Object.keys(sampleRow[0]).map((k) => ({
-          column_name: k,
-          data_type: typeof sampleRow[0][k]
-        }));
-        setColumns((prev) => ({ ...prev, [tbl]: colObjs }));
-        autoDetectCols(colObjs);
-        return;
+      const { data: sample2 } = await supabase.from(tbl).select("*").limit(5);
+      if ((sample2 == null ? void 0 : sample2.length) > 0) {
+        setSampleData((p) => ({ ...p, [tbl]: sample2 }));
+        const statusCol = (_a2 = (cols || []).find(
+          (c) => ["status", "state", "kondisi", "order_status"].includes(c.column_name.toLowerCase())
+        )) == null ? void 0 : _a2.column_name;
+        if (statusCol) {
+          const uniqVals = [...new Set(sample2.map((r) => r[statusCol]).filter(Boolean))];
+          setStatusValues((p) => ({ ...p, [tbl]: { [statusCol]: uniqVals } }));
+          const vals = uniqVals.map((v) => String(v).toLowerCase());
+          const cfm = uniqVals.find((v) => ["confirmed", "selesai", "lunas", "paid", "done", "completed", "approve"].includes(String(v).toLowerCase()));
+          const pnd = uniqVals.find((v) => ["pending", "proses", "menunggu", "processing", "waiting", "draft"].includes(String(v).toLowerCase()));
+          if (cfm) setConfirmedVal(String(cfm));
+          if (pnd) setPendingVal(String(pnd));
+        }
       }
-      setColumns((prev) => ({ ...prev, [tbl]: [] }));
     } catch {
-      setColumns((prev) => ({ ...prev, [tbl]: [] }));
+      setColsBlocked(true);
     } finally {
-      setLoadingColumns(false);
+      setLoadingCols(false);
     }
   }, [supabase, columns]);
-  function autoDetectCols(colObjs) {
-    const find = (candidates) => {
-      var _a;
-      return ((_a = colObjs.find((c) => candidates.includes(c.column_name.toLowerCase()))) == null ? void 0 : _a.column_name) || "";
+  function autoDetect(tbl, cols) {
+    const f = (opts) => {
+      var _a2;
+      return ((_a2 = cols.find((c) => opts.includes(c.column_name.toLowerCase()))) == null ? void 0 : _a2.column_name) || "";
     };
-    setColDate(find(["created_at", "tanggal", "date", "transaction_date", "order_date", "waktu"]));
-    setColStatus(find(["status", "state", "kondisi", "order_status", "payment_status"]));
-    setColTotal(find(["total", "total_idr", "total_amount", "total_price", "harga_total", "amount", "nominal", "harga", "biaya"]));
-    setColCustomer(find(["customer_name", "nama_pelanggan", "nama", "name", "client_name", "buyer_name", "pelanggan"]));
-    setColItem(find(["service_type", "item_name", "product_name", "package_name", "layanan", "produk", "nama_layanan", "jenis", "nama_produk"]));
+    setColDate(f(["created_at", "tanggal", "date", "transaction_date", "order_date", "waktu"]));
+    setColStatus(f(["status", "state", "kondisi", "order_status", "payment_status"]));
+    setColTotal(f(["total", "total_idr", "total_amount", "total_price", "harga_total", "amount", "nominal", "harga", "grand_total"]));
+    setColCustomer(f(["customer_name", "nama_pelanggan", "nama", "name", "client_name", "buyer_name", "pelanggan"]));
+    setColItem(f(["service_type", "item_name", "product_name", "package_name", "layanan", "produk", "jenis", "paket"]));
   }
-  function copyCode(text, label) {
-    navigator.clipboard.writeText(text).then(() => {
-      setCopied(label);
-      setTimeout(() => setCopied(""), 2e3);
+  function copyCode(text, key) {
+    var _a2;
+    (_a2 = navigator.clipboard) == null ? void 0 : _a2.writeText(text).then(() => {
+      setCopied(key);
+      setTimeout(() => setCopied(""), 2200);
     });
   }
   function handleDismiss() {
     setDismissed(true);
-    if (onDismiss) onDismiss();
+    onDismiss == null ? void 0 : onDismiss();
   }
   function handleGenerate() {
     if (!selectedTable || !colDate || !colStatus || !colTotal) return;
-    const code = generateCode({
-      tableName: selectedTable,
+    setGeneratedCode(generateCode({
+      tableName: selectedTable.trim(),
       colDate,
       colStatus,
       colTotal,
       colCustomer: colCustomer || "customer_name",
       colItem: colItem || "-",
       dashTitle,
-      confirmedValue: confirmedVal,
-      pendingValue: pendingVal
-    });
-    setGeneratedCode(code);
+      confirmedValue: confirmedVal || "confirmed",
+      pendingValue: pendingVal || "pending"
+    }));
     setStep(3);
   }
   if (dismissed) return null;
-  const detectedPreset = detectPreset(tables);
-  const tableColumns = selectedTable ? columns[selectedTable] || [] : [];
-  const colNames = tableColumns.map((c) => c.column_name);
-  const mappingValid = selectedTable && colDate && colStatus && colTotal;
-  const stepLabels = ["Deteksi", "Pilih Tabel", "Mapping Kolom", "Kode Siap Pakai"];
-  return /* @__PURE__ */ import_react19.default.createElement(
-    "div",
+  const preset = detectPreset(tables);
+  const tblCols = selectedTable ? columns[selectedTable] || [] : [];
+  const colNames = tblCols.map((c) => c.column_name);
+  const sample = selectedTable ? sampleData[selectedTable] || [] : [];
+  const stVals = selectedTable && colStatus ? ((_a = statusValues[selectedTable]) == null ? void 0 : _a[colStatus]) || [] : [];
+  const canGen = selectedTable.trim() && colDate && colStatus && colTotal;
+  const TAB_INFO = {
+    dashboard: { label: "Dashboard.jsx", path: "src/pages/admin/Dashboard.jsx" },
+    dataSource: { label: "myDashboardSource.js", path: "src/datasources/myDashboardSource.js" },
+    adapter: { label: "myDashboardAdapter.js", path: "src/adapters/myDashboardAdapter.js" },
+    widgetConfig: { label: "myDashboardConfig.js", path: "src/config/myDashboardConfig.js" }
+  };
+  function PreviewTable({ rows, cols: previewCols }) {
+    if (!(rows == null ? void 0 : rows.length) || !(previewCols == null ? void 0 : previewCols.length)) return null;
+    const validCols = previewCols.filter((c) => {
+      var _a2;
+      return c && ((_a2 = rows[0]) == null ? void 0 : _a2[c]) !== void 0;
+    });
+    if (!validCols.length) return null;
+    return /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-table-wrapper", style: { marginTop: 8, fontSize: "0.75rem" } }, /* @__PURE__ */ import_react19.default.createElement("table", { className: "rdb-table", style: { fontSize: "0.75rem" } }, /* @__PURE__ */ import_react19.default.createElement("thead", null, /* @__PURE__ */ import_react19.default.createElement("tr", null, validCols.map((c) => /* @__PURE__ */ import_react19.default.createElement("th", { key: c, style: { padding: "4px 8px", fontSize: "0.7rem" } }, c)))), /* @__PURE__ */ import_react19.default.createElement("tbody", null, rows.slice(0, 3).map((row, i) => /* @__PURE__ */ import_react19.default.createElement("tr", { key: i }, validCols.map((c) => /* @__PURE__ */ import_react19.default.createElement("td", { key: c, style: { padding: "3px 8px" } }, String(row[c] ?? "-").slice(0, 30))))))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 4, color: "var(--rdb-text-muted)" } }, "Preview 3 baris data nyata dari database kamu"));
+  }
+  return /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-overlay", role: "dialog", "aria-modal": "true" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-modal" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-header" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-header-title" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-logo" }, "\u{1F6E0}\uFE0F"), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-h2", style: { margin: 0 } }, "Setup Dashboard Wizard"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption" }, detecting ? "Menghubungi Supabase\u2026" : supabaseOk ? tables.length > 0 ? `\u2705 Tersambung \xB7 ${tables.length} tabel ditemukan` : "\u2705 Tersambung \xB7 ketik nama tabel di Step 2" : "Ikuti langkah di bawah untuk menghubungkan Supabase"))), /* @__PURE__ */ import_react19.default.createElement("button", { type: "button", className: "rdb-wizard-close", onClick: handleDismiss }, "\u2715")), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-steps" }, ["1. Koneksi", "2. Pilih Tabel", "3. Konfirmasi", "4. Kode Jadi"].map((lbl, i) => /* @__PURE__ */ import_react19.default.createElement(
+    "button",
     {
-      className: "rdb-wizard-overlay",
-      role: "dialog",
-      "aria-modal": "true",
-      "aria-label": "Setup Wizard @rozaqi02/reusable-dashboard"
+      key: i,
+      type: "button",
+      className: `rdb-wizard-step-btn ${step === i ? "rdb-wizard-step-active" : ""}`,
+      onClick: () => setStep(i)
     },
-    /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-modal" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-header" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-header-title" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-logo" }, "\u{1F6E0}\uFE0F"), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-h2", style: { margin: 0 } }, "Setup Dashboard"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption" }, detecting ? "Mendeteksi kondisi project\u2026" : supabaseOk ? `Supabase tersambung \xB7 ${tables.length} tabel ditemukan` : "Panduan konfigurasi @rozaqi02/reusable-dashboard"))), /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-wizard-close",
-        onClick: handleDismiss,
-        title: "Tutup"
-      },
-      "\u2715"
-    )), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-steps" }, stepLabels.map((label, i) => /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        key: i,
-        type: "button",
-        className: `rdb-wizard-step-btn ${step === i ? "rdb-wizard-step-active" : ""}`,
-        onClick: () => {
-          if (i < step || i === step + 1 && step < 2) setStep(i);
-        }
-      },
-      /* @__PURE__ */ import_react19.default.createElement("span", null, step > i ? "\u2705" : i + 1, "."),
-      /* @__PURE__ */ import_react19.default.createElement("span", null, label)
-    ))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-body" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-section" }, step === 0 && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, issues.length > 0 && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issues", style: { marginBottom: 12 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 6 } }, "Konfigurasi belum lengkap:"), issues.map((iss, i) => /* @__PURE__ */ import_react19.default.createElement("div", { key: i, className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", null, "\u274C"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, iss)))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-flow", style: { marginBottom: 12 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 10 } }, "\u{1F50D} Hasil deteksi otomatis:"), detecting ? /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { color: "var(--rdb-text-muted)" } }, "Mendeteksi\u2026") : /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 8 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", null, supabaseOk ? "\u2705" : "\u274C"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, "Supabase ", supabaseOk ? "tersambung" : "tidak tersambung \u2014 pastikan supabaseClient.js sudah dikonfigurasi dan prop supabase dikirim ke ReusableDashboardView")), supabaseOk && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", null, tables.length > 0 ? "\u2705" : "\u26A0\uFE0F"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, tables.length > 0 ? `${tables.length} tabel public ditemukan` : "Daftar tabel tidak bisa dibaca otomatis (RLS aktif) \u2014 kamu bisa ketik nama tabel di step berikutnya")), supabaseOk && tables.length > 0 && detectedPreset && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", null, "\u2705"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, "Tabel cocok dengan preset ", /* @__PURE__ */ import_react19.default.createElement("strong", null, PRESET_SIGNATURES[detectedPreset].name))))), !supabaseOk && detectionDone && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-alert", style: { marginBottom: 12 } }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-alert-icon" }, "\u2139\uFE0F"), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { fontWeight: 600 } }, "Aktifkan koneksi Supabase"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 4 } }, "Tambahkan prop ke ReusableDashboardView:", " ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, "supabase=", "{supabase}")))), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end" } }, /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
-        onClick: handleDismiss
-      },
-      "Lanjutkan tanpa wizard"
-    ), supabaseOk && /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-btn rdb-btn-primary rdb-btn-sm",
-        onClick: () => setStep(1)
-      },
-      "Lanjut \u2192 Pilih Tabel"
-    ))), step === 1 && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-step-title" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-step-num" }, "2"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-h3", style: { margin: 0 } }, "Pilih Tabel Transaksi")), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { color: "var(--rdb-text-muted)", marginBottom: 16 } }, "Pilih tabel yang berisi data transaksi bisnis kamu."), tables.length > 0 && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 8 } }, "Tabel yang ditemukan:"), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 6, marginBottom: 16 } }, tables.map((tbl) => /* @__PURE__ */ import_react19.default.createElement(
+    step > i ? "\u2705 " : "",
+    lbl
+  ))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-body" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-section" }, step === 0 && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, issues.length > 0 && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issues", style: { marginBottom: 12 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 6 } }, "Konfigurasi yang belum lengkap:"), issues.map((iss, i) => /* @__PURE__ */ import_react19.default.createElement("div", { key: i, className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", null, "\u274C"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, iss)))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-flow", style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 10 } }, "\u{1F50D} Status koneksi Supabase:"), detecting ? /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { color: "var(--rdb-text-muted)" } }, "Mendeteksi\u2026") : /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 8 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", null, supabaseOk ? "\u2705" : "\u274C"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, supabaseOk ? "Supabase tersambung" : "Tidak tersambung \u2014 tambahkan prop supabase={supabase} ke <ReusableDashboardView>")), supabaseOk && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", null, tables.length > 0 ? "\u2705" : "\u26A0\uFE0F"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, tables.length > 0 ? `Wizard membaca ${tables.length} tabel langsung dari database` : "Daftar tabel belum bisa terbaca (butuh izin \u2014 lihat SQL di bawah)")))), supabaseOk && tableBlocked && /* @__PURE__ */ import_react19.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-alert", style: { marginBottom: 8 } }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-alert-icon" }, "\u{1F511}"), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { fontWeight: 600 } }, "Agar wizard bisa baca daftar tabel otomatis"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 4 } }, "Jalankan SQL ini ", /* @__PURE__ */ import_react19.default.createElement("strong", null, "sekali"), " di Supabase SQL Editor, lalu refresh halaman. Atau lewati dan ketik nama tabel manual di Step 2."))), /* @__PURE__ */ import_react19.default.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      style: { position: "absolute", top: 6, right: 6 },
+      onClick: () => copyCode(SQL_GRANT_SCHEMA, "grant")
+    },
+    copied === "grant" ? "\u2705" : "\u{1F4CB}",
+    " Salin"
+  ), /* @__PURE__ */ import_react19.default.createElement("pre", { className: "rdb-wizard-code", style: { fontSize: "0.72rem" } }, SQL_GRANT_SCHEMA))), supabaseOk && /* @__PURE__ */ import_react19.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      onClick: () => setShowRls((r) => !r)
+    },
+    showRls ? "\u25B2 Sembunyikan" : "\u25BC Lihat",
+    " panduan RLS \u2014 agar data tabel bisa terbaca dashboard"
+  ), showRls && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-flow", style: { marginTop: 10 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { fontWeight: 600, marginBottom: 6 } }, "Apa itu RLS?"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { color: "var(--rdb-text-muted)", marginBottom: 10 } }, "Row Level Security (RLS) adalah fitur Supabase yang mengontrol siapa yang boleh membaca data. Jika aktif tanpa aturan, dashboard tidak bisa mengambil data apapun."), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 6 } }, "SQL \u2014 ganti ", /* @__PURE__ */ import_react19.default.createElement("code", null, "nama_tabel"), " dengan nama tabelmu:"), /* @__PURE__ */ import_react19.default.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      style: { position: "absolute", top: 6, right: 6 },
+      onClick: () => copyCode(sqlRls("nama_tabel"), "rls")
+    },
+    copied === "rls" ? "\u2705" : "\u{1F4CB}",
+    " Salin"
+  ), /* @__PURE__ */ import_react19.default.createElement("pre", { className: "rdb-wizard-code", style: { fontSize: "0.7rem" } }, sqlRls("nama_tabel"))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 8, color: "var(--rdb-text-muted)" } }, "\u{1F4A1} ", /* @__PURE__ */ import_react19.default.createElement("strong", null, "Development:"), " pakai Opsi 1.", /* @__PURE__ */ import_react19.default.createElement("strong", null, " Production:"), " pakai Opsi 2 atau 3."))), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end" } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      onClick: handleDismiss
+    },
+    "Lanjutkan tanpa wizard"
+  ), supabaseOk && /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-primary rdb-btn-sm",
+      onClick: () => setStep(1)
+    },
+    "Lanjut \u2192 Pilih Tabel"
+  ))), step === 1 && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-step-title" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-step-num" }, "2"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-h3", style: { margin: 0 } }, "Pilih Tabel Transaksi")), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { color: "var(--rdb-text-muted)", marginBottom: 16 } }, "Klik tabel yang berisi data transaksi bisnis kamu. Wizard akan", /* @__PURE__ */ import_react19.default.createElement("strong", null, " otomatis membaca kolom dan sample data"), " dari tabel tersebut."), tables.length > 0 && /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", flexWrap: "wrap", gap: 6, marginBottom: 16 } }, tables.map((tbl) => {
+    var _a2, _b2;
+    const isSelected = selectedTable === tbl;
+    const hasSample = ((_a2 = sampleData[tbl]) == null ? void 0 : _a2.length) > 0;
+    const hasColumns = ((_b2 = columns[tbl]) == null ? void 0 : _b2.length) > 0;
+    return /* @__PURE__ */ import_react19.default.createElement(
       "button",
       {
         key: tbl,
         type: "button",
         onClick: () => {
           setSelectedTable(tbl);
-          loadColumns(tbl);
+          analyzeTable(tbl);
         },
-        className: `rdb-btn rdb-btn-sm ${selectedTable === tbl ? "rdb-btn-primary" : "rdb-btn-secondary"}`,
-        style: { justifyContent: "flex-start", fontFamily: "monospace" }
-      },
-      selectedTable === tbl ? "\u2705 " : "\u25CB ",
-      tbl
-    )))), tables.length === 0 && /* @__PURE__ */ import_react19.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-alert", style: { marginBottom: 12 } }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-alert-icon" }, "\u2139\uFE0F"), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { fontWeight: 600 } }, "Daftar tabel tidak bisa terbaca otomatis"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 4 } }, "Ini normal \u2014 Supabase memblokir akses ke ", /* @__PURE__ */ import_react19.default.createElement("code", null, "information_schema"), " via API publik. Ketik nama tabel secara manual di bawah."))), /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, "Nama tabel transaksi kamu"), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8 } }, /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        value: selectedTable,
-        onChange: (e) => setSelectedTable(e.target.value),
-        placeholder: "cth: orders, transaksi, bookings, penjualan",
-        style: { maxWidth: 320 }
-      }
-    ), /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
-        disabled: !selectedTable || loadingColumns,
-        onClick: () => loadColumns(selectedTable)
-      },
-      loadingColumns ? "Membaca\u2026" : "Baca kolom"
-    ))), tables.length > 0 && !selectedTable && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { color: "var(--rdb-text-muted)", marginBottom: 12 } }, "Atau ketik nama tabel secara manual:", /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        style: { marginTop: 6, maxWidth: 280 },
-        placeholder: "nama tabel lain",
-        onChange: (e) => {
-          setSelectedTable(e.target.value);
-          if (e.target.value) loadColumns(e.target.value);
-        }
-      }
-    )), selectedTable && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-tip", style: { marginBottom: 12 } }, "Tabel ", /* @__PURE__ */ import_react19.default.createElement("strong", null, selectedTable), " dipilih.", loadingColumns ? " Membaca kolom\u2026" : tableColumns.length > 0 ? ` ${tableColumns.length} kolom ditemukan \u2014 kolom sudah ter-auto-detect di step berikutnya.` : tableColumns.length === 0 && !loadingColumns && columns[selectedTable] !== void 0 ? " Tabel kosong atau tidak ada kolom terbaca \u2014 kamu bisa ketik nama kolom manual di step berikutnya." : ""), /* @__PURE__ */ import_react19.default.createElement("div", { style: { marginBottom: 12 } }, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, "Judul dashboard (opsional)"), /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        value: dashTitle,
-        style: { maxWidth: 280 },
-        onChange: (e) => setDashTitle(e.target.value),
-        placeholder: "cth: Dashboard Laundry Bersih"
-      }
-    )), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end" } }, /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
-        onClick: () => setStep(0)
-      },
-      "\u2190 Kembali"
-    ), /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-btn rdb-btn-primary rdb-btn-sm",
-        disabled: !selectedTable || loadingColumns,
-        onClick: () => setStep(2)
-      },
-      "Lanjut \u2192 Mapping Kolom"
-    ))), step === 2 && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-step-title" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-step-num" }, "3"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-h3", style: { margin: 0 } }, "Mapping Kolom \u2014 Tabel: ", /* @__PURE__ */ import_react19.default.createElement("code", { style: { fontSize: "0.9rem" } }, selectedTable))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { color: "var(--rdb-text-muted)", marginBottom: 16 } }, "Pilih kolom yang berperan sebagai masing-masing data. Kolom sudah ter-deteksi otomatis \u2014 cukup verifikasi dan sesuaikan jika perlu."), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 12, marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, "Kolom Tanggal ", /* @__PURE__ */ import_react19.default.createElement("span", { style: { color: "red" } }, "*")), colNames.length > 0 ? /* @__PURE__ */ import_react19.default.createElement(
-      "select",
-      {
-        className: "rdb-select",
-        value: colDate,
-        onChange: (e) => setColDate(e.target.value)
-      },
-      /* @__PURE__ */ import_react19.default.createElement("option", { value: "" }, "\u2014 pilih kolom \u2014"),
-      colNames.map((c) => /* @__PURE__ */ import_react19.default.createElement("option", { key: c, value: c }, c))
-    ) : /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        value: colDate,
-        onChange: (e) => setColDate(e.target.value),
-        placeholder: "cth: created_at"
-      }
-    ), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 2 } }, "Tipe timestamp/date")), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, "Kolom Status ", /* @__PURE__ */ import_react19.default.createElement("span", { style: { color: "red" } }, "*")), colNames.length > 0 ? /* @__PURE__ */ import_react19.default.createElement(
-      "select",
-      {
-        className: "rdb-select",
-        value: colStatus,
-        onChange: (e) => setColStatus(e.target.value)
-      },
-      /* @__PURE__ */ import_react19.default.createElement("option", { value: "" }, "\u2014 pilih kolom \u2014"),
-      colNames.map((c) => /* @__PURE__ */ import_react19.default.createElement("option", { key: c, value: c }, c))
-    ) : /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        value: colStatus,
-        onChange: (e) => setColStatus(e.target.value),
-        placeholder: "cth: status"
-      }
-    ), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 2 } }, "Nilai selesai/pending")), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, "Kolom Total (uang) ", /* @__PURE__ */ import_react19.default.createElement("span", { style: { color: "red" } }, "*")), colNames.length > 0 ? /* @__PURE__ */ import_react19.default.createElement(
-      "select",
-      {
-        className: "rdb-select",
-        value: colTotal,
-        onChange: (e) => setColTotal(e.target.value)
-      },
-      /* @__PURE__ */ import_react19.default.createElement("option", { value: "" }, "\u2014 pilih kolom \u2014"),
-      colNames.map((c) => /* @__PURE__ */ import_react19.default.createElement("option", { key: c, value: c }, c))
-    ) : /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        value: colTotal,
-        onChange: (e) => setColTotal(e.target.value),
-        placeholder: "cth: total_amount"
-      }
-    ), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 2 } }, "Integer Rupiah")), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, "Kolom Nama Pelanggan"), colNames.length > 0 ? /* @__PURE__ */ import_react19.default.createElement(
-      "select",
-      {
-        className: "rdb-select",
-        value: colCustomer,
-        onChange: (e) => setColCustomer(e.target.value)
-      },
-      /* @__PURE__ */ import_react19.default.createElement("option", { value: "" }, "\u2014 opsional \u2014"),
-      colNames.map((c) => /* @__PURE__ */ import_react19.default.createElement("option", { key: c, value: c }, c))
-    ) : /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        value: colCustomer,
-        onChange: (e) => setColCustomer(e.target.value),
-        placeholder: "cth: customer_name (opsional)"
-      }
-    )), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, "Kolom Nama Item/Layanan"), colNames.length > 0 ? /* @__PURE__ */ import_react19.default.createElement(
-      "select",
-      {
-        className: "rdb-select",
-        value: colItem,
-        onChange: (e) => setColItem(e.target.value)
-      },
-      /* @__PURE__ */ import_react19.default.createElement("option", { value: "" }, "\u2014 opsional \u2014"),
-      colNames.map((c) => /* @__PURE__ */ import_react19.default.createElement("option", { key: c, value: c }, c))
-    ) : /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        value: colItem,
-        onChange: (e) => setColItem(e.target.value),
-        placeholder: "cth: service_type (opsional)"
-      }
-    ))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-flow", style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 8 } }, "Nilai status di tabel kamu:"), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 12 } }, /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, 'Nilai "Selesai/Confirmed"'), /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        value: confirmedVal,
-        onChange: (e) => setConfirmedVal(e.target.value),
-        placeholder: "cth: confirmed, selesai, lunas"
-      }
-    )), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, 'Nilai "Pending/Proses"'), /* @__PURE__ */ import_react19.default.createElement(
-      "input",
-      {
-        className: "rdb-input",
-        value: pendingVal,
-        onChange: (e) => setPendingVal(e.target.value),
-        placeholder: "cth: pending, proses, menunggu"
-      }
-    )))), !mappingValid && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-error-banner", style: { marginBottom: 12 } }, "Pilih minimal kolom Tanggal, Status, dan Total untuk generate kode."), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end" } }, /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
-        onClick: () => setStep(1)
-      },
-      "\u2190 Kembali"
-    ), /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-btn rdb-btn-primary rdb-btn-sm",
-        disabled: !mappingValid,
-        onClick: handleGenerate
-      },
-      "\u2728 Generate Kode \u2192"
-    ))), step === 3 && generatedCode && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-step-title" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-step-num" }, "\u2705"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-h3", style: { margin: 0 } }, "Kode Siap Pakai")), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-tip", style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("strong", null, "4 file sudah digenerate."), " Salin masing-masing ke project kamu. Tidak perlu memahami logika di dalamnya \u2014 cukup save dan jalankan."), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issues", style: { marginBottom: 16 } }, [
-      ["myDashboardSource.js", "src/datasources/", "File koneksi ke Supabase"],
-      ["myDashboardAdapter.js", "src/adapters/", "Transformasi data \u2192 format dashboard"],
-      ["myDashboardConfig.js", "src/config/ (atau langsung di Dashboard.jsx)", "Konfigurasi widget"],
-      ["Dashboard.jsx", "src/pages/admin/", "Ganti halaman dashboard lama"]
-    ].map(([file, path, desc], i) => /* @__PURE__ */ import_react19.default.createElement("div", { key: i, className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", { style: { color: "var(--rdb-blue-500)", fontWeight: 700 } }, i + 1, "."), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, "Simpan ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, file), " ke", " ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, path), " \u2014 ", desc))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", { style: { color: "var(--rdb-blue-500)", fontWeight: 700 } }, "5."), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, "Import CSS di ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, "src/index.css"), ":", " ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, '@import "../node_modules/@rozaqi02/reusable-dashboard/dist/index.css";')))), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 4, marginBottom: 8, flexWrap: "wrap" } }, [
-      ["dataSource", "myDashboardSource.js"],
-      ["adapter", "myDashboardAdapter.js"],
-      ["widgetConfig", "myDashboardConfig.js"],
-      ["dashboard", "Dashboard.jsx"]
-    ].map(([key, label]) => /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        key,
-        type: "button",
-        onClick: () => setActiveCodeTab(key),
-        className: `rdb-btn rdb-btn-sm ${activeCodeTab === key ? "rdb-btn-primary" : "rdb-btn-secondary"}`,
-        style: { fontFamily: "monospace", fontSize: "0.75rem" }
+        className: `rdb-btn rdb-btn-sm ${isSelected ? "rdb-btn-primary" : "rdb-btn-secondary"}`,
+        style: { fontFamily: "monospace", fontSize: "0.82rem" }
       },
-      label
-    ))), /* @__PURE__ */ import_react19.default.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        onClick: () => copyCode(generatedCode[activeCodeTab], activeCodeTab),
-        className: "rdb-btn rdb-btn-sm rdb-btn-secondary",
-        style: { position: "absolute", top: 8, right: 8, zIndex: 1 }
-      },
-      copied === activeCodeTab ? "\u2705 Disalin!" : "\u{1F4CB} Salin"
-    ), /* @__PURE__ */ import_react19.default.createElement("pre", { className: "rdb-wizard-code", style: { maxHeight: 320, overflow: "auto" } }, generatedCode[activeCodeTab])), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-tip", style: { marginTop: 12 } }, "Setelah semua file tersimpan dan dev server direstart, wizard tidak akan muncul lagi."), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end", marginTop: 12 } }, /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
-        onClick: () => setStep(2)
-      },
-      "\u2190 Edit mapping"
-    ), /* @__PURE__ */ import_react19.default.createElement(
-      "button",
-      {
-        type: "button",
-        className: "rdb-btn rdb-btn-primary rdb-btn-sm",
-        onClick: handleDismiss
-      },
-      "Tutup wizard \u2713"
-    ))))))
-  );
+      isSelected ? "\u2705 " : "",
+      tbl,
+      isSelected && hasColumns ? ` (${columns[tbl].length} kolom)` : ""
+    );
+  })), /* @__PURE__ */ import_react19.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, tables.length > 0 ? "Atau ketik nama tabel lain:" : "Ketik nama tabel kamu:"), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8 } }, /* @__PURE__ */ import_react19.default.createElement(
+    "input",
+    {
+      className: "rdb-input",
+      value: selectedTable,
+      onChange: (e) => setSelectedTable(e.target.value.replace(/[,\s].*/, "")),
+      placeholder: "cth: orders / transaksi / bookings",
+      style: { maxWidth: 280 }
+    }
+  ), /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      disabled: !selectedTable || loadingCols,
+      onClick: () => analyzeTable(selectedTable)
+    },
+    loadingCols ? "Menganalisis\u2026" : "Analisis tabel"
+  ))), selectedTable && !loadingCols && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, colNames.length > 0 && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-tip", style: { marginBottom: 8 } }, "\u2705 ", /* @__PURE__ */ import_react19.default.createElement("strong", null, colNames.length, " kolom"), " ditemukan.", sample.length > 0 && ` ${sample.length} baris sample data terbaca.`, " ", "Kolom sudah otomatis diisi di step berikutnya."), sample.length > 0 && /* @__PURE__ */ import_react19.default.createElement(
+    PreviewTable,
+    {
+      rows: sample,
+      cols: [colDate, colStatus, colTotal, colCustomer].filter(Boolean)
+    }
+  )), colsBlocked && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-alert" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-alert-icon" }, "\u2139\uFE0F"), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { fontWeight: 600 } }, "Kolom tidak bisa terbaca otomatis"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 4 } }, "Kemungkinan RLS aktif. Kamu tetap bisa lanjut dan ketik nama kolom manual di step berikutnya.")))), /* @__PURE__ */ import_react19.default.createElement("div", { style: { marginBottom: 12, marginTop: 12 } }, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, "Judul dashboard:"), /* @__PURE__ */ import_react19.default.createElement(
+    "input",
+    {
+      className: "rdb-input",
+      value: dashTitle,
+      style: { maxWidth: 280 },
+      onChange: (e) => setDashTitle(e.target.value),
+      placeholder: "cth: Dashboard Laundry / Dashboard Klinik"
+    }
+  )), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end" } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      onClick: () => setStep(0)
+    },
+    "\u2190 Kembali"
+  ), /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-primary rdb-btn-sm",
+      disabled: !selectedTable || loadingCols,
+      onClick: () => setStep(2)
+    },
+    "Lanjut \u2192 Konfirmasi Kolom"
+  ))), step === 2 && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-step-title" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-step-num" }, "3"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-h3", style: { margin: 0 } }, "Konfirmasi \u2014 Tabel: ", /* @__PURE__ */ import_react19.default.createElement("code", { style: { fontSize: "0.9em" } }, selectedTable))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { color: "var(--rdb-text-muted)", marginBottom: 16 } }, "Wizard sudah mengisi kolom secara otomatis. Periksa sebentar dan sesuaikan jika ada yang salah."), colNames.length > 0 && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-supabase-reader", style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 6 } }, "Semua kolom di tabel ", selectedTable, ":"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-table-chips" }, colNames.map((c) => /* @__PURE__ */ import_react19.default.createElement("span", { key: c, className: "rdb-wizard-chip", style: { cursor: "default" } }, c)))), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 12, marginBottom: 16 } }, [
+    { label: "Kolom Tanggal *", hint: "Tipe timestamp/date", val: colDate, set: setColDate, ph: "created_at" },
+    { label: "Kolom Status *", hint: "Berisi nilai selesai/pending", val: colStatus, set: setColStatus, ph: "status" },
+    { label: "Kolom Total (uang) *", hint: "Integer Rupiah", val: colTotal, set: setColTotal, ph: "total_amount" },
+    { label: "Kolom Nama Pelanggan", hint: "Opsional", val: colCustomer, set: setColCustomer, ph: "customer_name (opsional)" },
+    { label: "Kolom Nama Item / Layanan", hint: "Opsional", val: colItem, set: setColItem, ph: "product_name (opsional)" }
+  ].map(({ label, hint, val, set, ph }) => /* @__PURE__ */ import_react19.default.createElement("div", { key: label }, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, label), colNames.length > 0 ? /* @__PURE__ */ import_react19.default.createElement("select", { className: "rdb-select", value: val, onChange: (e) => set(e.target.value) }, /* @__PURE__ */ import_react19.default.createElement("option", { value: "" }, "\u2014 pilih \u2014"), colNames.map((c) => /* @__PURE__ */ import_react19.default.createElement("option", { key: c, value: c }, c))) : /* @__PURE__ */ import_react19.default.createElement("input", { className: "rdb-input", value: val, onChange: (e) => set(e.target.value), placeholder: ph }), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 2 } }, hint)))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-flow", style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 4 } }, "Nilai status yang ditemukan di data kamu:"), stVals.length > 0 ? /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { color: "var(--rdb-text-muted)", marginBottom: 8 } }, "Wizard membaca nilai unik dari kolom ", /* @__PURE__ */ import_react19.default.createElement("strong", null, colStatus), ". Klik nilai yang sesuai:"), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8, flexWrap: "wrap", marginBottom: 12 } }, stVals.map((v) => /* @__PURE__ */ import_react19.default.createElement("div", { key: v, style: { display: "flex", gap: 4, alignItems: "center" } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: `rdb-btn rdb-btn-sm ${confirmedVal === String(v) ? "rdb-btn-primary" : "rdb-btn-secondary"}`,
+      onClick: () => setConfirmedVal(String(v))
+    },
+    confirmedVal === String(v) ? "\u2705 " : "",
+    "Selesai = ",
+    /* @__PURE__ */ import_react19.default.createElement("strong", null, String(v))
+  ), /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: `rdb-btn rdb-btn-sm ${pendingVal === String(v) ? "rdb-btn-primary" : "rdb-btn-secondary"}`,
+      onClick: () => setPendingVal(String(v))
+    },
+    pendingVal === String(v) ? "\u2705 " : "",
+    "Proses = ",
+    /* @__PURE__ */ import_react19.default.createElement("strong", null, String(v))
+  ))))) : /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { color: "var(--rdb-text-muted)", marginBottom: 8 } }, "Nilai status tidak terbaca otomatis. Ketik manual:"), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 12 } }, /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, 'Nilai "Selesai/Confirmed"'), /* @__PURE__ */ import_react19.default.createElement(
+    "input",
+    {
+      className: "rdb-input",
+      value: confirmedVal,
+      onChange: (e) => setConfirmedVal(e.target.value),
+      placeholder: "confirmed"
+    }
+  )), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("label", { className: "rdb-label" }, 'Nilai "Pending/Proses"'), /* @__PURE__ */ import_react19.default.createElement(
+    "input",
+    {
+      className: "rdb-input",
+      value: pendingVal,
+      onChange: (e) => setPendingVal(e.target.value),
+      placeholder: "pending"
+    }
+  )))), sample.length > 0 && colDate && colStatus && colTotal && /* @__PURE__ */ import_react19.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { fontWeight: 600, marginBottom: 4 } }, "Preview data nyata sesuai mapping kamu:"), /* @__PURE__ */ import_react19.default.createElement(
+    PreviewTable,
+    {
+      rows: sample,
+      cols: [colDate, colStatus, colTotal, colCustomer, colItem].filter((c) => c && c !== "-")
+    }
+  )), !canGen && /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-error-banner", style: { marginBottom: 12 } }, "Isi Kolom Tanggal, Status, dan Total untuk melanjutkan."), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end" } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      onClick: () => setStep(1)
+    },
+    "\u2190 Kembali"
+  ), /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-primary rdb-btn-sm",
+      disabled: !canGen,
+      onClick: handleGenerate
+    },
+    "\u2728 Generate Kode \u2192"
+  ))), step === 3 && generatedCode && /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-step-title" }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-step-num" }, "\u2705"), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-h3", style: { margin: 0 } }, "Kode Sudah Jadi!")), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-tip", style: { marginBottom: 12 } }, /* @__PURE__ */ import_react19.default.createElement("strong", null, "4 file digenerate."), " Klik tab file \u2192 Salin \u2192 Simpan ke lokasi yang tertera di bawah tab. Tidak perlu mengubah isi kode \u2014 langsung save dan jalankan."), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issues", style: { marginBottom: 12 } }, Object.entries(TAB_INFO).map(([key, info], i) => /* @__PURE__ */ import_react19.default.createElement("div", { key, className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", { style: { color: "var(--rdb-blue-500)", fontWeight: 700, minWidth: 18 } }, i + 1, "."), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, "Salin ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, info.label), " \u2192 simpan ke ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, info.path)))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", { style: { color: "var(--rdb-blue-500)", fontWeight: 700, minWidth: 18 } }, "5."), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, "Di ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, "src/index.css"), ", tambahkan:", " ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, '@import "../node_modules/@rozaqi02/reusable-dashboard/dist/index.css";'))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-issue-item" }, /* @__PURE__ */ import_react19.default.createElement("span", { style: { color: "var(--rdb-blue-500)", fontWeight: 700, minWidth: 18 } }, "6."), /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-body" }, "Restart dev server (", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, "npm start"), ") \u2192 buka halaman dashboard \u2192 selesai!"))), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 4, flexWrap: "wrap", marginBottom: 4 } }, Object.entries(TAB_INFO).map(([key, info]) => /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      key,
+      type: "button",
+      onClick: () => setActiveTab(key),
+      className: `rdb-btn rdb-btn-sm ${activeTab === key ? "rdb-btn-primary" : "rdb-btn-secondary"}`,
+      style: { fontFamily: "monospace", fontSize: "0.73rem" }
+    },
+    info.label
+  ))), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { color: "var(--rdb-text-muted)", marginBottom: 6 } }, "\u{1F4C1} Simpan ke: ", /* @__PURE__ */ import_react19.default.createElement("code", { className: "rdb-wizard-code-inline" }, (_b = TAB_INFO[activeTab]) == null ? void 0 : _b.path)), /* @__PURE__ */ import_react19.default.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      style: { position: "absolute", top: 8, right: 8, zIndex: 1 },
+      onClick: () => copyCode(generatedCode[activeTab], activeTab)
+    },
+    copied === activeTab ? "\u2705 Tersalin!" : "\u{1F4CB} Salin kode"
+  ), /* @__PURE__ */ import_react19.default.createElement("pre", { className: "rdb-wizard-code", style: { maxHeight: 280, overflow: "auto" } }, generatedCode[activeTab])), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-wizard-alert", style: { marginTop: 10, marginBottom: 4 } }, /* @__PURE__ */ import_react19.default.createElement("span", { className: "rdb-wizard-alert-icon" }, "\u26A0\uFE0F"), /* @__PURE__ */ import_react19.default.createElement("div", null, /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-body", style: { fontWeight: 600 } }, "Data tidak muncul di dashboard?"), /* @__PURE__ */ import_react19.default.createElement("div", { className: "rdb-caption", style: { marginTop: 4 } }, "Jalankan SQL ini di Supabase SQL Editor:"), /* @__PURE__ */ import_react19.default.createElement("div", { style: { position: "relative", marginTop: 6 } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      style: { position: "absolute", top: 4, right: 4 },
+      onClick: () => copyCode(`ALTER TABLE public.${selectedTable} DISABLE ROW LEVEL SECURITY;`, "rlsquick")
+    },
+    copied === "rlsquick" ? "\u2705" : "\u{1F4CB}"
+  ), /* @__PURE__ */ import_react19.default.createElement("pre", { className: "rdb-wizard-code", style: { fontSize: "0.72rem" } }, `ALTER TABLE public.${selectedTable} DISABLE ROW LEVEL SECURITY;`)))), /* @__PURE__ */ import_react19.default.createElement("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end", marginTop: 10 } }, /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-secondary rdb-btn-sm",
+      onClick: () => setStep(2)
+    },
+    "\u2190 Edit mapping"
+  ), /* @__PURE__ */ import_react19.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "rdb-btn rdb-btn-primary rdb-btn-sm",
+      onClick: handleDismiss
+    },
+    "Tutup wizard \u2713"
+  )))))));
 }
 SetupWizard.propTypes = {
   issues: import_prop_types17.default.arrayOf(import_prop_types17.default.string),
@@ -2736,6 +3013,152 @@ ReusableDashboardView.propTypes = {
   dashboardConfig: import_prop_types18.default.object
 };
 
+// src/presentation/AutoDashboard.jsx
+var import_react21 = __toESM(require("react"), 1);
+var import_prop_types19 = __toESM(require("prop-types"), 1);
+var DEFAULT_LABELS = {
+  title: "Dashboard",
+  refresh: "Muat ulang",
+  liveUpdate: "Live",
+  loadFailed: "Gagal memuat data dashboard.",
+  retry: "Coba lagi",
+  confirmedOnly: "Hanya berhasil",
+  pendingOnly: "Hanya menunggu",
+  allStatus: "Semua status",
+  showPendingOverlay: "Tampilkan overlay menunggu",
+  allAudience: "Semua segmen",
+  audienceDomestic: "Domestik",
+  audienceForeign: "Asing",
+  customDate: "Custom",
+  reset: "Reset",
+  topSort: "Urutkan item",
+  sortBookings: "Jumlah",
+  sortRevenue: "Nilai",
+  sortDesc: "Turun",
+  sortAsc: "Naik",
+  confirmedBookings: "Transaksi Berhasil",
+  confirmedRevenue: "Pendapatan (Berhasil)",
+  avgRevenue: "Rata-rata Nilai / Transaksi",
+  conversionRate: "Tingkat Konversi",
+  dailyTrends: "Tren Harian",
+  statusDistribution: "Distribusi Status",
+  audienceDistribution: "Distribusi Segmen",
+  topPackages: "Item Teratas",
+  recentBookings: "Transaksi Terbaru",
+  date: "Tanggal",
+  customer: "Pelanggan",
+  package: "Item",
+  audience: "Segmen",
+  total: "Total",
+  status: "Status",
+  noRecentBookings: "Belum ada transaksi terbaru",
+  unknownAudience: "Tidak diketahui"
+};
+function buildLabels(overrides = {}) {
+  const labels = { ...DEFAULT_LABELS, ...overrides };
+  labels.dayLabel = overrides.dayLabel || ((count) => count ? `${count} hari` : "Custom");
+  labels.formatStatusLabel = overrides.formatStatusLabel || ((status) => {
+    const s = String(status || "pending");
+    return s.charAt(0).toUpperCase() + s.slice(1);
+  });
+  labels.formatAudienceLabel = overrides.formatAudienceLabel || ((value) => {
+    if (value === "domestic") return labels.audienceDomestic;
+    if (value === "foreign") return labels.audienceForeign;
+    if (!value || value === "unknown") return labels.unknownAudience;
+    return String(value);
+  });
+  return labels;
+}
+function AutoDashboard({
+  supabase,
+  table,
+  columns,
+  confirmedValue = "confirmed",
+  pendingValue = "pending",
+  title = "Dashboard",
+  labels: labelOverrides,
+  languageCode = "id",
+  dateLocale = "id-ID"
+}) {
+  const isConfigured = Boolean(supabase && table && (columns == null ? void 0 : columns.date));
+  const labels = import_react21.default.useMemo(
+    () => buildLabels({ ...labelOverrides, title }),
+    [labelOverrides, title]
+  );
+  const widgetConfig = import_react21.default.useMemo(
+    () => createUniversalWidgetConfig(columns || {}),
+    [columns]
+  );
+  const dataSource = import_react21.default.useMemo(() => {
+    if (!isConfigured) return null;
+    return createUniversalSource(supabase, { table, columns });
+  }, [isConfigured, supabase, table, columns]);
+  const adapter = import_react21.default.useMemo(
+    () => (args) => adaptUniversalData({ ...args, options: { confirmedValue, pendingValue } }),
+    [confirmedValue, pendingValue]
+  );
+  const dashboard = useReusableDashboard({
+    config: widgetConfig,
+    dataSource: dataSource || { fetchDashboardSnapshot: null },
+    adapter,
+    createEmptyState: createEmptyUniversalData,
+    languageCode,
+    dateLocale,
+    labels
+  });
+  if (!isConfigured) {
+    const issues = [];
+    if (!supabase) issues.push("Prop 'supabase' belum diisi (Supabase client).");
+    if (!table) issues.push("Prop 'table' belum diisi (nama tabel sumber data).");
+    if (!(columns == null ? void 0 : columns.date))
+      issues.push("Prop 'columns.date' belum diisi (kolom timestamp).");
+    return /* @__PURE__ */ import_react21.default.createElement("div", { className: "rdb-view" }, /* @__PURE__ */ import_react21.default.createElement(SetupWizard, { issues, supabase, onDismiss: () => {
+    } }));
+  }
+  return /* @__PURE__ */ import_react21.default.createElement(
+    ReusableDashboardView,
+    {
+      config: widgetConfig,
+      labels,
+      loading: dashboard.loading,
+      error: dashboard.error,
+      filters: dashboard.filters,
+      onFilterChange: dashboard.updateFilter,
+      onResetFilters: dashboard.resetFilters,
+      onRefresh: dashboard.refresh,
+      data: dashboard.data,
+      dateLocale,
+      liveUpdateEnabled: dashboard.liveUpdateEnabled,
+      supabase
+    }
+  );
+}
+AutoDashboard.propTypes = {
+  /** Supabase client instance (WAJIB). */
+  supabase: import_prop_types19.default.object,
+  /** Nama tabel sumber data (WAJIB), mis. "bookings" / "orders". */
+  table: import_prop_types19.default.string,
+  /** Pemetaan kolom: { date, status, total, customer, item, audience }. date WAJIB. */
+  columns: import_prop_types19.default.shape({
+    date: import_prop_types19.default.string,
+    status: import_prop_types19.default.string,
+    total: import_prop_types19.default.string,
+    customer: import_prop_types19.default.string,
+    item: import_prop_types19.default.string,
+    audience: import_prop_types19.default.string
+  }),
+  /** Nilai status yang dihitung "berhasil" (default "confirmed"). */
+  confirmedValue: import_prop_types19.default.string,
+  /** Nilai status yang dihitung "menunggu" (default "pending"). */
+  pendingValue: import_prop_types19.default.string,
+  /** Judul dashboard. */
+  title: import_prop_types19.default.string,
+  /** Override sebagian/seluruh label UI. */
+  labels: import_prop_types19.default.object,
+  languageCode: import_prop_types19.default.string,
+  dateLocale: import_prop_types19.default.string
+};
+
 // src/utils/labels.js
 function createDashboardLabels(t) {
   const labels = {
@@ -2857,6 +3280,7 @@ function createDashboardLabels(t) {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  AutoDashboard,
   Badge,
   Button,
   ChartCard,
@@ -2878,6 +3302,7 @@ function createDashboardLabels(t) {
   adaptCidikaDashboardData,
   adaptDummyUmkmData,
   adaptTokoSepatuData,
+  adaptUniversalData,
   buildDayBuckets,
   cidikaWidgetConfig,
   createCidikaSupabaseSource,
@@ -2887,7 +3312,10 @@ function createDashboardLabels(t) {
   createEmptyDashboardData,
   createEmptyDummyUmkmData,
   createEmptyTokoSepatuData,
+  createEmptyUniversalData,
   createTokoSepatuSupabaseSource,
+  createUniversalSource,
+  createUniversalWidgetConfig,
   dummyUmkmWidgetConfig,
   formatDate,
   formatIDR,