@bouku/next 0.0.2

package/dist/assets/icons/bars.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" width="1em" height="1em">
+    <path 
+        d="M96 160C96 142.3 110.3 128 128 128L512 128C529.7 128 544 142.3 544 160C544 177.7 529.7 192 512 192L128 192C110.3 192 96 177.7 96 160zM96 320C96 302.3 110.3 288 128 288L512 288C529.7 288 544 302.3 544 320C544 337.7 529.7 352 512 352L128 352C110.3 352 96 337.7 96 320zM544 480C544 497.7 529.7 512 512 512L128 512C110.3 512 96 497.7 96 480C96 462.3 110.3 448 128 448L512 448C529.7 448 544 462.3 544 480z" 
+        fill="currentColor" 
+    />
+</svg>

package/dist/assets/icons/camera.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="1em" height="1em">
+    <path 
+        d="M220.6 121.2L271.1 96 448 96l0 96-114.8 0c-21.9-15.1-48.5-24-77.2-24s-55.2 8.9-77.2 24L64 192l0-64 128 0c9.9 0 19.7-2.3 28.6-6.8zM0 128L0 416c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-320c0-35.3-28.7-64-64-64L271.1 32c-9.9 0-19.7 2.3-28.6 6.8L192 64l-32 0 0-16c0-8.8-7.2-16-16-16L80 32c-8.8 0-16 7.2-16 16l0 16C28.7 64 0 92.7 0 128zM168 304a88 88 0 1 1 176 0 88 88 0 1 1 -176 0z" 
+        fill="currentColor" 
+    />
+</svg>

package/dist/assets/icons/login.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="1em" height="1em">
+    <path 
+        d="M345 273c9.4-9.4 9.4-24.6 0-33.9L201 95c-6.9-6.9-17.2-8.9-26.2-5.2S160 102.3 160 112l0 80-112 0c-26.5 0-48 21.5-48 48l0 32c0 26.5 21.5 48 48 48l112 0 0 80c0 9.7 5.8 18.5 14.8 22.2s19.3 1.7 26.2-5.2L345 273zm7 143c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0c53 0 96-43 96-96l0-256c0-53-43-96-96-96l-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0c17.7 0 32 14.3 32 32l0 256c0 17.7-14.3 32-32 32l-64 0z" 
+        fill="currentColor" 
+    />
+</svg>

package/dist/assets/icons/user-circle.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="1em" height="1em">
+    <path 
+        d="M399 384.2C376.9 345.8 335.4 320 288 320l-64 0c-47.4 0-88.9 25.8-111 64.2 35.2 39.2 86.2 63.8 143 63.8s107.8-24.7 143-63.8zM0 256a256 256 0 1 1 512 0 256 256 0 1 1 -512 0zm256 16a72 72 0 1 0 0-144 72 72 0 1 0 0 144z" 
+        fill="currentColor" 
+    />
+</svg>

package/dist/components/image/_.d.ts

@@ -0,0 +1,3 @@
+import { StaticImageData } from "next/image";
+export { default as Image } from "./normal";
+export type ImageSrc = StaticImageData | string;

package/dist/components/image/_.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Image = void 0;
+var normal_1 = require("./normal");
+Object.defineProperty(exports, "Image", { enumerable: true, get: function () { return __importDefault(normal_1).default; } });

package/dist/components/image/normal.d.ts

@@ -0,0 +1,11 @@
+import { ImageProps } from "next/image";
+type Props = {
+    src: ImageProps["src"];
+    style?: string;
+    link?: string;
+    width?: number;
+    height?: number;
+    alt?: string;
+};
+export declare function Image({ src, link, style, width, height, alt, }: Props): import("react").JSX.Element;
+export default Image;

package/dist/components/image/normal.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Image = Image;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const image_1 = __importDefault(require("next/image"));
+const link_1 = __importDefault(require("next/link"));
+const style_1 = require("@bouko/style");
+function Image({ src, link, style, width = 100, height = 100, alt = "Image", }) {
+    if (link)
+        return ((0, jsx_runtime_1.jsx)(link_1.default, { href: link, passHref: true, children: (0, jsx_runtime_1.jsx)(image_1.default, { src: src, className: (0, style_1.cn)("w-auto h-auto", style), width: width, height: height, alt: alt }) }));
+    return ((0, jsx_runtime_1.jsx)(image_1.default, { src: src, className: (0, style_1.cn)("w-auto h-auto", style), width: width, height: height, alt: alt }));
+}
+exports.default = Image;

package/dist/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./image/_";
+export * from "./link/_";

package/dist/components/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./image/_"), exports);
+__exportStar(require("./link/_"), exports);

package/dist/components/link/_.d.ts

@@ -0,0 +1,4 @@
+export { default as Link } from "./normal";
+export { default as LinkButton } from "./button";
+export { default as DropdownNav } from "./dropdown-nav";
+export { default as NavTabs } from "./tabs";

package/dist/components/link/_.js

@@ -0,0 +1,14 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavTabs = exports.DropdownNav = exports.LinkButton = exports.Link = void 0;
+var normal_1 = require("./normal");
+Object.defineProperty(exports, "Link", { enumerable: true, get: function () { return __importDefault(normal_1).default; } });
+var button_1 = require("./button");
+Object.defineProperty(exports, "LinkButton", { enumerable: true, get: function () { return __importDefault(button_1).default; } });
+var dropdown_nav_1 = require("./dropdown-nav");
+Object.defineProperty(exports, "DropdownNav", { enumerable: true, get: function () { return __importDefault(dropdown_nav_1).default; } });
+var tabs_1 = require("./tabs");
+Object.defineProperty(exports, "NavTabs", { enumerable: true, get: function () { return __importDefault(tabs_1).default; } });

package/dist/components/link/button.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from "react";
+import { Component } from "@bouku/core";
+type ButtonProps = Component & {
+    variant?: "surface" | "outline" | "ghost" | "error";
+    size?: "xs" | "sm" | "md" | "lg";
+    icon?: ReactNode;
+    disabled?: boolean;
+};
+type Props = ButtonProps & {
+    href: string;
+    download?: string;
+};
+export declare function LinkButton({ href, download, disabled, ...props }: Props): import("react").JSX.Element;
+export default LinkButton;

