react-shadcn-kit 0.2.2 → 0.2.4

package/dist/components/data-table/data-table.js

@@ -0,0 +1,143 @@
+"use client";
+import { jsxs as r, jsx as t } from "react/jsx-runtime";
+import * as l from "react";
+import { useReactTable as O, getFacetedUniqueValues as U, getFacetedRowModel as B, getSortedRowModel as W, getPaginationRowModel as J, getFilteredRowModel as K, getCoreRowModel as L, getExpandedRowModel as Q, flexRender as S } from "@tanstack/react-table";
+import { Table as X, TableHeader as Y, TableRow as c, TableHead as Z, TableBody as _, TableCell as u } from "../primitives/table.js";
+import { DataTablePagination as ee } from "./data-table-pagination.js";
+import { DataTableToolbar as te } from "./data-table-toolbar.js";
+function ae({
+  columns: g,
+  data: R,
+  searchKey: x,
+  onRowClick: m,
+  renderSubComponent: h,
+  enableRowExpansion: a = !1,
+  enableColumnSizing: i = !1,
+  enableColumnPinning: d = !1,
+  enableGlobalFilter: v = !1,
+  enableColumnOrdering: p = !1,
+  enableRowPinning: f = !1,
+  facetedFilters: w
+}) {
+  const [C, b] = l.useState({}), [M, F] = l.useState({}), [T, y] = l.useState([]), [P, z] = l.useState(""), [N, I] = l.useState([]), [$, D] = l.useState({}), [V, H] = l.useState({}), [k, j] = l.useState([]), [q, A] = l.useState({
+    left: [],
+    right: []
+  }), [E, G] = l.useState({
+    top: [],
+    bottom: []
+  }), s = O({
+    data: R,
+    columns: g,
+    state: {
+      sorting: N,
+      columnVisibility: M,
+      rowSelection: C,
+      columnFilters: T,
+      globalFilter: P,
+      ...a && { expanded: $ },
+      ...i && { columnSizing: V },
+      ...d && { columnPinning: q },
+      ...p && { columnOrder: k },
+      ...f && { rowPinning: E }
+    },
+    defaultColumn: {
+      minSize: 50,
+      maxSize: 500
+    },
+    enableRowSelection: !0,
+    ...a && { getExpandedRowModel: Q() },
+    onRowSelectionChange: b,
+    onSortingChange: I,
+    onColumnFiltersChange: y,
+    onGlobalFilterChange: z,
+    onColumnVisibilityChange: F,
+    ...a && { onExpandedChange: D },
+    ...i && { onColumnSizingChange: H },
+    ...d && { onColumnPinningChange: A },
+    ...p && { onColumnOrderChange: j },
+    ...f && { onRowPinningChange: G },
+    getCoreRowModel: L(),
+    getFilteredRowModel: K(),
+    getPaginationRowModel: J(),
+    getSortedRowModel: W(),
+    getFacetedRowModel: B(),
+    getFacetedUniqueValues: U()
+  });
+  return /* @__PURE__ */ r("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ t(
+      te,
+      {
+        table: s,
+        searchKey: x,
+        enableGlobalFilter: v,
+        facetedFilters: w
+      }
+    ),
+    /* @__PURE__ */ t("div", { className: "rounded-md border overflow-x-auto", children: /* @__PURE__ */ r(X, { style: i ? { minWidth: s.getTotalSize() } : void 0, children: [
+      /* @__PURE__ */ t(Y, { children: s.getHeaderGroups().map((n) => /* @__PURE__ */ t(c, { children: n.headers.map((e) => {
+        const o = d ? e.column.getIsPinned() : !1;
+        return /* @__PURE__ */ r(
+          Z,
+          {
+            colSpan: e.colSpan,
+            className: "relative",
+            style: {
+              width: i ? `${e.getSize()}px` : void 0,
+              position: o ? "sticky" : void 0,
+              left: o === "left" ? `${e.column.getStart()}px` : void 0,
+              right: o === "right" ? `${e.column.getAfter()}px` : void 0,
+              zIndex: o ? 1 : void 0,
+              backgroundColor: o ? "rgba(0, 0, 0, 0.02)" : void 0
+            },
+            children: [
+              e.isPlaceholder ? null : S(e.column.columnDef.header, e.getContext()),
+              i && /* @__PURE__ */ t(
+                "div",
+                {
+                  onMouseDown: e.getResizeHandler(),
+                  onTouchStart: e.getResizeHandler(),
+                  className: `absolute right-0 top-0 h-full w-1 cursor-col-resize select-none touch-none hover:bg-primary/50 ${e.column.getIsResizing() ? "bg-primary" : "bg-border"}`
+                }
+              )
+            ]
+          },
+          e.id
+        );
+      }) }, n.id)) }),
+      /* @__PURE__ */ t(_, { children: s.getRowModel().rows?.length ? s.getRowModel().rows.map((n) => /* @__PURE__ */ r(l.Fragment, { children: [
+        /* @__PURE__ */ t(
+          c,
+          {
+            onClick: () => m?.(n),
+            className: m ? "cursor-pointer" : "",
+            "data-state": n.getIsSelected() && "selected",
+            children: n.getVisibleCells().map((e) => {
+              const o = d ? e.column.getIsPinned() : !1;
+              return /* @__PURE__ */ t(
+                u,
+                {
+                  style: {
+                    width: i ? `${e.column.getSize()}px` : void 0,
+                    position: o ? "sticky" : void 0,
+                    left: o === "left" ? `${e.column.getStart()}px` : void 0,
+                    right: o === "right" ? `${e.column.getAfter()}px` : void 0,
+                    zIndex: o ? 1 : void 0,
+                    backgroundColor: o ? "rgba(0, 0, 0, 0.02)" : void 0
+                  },
+                  children: S(e.column.columnDef.cell, e.getContext())
+                },
+                e.id
+              );
+            })
+          }
+        ),
+        a && n.getIsExpanded() && /* @__PURE__ */ t(c, { children: /* @__PURE__ */ t(u, { colSpan: g.length, className: "p-0", children: h ? h({ row: n }) : null }) })
+      ] }, n.id)) : /* @__PURE__ */ t(c, { children: /* @__PURE__ */ t(u, { colSpan: g.length, className: "h-24 text-center", children: "No results." }) }) })
+    ] }) }),
+    /* @__PURE__ */ t(ee, { table: s })
+  ] });
+}
+export {
+  ae as DataTable
+};
+//# sourceMappingURL=data-table.js.map

