@psnext/design-system 1.1.0 → 1.2.0

package/dist/patterns/DataTable/index.d.cts

@@ -0,0 +1,43 @@
+import * as react_jsx_runtime188 from "react/jsx-runtime";
+import { Column, ColumnDef } from "@tanstack/react-table";
+
+//#region src/patterns/DataTable/DataTable.d.ts
+type DataTableProps<TData, TValue> = {
+  /** TanStack Table column definitions describing each column's header and cell. */
+  columns: ColumnDef<TData, TValue>[];
+  /** The row objects to render in the table body. */
+  data: TData[];
+  /** Zebra-stripe the rows (default true). */
+  striped?: boolean;
+  /** Client-side pagination + page size (default true, 10). */
+  enablePagination?: boolean;
+  /** Rows per page when pagination is enabled (default 10). */
+  pageSize?: number;
+};
+/**
+ * TanStack-Table-backed data table with sorting, row selection, and optional
+ * client-side pagination, rendered through the Table primitives.
+ */
+declare function DataTable<TData, TValue>({
+  columns,
+  data,
+  striped,
+  enablePagination,
+  pageSize
+}: DataTableProps<TData, TValue>): react_jsx_runtime188.JSX.Element;
+/** Sortable column header — drop into a column's `header` to get click-to-sort. */
+declare function DataTableColumnHeader<TData, TValue>({
+  column,
+  title,
+  className
+}: {
+  /** The TanStack Table column instance this header controls. */
+  column: Column<TData, TValue>;
+  /** Visible label for the column. */
+  title: string;
+  /** Optional class applied to the header button (or span when unsortable). */
+  className?: string;
+}): react_jsx_runtime188.JSX.Element;
+//#endregion
+export { type ColumnDef, DataTable, DataTableColumnHeader };
+//# sourceMappingURL=index.d.cts.map

package/dist/patterns/DataTable/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","names":[],"sources":["../../../src/patterns/DataTable/DataTable.tsx"],"mappings":";;;;KAoBK;;WAEM,UAAU,OAAO;EAFvB;EAAc,IAAA,EAIX,KAJW,EAAA;;SAES,CAAA,EAAA,OAAA;;kBAEpB,CAAA,EAAA,OAAA;EAAK;EAaJ,QAAA,CAAA,EAAA,MAAS;CAAA;;;;;iBAAT,SAKP,CAAA,KAAA,EAAA,MAAA,CAAA,CAAA;EAAA,OAAA;EAAA,IAAA;EAAA,OAAA;EAAA,gBAAA;EAAA;AAAA,CAAA,EACC,cADD,CACgB,KADhB,EACuB,MADvB,CAAA,CAAA,EAC8B,oBAAA,CAAA,GAAA,CAAA,OAD9B;;iBA6FO,qBA5FgB,CAAA,KAAA,EAAA,MAAA,CAAA,CAAA;EAAA,MAAA;EAAA,KAAA;EAAA;CAAA,EAAA;;QAAO,EAkGtB,MAlGsB,CAkGf,KAlGe,EAkGR,MAlGQ,CAAA;EAAA;EA4FvB,KAAA,EAAA,MAAA;EAAqB;WAC5B,CAAA,EAAA,MAAA;IAUD,oBAAA,CAAA,GAAA,CAAA,OATC"}

package/dist/patterns/DataTable/index.d.ts

@@ -0,0 +1,43 @@
+import * as react_jsx_runtime306 from "react/jsx-runtime";
+import { Column, ColumnDef } from "@tanstack/react-table";
+
+//#region src/patterns/DataTable/DataTable.d.ts
+type DataTableProps<TData, TValue> = {
+  /** TanStack Table column definitions describing each column's header and cell. */
+  columns: ColumnDef<TData, TValue>[];
+  /** The row objects to render in the table body. */
+  data: TData[];
+  /** Zebra-stripe the rows (default true). */
+  striped?: boolean;
+  /** Client-side pagination + page size (default true, 10). */
+  enablePagination?: boolean;
+  /** Rows per page when pagination is enabled (default 10). */
+  pageSize?: number;
+};
+/**
+ * TanStack-Table-backed data table with sorting, row selection, and optional
+ * client-side pagination, rendered through the Table primitives.
+ */
+declare function DataTable<TData, TValue>({
+  columns,
+  data,
+  striped,
+  enablePagination,
+  pageSize
+}: DataTableProps<TData, TValue>): react_jsx_runtime306.JSX.Element;
+/** Sortable column header — drop into a column's `header` to get click-to-sort. */
+declare function DataTableColumnHeader<TData, TValue>({
+  column,
+  title,
+  className
+}: {
+  /** The TanStack Table column instance this header controls. */
+  column: Column<TData, TValue>;
+  /** Visible label for the column. */
+  title: string;
+  /** Optional class applied to the header button (or span when unsortable). */
+  className?: string;
+}): react_jsx_runtime306.JSX.Element;
+//#endregion
+export { type ColumnDef, DataTable, DataTableColumnHeader };
+//# sourceMappingURL=index.d.ts.map

package/dist/patterns/DataTable/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/patterns/DataTable/DataTable.tsx"],"mappings":";;;;KAoBK;;WAEM,UAAU,OAAO;EAFvB;EAAc,IAAA,EAIX,KAJW,EAAA;;SAES,CAAA,EAAA,OAAA;;kBAEpB,CAAA,EAAA,OAAA;EAAK;EAaJ,QAAA,CAAA,EAAA,MAAS;CAAA;;;;;iBAAT,SAKP,CAAA,KAAA,EAAA,MAAA,CAAA,CAAA;EAAA,OAAA;EAAA,IAAA;EAAA,OAAA;EAAA,gBAAA;EAAA;AAAA,CAAA,EACC,cADD,CACgB,KADhB,EACuB,MADvB,CAAA,CAAA,EAC8B,oBAAA,CAAA,GAAA,CAAA,OAD9B;;iBA6FO,qBA5FgB,CAAA,KAAA,EAAA,MAAA,CAAA,CAAA;EAAA,MAAA;EAAA,KAAA;EAAA;CAAA,EAAA;;QAAO,EAkGtB,MAlGsB,CAkGf,KAlGe,EAkGR,MAlGQ,CAAA;EAAA;EA4FvB,KAAA,EAAA,MAAA;EAAqB;WAC5B,CAAA,EAAA,MAAA;IAUD,oBAAA,CAAA,GAAA,CAAA,OATC"}

