neatkit 0.8.0 → 0.9.0
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/dist/Boundary.cjs +1 -1
- package/dist/Boundary.js +29 -29
- package/dist/Button-BV5OUXpc.js +101 -0
- package/dist/Button-DU4j_IED.cjs +1 -0
- package/dist/Button.cjs +1 -1
- package/dist/Button.js +1 -1
- package/dist/Checkbox.cjs +1 -1
- package/dist/Checkbox.js +1 -1
- package/dist/{Code-JDb4VFl7.cjs → Code-B7s_rN0G.cjs} +1 -1
- package/dist/{Code-ClkozPlv.js → Code-Bp2X1k-g.js} +1 -4
- package/dist/Code.cjs +1 -1
- package/dist/Code.js +1 -1
- package/dist/Divider-C7XGlr26.cjs +1 -0
- package/dist/{Divider-BE15WVDI.js → Divider-DZgpYpr-.js} +1 -1
- package/dist/Divider.cjs +1 -1
- package/dist/Divider.js +1 -1
- package/dist/Icon-BIBzgznI.cjs +1 -0
- package/dist/{Icon-BoEUoOk7.js → Icon-CxK1wlGk.js} +98 -52
- package/dist/Icon.cjs +1 -1
- package/dist/Icon.js +1 -1
- package/dist/Input.cjs +1 -1
- package/dist/Input.js +1 -1
- package/dist/Markdown.cjs +1 -1
- package/dist/Markdown.js +108 -104
- package/dist/Modal.cjs +1 -1
- package/dist/Modal.js +1 -1
- package/dist/Popover.cjs +1 -1
- package/dist/Popover.js +147 -141
- package/dist/Select.cjs +1 -1
- package/dist/Select.js +2 -2
- package/dist/Sidebar.cjs +1 -1
- package/dist/Sidebar.js +310 -295
- package/dist/Table-CADupJEU.js +423 -0
- package/dist/Table-qetwZpTC.cjs +1 -0
- package/dist/Table.cjs +1 -1
- package/dist/Table.js +1 -1
- package/dist/{Tooltip-B4bajPtk.cjs → Tooltip-B2d5ss7S.cjs} +1 -1
- package/dist/{Tooltip-BVqdnKK_.js → Tooltip-BK64rkxV.js} +1 -1
- package/dist/Tooltip.cjs +1 -1
- package/dist/Tooltip.js +1 -1
- package/dist/albert-sans-cb3e34c4.woff2 +0 -0
- package/dist/components/Icon/icons/GearIcon.d.ts +11 -0
- package/dist/components/Icon/icons/ImageIcon.d.ts +11 -0
- package/dist/components/Icon/utils/registry.d.ts +2 -0
- package/dist/components/Sidebar/Sidebar.d.ts +6 -1
- package/dist/components/Sidebar/components/SidebarFooter.d.ts +5 -0
- package/dist/components/Sidebar/components/SidebarGroup.d.ts +5 -16
- package/dist/components/Sidebar/components/SidebarHeader.d.ts +29 -0
- package/dist/components/Sidebar/components/SidebarItem.d.ts +3 -0
- package/dist/components/Sidebar/components/SidebarPanel.d.ts +2 -2
- package/dist/components/Sidebar/hooks/usePresentation.d.ts +2 -2
- package/dist/components/Sidebar/index.d.ts +1 -1
- package/dist/components/Sidebar/utils/presentation.d.ts +12 -0
- package/dist/components/Sidebar/utils/state.d.ts +2 -2
- package/dist/components/Table/Table.d.ts +21 -209
- package/dist/components/Table/components/TableAction.d.ts +18 -0
- package/dist/components/Table/components/TableActionCell.d.ts +15 -0
- package/dist/components/Table/components/TableActionHeaderCell.d.ts +13 -0
- package/dist/components/Table/components/TableBody.d.ts +27 -0
- package/dist/components/Table/components/TableCell.d.ts +42 -0
- package/dist/components/Table/components/TableFoot.d.ts +19 -0
- package/dist/components/Table/components/TableHead.d.ts +19 -0
- package/dist/components/Table/components/TableHeaderCell.d.ts +23 -0
- package/dist/components/Table/components/TableRow.d.ts +67 -0
- package/dist/components/Table/hooks/useHorizontalOverflow.d.ts +25 -0
- package/dist/components/Table/utils/cell.d.ts +25 -0
- package/dist/components/Table/utils/children.d.ts +18 -0
- package/dist/components/Table/utils/trigger.d.ts +54 -0
- package/dist/floating-position-DIjh2wnP.cjs +1 -0
- package/dist/floating-position-DvR6e334.js +50 -0
- package/dist/style.css +1 -1
- package/dist/{useFloatingPosition-CMirP2-2.js → useFloatingPosition-B3ZC-v3v.js} +1 -1
- package/dist/{useFloatingPosition-BBEUHPqy.cjs → useFloatingPosition-GzkP9dCc.cjs} +1 -1
- package/package.json +2 -1
- package/dist/Button-Chv4O66e.js +0 -99
- package/dist/Button-DCKtFvSo.cjs +0 -1
- package/dist/Divider-CJYbFcSX.cjs +0 -1
- package/dist/Icon-DJ4BigRz.cjs +0 -1
- package/dist/Table-B30TBckZ.js +0 -402
- package/dist/Table-DceR12X9.cjs +0 -1
- package/dist/floating-position-5wJ5G5IT.js +0 -48
- package/dist/floating-position-Cy9xxdH4.cjs +0 -1
|
@@ -0,0 +1,423 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as a, jsxs as E } from "react/jsx-runtime";
|
|
3
|
+
import { createContext as z, forwardRef as g, Children as B, isValidElement as L, Fragment as j, cloneElement as w, createElement as M, useRef as N, useContext as V, useState as x, useEffect as Y, useCallback as X } from "react";
|
|
4
|
+
import { a as $ } from "./reference-CXMr27nM.js";
|
|
5
|
+
import { B as q } from "./Button-BV5OUXpc.js";
|
|
6
|
+
import { T as G } from "./Tooltip-BK64rkxV.js";
|
|
7
|
+
const v = z("body"), A = g(function(l, e) {
|
|
8
|
+
const {
|
|
9
|
+
align: t = "left",
|
|
10
|
+
children: i,
|
|
11
|
+
className: r,
|
|
12
|
+
scope: c = "col",
|
|
13
|
+
sticky: f = !1,
|
|
14
|
+
...s
|
|
15
|
+
} = l;
|
|
16
|
+
return /* @__PURE__ */ a(
|
|
17
|
+
"th",
|
|
18
|
+
{
|
|
19
|
+
...s,
|
|
20
|
+
ref: e,
|
|
21
|
+
className: ["nk-table__header-cell", r].filter(Boolean).join(" "),
|
|
22
|
+
"data-align": t,
|
|
23
|
+
"data-sticky": f || void 0,
|
|
24
|
+
scope: c,
|
|
25
|
+
children: i
|
|
26
|
+
}
|
|
27
|
+
);
|
|
28
|
+
});
|
|
29
|
+
function I(n) {
|
|
30
|
+
for (const l of B.toArray(n)) {
|
|
31
|
+
if (L(l) && l.type === j) {
|
|
32
|
+
if (I(l.props.children)) return !0;
|
|
33
|
+
continue;
|
|
34
|
+
}
|
|
35
|
+
return !0;
|
|
36
|
+
}
|
|
37
|
+
return !1;
|
|
38
|
+
}
|
|
39
|
+
const J = g(
|
|
40
|
+
function(l, e) {
|
|
41
|
+
const {
|
|
42
|
+
children: t,
|
|
43
|
+
className: i,
|
|
44
|
+
emptyColumnCount: r = 1,
|
|
45
|
+
emptyMessage: c,
|
|
46
|
+
...f
|
|
47
|
+
} = l, s = !I(t), b = Number.isFinite(r) ? Math.max(1, Math.floor(r)) : 1;
|
|
48
|
+
return /* @__PURE__ */ a(
|
|
49
|
+
"tbody",
|
|
50
|
+
{
|
|
51
|
+
...f,
|
|
52
|
+
ref: e,
|
|
53
|
+
className: ["nk-table__body", i].filter(Boolean).join(" "),
|
|
54
|
+
children: s && c !== void 0 ? /* @__PURE__ */ a("tr", { className: "nk-table__row", children: /* @__PURE__ */ a(
|
|
55
|
+
"td",
|
|
56
|
+
{
|
|
57
|
+
className: "nk-table__cell nk-table__empty-cell",
|
|
58
|
+
colSpan: b,
|
|
59
|
+
children: /* @__PURE__ */ a("div", { className: "nk-table__empty-content", children: c })
|
|
60
|
+
}
|
|
61
|
+
) }) : /* @__PURE__ */ a(v.Provider, { value: "body", children: t })
|
|
62
|
+
}
|
|
63
|
+
);
|
|
64
|
+
}
|
|
65
|
+
);
|
|
66
|
+
function Q(n, l, e) {
|
|
67
|
+
return n === void 0 ? l : e ? e(n) : n instanceof Date ? Number.isNaN(n.getTime()) ? "Invalid Date" : n.toISOString().slice(0, 10) : typeof n == "boolean" ? n ? "Yes" : "No" : n;
|
|
68
|
+
}
|
|
69
|
+
function U(n) {
|
|
70
|
+
if (typeof n == "number" || typeof n == "string")
|
|
71
|
+
return String(n);
|
|
72
|
+
}
|
|
73
|
+
const H = g(
|
|
74
|
+
function(l, e) {
|
|
75
|
+
const {
|
|
76
|
+
align: t = "left",
|
|
77
|
+
children: i,
|
|
78
|
+
className: r,
|
|
79
|
+
format: c,
|
|
80
|
+
title: f,
|
|
81
|
+
truncate: s,
|
|
82
|
+
value: b,
|
|
83
|
+
...h
|
|
84
|
+
} = l, { rowTrigger: o, ...d } = h, p = Q(b, i, c), u = s === void 0 ? void 0 : { maxWidth: s }, k = f ?? (s === void 0 ? void 0 : U(p));
|
|
85
|
+
return /* @__PURE__ */ E(
|
|
86
|
+
"td",
|
|
87
|
+
{
|
|
88
|
+
...d,
|
|
89
|
+
ref: e,
|
|
90
|
+
className: ["nk-table__cell", r].filter(Boolean).join(" "),
|
|
91
|
+
"data-align": t,
|
|
92
|
+
title: k,
|
|
93
|
+
children: [
|
|
94
|
+
(o == null ? void 0 : o.kind) === "link" && o.linkProperties ? /* @__PURE__ */ a(
|
|
95
|
+
"a",
|
|
96
|
+
{
|
|
97
|
+
ref: o.reference,
|
|
98
|
+
"aria-label": o.ariaLabel,
|
|
99
|
+
className: "nk-table__row-trigger",
|
|
100
|
+
download: o.linkProperties.download,
|
|
101
|
+
href: o.linkProperties.href,
|
|
102
|
+
hrefLang: o.linkProperties.hrefLang,
|
|
103
|
+
onClick: o.linkProperties.onNavigate,
|
|
104
|
+
rel: o.linkProperties.rel,
|
|
105
|
+
target: o.linkProperties.target
|
|
106
|
+
}
|
|
107
|
+
) : null,
|
|
108
|
+
(o == null ? void 0 : o.kind) === "button" ? /* @__PURE__ */ a(
|
|
109
|
+
"button",
|
|
110
|
+
{
|
|
111
|
+
ref: o.reference,
|
|
112
|
+
"aria-label": o.ariaLabel,
|
|
113
|
+
className: "nk-table__row-trigger",
|
|
114
|
+
onClick: o.onClick,
|
|
115
|
+
type: "button"
|
|
116
|
+
}
|
|
117
|
+
) : null,
|
|
118
|
+
s !== void 0 ? /* @__PURE__ */ a("span", { className: "nk-table__truncated-content", style: u, children: p }) : p
|
|
119
|
+
]
|
|
120
|
+
}
|
|
121
|
+
);
|
|
122
|
+
}
|
|
123
|
+
), W = g(
|
|
124
|
+
function(l, e) {
|
|
125
|
+
const { children: t, className: i, ...r } = l;
|
|
126
|
+
return /* @__PURE__ */ a(
|
|
127
|
+
"tfoot",
|
|
128
|
+
{
|
|
129
|
+
...r,
|
|
130
|
+
ref: e,
|
|
131
|
+
className: ["nk-table__foot", i].filter(Boolean).join(" "),
|
|
132
|
+
children: /* @__PURE__ */ a(v.Provider, { value: "foot", children: t })
|
|
133
|
+
}
|
|
134
|
+
);
|
|
135
|
+
}
|
|
136
|
+
), Z = g(
|
|
137
|
+
function(l, e) {
|
|
138
|
+
const { children: t, className: i, ...r } = l;
|
|
139
|
+
return /* @__PURE__ */ a(
|
|
140
|
+
"thead",
|
|
141
|
+
{
|
|
142
|
+
...r,
|
|
143
|
+
ref: e,
|
|
144
|
+
className: ["nk-table__head", i].filter(Boolean).join(" "),
|
|
145
|
+
children: /* @__PURE__ */ a(v.Provider, { value: "head", children: t })
|
|
146
|
+
}
|
|
147
|
+
);
|
|
148
|
+
}
|
|
149
|
+
), ee = [
|
|
150
|
+
"a[href]",
|
|
151
|
+
"audio[controls]",
|
|
152
|
+
"button",
|
|
153
|
+
"iframe",
|
|
154
|
+
"input",
|
|
155
|
+
"label",
|
|
156
|
+
"select",
|
|
157
|
+
"summary",
|
|
158
|
+
"textarea",
|
|
159
|
+
"video[controls]",
|
|
160
|
+
"[contenteditable]:not([contenteditable='false'])"
|
|
161
|
+
].join(","), te = /* @__PURE__ */ new Set([
|
|
162
|
+
"button",
|
|
163
|
+
"checkbox",
|
|
164
|
+
"combobox",
|
|
165
|
+
"grid",
|
|
166
|
+
"link",
|
|
167
|
+
"listbox",
|
|
168
|
+
"menu",
|
|
169
|
+
"menubar",
|
|
170
|
+
"menuitem",
|
|
171
|
+
"menuitemcheckbox",
|
|
172
|
+
"menuitemradio",
|
|
173
|
+
"option",
|
|
174
|
+
"radio",
|
|
175
|
+
"radiogroup",
|
|
176
|
+
"scrollbar",
|
|
177
|
+
"searchbox",
|
|
178
|
+
"slider",
|
|
179
|
+
"spinbutton",
|
|
180
|
+
"switch",
|
|
181
|
+
"tab",
|
|
182
|
+
"tablist",
|
|
183
|
+
"textbox",
|
|
184
|
+
"tree",
|
|
185
|
+
"treegrid",
|
|
186
|
+
"treeitem"
|
|
187
|
+
]);
|
|
188
|
+
function ne(n, l) {
|
|
189
|
+
var t;
|
|
190
|
+
let e = n;
|
|
191
|
+
for (; e && e !== l; ) {
|
|
192
|
+
if (e.matches(ee) || (((t = e.getAttribute("role")) == null ? void 0 : t.split(/\s+/)) ?? []).some((r) => te.has(r)))
|
|
193
|
+
return !0;
|
|
194
|
+
e = e.parentElement;
|
|
195
|
+
}
|
|
196
|
+
return !1;
|
|
197
|
+
}
|
|
198
|
+
function le(n, l) {
|
|
199
|
+
let e = !1;
|
|
200
|
+
function t(r) {
|
|
201
|
+
return B.map(r, (c) => L(c) ? c.type === j ? w(
|
|
202
|
+
c,
|
|
203
|
+
void 0,
|
|
204
|
+
t(
|
|
205
|
+
c.props.children
|
|
206
|
+
)
|
|
207
|
+
) : !e && c.type === H ? (e = !0, w(
|
|
208
|
+
c,
|
|
209
|
+
{ rowTrigger: l }
|
|
210
|
+
)) : c : c);
|
|
211
|
+
}
|
|
212
|
+
const i = t(n);
|
|
213
|
+
return { attached: e, content: i };
|
|
214
|
+
}
|
|
215
|
+
function oe(n) {
|
|
216
|
+
const {
|
|
217
|
+
"aria-label": l,
|
|
218
|
+
icon: e,
|
|
219
|
+
label: t,
|
|
220
|
+
...i
|
|
221
|
+
} = n;
|
|
222
|
+
return /* @__PURE__ */ a(G, { content: t, children: /* @__PURE__ */ a(
|
|
223
|
+
q,
|
|
224
|
+
{
|
|
225
|
+
...i,
|
|
226
|
+
"aria-label": l ?? t,
|
|
227
|
+
className: "nk-table__action",
|
|
228
|
+
icon: e,
|
|
229
|
+
shape: "rectangle",
|
|
230
|
+
type: "button",
|
|
231
|
+
variant: "ghost"
|
|
232
|
+
}
|
|
233
|
+
) });
|
|
234
|
+
}
|
|
235
|
+
function re(n) {
|
|
236
|
+
const { actions: l } = n;
|
|
237
|
+
function e(t) {
|
|
238
|
+
t.stopPropagation();
|
|
239
|
+
}
|
|
240
|
+
return /* @__PURE__ */ a(
|
|
241
|
+
"td",
|
|
242
|
+
{
|
|
243
|
+
className: "nk-table__cell nk-table__action-cell",
|
|
244
|
+
"data-align": "right",
|
|
245
|
+
onClick: e,
|
|
246
|
+
children: l.length > 0 ? /* @__PURE__ */ a("span", { className: "nk-table__action-list", children: l.map((t) => /* @__PURE__ */ M(oe, { ...t, key: t.label })) }) : null
|
|
247
|
+
}
|
|
248
|
+
);
|
|
249
|
+
}
|
|
250
|
+
const ae = g(function(l, e) {
|
|
251
|
+
const { children: t, className: i, ...r } = l;
|
|
252
|
+
return /* @__PURE__ */ a(
|
|
253
|
+
A,
|
|
254
|
+
{
|
|
255
|
+
...r,
|
|
256
|
+
ref: e,
|
|
257
|
+
align: "right",
|
|
258
|
+
className: ["nk-table__action-header-cell", i].filter(Boolean).join(" "),
|
|
259
|
+
children: t ?? /* @__PURE__ */ a("span", { className: "nk-table__visually-hidden", children: "Row actions" })
|
|
260
|
+
}
|
|
261
|
+
);
|
|
262
|
+
}), ie = g(
|
|
263
|
+
function(l, e) {
|
|
264
|
+
const {
|
|
265
|
+
"aria-label": t,
|
|
266
|
+
actions: i,
|
|
267
|
+
children: r,
|
|
268
|
+
className: c,
|
|
269
|
+
download: f,
|
|
270
|
+
href: s,
|
|
271
|
+
hrefLang: b,
|
|
272
|
+
onClick: h,
|
|
273
|
+
onNavigate: o,
|
|
274
|
+
rel: d,
|
|
275
|
+
target: p,
|
|
276
|
+
...u
|
|
277
|
+
} = l, k = N(null), D = V(v), T = s !== void 0 || h !== void 0, y = (t == null ? void 0 : t.trim()) || (s !== void 0 ? "Open row" : "Activate row");
|
|
278
|
+
function R(m) {
|
|
279
|
+
k.current = m;
|
|
280
|
+
}
|
|
281
|
+
let C;
|
|
282
|
+
s !== void 0 ? C = {
|
|
283
|
+
ariaLabel: y,
|
|
284
|
+
kind: "link",
|
|
285
|
+
linkProperties: {
|
|
286
|
+
download: f,
|
|
287
|
+
href: s,
|
|
288
|
+
hrefLang: b,
|
|
289
|
+
onNavigate: o,
|
|
290
|
+
rel: d,
|
|
291
|
+
target: p
|
|
292
|
+
},
|
|
293
|
+
reference: R
|
|
294
|
+
} : h !== void 0 && (C = {
|
|
295
|
+
ariaLabel: y,
|
|
296
|
+
kind: "button",
|
|
297
|
+
onClick: h,
|
|
298
|
+
reference: R
|
|
299
|
+
});
|
|
300
|
+
const K = C ? le(r, C) : { content: r };
|
|
301
|
+
function O(m) {
|
|
302
|
+
if (m.defaultPrevented) return;
|
|
303
|
+
const P = m.target;
|
|
304
|
+
if (!(P instanceof Element) || ne(P, m.currentTarget)) return;
|
|
305
|
+
const _ = k.current;
|
|
306
|
+
if (!_) return;
|
|
307
|
+
const S = _.ownerDocument.defaultView;
|
|
308
|
+
if (!S) {
|
|
309
|
+
_.click();
|
|
310
|
+
return;
|
|
311
|
+
}
|
|
312
|
+
_.dispatchEvent(new S.MouseEvent("click", {
|
|
313
|
+
altKey: m.altKey,
|
|
314
|
+
bubbles: !0,
|
|
315
|
+
button: m.button,
|
|
316
|
+
buttons: m.buttons,
|
|
317
|
+
cancelable: !0,
|
|
318
|
+
clientX: m.clientX,
|
|
319
|
+
clientY: m.clientY,
|
|
320
|
+
ctrlKey: m.ctrlKey,
|
|
321
|
+
metaKey: m.metaKey,
|
|
322
|
+
shiftKey: m.shiftKey
|
|
323
|
+
}));
|
|
324
|
+
}
|
|
325
|
+
const F = D === "head" ? /* @__PURE__ */ a(ae, {}) : /* @__PURE__ */ a(re, { actions: i ?? [] });
|
|
326
|
+
return /* @__PURE__ */ E(
|
|
327
|
+
"tr",
|
|
328
|
+
{
|
|
329
|
+
...u,
|
|
330
|
+
ref: e,
|
|
331
|
+
"aria-label": T ? void 0 : t,
|
|
332
|
+
className: ["nk-table__row", c].filter(Boolean).join(" "),
|
|
333
|
+
"data-interactive": T || void 0,
|
|
334
|
+
onClick: T ? O : void 0,
|
|
335
|
+
children: [
|
|
336
|
+
K.content,
|
|
337
|
+
F
|
|
338
|
+
]
|
|
339
|
+
}
|
|
340
|
+
);
|
|
341
|
+
}
|
|
342
|
+
);
|
|
343
|
+
function ce() {
|
|
344
|
+
const n = N(null), l = N(null), [e, t] = x(!1), [i, r] = x(!1);
|
|
345
|
+
Y(() => {
|
|
346
|
+
const f = n.current, s = l.current;
|
|
347
|
+
if (!f || !s) return;
|
|
348
|
+
const b = f, h = s;
|
|
349
|
+
function o() {
|
|
350
|
+
const k = b.scrollWidth > b.clientWidth;
|
|
351
|
+
t(k), k || r(!1);
|
|
352
|
+
}
|
|
353
|
+
o();
|
|
354
|
+
const d = b.ownerDocument.defaultView;
|
|
355
|
+
d == null || d.addEventListener("resize", o);
|
|
356
|
+
const p = d == null ? void 0 : d.ResizeObserver, u = p ? new p(o) : void 0;
|
|
357
|
+
return u == null || u.observe(b), u == null || u.observe(h), () => {
|
|
358
|
+
d == null || d.removeEventListener("resize", o), u == null || u.disconnect();
|
|
359
|
+
};
|
|
360
|
+
}, []);
|
|
361
|
+
function c(f) {
|
|
362
|
+
r(e && f.currentTarget.scrollLeft > 1);
|
|
363
|
+
}
|
|
364
|
+
return {
|
|
365
|
+
containerReference: n,
|
|
366
|
+
contentReference: l,
|
|
367
|
+
isScrollable: e,
|
|
368
|
+
isScrolled: i,
|
|
369
|
+
handleScroll: c
|
|
370
|
+
};
|
|
371
|
+
}
|
|
372
|
+
const se = g(function(l, e) {
|
|
373
|
+
const {
|
|
374
|
+
"aria-label": t,
|
|
375
|
+
children: i,
|
|
376
|
+
className: r,
|
|
377
|
+
containerClassName: c,
|
|
378
|
+
...f
|
|
379
|
+
} = l, {
|
|
380
|
+
containerReference: s,
|
|
381
|
+
contentReference: b,
|
|
382
|
+
isScrollable: h,
|
|
383
|
+
isScrolled: o,
|
|
384
|
+
handleScroll: d
|
|
385
|
+
} = ce(), p = t ? `${t} scroll area` : "Scrollable table", u = X(
|
|
386
|
+
(k) => {
|
|
387
|
+
b.current = k, $(e, k);
|
|
388
|
+
},
|
|
389
|
+
[b, e]
|
|
390
|
+
);
|
|
391
|
+
return /* @__PURE__ */ a(
|
|
392
|
+
"div",
|
|
393
|
+
{
|
|
394
|
+
ref: s,
|
|
395
|
+
"aria-label": h ? p : void 0,
|
|
396
|
+
className: ["nk-table", c].filter(Boolean).join(" "),
|
|
397
|
+
"data-scrolled": o || void 0,
|
|
398
|
+
onScroll: d,
|
|
399
|
+
role: h ? "region" : void 0,
|
|
400
|
+
tabIndex: h ? 0 : void 0,
|
|
401
|
+
children: /* @__PURE__ */ a(
|
|
402
|
+
"table",
|
|
403
|
+
{
|
|
404
|
+
...f,
|
|
405
|
+
ref: u,
|
|
406
|
+
"aria-label": t,
|
|
407
|
+
className: ["nk-table__element", r].filter(Boolean).join(" "),
|
|
408
|
+
children: i
|
|
409
|
+
}
|
|
410
|
+
)
|
|
411
|
+
}
|
|
412
|
+
);
|
|
413
|
+
}), he = Object.assign(se, {
|
|
414
|
+
Body: J,
|
|
415
|
+
Cell: H,
|
|
416
|
+
Foot: W,
|
|
417
|
+
HeaderCell: A,
|
|
418
|
+
Head: Z,
|
|
419
|
+
Row: ie
|
|
420
|
+
});
|
|
421
|
+
export {
|
|
422
|
+
he as T
|
|
423
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";"use strict";const a=require("react/jsx-runtime"),o=require("react"),A=require("./reference-C2guRuR0.cjs"),I=require("./Button-DU4j_IED.cjs"),H=require("./Tooltip-B2d5ss7S.cjs"),v=o.createContext("body"),R=o.forwardRef(function(r,e){const{align:t="left",children:s,className:i,scope:c="col",sticky:b=!1,...d}=r;return a.jsx("th",{...d,ref:e,className:["nk-table__header-cell",i].filter(Boolean).join(" "),"data-align":t,"data-sticky":b||void 0,scope:c,children:s})});function w(n){for(const r of o.Children.toArray(n)){if(o.isValidElement(r)&&r.type===o.Fragment){if(w(r.props.children))return!0;continue}return!0}return!1}const D=o.forwardRef(function(r,e){const{children:t,className:s,emptyColumnCount:i=1,emptyMessage:c,...b}=r,d=!w(t),m=Number.isFinite(i)?Math.max(1,Math.floor(i)):1;return a.jsx("tbody",{...b,ref:e,className:["nk-table__body",s].filter(Boolean).join(" "),children:d&&c!==void 0?a.jsx("tr",{className:"nk-table__row",children:a.jsx("td",{className:"nk-table__cell nk-table__empty-cell",colSpan:m,children:a.jsx("div",{className:"nk-table__empty-content",children:c})})}):a.jsx(v.Provider,{value:"body",children:t})})});function K(n,r,e){return n===void 0?r:e?e(n):n instanceof Date?Number.isNaN(n.getTime())?"Invalid Date":n.toISOString().slice(0,10):typeof n=="boolean"?n?"Yes":"No":n}function O(n){if(typeof n=="number"||typeof n=="string")return String(n)}const S=o.forwardRef(function(r,e){const{align:t="left",children:s,className:i,format:c,title:b,truncate:d,value:m,...p}=r,{rowTrigger:l,...u}=p,k=K(m,s,c),f=d===void 0?void 0:{maxWidth:d},g=b??(d===void 0?void 0:O(k));return a.jsxs("td",{...u,ref:e,className:["nk-table__cell",i].filter(Boolean).join(" "),"data-align":t,title:g,children:[(l==null?void 0:l.kind)==="link"&&l.linkProperties?a.jsx("a",{ref:l.reference,"aria-label":l.ariaLabel,className:"nk-table__row-trigger",download:l.linkProperties.download,href:l.linkProperties.href,hrefLang:l.linkProperties.hrefLang,onClick:l.linkProperties.onNavigate,rel:l.linkProperties.rel,target:l.linkProperties.target}):null,(l==null?void 0:l.kind)==="button"?a.jsx("button",{ref:l.reference,"aria-label":l.ariaLabel,className:"nk-table__row-trigger",onClick:l.onClick,type:"button"}):null,d!==void 0?a.jsx("span",{className:"nk-table__truncated-content",style:f,children:k}):k]})}),F=o.forwardRef(function(r,e){const{children:t,className:s,...i}=r;return a.jsx("tfoot",{...i,ref:e,className:["nk-table__foot",s].filter(Boolean).join(" "),children:a.jsx(v.Provider,{value:"foot",children:t})})}),q=o.forwardRef(function(r,e){const{children:t,className:s,...i}=r;return a.jsx("thead",{...i,ref:e,className:["nk-table__head",s].filter(Boolean).join(" "),children:a.jsx(v.Provider,{value:"head",children:t})})}),z=["a[href]","audio[controls]","button","iframe","input","label","select","summary","textarea","video[controls]","[contenteditable]:not([contenteditable='false'])"].join(","),V=new Set(["button","checkbox","combobox","grid","link","listbox","menu","menubar","menuitem","menuitemcheckbox","menuitemradio","option","radio","radiogroup","scrollbar","searchbox","slider","spinbutton","switch","tab","tablist","textbox","tree","treegrid","treeitem"]);function M(n,r){var t;let e=n;for(;e&&e!==r;){if(e.matches(z)||(((t=e.getAttribute("role"))==null?void 0:t.split(/\s+/))??[]).some(i=>V.has(i)))return!0;e=e.parentElement}return!1}function Y(n,r){let e=!1;function t(i){return o.Children.map(i,c=>o.isValidElement(c)?c.type===o.Fragment?o.cloneElement(c,void 0,t(c.props.children)):!e&&c.type===S?(e=!0,o.cloneElement(c,{rowTrigger:r})):c:c)}const s=t(n);return{attached:e,content:s}}function X(n){const{"aria-label":r,icon:e,label:t,...s}=n;return a.jsx(H.Tooltip2,{content:t,children:a.jsx(I.Button,{...s,"aria-label":r??t,className:"nk-table__action",icon:e,shape:"rectangle",type:"button",variant:"ghost"})})}function $(n){const{actions:r}=n;function e(t){t.stopPropagation()}return a.jsx("td",{className:"nk-table__cell nk-table__action-cell","data-align":"right",onClick:e,children:r.length>0?a.jsx("span",{className:"nk-table__action-list",children:r.map(t=>o.createElement(X,{...t,key:t.label}))}):null})}const G=o.forwardRef(function(r,e){const{children:t,className:s,...i}=r;return a.jsx(R,{...i,ref:e,align:"right",className:["nk-table__action-header-cell",s].filter(Boolean).join(" "),children:t??a.jsx("span",{className:"nk-table__visually-hidden",children:"Row actions"})})}),J=o.forwardRef(function(r,e){const{"aria-label":t,actions:s,children:i,className:c,download:b,href:d,hrefLang:m,onClick:p,onNavigate:l,rel:u,target:k,...f}=r,g=o.useRef(null),P=o.useContext(v),x=d!==void 0||p!==void 0,T=(t==null?void 0:t.trim())||(d!==void 0?"Open row":"Activate row");function N(h){g.current=h}let C;d!==void 0?C={ariaLabel:T,kind:"link",linkProperties:{download:b,href:d,hrefLang:m,onNavigate:l,rel:u,target:k},reference:N}:p!==void 0&&(C={ariaLabel:T,kind:"button",onClick:p,reference:N});const E=C?Y(i,C):{content:i};function B(h){if(h.defaultPrevented)return;const j=h.target;if(!(j instanceof Element)||M(j,h.currentTarget))return;const _=g.current;if(!_)return;const y=_.ownerDocument.defaultView;if(!y){_.click();return}_.dispatchEvent(new y.MouseEvent("click",{altKey:h.altKey,bubbles:!0,button:h.button,buttons:h.buttons,cancelable:!0,clientX:h.clientX,clientY:h.clientY,ctrlKey:h.ctrlKey,metaKey:h.metaKey,shiftKey:h.shiftKey}))}const L=P==="head"?a.jsx(G,{}):a.jsx($,{actions:s??[]});return a.jsxs("tr",{...f,ref:e,"aria-label":x?void 0:t,className:["nk-table__row",c].filter(Boolean).join(" "),"data-interactive":x||void 0,onClick:x?B:void 0,children:[E.content,L]})});function Q(){const n=o.useRef(null),r=o.useRef(null),[e,t]=o.useState(!1),[s,i]=o.useState(!1);o.useEffect(()=>{const b=n.current,d=r.current;if(!b||!d)return;const m=b,p=d;function l(){const g=m.scrollWidth>m.clientWidth;t(g),g||i(!1)}l();const u=m.ownerDocument.defaultView;u==null||u.addEventListener("resize",l);const k=u==null?void 0:u.ResizeObserver,f=k?new k(l):void 0;return f==null||f.observe(m),f==null||f.observe(p),()=>{u==null||u.removeEventListener("resize",l),f==null||f.disconnect()}},[]);function c(b){i(e&&b.currentTarget.scrollLeft>1)}return{containerReference:n,contentReference:r,isScrollable:e,isScrolled:s,handleScroll:c}}const U=o.forwardRef(function(r,e){const{"aria-label":t,children:s,className:i,containerClassName:c,...b}=r,{containerReference:d,contentReference:m,isScrollable:p,isScrolled:l,handleScroll:u}=Q(),k=t?`${t} scroll area`:"Scrollable table",f=o.useCallback(g=>{m.current=g,A.assignElementReference(e,g)},[m,e]);return a.jsx("div",{ref:d,"aria-label":p?k:void 0,className:["nk-table",c].filter(Boolean).join(" "),"data-scrolled":l||void 0,onScroll:u,role:p?"region":void 0,tabIndex:p?0:void 0,children:a.jsx("table",{...b,ref:f,"aria-label":t,className:["nk-table__element",i].filter(Boolean).join(" "),children:s})})}),W=Object.assign(U,{Body:D,Cell:S,Foot:F,HeaderCell:R,Head:q,Row:J});exports.Table=W;
|
package/dist/Table.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Table-
|
|
1
|
+
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Table-qetwZpTC.cjs");exports.default=e.Table;
|
package/dist/Table.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";const T=require("react/jsx-runtime"),n=require("react"),S=require("./reference-C2guRuR0.cjs"),h=require("./usePresence-B5RYv4e1.cjs"),we=require("./useFloatingPosition-
|
|
1
|
+
"use client";"use strict";const T=require("react/jsx-runtime"),n=require("react"),S=require("./reference-C2guRuR0.cjs"),h=require("./usePresence-B5RYv4e1.cjs"),we=require("./useFloatingPosition-GzkP9dCc.cjs"),Ee=require("./focus-restoration-70WcQRr5.cjs"),be=require("./Surface-BttJYSDt.cjs"),ye=500,G=n.createContext(null);function De(o){const{children:a,delay:c=ye}=o,l=n.useMemo(()=>({delay:c}),[c]);return T.jsx(G.Provider,{value:l,children:a})}const J=500,$=100;function ge(o,a,c,l){a.current=o,S.assignElementReference(c,o),S.assignElementReference(l,o)}function Ie(o){return Number.isFinite(o)?Math.max(0,o):J}function he(o,a){const c=(o==null?void 0:o.split(/\s+/).filter(Boolean))??[];return c.includes(a)||c.push(a),c.join(" ")}const Le=n.forwardRef(function(a,c){const{children:l,className:K,content:m,contentClassName:Q,contentStyle:V,delay:X,disabled:R=!1,onOpenChange:L,placement:A="top",style:Z}=a;if(m==null||typeof m=="boolean"||typeof m=="string"&&!m.trim())throw new Error("Tooltip content must not be empty");if(l.type===n.Fragment)throw new Error("Tooltip requires a single non-Fragment trigger");const z=`${n.useId()}-tooltip`,_=n.useContext(G),r=l.props,B=S.getElementReference(l),w=n.useRef(null),x=n.useRef(null),Y=n.useRef(R),j=n.useRef(!1),v=n.useRef(null),F=n.useRef(null),k=n.useRef(null),C=n.useRef(!1),E=n.useRef(!1),b=n.useRef(!1),f=n.useRef(!1),[M,ee]=n.useState(null),[ne,te]=n.useState(null),[O,re]=n.useState(!1);Y.current=R;const P=Ie(X??(_==null?void 0:_.delay)??J),y=h.usePresence(O),H=(M==null?void 0:M.ownerDocument)??(typeof document>"u"?null:document),q=h.useBoundary("Tooltip").boundaryElement,N=h.useOverlayLayer(y.present,q),d=we.useFloatingPosition(y.present,A,M,ne,q),oe=n.useMemo(()=>[w,x],[]),se=he(r["aria-describedby"],z),ce=O&&y.present?se:r["aria-describedby"],U=n.useCallback(e=>{ge(e,w,B,c),ee(e)},[c,B]),ue=n.useCallback(e=>{x.current=e,e||(f.current=!1),te(e)},[]),u=n.useCallback(()=>{const e=v.current;e&&e.ownerWindow.clearTimeout(e.timerId),v.current=null},[]),i=n.useCallback(()=>{const e=F.current;e&&e.ownerWindow.clearTimeout(e.timerId),F.current=null},[]),D=n.useCallback(()=>{const e=k.current;e&&e.ownerWindow.clearTimeout(e.timerId),k.current=null},[]),s=n.useCallback(e=>{j.current!==e&&(e||(f.current=!1),j.current=e,re(e),L==null||L(e))},[L]),W=n.useCallback(e=>{var g,I;if(i(),E.current||b.current||f.current)return;if(e===0){s(!1);return}const t=((g=w.current)==null?void 0:g.ownerDocument.defaultView)??((I=x.current)==null?void 0:I.ownerDocument.defaultView);if(!t){s(!1);return}const p=t.setTimeout(()=>{F.current=null,!E.current&&!b.current&&!f.current&&s(!1)},e);F.current={ownerWindow:t,timerId:p}},[i,s]),ie=n.useCallback(()=>{var p;if(u(),i(),P===0){s(!0);return}const e=(p=w.current)==null?void 0:p.ownerDocument.defaultView;if(!e)return;const t=e.setTimeout(()=>{v.current=null,Y.current||s(!0)},P);v.current={ownerWindow:e,timerId:t}},[i,u,P,s]);function le(e){var t;if((t=r.onFocus)==null||t.call(r,e),E.current=!0,i(),C.current||Ee.isElementFocusRestoration(e.currentTarget)){u();return}u(),s(!0)}function ae(e){var t;(t=r.onBlur)==null||t.call(r,e),!e.currentTarget.contains(e.relatedTarget)&&(E.current=!1,u(),W(0))}function fe(e){var t;(t=r.onMouseEnter)==null||t.call(r,e),b.current=!0,ie()}function de(e){var t;(t=r.onMouseLeave)==null||t.call(r,e),b.current=!1,u(),W($)}function me(){f.current=!0,i()}function pe(){f.current=!1,W($)}function Te(e){var g,I;(g=r.onPointerDown)==null||g.call(r,e),u(),i(),s(!1);const t=(I=w.current)==null?void 0:I.ownerDocument.defaultView;if(!t)return;C.current=!0,D();const p=t.setTimeout(()=>{C.current=!1,k.current=null},0);k.current={ownerWindow:t,timerId:p}}if(h.useDismissableLayer({boundary:q,active:O,boundaries:oe,dismissOnPointerDownOutside:!0,layerId:N.id,onEscapeDismiss:()=>s(!1),onPointerDownOutsideDismiss:()=>s(!1),ownerDocument:H}),n.useEffect(()=>{R&&(u(),i(),D(),C.current=!1,E.current=!1,b.current=!1,f.current=!1,j.current&&s(!1))},[i,u,D,R,s]),n.useEffect(()=>()=>{u(),i(),D()},[i,u,D]),R)return n.cloneElement(l,{ref:U});const Re=n.cloneElement(l,{"aria-describedby":ce,className:[r.className,"nk-tooltip__trigger",K].filter(Boolean).join(" "),onBlur:ae,onFocus:le,onMouseEnter:fe,onMouseLeave:de,onPointerDown:Te,ref:U,style:{...r.style,...Z}});return T.jsxs(T.Fragment,{children:[Re,y.present&&H?T.jsx(h.Portal,{children:T.jsxs(be.Surface,{ref:ue,"aria-hidden":O?void 0:!0,className:["nk-tooltip",Q].filter(Boolean).join(" "),"data-placement":(d==null?void 0:d.placement)??A,"data-state":y.state==="closing"?"closing":"open",id:z,onMouseEnter:me,onMouseLeave:pe,role:"tooltip",style:d?{...V,"--nk-tooltip-arrow-offset":`${d.arrowOffset}px`,left:d.left,top:d.top,zIndex:N.zIndex}:{...V,visibility:"hidden",zIndex:N.zIndex},children:[T.jsx("span",{"aria-hidden":"true",className:"nk-tooltip__arrow"}),m]})}):null]})}),ve=Object.assign(Le,{Provider:De});exports.Tooltip2=ve;
|
|
@@ -3,7 +3,7 @@ import { jsx as C, jsxs as q, Fragment as Ie } from "react/jsx-runtime";
|
|
|
3
3
|
import { useMemo as X, createContext as be, forwardRef as he, Fragment as Le, useId as ve, useContext as Fe, useRef as u, useState as A, useCallback as f, useEffect as G, cloneElement as J } from "react";
|
|
4
4
|
import { g as Oe, a as K } from "./reference-CXMr27nM.js";
|
|
5
5
|
import { c as Me, b as _e, d as Pe, e as xe, P as Ne } from "./usePresence-CqegYqy4.js";
|
|
6
|
-
import { u as We } from "./useFloatingPosition-
|
|
6
|
+
import { u as We } from "./useFloatingPosition-B3ZC-v3v.js";
|
|
7
7
|
import { i as ke } from "./focus-restoration-BvNZzrQA.js";
|
|
8
8
|
import { S as Ve } from "./Surface-vEFsZC12.js";
|
|
9
9
|
const je = 500, Z = be(null);
|
package/dist/Tooltip.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Tooltip-
|
|
1
|
+
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Tooltip-B2d5ss7S.cjs");exports.default=e.Tooltip2;
|
package/dist/Tooltip.js
CHANGED
|
Binary file
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { IconGraphicProps } from "./types";
|
|
2
|
+
/**
|
|
3
|
+
* Renders a gear icon.
|
|
4
|
+
*
|
|
5
|
+
* @param props - The SVG properties applied to the icon.
|
|
6
|
+
* @param forwardedReference - The reference assigned to the rendered SVG.
|
|
7
|
+
*
|
|
8
|
+
* @returns The rendered icon SVG.
|
|
9
|
+
*/
|
|
10
|
+
declare const _default: import("react").ForwardRefExoticComponent<Omit<IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
11
|
+
export default _default;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { IconGraphicProps } from "./types";
|
|
2
|
+
/**
|
|
3
|
+
* Renders an image icon.
|
|
4
|
+
*
|
|
5
|
+
* @param props - The SVG properties applied to the icon.
|
|
6
|
+
* @param forwardedReference - The reference assigned to the rendered SVG.
|
|
7
|
+
*
|
|
8
|
+
* @returns The rendered icon SVG.
|
|
9
|
+
*/
|
|
10
|
+
declare const _default: import("react").ForwardRefExoticComponent<Omit<IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
11
|
+
export default _default;
|
|
@@ -38,8 +38,10 @@ export declare const iconGraphics: {
|
|
|
38
38
|
readonly commit: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
39
39
|
readonly folder: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
40
40
|
readonly file: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
41
|
+
readonly image: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
41
42
|
readonly tag: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
42
43
|
readonly key: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
44
|
+
readonly gear: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
43
45
|
readonly git: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
44
46
|
readonly home: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
45
47
|
readonly info: import("react").ForwardRefExoticComponent<Omit<import("../icons/types").IconGraphicProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { type HTMLAttributes, type ReactNode, type RefObject } from "react";
|
|
2
2
|
import SidebarFooter from "./components/SidebarFooter";
|
|
3
3
|
import SidebarGroup from "./components/SidebarGroup";
|
|
4
|
+
import SidebarHeader from "./components/SidebarHeader";
|
|
4
5
|
import SidebarItem from "./components/SidebarItem";
|
|
5
6
|
import { type SidebarSide, type SidebarStyle } from "./components/SidebarPanel";
|
|
6
7
|
import SidebarTrigger from "./components/SidebarTrigger";
|
|
@@ -8,11 +9,13 @@ import SidebarUser from "./components/SidebarUser";
|
|
|
8
9
|
import { type SidebarOpenChangeReason, type SidebarVariant } from "./utils/state";
|
|
9
10
|
import "./styles/sidebar.css";
|
|
10
11
|
export type { SidebarFooterProps } from "./components/SidebarFooter";
|
|
11
|
-
export type {
|
|
12
|
+
export type { SidebarGroupProps } from "./components/SidebarGroup";
|
|
13
|
+
export type { SidebarHeaderProps } from "./components/SidebarHeader";
|
|
12
14
|
export type { SidebarItemProps } from "./components/SidebarItem";
|
|
13
15
|
export type { SidebarSide } from "./components/SidebarPanel";
|
|
14
16
|
export type { SidebarTriggerProps } from "./components/SidebarTrigger";
|
|
15
17
|
export type { SidebarUserAction, SidebarUserProps, } from "./components/SidebarUser";
|
|
18
|
+
export type { SidebarPresentation } from "./utils/presentation";
|
|
16
19
|
export type { SidebarOpenChangeReason, SidebarVariant } from "./utils/state";
|
|
17
20
|
/** A type representing the complete compound Sidebar component. */
|
|
18
21
|
type SidebarComponent = typeof SidebarRoot & {
|
|
@@ -20,6 +23,8 @@ type SidebarComponent = typeof SidebarRoot & {
|
|
|
20
23
|
Footer: typeof SidebarFooter;
|
|
21
24
|
/** A related set of Sidebar items forming one navigation region. */
|
|
22
25
|
Group: typeof SidebarGroup;
|
|
26
|
+
/** The region rendered at the top of the Sidebar. */
|
|
27
|
+
Header: typeof SidebarHeader;
|
|
23
28
|
/** One navigation destination or action inside a group. */
|
|
24
29
|
Item: typeof SidebarItem;
|
|
25
30
|
/** The control disclosing an overlay Sidebar. */
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import { type HTMLAttributes, type ReactNode } from "react";
|
|
2
|
+
import { type SidebarPresentation } from "../utils/presentation";
|
|
2
3
|
/** A type representing properties for the Sidebar.Footer component. */
|
|
3
4
|
export type SidebarFooterProps = HTMLAttributes<HTMLDivElement> & {
|
|
4
5
|
/** The content pinned to the bottom of the Sidebar. */
|
|
5
6
|
children?: ReactNode;
|
|
7
|
+
/** The presentations the footer is rendered in. */
|
|
8
|
+
presentation?: SidebarPresentation;
|
|
6
9
|
};
|
|
7
10
|
/**
|
|
8
11
|
* Renders the region pinned to the bottom of a Sidebar.
|
|
@@ -15,5 +18,7 @@ export type SidebarFooterProps = HTMLAttributes<HTMLDivElement> & {
|
|
|
15
18
|
declare const SidebarFooter: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
|
|
16
19
|
/** The content pinned to the bottom of the Sidebar. */
|
|
17
20
|
children?: ReactNode;
|
|
21
|
+
/** The presentations the footer is rendered in. */
|
|
22
|
+
presentation?: SidebarPresentation;
|
|
18
23
|
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
19
24
|
export default SidebarFooter;
|
|
@@ -1,19 +1,13 @@
|
|
|
1
1
|
import { type HTMLAttributes, type ReactNode } from "react";
|
|
2
|
-
|
|
3
|
-
export type SidebarGroupPresentation = "both" | "inline" | "overlay";
|
|
2
|
+
import { type SidebarPresentation } from "../utils/presentation";
|
|
4
3
|
/** A type representing properties for the Sidebar.Group component. */
|
|
5
4
|
export type SidebarGroupProps = Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
|
|
6
5
|
/** The Sidebar items rendered inside the group. */
|
|
7
6
|
children?: ReactNode;
|
|
8
7
|
/** The visible heading naming the group's navigation region. */
|
|
9
8
|
label?: ReactNode;
|
|
10
|
-
/**
|
|
11
|
-
|
|
12
|
-
*
|
|
13
|
-
* Restricting a group suits navigation duplicated elsewhere in a wide
|
|
14
|
-
* layout, such as links an application bar already provides.
|
|
15
|
-
*/
|
|
16
|
-
presentation?: SidebarGroupPresentation;
|
|
9
|
+
/** The presentations the group is rendered in. */
|
|
10
|
+
presentation?: SidebarPresentation;
|
|
17
11
|
};
|
|
18
12
|
/**
|
|
19
13
|
* Renders a related set of Sidebar items as one navigation region.
|
|
@@ -31,12 +25,7 @@ declare const SidebarGroup: import("react").ForwardRefExoticComponent<Omit<HTMLA
|
|
|
31
25
|
children?: ReactNode;
|
|
32
26
|
/** The visible heading naming the group's navigation region. */
|
|
33
27
|
label?: ReactNode;
|
|
34
|
-
/**
|
|
35
|
-
|
|
36
|
-
*
|
|
37
|
-
* Restricting a group suits navigation duplicated elsewhere in a wide
|
|
38
|
-
* layout, such as links an application bar already provides.
|
|
39
|
-
*/
|
|
40
|
-
presentation?: SidebarGroupPresentation;
|
|
28
|
+
/** The presentations the group is rendered in. */
|
|
29
|
+
presentation?: SidebarPresentation;
|
|
41
30
|
} & import("react").RefAttributes<HTMLElement>>;
|
|
42
31
|
export default SidebarGroup;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { type HTMLAttributes, type ReactNode } from "react";
|
|
2
|
+
import { type SidebarPresentation } from "../utils/presentation";
|
|
3
|
+
/** A type representing properties for the Sidebar.Header component. */
|
|
4
|
+
export type SidebarHeaderProps = HTMLAttributes<HTMLDivElement> & {
|
|
5
|
+
/** The content rendered at the top of the Sidebar. */
|
|
6
|
+
children?: ReactNode;
|
|
7
|
+
/** The presentations the header is rendered in. */
|
|
8
|
+
presentation?: SidebarPresentation;
|
|
9
|
+
};
|
|
10
|
+
/**
|
|
11
|
+
* Renders the region at the top of a Sidebar.
|
|
12
|
+
*
|
|
13
|
+
* The region holds whatever identifies the interface, such as a logo or a
|
|
14
|
+
* workspace switcher, and scrolls away with the navigation rather than
|
|
15
|
+
* pinning like the footer. Giving it an `id` and passing that to the
|
|
16
|
+
* Sidebar's `aria-labelledby` names the panel after the content shown here.
|
|
17
|
+
*
|
|
18
|
+
* @param props - The native properties that configure the header.
|
|
19
|
+
* @param forwardedReference - The reference assigned to the header element.
|
|
20
|
+
*
|
|
21
|
+
* @returns The rendered Sidebar header.
|
|
22
|
+
*/
|
|
23
|
+
declare const SidebarHeader: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
|
|
24
|
+
/** The content rendered at the top of the Sidebar. */
|
|
25
|
+
children?: ReactNode;
|
|
26
|
+
/** The presentations the header is rendered in. */
|
|
27
|
+
presentation?: SidebarPresentation;
|
|
28
|
+
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
29
|
+
export default SidebarHeader;
|