package/dist/components/data-table/data-table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table.js","sources":["../../../src/components/data-table/data-table.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport type { Row } from \"@tanstack/react-table\";\nimport {\n  ColumnDef,\n  ColumnFiltersState,\n  ColumnPinningState,\n  ColumnSizingState,\n  ExpandedState,\n  SortingState,\n  VisibilityState,\n  ColumnOrderState,\n  RowPinningState,\n  flexRender,\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFacetedRowModel,\n  getFacetedUniqueValues,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from \"@tanstack/react-table\";\n\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from \"../primitives/table\";\n\nimport { DataTablePagination } from \"./data-table-pagination\";\nimport { DataTableToolbar } from \"./data-table-toolbar\";\n\ninterface DataTableProps<TData, TValue> {\n  columns: ColumnDef<TData, TValue>[];\n  data: TData[];\n  searchKey?: string;\n  onRowClick?: (row: Row<TData>) => void;\n  renderSubComponent?: (props: { row: Row<TData> }) => React.ReactNode;\n  enableRowExpansion?: boolean;\n\n  enableColumnSizing?: boolean;\n  enableColumnPinning?: boolean;\n  enableGlobalFilter?: boolean;\n  enableColumnOrdering?: boolean;\n  enableRowPinning?: boolean;\n  facetedFilters?: {\n    columnId: string;\n    title: string;\n    options: {\n      label: string;\n      value: string;\n      icon?: React.ComponentType<{ className?: string }>;\n    }[];\n  }[];\n}\n\nexport function DataTable<TData, TValue>({\n  columns,\n  data,\n  searchKey,\n  onRowClick,\n  renderSubComponent,\n  enableRowExpansion = false,\n\n  enableColumnSizing = false,\n  enableColumnPinning = false,\n  enableGlobalFilter = false,\n  enableColumnOrdering = false,\n  enableRowPinning = false,\n  facetedFilters,\n}: DataTableProps<TData, TValue>) {\n  const [rowSelection, setRowSelection] = React.useState({});\n  const [columnVisibility, setColumnVisibility] = React.useState<VisibilityState>({});\n  const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>([]);\n  const [globalFilter, setGlobalFilter] = React.useState<string>(\"\");\n  const [sorting, setSorting] = React.useState<SortingState>([]);\n  const [expanded, setExpanded] = React.useState<ExpandedState>({});\n\n  const [columnSizing, setColumnSizing] = React.useState<ColumnSizingState>({});\n  const [columnOrder, setColumnOrder] = React.useState<ColumnOrderState>([]);\n  const [columnPinning, setColumnPinning] = React.useState<ColumnPinningState>({\n    left: [],\n    right: [],\n  });\n  const [rowPinning, setRowPinning] = React.useState<RowPinningState>({\n    top: [],\n    bottom: [],\n  });\n\n  const table = useReactTable({\n    data,\n    columns,\n    state: {\n      sorting,\n      columnVisibility,\n      rowSelection,\n      columnFilters,\n      globalFilter,\n      ...(enableRowExpansion && { expanded }),\n\n      ...(enableColumnSizing && { columnSizing }),\n      ...(enableColumnPinning && { columnPinning }),\n      ...(enableColumnOrdering && { columnOrder }),\n      ...(enableRowPinning && { rowPinning }),\n    },\n    defaultColumn: {\n      minSize: 50,\n      maxSize: 500,\n    },\n    enableRowSelection: true,\n    ...(enableRowExpansion && { getExpandedRowModel: getExpandedRowModel() }),\n\n    onRowSelectionChange: setRowSelection,\n    onSortingChange: setSorting,\n    onColumnFiltersChange: setColumnFilters,\n    onGlobalFilterChange: setGlobalFilter,\n    onColumnVisibilityChange: setColumnVisibility,\n    ...(enableRowExpansion && { onExpandedChange: setExpanded }),\n\n    ...(enableColumnSizing && { onColumnSizingChange: setColumnSizing }),\n    ...(enableColumnPinning && { onColumnPinningChange: setColumnPinning }),\n    ...(enableColumnOrdering && { onColumnOrderChange: setColumnOrder }),\n    ...(enableRowPinning && { onRowPinningChange: setRowPinning }),\n    getCoreRowModel: getCoreRowModel(),\n    getFilteredRowModel: getFilteredRowModel(),\n    getPaginationRowModel: getPaginationRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    getFacetedRowModel: getFacetedRowModel(),\n    getFacetedUniqueValues: getFacetedUniqueValues(),\n  });\n\n  return (\n    <div className=\"space-y-4\">\n      <DataTableToolbar\n        table={table}\n        searchKey={searchKey}\n        enableGlobalFilter={enableGlobalFilter}\n        facetedFilters={facetedFilters}\n      />\n      <div className=\"rounded-md border overflow-x-auto\">\n        <Table style={enableColumnSizing ? { minWidth: table.getTotalSize() } : undefined}>\n          <TableHeader>\n            {table.getHeaderGroups().map((headerGroup) => (\n              <TableRow key={headerGroup.id}>\n                {headerGroup.headers.map((header) => {\n                  const isPinned = enableColumnPinning ? header.column.getIsPinned() : false;\n                  return (\n                    <TableHead\n                      key={header.id}\n                      colSpan={header.colSpan}\n                      className=\"relative\"\n                      style={{\n                        width: enableColumnSizing ? `${header.getSize()}px` : undefined,\n                        position: isPinned ? \"sticky\" : undefined,\n                        left: isPinned === \"left\" ? `${header.column.getStart()}px` : undefined,\n                        right: isPinned === \"right\" ? `${header.column.getAfter()}px` : undefined,\n                        zIndex: isPinned ? 1 : undefined,\n                        backgroundColor: isPinned ? \"rgba(0, 0, 0, 0.02)\" : undefined,\n                      }}\n                    >\n                      {header.isPlaceholder\n                        ? null\n                        : flexRender(header.column.columnDef.header, header.getContext())}\n                      {enableColumnSizing && (\n                        <div\n                          onMouseDown={header.getResizeHandler()}\n                          onTouchStart={header.getResizeHandler()}\n                          className={`absolute right-0 top-0 h-full w-1 cursor-col-resize select-none touch-none hover:bg-primary/50 ${\n                            header.column.getIsResizing() ? \"bg-primary\" : \"bg-border\"\n                          }`}\n                        />\n                      )}\n                    </TableHead>\n                  );\n                })}\n              </TableRow>\n            ))}\n          </TableHeader>\n          <TableBody>\n            {table.getRowModel().rows?.length ? (\n              table.getRowModel().rows.map((row) => (\n                <React.Fragment key={row.id}>\n                  <TableRow\n                    onClick={() => onRowClick?.(row)}\n                    className={onRowClick ? \"cursor-pointer\" : \"\"}\n                    data-state={row.getIsSelected() && \"selected\"}\n                  >\n                    {row.getVisibleCells().map((cell) => {\n                      const isPinned = enableColumnPinning ? cell.column.getIsPinned() : false;\n                      return (\n                        <TableCell\n                          key={cell.id}\n                          style={{\n                            width: enableColumnSizing ? `${cell.column.getSize()}px` : undefined,\n                            position: isPinned ? \"sticky\" : undefined,\n                            left: isPinned === \"left\" ? `${cell.column.getStart()}px` : undefined,\n                            right: isPinned === \"right\" ? `${cell.column.getAfter()}px` : undefined,\n                            zIndex: isPinned ? 1 : undefined,\n                            backgroundColor: isPinned ? \"rgba(0, 0, 0, 0.02)\" : undefined,\n                          }}\n                        >\n                          {flexRender(cell.column.columnDef.cell, cell.getContext())}\n                        </TableCell>\n                      );\n                    })}\n                  </TableRow>\n                  {enableRowExpansion && row.getIsExpanded() && (\n                    <TableRow>\n                      <TableCell colSpan={columns.length} className=\"p-0\">\n                        {renderSubComponent ? renderSubComponent({ row }) : null}\n                      </TableCell>\n                    </TableRow>\n                  )}\n                </React.Fragment>\n              ))\n            ) : (\n              <TableRow>\n                <TableCell colSpan={columns.length} className=\"h-24 text-center\">\n                  No results.\n                </TableCell>\n              </TableRow>\n            )}\n          </TableBody>\n        </Table>\n      </div>\n      <DataTablePagination table={table} />\n    </div>\n  );\n}\n"],"names":[],"mappings":";AAsDO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAkC;AACvC;AACA;AACA;AACA;AACA;AACqB;AAEA;AACC;AACD;AACE;AACJ;AAErB;AACE;AAS6E;AACrE;AACC;AAE2D;AAC7D;AACG;AAGkB;AAC1B;AACA;AACO;AACL;AACA;AACA;AACA;AACA;AAC4B;AAEA;AACC;AACC;AACJ;AAAW;AAExB;AACJ;AACA;AAAA;AAES;AACiD;AAE/C;AACL;AACM;AACD;AACI;AACoB;AAEI;AACE;AACD;AACL;AAC7B;AACI;AACE;AACJ;AACC;AACI;AAG1B;AAEI;AAAA;AAAC;AAAA;AACC;AACA;AACA;AACA;AAAA;AAAA;AAIE;AAIQ;AACA;AACE;AAAC;AAAA;AAEiB;AACN;AACH;AACiD;AACtB;AAC8B;AACE;AACzC;AAC6B;AAAA;AAGrD;AAEiE;AAEhE;AAAC;AAAA;AACqB;AACC;AAGrB;AAAA;AAAA;AACF;AAAA;AAtBU;AAAA;AA6BxB;AAKQ;AAAA;AAAC;AAAA;AACgC;AACY;AACR;AAGjC;AACA;AACE;AAAC;AAAA;AAEQ;AACsD;AAC3B;AAC4B;AACE;AACvC;AAC6B;AAAA;AAGG;AAAA;AAV/C;AAAA;AAaf;AAAA;AAAA;AAOD;AAWV;AAEJ;AACmC;AAGzC;;;;"}

package/dist/components/data-table/index.d.ts

@@ -0,0 +1,6 @@
+export * from './data-table';
+export * from './data-table-column-header';
+export * from './data-table-pagination';
+export * from './data-table-view-options';
+export * from './data-table-toolbar';
+export * from './data-table-faceted-filter';

package/dist/components/data-table/index.js