package/dist/components/link/button.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LinkButton = LinkButton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const link_1 = __importDefault(require("next/link"));
+const core_1 = require("@bouku/core");
+function LinkButton({ href, download, disabled, ...props }) {
+    if (disabled)
+        return (0, jsx_runtime_1.jsx)(core_1.Button, { ...props, disabled: true });
+    return ((0, jsx_runtime_1.jsx)(link_1.default, { href: href, download: download, children: (0, jsx_runtime_1.jsx)(core_1.Button, { ...props }) }));
+}
+exports.default = LinkButton;

package/dist/components/link/dropdown-nav.d.ts

@@ -0,0 +1,9 @@
+type TabRoute = {
+    icon?: React.ReactNode;
+    label: string;
+    to: string;
+};
+export declare function DropdownNav({ items }: {
+    items: TabRoute[];
+}): import("react").JSX.Element;
+export default DropdownNav;

package/dist/components/link/dropdown-nav.js

@@ -0,0 +1,17 @@
+"use client";
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DropdownNav = DropdownNav;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const navigation_1 = require("next/navigation");
+const core_1 = require("@bouku/core");
+const bars_svg_1 = __importDefault(require("../assets/icons/bars.svg"));
+function DropdownNav({ items }) {
+    const router = (0, navigation_1.useRouter)();
+    const tabs = items.map(x => ({ ...x, action: () => router.push(x.to) }));
+    return ((0, jsx_runtime_1.jsx)(core_1.Dropdown, { options: tabs, children: (0, jsx_runtime_1.jsx)(bars_svg_1.default, {}) }));
+}
+exports.default = DropdownNav;

package/dist/components/link/normal.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from "react";
+type Props = {
+    style?: string;
+    to?: string;
+    underline?: boolean;
+    download?: string;
+    disabled?: boolean;
+    children: ReactNode;
+};
+export declare function Link({ style, to, download, underline, disabled, ...props }: Props): import("react").JSX.Element;
+export default Link;

package/dist/components/link/normal.js

@@ -0,0 +1,26 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Link = Link;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const link_1 = __importDefault(require("next/link"));
+const style_1 = require("@bouko/style");
+const tailwind_variants_1 = require("tailwind-variants");
+function Link({ style, to = "/", download, underline = false, disabled, ...props }) {
+    if (disabled)
+        return ((0, jsx_runtime_1.jsx)("div", { className: (0, style_1.cn)(styles({ underline }), style, "cursor-not-allowed"), ...props }));
+    if (to.includes("https"))
+        return ((0, jsx_runtime_1.jsx)("a", { className: (0, style_1.cn)(styles({ underline }), style), href: to, target: "_blank", rel: "noopener noreferrer", ...props }));
+    return ((0, jsx_runtime_1.jsx)(link_1.default, { className: (0, style_1.cn)(styles({ underline }), style), href: to, download: download, passHref: true, ...props }));
+}
+const styles = (0, tailwind_variants_1.tv)({
+    base: "text-accent hover:text-accent-light duration-200",
+    variants: {
+        underline: {
+            true: "text-primary-dark hover:text-primary underline underline-offset-4 decoration-border-light hover:decoration-accent"
+        }
+    }
+});
+exports.default = Link;

package/dist/components/link/tab.d.ts

@@ -0,0 +1,7 @@
+type Props = {
+    id: string;
+    icon?: React.ReactNode;
+    label?: string;
+};
+export declare function Tab({ id, icon, label }: Props): import("react").JSX.Element;
+export {};

package/dist/components/link/tab.js

@@ -0,0 +1,21 @@
+"use client";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tab = Tab;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const navigation_1 = require("next/navigation");
+const style_1 = require("@bouko/style");
+const normal_1 = require("./normal");
+function Tab({ id, icon, label }) {
+    const path = (0, navigation_1.usePathname)();
+    const isActive = path === ("/" + id) || (path === "/" && id === "root");
+    if (isActive)
+        return ((0, jsx_runtime_1.jsxs)("span", { className: (0, style_1.cn)(styles.tab, "!text-accent font-medium bg-accent-dark/20 border-accent/10 cursor-not-allowed"), children: [icon, label ?? id] }, id));
+    return ((0, jsx_runtime_1.jsxs)(normal_1.Link, { style: styles.tab, to: id === "root" ? "/" : ("/" + id), children: [icon, label ?? id] }, id));
+}
+const styles = {
+    container: "items-center gap-12 w-72 h-full px-3 py-6 bg-background-light border-r-2 border-border shadow",
+    logo: "w-2/3 h-auto",
+    nav: "gap-6 w-full",
+    tab: "flex items-center gap-2 w-full border border-transparent rounded px-3 py-2 text-sm uppercase text-primary-dark hover:text-primary duration-200"
+};

package/dist/components/link/tabs.d.ts

@@ -0,0 +1,12 @@
+type Props = {
+    style?: string;
+    pages: Page[];
+};
+type Page = {
+    id: string;
+    route: string;
+    label: string;
+    disabled?: boolean;
+};
+export default function Tabs({ style, pages }: Props): import("react").JSX.Element;
+export {};

package/dist/components/link/tabs.js

@@ -0,0 +1,20 @@
+"use client";
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = Tabs;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const navigation_1 = require("next/navigation");
+const normal_1 = __importDefault(require("./normal"));
+const core_1 = require("@bouku/core");
+const style_1 = require("@bouko/style");
+function Tabs({ style, pages }) {
+    const pathname = (0, navigation_1.usePathname)();
+    return ((0, jsx_runtime_1.jsx)(core_1.RowBox, { style: (0, style_1.cn)(styles.container, style), children: pages.map((item) => ((0, jsx_runtime_1.jsx)(normal_1.default, { style: (0, style_1.cn)(styles.tab, pathname === item.route && "!border-accent !text-primary !cursor-default", item.disabled && "pointer-events-none !cursor-not-allowed"), to: item.route, disabled: item.disabled, children: item.label ?? item.id }, item.id))) }));
+}
+const styles = {
+    container: "gap-5 sm:gap-8",
+    tab: "flex items-center gap-2 py-1 border-b-2 border-slate-700/60 hover:border-slate-600/50 duration-200 text-slate-300 hover:text-primary-dark font-roboto text-xs sm:text-sm uppercase tracking-wide"
+};

package/dist/image/_.d.ts