package/dist/patterns/DataTable/index.js

@@ -0,0 +1,110 @@
+import { t as cn } from "../../cn.js";
+import { Button } from "../../primitives/Button/index.js";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../../primitives/Table/index.js";
+import * as React from "react";
+import { ArrowDownIcon, ArrowUpIcon, ChevronsUpDownIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { flexRender, getCoreRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
+//#region src/patterns/DataTable/DataTable.tsx
+/**
+* TanStack-Table-backed data table with sorting, row selection, and optional
+* client-side pagination, rendered through the Table primitives.
+*/
+function DataTable({ columns, data, striped = true, enablePagination = true, pageSize = 10 }) {
+	const [sorting, setSorting] = React.useState([]);
+	const [rowSelection, setRowSelection] = React.useState({});
+	const table = useReactTable({
+		data,
+		columns,
+		state: {
+			sorting,
+			rowSelection
+		},
+		onSortingChange: setSorting,
+		onRowSelectionChange: setRowSelection,
+		getCoreRowModel: getCoreRowModel(),
+		getSortedRowModel: getSortedRowModel(),
+		getPaginationRowModel: enablePagination ? getPaginationRowModel() : void 0,
+		initialState: { pagination: { pageSize } }
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "data-table",
+		className: "space-y-4",
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "overflow-hidden rounded-md border",
+			children: /* @__PURE__ */ jsxs(Table, {
+				striped,
+				children: [/* @__PURE__ */ jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(TableRow, { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx(TableHead, {
+					colSpan: header.colSpan,
+					children: header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())
+				}, header.id)) }, headerGroup.id)) }), /* @__PURE__ */ jsx(TableBody, { children: table.getRowModel().rows.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx(TableRow, {
+					"data-state": row.getIsSelected() ? "selected" : void 0,
+					children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))
+				}, row.id)) : /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, {
+					colSpan: columns.length,
+					className: "h-24 text-center text-muted-foreground",
+					children: "No results."
+				}) }) })]
+			})
+		}), enablePagination ? /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center justify-between gap-4",
+			children: [/* @__PURE__ */ jsxs("p", {
+				className: "text-sm text-muted-foreground",
+				"data-slot": "data-table-selection",
+				children: [
+					table.getFilteredSelectedRowModel().rows.length,
+					" of",
+					" ",
+					table.getFilteredRowModel().rows.length,
+					" row(s) selected."
+				]
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-2",
+				children: [
+					/* @__PURE__ */ jsxs("span", {
+						className: "text-sm text-muted-foreground",
+						children: [
+							"Page ",
+							table.getState().pagination.pageIndex + 1,
+							" of ",
+							table.getPageCount() || 1
+						]
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						variant: "outline",
+						size: "sm",
+						onClick: () => table.previousPage(),
+						disabled: !table.getCanPreviousPage(),
+						children: "Previous"
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						variant: "outline",
+						size: "sm",
+						onClick: () => table.nextPage(),
+						disabled: !table.getCanNextPage(),
+						children: "Next"
+					})
+				]
+			})]
+		}) : null]
+	});
+}
+/** Sortable column header — drop into a column's `header` to get click-to-sort. */
+function DataTableColumnHeader({ column, title, className }) {
+	if (!column.getCanSort()) return /* @__PURE__ */ jsx("span", {
+		className,
+		children: title
+	});
+	const sorted = column.getIsSorted();
+	return /* @__PURE__ */ jsxs(Button, {
+		variant: "ghost",
+		size: "sm",
+		className: cn("-ml-2 h-8", className),
+		onClick: () => column.toggleSorting(sorted === "asc"),
+		children: [title, sorted === "asc" ? /* @__PURE__ */ jsx(ArrowUpIcon, {}) : sorted === "desc" ? /* @__PURE__ */ jsx(ArrowDownIcon, {}) : /* @__PURE__ */ jsx(ChevronsUpDownIcon, {})]
+	});
+}
+//#endregion
+export { DataTable, DataTableColumnHeader };
+
+//# sourceMappingURL=index.js.map