@@ -0,0 +1,15 @@
+import { DataTable as o } from "./data-table.js";
+import { DataTableColumnHeader as r } from "./data-table-column-header.js";
+import { DataTablePagination as b } from "./data-table-pagination.js";
+import { DataTableViewOptions as p } from "./data-table-view-options.js";
+import { DataTableToolbar as f } from "./data-table-toolbar.js";
+import { DataTableFacetedFilter as D } from "./data-table-faceted-filter.js";
+export {
+  o as DataTable,
+  r as DataTableColumnHeader,
+  D as DataTableFacetedFilter,
+  b as DataTablePagination,
+  f as DataTableToolbar,
+  p as DataTableViewOptions
+};
+//# sourceMappingURL=index.js.map

package/dist/components/data-table/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/components/kanban/index.d.ts

@@ -0,0 +1 @@
+export * from './kanban';

package/dist/components/kanban/index.js

@@ -0,0 +1,12 @@
+import { Kanban as b, KanbanCard as o, KanbanCardDescription as C, KanbanCardTitle as K, KanbanColumn as e, KanbanColumnBadge as r, KanbanColumnContent as d, KanbanColumnHeader as l } from "./kanban.js";
+export {
+  b as Kanban,
+  o as KanbanCard,
+  C as KanbanCardDescription,
+  K as KanbanCardTitle,
+  e as KanbanColumn,
+  r as KanbanColumnBadge,
+  d as KanbanColumnContent,
+  l as KanbanColumnHeader
+};
+//# sourceMappingURL=index.js.map

package/dist/components/kanban/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/kanban/kanban.js

@@ -0,0 +1,293 @@
+"use client";
+import { jsx as r, jsxs as w } from "react/jsx-runtime";
+import * as l from "react";
+import { createPortal as L } from "react-dom";
+import { useSensors as $, useSensor as N, PointerSensor as q, KeyboardSensor as z, defaultDropAnimationSideEffects as F, DndContext as J, DragOverlay as Q } from "@dnd-kit/core";
+import { sortableKeyboardCoordinates as U, useSortable as A, SortableContext as V, arrayMove as K } from "@dnd-kit/sortable";
+import { CSS as E } from "@dnd-kit/utilities";
+import { cn as u } from "../../lib/utils.js";
+function dt({
+  items: t,
+  columns: e = [],
+  onItemUpdate: x,
+  onItemClick: I,
+  renderCard: f,
+  className: S
+}) {
+  const [s, v] = l.useState(null), [g, m] = l.useState(null), [n, p] = l.useState(t);
+  l.useEffect(() => {
+    s || p(t);
+  }, [t, s]);
+  const D = $(
+    N(q, {
+      activationConstraint: {
+        distance: 10
+      }
+    }),
+    N(z, {
+      coordinateGetter: U
+    })
+  ), b = l.useMemo(() => g === "Card" && s ? n.find((a) => a.id === s) : null, [s, g, n]);
+  function T(a) {
+    if (a.active.data.current?.type === "Card") {
+      v(a.active.id), m("Card"), p(t);
+      return;
+    }
+  }
+  function j(a) {
+    const { active: o, over: h } = a;
+    if (!h) return;
+    const y = o.id, C = h.id;
+    if (y === C) return;
+    const k = o.data.current?.type === "Card", P = h.data.current?.type === "Card", G = h.data.current?.type === "Column";
+    if (k) {
+      if (k && P) {
+        const d = n.findIndex((i) => i.id === y), c = n.findIndex((i) => i.id === C);
+        if (n[d].status !== n[c].status) {
+          const i = [...n];
+          i[d] = {
+            ...i[d],
+            status: n[c].status
+          };
+          const H = K(i, d, c);
+          p(H);
+        } else {
+          const i = K(n, d, c);
+          p(i);
+        }
+      }
+      if (k && G) {
+        const d = n.findIndex((i) => i.id === y), c = [...n];
+        c[d] = {
+          ...c[d],
+          status: C
+        }, p(c);
+      }
+    }
+  }
+  function M(a) {
+    const { active: o, over: h } = a, y = o.id;
+    if (v(null), m(null), !h) return;
+    const C = n.find((k) => k.id === y);
+    C && x(y, C.status);
+  }
+  const R = l.useMemo(() => {
+    const a = {};
+    return e.forEach((o) => {
+      a[o.id] = [];
+    }), n.forEach((o) => {
+      a[o.status] ? a[o.status].push(o) : e.length > 0 && a[e[0].id].push(o);
+    }), a;
+  }, [n, e]), B = {
+    sideEffects: F({
+      styles: {
+        active: {
+          opacity: "0.5"
+        }
+      }
+    })
+  };
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      "data-slot": "kanban",
+      className: u(
+        "flex h-full w-full items-start overflow-x-auto overflow-y-hidden py-4",
+        S
+      ),
+      children: /* @__PURE__ */ w(
+        J,
+        {
+          sensors: D,
+          onDragStart: T,
+          onDragOver: j,
+          onDragEnd: M,
+          children: [
+            /* @__PURE__ */ r("div", { className: "flex gap-4 pb-4", children: e.map((a) => /* @__PURE__ */ r(
+              W,
+              {
+                column: a,
+                items: R[a.id] || [],
+                onCardClick: I,
+                renderCard: f
+              },
+              a.id
+            )) }),
+            typeof document < "u" && L(
+              /* @__PURE__ */ r(Q, { dropAnimation: B, children: b && /* @__PURE__ */ r(O, { card: b, renderCard: f }) }),
+              document.body
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+function W({
+  column: t,
+  items: e,
+  onCardClick: x,
+  renderCard: I,
+  className: f
+}) {
+  const S = l.useMemo(() => e.map((b) => b.id), [e]), { setNodeRef: s, attributes: v, listeners: g, transform: m, transition: n, isDragging: p } = A({
+    id: t.id,
+    data: {
+      type: "Column",
+      column: t
+    },
+    disabled: !0
+    // Disable column reordering by default
+  }), D = {
+    transition: n,
+    transform: E.Transform.toString(m)
+  };
+  return p ? /* @__PURE__ */ r(
+    "div",
+    {
+      ref: s,
+      style: D,
+      "data-slot": "kanban-column",
+      className: "bg-muted/30 opacity-40 border-2 border-primary/30 w-[300px] min-w-[300px] h-[600px] max-h-[600px] rounded-md flex flex-col"
+    }
+  ) : /* @__PURE__ */ w(
+    "div",
+    {
+      ref: s,
+      style: D,
+      "data-slot": "kanban-column",
+      className: u(
+        "bg-muted/10 w-[300px] min-w-[300px] h-[600px] max-h-[600px] rounded-xl flex flex-col border",
+        f
+      ),
+      children: [
+        /* @__PURE__ */ w(X, { ...v, ...g, children: [
+          /* @__PURE__ */ r(Y, { children: e.length }),
+          t.title
+        ] }),
+        /* @__PURE__ */ r(Z, { children: /* @__PURE__ */ r(V, { items: S, children: e.map((b) => /* @__PURE__ */ r(
+          O,
+          {
+            card: b,
+            onCardClick: x,
+            renderCard: I
+          },
+          b.id
+        )) }) })
+      ]
+    }
+  );
+}
+function X({ className: t, ...e }) {
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      "data-slot": "kanban-column-header",
+      className: u(
+        "bg-background/50 backdrop-blur-sm text-md h-[60px] rounded-t-xl p-4 font-semibold border-b border-border/50 flex items-center justify-between",
+        t
+      ),
+      ...e
+    }
+  );
+}
+function Y({ className: t, ...e }) {
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      "data-slot": "kanban-column-badge",
+      className: u(
+        "flex justify-center items-center bg-primary/10 text-primary px-2.5 py-0.5 text-xs font-medium rounded-full",
+        t
+      ),
+      ...e
+    }
+  );
+}
+function Z({ className: t, ...e }) {
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      "data-slot": "kanban-column-content",
+      className: u("flex grow flex-col gap-3 p-3 overflow-x-hidden overflow-y-auto", t),
+      ...e
+    }
+  );
+}
+const _ = ({
+  card: t,
+  onCardClick: e,
+  renderCard: x,
+  className: I
+}) => {
+  const { setNodeRef: f, attributes: S, listeners: s, transform: v, transition: g, isDragging: m } = A({
+    id: t.id,
+    data: {
+      type: "Card",
+      card: t
+    }
+  }), n = {
+    transition: g,
+    transform: E.Transform.toString(v)
+  };
+  return m ? /* @__PURE__ */ r(
+    "div",
+    {
+      ref: f,
+      style: n,
+      "data-slot": "kanban-card",
+      className: "opacity-30 bg-background p-3 rounded-xl border border-primary/50 cursor-grab relative h-[100px]"
+    }
+  ) : /* @__PURE__ */ r(
+    "div",
+    {
+      ref: f,
+      style: n,
+      "data-slot": "kanban-card",
+      ...S,
+      ...s,
+      onClick: () => {
+        m || e?.(t);
+      },
+      className: u(
+        "bg-background p-3 rounded-xl hover:ring-2 hover:ring-primary/20 hover:ring-inset cursor-grab relative border border-border/50 shadow-sm space-y-2 group transition-all",
+        I
+      ),
+      children: x ? x(t) : /* @__PURE__ */ w("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ r(tt, { children: t.title || t.name || `Item ${t.id}` }),
+        t.description && /* @__PURE__ */ r(et, { children: t.description })
+      ] })
+    }
+  );
+}, O = l.memo(_);
+function tt({ className: t, ...e }) {
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      "data-slot": "kanban-card-title",
+      className: u("font-medium text-sm line-clamp-1", t),
+      ...e
+    }
+  );
+}
+function et({ className: t, ...e }) {
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      "data-slot": "kanban-card-description",
+      className: u("text-xs text-muted-foreground line-clamp-2", t),
+      ...e
+    }
+  );
+}
+export {
+  dt as Kanban,
+  O as KanbanCard,
+  et as KanbanCardDescription,
+  tt as KanbanCardTitle,
+  W as KanbanColumn,
+  Y as KanbanColumnBadge,
+  Z as KanbanColumnContent,
+  X as KanbanColumnHeader
+};
+//# sourceMappingURL=kanban.js.map