@@ -0,0 +1,3 @@
+import { StaticImageData } from "next/image";
+export { default as Image } from "./normal";
+export type ImageSrc = StaticImageData | string;

package/dist/image/_.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Image = void 0;
+var normal_1 = require("./normal");
+Object.defineProperty(exports, "Image", { enumerable: true, get: function () { return __importDefault(normal_1).default; } });

package/dist/image/normal.d.ts

@@ -0,0 +1,11 @@
+import { ImageProps } from "next/image";
+type Props = {
+    src: ImageProps["src"];
+    style?: string;
+    link?: string;
+    width?: number;
+    height?: number;
+    alt?: string;
+};
+export declare function Image({ src, link, style, width, height, alt, }: Props): import("react").JSX.Element;
+export default Image;

package/dist/image/normal.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Image = Image;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const image_1 = __importDefault(require("next/image"));
+const link_1 = __importDefault(require("next/link"));
+const style_1 = require("@bouko/style");
+function Image({ src, link, style, width = 100, height = 100, alt = "Image", }) {
+    if (link)
+        return ((0, jsx_runtime_1.jsx)(link_1.default, { href: link, passHref: true, children: (0, jsx_runtime_1.jsx)(image_1.default, { src: src, className: (0, style_1.cn)("w-auto h-auto", style), width: width, height: height, alt: alt }) }));
+    return ((0, jsx_runtime_1.jsx)(image_1.default, { src: src, className: (0, style_1.cn)("w-auto h-auto", style), width: width, height: height, alt: alt }));
+}
+exports.default = Image;

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./components";
+export * from "./pages";

package/dist/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./components"), exports);
+__exportStar(require("./pages"), exports);

package/dist/layouts/_.d.ts

@@ -0,0 +1,3 @@
+export { default as NormalLayout } from "./normal";
+export { default as LockedLayout } from "./locked";
+export { default as DashboardLayout } from "./dashboard";

package/dist/layouts/_.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashboardLayout = exports.LockedLayout = exports.NormalLayout = void 0;
+var normal_1 = require("./normal");
+Object.defineProperty(exports, "NormalLayout", { enumerable: true, get: function () { return __importDefault(normal_1).default; } });
+var locked_1 = require("./locked");
+Object.defineProperty(exports, "LockedLayout", { enumerable: true, get: function () { return __importDefault(locked_1).default; } });
+var dashboard_1 = require("./dashboard");
+Object.defineProperty(exports, "DashboardLayout", { enumerable: true, get: function () { return __importDefault(dashboard_1).default; } });

package/dist/layouts/dashboard.d.ts

@@ -0,0 +1,25 @@
+import type { ReactNode } from "react";
+import type { StaticImageData } from "next/image";
+type Props = {
+    logo: StaticImageData;
+    fonts: string[];
+    pages: Record<string, {
+        id: string;
+        icon?: ReactNode;
+        label?: string;
+    }[]>;
+    providers: ReactNode[];
+    children: ReactNode;
+};
+export declare const DashboardLayout: ({ logo, fonts, pages, providers, children }: Props) => import("react").JSX.Element;
+type Item = {
+    id: string;
+    icon?: ReactNode;
+    label?: string;
+};
+type SidebarProps = {
+    logo: StaticImageData;
+    tabs: Record<string, Item[]>;
+};
+export declare function Sidebar({ logo, tabs }: SidebarProps): import("react").JSX.Element;
+export default DashboardLayout;