package/dist/patterns/DataTable/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/patterns/DataTable/DataTable.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type Column,\n  type ColumnDef,\n  type RowSelectionState,\n  type SortingState,\n  flexRender,\n  getCoreRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from \"@tanstack/react-table\";\nimport { ArrowDownIcon, ArrowUpIcon, ChevronsUpDownIcon } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { Button } from \"@/primitives/Button\";\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from \"@/primitives/Table\";\nimport { cn } from \"@/utils\";\n\ntype DataTableProps<TData, TValue> = {\n  /** TanStack Table column definitions describing each column's header and cell. */\n  columns: ColumnDef<TData, TValue>[];\n  /** The row objects to render in the table body. */\n  data: TData[];\n  /** Zebra-stripe the rows (default true). */\n  striped?: boolean;\n  /** Client-side pagination + page size (default true, 10). */\n  enablePagination?: boolean;\n  /** Rows per page when pagination is enabled (default 10). */\n  pageSize?: number;\n};\n\n/**\n * TanStack-Table-backed data table with sorting, row selection, and optional\n * client-side pagination, rendered through the Table primitives.\n */\nfunction DataTable<TData, TValue>({\n  columns,\n  data,\n  striped = true,\n  enablePagination = true,\n  pageSize = 10,\n}: DataTableProps<TData, TValue>) {\n  const [sorting, setSorting] = React.useState<SortingState>([]);\n  const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({});\n\n  const table = useReactTable({\n    data,\n    columns,\n    state: { sorting, rowSelection },\n    onSortingChange: setSorting,\n    onRowSelectionChange: setRowSelection,\n    getCoreRowModel: getCoreRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    getPaginationRowModel: enablePagination ? getPaginationRowModel() : undefined,\n    initialState: { pagination: { pageSize } },\n  });\n\n  return (\n    <div data-slot=\"data-table\" className=\"space-y-4\">\n      <div className=\"overflow-hidden rounded-md border\">\n        <Table striped={striped}>\n          <TableHeader>\n            {table.getHeaderGroups().map((headerGroup) => (\n              <TableRow key={headerGroup.id}>\n                {headerGroup.headers.map((header) => (\n                  <TableHead key={header.id} colSpan={header.colSpan}>\n                    {header.isPlaceholder\n                      ? null\n                      : flexRender(header.column.columnDef.header, header.getContext())}\n                  </TableHead>\n                ))}\n              </TableRow>\n            ))}\n          </TableHeader>\n          <TableBody>\n            {table.getRowModel().rows.length ? (\n              table.getRowModel().rows.map((row) => (\n                <TableRow key={row.id} data-state={row.getIsSelected() ? \"selected\" : undefined}>\n                  {row.getVisibleCells().map((cell) => (\n                    <TableCell key={cell.id}>\n                      {flexRender(cell.column.columnDef.cell, cell.getContext())}\n                    </TableCell>\n                  ))}\n                </TableRow>\n              ))\n            ) : (\n              <TableRow>\n                <TableCell\n                  colSpan={columns.length}\n                  className=\"h-24 text-center text-muted-foreground\"\n                >\n                  No results.\n                </TableCell>\n              </TableRow>\n            )}\n          </TableBody>\n        </Table>\n      </div>\n\n      {enablePagination ? (\n        <div className=\"flex items-center justify-between gap-4\">\n          <p className=\"text-sm text-muted-foreground\" data-slot=\"data-table-selection\">\n            {table.getFilteredSelectedRowModel().rows.length} of{\" \"}\n            {table.getFilteredRowModel().rows.length} row(s) selected.\n          </p>\n          <div className=\"flex items-center gap-2\">\n            <span className=\"text-sm text-muted-foreground\">\n              Page {table.getState().pagination.pageIndex + 1} of {table.getPageCount() || 1}\n            </span>\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => table.previousPage()}\n              disabled={!table.getCanPreviousPage()}\n            >\n              Previous\n            </Button>\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => table.nextPage()}\n              disabled={!table.getCanNextPage()}\n            >\n              Next\n            </Button>\n          </div>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\n/** Sortable column header — drop into a column's `header` to get click-to-sort. */\nfunction DataTableColumnHeader<TData, TValue>({\n  column,\n  title,\n  className,\n}: {\n  /** The TanStack Table column instance this header controls. */\n  column: Column<TData, TValue>;\n  /** Visible label for the column. */\n  title: string;\n  /** Optional class applied to the header button (or span when unsortable). */\n  className?: string;\n}) {\n  if (!column.getCanSort()) {\n    return <span className={className}>{title}</span>;\n  }\n\n  const sorted = column.getIsSorted();\n\n  return (\n    <Button\n      variant=\"ghost\"\n      size=\"sm\"\n      className={cn(\"-ml-2 h-8\", className)}\n      onClick={() => column.toggleSorting(sorted === \"asc\")}\n    >\n      {title}\n      {sorted === \"asc\" ? (\n        <ArrowUpIcon />\n      ) : sorted === \"desc\" ? (\n        <ArrowDownIcon />\n      ) : (\n        <ChevronsUpDownIcon />\n      )}\n    </Button>\n  );\n}\n\nexport { DataTable, DataTableColumnHeader };\nexport type { ColumnDef };\n"],"mappings":";;;;;;;;;;;;AAqCA,SAAS,UAAyB,EAChC,SACA,MACA,UAAU,MACV,mBAAmB,MACnB,WAAW,MACqB;CAChC,MAAM,CAAC,SAAS,cAAc,MAAM,SAAuB,CAAC,CAAC;CAC7D,MAAM,CAAC,cAAc,mBAAmB,MAAM,SAA4B,CAAC,CAAC;CAE5E,MAAM,QAAQ,cAAc;EAC1B;EACA;EACA,OAAO;GAAE;GAAS;EAAa;EAC/B,iBAAiB;EACjB,sBAAsB;EACtB,iBAAiB,gBAAgB;EACjC,mBAAmB,kBAAkB;EACrC,uBAAuB,mBAAmB,sBAAsB,IAAI,KAAA;EACpE,cAAc,EAAE,YAAY,EAAE,SAAS,EAAE;CAC3C,CAAC;CAED,OACE,qBAAC,OAAD;EAAK,aAAU;EAAa,WAAU;YAAtC,CACE,oBAAC,OAAD;GAAK,WAAU;aACb,qBAAC,OAAD;IAAgB;cAAhB,CACE,oBAAC,aAAD,EAAA,UACG,MAAM,gBAAgB,EAAE,KAAK,gBAC5B,oBAAC,UAAD,EAAA,UACG,YAAY,QAAQ,KAAK,WACxB,oBAAC,WAAD;KAA2B,SAAS,OAAO;eACxC,OAAO,gBACJ,OACA,WAAW,OAAO,OAAO,UAAU,QAAQ,OAAO,WAAW,CAAC;IACzD,GAJK,OAAO,EAIZ,CACZ,EACO,GARK,YAAY,EAQjB,CACX,EACU,CAAA,GACb,oBAAC,WAAD,EAAA,UACG,MAAM,YAAY,EAAE,KAAK,SACxB,MAAM,YAAY,EAAE,KAAK,KAAK,QAC5B,oBAAC,UAAD;KAAuB,cAAY,IAAI,cAAc,IAAI,aAAa,KAAA;eACnE,IAAI,gBAAgB,EAAE,KAAK,SAC1B,oBAAC,WAAD,EAAA,UACG,WAAW,KAAK,OAAO,UAAU,MAAM,KAAK,WAAW,CAAC,EAChD,GAFK,KAAK,EAEV,CACZ;IACO,GANK,IAAI,EAMT,CACX,IAED,oBAAC,UAAD,EAAA,UACE,oBAAC,WAAD;KACE,SAAS,QAAQ;KACjB,WAAU;eACX;IAEU,CAAA,EACH,CAAA,EAEH,CAAA,CACN;;EACJ,CAAA,GAEJ,mBACC,qBAAC,OAAD;GAAK,WAAU;aAAf,CACE,qBAAC,KAAD;IAAG,WAAU;IAAgC,aAAU;cAAvD;KACG,MAAM,4BAA4B,EAAE,KAAK;KAAO;KAAI;KACpD,MAAM,oBAAoB,EAAE,KAAK;KAAO;IACxC;OACH,qBAAC,OAAD;IAAK,WAAU;cAAf;KACE,qBAAC,QAAD;MAAM,WAAU;gBAAhB;OAAgD;OACxC,MAAM,SAAS,EAAE,WAAW,YAAY;OAAE;OAAK,MAAM,aAAa,KAAK;MACzE;;KACN,oBAAC,QAAD;MACE,SAAQ;MACR,MAAK;MACL,eAAe,MAAM,aAAa;MAClC,UAAU,CAAC,MAAM,mBAAmB;gBACrC;KAEO,CAAA;KACR,oBAAC,QAAD;MACE,SAAQ;MACR,MAAK;MACL,eAAe,MAAM,SAAS;MAC9B,UAAU,CAAC,MAAM,eAAe;gBACjC;KAEO,CAAA;IACL;KACF;OACH,IACD;;AAET;;AAGA,SAAS,sBAAqC,EAC5C,QACA,OACA,aAQC;CACD,IAAI,CAAC,OAAO,WAAW,GACrB,OAAO,oBAAC,QAAD;EAAiB;YAAY;CAAY,CAAA;CAGlD,MAAM,SAAS,OAAO,YAAY;CAElC,OACE,qBAAC,QAAD;EACE,SAAQ;EACR,MAAK;EACL,WAAW,GAAG,aAAa,SAAS;EACpC,eAAe,OAAO,cAAc,WAAW,KAAK;YAJtD,CAMG,OACA,WAAW,QACV,oBAAC,aAAD,CAAc,CAAA,IACZ,WAAW,SACb,oBAAC,eAAD,CAAgB,CAAA,IAEhB,oBAAC,oBAAD,CAAqB,CAAA,CAEjB;;AAEZ"}