package/dist/components/kanban/kanban.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kanban.js","sources":["../../../src/components/kanban/kanban.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { createPortal } from \"react-dom\";\nimport {\n  DndContext,\n  DragOverlay,\n  DragStartEvent,\n  DragEndEvent,\n  DragOverEvent,\n  useSensor,\n  useSensors,\n  PointerSensor,\n  KeyboardSensor,\n  defaultDropAnimationSideEffects,\n  DropAnimation,\n} from \"@dnd-kit/core\";\nimport {\n  arrayMove,\n  sortableKeyboardCoordinates,\n  SortableContext,\n  useSortable,\n} from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\n\nimport { cn } from \"@/lib/utils\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type KanbanId = string | number;\n\nexport interface KanbanColumnDef {\n  id: string;\n  title: string;\n}\n\nexport interface KanbanItem {\n  id: KanbanId;\n  status: string;\n  title?: string;\n  name?: string;\n  description?: string;\n  [key: string]: unknown;\n}\n\n// ============================================================================\n// Kanban Root\n// ============================================================================\n\ninterface KanbanRootProps<T extends KanbanItem> {\n  items: T[];\n  columns?: KanbanColumnDef[];\n  onItemUpdate: (itemId: KanbanId, newStatus: string) => void;\n  onItemClick?: (item: T) => void;\n  renderCard?: (item: T) => React.ReactNode;\n  className?: string;\n}\n\nfunction KanbanRoot<T extends KanbanItem>({\n  items,\n  columns = [],\n  onItemUpdate,\n  onItemClick,\n  renderCard,\n  className,\n}: KanbanRootProps<T>) {\n  const [activeDragId, setActiveDragId] = React.useState<KanbanId | null>(null);\n  const [activeDragType, setActiveDragType] = React.useState<\"Column\" | \"Card\" | null>(null);\n  const [localItems, setLocalItems] = React.useState<T[]>(items);\n\n  // Sync local items when props change (if not dragging)\n  React.useEffect(() => {\n    if (!activeDragId) {\n      setLocalItems(items);\n    }\n  }, [items, activeDragId]);\n\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: {\n        distance: 10,\n      },\n    }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  );\n\n  const activeItem = React.useMemo(() => {\n    if (activeDragType === \"Card\" && activeDragId) {\n      return localItems.find((l) => l.id === activeDragId);\n    }\n    return null;\n  }, [activeDragId, activeDragType, localItems]);\n\n  function handleDragStart(event: DragStartEvent) {\n    if (event.active.data.current?.type === \"Card\") {\n      setActiveDragId(event.active.id as KanbanId);\n      setActiveDragType(\"Card\");\n      setLocalItems(items);\n      return;\n    }\n  }\n\n  function handleDragOver(event: DragOverEvent) {\n    const { active, over } = event;\n    if (!over) return;\n\n    const activeId = active.id;\n    const overId = over.id;\n\n    if (activeId === overId) return;\n\n    const isActiveACard = active.data.current?.type === \"Card\";\n    const isOverACard = over.data.current?.type === \"Card\";\n    const isOverAColumn = over.data.current?.type === \"Column\";\n\n    if (!isActiveACard) return;\n\n    // Dropping a Card over another Card\n    if (isActiveACard && isOverACard) {\n      const activeIndex = localItems.findIndex((t) => t.id === activeId);\n      const overIndex = localItems.findIndex((t) => t.id === overId);\n\n      if (localItems[activeIndex].status !== localItems[overIndex].status) {\n        const newItems = [...localItems];\n        newItems[activeIndex] = {\n          ...newItems[activeIndex],\n          status: localItems[overIndex].status,\n        };\n        const reorderedItems = arrayMove(newItems, activeIndex, overIndex);\n        setLocalItems(reorderedItems);\n      } else {\n        const reorderedItems = arrayMove(localItems, activeIndex, overIndex);\n        setLocalItems(reorderedItems);\n      }\n    }\n\n    // Dropping a Card over a Column\n    if (isActiveACard && isOverAColumn) {\n      const activeIndex = localItems.findIndex((t) => t.id === activeId);\n      const newItems = [...localItems];\n      newItems[activeIndex] = {\n        ...newItems[activeIndex],\n        status: overId as string,\n      };\n      setLocalItems(newItems);\n    }\n  }\n\n  function handleDragEnd(event: DragEndEvent) {\n    const { active, over } = event;\n    const activeItemId = active.id as KanbanId;\n\n    // Reset drag state\n    setActiveDragId(null);\n    setActiveDragType(null);\n\n    if (!over) return;\n\n    const currentItem = localItems.find((l) => l.id === activeItemId);\n    if (currentItem) {\n      onItemUpdate(activeItemId, currentItem.status);\n    }\n  }\n\n  const itemsByStatus = React.useMemo(() => {\n    const grouped: Record<string, T[]> = {};\n    columns.forEach((col) => {\n      grouped[col.id] = [];\n    });\n    localItems.forEach((item) => {\n      if (grouped[item.status]) {\n        grouped[item.status].push(item);\n      } else if (columns.length > 0) {\n        grouped[columns[0].id].push(item);\n      }\n    });\n    return grouped;\n  }, [localItems, columns]);\n\n  const dropAnimation: DropAnimation = {\n    sideEffects: defaultDropAnimationSideEffects({\n      styles: {\n        active: {\n          opacity: \"0.5\",\n        },\n      },\n    }),\n  };\n\n  return (\n    <div\n      data-slot=\"kanban\"\n      className={cn(\n        \"flex h-full w-full items-start overflow-x-auto overflow-y-hidden py-4\",\n        className,\n      )}\n    >\n      <DndContext\n        sensors={sensors}\n        onDragStart={handleDragStart}\n        onDragOver={handleDragOver}\n        onDragEnd={handleDragEnd}\n      >\n        <div className=\"flex gap-4 pb-4\">\n          {columns.map((col) => (\n            <KanbanColumn<T>\n              key={col.id}\n              column={col}\n              items={itemsByStatus[col.id] || []}\n              onCardClick={onItemClick}\n              renderCard={renderCard}\n            />\n          ))}\n        </div>\n\n        {typeof document !== \"undefined\" &&\n          createPortal(\n            <DragOverlay dropAnimation={dropAnimation}>\n              {activeItem && <KanbanCard<T> card={activeItem} renderCard={renderCard} />}\n            </DragOverlay>,\n            document.body,\n          )}\n      </DndContext>\n    </div>\n  );\n}\n\n// ============================================================================\n// Kanban Column\n// ============================================================================\n\ninterface KanbanColumnProps<T extends KanbanItem> {\n  column: KanbanColumnDef;\n  items: T[];\n  onCardClick?: (item: T) => void;\n  renderCard?: (item: T) => React.ReactNode;\n  className?: string;\n}\n\nfunction KanbanColumn<T extends KanbanItem>({\n  column,\n  items,\n  onCardClick,\n  renderCard,\n  className,\n}: KanbanColumnProps<T>) {\n  const itemIds = React.useMemo(() => {\n    return items.map((item) => item.id);\n  }, [items]);\n\n  const { setNodeRef, attributes, listeners, transform, transition, isDragging } = useSortable({\n    id: column.id,\n    data: {\n      type: \"Column\",\n      column,\n    },\n    disabled: true, // Disable column reordering by default\n  });\n\n  const style = {\n    transition,\n    transform: CSS.Transform.toString(transform),\n  };\n\n  if (isDragging) {\n    return (\n      <div\n        ref={setNodeRef}\n        style={style}\n        data-slot=\"kanban-column\"\n        className=\"bg-muted/30 opacity-40 border-2 border-primary/30 w-[300px] min-w-[300px] h-[600px] max-h-[600px] rounded-md flex flex-col\"\n      />\n    );\n  }\n\n  return (\n    <div\n      ref={setNodeRef}\n      style={style}\n      data-slot=\"kanban-column\"\n      className={cn(\n        \"bg-muted/10 w-[300px] min-w-[300px] h-[600px] max-h-[600px] rounded-xl flex flex-col border\",\n        className,\n      )}\n    >\n      <KanbanColumnHeader {...attributes} {...listeners}>\n        <KanbanColumnBadge>{items.length}</KanbanColumnBadge>\n        {column.title}\n      </KanbanColumnHeader>\n\n      <KanbanColumnContent>\n        <SortableContext items={itemIds}>\n          {items.map((item) => (\n            <KanbanCard<T>\n              key={item.id}\n              card={item}\n              onCardClick={onCardClick}\n              renderCard={renderCard}\n            />\n          ))}\n        </SortableContext>\n      </KanbanColumnContent>\n    </div>\n  );\n}\n\n// ============================================================================\n// Kanban Column Header\n// ============================================================================\n\nfunction KanbanColumnHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"kanban-column-header\"\n      className={cn(\n        \"bg-background/50 backdrop-blur-sm text-md h-[60px] rounded-t-xl p-4 font-semibold border-b border-border/50 flex items-center justify-between\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// Kanban Column Badge\n// ============================================================================\n\nfunction KanbanColumnBadge({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"kanban-column-badge\"\n      className={cn(\n        \"flex justify-center items-center bg-primary/10 text-primary px-2.5 py-0.5 text-xs font-medium rounded-full\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// Kanban Column Content\n// ============================================================================\n\nfunction KanbanColumnContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"kanban-column-content\"\n      className={cn(\"flex grow flex-col gap-3 p-3 overflow-x-hidden overflow-y-auto\", className)}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// Kanban Card\n// ============================================================================\n\ninterface KanbanCardProps<T extends KanbanItem> {\n  card: T;\n  onCardClick?: (item: T) => void;\n  renderCard?: (item: T) => React.ReactNode;\n  className?: string;\n}\n\nconst KanbanCardInner = <T extends KanbanItem>({\n  card,\n  onCardClick,\n  renderCard,\n  className,\n}: KanbanCardProps<T>) => {\n  const { setNodeRef, attributes, listeners, transform, transition, isDragging } = useSortable({\n    id: card.id,\n    data: {\n      type: \"Card\",\n      card,\n    },\n  });\n\n  const style = {\n    transition,\n    transform: CSS.Transform.toString(transform),\n  };\n\n  if (isDragging) {\n    return (\n      <div\n        ref={setNodeRef}\n        style={style}\n        data-slot=\"kanban-card\"\n        className=\"opacity-30 bg-background p-3 rounded-xl border border-primary/50 cursor-grab relative h-[100px]\"\n      />\n    );\n  }\n\n  return (\n    <div\n      ref={setNodeRef}\n      style={style}\n      data-slot=\"kanban-card\"\n      {...attributes}\n      {...listeners}\n      onClick={() => {\n        if (!isDragging) {\n          onCardClick?.(card);\n        }\n      }}\n      className={cn(\n        \"bg-background p-3 rounded-xl hover:ring-2 hover:ring-primary/20 hover:ring-inset cursor-grab relative border border-border/50 shadow-sm space-y-2 group transition-all\",\n        className,\n      )}\n    >\n      {renderCard ? (\n        renderCard(card)\n      ) : (\n        <div className=\"space-y-1\">\n          <KanbanCardTitle>{card.title || card.name || `Item ${card.id}`}</KanbanCardTitle>\n          {card.description && <KanbanCardDescription>{card.description}</KanbanCardDescription>}\n        </div>\n      )}\n    </div>\n  );\n};\n\nconst KanbanCard = React.memo(KanbanCardInner) as typeof KanbanCardInner;\n\n// ============================================================================\n// Kanban Card Title\n// ============================================================================\n\nfunction KanbanCardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"kanban-card-title\"\n      className={cn(\"font-medium text-sm line-clamp-1\", className)}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// Kanban Card Description\n// ============================================================================\n\nfunction KanbanCardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"kanban-card-description\"\n      className={cn(\"text-xs text-muted-foreground line-clamp-2\", className)}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// Exports\n// ============================================================================\n\nexport {\n  KanbanRoot as Kanban,\n  KanbanColumn,\n  KanbanColumnHeader,\n  KanbanColumnBadge,\n  KanbanColumnContent,\n  KanbanCard,\n  KanbanCardTitle,\n  KanbanCardDescription,\n};\n"],"names":[],"mappings":";AA4DA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAA0C;AACxC;AACU;AACV;AACA;AACA;AAEF;AACE;AAKA;AACE;AACqB;AAIvB;AAAgB;AACW;AACD;AACV;AAAA;AAEb;AACyB;AACN;AACnB;AAUH;AACE;AACE;AAGA;AAAA;AACF;AAGF;AACE;AACA;AAEA;AAGA;AAEA;AAIA;AAGA;AACE;AAGA;AACE;AACA;AAAwB;AACC;AACO;AAEhC;AACA;AAA4B;AAE5B;AACA;AAA4B;AAC9B;AAIF;AACE;AAEA;AAAwB;AACC;AACf;AAEY;AACxB;AAAA;AAGF;AACE;AAOA;AAEA;AACA;AAC+C;AAIjD;AACE;AACA;AACE;AAAkB;AAGlB;AAGkC;AAG7B;AAG4B;AACU;AACnC;AACE;AACG;AAAA;AACX;AAEH;AAGH;AACE;AAAC;AAAA;AACW;AACC;AACT;AACA;AAAA;AAGF;AAAC;AAAA;AACC;AACa;AACD;AACD;AAEX;AAEI;AAAC;AAAA;AAES;AACwB;AACnB;AACb;AAAA;AAJS;AAOf;AAGE;AAGE;AACS;AAAA;AACX;AAAA;AAAA;AACJ;AAGN;AAcA;AAA4C;AAC1C;AACA;AACA;AACA;AAEF;AACE;AAI6F;AAChF;AACL;AACE;AACN;AAAA;AAEQ;AAAA;AAGE;AACZ;AAC2C;AAG7C;AAEI;AAAC;AAAA;AACM;AACL;AACU;AACA;AAAA;AAMd;AAAC;AAAA;AACM;AACL;AACU;AACC;AACT;AACA;AAAA;AAGF;AACE;AAAiC;AACzB;AACV;AAKM;AAAC;AAAA;AAEO;AACN;AACA;AAAA;AAHU;AAOlB;AAAA;AAAA;AAGN;AAMA;AACE;AACE;AAAC;AAAA;AACW;AACC;AACT;AACA;AAAA;AAEE;AAAA;AAGV;AAMA;AACE;AACE;AAAC;AAAA;AACW;AACC;AACT;AACA;AAAA;AAEE;AAAA;AAGV;AAMA;AACE;AACE;AAAC;AAAA;AACW;AAC+E;AACrF;AAAA;AAGV;AAaA;AAA+C;AAC7C;AACA;AACA;AAEF;AACE;AAA6F;AAClF;AACH;AACE;AACN;AAAA;AAIU;AACZ;AAC2C;AAG7C;AAEI;AAAC;AAAA;AACM;AACL;AACU;AACA;AAAA;AAMd;AAAC;AAAA;AACM;AACL;AACU;AACN;AACA;AAEF;AACoB;AAEtB;AACW;AACT;AACA;AAAA;AAOE;AAA+D;AACD;AAChE;AAAA;AAIR;AAQA;AACE;AACE;AAAC;AAAA;AACW;AACiD;AACvD;AAAA;AAGV;AAMA;AACE;AACE;AAAC;AAAA;AACW;AAC2D;AACjE;AAAA;AAGV;;;;;;;;;;;"}