package/dist/layouts/dashboard.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashboardLayout = void 0;
+exports.Sidebar = Sidebar;
+const react_1 = require("react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@bouku/core");
+const _1 = require("../link/_");
+const _2 = require("../image/_");
+const tab_1 = require("../link/tab");
+const style_1 = require("@bouko/style");
+const DashboardLayout = ({ logo, fonts, pages, providers, children }) => ((0, jsx_runtime_1.jsx)("html", { lang: "en", className: (0, style_1.cn)(...fonts, "scroll-smooth"), children: (0, jsx_runtime_1.jsx)("body", { className: s.page, children: (0, jsx_runtime_1.jsxs)("main", { className: s.container, children: [(0, jsx_runtime_1.jsx)(Sidebar, { logo: logo, tabs: pages }), (0, jsx_runtime_1.jsx)(core_1.ColumnBox, { style: s.content, children: children }), providers] }) }) }));
+exports.DashboardLayout = DashboardLayout;
+const s = {
+    page: "h-[100dvh] bg-background font-sans text-primary select-none overflow-hidden antialiased",
+    container: "flex w-full h-full overflow-hidden",
+    content: "grow justify-center items-start w-full p-8"
+};
+function Sidebar({ logo, tabs }) {
+    return ((0, jsx_runtime_1.jsxs)(core_1.ColumnBox, { style: styles.container, children: [(0, jsx_runtime_1.jsx)(_1.Link, { style: styles.logo, to: "/", children: (0, jsx_runtime_1.jsx)(_2.Image, { src: logo, style: "w-full h-full", width: 100, height: 50, alt: "Logo" }) }), (0, jsx_runtime_1.jsx)(core_1.ColumnBox, { style: styles.nav, children: Object.entries(tabs).map(([section, routes], i) => ((0, jsx_runtime_1.jsxs)(core_1.ColumnBox, { style: "gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "px-3 tracking-wider font-mono text-xs uppercase font-light text-primary-dark/80", children: section }), (0, jsx_runtime_1.jsx)(core_1.ColumnBox, { style: "gap-1", children: routes.map((opts, i) => ((0, react_1.createElement)(tab_1.Tab, { ...opts, key: i }))) })] }, i))) })] }));
+}
+const styles = {
+    container: "items-center gap-12 w-72 h-full px-3 py-6 bg-background-light border-r-2 border-border shadow",
+    logo: "w-2/3 h-auto",
+    nav: "gap-6 w-full",
+    tab: "flex items-center gap-2 w-full border border-transparent rounded px-3 py-2 text-sm uppercase text-primary-dark hover:text-primary duration-200"
+};
+exports.default = exports.DashboardLayout;

package/dist/layouts/locked.d.ts

@@ -0,0 +1,35 @@
+import { ReactNode } from "react";
+export declare const Header: ({ children }: {
+    children: React.ReactNode;
+}) => import("react").JSX.Element;
+/**
+ * Application footer component containing copyright and legal links
+ *
+ * Layout:
+ * - Desktop: Horizontal layout with copyright on left, links on right
+ * - Mobile: Vertical stacked layout with copyright above links
+ *
+ * Used in the main layout to provide persistent footer across all pages
+**/
+export declare const Footer: ({ company }: {
+    company?: string;
+}) => import("react").JSX.Element;
+/**
+ * Problems:
+ *
+ * 1. Move to `@bouko/next` or `@bouku/core`
+ * 2. Wrong link component for external
+**/
+type Props = {
+    variant?: "normal" | "locked";
+    company?: string;
+    header?: ReactNode[];
+    fonts: string[];
+    Providers?: ({ children }: {
+        children: ReactNode;
+    }) => React.JSX.Element;
+    authed?: boolean;
+    children: ReactNode;
+};
+declare const LockedLayout: ({ company, header, fonts, children }: Props) => import("react").JSX.Element;
+export default LockedLayout;

package/dist/layouts/locked.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Footer = exports.Header = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@bouku/core");
+const _1 = require("../link/_");
+const style_1 = require("@bouko/style");
+const Header = ({ children }) => ((0, jsx_runtime_1.jsx)(core_1.RowBox, { style: "justify-between items-center gap-6 w-full p-5", children: children }));
+exports.Header = Header;
+/**
+ * Application footer component containing copyright and legal links
+ *
+ * Layout:
+ * - Desktop: Horizontal layout with copyright on left, links on right
+ * - Mobile: Vertical stacked layout with copyright above links
+ *
+ * Used in the main layout to provide persistent footer across all pages
+**/
+const Footer = ({ company }) => ((0, jsx_runtime_1.jsxs)(core_1.RowBox, { style: (0, style_1.cn)(footerStyles.container, footerStyles.text), children: [(0, jsx_runtime_1.jsxs)("span", { children: ["Copyright \u00A9 2025 ", company] }), (0, jsx_runtime_1.jsxs)(core_1.RowBox, { style: footerStyles.links, children: [(0, jsx_runtime_1.jsx)(_1.Link, { to: "/legal/terms", underline: true, children: "Terms of Service" }), (0, jsx_runtime_1.jsx)(_1.Link, { to: "/legal/privacy", underline: true, children: "Privacy Policy" })] })] }));
+exports.Footer = Footer;
+const footerStyles = {
+    container: "max-sm:flex-col justify-between sm:items-center gap-3 sm:gap-6 w-full p-6",
+    text: "text-sm text-primary-dark",
+    links: "items-center gap-4"
+};
+const LockedLayout = ({ company, header, fonts, children }) => ((0, jsx_runtime_1.jsx)("html", { lang: "en", className: (0, style_1.cn)(...fonts, "scroll-smooth"), children: (0, jsx_runtime_1.jsx)("body", { className: s.page, children: (0, jsx_runtime_1.jsxs)("main", { className: s.container, children: [header && (0, jsx_runtime_1.jsx)(exports.Header, { children: header }), (0, jsx_runtime_1.jsx)("div", { className: s.content, children: children }), (0, jsx_runtime_1.jsx)(exports.Footer, { company: company })] }) }) }));
+const s = {
+    page: "h-[100dvh] bg-background font-sans text-primary select-none antialiased overflow-hidden",
+    container: "flex flex-col w-full h-full mx-auto max-w-[82rem] overflow-hidden",
+    content: "flex grow justify-center items-start w-full p-8overflow-x-hidden overflow-y-auto no-scrollbar"
+};
+exports.default = LockedLayout;

package/dist/layouts/normal.d.ts

@@ -0,0 +1,35 @@
+import { ReactNode } from "react";
+export declare const Header: ({ children }: {
+    children: React.ReactNode;
+}) => import("react").JSX.Element;
+/**
+ * Application footer component containing copyright and legal links
+ *
+ * Layout:
+ * - Desktop: Horizontal layout with copyright on left, links on right
+ * - Mobile: Vertical stacked layout with copyright above links
+ *
+ * Used in the main layout to provide persistent footer across all pages
+**/
+export declare const Footer: ({ company }: {
+    company?: string;
+}) => import("react").JSX.Element;
+/**
+ * Problems:
+ *
+ * 1. Move to `@bouko/next` or `@bouku/core`
+ * 2. Wrong link component for external
+**/
+type Props = {
+    variant?: "normal" | "locked";
+    company?: string;
+    header?: ReactNode[];
+    fonts: string[];
+    Providers?: ({ children }: {
+        children: ReactNode;
+    }) => React.JSX.Element;
+    authed?: boolean;
+    children: ReactNode;
+};
+declare const NormalLayout: ({ company, header, fonts, children }: Props) => import("react").JSX.Element;
+export default NormalLayout;

package/dist/layouts/normal.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Footer = exports.Header = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@bouku/core");
+const _1 = require("../link/_");
+const style_1 = require("@bouko/style");
+const Header = ({ children }) => ((0, jsx_runtime_1.jsx)(core_1.RowBox, { style: "justify-between items-center gap-6 w-full p-5", children: children }));
+exports.Header = Header;
+/**
+ * Application footer component containing copyright and legal links
+ *
+ * Layout:
+ * - Desktop: Horizontal layout with copyright on left, links on right
+ * - Mobile: Vertical stacked layout with copyright above links
+ *
+ * Used in the main layout to provide persistent footer across all pages
+**/
+const Footer = ({ company }) => ((0, jsx_runtime_1.jsxs)(core_1.RowBox, { style: (0, style_1.cn)(footerStyles.container, footerStyles.text), children: [(0, jsx_runtime_1.jsxs)("span", { children: ["Copyright \u00A9 2025 ", company] }), (0, jsx_runtime_1.jsxs)(core_1.RowBox, { style: footerStyles.links, children: [(0, jsx_runtime_1.jsx)(_1.Link, { to: "/legal/terms", underline: true, children: "Terms of Service" }), (0, jsx_runtime_1.jsx)(_1.Link, { to: "/legal/privacy", underline: true, children: "Privacy Policy" })] })] }));
+exports.Footer = Footer;
+const footerStyles = {
+    container: "max-sm:flex-col justify-between sm:items-center gap-3 sm:gap-6 w-full p-6",
+    text: "text-sm text-primary-dark",
+    links: "items-center gap-4"
+};
+const NormalLayout = ({ company, header, fonts, children }) => ((0, jsx_runtime_1.jsx)("html", { lang: "en", className: (0, style_1.cn)(...fonts, "scroll-smooth"), children: (0, jsx_runtime_1.jsx)("body", { className: s.page, children: (0, jsx_runtime_1.jsxs)("main", { className: s.container, children: [(0, jsx_runtime_1.jsx)(exports.Header, { children: header }), (0, jsx_runtime_1.jsx)("div", { className: s.content, children: children }), (0, jsx_runtime_1.jsx)(exports.Footer, { company: company })] }) }) }));
+const s = {
+    page: "h-[100dvh] bg-background font-sans text-primary select-none overflow-auto antialiased",
+    container: "flex flex-col w-full h-full mx-auto max-w-[82rem]",
+    content: "flex grow justify-center items-start w-full p-8"
+};
+exports.default = NormalLayout;

package/dist/link/_.d.ts

@@ -0,0 +1,4 @@
+export { default as Link } from "./normal";
+export { default as LinkButton } from "./button";
+export { default as DropdownNav } from "./dropdown-nav";
+export { default as NavTabs } from "./tabs";

package/dist/link/_.js

@@ -0,0 +1,14 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavTabs = exports.DropdownNav = exports.LinkButton = exports.Link = void 0;
+var normal_1 = require("./normal");
+Object.defineProperty(exports, "Link", { enumerable: true, get: function () { return __importDefault(normal_1).default; } });
+var button_1 = require("./button");
+Object.defineProperty(exports, "LinkButton", { enumerable: true, get: function () { return __importDefault(button_1).default; } });
+var dropdown_nav_1 = require("./dropdown-nav");
+Object.defineProperty(exports, "DropdownNav", { enumerable: true, get: function () { return __importDefault(dropdown_nav_1).default; } });
+var tabs_1 = require("./tabs");
+Object.defineProperty(exports, "NavTabs", { enumerable: true, get: function () { return __importDefault(tabs_1).default; } });

package/dist/link/button.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from "react";
+import { Component } from "@bouku/core";
+type ButtonProps = Component & {
+    variant?: "surface" | "outline" | "ghost" | "error";
+    size?: "xs" | "sm" | "md" | "lg";
+    icon?: ReactNode;
+    disabled?: boolean;
+};
+type Props = ButtonProps & {
+    href: string;
+    download?: string;
+};
+export declare function LinkButton({ href, download, disabled, ...props }: Props): import("react").JSX.Element;
+export default LinkButton;

package/dist/link/button.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LinkButton = LinkButton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const link_1 = __importDefault(require("next/link"));
+const core_1 = require("@bouku/core");
+function LinkButton({ href, download, disabled, ...props }) {
+    if (disabled)
+        return (0, jsx_runtime_1.jsx)(core_1.Button, { ...props, disabled: true });
+    return ((0, jsx_runtime_1.jsx)(link_1.default, { href: href, download: download, children: (0, jsx_runtime_1.jsx)(core_1.Button, { ...props }) }));
+}
+exports.default = LinkButton;

package/dist/link/dropdown-nav.d.ts

@@ -0,0 +1,9 @@
+type TabRoute = {
+    icon?: React.ReactNode;
+    label: string;
+    to: string;
+};
+export declare function DropdownNav({ items }: {
+    items: TabRoute[];
+}): import("react").JSX.Element;
+export default DropdownNav;

package/dist/link/dropdown-nav.js

@@ -0,0 +1,17 @@
+"use client";
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DropdownNav = DropdownNav;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const navigation_1 = require("next/navigation");
+const core_1 = require("@bouku/core");
+const bars_svg_1 = __importDefault(require("../assets/icons/bars.svg"));
+function DropdownNav({ items }) {
+    const router = (0, navigation_1.useRouter)();
+    const tabs = items.map(x => ({ ...x, action: () => router.push(x.to) }));
+    return ((0, jsx_runtime_1.jsx)(core_1.Dropdown, { options: tabs, children: (0, jsx_runtime_1.jsx)(bars_svg_1.default, {}) }));
+}
+exports.default = DropdownNav;

package/dist/link/normal.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from "react";
+type Props = {
+    style?: string;
+    to?: string;
+    underline?: boolean;
+    download?: string;
+    disabled?: boolean;
+    children: ReactNode;
+};
+export declare function Link({ style, to, download, underline, disabled, ...props }: Props): import("react").JSX.Element;
+export default Link;

package/dist/link/normal.js

@@ -0,0 +1,26 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Link = Link;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const link_1 = __importDefault(require("next/link"));
+const style_1 = require("@bouko/style");
+const tailwind_variants_1 = require("tailwind-variants");
+function Link({ style, to = "/", download, underline = false, disabled, ...props }) {
+    if (disabled)
+        return ((0, jsx_runtime_1.jsx)("div", { className: (0, style_1.cn)(styles({ underline }), style, "cursor-not-allowed"), ...props }));
+    if (to.includes("https"))
+        return ((0, jsx_runtime_1.jsx)("a", { className: (0, style_1.cn)(styles({ underline }), style), href: to, target: "_blank", rel: "noopener noreferrer", ...props }));
+    return ((0, jsx_runtime_1.jsx)(link_1.default, { className: (0, style_1.cn)(styles({ underline }), style), href: to, download: download, passHref: true, ...props }));
+}
+const styles = (0, tailwind_variants_1.tv)({
+    base: "text-accent hover:text-accent-light duration-200",
+    variants: {
+        underline: {
+            true: "text-primary-dark hover:text-primary underline underline-offset-4 decoration-border-light hover:decoration-accent"
+        }
+    }
+});
+exports.default = Link;

package/dist/link/tab.d.ts

@@ -0,0 +1,7 @@
+type Props = {
+    id: string;
+    icon?: React.ReactNode;
+    label?: string;
+};
+export declare function Tab({ id, icon, label }: Props): import("react").JSX.Element;
+export {};

package/dist/link/tab.js

@@ -0,0 +1,21 @@
+"use client";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tab = Tab;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const navigation_1 = require("next/navigation");
+const style_1 = require("@bouko/style");
+const normal_1 = require("./normal");
+function Tab({ id, icon, label }) {
+    const path = (0, navigation_1.usePathname)();
+    const isActive = path === ("/" + id) || (path === "/" && id === "root");
+    if (isActive)
+        return ((0, jsx_runtime_1.jsxs)("span", { className: (0, style_1.cn)(styles.tab, "!text-accent font-medium bg-accent-dark/20 border-accent/10 cursor-not-allowed"), children: [icon, label ?? id] }, id));
+    return ((0, jsx_runtime_1.jsxs)(normal_1.Link, { style: styles.tab, to: id === "root" ? "/" : ("/" + id), children: [icon, label ?? id] }, id));
+}
+const styles = {
+    container: "items-center gap-12 w-72 h-full px-3 py-6 bg-background-light border-r-2 border-border shadow",
+    logo: "w-2/3 h-auto",
+    nav: "gap-6 w-full",
+    tab: "flex items-center gap-2 w-full border border-transparent rounded px-3 py-2 text-sm uppercase text-primary-dark hover:text-primary duration-200"
+};

package/dist/link/tabs.d.ts

@@ -0,0 +1,12 @@
+type Props = {
+    style?: string;
+    pages: Page[];
+};
+type Page = {
+    id: string;
+    route: string;
+    label: string;
+    disabled?: boolean;
+};
+export default function Tabs({ style, pages }: Props): import("react").JSX.Element;
+export {};

package/dist/link/tabs.js

@@ -0,0 +1,20 @@
+"use client";
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = Tabs;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const navigation_1 = require("next/navigation");
+const normal_1 = __importDefault(require("./normal"));
+const core_1 = require("@bouku/core");
+const style_1 = require("@bouko/style");
+function Tabs({ style, pages }) {
+    const pathname = (0, navigation_1.usePathname)();
+    return ((0, jsx_runtime_1.jsx)(core_1.RowBox, { style: (0, style_1.cn)(styles.container, style), children: pages.map((item) => ((0, jsx_runtime_1.jsx)(normal_1.default, { style: (0, style_1.cn)(styles.tab, pathname === item.route && "!border-accent !text-primary !cursor-default", item.disabled && "pointer-events-none !cursor-not-allowed"), to: item.route, disabled: item.disabled, children: item.label ?? item.id }, item.id))) }));
+}
+const styles = {
+    container: "gap-5 sm:gap-8",
+    tab: "flex items-center gap-2 py-1 border-b-2 border-slate-700/60 hover:border-slate-600/50 duration-200 text-slate-300 hover:text-primary-dark font-roboto text-xs sm:text-sm uppercase tracking-wide"
+};

package/dist/pages/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./layouts/_";
+export * from "./templates/_";

package/dist/pages/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./layouts/_"), exports);
+__exportStar(require("./templates/_"), exports);

package/dist/pages/layouts/_.d.ts

@@ -0,0 +1,3 @@
+export { default as NormalLayout } from "./normal";
+export { default as LockedLayout } from "./locked";
+export { default as DashboardLayout } from "./dashboard";

package/dist/pages/layouts/_.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashboardLayout = exports.LockedLayout = exports.NormalLayout = void 0;
+var normal_1 = require("./normal");
+Object.defineProperty(exports, "NormalLayout", { enumerable: true, get: function () { return __importDefault(normal_1).default; } });
+var locked_1 = require("./locked");
+Object.defineProperty(exports, "LockedLayout", { enumerable: true, get: function () { return __importDefault(locked_1).default; } });
+var dashboard_1 = require("./dashboard");
+Object.defineProperty(exports, "DashboardLayout", { enumerable: true, get: function () { return __importDefault(dashboard_1).default; } });

package/dist/pages/layouts/dashboard.d.ts

@@ -0,0 +1,25 @@
+import type { ReactNode } from "react";
+import type { StaticImageData } from "next/image";
+type Props = {
+    logo: StaticImageData;
+    fonts: string[];
+    pages: Record<string, {
+        id: string;
+        icon?: ReactNode;
+        label?: string;
+    }[]>;
+    providers: ReactNode[];
+    children: ReactNode;
+};
+export declare const DashboardLayout: ({ logo, fonts, pages, providers, children }: Props) => import("react").JSX.Element;
+type Item = {
+    id: string;
+    icon?: ReactNode;
+    label?: string;
+};
+type SidebarProps = {
+    logo: StaticImageData;
+    tabs: Record<string, Item[]>;
+};
+export declare function Sidebar({ logo, tabs }: SidebarProps): import("react").JSX.Element;
+export default DashboardLayout;

package/dist/pages/layouts/dashboard.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashboardLayout = void 0;
+exports.Sidebar = Sidebar;
+const react_1 = require("react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@bouku/core");
+const _1 = require("../../components/link/_");
+const _2 = require("../../components/image/_");
+const tab_1 = require("../../components/link/tab");
+const style_1 = require("@bouko/style");
+const DashboardLayout = ({ logo, fonts, pages, providers, children }) => ((0, jsx_runtime_1.jsx)("html", { lang: "en", className: (0, style_1.cn)(...fonts, "scroll-smooth"), children: (0, jsx_runtime_1.jsx)("body", { className: s.page, children: (0, jsx_runtime_1.jsxs)("main", { className: s.container, children: [(0, jsx_runtime_1.jsx)(Sidebar, { logo: logo, tabs: pages }), (0, jsx_runtime_1.jsx)(core_1.ColumnBox, { style: s.content, children: children }), providers] }) }) }));
+exports.DashboardLayout = DashboardLayout;
+const s = {
+    page: "h-[100dvh] bg-background font-sans text-primary select-none overflow-hidden antialiased",
+    container: "flex w-full h-full overflow-hidden",
+    content: "grow justify-center items-start w-full p-8"
+};
+function Sidebar({ logo, tabs }) {
+    return ((0, jsx_runtime_1.jsxs)(core_1.ColumnBox, { style: styles.container, children: [(0, jsx_runtime_1.jsx)(_1.Link, { style: styles.logo, to: "/", children: (0, jsx_runtime_1.jsx)(_2.Image, { src: logo, style: "w-full h-full", width: 100, height: 50, alt: "Logo" }) }), (0, jsx_runtime_1.jsx)(core_1.ColumnBox, { style: styles.nav, children: Object.entries(tabs).map(([section, routes], i) => ((0, jsx_runtime_1.jsxs)(core_1.ColumnBox, { style: "gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "px-3 tracking-wider font-mono text-xs uppercase font-light text-primary-dark/80", children: section }), (0, jsx_runtime_1.jsx)(core_1.ColumnBox, { style: "gap-1", children: routes.map((opts, i) => ((0, react_1.createElement)(tab_1.Tab, { ...opts, key: i }))) })] }, i))) })] }));
+}
+const styles = {
+    container: "items-center gap-12 w-72 h-full px-3 py-6 bg-background-light border-r-2 border-border shadow",
+    logo: "w-2/3 h-auto",
+    nav: "gap-6 w-full",
+    tab: "flex items-center gap-2 w-full border border-transparent rounded px-3 py-2 text-sm uppercase text-primary-dark hover:text-primary duration-200"
+};
+exports.default = exports.DashboardLayout;

package/dist/pages/layouts/locked.d.ts

@@ -0,0 +1,35 @@
+import { ReactNode } from "react";
+export declare const Header: ({ children }: {
+    children: React.ReactNode;
+}) => import("react").JSX.Element;
+/**
+ * Application footer component containing copyright and legal links
+ *
+ * Layout:
+ * - Desktop: Horizontal layout with copyright on left, links on right
+ * - Mobile: Vertical stacked layout with copyright above links
+ *
+ * Used in the main layout to provide persistent footer across all pages
+**/
+export declare const Footer: ({ company }: {
+    company?: string;
+}) => import("react").JSX.Element;
+/**
+ * Problems:
+ *
+ * 1. Move to `@bouko/next` or `@bouku/core`
+ * 2. Wrong link component for external
+**/
+type Props = {
+    variant?: "normal" | "locked";
+    company?: string;
+    header?: ReactNode[];
+    fonts: string[];
+    Providers?: ({ children }: {
+        children: ReactNode;
+    }) => React.JSX.Element;
+    authed?: boolean;
+    children: ReactNode;
+};
+declare const LockedLayout: ({ company, header, fonts, children }: Props) => import("react").JSX.Element;
+export default LockedLayout;

package/dist/pages/layouts/locked.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Footer = exports.Header = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@bouku/core");
+const _1 = require("../../components/link/_");
+const style_1 = require("@bouko/style");
+const Header = ({ children }) => ((0, jsx_runtime_1.jsx)(core_1.RowBox, { style: "justify-between items-center gap-6 w-full p-5", children: children }));
+exports.Header = Header;
+/**
+ * Application footer component containing copyright and legal links
+ *
+ * Layout:
+ * - Desktop: Horizontal layout with copyright on left, links on right
+ * - Mobile: Vertical stacked layout with copyright above links
+ *
+ * Used in the main layout to provide persistent footer across all pages
+**/
+const Footer = ({ company }) => ((0, jsx_runtime_1.jsxs)(core_1.RowBox, { style: (0, style_1.cn)(footerStyles.container, footerStyles.text), children: [(0, jsx_runtime_1.jsxs)("span", { children: ["Copyright \u00A9 2025 ", company] }), (0, jsx_runtime_1.jsxs)(core_1.RowBox, { style: footerStyles.links, children: [(0, jsx_runtime_1.jsx)(_1.Link, { to: "/legal/terms", underline: true, children: "Terms of Service" }), (0, jsx_runtime_1.jsx)(_1.Link, { to: "/legal/privacy", underline: true, children: "Privacy Policy" })] })] }));
+exports.Footer = Footer;
+const footerStyles = {
+    container: "max-sm:flex-col justify-between sm:items-center gap-3 sm:gap-6 w-full p-6",
+    text: "text-sm text-primary-dark",
+    links: "items-center gap-4"
+};
+const LockedLayout = ({ company, header, fonts, children }) => ((0, jsx_runtime_1.jsx)("html", { lang: "en", className: (0, style_1.cn)(...fonts, "scroll-smooth"), children: (0, jsx_runtime_1.jsx)("body", { className: s.page, children: (0, jsx_runtime_1.jsxs)("main", { className: s.container, children: [header && (0, jsx_runtime_1.jsx)(exports.Header, { children: header }), (0, jsx_runtime_1.jsx)("div", { className: s.content, children: children }), (0, jsx_runtime_1.jsx)(exports.Footer, { company: company })] }) }) }));
+const s = {
+    page: "h-[100dvh] bg-background font-sans text-primary select-none antialiased overflow-hidden",
+    container: "flex flex-col w-full h-full mx-auto max-w-[82rem] overflow-hidden",
+    content: "flex grow justify-center items-start w-full p-8overflow-x-hidden overflow-y-auto no-scrollbar"
+};
+exports.default = LockedLayout;

package/dist/pages/layouts/normal.d.ts

@@ -0,0 +1,35 @@
+import { ReactNode } from "react";
+export declare const Header: ({ children }: {
+    children: React.ReactNode;
+}) => import("react").JSX.Element;
+/**
+ * Application footer component containing copyright and legal links
+ *
+ * Layout:
+ * - Desktop: Horizontal layout with copyright on left, links on right
+ * - Mobile: Vertical stacked layout with copyright above links
+ *
+ * Used in the main layout to provide persistent footer across all pages
+**/
+export declare const Footer: ({ company }: {
+    company?: string;
+}) => import("react").JSX.Element;
+/**
+ * Problems:
+ *
+ * 1. Move to `@bouko/next` or `@bouku/core`
+ * 2. Wrong link component for external
+**/
+type Props = {
+    variant?: "normal" | "locked";
+    company?: string;
+    header?: ReactNode[];
+    fonts: string[];
+    Providers?: ({ children }: {
+        children: ReactNode;
+    }) => React.JSX.Element;
+    authed?: boolean;
+    children: ReactNode;
+};
+declare const NormalLayout: ({ company, header, fonts, children }: Props) => import("react").JSX.Element;
+export default NormalLayout;

package/dist/pages/layouts/normal.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Footer = exports.Header = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@bouku/core");
+const _1 = require("../../components/link/_");
+const style_1 = require("@bouko/style");
+const Header = ({ children }) => ((0, jsx_runtime_1.jsx)(core_1.RowBox, { style: "justify-between items-center gap-6 w-full p-5", children: children }));
+exports.Header = Header;
+/**
+ * Application footer component containing copyright and legal links
+ *
+ * Layout:
+ * - Desktop: Horizontal layout with copyright on left, links on right
+ * - Mobile: Vertical stacked layout with copyright above links
+ *
+ * Used in the main layout to provide persistent footer across all pages
+**/
+const Footer = ({ company }) => ((0, jsx_runtime_1.jsxs)(core_1.RowBox, { style: (0, style_1.cn)(footerStyles.container, footerStyles.text), children: [(0, jsx_runtime_1.jsxs)("span", { children: ["Copyright \u00A9 2025 ", company] }), (0, jsx_runtime_1.jsxs)(core_1.RowBox, { style: footerStyles.links, children: [(0, jsx_runtime_1.jsx)(_1.Link, { to: "/legal/terms", underline: true, children: "Terms of Service" }), (0, jsx_runtime_1.jsx)(_1.Link, { to: "/legal/privacy", underline: true, children: "Privacy Policy" })] })] }));
+exports.Footer = Footer;
+const footerStyles = {
+    container: "max-sm:flex-col justify-between sm:items-center gap-3 sm:gap-6 w-full p-6",
+    text: "text-sm text-primary-dark",
+    links: "items-center gap-4"
+};
+const NormalLayout = ({ company, header, fonts, children }) => ((0, jsx_runtime_1.jsx)("html", { lang: "en", className: (0, style_1.cn)(...fonts, "scroll-smooth"), children: (0, jsx_runtime_1.jsx)("body", { className: s.page, children: (0, jsx_runtime_1.jsxs)("main", { className: s.container, children: [(0, jsx_runtime_1.jsx)(exports.Header, { children: header }), (0, jsx_runtime_1.jsx)("div", { className: s.content, children: children }), (0, jsx_runtime_1.jsx)(exports.Footer, { company: company })] }) }) }));
+const s = {
+    page: "h-[100dvh] bg-background font-sans text-primary select-none overflow-auto antialiased",
+    container: "flex flex-col w-full h-full mx-auto max-w-[82rem]",
+    content: "flex grow justify-center items-start w-full p-8"
+};
+exports.default = NormalLayout;

package/dist/pages/templates/_.d.ts

@@ -0,0 +1 @@
+export { default as DashboardTemplate } from "./dashboard";

package/dist/pages/templates/_.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashboardTemplate = void 0;
+var dashboard_1 = require("./dashboard");
+Object.defineProperty(exports, "DashboardTemplate", { enumerable: true, get: function () { return __importDefault(dashboard_1).default; } });

package/dist/pages/templates/dashboard.d.ts

@@ -0,0 +1,19 @@
+import type { ReactNode } from "react";
+interface Props {
+    title: string;
+    actions?: ReactNode[];
+    children: ReactNode;
+}
+/**
+ * Dashboard Page Template.
+ *
+ * Displays a header with a tile in the top left and row
+ * of buttons (global page actions) in the top right.
+ * Below is a scroll-constrained content area.
+ *
+ * @param title - Text displayed as the page heading.
+ * @param actions - Global page action buttons displayed in top right.
+ * @param children - Main dashboard content.
+**/
+declare const DashboardTemplate: ({ title, actions, children }: Props) => import("react").JSX.Element;
+export default DashboardTemplate;

package/dist/pages/templates/dashboard.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@bouku/core");
+;
+/**
+ * Dashboard Page Template.
+ *
+ * Displays a header with a tile in the top left and row
+ * of buttons (global page actions) in the top right.
+ * Below is a scroll-constrained content area.
+ *
+ * @param title - Text displayed as the page heading.
+ * @param actions - Global page action buttons displayed in top right.
+ * @param children - Main dashboard content.
+**/
+const DashboardTemplate = ({ title, actions = [], children }) => ((0, jsx_runtime_1.jsxs)(core_1.ColumnBox, { style: s.page, children: [(0, jsx_runtime_1.jsxs)(core_1.RowBox, { style: s.header, children: [(0, jsx_runtime_1.jsx)("span", { className: s.title, children: title }), (0, jsx_runtime_1.jsx)(core_1.RowBox, { style: "gap-2", children: actions })] }), (0, jsx_runtime_1.jsx)(core_1.ColumnBox, { style: s.content, children: children })] }));
+const s = {
+    page: "gap-5 w-full h-full overflow-hidden",
+    header: "justify-between items-center gap-2",
+    title: "text-3xl font-bold",
+    content: "gap-6 grow w-full overflow-hidden"
+};
+exports.default = DashboardTemplate;

package/dist/templates/_.d.ts

@@ -0,0 +1 @@
+export { default as DashboardTemplate } from "./dashboard";

package/dist/templates/_.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashboardTemplate = void 0;
+var dashboard_1 = require("./dashboard");
+Object.defineProperty(exports, "DashboardTemplate", { enumerable: true, get: function () { return __importDefault(dashboard_1).default; } });

package/dist/templates/dashboard.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from "react";
+declare const DashboardTemplate: ({ title, children }: {
+    title: string;
+    children: ReactNode;
+}) => import("react").JSX.Element;
+export default DashboardTemplate;

package/dist/templates/dashboard.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@bouku/core");
+const DashboardTemplate = ({ title, children }) => ((0, jsx_runtime_1.jsxs)(core_1.ColumnBox, { style: s.page, children: [(0, jsx_runtime_1.jsx)("span", { className: s.title, children: title }), (0, jsx_runtime_1.jsx)(core_1.ColumnBox, { style: s.content, children: children })] }));
+const s = {
+    page: "gap-5 w-full h-full overflow-hidden",
+    title: "text-3xl font-bold",
+    content: "gap-6 grow w-full overflow-hidden"
+};
+exports.default = DashboardTemplate;

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@bouku/next",
+  "version": "0.0.2",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "license": "MIT",
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "engines": {},
+  "scripts": {
+    "build": "tsc"
+  },
+  "peerDependencies": {
+    "next": "^15.4.6" 
+  },
+  "dependencies": {
+    "@bouko/style": "^0.2.1",
+    "@bouku/core": "^0.0.1",
+    "tailwind-variants": "^3.2.2"
+  },
+  "devDependencies": {
+    "@types/node": "^24.3.0",
+    "@types/react": "^19.1.10",
+    "next": "^15.4.6",
+    "typescript": "^5.9.2"
+  }
+}