@jameskabz/nextcraft-ui 0.5.0 → 0.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +94 -0
- package/dist/chunk-6F7FN2ZF.js +671 -0
- package/dist/chunk-6F7FN2ZF.js.map +1 -0
- package/dist/chunk-7Q4Z47HT.js +657 -0
- package/dist/chunk-7Q4Z47HT.js.map +1 -0
- package/dist/chunk-7SKDTIEK.js +49 -0
- package/dist/chunk-7SKDTIEK.js.map +1 -0
- package/dist/chunk-FEFH5O5K.js +49 -0
- package/dist/chunk-FEFH5O5K.js.map +1 -0
- package/dist/chunk-M2EKVXB6.js +127 -0
- package/dist/chunk-M2EKVXB6.js.map +1 -0
- package/dist/chunk-SBLIF6UU.js +1029 -0
- package/dist/chunk-SBLIF6UU.js.map +1 -0
- package/dist/chunk-VQ6T3HIX.js +9 -0
- package/dist/chunk-VQ6T3HIX.js.map +1 -0
- package/dist/chunk-YVZL4GET.js +328 -0
- package/dist/chunk-YVZL4GET.js.map +1 -0
- package/dist/chunk-ZRV4Y374.js +582 -0
- package/dist/chunk-ZRV4Y374.js.map +1 -0
- package/dist/craft/components.cjs +1838 -0
- package/dist/craft/components.cjs.map +1 -0
- package/dist/craft/components.d.cts +369 -0
- package/dist/craft/components.d.ts +369 -0
- package/dist/craft/components.js +78 -0
- package/dist/craft/components.js.map +1 -0
- package/dist/craft/forms.cjs +1376 -0
- package/dist/craft/forms.cjs.map +1 -0
- package/dist/craft/forms.d.cts +101 -0
- package/dist/craft/forms.d.ts +101 -0
- package/dist/craft/forms.js +14 -0
- package/dist/craft/forms.js.map +1 -0
- package/dist/craft/layout.cjs +410 -0
- package/dist/craft/layout.cjs.map +1 -0
- package/dist/craft/layout.d.cts +170 -0
- package/dist/craft/layout.d.ts +170 -0
- package/dist/craft/layout.js +27 -0
- package/dist/craft/layout.js.map +1 -0
- package/dist/craft/table.cjs +662 -0
- package/dist/craft/table.cjs.map +1 -0
- package/dist/craft/table.d.cts +99 -0
- package/dist/craft/table.d.ts +99 -0
- package/dist/craft/table.js +15 -0
- package/dist/craft/table.js.map +1 -0
- package/dist/craft/theme.cjs +166 -0
- package/dist/craft/theme.cjs.map +1 -0
- package/dist/craft/theme.d.cts +10 -0
- package/dist/craft/theme.d.ts +10 -0
- package/dist/craft/theme.js +12 -0
- package/dist/craft/theme.js.map +1 -0
- package/dist/index.cjs +1000 -299
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +10 -499
- package/dist/index.d.ts +10 -499
- package/dist/index.js +81 -2689
- package/dist/index.js.map +1 -1
- package/dist/styles.css +124 -0
- package/dist/theme-context-EVI9PfKv.d.cts +22 -0
- package/dist/theme-context-EVI9PfKv.d.ts +22 -0
- package/package.json +28 -1
|
@@ -0,0 +1,410 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// src/craft/layout.ts
|
|
31
|
+
var layout_exports = {};
|
|
32
|
+
__export(layout_exports, {
|
|
33
|
+
AppShell: () => AppShell,
|
|
34
|
+
AppTemplate: () => AppTemplate,
|
|
35
|
+
AuthLayout: () => AuthLayout,
|
|
36
|
+
Breadcrumbs: () => Breadcrumbs,
|
|
37
|
+
Container: () => Container,
|
|
38
|
+
Grid: () => Grid,
|
|
39
|
+
PageHeader: () => PageHeader,
|
|
40
|
+
Sidebar: () => Sidebar,
|
|
41
|
+
TopNav: () => TopNav,
|
|
42
|
+
layoutConfigSchema: () => layoutConfigSchema
|
|
43
|
+
});
|
|
44
|
+
module.exports = __toCommonJS(layout_exports);
|
|
45
|
+
|
|
46
|
+
// src/utils/cn.ts
|
|
47
|
+
function cn(...values) {
|
|
48
|
+
return values.filter(Boolean).join(" ");
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
// src/components/layout/app-shell.tsx
|
|
52
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
53
|
+
function AppShell({ className, sidebar, topNav, children, ...props }) {
|
|
54
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
55
|
+
"div",
|
|
56
|
+
{
|
|
57
|
+
className: cn(
|
|
58
|
+
"grid min-h-screen grid-cols-1 gap-6 bg-background p-6 lg:grid-cols-[260px_1fr]",
|
|
59
|
+
className
|
|
60
|
+
),
|
|
61
|
+
...props,
|
|
62
|
+
children: [
|
|
63
|
+
sidebar && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-full lg:sticky lg:top-6 lg:self-start lg:max-h-[calc(100vh-3rem)] lg:overflow-y-auto", children: sidebar }),
|
|
64
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-6", children: [
|
|
65
|
+
topNav && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "lg:sticky lg:top-6 lg:z-20", children: topNav }),
|
|
66
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("main", { className: "flex-1", children })
|
|
67
|
+
] })
|
|
68
|
+
]
|
|
69
|
+
}
|
|
70
|
+
);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
// src/components/layout/app-template.tsx
|
|
74
|
+
var React2 = __toESM(require("react"), 1);
|
|
75
|
+
|
|
76
|
+
// src/components/craft-icon.tsx
|
|
77
|
+
var React = __toESM(require("react"), 1);
|
|
78
|
+
var import_dynamic = require("lucide-react/dynamic");
|
|
79
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
80
|
+
var CraftIconContext = React.createContext(null);
|
|
81
|
+
function CraftIcon({
|
|
82
|
+
name,
|
|
83
|
+
className,
|
|
84
|
+
"aria-label": ariaLabel,
|
|
85
|
+
icons,
|
|
86
|
+
useLucide = true
|
|
87
|
+
}) {
|
|
88
|
+
const contextRegistry = React.useContext(CraftIconContext);
|
|
89
|
+
const registry = icons != null ? icons : contextRegistry;
|
|
90
|
+
const icon = registry == null ? void 0 : registry[name];
|
|
91
|
+
if (!icon) {
|
|
92
|
+
if (!useLucide) return null;
|
|
93
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
94
|
+
import_dynamic.DynamicIcon,
|
|
95
|
+
{
|
|
96
|
+
name,
|
|
97
|
+
className,
|
|
98
|
+
"aria-hidden": ariaLabel ? void 0 : true,
|
|
99
|
+
"aria-label": ariaLabel
|
|
100
|
+
}
|
|
101
|
+
);
|
|
102
|
+
}
|
|
103
|
+
if (React.isValidElement(icon)) {
|
|
104
|
+
return React.cloneElement(icon, {
|
|
105
|
+
className: cn(icon.props.className, className),
|
|
106
|
+
"aria-hidden": ariaLabel ? void 0 : true,
|
|
107
|
+
"aria-label": ariaLabel
|
|
108
|
+
});
|
|
109
|
+
}
|
|
110
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className, "aria-label": ariaLabel, children: icon });
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
// src/components/layout/breadcrumbs.tsx
|
|
114
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
115
|
+
function Breadcrumbs({ className, items, ...props }) {
|
|
116
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("nav", { className: cn("flex items-center text-sm text-[rgb(var(--nc-fg-muted))]", className), ...props, children: items.map((item, index) => {
|
|
117
|
+
const content = item.href ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("a", { href: item.href, className: "transition hover:text-[rgb(var(--nc-fg))]", children: item.label }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-[rgb(var(--nc-fg))]", children: item.label });
|
|
118
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { className: "flex items-center", children: [
|
|
119
|
+
content,
|
|
120
|
+
index < items.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "mx-2 text-[rgb(var(--nc-fg-soft))]", children: "/" })
|
|
121
|
+
] }, `${item.label}-${index}`);
|
|
122
|
+
}) });
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
// src/components/layout/sidebar.tsx
|
|
126
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
127
|
+
function Sidebar({ className, title, items, footer, ...props }) {
|
|
128
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
129
|
+
"aside",
|
|
130
|
+
{
|
|
131
|
+
className: cn(
|
|
132
|
+
"flex h-full w-full flex-col gap-6 rounded-3xl border border-[rgb(var(--nc-border)/0.3)] bg-[rgb(var(--nc-surface)/0.08)] p-6 text-[rgb(var(--nc-fg))] backdrop-blur-xl",
|
|
133
|
+
className
|
|
134
|
+
),
|
|
135
|
+
...props,
|
|
136
|
+
children: [
|
|
137
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "text-lg font-semibold", children: title }),
|
|
138
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("nav", { className: "flex flex-col gap-2", children: items.map((item, index) => {
|
|
139
|
+
var _a;
|
|
140
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
141
|
+
"a",
|
|
142
|
+
{
|
|
143
|
+
href: (_a = item.href) != null ? _a : "#",
|
|
144
|
+
className: cn(
|
|
145
|
+
"flex items-center gap-3 rounded-2xl px-3 py-2 text-sm transition",
|
|
146
|
+
item.active ? "bg-[rgb(var(--nc-accent-1)/0.25)] text-[rgb(var(--nc-fg))]" : "text-[rgb(var(--nc-fg-muted))] hover:bg-[rgb(var(--nc-surface)/0.12)] hover:text-[rgb(var(--nc-fg))]"
|
|
147
|
+
),
|
|
148
|
+
children: [
|
|
149
|
+
item.icon,
|
|
150
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: item.label })
|
|
151
|
+
]
|
|
152
|
+
},
|
|
153
|
+
`${item.label}-${index}`
|
|
154
|
+
);
|
|
155
|
+
}) }),
|
|
156
|
+
footer && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-auto pt-4", children: footer })
|
|
157
|
+
]
|
|
158
|
+
}
|
|
159
|
+
);
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
// src/components/layout/top-nav.tsx
|
|
163
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
164
|
+
function TopNav({ className, title, actions, breadcrumb, ...props }) {
|
|
165
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
166
|
+
"header",
|
|
167
|
+
{
|
|
168
|
+
className: cn(
|
|
169
|
+
"flex flex-wrap items-center justify-between gap-4 rounded-3xl border border-[rgb(var(--nc-border)/0.3)] bg-[rgb(var(--nc-surface)/0.08)] px-6 py-4 text-[rgb(var(--nc-fg))] backdrop-blur-xl",
|
|
170
|
+
className
|
|
171
|
+
),
|
|
172
|
+
...props,
|
|
173
|
+
children: [
|
|
174
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "space-y-1", children: [
|
|
175
|
+
breadcrumb,
|
|
176
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "text-xl font-semibold", children: title })
|
|
177
|
+
] }),
|
|
178
|
+
actions && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex flex-wrap gap-3", children: actions })
|
|
179
|
+
]
|
|
180
|
+
}
|
|
181
|
+
);
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
// src/components/layout/app-template.tsx
|
|
185
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
186
|
+
function AppTemplate({
|
|
187
|
+
config,
|
|
188
|
+
headerActions,
|
|
189
|
+
headerBreadcrumb,
|
|
190
|
+
sidebarFooter,
|
|
191
|
+
resolveIcon,
|
|
192
|
+
icons,
|
|
193
|
+
activePath,
|
|
194
|
+
getActivePath,
|
|
195
|
+
lucideFallback = true,
|
|
196
|
+
children
|
|
197
|
+
}) {
|
|
198
|
+
const sidebarConfig = config.sidebar;
|
|
199
|
+
const headerConfig = config.header;
|
|
200
|
+
const resolvedActivePath = activePath != null ? activePath : getActivePath == null ? void 0 : getActivePath();
|
|
201
|
+
const buildIcon = React2.useCallback(
|
|
202
|
+
(name) => {
|
|
203
|
+
if (!name) return void 0;
|
|
204
|
+
if (resolveIcon) return resolveIcon(name);
|
|
205
|
+
if (icons == null ? void 0 : icons[name]) return icons[name];
|
|
206
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(CraftIcon, { name, useLucide: lucideFallback });
|
|
207
|
+
},
|
|
208
|
+
[icons, lucideFallback, resolveIcon]
|
|
209
|
+
);
|
|
210
|
+
const sidebarItems = sidebarConfig ? sidebarConfig.items.map((item) => {
|
|
211
|
+
var _a;
|
|
212
|
+
return {
|
|
213
|
+
label: item.label,
|
|
214
|
+
href: item.href,
|
|
215
|
+
active: (_a = item.active) != null ? _a : resolvedActivePath && item.href ? item.href === resolvedActivePath : false,
|
|
216
|
+
icon: buildIcon(item.icon)
|
|
217
|
+
};
|
|
218
|
+
}) : null;
|
|
219
|
+
const breadcrumbNode = headerBreadcrumb != null ? headerBreadcrumb : (headerConfig == null ? void 0 : headerConfig.breadcrumb) ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Breadcrumbs, { items: headerConfig.breadcrumb }) : null;
|
|
220
|
+
const sidebarFooterNode = sidebarFooter != null ? sidebarFooter : (sidebarConfig == null ? void 0 : sidebarConfig.footerText) ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "text-xs text-[rgb(var(--nc-fg-muted))]", children: sidebarConfig.footerText }) : null;
|
|
221
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
222
|
+
AppShell,
|
|
223
|
+
{
|
|
224
|
+
sidebar: sidebarConfig && sidebarItems ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
225
|
+
Sidebar,
|
|
226
|
+
{
|
|
227
|
+
title: sidebarConfig.title,
|
|
228
|
+
items: sidebarItems,
|
|
229
|
+
footer: sidebarFooterNode
|
|
230
|
+
}
|
|
231
|
+
) : void 0,
|
|
232
|
+
topNav: headerConfig ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
233
|
+
TopNav,
|
|
234
|
+
{
|
|
235
|
+
title: headerConfig.title,
|
|
236
|
+
breadcrumb: breadcrumbNode,
|
|
237
|
+
actions: headerActions
|
|
238
|
+
}
|
|
239
|
+
) : void 0,
|
|
240
|
+
children
|
|
241
|
+
}
|
|
242
|
+
);
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
// src/components/layout/page-header.tsx
|
|
246
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
247
|
+
function PageHeader({
|
|
248
|
+
className,
|
|
249
|
+
title,
|
|
250
|
+
description,
|
|
251
|
+
actions,
|
|
252
|
+
...props
|
|
253
|
+
}) {
|
|
254
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
|
|
255
|
+
"div",
|
|
256
|
+
{
|
|
257
|
+
className: cn("flex flex-wrap items-start justify-between gap-6", className),
|
|
258
|
+
...props,
|
|
259
|
+
children: [
|
|
260
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "space-y-2", children: [
|
|
261
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h1", { className: "text-3xl font-bold text-[rgb(var(--nc-fg))]", children: title }),
|
|
262
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[rgb(var(--nc-fg-muted))]", children: description })
|
|
263
|
+
] }),
|
|
264
|
+
actions && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex flex-wrap gap-3", children: actions })
|
|
265
|
+
]
|
|
266
|
+
}
|
|
267
|
+
);
|
|
268
|
+
}
|
|
269
|
+
|
|
270
|
+
// src/components/layout/auth-layout.tsx
|
|
271
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
272
|
+
function AuthLayout({
|
|
273
|
+
className,
|
|
274
|
+
title,
|
|
275
|
+
description,
|
|
276
|
+
footer,
|
|
277
|
+
graphic,
|
|
278
|
+
children,
|
|
279
|
+
...props
|
|
280
|
+
}) {
|
|
281
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
282
|
+
"div",
|
|
283
|
+
{
|
|
284
|
+
className: cn(
|
|
285
|
+
"grid min-h-screen grid-cols-1 bg-background",
|
|
286
|
+
"lg:grid-cols-[1.1fr_0.9fr]",
|
|
287
|
+
className
|
|
288
|
+
),
|
|
289
|
+
...props,
|
|
290
|
+
children: [
|
|
291
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "flex flex-col justify-center px-6 py-16 sm:px-12", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "mx-auto w-full max-w-md space-y-6", children: [
|
|
292
|
+
(title || description) && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "space-y-2", children: [
|
|
293
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h1", { className: "text-3xl font-bold text-[rgb(var(--nc-fg))]", children: title }),
|
|
294
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "text-[rgb(var(--nc-fg-muted))]", children: description })
|
|
295
|
+
] }),
|
|
296
|
+
children,
|
|
297
|
+
footer && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "text-sm text-[rgb(var(--nc-fg-muted))]", children: footer })
|
|
298
|
+
] }) }),
|
|
299
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hidden items-center justify-center border-l border-[rgb(var(--nc-border)/0.3)] bg-[rgb(var(--nc-surface)/0.08)] p-12 text-[rgb(var(--nc-fg))] lg:flex", children: graphic != null ? graphic : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "max-w-sm space-y-4 text-center", children: [
|
|
300
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h2", { className: "text-2xl font-semibold", children: "Crafted experiences" }),
|
|
301
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "text-[rgb(var(--nc-fg-muted))]", children: "Build authentication flows that feel premium and cohesive." })
|
|
302
|
+
] }) })
|
|
303
|
+
]
|
|
304
|
+
}
|
|
305
|
+
);
|
|
306
|
+
}
|
|
307
|
+
|
|
308
|
+
// src/components/layout/container.tsx
|
|
309
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
310
|
+
var sizeClasses = {
|
|
311
|
+
sm: "max-w-3xl",
|
|
312
|
+
md: "max-w-5xl",
|
|
313
|
+
lg: "max-w-6xl",
|
|
314
|
+
xl: "max-w-7xl"
|
|
315
|
+
};
|
|
316
|
+
function Container({ className, size = "lg", ...props }) {
|
|
317
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
318
|
+
"div",
|
|
319
|
+
{
|
|
320
|
+
className: cn("mx-auto w-full px-4 sm:px-6 lg:px-8", sizeClasses[size], className),
|
|
321
|
+
...props
|
|
322
|
+
}
|
|
323
|
+
);
|
|
324
|
+
}
|
|
325
|
+
|
|
326
|
+
// src/components/layout/grid.tsx
|
|
327
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
328
|
+
var colClasses = {
|
|
329
|
+
1: "grid-cols-1",
|
|
330
|
+
2: "grid-cols-1 md:grid-cols-2",
|
|
331
|
+
3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
|
|
332
|
+
4: "grid-cols-1 md:grid-cols-2 lg:grid-cols-4",
|
|
333
|
+
5: "grid-cols-1 md:grid-cols-2 lg:grid-cols-5",
|
|
334
|
+
6: "grid-cols-1 md:grid-cols-3 lg:grid-cols-6"
|
|
335
|
+
};
|
|
336
|
+
var gapClasses = {
|
|
337
|
+
sm: "gap-4",
|
|
338
|
+
md: "gap-6",
|
|
339
|
+
lg: "gap-8",
|
|
340
|
+
xl: "gap-10"
|
|
341
|
+
};
|
|
342
|
+
function Grid({ className, columns = 3, gap = "md", ...props }) {
|
|
343
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: cn("grid", colClasses[columns], gapClasses[gap], className), ...props });
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
// src/components/layout/layout-config.ts
|
|
347
|
+
var layoutConfigSchema = {
|
|
348
|
+
$schema: "https://json-schema.org/draft/2020-12/schema",
|
|
349
|
+
title: "Nextcraft UI Layout Config",
|
|
350
|
+
type: "object",
|
|
351
|
+
additionalProperties: false,
|
|
352
|
+
properties: {
|
|
353
|
+
sidebar: {
|
|
354
|
+
type: "object",
|
|
355
|
+
additionalProperties: false,
|
|
356
|
+
properties: {
|
|
357
|
+
title: { type: "string" },
|
|
358
|
+
footerText: { type: "string" },
|
|
359
|
+
items: {
|
|
360
|
+
type: "array",
|
|
361
|
+
items: {
|
|
362
|
+
type: "object",
|
|
363
|
+
additionalProperties: false,
|
|
364
|
+
properties: {
|
|
365
|
+
label: { type: "string" },
|
|
366
|
+
href: { type: "string" },
|
|
367
|
+
icon: { type: "string" },
|
|
368
|
+
active: { type: "boolean" }
|
|
369
|
+
},
|
|
370
|
+
required: ["label"]
|
|
371
|
+
}
|
|
372
|
+
}
|
|
373
|
+
},
|
|
374
|
+
required: ["items"]
|
|
375
|
+
},
|
|
376
|
+
header: {
|
|
377
|
+
type: "object",
|
|
378
|
+
additionalProperties: false,
|
|
379
|
+
properties: {
|
|
380
|
+
title: { type: "string" },
|
|
381
|
+
breadcrumb: {
|
|
382
|
+
type: "array",
|
|
383
|
+
items: {
|
|
384
|
+
type: "object",
|
|
385
|
+
additionalProperties: false,
|
|
386
|
+
properties: {
|
|
387
|
+
label: { type: "string" },
|
|
388
|
+
href: { type: "string" }
|
|
389
|
+
},
|
|
390
|
+
required: ["label"]
|
|
391
|
+
}
|
|
392
|
+
}
|
|
393
|
+
}
|
|
394
|
+
}
|
|
395
|
+
}
|
|
396
|
+
};
|
|
397
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
398
|
+
0 && (module.exports = {
|
|
399
|
+
AppShell,
|
|
400
|
+
AppTemplate,
|
|
401
|
+
AuthLayout,
|
|
402
|
+
Breadcrumbs,
|
|
403
|
+
Container,
|
|
404
|
+
Grid,
|
|
405
|
+
PageHeader,
|
|
406
|
+
Sidebar,
|
|
407
|
+
TopNav,
|
|
408
|
+
layoutConfigSchema
|
|
409
|
+
});
|
|
410
|
+
//# sourceMappingURL=layout.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/craft/layout.ts","../../src/utils/cn.ts","../../src/components/layout/app-shell.tsx","../../src/components/layout/app-template.tsx","../../src/components/craft-icon.tsx","../../src/components/layout/breadcrumbs.tsx","../../src/components/layout/sidebar.tsx","../../src/components/layout/top-nav.tsx","../../src/components/layout/page-header.tsx","../../src/components/layout/auth-layout.tsx","../../src/components/layout/container.tsx","../../src/components/layout/grid.tsx","../../src/components/layout/layout-config.ts"],"sourcesContent":["export { AppShell } from \"@/components/layout/app-shell\";\nexport type { AppShellProps } from \"@/components/layout/app-shell\";\n\nexport { AppTemplate } from \"@/components/layout/app-template\";\nexport type { AppTemplateProps } from \"@/components/layout/app-template\";\n\nexport { Sidebar } from \"@/components/layout/sidebar\";\nexport type { SidebarProps, SidebarItem } from \"@/components/layout/sidebar\";\n\nexport { TopNav } from \"@/components/layout/top-nav\";\nexport type { TopNavProps } from \"@/components/layout/top-nav\";\n\nexport { PageHeader } from \"@/components/layout/page-header\";\nexport type { PageHeaderProps } from \"@/components/layout/page-header\";\n\nexport { Breadcrumbs } from \"@/components/layout/breadcrumbs\";\nexport type { BreadcrumbsProps, BreadcrumbItem } from \"@/components/layout/breadcrumbs\";\n\nexport { AuthLayout } from \"@/components/layout/auth-layout\";\nexport type { AuthLayoutProps } from \"@/components/layout/auth-layout\";\n\nexport { Container } from \"@/components/layout/container\";\nexport type { ContainerProps } from \"@/components/layout/container\";\n\nexport { Grid } from \"@/components/layout/grid\";\nexport type { GridProps } from \"@/components/layout/grid\";\n\nexport type {\n LayoutConfig,\n LayoutSidebarItem,\n LayoutBreadcrumbItem,\n LayoutIconName,\n} from \"@/components/layout/layout-config\";\nexport { layoutConfigSchema } from \"@/components/layout/layout-config\";\n","export function cn(...values: Array<string | false | null | undefined>): string {\n return values.filter(Boolean).join(\" \");\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport type AppShellProps = React.HTMLAttributes<HTMLDivElement> & {\n sidebar?: React.ReactNode;\n topNav?: React.ReactNode;\n};\n\nexport function AppShell({ className, sidebar, topNav, children, ...props }: AppShellProps) {\n return (\n <div\n className={cn(\n \"grid min-h-screen grid-cols-1 gap-6 bg-background p-6 lg:grid-cols-[260px_1fr]\",\n className\n )}\n {...props}\n >\n {sidebar && (\n <div className=\"h-full lg:sticky lg:top-6 lg:self-start lg:max-h-[calc(100vh-3rem)] lg:overflow-y-auto\">\n {sidebar}\n </div>\n )}\n <div className=\"flex flex-col gap-6\">\n {topNav && <div className=\"lg:sticky lg:top-6 lg:z-20\">{topNav}</div>}\n <main className=\"flex-1\">{children}</main>\n </div>\n </div>\n );\n}\n","\"use client\";\n\nimport * as React from \"react\";\n\nimport { AppShell } from \"./app-shell\";\nimport { CraftIcon } from \"@/components/craft-icon\";\nimport { Breadcrumbs } from \"./breadcrumbs\";\nimport { Sidebar, type SidebarItem } from \"./sidebar\";\nimport { TopNav } from \"./top-nav\";\nimport type { LayoutConfig, LayoutSidebarItem } from \"./layout-config\";\n\nexport type AppTemplateProps = {\n config: LayoutConfig;\n headerActions?: React.ReactNode;\n headerBreadcrumb?: React.ReactNode;\n sidebarFooter?: React.ReactNode;\n resolveIcon?: (name: string) => React.ReactNode;\n icons?: Record<string, React.ReactNode>;\n activePath?: string;\n getActivePath?: () => string | undefined;\n lucideFallback?: boolean;\n children: React.ReactNode;\n};\n\nexport function AppTemplate({\n config,\n headerActions,\n headerBreadcrumb,\n sidebarFooter,\n resolveIcon,\n icons,\n activePath,\n getActivePath,\n lucideFallback = true,\n children,\n}: AppTemplateProps) {\n const sidebarConfig = config.sidebar;\n const headerConfig = config.header;\n\n const resolvedActivePath = activePath ?? getActivePath?.();\n\n const buildIcon = React.useCallback(\n (name?: string) => {\n if (!name) return undefined;\n if (resolveIcon) return resolveIcon(name);\n if (icons?.[name]) return icons[name];\n return <CraftIcon name={name} useLucide={lucideFallback} />;\n },\n [icons, lucideFallback, resolveIcon]\n );\n\n const sidebarItems: SidebarItem[] | null = sidebarConfig\n ? sidebarConfig.items.map((item: LayoutSidebarItem) => ({\n label: item.label,\n href: item.href,\n active:\n item.active ??\n (resolvedActivePath && item.href\n ? item.href === resolvedActivePath\n : false),\n icon: buildIcon(item.icon),\n }))\n : null;\n\n const breadcrumbNode =\n headerBreadcrumb ??\n (headerConfig?.breadcrumb ? (\n <Breadcrumbs items={headerConfig.breadcrumb} />\n ) : null);\n\n const sidebarFooterNode =\n sidebarFooter ??\n (sidebarConfig?.footerText ? (\n <div className=\"text-xs text-[rgb(var(--nc-fg-muted))]\">\n {sidebarConfig.footerText}\n </div>\n ) : null);\n\n return (\n <AppShell\n sidebar={\n sidebarConfig && sidebarItems ? (\n <Sidebar\n title={sidebarConfig.title}\n items={sidebarItems}\n footer={sidebarFooterNode}\n />\n ) : undefined\n }\n topNav={\n headerConfig ? (\n <TopNav\n title={headerConfig.title}\n breadcrumb={breadcrumbNode}\n actions={headerActions}\n />\n ) : undefined\n }\n >\n {children}\n </AppShell>\n );\n}\n","\"use client\";\n\nimport * as React from \"react\";\nimport { DynamicIcon } from \"lucide-react/dynamic\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport type CraftIconRegistry = Record<string, React.ReactNode>;\n\nconst CraftIconContext = React.createContext<CraftIconRegistry | null>(null);\n\nexport type CraftIconProviderProps = {\n icons: CraftIconRegistry;\n children: React.ReactNode;\n};\n\nexport function CraftIconProvider({ icons, children }: CraftIconProviderProps) {\n return <CraftIconContext.Provider value={icons}>{children}</CraftIconContext.Provider>;\n}\n\nexport type CraftIconProps = {\n name: string;\n className?: string;\n \"aria-label\"?: string;\n icons?: CraftIconRegistry;\n useLucide?: boolean;\n};\n\nexport function CraftIcon({\n name,\n className,\n \"aria-label\": ariaLabel,\n icons,\n useLucide = true,\n}: CraftIconProps) {\n const contextRegistry = React.useContext(CraftIconContext);\n const registry = icons ?? contextRegistry;\n const icon = registry?.[name];\n\n if (!icon) {\n if (!useLucide) return null;\n return (\n <DynamicIcon\n name={name as unknown as React.ComponentProps<typeof DynamicIcon>[\"name\"]}\n className={className}\n aria-hidden={ariaLabel ? undefined : true}\n aria-label={ariaLabel}\n />\n );\n }\n\n type IconElementProps = {\n className?: string;\n \"aria-hidden\"?: boolean;\n \"aria-label\"?: string;\n };\n\n if (React.isValidElement<IconElementProps>(icon)) {\n return React.cloneElement(icon, {\n className: cn(icon.props.className, className),\n \"aria-hidden\": ariaLabel ? undefined : true,\n \"aria-label\": ariaLabel,\n });\n }\n\n return (\n <span className={className} aria-label={ariaLabel}>\n {icon}\n </span>\n );\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport type BreadcrumbItem = {\n label: React.ReactNode;\n href?: string;\n};\n\nexport type BreadcrumbsProps = React.HTMLAttributes<HTMLElement> & {\n items: BreadcrumbItem[];\n};\n\nexport function Breadcrumbs({ className, items, ...props }: BreadcrumbsProps) {\n return (\n <nav className={cn(\"flex items-center text-sm text-[rgb(var(--nc-fg-muted))]\", className)} {...props}>\n {items.map((item, index) => {\n const content = item.href ? (\n <a href={item.href} className=\"transition hover:text-[rgb(var(--nc-fg))]\">\n {item.label}\n </a>\n ) : (\n <span className=\"text-[rgb(var(--nc-fg))]\">{item.label}</span>\n );\n\n return (\n <span key={`${item.label}-${index}`} className=\"flex items-center\">\n {content}\n {index < items.length - 1 && (\n <span className=\"mx-2 text-[rgb(var(--nc-fg-soft))]\">/</span>\n )}\n </span>\n );\n })}\n </nav>\n );\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport type SidebarItem = {\n label: React.ReactNode;\n href?: string;\n icon?: React.ReactNode;\n active?: boolean;\n};\n\nexport type SidebarProps = React.HTMLAttributes<HTMLElement> & {\n title?: React.ReactNode;\n items: SidebarItem[];\n footer?: React.ReactNode;\n};\n\nexport function Sidebar({ className, title, items, footer, ...props }: SidebarProps) {\n return (\n <aside\n className={cn(\n \"flex h-full w-full flex-col gap-6 rounded-3xl border border-[rgb(var(--nc-border)/0.3)] bg-[rgb(var(--nc-surface)/0.08)] p-6 text-[rgb(var(--nc-fg))] backdrop-blur-xl\",\n className\n )}\n {...props}\n >\n {title && <div className=\"text-lg font-semibold\">{title}</div>}\n <nav className=\"flex flex-col gap-2\">\n {items.map((item, index) => (\n <a\n key={`${item.label}-${index}`}\n href={item.href ?? \"#\"}\n className={cn(\n \"flex items-center gap-3 rounded-2xl px-3 py-2 text-sm transition\",\n item.active\n ? \"bg-[rgb(var(--nc-accent-1)/0.25)] text-[rgb(var(--nc-fg))]\"\n : \"text-[rgb(var(--nc-fg-muted))] hover:bg-[rgb(var(--nc-surface)/0.12)] hover:text-[rgb(var(--nc-fg))]\"\n )}\n >\n {item.icon}\n <span>{item.label}</span>\n </a>\n ))}\n </nav>\n {footer && <div className=\"mt-auto pt-4\">{footer}</div>}\n </aside>\n );\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport type TopNavProps = React.HTMLAttributes<HTMLElement> & {\n title?: React.ReactNode;\n actions?: React.ReactNode;\n breadcrumb?: React.ReactNode;\n};\n\nexport function TopNav({ className, title, actions, breadcrumb, ...props }: TopNavProps) {\n return (\n <header\n className={cn(\n \"flex flex-wrap items-center justify-between gap-4 rounded-3xl border border-[rgb(var(--nc-border)/0.3)] bg-[rgb(var(--nc-surface)/0.08)] px-6 py-4 text-[rgb(var(--nc-fg))] backdrop-blur-xl\",\n className\n )}\n {...props}\n >\n <div className=\"space-y-1\">\n {breadcrumb}\n {title && <div className=\"text-xl font-semibold\">{title}</div>}\n </div>\n {actions && <div className=\"flex flex-wrap gap-3\">{actions}</div>}\n </header>\n );\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport type PageHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n title: React.ReactNode;\n description?: React.ReactNode;\n actions?: React.ReactNode;\n};\n\nexport function PageHeader({\n className,\n title,\n description,\n actions,\n ...props\n}: PageHeaderProps) {\n return (\n <div\n className={cn(\"flex flex-wrap items-start justify-between gap-6\", className)}\n {...props}\n >\n <div className=\"space-y-2\">\n <h1 className=\"text-3xl font-bold text-[rgb(var(--nc-fg))]\">{title}</h1>\n {description && <p className=\"text-[rgb(var(--nc-fg-muted))]\">{description}</p>}\n </div>\n {actions && <div className=\"flex flex-wrap gap-3\">{actions}</div>}\n </div>\n );\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport type AuthLayoutProps = React.HTMLAttributes<HTMLDivElement> & {\n title?: React.ReactNode;\n description?: React.ReactNode;\n footer?: React.ReactNode;\n graphic?: React.ReactNode;\n};\n\nexport function AuthLayout({\n className,\n title,\n description,\n footer,\n graphic,\n children,\n ...props\n}: AuthLayoutProps) {\n return (\n <div\n className={cn(\n \"grid min-h-screen grid-cols-1 bg-background\",\n \"lg:grid-cols-[1.1fr_0.9fr]\",\n className\n )}\n {...props}\n >\n <div className=\"flex flex-col justify-center px-6 py-16 sm:px-12\">\n <div className=\"mx-auto w-full max-w-md space-y-6\">\n {(title || description) && (\n <div className=\"space-y-2\">\n {title && <h1 className=\"text-3xl font-bold text-[rgb(var(--nc-fg))]\">{title}</h1>}\n {description && <p className=\"text-[rgb(var(--nc-fg-muted))]\">{description}</p>}\n </div>\n )}\n {children}\n {footer && <div className=\"text-sm text-[rgb(var(--nc-fg-muted))]\">{footer}</div>}\n </div>\n </div>\n <div className=\"hidden items-center justify-center border-l border-[rgb(var(--nc-border)/0.3)] bg-[rgb(var(--nc-surface)/0.08)] p-12 text-[rgb(var(--nc-fg))] lg:flex\">\n {graphic ?? (\n <div className=\"max-w-sm space-y-4 text-center\">\n <h2 className=\"text-2xl font-semibold\">Crafted experiences</h2>\n <p className=\"text-[rgb(var(--nc-fg-muted))]\">\n Build authentication flows that feel premium and cohesive.\n </p>\n </div>\n )}\n </div>\n </div>\n );\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport type ContainerProps = React.HTMLAttributes<HTMLDivElement> & {\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n};\n\nconst sizeClasses: Record<NonNullable<ContainerProps[\"size\"]>, string> = {\n sm: \"max-w-3xl\",\n md: \"max-w-5xl\",\n lg: \"max-w-6xl\",\n xl: \"max-w-7xl\",\n};\n\nexport function Container({ className, size = \"lg\", ...props }: ContainerProps) {\n return (\n <div\n className={cn(\"mx-auto w-full px-4 sm:px-6 lg:px-8\", sizeClasses[size], className)}\n {...props}\n />\n );\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport type GridProps = React.HTMLAttributes<HTMLDivElement> & {\n columns?: 1 | 2 | 3 | 4 | 5 | 6;\n gap?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n};\n\nconst colClasses: Record<NonNullable<GridProps[\"columns\"]>, string> = {\n 1: \"grid-cols-1\",\n 2: \"grid-cols-1 md:grid-cols-2\",\n 3: \"grid-cols-1 md:grid-cols-2 lg:grid-cols-3\",\n 4: \"grid-cols-1 md:grid-cols-2 lg:grid-cols-4\",\n 5: \"grid-cols-1 md:grid-cols-2 lg:grid-cols-5\",\n 6: \"grid-cols-1 md:grid-cols-3 lg:grid-cols-6\",\n};\n\nconst gapClasses: Record<NonNullable<GridProps[\"gap\"]>, string> = {\n sm: \"gap-4\",\n md: \"gap-6\",\n lg: \"gap-8\",\n xl: \"gap-10\",\n};\n\nexport function Grid({ className, columns = 3, gap = \"md\", ...props }: GridProps) {\n return (\n <div className={cn(\"grid\", colClasses[columns], gapClasses[gap], className)} {...props} />\n );\n}\n","export type LayoutIconName = string;\n\nexport type LayoutBreadcrumbItem = {\n label: string;\n href?: string;\n};\n\nexport type LayoutSidebarItem = {\n label: string;\n href?: string;\n icon?: LayoutIconName;\n active?: boolean;\n};\n\nexport type LayoutConfig = {\n sidebar?: {\n title?: string;\n items: LayoutSidebarItem[];\n footerText?: string;\n };\n header?: {\n title?: string;\n breadcrumb?: LayoutBreadcrumbItem[];\n };\n};\n\nexport const layoutConfigSchema = {\n $schema: \"https://json-schema.org/draft/2020-12/schema\",\n title: \"Nextcraft UI Layout Config\",\n type: \"object\",\n additionalProperties: false,\n properties: {\n sidebar: {\n type: \"object\",\n additionalProperties: false,\n properties: {\n title: { type: \"string\" },\n footerText: { type: \"string\" },\n items: {\n type: \"array\",\n items: {\n type: \"object\",\n additionalProperties: false,\n properties: {\n label: { type: \"string\" },\n href: { type: \"string\" },\n icon: { type: \"string\" },\n active: { type: \"boolean\" },\n },\n required: [\"label\"],\n },\n },\n },\n required: [\"items\"],\n },\n header: {\n type: \"object\",\n additionalProperties: false,\n properties: {\n title: { type: \"string\" },\n breadcrumb: {\n type: \"array\",\n items: {\n type: \"object\",\n additionalProperties: false,\n properties: {\n label: { type: \"string\" },\n href: { type: \"string\" },\n },\n required: [\"label\"],\n },\n },\n },\n },\n },\n} as const;\n"],"mappings":"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","names":["React","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime"]}
|
|
@@ -0,0 +1,170 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
|
|
4
|
+
type AppShellProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
5
|
+
sidebar?: React.ReactNode;
|
|
6
|
+
topNav?: React.ReactNode;
|
|
7
|
+
};
|
|
8
|
+
declare function AppShell({ className, sidebar, topNav, children, ...props }: AppShellProps): react_jsx_runtime.JSX.Element;
|
|
9
|
+
|
|
10
|
+
type LayoutIconName = string;
|
|
11
|
+
type LayoutBreadcrumbItem = {
|
|
12
|
+
label: string;
|
|
13
|
+
href?: string;
|
|
14
|
+
};
|
|
15
|
+
type LayoutSidebarItem = {
|
|
16
|
+
label: string;
|
|
17
|
+
href?: string;
|
|
18
|
+
icon?: LayoutIconName;
|
|
19
|
+
active?: boolean;
|
|
20
|
+
};
|
|
21
|
+
type LayoutConfig = {
|
|
22
|
+
sidebar?: {
|
|
23
|
+
title?: string;
|
|
24
|
+
items: LayoutSidebarItem[];
|
|
25
|
+
footerText?: string;
|
|
26
|
+
};
|
|
27
|
+
header?: {
|
|
28
|
+
title?: string;
|
|
29
|
+
breadcrumb?: LayoutBreadcrumbItem[];
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
declare const layoutConfigSchema: {
|
|
33
|
+
readonly $schema: "https://json-schema.org/draft/2020-12/schema";
|
|
34
|
+
readonly title: "Nextcraft UI Layout Config";
|
|
35
|
+
readonly type: "object";
|
|
36
|
+
readonly additionalProperties: false;
|
|
37
|
+
readonly properties: {
|
|
38
|
+
readonly sidebar: {
|
|
39
|
+
readonly type: "object";
|
|
40
|
+
readonly additionalProperties: false;
|
|
41
|
+
readonly properties: {
|
|
42
|
+
readonly title: {
|
|
43
|
+
readonly type: "string";
|
|
44
|
+
};
|
|
45
|
+
readonly footerText: {
|
|
46
|
+
readonly type: "string";
|
|
47
|
+
};
|
|
48
|
+
readonly items: {
|
|
49
|
+
readonly type: "array";
|
|
50
|
+
readonly items: {
|
|
51
|
+
readonly type: "object";
|
|
52
|
+
readonly additionalProperties: false;
|
|
53
|
+
readonly properties: {
|
|
54
|
+
readonly label: {
|
|
55
|
+
readonly type: "string";
|
|
56
|
+
};
|
|
57
|
+
readonly href: {
|
|
58
|
+
readonly type: "string";
|
|
59
|
+
};
|
|
60
|
+
readonly icon: {
|
|
61
|
+
readonly type: "string";
|
|
62
|
+
};
|
|
63
|
+
readonly active: {
|
|
64
|
+
readonly type: "boolean";
|
|
65
|
+
};
|
|
66
|
+
};
|
|
67
|
+
readonly required: readonly ["label"];
|
|
68
|
+
};
|
|
69
|
+
};
|
|
70
|
+
};
|
|
71
|
+
readonly required: readonly ["items"];
|
|
72
|
+
};
|
|
73
|
+
readonly header: {
|
|
74
|
+
readonly type: "object";
|
|
75
|
+
readonly additionalProperties: false;
|
|
76
|
+
readonly properties: {
|
|
77
|
+
readonly title: {
|
|
78
|
+
readonly type: "string";
|
|
79
|
+
};
|
|
80
|
+
readonly breadcrumb: {
|
|
81
|
+
readonly type: "array";
|
|
82
|
+
readonly items: {
|
|
83
|
+
readonly type: "object";
|
|
84
|
+
readonly additionalProperties: false;
|
|
85
|
+
readonly properties: {
|
|
86
|
+
readonly label: {
|
|
87
|
+
readonly type: "string";
|
|
88
|
+
};
|
|
89
|
+
readonly href: {
|
|
90
|
+
readonly type: "string";
|
|
91
|
+
};
|
|
92
|
+
};
|
|
93
|
+
readonly required: readonly ["label"];
|
|
94
|
+
};
|
|
95
|
+
};
|
|
96
|
+
};
|
|
97
|
+
};
|
|
98
|
+
};
|
|
99
|
+
};
|
|
100
|
+
|
|
101
|
+
type AppTemplateProps = {
|
|
102
|
+
config: LayoutConfig;
|
|
103
|
+
headerActions?: React.ReactNode;
|
|
104
|
+
headerBreadcrumb?: React.ReactNode;
|
|
105
|
+
sidebarFooter?: React.ReactNode;
|
|
106
|
+
resolveIcon?: (name: string) => React.ReactNode;
|
|
107
|
+
icons?: Record<string, React.ReactNode>;
|
|
108
|
+
activePath?: string;
|
|
109
|
+
getActivePath?: () => string | undefined;
|
|
110
|
+
lucideFallback?: boolean;
|
|
111
|
+
children: React.ReactNode;
|
|
112
|
+
};
|
|
113
|
+
declare function AppTemplate({ config, headerActions, headerBreadcrumb, sidebarFooter, resolveIcon, icons, activePath, getActivePath, lucideFallback, children, }: AppTemplateProps): react_jsx_runtime.JSX.Element;
|
|
114
|
+
|
|
115
|
+
type SidebarItem = {
|
|
116
|
+
label: React.ReactNode;
|
|
117
|
+
href?: string;
|
|
118
|
+
icon?: React.ReactNode;
|
|
119
|
+
active?: boolean;
|
|
120
|
+
};
|
|
121
|
+
type SidebarProps = React.HTMLAttributes<HTMLElement> & {
|
|
122
|
+
title?: React.ReactNode;
|
|
123
|
+
items: SidebarItem[];
|
|
124
|
+
footer?: React.ReactNode;
|
|
125
|
+
};
|
|
126
|
+
declare function Sidebar({ className, title, items, footer, ...props }: SidebarProps): react_jsx_runtime.JSX.Element;
|
|
127
|
+
|
|
128
|
+
type TopNavProps = React.HTMLAttributes<HTMLElement> & {
|
|
129
|
+
title?: React.ReactNode;
|
|
130
|
+
actions?: React.ReactNode;
|
|
131
|
+
breadcrumb?: React.ReactNode;
|
|
132
|
+
};
|
|
133
|
+
declare function TopNav({ className, title, actions, breadcrumb, ...props }: TopNavProps): react_jsx_runtime.JSX.Element;
|
|
134
|
+
|
|
135
|
+
type PageHeaderProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
136
|
+
title: React.ReactNode;
|
|
137
|
+
description?: React.ReactNode;
|
|
138
|
+
actions?: React.ReactNode;
|
|
139
|
+
};
|
|
140
|
+
declare function PageHeader({ className, title, description, actions, ...props }: PageHeaderProps): react_jsx_runtime.JSX.Element;
|
|
141
|
+
|
|
142
|
+
type BreadcrumbItem = {
|
|
143
|
+
label: React.ReactNode;
|
|
144
|
+
href?: string;
|
|
145
|
+
};
|
|
146
|
+
type BreadcrumbsProps = React.HTMLAttributes<HTMLElement> & {
|
|
147
|
+
items: BreadcrumbItem[];
|
|
148
|
+
};
|
|
149
|
+
declare function Breadcrumbs({ className, items, ...props }: BreadcrumbsProps): react_jsx_runtime.JSX.Element;
|
|
150
|
+
|
|
151
|
+
type AuthLayoutProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
152
|
+
title?: React.ReactNode;
|
|
153
|
+
description?: React.ReactNode;
|
|
154
|
+
footer?: React.ReactNode;
|
|
155
|
+
graphic?: React.ReactNode;
|
|
156
|
+
};
|
|
157
|
+
declare function AuthLayout({ className, title, description, footer, graphic, children, ...props }: AuthLayoutProps): react_jsx_runtime.JSX.Element;
|
|
158
|
+
|
|
159
|
+
type ContainerProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
160
|
+
size?: "sm" | "md" | "lg" | "xl";
|
|
161
|
+
};
|
|
162
|
+
declare function Container({ className, size, ...props }: ContainerProps): react_jsx_runtime.JSX.Element;
|
|
163
|
+
|
|
164
|
+
type GridProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
165
|
+
columns?: 1 | 2 | 3 | 4 | 5 | 6;
|
|
166
|
+
gap?: "sm" | "md" | "lg" | "xl";
|
|
167
|
+
};
|
|
168
|
+
declare function Grid({ className, columns, gap, ...props }: GridProps): react_jsx_runtime.JSX.Element;
|
|
169
|
+
|
|
170
|
+
export { AppShell, type AppShellProps, AppTemplate, type AppTemplateProps, AuthLayout, type AuthLayoutProps, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Container, type ContainerProps, Grid, type GridProps, type LayoutBreadcrumbItem, type LayoutConfig, type LayoutIconName, type LayoutSidebarItem, PageHeader, type PageHeaderProps, Sidebar, type SidebarItem, type SidebarProps, TopNav, type TopNavProps, layoutConfigSchema };
|