package/dist/components/marketing/hero.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsxs as t, jsx as e } from "react/jsx-runtime";
 import * as p from "react";
 import { CustomButton as n } from "../primitives/custom-button.js";

package/dist/components/marketing/hero.js.map

@@ -1 +1 @@
-{"version":3,"file":"hero.js","sources":["../../../src/components/marketing/hero.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { CustomButton } from \"../primitives/custom-button\";\nimport { cn } from \"@/lib/utils\";\n\ninterface HeroSectionProps extends React.HTMLAttributes<HTMLElement> {\n  title: string;\n  subtitle?: string;\n  ctaText?: string;\n  ctaHref?: string;\n  secondaryCtaText?: string;\n  secondaryCtaHref?: string;\n  badge?: string;\n}\n\nconst HeroSection = React.forwardRef<HTMLElement, HeroSectionProps>(\n  (\n    {\n      title,\n      subtitle,\n      ctaText,\n      ctaHref = \"#\",\n      secondaryCtaText,\n      secondaryCtaHref = \"#\",\n      badge,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <section\n        ref={ref}\n        className={cn(\n          \"relative flex flex-col items-center justify-center overflow-hidden px-6 py-24 text-center sm:py-32 lg:px-8\",\n          className,\n        )}\n        {...props}\n      >\n        {/* Abstract Background Decoration */}\n        <div\n          className=\"absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80\"\n          aria-hidden=\"true\"\n        >\n          <div\n            className=\"relative left-[calc(50%-11rem)] aspect-1155/678 w-144.5 -translate-x-1/2 rotate-30 bg-linear-to-tr from-[#ff80b5] to-[#9089fc] opacity-20 sm:left-[calc(50%-30rem)] sm:w-288.75\"\n            style={{\n              clipPath:\n                \"polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)\",\n            }}\n          />\n        </div>\n\n        <div className=\"mx-auto max-w-2xl\">\n          {badge && (\n            <div className=\"mb-8 flex justify-center\">\n              <div className=\"relative rounded-full px-3 py-1 text-sm leading-6 text-muted-foreground ring-1 ring-border hover:ring-border/80 transition-all\">\n                {badge}{\" \"}\n                <a href={ctaHref} className=\"font-semibold text-primary\">\n                  <span className=\"absolute inset-0\" aria-hidden=\"true\" />\n                  Read more <span aria-hidden=\"true\">&rarr;</span>\n                </a>\n              </div>\n            </div>\n          )}\n          <h1 className=\"text-4xl font-bold tracking-tight text-foreground sm:text-6xl bg-clip-text\">\n            {title}\n          </h1>\n          {subtitle && <p className=\"mt-6 text-lg leading-8 text-muted-foreground\">{subtitle}</p>}\n          <div className=\"mt-10 flex items-center justify-center gap-x-6\">\n            {ctaText && (\n              <a href={ctaHref}>\n                <CustomButton size=\"lg\" effect=\"expandIcon\">\n                  {ctaText}\n                </CustomButton>\n              </a>\n            )}\n            {secondaryCtaText && (\n              <a href={secondaryCtaHref}>\n                <CustomButton variant=\"ghost\" size=\"lg\">\n                  {secondaryCtaText} <span aria-hidden=\"true\">→</span>\n                </CustomButton>\n              </a>\n            )}\n          </div>\n        </div>\n\n        <div\n          className=\"absolute inset-x-0 top-[calc(100%-13rem)] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[calc(100%-30rem)]\"\n          aria-hidden=\"true\"\n        >\n          <div\n            className=\"relative left-[calc(50%+3rem)] aspect-1155/678 w-144.5 -translate-x-1/2 bg-linear-to-tr from-[#ff80b5] to-[#9089fc] opacity-20 sm:left-[calc(50%+36rem)] sm:w-288.75\"\n            style={{\n              clipPath:\n                \"polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)\",\n            }}\n          />\n        </div>\n      </section>\n    );\n  },\n);\n\nHeroSection.displayName = \"HeroSection\";\n\nexport { HeroSection };\n"],"names":["jsxs","jsx","React","CustomButton","cn","HeroSection","title","subtitle","ctaText","ctaHref","secondaryCtaText","secondaryCtaHref","badge","className","props","ref"],"mappings":"AAgBA,SAAA,QAAAA,GAAA,OAAAC,SAAA;AAAA,YAAAC,OAAA;AAAA,SAAA,gBAAAC,SAAA;AAAA,SAAA,MAAAC,SAAA;AAAA,MAAMC,IAAcH,EAAM;AAAA,EACxB,CACE;AAAA,IACE,OAAAI;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,kBAAAC;AAAA,IACA,kBAAAC,IAAmB;AAAA,IACnB,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MAGE,gBAAAf;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAe;AAAA,MACA,WAAWX;AAAA,QACT;AAAA,QACAS;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,MAGJ,UAAA;AAAA,QAAA,gBAAAb;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YAEZ,UAAA,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,OAAO;AAAA,kBACL,UACE;AAAA,gBAAA;AAAA,cACJ;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,QAGF,gBAAAD,EAAC,OAAA,EAAI,WAAU,qBACZ,UAAA;AAAA,UAAAY,uBACE,OAAA,EAAI,WAAU,4BACb,UAAA,gBAAAZ,EAAC,OAAA,EAAI,WAAU,kIACZ,UAAA;AAAA,YAAAY;AAAA,YAAO;AAAA,YACR,gBAAAZ,EAAC,KAAA,EAAE,MAAMS,GAAS,WAAU,8BAC1B,UAAA;AAAA,cAAA,gBAAAR,EAAC,QAAA,EAAK,WAAU,oBAAmB,eAAY,QAAO;AAAA,cAAE;AAAA,cAC9C,gBAAAA,EAAC,QAAA,EAAK,eAAY,QAAO,UAAA,IAAA,CAAM;AAAA,YAAA,EAAA,CAC3C;AAAA,UAAA,EAAA,CACF,EAAA,CACF;AAAA,UAEF,gBAAAA,EAAC,MAAA,EAAG,WAAU,8EACX,UAAAK,GACH;AAAA,UACCC,KAAY,gBAAAN,EAAC,KAAA,EAAE,WAAU,gDAAgD,UAAAM,GAAS;AAAA,UACnF,gBAAAP,EAAC,OAAA,EAAI,WAAU,kDACZ,UAAA;AAAA,YAAAQ,KACC,gBAAAP,EAAC,KAAA,EAAE,MAAMQ,GACP,UAAA,gBAAAR,EAACE,GAAA,EAAa,MAAK,MAAK,QAAO,cAC5B,UAAAK,EAAA,CACH,GACF;AAAA,YAEDE,KACC,gBAAAT,EAAC,KAAA,EAAE,MAAMU,GACP,4BAACR,GAAA,EAAa,SAAQ,SAAQ,MAAK,MAChC,UAAA;AAAA,cAAAO;AAAA,cAAiB;AAAA,cAAC,gBAAAT,EAAC,QAAA,EAAK,eAAY,QAAO,UAAA,IAAA,CAAC;AAAA,YAAA,EAAA,CAC/C,EAAA,CACF;AAAA,UAAA,EAAA,CAEJ;AAAA,QAAA,GACF;AAAA,QAEA,gBAAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YAEZ,UAAA,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,OAAO;AAAA,kBACL,UACE;AAAA,gBAAA;AAAA,cACJ;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAIR;AAEAI,EAAY,cAAc;"}
+{"version":3,"file":"hero.js","sources":["../../../src/components/marketing/hero.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { CustomButton } from \"../primitives/custom-button\";\nimport { cn } from \"@/lib/utils\";\n\ninterface HeroSectionProps extends React.HTMLAttributes<HTMLElement> {\n  title: string;\n  subtitle?: string;\n  ctaText?: string;\n  ctaHref?: string;\n  secondaryCtaText?: string;\n  secondaryCtaHref?: string;\n  badge?: string;\n}\n\nconst HeroSection = React.forwardRef<HTMLElement, HeroSectionProps>(\n  (\n    {\n      title,\n      subtitle,\n      ctaText,\n      ctaHref = \"#\",\n      secondaryCtaText,\n      secondaryCtaHref = \"#\",\n      badge,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <section\n        ref={ref}\n        className={cn(\n          \"relative flex flex-col items-center justify-center overflow-hidden px-6 py-24 text-center sm:py-32 lg:px-8\",\n          className,\n        )}\n        {...props}\n      >\n        {/* Abstract Background Decoration */}\n        <div\n          className=\"absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80\"\n          aria-hidden=\"true\"\n        >\n          <div\n            className=\"relative left-[calc(50%-11rem)] aspect-1155/678 w-144.5 -translate-x-1/2 rotate-30 bg-linear-to-tr from-[#ff80b5] to-[#9089fc] opacity-20 sm:left-[calc(50%-30rem)] sm:w-288.75\"\n            style={{\n              clipPath:\n                \"polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)\",\n            }}\n          />\n        </div>\n\n        <div className=\"mx-auto max-w-2xl\">\n          {badge && (\n            <div className=\"mb-8 flex justify-center\">\n              <div className=\"relative rounded-full px-3 py-1 text-sm leading-6 text-muted-foreground ring-1 ring-border hover:ring-border/80 transition-all\">\n                {badge}{\" \"}\n                <a href={ctaHref} className=\"font-semibold text-primary\">\n                  <span className=\"absolute inset-0\" aria-hidden=\"true\" />\n                  Read more <span aria-hidden=\"true\">&rarr;</span>\n                </a>\n              </div>\n            </div>\n          )}\n          <h1 className=\"text-4xl font-bold tracking-tight text-foreground sm:text-6xl bg-clip-text\">\n            {title}\n          </h1>\n          {subtitle && <p className=\"mt-6 text-lg leading-8 text-muted-foreground\">{subtitle}</p>}\n          <div className=\"mt-10 flex items-center justify-center gap-x-6\">\n            {ctaText && (\n              <a href={ctaHref}>\n                <CustomButton size=\"lg\" effect=\"expandIcon\">\n                  {ctaText}\n                </CustomButton>\n              </a>\n            )}\n            {secondaryCtaText && (\n              <a href={secondaryCtaHref}>\n                <CustomButton variant=\"ghost\" size=\"lg\">\n                  {secondaryCtaText} <span aria-hidden=\"true\">→</span>\n                </CustomButton>\n              </a>\n            )}\n          </div>\n        </div>\n\n        <div\n          className=\"absolute inset-x-0 top-[calc(100%-13rem)] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[calc(100%-30rem)]\"\n          aria-hidden=\"true\"\n        >\n          <div\n            className=\"relative left-[calc(50%+3rem)] aspect-1155/678 w-144.5 -translate-x-1/2 bg-linear-to-tr from-[#ff80b5] to-[#9089fc] opacity-20 sm:left-[calc(50%+36rem)] sm:w-288.75\"\n            style={{\n              clipPath:\n                \"polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)\",\n            }}\n          />\n        </div>\n      </section>\n    );\n  },\n);\n\nHeroSection.displayName = \"HeroSection\";\n\nexport { HeroSection };\n"],"names":["HeroSection"],"mappings":";AAgBA;AAAA;AAAA;AAAA;AAAA;AAA0B;AAEtB;AACE;AACA;AACA;AACU;AACV;AACmB;AACnB;AACA;AACG;AAKH;AAAC;AAAA;AACC;AACW;AACT;AACA;AAAA;AAEE;AAGJ;AAAA;AAAC;AAAA;AACW;AACE;AAEZ;AAAC;AAAA;AACW;AACH;AAEH;AAAA;AACJ;AAAA;AACF;AAAA;AAIC;AAGM;AAAA;AAAO;AAEN;AAAsD;AAAE;AACf;AAC3C;AAEJ;AAIF;AACmF;AAEhF;AAKC;AAKK;AAAA;AAAiB;AAA2B;AAEjD;AAEJ;AACF;AAEA;AAAC;AAAA;AACW;AACE;AAEZ;AAAC;AAAA;AACW;AACH;AAEH;AAAA;AACJ;AAAA;AACF;AAAA;AACF;AAAA;AAIR;AAEAA;;;;"}