package/dist/patterns/Footer/index.cjs

@@ -0,0 +1,76 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_cn = require("../../cn.cjs");
+const require_primitives_Text_index = require("../../primitives/Text/index.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/patterns/Footer/Footer.tsx
+const footerBackgrounds = {
+	none: "",
+	muted: "bg-muted",
+	glass: "bg-[var(--glass-light)] backdrop-blur-[var(--glass-blur)]"
+};
+/** App chrome shown at the bottom of a page: a responsive three-region row (start / center / end). */
+function Footer({ className, bordered = false, background = "none", ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("footer", {
+		"data-slot": "footer",
+		"data-background": background,
+		className: require_cn.cn("grid w-full grid-cols-1 gap-3 px-4 py-3 text-center md:grid-cols-3 md:items-center md:px-6", "text-[length:var(--paragraph-mini-font-size)] leading-[var(--paragraph-mini-line-height)]", footerBackgrounds[background], bordered && "border-t border-border", className),
+		...props
+	});
+}
+/** Leading region — left-aligned on md+ (e.g. an app version). */
+function FooterStart({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "footer-start",
+		className: require_cn.cn("flex items-center justify-center gap-2 md:justify-self-start md:text-left", className),
+		...props
+	});
+}
+/** Centre region — always centred (e.g. a "Powered by" lockup). */
+function FooterCenter({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "footer-center",
+		className: require_cn.cn("flex items-center justify-center gap-2 md:justify-self-center", className),
+		...props
+	});
+}
+/** Trailing region — right-aligned on md+ (e.g. legal links). Wraps on small screens. */
+function FooterEnd({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "footer-end",
+		className: require_cn.cn("flex flex-wrap items-center justify-center gap-2 md:justify-end md:justify-self-end md:text-right", className),
+		...props
+	});
+}
+/** "Powered by" lockup — the label plus a slot for the brand mark (a <Logo />). */
+function FooterPoweredBy({ className, label = "Powered by", children, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		"data-slot": "footer-powered-by",
+		className: require_cn.cn("flex items-center gap-2", className),
+		...props,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives_Text_index.Text, {
+			as: "span",
+			size: "small",
+			variant: "muted",
+			children: label
+		}), children]
+	});
+}
+/** Visual divider between trailing links. */
+function FooterSeparator({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		"data-slot": "footer-separator",
+		"aria-hidden": "true",
+		className: require_cn.cn("select-none text-border", className),
+		...props,
+		children: "|"
+	});
+}
+//#endregion
+exports.Footer = Footer;
+exports.FooterCenter = FooterCenter;
+exports.FooterEnd = FooterEnd;
+exports.FooterPoweredBy = FooterPoweredBy;
+exports.FooterSeparator = FooterSeparator;
+exports.FooterStart = FooterStart;
+
+//# sourceMappingURL=index.cjs.map