package/dist/components/marketing/index.d.ts

@@ -0,0 +1,6 @@
+export * from './hero';
+export * from './social-proof';
+export * from './value-props';
+export type * from './hero';
+export type * from './social-proof';
+export type * from './value-props';

package/dist/components/marketing/index.js

@@ -0,0 +1,9 @@
+import { HeroSection as e } from "./hero.js";
+import { SocialProof as p } from "./social-proof.js";
+import { ValueProps as m } from "./value-props.js";
+export {
+  e as HeroSection,
+  p as SocialProof,
+  m as ValueProps
+};
+//# sourceMappingURL=index.js.map

package/dist/components/marketing/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/components/marketing/social-proof.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as e, jsxs as m } from "react/jsx-runtime";
 import * as i from "react";
 import { cn as c } from "../../lib/utils.js";

package/dist/components/marketing/social-proof.js.map

@@ -1 +1 @@
-{"version":3,"file":"social-proof.js","sources":["../../../src/components/marketing/social-proof.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\ninterface SocialProofProps extends React.HTMLAttributes<HTMLElement> {\n  logos: { name: string; src: string }[];\n  title?: string;\n}\n\nconst SocialProof = React.forwardRef<HTMLElement, SocialProofProps>(\n  ({ logos, title = \"Trusted by the world's most innovative teams\", className, ...props }, ref) => {\n    return (\n      <section ref={ref} className={cn(\"py-24 sm:py-32 bg-secondary/30\", className)} {...props}>\n        <div className=\"mx-auto max-w-7xl px-6 lg:px-8\">\n          <h2 className=\"text-center text-lg font-semibold leading-8 text-muted-foreground\">\n            {title}\n          </h2>\n          <div className=\"mx-auto mt-10 grid max-w-lg grid-cols-4 items-center gap-x-8 gap-y-10 sm:max-w-xl sm:grid-cols-6 sm:gap-x-10 lg:mx-0 lg:max-w-none lg:grid-cols-5\">\n            {logos.map((logo) => (\n              <div\n                key={logo.name}\n                className=\"flex items-center justify-center grayscale opacity-50 hover:grayscale-0 hover:opacity-100 transition-all duration-300\"\n              >\n                <span className=\"text-xl font-bold italic text-muted-foreground\">{logo.name}</span>\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n    );\n  },\n);\n\nSocialProof.displayName = \"SocialProof\";\n\nexport { SocialProof };\n"],"names":["jsx","jsxs","React","cn","SocialProof","logos","title","className","props","ref","logo"],"mappings":"AAUA,SAAA,OAAAA,GAAA,QAAAC,SAAA;AAAA,YAAAC,OAAA;AAAA,SAAA,MAAAC,SAAA;AAAA,MAAMC,IAAcF,EAAM;AAAA,EACxB,CAAC,EAAE,OAAAG,GAAO,OAAAC,IAAQ,gDAAgD,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAErF,gBAAAT,EAAC,WAAA,EAAQ,KAAAS,GAAU,WAAWN,EAAG,kCAAkCI,CAAS,GAAI,GAAGC,GACjF,UAAA,gBAAAP,EAAC,OAAA,EAAI,WAAU,kCACb,UAAA;AAAA,IAAA,gBAAAD,EAAC,MAAA,EAAG,WAAU,qEACX,UAAAM,GACH;AAAA,sBACC,OAAA,EAAI,WAAU,qJACZ,UAAAD,EAAM,IAAI,CAACK,MACV,gBAAAV;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAU;AAAA,QAEV,UAAA,gBAAAA,EAAC,QAAA,EAAK,WAAU,kDAAkD,YAAK,KAAA,CAAK;AAAA,MAAA;AAAA,MAHvEU,EAAK;AAAA,IAAA,CAKb,EAAA,CACH;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAGN;AAEAN,EAAY,cAAc;"}
+{"version":3,"file":"social-proof.js","sources":["../../../src/components/marketing/social-proof.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\ninterface SocialProofProps extends React.HTMLAttributes<HTMLElement> {\n  logos: { name: string; src: string }[];\n  title?: string;\n}\n\nconst SocialProof = React.forwardRef<HTMLElement, SocialProofProps>(\n  ({ logos, title = \"Trusted by the world's most innovative teams\", className, ...props }, ref) => {\n    return (\n      <section ref={ref} className={cn(\"py-24 sm:py-32 bg-secondary/30\", className)} {...props}>\n        <div className=\"mx-auto max-w-7xl px-6 lg:px-8\">\n          <h2 className=\"text-center text-lg font-semibold leading-8 text-muted-foreground\">\n            {title}\n          </h2>\n          <div className=\"mx-auto mt-10 grid max-w-lg grid-cols-4 items-center gap-x-8 gap-y-10 sm:max-w-xl sm:grid-cols-6 sm:gap-x-10 lg:mx-0 lg:max-w-none lg:grid-cols-5\">\n            {logos.map((logo) => (\n              <div\n                key={logo.name}\n                className=\"flex items-center justify-center grayscale opacity-50 hover:grayscale-0 hover:opacity-100 transition-all duration-300\"\n              >\n                <span className=\"text-xl font-bold italic text-muted-foreground\">{logo.name}</span>\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n    );\n  },\n);\n\nSocialProof.displayName = \"SocialProof\";\n\nexport { SocialProof };\n"],"names":["SocialProof"],"mappings":";AAUA;AAAA;AAAA;AAAA;AAA0B;AAKhB;AAEA;AAGI;AAAC;AAAA;AAEW;AAEkE;AAAA;AAHlE;AAMhB;AAKV;AAEAA;;;;"}