package/dist/patterns/Footer/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["cn","Text"],"sources":["../../../src/patterns/Footer/Footer.tsx"],"sourcesContent":["import type * as React from \"react\";\n\nimport { Text } from \"@/primitives/Text\";\nimport { cn } from \"@/utils\";\n\n// Footer — app chrome shown at the bottom of a page. A responsive three-region\n// row: the regions stack centered on mobile and spread to start / center / end\n// on md+ (a grid, so the centre region stays centred regardless of the side\n// widths). Compose content from Text / Link / Logo; the helpers below cover the\n// common pieces (a \"Powered by\" lockup and a link separator).\n//\n//   <Footer>\n//     <FooterStart><Text size=\"mini\" variant=\"muted\">v2.6.0</Text></FooterStart>\n//     <FooterCenter>\n//       <FooterPoweredBy><Logo brand=\"slingshot\" variant=\"icon\" className=\"size-5\" /></FooterPoweredBy>\n//     </FooterCenter>\n//     <FooterEnd>\n//       <Link href=\"/tnc\" underline=\"hover\">T&C</Link>\n//       <FooterSeparator />\n//       <Link href=\"/privacy\" underline=\"hover\">Privacy</Link>\n//     </FooterEnd>\n//   </Footer>\n\n// Surface fills. `glass` is a translucent, backdrop-blurred panel (same --glass-*\n// tokens as Card/Container) — reads over a textured page background.\nconst footerBackgrounds = {\n  none: \"\",\n  muted: \"bg-muted\",\n  glass: \"bg-[var(--glass-light)] backdrop-blur-[var(--glass-blur)]\",\n} as const;\n\n/** App chrome shown at the bottom of a page: a responsive three-region row (start / center / end). */\nfunction Footer({\n  className,\n  bordered = false,\n  background = \"none\",\n  ...props\n}: React.ComponentProps<\"footer\"> & {\n  /** Add a subtle top border separating the footer from page content. */\n  bordered?: boolean;\n  /** Surface fill. `glass` is a translucent, blurred panel over the page background. */\n  background?: keyof typeof footerBackgrounds;\n}) {\n  return (\n    <footer\n      data-slot=\"footer\"\n      data-background={background}\n      className={cn(\n        // Footer content is small by default (matches the version text); links and\n        // other unstyled children inherit this. Explicitly-sized <Text> is unaffected.\n        \"grid w-full grid-cols-1 gap-3 px-4 py-3 text-center md:grid-cols-3 md:items-center md:px-6\",\n        \"text-[length:var(--paragraph-mini-font-size)] leading-[var(--paragraph-mini-line-height)]\",\n        footerBackgrounds[background],\n        bordered && \"border-t border-border\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Leading region — left-aligned on md+ (e.g. an app version). */\nfunction FooterStart({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"footer-start\"\n      className={cn(\n        \"flex items-center justify-center gap-2 md:justify-self-start md:text-left\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Centre region — always centred (e.g. a \"Powered by\" lockup). */\nfunction FooterCenter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"footer-center\"\n      className={cn(\"flex items-center justify-center gap-2 md:justify-self-center\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Trailing region — right-aligned on md+ (e.g. legal links). Wraps on small screens. */\nfunction FooterEnd({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"footer-end\"\n      className={cn(\n        \"flex flex-wrap items-center justify-center gap-2 md:justify-end md:justify-self-end md:text-right\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** \"Powered by\" lockup — the label plus a slot for the brand mark (a <Logo />). */\nfunction FooterPoweredBy({\n  className,\n  label = \"Powered by\",\n  children,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  /** Override the default \"Powered by\" label. */\n  label?: React.ReactNode;\n}) {\n  return (\n    <div\n      data-slot=\"footer-powered-by\"\n      className={cn(\"flex items-center gap-2\", className)}\n      {...props}\n    >\n      <Text as=\"span\" size=\"small\" variant=\"muted\">\n        {label}\n      </Text>\n      {children}\n    </div>\n  );\n}\n\n/** Visual divider between trailing links. */\nfunction FooterSeparator({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"footer-separator\"\n      aria-hidden=\"true\"\n      className={cn(\"select-none text-border\", className)}\n      {...props}\n    >\n      |\n    </span>\n  );\n}\n\nexport { Footer, FooterStart, FooterCenter, FooterEnd, FooterPoweredBy, FooterSeparator };\n"],"mappings":";;;;;AAyBA,MAAM,oBAAoB;CACxB,MAAM;CACN,OAAO;CACP,OAAO;AACT;;AAGA,SAAS,OAAO,EACd,WACA,WAAW,OACX,aAAa,QACb,GAAG,SAMF;CACD,OACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;EACE,aAAU;EACV,mBAAiB;EACjB,WAAWA,WAAAA,GAGT,8FACA,6FACA,kBAAkB,aAClB,YAAY,0BACZ,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GACT,6EACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,iEAAiE,SAAS;EACxF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,UAAU,EAAE,WAAW,GAAG,SAAsC;CACvE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GACT,qGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,gBAAgB,EACvB,WACA,QAAQ,cACR,UACA,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,2BAA2B,SAAS;EAClD,GAAI;YAHN,CAKE,iBAAA,GAAA,kBAAA,KAACC,8BAAAA,MAAD;GAAM,IAAG;GAAO,MAAK;GAAQ,SAAQ;aAClC;EACG,CAAA,GACL,QACE;;AAET;;AAGA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAuC;CAC9E,OACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,aAAU;EACV,eAAY;EACZ,WAAWD,WAAAA,GAAG,2BAA2B,SAAS;EAClD,GAAI;YACL;CAEK,CAAA;AAEV"}

package/dist/patterns/Footer/index.d.cts