package/dist/components/marketing/value-props.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as e, jsxs as l } from "react/jsx-runtime";
 import * as x from "react";
 import { cn as c } from "../../lib/utils.js";

package/dist/components/marketing/value-props.js.map

@@ -1 +1 @@
-{"version":3,"file":"value-props.js","sources":["../../../src/components/marketing/value-props.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\nimport { CheckIcon } from \"lucide-react\";\n\ninterface Feature {\n  name: string;\n  description: string;\n  icon?: React.ElementType;\n}\n\ninterface ValuePropsProps extends React.HTMLAttributes<HTMLElement> {\n  features: Feature[];\n  title: string;\n  subtitle?: string;\n  badge?: string;\n}\n\nconst ValueProps = React.forwardRef<HTMLElement, ValuePropsProps>(\n  ({ features, title, subtitle, badge, className, ...props }, ref) => {\n    return (\n      <section ref={ref} className={cn(\"py-24 sm:py-32\", className)} {...props}>\n        <div className=\"mx-auto max-w-7xl px-6 lg:px-8\">\n          <div className=\"mx-auto max-w-2xl lg:text-center\">\n            {badge && <h2 className=\"text-base font-semibold leading-7 text-primary\">{badge}</h2>}\n            <p className=\"mt-2 text-3xl font-bold tracking-tight text-foreground sm:text-4xl\">\n              {title}\n            </p>\n            {subtitle && <p className=\"mt-6 text-lg leading-8 text-muted-foreground\">{subtitle}</p>}\n          </div>\n          <div className=\"mx-auto mt-16 max-w-2xl sm:mt-20 lg:mt-24 lg:max-w-none\">\n            <dl className=\"grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3\">\n              {features.map((feature) => (\n                <div key={feature.name} className=\"flex flex-col\">\n                  <dt className=\"flex items-center gap-x-3 text-base font-semibold leading-7 text-foreground\">\n                    {feature.icon ? (\n                      <feature.icon className=\"size-5 flex-none text-primary\" aria-hidden=\"true\" />\n                    ) : (\n                      <CheckIcon className=\"size-5 flex-none text-primary\" aria-hidden=\"true\" />\n                    )}\n                    {feature.name}\n                  </dt>\n                  <dd className=\"mt-4 flex flex-auto flex-col text-base leading-7 text-muted-foreground\">\n                    <p className=\"flex-auto\">{feature.description}</p>\n                  </dd>\n                </div>\n              ))}\n            </dl>\n          </div>\n        </div>\n      </section>\n    );\n  },\n);\n\nValueProps.displayName = \"ValueProps\";\n\nexport { ValueProps };\n"],"names":["jsx","jsxs","React","cn","CheckIcon","ValueProps","features","title","subtitle","badge","className","props","ref","feature"],"mappings":"AAmBA,SAAA,OAAAA,GAAA,QAAAC,SAAA;AAAA,YAAAC,OAAA;AAAA,SAAA,MAAAC,SAAA;AAAA,SAAA,aAAAC,SAAA;AAAA,MAAMC,IAAaH,EAAM;AAAA,EACvB,CAAC,EAAE,UAAAI,GAAU,OAAAC,GAAO,UAAAC,GAAU,OAAAC,GAAO,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAExD,gBAAAZ,EAAC,WAAA,EAAQ,KAAAY,GAAU,WAAWT,EAAG,kBAAkBO,CAAS,GAAI,GAAGC,GACjE,UAAA,gBAAAV,EAAC,OAAA,EAAI,WAAU,kCACb,UAAA;AAAA,IAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,oCACZ,UAAA;AAAA,MAAAQ,KAAS,gBAAAT,EAAC,MAAA,EAAG,WAAU,kDAAkD,UAAAS,GAAM;AAAA,MAChF,gBAAAT,EAAC,KAAA,EAAE,WAAU,sEACV,UAAAO,GACH;AAAA,MACCC,KAAY,gBAAAR,EAAC,KAAA,EAAE,WAAU,gDAAgD,UAAAQ,EAAA,CAAS;AAAA,IAAA,GACrF;AAAA,IACA,gBAAAR,EAAC,OAAA,EAAI,WAAU,2DACb,4BAAC,MAAA,EAAG,WAAU,2EACX,UAAAM,EAAS,IAAI,CAACO,MACb,gBAAAZ,EAAC,OAAA,EAAuB,WAAU,iBAChC,UAAA;AAAA,MAAA,gBAAAA,EAAC,MAAA,EAAG,WAAU,+EACX,UAAA;AAAA,QAAAY,EAAQ,OACP,gBAAAb,EAACa,EAAQ,MAAR,EAAa,WAAU,iCAAgC,eAAY,OAAA,CAAO,IAE3E,gBAAAb,EAACI,GAAA,EAAU,WAAU,iCAAgC,eAAY,QAAO;AAAA,QAEzES,EAAQ;AAAA,MAAA,GACX;AAAA,MACA,gBAAAb,EAAC,MAAA,EAAG,WAAU,0EACZ,UAAA,gBAAAA,EAAC,OAAE,WAAU,aAAa,UAAAa,EAAQ,YAAA,CAAY,EAAA,CAChD;AAAA,IAAA,EAAA,GAXQA,EAAQ,IAYlB,CACD,EAAA,CACH,EAAA,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAGN;AAEAR,EAAW,cAAc;"}
+{"version":3,"file":"value-props.js","sources":["../../../src/components/marketing/value-props.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\nimport { CheckIcon } from \"lucide-react\";\n\ninterface Feature {\n  name: string;\n  description: string;\n  icon?: React.ElementType;\n}\n\ninterface ValuePropsProps extends React.HTMLAttributes<HTMLElement> {\n  features: Feature[];\n  title: string;\n  subtitle?: string;\n  badge?: string;\n}\n\nconst ValueProps = React.forwardRef<HTMLElement, ValuePropsProps>(\n  ({ features, title, subtitle, badge, className, ...props }, ref) => {\n    return (\n      <section ref={ref} className={cn(\"py-24 sm:py-32\", className)} {...props}>\n        <div className=\"mx-auto max-w-7xl px-6 lg:px-8\">\n          <div className=\"mx-auto max-w-2xl lg:text-center\">\n            {badge && <h2 className=\"text-base font-semibold leading-7 text-primary\">{badge}</h2>}\n            <p className=\"mt-2 text-3xl font-bold tracking-tight text-foreground sm:text-4xl\">\n              {title}\n            </p>\n            {subtitle && <p className=\"mt-6 text-lg leading-8 text-muted-foreground\">{subtitle}</p>}\n          </div>\n          <div className=\"mx-auto mt-16 max-w-2xl sm:mt-20 lg:mt-24 lg:max-w-none\">\n            <dl className=\"grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3\">\n              {features.map((feature) => (\n                <div key={feature.name} className=\"flex flex-col\">\n                  <dt className=\"flex items-center gap-x-3 text-base font-semibold leading-7 text-foreground\">\n                    {feature.icon ? (\n                      <feature.icon className=\"size-5 flex-none text-primary\" aria-hidden=\"true\" />\n                    ) : (\n                      <CheckIcon className=\"size-5 flex-none text-primary\" aria-hidden=\"true\" />\n                    )}\n                    {feature.name}\n                  </dt>\n                  <dd className=\"mt-4 flex flex-auto flex-col text-base leading-7 text-muted-foreground\">\n                    <p className=\"flex-auto\">{feature.description}</p>\n                  </dd>\n                </div>\n              ))}\n            </dl>\n          </div>\n        </div>\n      </section>\n    );\n  },\n);\n\nValueProps.displayName = \"ValueProps\";\n\nexport { ValueProps };\n"],"names":["ValueProps"],"mappings":";AAmBA;AAAA;AAAA;AAAA;AAAA;AAAyB;AAKf;AACG;AAA+E;AAGhF;AACmF;AACrF;AAKQ;AACG;AAGyE;AAEjE;AACX;AAGA;AAIR;AAKV;AAEAA;;;;"}