@@ -0,0 +1,54 @@
+import * as react_jsx_runtime224 from "react/jsx-runtime";
+import * as React from "react";
+
+//#region src/patterns/Footer/Footer.d.ts
+declare const footerBackgrounds: {
+  readonly none: "";
+  readonly muted: "bg-muted";
+  readonly glass: "bg-[var(--glass-light)] backdrop-blur-[var(--glass-blur)]";
+};
+/** App chrome shown at the bottom of a page: a responsive three-region row (start / center / end). */
+declare function Footer({
+  className,
+  bordered,
+  background,
+  ...props
+}: React.ComponentProps<"footer"> & {
+  /** Add a subtle top border separating the footer from page content. */
+  bordered?: boolean;
+  /** Surface fill. `glass` is a translucent, blurred panel over the page background. */
+  background?: keyof typeof footerBackgrounds;
+}): react_jsx_runtime224.JSX.Element;
+/** Leading region — left-aligned on md+ (e.g. an app version). */
+declare function FooterStart({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime224.JSX.Element;
+/** Centre region — always centred (e.g. a "Powered by" lockup). */
+declare function FooterCenter({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime224.JSX.Element;
+/** Trailing region — right-aligned on md+ (e.g. legal links). Wraps on small screens. */
+declare function FooterEnd({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime224.JSX.Element;
+/** "Powered by" lockup — the label plus a slot for the brand mark (a <Logo />). */
+declare function FooterPoweredBy({
+  className,
+  label,
+  children,
+  ...props
+}: React.ComponentProps<"div"> & {
+  /** Override the default "Powered by" label. */
+  label?: React.ReactNode;
+}): react_jsx_runtime224.JSX.Element;
+/** Visual divider between trailing links. */
+declare function FooterSeparator({
+  className,
+  ...props
+}: React.ComponentProps<"span">): react_jsx_runtime224.JSX.Element;
+//#endregion
+export { Footer, FooterCenter, FooterEnd, FooterPoweredBy, FooterSeparator, FooterStart };
+//# sourceMappingURL=index.d.cts.map

package/dist/patterns/Footer/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","names":[],"sources":["../../../src/patterns/Footer/Footer.tsx"],"mappings":";;;;cAyBM;;;EAAA,SAAA,KAAA,EAAA,2DAII;AAAA,CAAA;;iBAGD,MAAA,CACP;EAAA,SAAA;EAAA,QAAA;EAAA,UAAA;EAAA,GAAA;CAAA,EAIC,KAAA,CAAM,cAJP,CAAA,QAAA,CAAA,GAAA;;UAEA,CAAA,EAAA,OAAA;;YAM0B,CAAA,EAAA,MAAA,OAAA,iBAAA;IAC3B,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA;AAAA,iBAoBQ,WAAA,CAAW;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAA0B,KAAA,CAAM,cAAhC,CAAA,KAAA,CAAA,CAAA,EAAqD,oBAAA,CAAA,GAAA,CAAA,OAArD;;iBAcX,YAAA,CAdc;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAcwB,KAAA,CAAM,cAd9B,CAAA,KAAA,CAAA,CAAA,EAcmD,oBAAA,CAAA,GAAA,CAAA,OAdnD;;iBAyBd,SAAA,CAzBgE;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAyB7B,KAAA,CAAM,cAzBuB,CAAA,KAAA,CAAA,CAAA,EAyBF,oBAAA,CAAA,GAAA,CAAA,OAzBE;AAAA;AAAA,iBAuChE,eAAA,CAzBY;EAAA,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,GAAA;CAAA,EA8BlB,KAAA,CAAM,cA9BY,CAAA,KAAA,CAAA,GAAA;EAAA;OAAG,CAAA,EAgCd,KAAA,CAAM,SAhCQ;IAiCvB,oBAAA,CAAA,GAAA,CAAA,OAjCoD;;AAAqB,iBAiDjE,eAAA,CAjDiE;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAiDxB,KAAA,CAAM,cAjDkB,CAAA,MAAA,CAAA,CAAA,EAiDI,oBAAA,CAAA,GAAA,CAAA,OAjDJ"}

package/dist/patterns/Footer/index.d.ts

@@ -0,0 +1,54 @@
+import * as React from "react";
+import * as react_jsx_runtime87 from "react/jsx-runtime";
+
+//#region src/patterns/Footer/Footer.d.ts
+declare const footerBackgrounds: {
+  readonly none: "";
+  readonly muted: "bg-muted";
+  readonly glass: "bg-[var(--glass-light)] backdrop-blur-[var(--glass-blur)]";
+};
+/** App chrome shown at the bottom of a page: a responsive three-region row (start / center / end). */
+declare function Footer({
+  className,
+  bordered,
+  background,
+  ...props
+}: React.ComponentProps<"footer"> & {
+  /** Add a subtle top border separating the footer from page content. */
+  bordered?: boolean;
+  /** Surface fill. `glass` is a translucent, blurred panel over the page background. */
+  background?: keyof typeof footerBackgrounds;
+}): react_jsx_runtime87.JSX.Element;
+/** Leading region — left-aligned on md+ (e.g. an app version). */
+declare function FooterStart({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime87.JSX.Element;
+/** Centre region — always centred (e.g. a "Powered by" lockup). */
+declare function FooterCenter({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime87.JSX.Element;
+/** Trailing region — right-aligned on md+ (e.g. legal links). Wraps on small screens. */
+declare function FooterEnd({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime87.JSX.Element;
+/** "Powered by" lockup — the label plus a slot for the brand mark (a <Logo />). */
+declare function FooterPoweredBy({
+  className,
+  label,
+  children,
+  ...props
+}: React.ComponentProps<"div"> & {
+  /** Override the default "Powered by" label. */
+  label?: React.ReactNode;
+}): react_jsx_runtime87.JSX.Element;
+/** Visual divider between trailing links. */
+declare function FooterSeparator({
+  className,
+  ...props
+}: React.ComponentProps<"span">): react_jsx_runtime87.JSX.Element;
+//#endregion
+export { Footer, FooterCenter, FooterEnd, FooterPoweredBy, FooterSeparator, FooterStart };
+//# sourceMappingURL=index.d.ts.map

package/dist/patterns/Footer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/patterns/Footer/Footer.tsx"],"mappings":";;;;cAyBM;;;EAAA,SAAA,KAAA,EAAA,2DAII;AAAA,CAAA;;iBAGD,MAAA,CACP;EAAA,SAAA;EAAA,QAAA;EAAA,UAAA;EAAA,GAAA;CAAA,EAIC,KAAA,CAAM,cAJP,CAAA,QAAA,CAAA,GAAA;;UAEA,CAAA,EAAA,OAAA;;YAM0B,CAAA,EAAA,MAAA,OAAA,iBAAA;IAC3B,mBAAA,CAAA,GAAA,CAAA,OAAA;AAAA;AAAA,iBAoBQ,WAAA,CAAW;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAA0B,KAAA,CAAM,cAAhC,CAAA,KAAA,CAAA,CAAA,EAAqD,mBAAA,CAAA,GAAA,CAAA,OAArD;;iBAcX,YAAA,CAdc;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAcwB,KAAA,CAAM,cAd9B,CAAA,KAAA,CAAA,CAAA,EAcmD,mBAAA,CAAA,GAAA,CAAA,OAdnD;;iBAyBd,SAAA,CAzBgE;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAyB7B,KAAA,CAAM,cAzBuB,CAAA,KAAA,CAAA,CAAA,EAyBF,mBAAA,CAAA,GAAA,CAAA,OAzBE;AAAA;AAAA,iBAuChE,eAAA,CAzBY;EAAA,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,GAAA;CAAA,EA8BlB,KAAA,CAAM,cA9BY,CAAA,KAAA,CAAA,GAAA;EAAA;OAAG,CAAA,EAgCd,KAAA,CAAM,SAhCQ;IAiCvB,mBAAA,CAAA,GAAA,CAAA,OAjCoD;;AAAqB,iBAiDjE,eAAA,CAjDiE;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAiDxB,KAAA,CAAM,cAjDkB,CAAA,MAAA,CAAA,CAAA,EAiDI,mBAAA,CAAA,GAAA,CAAA,OAjDJ"}

package/dist/patterns/Footer/index.js

@@ -0,0 +1,70 @@
+import { t as cn } from "../../cn.js";
+import { Text } from "../../primitives/Text/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/patterns/Footer/Footer.tsx
+const footerBackgrounds = {
+	none: "",
+	muted: "bg-muted",
+	glass: "bg-[var(--glass-light)] backdrop-blur-[var(--glass-blur)]"
+};
+/** App chrome shown at the bottom of a page: a responsive three-region row (start / center / end). */
+function Footer({ className, bordered = false, background = "none", ...props }) {
+	return /* @__PURE__ */ jsx("footer", {
+		"data-slot": "footer",
+		"data-background": background,
+		className: cn("grid w-full grid-cols-1 gap-3 px-4 py-3 text-center md:grid-cols-3 md:items-center md:px-6", "text-[length:var(--paragraph-mini-font-size)] leading-[var(--paragraph-mini-line-height)]", footerBackgrounds[background], bordered && "border-t border-border", className),
+		...props
+	});
+}
+/** Leading region — left-aligned on md+ (e.g. an app version). */
+function FooterStart({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "footer-start",
+		className: cn("flex items-center justify-center gap-2 md:justify-self-start md:text-left", className),
+		...props
+	});
+}
+/** Centre region — always centred (e.g. a "Powered by" lockup). */
+function FooterCenter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "footer-center",
+		className: cn("flex items-center justify-center gap-2 md:justify-self-center", className),
+		...props
+	});
+}
+/** Trailing region — right-aligned on md+ (e.g. legal links). Wraps on small screens. */
+function FooterEnd({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "footer-end",
+		className: cn("flex flex-wrap items-center justify-center gap-2 md:justify-end md:justify-self-end md:text-right", className),
+		...props
+	});
+}
+/** "Powered by" lockup — the label plus a slot for the brand mark (a <Logo />). */
+function FooterPoweredBy({ className, label = "Powered by", children, ...props }) {
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "footer-powered-by",
+		className: cn("flex items-center gap-2", className),
+		...props,
+		children: [/* @__PURE__ */ jsx(Text, {
+			as: "span",
+			size: "small",
+			variant: "muted",
+			children: label
+		}), children]
+	});
+}
+/** Visual divider between trailing links. */
+function FooterSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "footer-separator",
+		"aria-hidden": "true",
+		className: cn("select-none text-border", className),
+		...props,
+		children: "|"
+	});
+}
+//#endregion
+export { Footer, FooterCenter, FooterEnd, FooterPoweredBy, FooterSeparator, FooterStart };
+
+//# sourceMappingURL=index.js.map

package/dist/patterns/Footer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/patterns/Footer/Footer.tsx"],"sourcesContent":["import type * as React from \"react\";\n\nimport { Text } from \"@/primitives/Text\";\nimport { cn } from \"@/utils\";\n\n// Footer — app chrome shown at the bottom of a page. A responsive three-region\n// row: the regions stack centered on mobile and spread to start / center / end\n// on md+ (a grid, so the centre region stays centred regardless of the side\n// widths). Compose content from Text / Link / Logo; the helpers below cover the\n// common pieces (a \"Powered by\" lockup and a link separator).\n//\n//   <Footer>\n//     <FooterStart><Text size=\"mini\" variant=\"muted\">v2.6.0</Text></FooterStart>\n//     <FooterCenter>\n//       <FooterPoweredBy><Logo brand=\"slingshot\" variant=\"icon\" className=\"size-5\" /></FooterPoweredBy>\n//     </FooterCenter>\n//     <FooterEnd>\n//       <Link href=\"/tnc\" underline=\"hover\">T&C</Link>\n//       <FooterSeparator />\n//       <Link href=\"/privacy\" underline=\"hover\">Privacy</Link>\n//     </FooterEnd>\n//   </Footer>\n\n// Surface fills. `glass` is a translucent, backdrop-blurred panel (same --glass-*\n// tokens as Card/Container) — reads over a textured page background.\nconst footerBackgrounds = {\n  none: \"\",\n  muted: \"bg-muted\",\n  glass: \"bg-[var(--glass-light)] backdrop-blur-[var(--glass-blur)]\",\n} as const;\n\n/** App chrome shown at the bottom of a page: a responsive three-region row (start / center / end). */\nfunction Footer({\n  className,\n  bordered = false,\n  background = \"none\",\n  ...props\n}: React.ComponentProps<\"footer\"> & {\n  /** Add a subtle top border separating the footer from page content. */\n  bordered?: boolean;\n  /** Surface fill. `glass` is a translucent, blurred panel over the page background. */\n  background?: keyof typeof footerBackgrounds;\n}) {\n  return (\n    <footer\n      data-slot=\"footer\"\n      data-background={background}\n      className={cn(\n        // Footer content is small by default (matches the version text); links and\n        // other unstyled children inherit this. Explicitly-sized <Text> is unaffected.\n        \"grid w-full grid-cols-1 gap-3 px-4 py-3 text-center md:grid-cols-3 md:items-center md:px-6\",\n        \"text-[length:var(--paragraph-mini-font-size)] leading-[var(--paragraph-mini-line-height)]\",\n        footerBackgrounds[background],\n        bordered && \"border-t border-border\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Leading region — left-aligned on md+ (e.g. an app version). */\nfunction FooterStart({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"footer-start\"\n      className={cn(\n        \"flex items-center justify-center gap-2 md:justify-self-start md:text-left\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Centre region — always centred (e.g. a \"Powered by\" lockup). */\nfunction FooterCenter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"footer-center\"\n      className={cn(\"flex items-center justify-center gap-2 md:justify-self-center\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Trailing region — right-aligned on md+ (e.g. legal links). Wraps on small screens. */\nfunction FooterEnd({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"footer-end\"\n      className={cn(\n        \"flex flex-wrap items-center justify-center gap-2 md:justify-end md:justify-self-end md:text-right\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** \"Powered by\" lockup — the label plus a slot for the brand mark (a <Logo />). */\nfunction FooterPoweredBy({\n  className,\n  label = \"Powered by\",\n  children,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  /** Override the default \"Powered by\" label. */\n  label?: React.ReactNode;\n}) {\n  return (\n    <div\n      data-slot=\"footer-powered-by\"\n      className={cn(\"flex items-center gap-2\", className)}\n      {...props}\n    >\n      <Text as=\"span\" size=\"small\" variant=\"muted\">\n        {label}\n      </Text>\n      {children}\n    </div>\n  );\n}\n\n/** Visual divider between trailing links. */\nfunction FooterSeparator({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"footer-separator\"\n      aria-hidden=\"true\"\n      className={cn(\"select-none text-border\", className)}\n      {...props}\n    >\n      |\n    </span>\n  );\n}\n\nexport { Footer, FooterStart, FooterCenter, FooterEnd, FooterPoweredBy, FooterSeparator };\n"],"mappings":";;;;AAyBA,MAAM,oBAAoB;CACxB,MAAM;CACN,OAAO;CACP,OAAO;AACT;;AAGA,SAAS,OAAO,EACd,WACA,WAAW,OACX,aAAa,QACb,GAAG,SAMF;CACD,OACE,oBAAC,UAAD;EACE,aAAU;EACV,mBAAiB;EACjB,WAAW,GAGT,8FACA,6FACA,kBAAkB,aAClB,YAAY,0BACZ,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,6EACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,iEAAiE,SAAS;EACxF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,UAAU,EAAE,WAAW,GAAG,SAAsC;CACvE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,qGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,gBAAgB,EACvB,WACA,QAAQ,cACR,UACA,GAAG,SAIF;CACD,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,SAAS;EAClD,GAAI;YAHN,CAKE,oBAAC,MAAD;GAAM,IAAG;GAAO,MAAK;GAAQ,SAAQ;aAClC;EACG,CAAA,GACL,QACE;;AAET;;AAGA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAuC;CAC9E,OACE,oBAAC,QAAD;EACE,aAAU;EACV,eAAY;EACZ,WAAW,GAAG,2BAA2B,SAAS;EAClD,GAAI;YACL;CAEK,CAAA;AAEV"}

package/dist/patterns/Header/index.cjs

@@ -0,0 +1,17 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_Header = require("../../Header.cjs");
+exports.DEFAULT_LABELS = require_Header.DEFAULT_LABELS;
+exports.Header = require_Header.Header;
+exports.HeaderBar = require_Header.HeaderBar;
+exports.HeaderLogo = require_Header.HeaderLogo;
+exports.OrgPill = require_Header.OrgPill;
+exports.ProfileMenu = require_Header.ProfileMenu;
+exports.ProjectPicker = require_Header.ProjectPicker;
+exports.TOGGLE_PROJECT_DROPDOWN_EVENT = require_Header.TOGGLE_PROJECT_DROPDOWN_EVENT;
+exports.ThemeToggle = require_Header.ThemeToggle;
+exports.buildEndpoints = require_Header.buildEndpoints;
+exports.getSessionToken = require_Header.getSessionToken;
+exports.isSessionValid = require_Header.isSessionValid;
+exports.useGlobalHeader = require_Header.useGlobalHeader;
+exports.useHeaderCredits = require_Header.useHeaderCredits;
+exports.useHeaderProject = require_Header.useHeaderProject;

package/dist/patterns/Header/index.d.cts

@@ -0,0 +1,2 @@
+import { C as HeaderProps, S as HeaderEndpoints, _ as HeaderLogo, a as isSessionValid, b as ThemeToggle, c as useHeaderCredits, d as TOGGLE_PROJECT_DROPDOWN_EVENT, f as ToggleProjectDropdownDetail, g as HeaderBar, h as Header, i as getSessionToken, l as useHeaderProject, m as ProjectPicker, n as Labels, o as HeaderSelection, p as useGlobalHeader, r as buildEndpoints, s as UseHeaderProjectResult, t as DEFAULT_LABELS, u as GlobalHeaderState, v as OrgPill, w as ProjectNode, x as Fetcher, y as ProfileMenu } from "../../index70.cjs";
+export { DEFAULT_LABELS, Fetcher, GlobalHeaderState, Header, HeaderBar, HeaderEndpoints, HeaderLogo, HeaderProps, HeaderSelection, Labels, OrgPill, ProfileMenu, ProjectNode, ProjectPicker, TOGGLE_PROJECT_DROPDOWN_EVENT, ThemeToggle, ToggleProjectDropdownDetail, UseHeaderProjectResult, buildEndpoints, getSessionToken, isSessionValid, useGlobalHeader, useHeaderCredits, useHeaderProject };

package/dist/patterns/Header/index.d.ts

@@ -0,0 +1,2 @@
+import { C as HeaderProps, S as HeaderEndpoints, _ as HeaderLogo, a as isSessionValid, b as ThemeToggle, c as useHeaderCredits, d as TOGGLE_PROJECT_DROPDOWN_EVENT, f as ToggleProjectDropdownDetail, g as HeaderBar, h as Header, i as getSessionToken, l as useHeaderProject, m as ProjectPicker, n as Labels, o as HeaderSelection, p as useGlobalHeader, r as buildEndpoints, s as UseHeaderProjectResult, t as DEFAULT_LABELS, u as GlobalHeaderState, v as OrgPill, w as ProjectNode, x as Fetcher, y as ProfileMenu } from "../../index70.js";
+export { DEFAULT_LABELS, Fetcher, GlobalHeaderState, Header, HeaderBar, HeaderEndpoints, HeaderLogo, HeaderProps, HeaderSelection, Labels, OrgPill, ProfileMenu, ProjectNode, ProjectPicker, TOGGLE_PROJECT_DROPDOWN_EVENT, ThemeToggle, ToggleProjectDropdownDetail, UseHeaderProjectResult, buildEndpoints, getSessionToken, isSessionValid, useGlobalHeader, useHeaderCredits, useHeaderProject };

package/dist/patterns/Header/index.js

@@ -0,0 +1,2 @@
+import { a as ProfileMenu, c as useGlobalHeader, d as useHeaderCredits, f as useHeaderProject, h as ProjectPicker, i as OrgPill, l as getSessionToken, m as DEFAULT_LABELS, n as HeaderBar, o as ThemeToggle, p as buildEndpoints, r as HeaderLogo, s as TOGGLE_PROJECT_DROPDOWN_EVENT, t as Header, u as isSessionValid } from "../../Header.js";
+export { DEFAULT_LABELS, Header, HeaderBar, HeaderLogo, OrgPill, ProfileMenu, ProjectPicker, TOGGLE_PROJECT_DROPDOWN_EVENT, ThemeToggle, buildEndpoints, getSessionToken, isSessionValid, useGlobalHeader, useHeaderCredits, useHeaderProject };