najm-kit 2.6.3 → 2.6.4

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/index.mjs CHANGED
@@ -1,12 +1,14 @@
1
- import * as React from 'react';
2
- import React__default, { createContext, useRef, useMemo, useContext, useState, useEffect, useCallback, useLayoutEffect, isValidElement } from 'react';
3
- import { Slot } from '@radix-ui/react-slot';
4
- import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
5
- import { clsx } from 'clsx';
6
- import { twMerge } from 'tailwind-merge';
1
+ import { useResolvedPaginationLabels } from './chunk-JZJCQBOH.mjs';
2
+ export { DEFAULT_PAGINATION_KEY_PREFIX, DEFAULT_TIME_ZONE, NTableDefaultsProvider, NajmPreferencesProvider, NajmUIProvider, buildPaginationLabels, useNTableDefaults, useNajmPreferencesContext, useNajmTheme, useNajmTimeZone } from './chunk-JZJCQBOH.mjs';
3
+ import { resolveRadiusValue, inputBorderClasses, cn, Button, NIcon, NajmScroll, surfaceBorderClasses, useNajmScrollViewport, resolveVariantAlias, buttonVariants, NButton, parseNajmDesignConfig, useTableStore, TableStoreContext, sidebarBorderClasses, NTableJson } from './chunk-4DLRXB2W.mjs';
4
+ export { Button, NAJM_COMPONENT_NAMES, NButton, NIcon, NTableJson, NajmScroll, RADIUS_VALUE_MAP, TableStoreContext, buttonVariants, cn, defineNajmDesignConfig, defineNajmThemeConfig, inputBorderClasses, parseNajmDesignConfig, parseNajmThemeConfig, resolveRadiusValue, resolveVariantAlias, sidebarBorderClasses, stringifyNajmDesignConfig, stringifyNajmThemeConfig, surfaceBorderClasses, useTableStore } from './chunk-4DLRXB2W.mjs';
5
+ import { useNajmComponentStyle, NajmThemeContainerCtx, useNajmThemeMode, useNajmDesign, composePreset } from './chunk-YBM5CTE6.mjs';
6
+ export { NajmDesignProvider, NajmThemeProvider, composePreset, resolvePreset, useNajmAppearance, useNajmComponentStyle, useNajmDesign, useNajmThemeMode } from './chunk-YBM5CTE6.mjs';
7
+ import * as React60 from 'react';
8
+ import React60__default, { createContext, useRef, useMemo, useState, useEffect, useContext, useCallback, useLayoutEffect, isValidElement } from 'react';
7
9
  import * as TabsPrimitive from '@radix-ui/react-tabs';
8
- import * as LucideIcons from 'lucide-react';
9
- import { ChevronDown, AlertTriangle, RefreshCw, LoaderCircleIcon, X, XIcon, Menu, Search, SearchIcon, CheckIcon, ChevronUp, ChevronDownIcon, ChevronUpIcon, Eye, EyeOff, ChevronsUpDown, Check, CircleIcon, ChevronLeftIcon, ChevronRightIcon, Calendar as Calendar$1, FileUp, Folder, UploadCloud, CheckCircle2, AlertCircle, Camera, Star, Globe, Clock, Trash2, Plus, Upload, Download, RotateCcw, Table as Table$1, FileJson, ChevronRight, ArrowUpDown, Loader2, MoreVertical, Edit, ChevronsLeft, ChevronLeft, ChevronsRight, Pencil, Merge, PanelLeftOpen, PanelLeftClose, LogOut, Image, ArrowUp, ArrowDown, CheckSquare, FilePlus, FolderPlus, Share2, Move, ClipboardPaste, Copy, Scissors, LoaderPinwheelIcon, LoaderIcon, ArrowUpRight, ArrowDownRight, SlidersHorizontal, Columns3, Settings, Filter, SearchX, Inbox, List, LayoutGrid, Code, FolderOpen } from 'lucide-react';
10
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
11
+ import { ChevronDown, AlertTriangle, RefreshCw, X, XIcon, Menu, Search, SearchIcon, CheckIcon, ChevronUp, ChevronDownIcon, ChevronUpIcon, Eye, EyeOff, ChevronsUpDown, Check, CircleIcon, ChevronLeftIcon, ChevronRightIcon, Calendar as Calendar$1, FileUp, Folder, UploadCloud, CheckCircle2, AlertCircle, Camera, Star, Globe, Clock, Trash2, Plus, Upload, Download, RotateCcw, Table as Table$1, FileJson, ChevronRight, ArrowUpDown, Loader2, MoreVertical, Edit, ChevronsLeft, ChevronLeft, ChevronsRight, Pencil, Merge, PanelLeftOpen, PanelLeftClose, LogOut, Image, ArrowUp, ArrowDown, CheckSquare, FilePlus, FolderPlus, Share2, Move, ClipboardPaste, Copy, Scissors, LoaderCircleIcon, LoaderPinwheelIcon, LoaderIcon, ArrowUpRight, ArrowDownRight, SlidersHorizontal, Columns3, Settings, Filter, SearchX, Inbox, List, LayoutGrid, Code, FolderOpen } from 'lucide-react';
10
12
  import * as TooltipPrimitive from '@radix-ui/react-tooltip';
11
13
  import { cva } from 'class-variance-authority';
12
14
  import { HexColorPicker } from 'react-colorful';
@@ -15,10 +17,9 @@ import { converter, parse, formatHsl, formatRgb, formatHex } from 'culori';
15
17
  import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
16
18
  import { Command as Command$1 } from 'cmdk';
17
19
  import * as SheetPrimitive from '@radix-ui/react-dialog';
18
- import { OverlayScrollbars } from 'overlayscrollbars';
19
- import { OverlayScrollbarsComponent } from 'overlayscrollbars-react';
20
20
  import { create } from 'zustand';
21
21
  import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
22
+ import { Slot } from '@radix-ui/react-slot';
22
23
  import * as SelectPrimitive from '@radix-ui/react-select';
23
24
  import * as SwitchPrimitive from '@radix-ui/react-switch';
24
25
  import * as LabelPrimitive from '@radix-ui/react-label';
@@ -39,310 +40,6 @@ import { FormProvider, Controller, useFormContext, useForm, useFieldArray } from
39
40
  import { zodResolver } from '@hookform/resolvers/zod';
40
41
  import { getExpandedRowModel, getSortedRowModel, getPaginationRowModel, getFilteredRowModel, getCoreRowModel, useReactTable, flexRender } from '@tanstack/react-table';
41
42
 
42
- // src/theme/provider.tsx
43
-
44
- // src/theme/presets/modes.ts
45
- var lightMode = {
46
- background: "oklch(1 0 0)",
47
- foreground: "oklch(0.1445 0 0)",
48
- card: "oklch(1 0 0)",
49
- "card-foreground": "oklch(0.1445 0 0)",
50
- popover: "oklch(1 0 0)",
51
- "popover-foreground": "oklch(0.1445 0 0)",
52
- secondary: "oklch(0.9703 0 0)",
53
- "secondary-foreground": "oklch(0.2044 0 0)",
54
- tertiary: "oklch(0.9676 0.007 247.897)",
55
- "tertiary-foreground": "oklch(0.3138 0.0453 249.447)",
56
- muted: "oklch(0.9703 0 0)",
57
- "muted-foreground": "oklch(0.5555 0 0)",
58
- accent: "oklch(0.9703 0 0)",
59
- "accent-foreground": "oklch(0.2044 0 0)",
60
- destructive: "oklch(0.6368 0.2078 25.326)",
61
- "destructive-foreground": "oklch(0.9848 0 0)",
62
- border: "oklch(0.9219 0 0)",
63
- input: "oklch(0.9219 0 0)",
64
- radius: "0.5rem",
65
- sidebar: "oklch(0.985 0 0)",
66
- "sidebar-foreground": "oklch(0.1445 0 0)",
67
- "sidebar-primary": "oklch(0.2228 0.0043 286.044)",
68
- "sidebar-primary-foreground": "oklch(0.9848 0 0)",
69
- "sidebar-accent": "oklch(0.9703 0 0)",
70
- "sidebar-accent-foreground": "oklch(0.2044 0 0)",
71
- "sidebar-border": "oklch(0.9219 0 0)",
72
- "sidebar-ring": "oklch(0.2228 0.0043 286.044)"
73
- };
74
- var darkMode = {
75
- background: "oklch(0.1417 0.0044 285.819)",
76
- foreground: "oklch(0.9683 0.0014 286.375)",
77
- card: "oklch(0.1872 0.0066 285.748)",
78
- "card-foreground": "oklch(0.9683 0.0014 286.375)",
79
- popover: "oklch(0.1872 0.0066 285.748)",
80
- "popover-foreground": "oklch(0.9683 0.0014 286.375)",
81
- secondary: "oklch(0.2313 0.007 285.839)",
82
- "secondary-foreground": "oklch(0.9203 0.0034 286.332)",
83
- tertiary: "oklch(0.3138 0.0453 249.447)",
84
- "tertiary-foreground": "oklch(0.8529 0.0324 248.208)",
85
- muted: "oklch(0.2313 0.007 285.839)",
86
- "muted-foreground": "oklch(0.6255 0.0171 285.896)",
87
- accent: "oklch(0.2313 0.007 285.839)",
88
- "accent-foreground": "oklch(0.9683 0.0014 286.375)",
89
- destructive: "oklch(0.6356 0.2082 25.378)",
90
- "destructive-foreground": "oklch(1 0 0)",
91
- border: "oklch(0.262 0.0085 285.799)",
92
- input: "oklch(0.262 0.0085 285.799)",
93
- radius: "0.5rem",
94
- sidebar: "oklch(0.205 0 0)",
95
- "sidebar-foreground": "oklch(0.9683 0.0014 286.375)",
96
- "sidebar-primary": "oklch(0.4865 0.2423 291.866)",
97
- "sidebar-primary-foreground": "oklch(0.9848 0 0)",
98
- "sidebar-accent": "oklch(0.2313 0.007 285.839)",
99
- "sidebar-accent-foreground": "oklch(0.9683 0.0014 286.375)",
100
- "sidebar-border": "oklch(0.262 0.0085 285.799)",
101
- "sidebar-ring": "oklch(0.4865 0.2423 291.866)"
102
- };
103
-
104
- // src/theme/presets/accents.ts
105
- var accents = {
106
- neutral: {
107
- primary: "oklch(0.2228 0.0043 286.044)",
108
- "primary-foreground": "oklch(0.9848 0 0)",
109
- ring: "oklch(0.2228 0.0043 286.044)",
110
- accent: "oklch(0.2747 0.006 286.001)",
111
- "accent-foreground": "oklch(0.9848 0 0)",
112
- "sidebar-primary": "oklch(0.2228 0.0043 286.044)",
113
- "sidebar-ring": "oklch(0.2228 0.0043 286.044)"
114
- },
115
- emerald: {
116
- primary: "oklch(0.6902 0.1481 162.368)",
117
- "primary-foreground": "oklch(1 0 0)",
118
- ring: "oklch(0.6902 0.1481 162.368)",
119
- accent: "oklch(0.3519 0.0714 164.26)",
120
- "accent-foreground": "oklch(0.9131 0.0924 171.145)",
121
- "sidebar-primary": "oklch(0.6902 0.1481 162.368)",
122
- "sidebar-ring": "oklch(0.6902 0.1481 162.368)"
123
- },
124
- green: {
125
- primary: "oklch(0.7205 0.192 149.493)",
126
- "primary-foreground": "oklch(1 0 0)",
127
- ring: "oklch(0.7205 0.192 149.493)",
128
- accent: "oklch(0.333 0.0811 150.922)",
129
- "accent-foreground": "oklch(0.8958 0.096 156.121)",
130
- "sidebar-primary": "oklch(0.7205 0.192 149.493)",
131
- "sidebar-ring": "oklch(0.7205 0.192 149.493)"
132
- },
133
- slate: {
134
- primary: "oklch(0.6227 0.0463 256.82)",
135
- "primary-foreground": "oklch(1 0 0)",
136
- ring: "oklch(0.6227 0.0463 256.82)",
137
- accent: "oklch(0.3115 0.0245 256.824)",
138
- "accent-foreground": "oklch(0.8784 0.0141 256.711)",
139
- "sidebar-primary": "oklch(0.6227 0.0463 256.82)",
140
- "sidebar-ring": "oklch(0.6227 0.0463 256.82)"
141
- },
142
- blue: {
143
- primary: "oklch(0.6261 0.1859 259.596)",
144
- "primary-foreground": "oklch(1 0 0)",
145
- ring: "oklch(0.6261 0.1859 259.596)",
146
- accent: "oklch(0.2941 0.1092 259.917)",
147
- "accent-foreground": "oklch(0.8064 0.0902 259.76)",
148
- "sidebar-primary": "oklch(0.6261 0.1859 259.596)",
149
- "sidebar-ring": "oklch(0.6261 0.1859 259.596)"
150
- },
151
- violet: {
152
- primary: "oklch(0.4865 0.2423 291.866)",
153
- "primary-foreground": "oklch(1 0 0)",
154
- ring: "oklch(0.6016 0.2214 292.234)",
155
- accent: "oklch(0.2467 0.109 294.41)",
156
- "accent-foreground": "oklch(0.7817 0.1036 301.636)",
157
- "sidebar-primary": "oklch(0.4865 0.2423 291.866)",
158
- "sidebar-ring": "oklch(0.6016 0.2214 292.234)"
159
- }
160
- };
161
-
162
- // src/theme/presets/compose.ts
163
- function lightAccentFromPrimary(primary = "") {
164
- const m = primary.trim().match(/^oklch\(\s*([\d.]+)\s+([\d.]+)\s+([\d.]+)\s*\)$/i);
165
- if (!m) return { accent: "oklch(0.95 0 0)", "accent-foreground": "oklch(0.42 0 0)" };
166
- const c = Number(m[2]);
167
- const h = Number(m[3]);
168
- const tint = Math.min(c, 0.05);
169
- const fg = Math.min(c, 0.12);
170
- return {
171
- accent: `oklch(0.95 ${tint} ${h})`,
172
- "accent-foreground": `oklch(0.42 ${fg} ${h})`
173
- };
174
- }
175
- function composePreset(mode, accent) {
176
- const base = mode === "dark" ? darkMode : lightMode;
177
- const accentTokens = accents[accent];
178
- if (mode === "light") {
179
- const { accent: _a, "accent-foreground": _af, ...brandTokens } = accentTokens;
180
- return { ...base, ...brandTokens, ...lightAccentFromPrimary(brandTokens.primary) };
181
- }
182
- return { ...base, ...accentTokens };
183
- }
184
- var PRESET_MAP = {
185
- light: { mode: "light", accent: "neutral" },
186
- dark: { mode: "dark", accent: "neutral" },
187
- "dark-emerald": { mode: "dark", accent: "emerald" },
188
- "dark-green": { mode: "dark", accent: "green" },
189
- "dark-slate": { mode: "dark", accent: "slate" },
190
- "dark-blue": { mode: "dark", accent: "blue" },
191
- "dark-violet": { mode: "dark", accent: "violet" }
192
- };
193
- function resolvePreset(preset) {
194
- const { mode, accent } = PRESET_MAP[preset];
195
- return composePreset(mode, accent);
196
- }
197
- var ACCENT_KEYS = /* @__PURE__ */ new Set([
198
- "primary",
199
- "primary-foreground",
200
- "ring",
201
- "accent",
202
- "accent-foreground",
203
- "sidebar-primary",
204
- "sidebar-ring"
205
- ]);
206
- function tokensToStyle(tokens, accentOnly) {
207
- const style = {};
208
- for (const [key, value] of Object.entries(tokens)) {
209
- if (value && (!accentOnly || ACCENT_KEYS.has(key))) {
210
- style[`--${key}`] = value;
211
- }
212
- }
213
- return style;
214
- }
215
- var RADIUS_TOKENS = [
216
- "--radius-xs",
217
- "--radius-sm",
218
- "--radius-md",
219
- "--radius-lg",
220
- "--radius-xl",
221
- "--radius-2xl",
222
- "--radius-3xl",
223
- "--radius-4xl"
224
- ];
225
- function radiusToStyle(radius) {
226
- const style = { "--radius": radius };
227
- for (const key of RADIUS_TOKENS) style[key] = "var(--radius)";
228
- return style;
229
- }
230
- function resolveThemeTokens({
231
- preset,
232
- mode,
233
- accent,
234
- explicitTokens,
235
- configTokens,
236
- configMode,
237
- overrides
238
- }) {
239
- if (explicitTokens) return explicitTokens;
240
- const tokenMode = mode ?? configMode;
241
- const modeOverrides = tokenMode ? overrides?.[tokenMode] : void 0;
242
- const tokensMatchMode2 = !configMode || !tokenMode || configMode === tokenMode;
243
- const scopedTokens = tokensMatchMode2 ? configTokens : void 0;
244
- if (preset) {
245
- return { ...resolvePreset(preset), ...scopedTokens ?? {}, ...modeOverrides ?? {} };
246
- }
247
- if (tokenMode) {
248
- return {
249
- ...composePreset(tokenMode, accent ?? "neutral"),
250
- ...scopedTokens ?? {},
251
- ...modeOverrides ?? {}
252
- };
253
- }
254
- if (scopedTokens || modeOverrides) return { ...scopedTokens ?? {}, ...modeOverrides ?? {} };
255
- return null;
256
- }
257
- var NajmThemeDepthContext = React.createContext(0);
258
- var NajmThemeModeContext = React.createContext(void 0);
259
- function useNajmThemeMode() {
260
- return React.useContext(NajmThemeModeContext);
261
- }
262
- var NajmThemeContainerCtx = React.createContext(null);
263
- var DEFAULT_APPEARANCE = {};
264
- var NajmAppearanceContext = React.createContext(DEFAULT_APPEARANCE);
265
- function useNajmAppearance() {
266
- return React.useContext(NajmAppearanceContext);
267
- }
268
- function NajmThemeProvider({
269
- config,
270
- preset,
271
- mode,
272
- accent,
273
- tokens,
274
- accentOnly,
275
- appearance,
276
- radius,
277
- className,
278
- asChild,
279
- children
280
- }) {
281
- const depth = React.useContext(NajmThemeDepthContext);
282
- const parentMode = React.useContext(NajmThemeModeContext);
283
- const parentAppearance = React.useContext(NajmAppearanceContext);
284
- const effectivePreset = preset ?? config?.preset;
285
- const effectiveMode = mode ?? config?.mode;
286
- const effectiveAccent = accent ?? config?.accent;
287
- const effectiveAccentOnly = accentOnly ?? config?.accentOnly;
288
- const effectiveRadius = radius ?? config?.radius;
289
- const effectiveBorderWidth = appearance?.borderWidth ?? config?.appearance?.borderWidth;
290
- const resolved = React.useMemo(() => {
291
- return resolveThemeTokens({
292
- preset: effectivePreset,
293
- mode: effectiveMode,
294
- accent: effectiveAccent,
295
- explicitTokens: tokens,
296
- configTokens: config?.tokens,
297
- configMode: config?.mode,
298
- overrides: config?.overrides
299
- });
300
- }, [
301
- effectivePreset,
302
- effectiveMode,
303
- effectiveAccent,
304
- tokens,
305
- config?.tokens,
306
- config?.mode,
307
- config?.overrides
308
- ]);
309
- const style = React.useMemo(
310
- () => {
311
- const tokenStyle = resolved ? tokensToStyle(resolved, effectiveAccentOnly) : void 0;
312
- const radiusStyle = effectiveRadius !== void 0 ? radiusToStyle(effectiveRadius) : void 0;
313
- const borderWidthStyle = effectiveBorderWidth !== void 0 ? { "--border-width": effectiveBorderWidth } : void 0;
314
- if (!tokenStyle && !radiusStyle && !borderWidthStyle) return void 0;
315
- return { ...tokenStyle, ...radiusStyle, ...borderWidthStyle };
316
- },
317
- [resolved, effectiveAccentOnly, effectiveRadius, effectiveBorderWidth]
318
- );
319
- const Comp = asChild ? Slot : "div";
320
- const [container, setContainer] = React.useState(null);
321
- const containerRef = React.useRef(null);
322
- const handleContainerRef = React.useCallback((node) => {
323
- if (containerRef.current === node) return;
324
- containerRef.current = node;
325
- setContainer(node);
326
- }, []);
327
- const resolvedAppearance = React.useMemo(
328
- () => ({ ...parentAppearance, ...config?.appearance ?? {}, ...appearance ?? {} }),
329
- [parentAppearance, config?.appearance, appearance]
330
- );
331
- return /* @__PURE__ */ jsx(NajmThemeDepthContext.Provider, { value: depth + 1, children: /* @__PURE__ */ jsx(NajmThemeModeContext.Provider, { value: effectiveMode ?? parentMode, children: /* @__PURE__ */ jsx(NajmAppearanceContext.Provider, { value: resolvedAppearance, children: /* @__PURE__ */ jsx(NajmThemeContainerCtx.Provider, { value: container, children: /* @__PURE__ */ jsx(
332
- Comp,
333
- {
334
- ref: handleContainerRef,
335
- suppressHydrationWarning: true,
336
- "data-najm-theme": effectivePreset ?? `${effectiveMode ?? "light"}-${effectiveAccent ?? "neutral"}`,
337
- className,
338
- style,
339
- children
340
- }
341
- ) }) }) }) });
342
- }
343
- function cn(...inputs) {
344
- return twMerge(clsx(inputs));
345
- }
346
43
  function Tabs({
347
44
  className,
348
45
  variant = "pills",
@@ -445,77 +142,6 @@ var TAB_COLORS = {
445
142
  card: { list: "bg-card", active: "bg-muted" },
446
143
  ghost: { list: "bg-transparent", active: "bg-accent" }
447
144
  };
448
- function toPascalCase(value) {
449
- return value.replace(/([a-z0-9])([A-Z])/g, "$1 $2").split(/[\s_-]+/).filter(Boolean).map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join("");
450
- }
451
- function isImageSource(value) {
452
- return value.startsWith("/") || value.startsWith("./") || value.startsWith("../") || value.startsWith("http://") || value.startsWith("https://") || value.startsWith("data:image/") || /\.(avif|gif|jpe?g|png|svg|webp)(\?.*)?$/i.test(value);
453
- }
454
- function isComponentSource(value) {
455
- return typeof value === "function" || Boolean(value && typeof value === "object" && "$$typeof" in value);
456
- }
457
- var NIcon = ({
458
- icon = "circle",
459
- size = 24,
460
- alt = "",
461
- className,
462
- style,
463
- onClick,
464
- ...rest
465
- }) => {
466
- const dimensionStyle = {
467
- width: size,
468
- height: size,
469
- ...style
470
- };
471
- if (React__default.isValidElement(icon)) {
472
- return React__default.cloneElement(icon, {
473
- className: cn(className, icon.props.className),
474
- onClick,
475
- ...rest
476
- });
477
- }
478
- if (icon && typeof icon === "object" && "src" in icon) {
479
- return /* @__PURE__ */ jsx(
480
- "img",
481
- {
482
- alt: icon.alt ?? alt,
483
- className: cn("inline-block shrink-0 object-contain", className),
484
- src: icon.src,
485
- style: dimensionStyle,
486
- onClick,
487
- ...rest
488
- }
489
- );
490
- }
491
- if (isComponentSource(icon)) {
492
- const IconComponent = icon;
493
- return /* @__PURE__ */ jsx(IconComponent, { size, className, onClick, style, ...rest });
494
- }
495
- if (typeof icon === "string") {
496
- if (isImageSource(icon)) {
497
- return /* @__PURE__ */ jsx(
498
- "img",
499
- {
500
- alt,
501
- className: cn("inline-block shrink-0 object-contain", className),
502
- src: icon,
503
- style: dimensionStyle,
504
- onClick,
505
- ...rest
506
- }
507
- );
508
- }
509
- const pascalCaseIcon = toPascalCase(icon);
510
- if (LucideIcons[pascalCaseIcon]) {
511
- const LucideIcon = LucideIcons[pascalCaseIcon];
512
- return /* @__PURE__ */ jsx(LucideIcon, { size, className, onClick, style, ...rest });
513
- }
514
- return null;
515
- }
516
- return null;
517
- };
518
- NIcon.displayName = "NIcon";
519
145
  function hexToRgb(hex) {
520
146
  const m = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
521
147
  return m ? { r: parseInt(m[1], 16), g: parseInt(m[2], 16), b: parseInt(m[3], 16) } : { r: 0, g: 0, b: 0 };
@@ -625,7 +251,7 @@ function NTabs({
625
251
  }
626
252
  var PORTAL_LAYER_STYLE_ID = "najm-kit-portal-layer-styles";
627
253
  function useNajmPortalLayerStyles() {
628
- React.useInsertionEffect(() => {
254
+ React60.useInsertionEffect(() => {
629
255
  if (typeof document === "undefined") return;
630
256
  if (document.getElementById(PORTAL_LAYER_STYLE_ID)) return;
631
257
  const style = document.createElement("style");
@@ -656,7 +282,7 @@ var tooltipContentVariants = cva(
656
282
  }
657
283
  );
658
284
  function TooltipContent({ className, sideOffset = 4, variant, children, ...props }) {
659
- const container = React.useContext(NajmThemeContainerCtx);
285
+ const container = React60.useContext(NajmThemeContainerCtx);
660
286
  useNajmPortalLayerStyles();
661
287
  return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { container: container ?? void 0, children: /* @__PURE__ */ jsx(
662
288
  TooltipPrimitive.Content,
@@ -774,704 +400,8 @@ function NEditorTabs({
774
400
  }
775
401
  );
776
402
  }
777
-
778
- // src/theme/borders.ts
779
- var SURFACE_BORDER_CLASSES = {
780
- all: "najm-border border-border",
781
- top: "najm-border-t border-border",
782
- right: "najm-border-r border-border",
783
- bottom: "najm-border-b border-border",
784
- left: "najm-border-l border-border"
785
- };
786
- var SIDEBAR_BORDER_CLASSES = {
787
- all: "najm-border border-sidebar-border",
788
- top: "najm-border-t border-sidebar-border",
789
- right: "najm-border-r border-sidebar-border",
790
- bottom: "najm-border-b border-sidebar-border",
791
- left: "najm-border-l border-sidebar-border"
792
- };
793
- var BORDER_RESET_CLASSES = {
794
- all: "border-0",
795
- top: "border-t-0",
796
- right: "border-r-0",
797
- bottom: "border-b-0",
798
- left: "border-l-0"
799
- };
800
- function surfaceBorderClasses(bordered = true, side = "all") {
801
- return bordered === false ? BORDER_RESET_CLASSES[side] : SURFACE_BORDER_CLASSES[side];
802
- }
803
- function sidebarBorderClasses(bordered = true, side = "all") {
804
- return bordered === false ? BORDER_RESET_CLASSES[side] : SIDEBAR_BORDER_CLASSES[side];
805
- }
806
- function inputBorderClasses(bordered = true) {
807
- return bordered === false ? "border-0" : "najm-border border-input";
808
- }
809
- var NajmDesignContext = React.createContext({
810
- components: {}
811
- });
812
- function useNajmDesign() {
813
- return React.useContext(NajmDesignContext);
814
- }
815
- function useNajmComponentStyle(name) {
816
- const { components } = useNajmDesign();
817
- return components[name];
818
- }
819
- var SCALE_FACTOR = {
820
- compact: "0.95",
821
- default: "1",
822
- comfortable: "1.05"
823
- };
824
- function typographyToStyle(t) {
825
- const style = {};
826
- if (t.fontSans) style["--font-sans"] = t.fontSans;
827
- if (t.fontHeading) style["--font-heading"] = t.fontHeading;
828
- if (t.fontMono) style["--font-mono"] = t.fontMono;
829
- if (t.baseSize) style["--font-size-base"] = t.baseSize;
830
- if (t.lineHeight) style["--line-height-base"] = t.lineHeight;
831
- if (t.letterSpacing) style["--letter-spacing-base"] = t.letterSpacing;
832
- if (t.scale) style["--font-scale"] = SCALE_FACTOR[t.scale];
833
- return style;
834
- }
835
- function layoutToStyle(layout) {
836
- const style = {};
837
- if (layout.pageGutter) style["--page-gutter"] = layout.pageGutter;
838
- if (layout.sectionGap) style["--section-gap"] = layout.sectionGap;
839
- return style;
840
- }
841
- function NajmDesignProvider({
842
- config,
843
- mode,
844
- className,
845
- children
846
- }) {
847
- const contextValue = React.useMemo(
848
- () => ({ components: config.components ?? {}, typography: config.typography, layout: config.layout }),
849
- [config.components, config.typography, config.layout]
850
- );
851
- const typographyStyle = React.useMemo(
852
- () => config.typography ? typographyToStyle(config.typography) : void 0,
853
- [config.typography]
854
- );
855
- const layoutStyle = React.useMemo(
856
- () => config.layout ? layoutToStyle(config.layout) : void 0,
857
- [config.layout]
858
- );
859
- const providerStyle = React.useMemo(
860
- () => ({ ...layoutStyle ?? {}, ...typographyStyle ?? {} }),
861
- [layoutStyle, typographyStyle]
862
- );
863
- return /* @__PURE__ */ jsx(NajmDesignContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(NajmThemeProvider, { config: config.theme, mode, className, children: layoutStyle || typographyStyle ? (
864
- // `display: contents` lets design CSS variables cascade to
865
- // children without introducing a layout box that would break height
866
- // chains (e.g. h-full) in the consuming app.
867
- /* @__PURE__ */ jsx("div", { style: { display: "contents", ...providerStyle }, "data-najm-design-vars": "", children })
868
- ) : children }) });
869
- }
870
-
871
- // src/theme/design-types.ts
872
- var NAJM_COMPONENT_NAMES = [
873
- "button",
874
- "badge",
875
- "card",
876
- "table",
877
- "tabs",
878
- "dialog",
879
- "alert",
880
- "sidebar",
881
- "pageHeader",
882
- "input",
883
- "select",
884
- "dropdown",
885
- "sheet",
886
- "popover",
887
- "tooltip",
888
- "progress",
889
- "avatar"
890
- ];
891
- var RADIUS_VALUE_MAP = {
892
- none: "0",
893
- xs: "var(--radius-xs)",
894
- sm: "var(--radius-sm)",
895
- md: "var(--radius-md)",
896
- lg: "var(--radius-lg)",
897
- xl: "var(--radius-xl)",
898
- full: "9999px"
899
- };
900
- function resolveRadiusValue(radius) {
901
- if (!radius || radius === "inherit") return void 0;
902
- return RADIUS_VALUE_MAP[radius] ?? radius;
903
- }
904
-
905
- // src/theme/config.ts
906
- var MODES = ["light", "dark"];
907
- var ACCENTS = ["neutral", "emerald", "green", "slate", "blue", "violet"];
908
- var PRESETS = ["light", "dark", "dark-emerald", "dark-green", "dark-slate", "dark-blue", "dark-violet"];
909
- var TOKEN_KEYS = [
910
- "background",
911
- "foreground",
912
- "card",
913
- "card-foreground",
914
- "popover",
915
- "popover-foreground",
916
- "primary",
917
- "primary-foreground",
918
- "secondary",
919
- "secondary-foreground",
920
- "tertiary",
921
- "tertiary-foreground",
922
- "muted",
923
- "muted-foreground",
924
- "accent",
925
- "accent-foreground",
926
- "destructive",
927
- "destructive-foreground",
928
- "border",
929
- "input",
930
- "ring",
931
- "sidebar",
932
- "sidebar-foreground",
933
- "sidebar-primary",
934
- "sidebar-primary-foreground",
935
- "sidebar-accent",
936
- "sidebar-accent-foreground",
937
- "sidebar-border",
938
- "sidebar-ring",
939
- "chart-1",
940
- "chart-2",
941
- "chart-3",
942
- "chart-4",
943
- "chart-5",
944
- "radius"
945
- ];
946
- var ROOT_KEYS = /* @__PURE__ */ new Set([
947
- "preset",
948
- "mode",
949
- "accent",
950
- "tokens",
951
- "overrides",
952
- "accentOnly",
953
- "appearance",
954
- "radius"
955
- ]);
956
- var TOKEN_KEY_SET = new Set(TOKEN_KEYS);
957
- var MODE_KEY_SET = new Set(MODES);
958
- function isRecord(value) {
959
- return typeof value === "object" && value !== null && !Array.isArray(value);
960
- }
961
- function assertKnownKeys(value, keys, path) {
962
- const unknown = Object.keys(value).find((key) => !keys.has(key));
963
- if (unknown) throw new TypeError(`Unknown ${path} property: ${unknown}`);
964
- }
965
- function optionalEnum(value, values, path) {
966
- if (value === void 0) return void 0;
967
- if (typeof value !== "string" || !values.includes(value)) {
968
- throw new TypeError(`${path} must be one of: ${values.join(", ")}`);
969
- }
970
- return value;
971
- }
972
- function optionalString(value, path) {
973
- if (value === void 0) return void 0;
974
- if (typeof value !== "string" || value.trim() === "") {
975
- throw new TypeError(`${path} must be a non-empty string`);
976
- }
977
- return value;
978
- }
979
- function parseTokens(value) {
980
- if (value === void 0) return void 0;
981
- if (!isRecord(value)) throw new TypeError("theme.tokens must be an object");
982
- assertKnownKeys(value, TOKEN_KEY_SET, "theme.tokens");
983
- const tokens = {};
984
- for (const key of TOKEN_KEYS) {
985
- const token = optionalString(value[key], `theme.tokens.${key}`);
986
- if (token !== void 0) tokens[key] = token;
987
- }
988
- return tokens;
989
- }
990
- function parseOverrides(value) {
991
- if (value === void 0) return void 0;
992
- if (!isRecord(value)) throw new TypeError("theme.overrides must be an object");
993
- assertKnownKeys(value, MODE_KEY_SET, "theme.overrides");
994
- const overrides = {};
995
- for (const mode of MODES) {
996
- const entry = value[mode];
997
- if (entry === void 0) continue;
998
- overrides[mode] = parseTokens(entry) ?? {};
999
- }
1000
- return overrides;
1001
- }
1002
- function defineNajmThemeConfig(config) {
1003
- return config;
1004
- }
1005
- function parseNajmThemeConfig(input) {
1006
- let value = input;
1007
- if (typeof input === "string") {
1008
- try {
1009
- value = JSON.parse(input);
1010
- } catch (error) {
1011
- throw new TypeError(`Invalid theme JSON: ${error.message}`);
1012
- }
1013
- }
1014
- if (!isRecord(value)) throw new TypeError("Theme config must be an object");
1015
- assertKnownKeys(value, ROOT_KEYS, "theme");
1016
- let appearance;
1017
- if (value.appearance !== void 0) {
1018
- if (!isRecord(value.appearance)) throw new TypeError("theme.appearance must be an object");
1019
- assertKnownKeys(value.appearance, /* @__PURE__ */ new Set(["borderWidth"]), "theme.appearance");
1020
- appearance = {
1021
- borderWidth: optionalString(
1022
- value.appearance.borderWidth,
1023
- "theme.appearance.borderWidth"
1024
- )
1025
- };
1026
- }
1027
- const accentOnly = value.accentOnly;
1028
- if (accentOnly !== void 0 && typeof accentOnly !== "boolean") {
1029
- throw new TypeError("theme.accentOnly must be a boolean");
1030
- }
1031
- const parsedAccentOnly = typeof accentOnly === "boolean" ? accentOnly : void 0;
1032
- const config = {};
1033
- const preset = optionalEnum(value.preset, PRESETS, "theme.preset");
1034
- const mode = optionalEnum(value.mode, MODES, "theme.mode");
1035
- const accent = optionalEnum(value.accent, ACCENTS, "theme.accent");
1036
- const tokens = parseTokens(value.tokens);
1037
- const overrides = parseOverrides(value.overrides);
1038
- const radius = optionalString(value.radius, "theme.radius");
1039
- if (preset !== void 0) config.preset = preset;
1040
- if (mode !== void 0) config.mode = mode;
1041
- if (accent !== void 0) config.accent = accent;
1042
- if (tokens !== void 0) config.tokens = tokens;
1043
- if (overrides !== void 0) config.overrides = overrides;
1044
- if (parsedAccentOnly !== void 0) config.accentOnly = parsedAccentOnly;
1045
- if (appearance !== void 0) config.appearance = appearance;
1046
- if (radius !== void 0) config.radius = radius;
1047
- return config;
1048
- }
1049
- function stringifyNajmThemeConfig(config, space = 2) {
1050
- return JSON.stringify(config, null, space);
1051
- }
1052
-
1053
- // src/theme/design-config.ts
1054
- var ROOT_KEYS2 = /* @__PURE__ */ new Set(["version", "theme", "typography", "components", "layout"]);
1055
- var TYPOGRAPHY_KEYS = /* @__PURE__ */ new Set([
1056
- "fontSans",
1057
- "fontHeading",
1058
- "fontMono",
1059
- "baseSize",
1060
- "scale",
1061
- "lineHeight",
1062
- "letterSpacing"
1063
- ]);
1064
- var LAYOUT_KEYS = /* @__PURE__ */ new Set(["pageGutter", "sectionGap"]);
1065
- var COMPONENT_KEYS = /* @__PURE__ */ new Set([
1066
- "card",
1067
- "showSectionLabels",
1068
- "showSectionSeparators",
1069
- "expandedWidth",
1070
- "collapsedWidth",
1071
- "mobileWidth",
1072
- "defaultVariant",
1073
- "defaultSize",
1074
- "density",
1075
- "headerColor",
1076
- "headerTextColor",
1077
- "borderColor",
1078
- "radius",
1079
- "borderWidth",
1080
- "slots",
1081
- "variants"
1082
- ]);
1083
- var SLOT_KEYS = /* @__PURE__ */ new Set(["className", "radius", "borderWidth", "padding", "paddingTop"]);
1084
- var VARIANT_KEYS = /* @__PURE__ */ new Set(["use", "className", "tokens"]);
1085
- var COMPONENT_NAME_SET = new Set(NAJM_COMPONENT_NAMES);
1086
- var DENSITIES = /* @__PURE__ */ new Set(["compact", "default", "comfortable"]);
1087
- var SCALES = /* @__PURE__ */ new Set(["compact", "default", "comfortable"]);
1088
- var RESPONSIVE_BREAKPOINTS = /* @__PURE__ */ new Set(["base", "sm", "md", "lg", "xl", "2xl"]);
1089
- function isRecord2(value) {
1090
- return typeof value === "object" && value !== null && !Array.isArray(value);
1091
- }
1092
- function assertKnownKeys2(value, keys, path) {
1093
- const unknown = Object.keys(value).find((key) => !keys.has(key));
1094
- if (unknown) throw new TypeError(`Unknown ${path} property: ${unknown}`);
1095
- }
1096
- function optionalString2(value, path) {
1097
- if (value === void 0) return void 0;
1098
- if (typeof value !== "string") {
1099
- throw new TypeError(`${path} must be a string`);
1100
- }
1101
- return value;
1102
- }
1103
- function optionalBoolean(value, path) {
1104
- if (value === void 0) return void 0;
1105
- if (typeof value !== "boolean") {
1106
- throw new TypeError(`${path} must be a boolean`);
1107
- }
1108
- return value;
1109
- }
1110
- function optionalResponsiveNumber(value, path) {
1111
- if (value === void 0) return void 0;
1112
- if (typeof value === "number") return value;
1113
- if (!isRecord2(value)) throw new TypeError(`${path} must be a number or breakpoint object`);
1114
- const unknown = Object.keys(value).find((key) => !RESPONSIVE_BREAKPOINTS.has(key));
1115
- if (unknown) throw new TypeError(`Unknown ${path} breakpoint: ${unknown}`);
1116
- const parsed = {};
1117
- for (const [breakpoint, width] of Object.entries(value)) {
1118
- if (typeof width !== "number") {
1119
- throw new TypeError(`${path}.${breakpoint} must be a number`);
1120
- }
1121
- parsed[breakpoint] = width;
1122
- }
1123
- return parsed;
1124
- }
1125
- function optionalEnum2(value, values, path) {
1126
- if (value === void 0) return void 0;
1127
- if (typeof value !== "string" || !values.has(value)) {
1128
- throw new TypeError(`${path} must be one of: ${[...values].join(", ")}`);
1129
- }
1130
- return value;
1131
- }
1132
- function parseTypography(value) {
1133
- if (value === void 0) return void 0;
1134
- if (!isRecord2(value)) throw new TypeError("typography must be an object");
1135
- assertKnownKeys2(value, TYPOGRAPHY_KEYS, "typography");
1136
- const cfg = {};
1137
- const fontSans = optionalString2(value.fontSans, "typography.fontSans");
1138
- const fontHeading = optionalString2(value.fontHeading, "typography.fontHeading");
1139
- const fontMono = optionalString2(value.fontMono, "typography.fontMono");
1140
- const baseSize = optionalString2(value.baseSize, "typography.baseSize");
1141
- const scale = optionalEnum2(value.scale, SCALES, "typography.scale");
1142
- const lineHeight = optionalString2(value.lineHeight, "typography.lineHeight");
1143
- const letterSpacing = optionalString2(value.letterSpacing, "typography.letterSpacing");
1144
- if (fontSans !== void 0) cfg.fontSans = fontSans;
1145
- if (fontHeading !== void 0) cfg.fontHeading = fontHeading;
1146
- if (fontMono !== void 0) cfg.fontMono = fontMono;
1147
- if (baseSize !== void 0) cfg.baseSize = baseSize;
1148
- if (scale !== void 0) cfg.scale = scale;
1149
- if (lineHeight !== void 0) cfg.lineHeight = lineHeight;
1150
- if (letterSpacing !== void 0) cfg.letterSpacing = letterSpacing;
1151
- return cfg;
1152
- }
1153
- function parseLayout(value) {
1154
- if (value === void 0) return void 0;
1155
- if (!isRecord2(value)) throw new TypeError("layout must be an object");
1156
- assertKnownKeys2(value, LAYOUT_KEYS, "layout");
1157
- const cfg = {};
1158
- const pageGutter = optionalString2(value.pageGutter, "layout.pageGutter");
1159
- const sectionGap = optionalString2(value.sectionGap, "layout.sectionGap");
1160
- if (pageGutter !== void 0) cfg.pageGutter = pageGutter;
1161
- if (sectionGap !== void 0) cfg.sectionGap = sectionGap;
1162
- return cfg;
1163
- }
1164
- function parseVariant(value, path) {
1165
- if (!isRecord2(value)) throw new TypeError(`${path} must be an object`);
1166
- assertKnownKeys2(value, VARIANT_KEYS, path);
1167
- const variant = {};
1168
- const use = optionalString2(value.use, `${path}.use`);
1169
- const className = optionalString2(value.className, `${path}.className`);
1170
- if (use !== void 0) variant.use = use;
1171
- if (className !== void 0) variant.className = className;
1172
- if (value.tokens !== void 0) {
1173
- if (!isRecord2(value.tokens)) throw new TypeError(`${path}.tokens must be an object`);
1174
- variant.tokens = value.tokens;
1175
- }
1176
- return variant;
1177
- }
1178
- function parseComponentStyle(value, path) {
1179
- if (!isRecord2(value)) throw new TypeError(`${path} must be an object`);
1180
- assertKnownKeys2(value, COMPONENT_KEYS, path);
1181
- const cfg = {};
1182
- const card = optionalBoolean(value.card, `${path}.card`);
1183
- const showSectionLabels = optionalBoolean(value.showSectionLabels, `${path}.showSectionLabels`);
1184
- const showSectionSeparators = optionalBoolean(value.showSectionSeparators, `${path}.showSectionSeparators`);
1185
- const expandedWidth = optionalResponsiveNumber(value.expandedWidth, `${path}.expandedWidth`);
1186
- const collapsedWidth = optionalResponsiveNumber(value.collapsedWidth, `${path}.collapsedWidth`);
1187
- const mobileWidth = optionalResponsiveNumber(value.mobileWidth, `${path}.mobileWidth`);
1188
- const defaultVariant = optionalString2(value.defaultVariant, `${path}.defaultVariant`);
1189
- const defaultSize = optionalString2(value.defaultSize, `${path}.defaultSize`);
1190
- const density = optionalEnum2(value.density, DENSITIES, `${path}.density`);
1191
- const headerColor = optionalString2(value.headerColor, `${path}.headerColor`);
1192
- const headerTextColor = optionalString2(value.headerTextColor, `${path}.headerTextColor`);
1193
- const borderColor = optionalString2(value.borderColor, `${path}.borderColor`);
1194
- const radius = optionalString2(value.radius, `${path}.radius`);
1195
- const borderWidth = optionalString2(value.borderWidth, `${path}.borderWidth`);
1196
- if (card !== void 0) cfg.card = card;
1197
- if (showSectionLabels !== void 0) cfg.showSectionLabels = showSectionLabels;
1198
- if (showSectionSeparators !== void 0) cfg.showSectionSeparators = showSectionSeparators;
1199
- if (expandedWidth !== void 0) cfg.expandedWidth = expandedWidth;
1200
- if (collapsedWidth !== void 0) cfg.collapsedWidth = collapsedWidth;
1201
- if (mobileWidth !== void 0) cfg.mobileWidth = mobileWidth;
1202
- if (defaultVariant !== void 0) cfg.defaultVariant = defaultVariant;
1203
- if (defaultSize !== void 0) cfg.defaultSize = defaultSize;
1204
- if (density !== void 0) cfg.density = density;
1205
- if (headerColor !== void 0) cfg.headerColor = headerColor;
1206
- if (headerTextColor !== void 0) cfg.headerTextColor = headerTextColor;
1207
- if (borderColor !== void 0) cfg.borderColor = borderColor;
1208
- if (radius !== void 0) cfg.radius = radius;
1209
- if (borderWidth !== void 0) cfg.borderWidth = borderWidth;
1210
- if (value.slots !== void 0) {
1211
- if (!isRecord2(value.slots)) throw new TypeError(`${path}.slots must be an object`);
1212
- const slots = {};
1213
- for (const [slotName, slotValue] of Object.entries(value.slots)) {
1214
- if (!isRecord2(slotValue)) throw new TypeError(`${path}.slots.${slotName} must be an object`);
1215
- assertKnownKeys2(slotValue, SLOT_KEYS, `${path}.slots.${slotName}`);
1216
- slots[slotName] = slotValue;
1217
- }
1218
- cfg.slots = slots;
1219
- }
1220
- if (value.variants !== void 0) {
1221
- if (!isRecord2(value.variants)) throw new TypeError(`${path}.variants must be an object`);
1222
- const variants = {};
1223
- for (const [variantName, variantValue] of Object.entries(value.variants)) {
1224
- variants[variantName] = parseVariant(variantValue, `${path}.variants.${variantName}`);
1225
- }
1226
- cfg.variants = variants;
1227
- }
1228
- return cfg;
1229
- }
1230
- function parseComponents(value) {
1231
- if (value === void 0) return void 0;
1232
- if (!isRecord2(value)) throw new TypeError("components must be an object");
1233
- const unknown = Object.keys(value).find((key) => !COMPONENT_NAME_SET.has(key));
1234
- if (unknown) throw new TypeError(`Unknown component name: ${unknown}`);
1235
- const components = {};
1236
- for (const [name, cfg] of Object.entries(value)) {
1237
- components[name] = parseComponentStyle(cfg, `components.${name}`);
1238
- }
1239
- return components;
1240
- }
1241
- function defineNajmDesignConfig(config) {
1242
- return config;
1243
- }
1244
- function parseNajmDesignConfig(input) {
1245
- let value = input;
1246
- if (typeof input === "string") {
1247
- try {
1248
- value = JSON.parse(input);
1249
- } catch (error) {
1250
- throw new TypeError(`Invalid design JSON: ${error.message}`);
1251
- }
1252
- }
1253
- if (!isRecord2(value)) throw new TypeError("Design config must be an object");
1254
- if (!("version" in value) && !("theme" in value)) {
1255
- return {
1256
- version: 1,
1257
- theme: parseNajmThemeConfig(value)
1258
- };
1259
- }
1260
- assertKnownKeys2(value, ROOT_KEYS2, "design");
1261
- if (value.version !== void 0 && value.version !== 1) {
1262
- throw new TypeError("design.version must be 1");
1263
- }
1264
- if (value.theme === void 0) throw new TypeError("design.theme is required");
1265
- const config = {
1266
- version: 1,
1267
- theme: parseNajmThemeConfig(value.theme)
1268
- };
1269
- const typography = parseTypography(value.typography);
1270
- if (typography !== void 0) config.typography = typography;
1271
- const components = parseComponents(value.components);
1272
- if (components !== void 0) config.components = components;
1273
- const layout = parseLayout(value.layout);
1274
- if (layout !== void 0) config.layout = layout;
1275
- return config;
1276
- }
1277
- function stringifyNajmDesignConfig(config, space = 2) {
1278
- return JSON.stringify(config, null, space);
1279
- }
1280
- function resolveVariantAlias(variants, variant) {
1281
- if (!variants) return { variant };
1282
- const seen = /* @__PURE__ */ new Set();
1283
- let current = variant;
1284
- let style = variants[current];
1285
- while (style?.use && !seen.has(current)) {
1286
- seen.add(current);
1287
- const next = style.use;
1288
- if (seen.has(next)) break;
1289
- current = next;
1290
- style = variants[current];
1291
- }
1292
- return { variant: current, style };
1293
- }
1294
- var buttonVariants = cva(
1295
- [
1296
- "relative inline-flex shrink-0 cursor-pointer items-center justify-center gap-2 whitespace-nowrap text-sm font-medium outline-none transition-all",
1297
- "disabled:pointer-events-none disabled:opacity-50 data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
1298
- "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
1299
- "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
1300
- "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
1301
- ].join(" "),
1302
- {
1303
- variants: {
1304
- variant: {
1305
- default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
1306
- destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
1307
- outline: "border border-input bg-transparent text-foreground shadow-xs hover:bg-accent hover:text-accent-foreground",
1308
- secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
1309
- tertiary: "bg-tertiary text-tertiary-foreground shadow-xs hover:bg-tertiary/80",
1310
- ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
1311
- link: "h-auto p-0 text-primary underline-offset-4 hover:underline",
1312
- success: "bg-emerald-600 text-white shadow-xs hover:bg-emerald-700",
1313
- warning: "bg-amber-400 text-slate-950 shadow-xs hover:bg-amber-500",
1314
- info: "bg-sky-600 text-white shadow-xs hover:bg-sky-700",
1315
- soft: "bg-primary/10 text-primary shadow-none hover:bg-primary/15",
1316
- subtle: "bg-muted text-foreground shadow-none hover:bg-muted/80",
1317
- plain: "bg-transparent shadow-none hover:bg-transparent"
1318
- },
1319
- size: {
1320
- "2xs": "h-5 gap-1 px-1.5 text-[11px] [&_svg:not([class*='size-'])]:size-3",
1321
- xs: "h-6 gap-1 px-2 text-xs [&_svg:not([class*='size-'])]:size-3",
1322
- sm: "h-8 gap-1.5 px-3 has-[>svg]:px-2.5",
1323
- default: "h-9 px-4 py-2 has-[>svg]:px-3",
1324
- md: "h-9 px-4 py-2 has-[>svg]:px-3",
1325
- lg: "h-10 px-6 has-[>svg]:px-4",
1326
- xl: "h-12 px-8 text-base [&_svg:not([class*='size-'])]:size-5",
1327
- "2xl": "h-14 px-10 text-base [&_svg:not([class*='size-'])]:size-5",
1328
- icon: "size-9",
1329
- "icon-xs": "size-6 [&_svg:not([class*='size-'])]:size-3",
1330
- "icon-sm": "size-8",
1331
- "icon-lg": "size-10 [&_svg:not([class*='size-'])]:size-5",
1332
- "icon-xl": "size-12 [&_svg:not([class*='size-'])]:size-5"
1333
- },
1334
- rounded: {
1335
- none: "rounded-none",
1336
- sm: "rounded-sm",
1337
- default: "rounded-md",
1338
- md: "rounded-md",
1339
- lg: "rounded-lg",
1340
- xl: "rounded-xl",
1341
- "2xl": "rounded-2xl",
1342
- full: "rounded-full"
1343
- },
1344
- fullWidth: {
1345
- true: "w-full",
1346
- false: ""
1347
- }
1348
- },
1349
- defaultVariants: {
1350
- variant: "default",
1351
- size: "default",
1352
- rounded: "default",
1353
- fullWidth: false
1354
- }
1355
- }
1356
- );
1357
- function isPromiseLike(value) {
1358
- return Boolean(value && typeof value.then === "function");
1359
- }
1360
- var defaultLoader = /* @__PURE__ */ jsx(LoaderCircleIcon, { "aria-hidden": "true", className: "animate-spin" });
1361
- function renderIcon(icon) {
1362
- if (!icon) return null;
1363
- return /* @__PURE__ */ jsx(NIcon, { "aria-hidden": "true", icon, className: "shrink-0" });
1364
- }
1365
- var Button = React.forwardRef(
1366
- ({
1367
- className,
1368
- variant,
1369
- size,
1370
- rounded,
1371
- fullWidth,
1372
- asChild = false,
1373
- loading = false,
1374
- autoLoading = true,
1375
- disabledWhileLoading = true,
1376
- loadingText,
1377
- loader = defaultLoader,
1378
- loaderPosition = "left",
1379
- leftIcon,
1380
- rightIcon,
1381
- bordered,
1382
- disabled,
1383
- children,
1384
- onClick,
1385
- style,
1386
- ...props
1387
- }, ref) => {
1388
- const recipe = useNajmComponentStyle("button");
1389
- const aliased = resolveVariantAlias(
1390
- recipe?.variants,
1391
- variant ?? recipe?.defaultVariant ?? "default"
1392
- );
1393
- const effVariant = variant ?? aliased.variant ?? recipe?.defaultVariant;
1394
- const effSize = size ?? recipe?.defaultSize;
1395
- const recipeRadius = rounded === void 0 ? resolveRadiusValue(recipe?.radius) : void 0;
1396
- const recipeStyle = recipeRadius ? { borderRadius: recipeRadius } : void 0;
1397
- const [pending, setPending] = React.useState(false);
1398
- const isLoading = loading || pending;
1399
- const isDisabled = disabled || disabledWhileLoading && isLoading;
1400
- const Comp = asChild ? Slot : "button";
1401
- const handleClick = React.useCallback(
1402
- (event) => {
1403
- if (isDisabled) {
1404
- event.preventDefault();
1405
- return;
1406
- }
1407
- const result = onClick?.(event);
1408
- if (autoLoading && isPromiseLike(result)) {
1409
- setPending(true);
1410
- void result.then(
1411
- () => setPending(false),
1412
- () => setPending(false)
1413
- );
1414
- }
1415
- },
1416
- [autoLoading, isDisabled, onClick]
1417
- );
1418
- const child = asChild ? React.Children.only(children) : null;
1419
- const childContent = asChild && React.isValidElement(child) ? child.props.children : children;
1420
- const content = loadingText && isLoading ? loadingText : childContent;
1421
- const loaderNode = isLoading ? loader : null;
1422
- const leftIconNode = renderIcon(leftIcon);
1423
- const rightIconNode = renderIcon(rightIcon);
1424
- const showCenteredLoader = Boolean(loaderNode && loaderPosition === "center");
1425
- const renderedContent = showCenteredLoader ? /* @__PURE__ */ jsxs(Fragment, { children: [
1426
- /* @__PURE__ */ jsxs("span", { className: "invisible inline-flex items-center gap-2", children: [
1427
- leftIconNode,
1428
- content,
1429
- rightIconNode
1430
- ] }),
1431
- /* @__PURE__ */ jsx("span", { className: "absolute inset-0 inline-flex items-center justify-center", children: loaderNode })
1432
- ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
1433
- loaderNode && loaderPosition === "left" ? loaderNode : leftIconNode,
1434
- content,
1435
- loaderNode && loaderPosition === "right" ? loaderNode : rightIconNode
1436
- ] });
1437
- const renderedChild = asChild && React.isValidElement(child) ? React.cloneElement(child, void 0, renderedContent) : renderedContent;
1438
- return /* @__PURE__ */ jsx(
1439
- Comp,
1440
- {
1441
- ref,
1442
- "data-slot": "button",
1443
- "data-loading": isLoading || void 0,
1444
- "data-disabled": isDisabled || void 0,
1445
- "data-bordered": effVariant === "outline" ? "true" : bordered === false ? "false" : bordered ? "true" : void 0,
1446
- "aria-busy": isLoading || void 0,
1447
- "aria-disabled": asChild && isDisabled ? true : void 0,
1448
- disabled: !asChild ? isDisabled : void 0,
1449
- style: recipeStyle ? { ...recipeStyle, ...style } : style,
1450
- className: cn(
1451
- buttonVariants({ variant: effVariant, size: effSize, rounded, fullWidth }),
1452
- aliased.style?.className,
1453
- // Outline buttons always carry an input-style border.
1454
- effVariant === "outline" && inputBorderClasses(true),
1455
- // Filled/ghost/plain/link/success/warning/info/soft/subtle buttons only get a
1456
- // border when the consumer explicitly opts in via `bordered`. Global theming
1457
- // should not outline every filled button.
1458
- effVariant !== "outline" && bordered === true && cn(
1459
- "border",
1460
- "border-muted-foreground"
1461
- ),
1462
- className
1463
- ),
1464
- onClick: handleClick,
1465
- ...props,
1466
- children: renderedChild
1467
- }
1468
- );
1469
- }
1470
- );
1471
- Button.displayName = "Button";
1472
- var NButton = Button;
1473
403
  var NO_SHADE = /* @__PURE__ */ new Set(["black", "white"]);
1474
- var PRESETS2 = {
404
+ var PRESETS = {
1475
405
  muted: "border-muted-foreground",
1476
406
  primary: "border-primary",
1477
407
  accent: "border-accent",
@@ -1502,7 +432,7 @@ var ERROR_BORDER = "border !border-red-600";
1502
432
  var FOCUS_INTERACTIVE_BASE = "border focus-within:border-primary";
1503
433
  var HOVER_INTERACTIVE_BASE = "hover:border-primary";
1504
434
  var STATIC_BASE = "border";
1505
- var BaseInput = React__default.forwardRef(
435
+ var BaseInput = React60__default.forwardRef(
1506
436
  ({ children, variant = "default", status = "default", bordered, borderColor, className, style, disabled = false, onHover, onClick, hasIcon, ...rest }, ref) => {
1507
437
  const recipe = useNajmComponentStyle("input");
1508
438
  const isGhost = variant === "ghost";
@@ -1517,7 +447,7 @@ var BaseInput = React__default.forwardRef(
1517
447
  borderClass = ERROR_BORDER;
1518
448
  } else if (hasExplicitColor) {
1519
449
  borderClass = `${STATIC_BASE} ${FOCUS_INTERACTIVE_BASE} ${HOVER_INTERACTIVE_BASE}`;
1520
- colorClass = PRESETS2[borderColor] ?? (NO_SHADE.has(borderColor) ? `border-${borderColor}` : `border-${borderColor}-600`);
450
+ colorClass = PRESETS[borderColor] ?? (NO_SHADE.has(borderColor) ? `border-${borderColor}` : `border-${borderColor}-600`);
1521
451
  } else {
1522
452
  const restingBorderClass = inputBorderClasses(isBordered);
1523
453
  borderClass = isBordered ? `${STATIC_BASE} ${restingBorderClass} [&:not(:focus-within):not([data-state=open]):hover]:border-input focus-within:border-ring data-[state=open]:border-ring` : restingBorderClass;
@@ -1554,7 +484,7 @@ function PopoverAnchor({ ...props }) {
1554
484
  return /* @__PURE__ */ jsx(PopoverPrimitive.Anchor, { "data-slot": "popover-anchor", ...props });
1555
485
  }
1556
486
  function PopoverContent({ className, align = "center", sideOffset = 4, ...props }) {
1557
- const container = React.useContext(NajmThemeContainerCtx);
487
+ const container = React60.useContext(NajmThemeContainerCtx);
1558
488
  useNajmPortalLayerStyles();
1559
489
  return /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { container: container ?? void 0, children: /* @__PURE__ */ jsx(
1560
490
  PopoverPrimitive.Content,
@@ -1663,7 +593,7 @@ function SwatchesColorPicker({
1663
593
  hideSwatches = false
1664
594
  }) {
1665
595
  const inputRef = useRef(null);
1666
- const themeContainer = React__default.useContext(NajmThemeContainerCtx);
596
+ const themeContainer = React60__default.useContext(NajmThemeContainerCtx);
1667
597
  const resolvedValue = resolvePickerColor(value, themeContainer);
1668
598
  return /* @__PURE__ */ jsxs(
1669
599
  BaseInput,
@@ -1733,7 +663,7 @@ function PopoverColorPicker({
1733
663
  formats = DEFAULT_FORMATS,
1734
664
  output = "preserve"
1735
665
  }) {
1736
- const themeContainer = React__default.useContext(NajmThemeContainerCtx);
666
+ const themeContainer = React60__default.useContext(NajmThemeContainerCtx);
1737
667
  const resolvedValue = resolvePickerColor(value, themeContainer);
1738
668
  const initialFormat = formats.includes(detectFormat(resolvedValue)) ? detectFormat(resolvedValue) : formats[0] ?? "hex";
1739
669
  const [activeFormat, setActiveFormat] = useState(initialFormat);
@@ -1990,7 +920,7 @@ function SheetClose({ ...props }) {
1990
920
  return /* @__PURE__ */ jsx(SheetPrimitive.Close, { "data-slot": "sheet-close", ...props });
1991
921
  }
1992
922
  function SheetPortal({ ...props }) {
1993
- const container = React.useContext(NajmThemeContainerCtx);
923
+ const container = React60.useContext(NajmThemeContainerCtx);
1994
924
  return /* @__PURE__ */ jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", container: container ?? void 0, ...props });
1995
925
  }
1996
926
  function SheetOverlay({ className, ...props }) {
@@ -2052,89 +982,6 @@ function SheetTitle({ className, ...props }) {
2052
982
  function SheetDescription({ className, ...props }) {
2053
983
  return /* @__PURE__ */ jsx(SheetPrimitive.Description, { "data-slot": "sheet-description", className: cn("text-muted-foreground text-sm", className), ...props });
2054
984
  }
2055
- function assignRef(ref, node) {
2056
- if (!ref) return;
2057
- if (typeof ref === "function") ref(node);
2058
- else ref.current = node;
2059
- }
2060
- function applyViewportLayout(node, axis) {
2061
- node.style.width = "100%";
2062
- node.style.height = "100%";
2063
- node.style.minWidth = "0";
2064
- node.style.minHeight = "0";
2065
- node.style.overflowX = axis === "x" || axis === "both" ? "auto" : "hidden";
2066
- node.style.overflowY = axis === "y" || axis === "both" ? "auto" : "hidden";
2067
- }
2068
- function najmScrollOptions(axis, autoHide, options) {
2069
- return {
2070
- scrollbars: { theme: "os-theme-najm", autoHide, autoHideDelay: 500, clickScroll: true },
2071
- overflow: {
2072
- x: axis === "x" || axis === "both" ? "scroll" : "hidden",
2073
- y: axis === "y" || axis === "both" ? "scroll" : "hidden"
2074
- },
2075
- ...options
2076
- };
2077
- }
2078
- function useNajmScrollViewport({
2079
- axis = "y",
2080
- autoHide = "never",
2081
- options
2082
- } = {}) {
2083
- const hostRef = React.useRef(null);
2084
- const viewportRef = React.useRef(null);
2085
- React.useEffect(() => {
2086
- const target = hostRef.current;
2087
- const viewport = viewportRef.current;
2088
- if (!target || !viewport) return;
2089
- const instance = OverlayScrollbars(
2090
- { target, elements: { viewport } },
2091
- najmScrollOptions(axis, autoHide, options)
2092
- );
2093
- const containWheel = (event) => event.stopPropagation();
2094
- viewport.addEventListener("wheel", containWheel, { passive: true });
2095
- return () => {
2096
- viewport.removeEventListener("wheel", containWheel);
2097
- instance.destroy();
2098
- };
2099
- }, [axis, autoHide, options]);
2100
- return { hostRef, viewportRef };
2101
- }
2102
- function NajmScroll({ className, axis = "y", autoHide = "never", viewportRef, events, options, element, children, style, ...props }) {
2103
- return /* @__PURE__ */ jsx(
2104
- OverlayScrollbarsComponent,
2105
- {
2106
- className: cn(className),
2107
- style: {
2108
- ...style,
2109
- overflow: "hidden",
2110
- minHeight: 0,
2111
- minWidth: 0
2112
- },
2113
- element,
2114
- defer: true,
2115
- options: najmScrollOptions(axis, autoHide, options || void 0),
2116
- events: {
2117
- ...events,
2118
- initialized: (instance, ...rest) => {
2119
- const viewport = instance.elements().viewport;
2120
- applyViewportLayout(viewport, axis);
2121
- assignRef(viewportRef, viewport);
2122
- events?.initialized?.(instance, ...rest);
2123
- },
2124
- updated: (instance, ...rest) => {
2125
- applyViewportLayout(instance.elements().viewport, axis);
2126
- events?.updated?.(instance, ...rest);
2127
- },
2128
- destroyed: (instance, ...rest) => {
2129
- assignRef(viewportRef, null);
2130
- events?.destroyed?.(instance, ...rest);
2131
- }
2132
- },
2133
- ...props,
2134
- children
2135
- }
2136
- );
2137
- }
2138
985
  var PortalScopeContext = createContext(void 0);
2139
986
  function NPortalScopeProvider({ className, children }) {
2140
987
  return /* @__PURE__ */ jsx(PortalScopeContext.Provider, { value: className, children });
@@ -2222,7 +1069,7 @@ function DialogTrigger({ ...props }) {
2222
1069
  return /* @__PURE__ */ jsx(SheetPrimitive.Trigger, { "data-slot": "dialog-trigger", ...props });
2223
1070
  }
2224
1071
  function DialogPortal({ ...props }) {
2225
- const container = React.useContext(NajmThemeContainerCtx);
1072
+ const container = React60.useContext(NajmThemeContainerCtx);
2226
1073
  return /* @__PURE__ */ jsx(SheetPrimitive.Portal, { "data-slot": "dialog-portal", container: container ?? void 0, ...props });
2227
1074
  }
2228
1075
  function DialogClose({ ...props }) {
@@ -2253,8 +1100,8 @@ function getDefaultPadding() {
2253
1100
  return window.matchMedia(MOBILE_PADDING_QUERY).matches ? "sm" : "md";
2254
1101
  }
2255
1102
  function useResponsivePadding(value) {
2256
- const [resolved, setResolved] = React.useState(() => value ?? getDefaultPadding());
2257
- React.useEffect(() => {
1103
+ const [resolved, setResolved] = React60.useState(() => value ?? getDefaultPadding());
1104
+ React60.useEffect(() => {
2258
1105
  if (value) {
2259
1106
  setResolved(value);
2260
1107
  return;
@@ -2318,7 +1165,7 @@ var sizeClasses2 = {
2318
1165
  md: "h-8 w-8",
2319
1166
  lg: "h-10 w-10"
2320
1167
  };
2321
- var IconButton = React.forwardRef(
1168
+ var IconButton = React60.forwardRef(
2322
1169
  ({
2323
1170
  className,
2324
1171
  variant = "ghost",
@@ -2400,10 +1247,10 @@ function NPageHeaderTop({ children, className }) {
2400
1247
  }
2401
1248
  NPageHeaderTop.displayName = "NPageHeaderTop";
2402
1249
  function isPageHeaderSlot(child, slot) {
2403
- return React__default.isValidElement(child) && child.type === slot;
1250
+ return React60__default.isValidElement(child) && child.type === slot;
2404
1251
  }
2405
1252
  function getSlotElements(children, slot) {
2406
- const matches = React__default.Children.toArray(children).filter((child) => isPageHeaderSlot(child, slot));
1253
+ const matches = React60__default.Children.toArray(children).filter((child) => isPageHeaderSlot(child, slot));
2407
1254
  return matches.length > 0 ? matches : void 0;
2408
1255
  }
2409
1256
  var responsiveClasses = {
@@ -2666,11 +1513,11 @@ function createDialogStore() {
2666
1513
  dialog.resolve?.(result);
2667
1514
  set((state) => ({ dialogs: state.dialogs.slice(0, -1) }));
2668
1515
  };
2669
- const handler2 = dialog.primaryButton?.onClick ?? dialog.primaryButton?.onConfirm;
2670
- if (handler2 && result != null) {
1516
+ const handler = dialog.primaryButton?.onClick ?? dialog.primaryButton?.onConfirm;
1517
+ if (handler && result != null) {
2671
1518
  get().setPrimaryLoading(true);
2672
1519
  try {
2673
- await handler2(result);
1520
+ await handler(result);
2674
1521
  closeCurrentDialog();
2675
1522
  } finally {
2676
1523
  get().setPrimaryLoading(false);
@@ -2757,11 +1604,11 @@ function createDialogStore() {
2757
1604
  const { dialogs, setPrimaryLoading, closeDialog } = get();
2758
1605
  const dialog = dialogs.find((d) => d.id === dialogId);
2759
1606
  if (!dialog?.primaryButton) return;
2760
- const handler2 = dialog.primaryButton.onClick ?? dialog.primaryButton.onConfirm;
2761
- if (handler2) {
1607
+ const handler = dialog.primaryButton.onClick ?? dialog.primaryButton.onConfirm;
1608
+ if (handler) {
2762
1609
  setPrimaryLoading(true);
2763
1610
  try {
2764
- await handler2(data);
1611
+ await handler(data);
2765
1612
  closeDialog(dialogId, data);
2766
1613
  } finally {
2767
1614
  setPrimaryLoading(false);
@@ -2777,9 +1624,9 @@ function createDialogStore() {
2777
1624
  closeDialog(dialogId, null);
2778
1625
  return;
2779
1626
  }
2780
- const handler2 = dialog.secondaryButton.onClick ?? dialog.secondaryButton.onConfirm;
2781
- if (handler2) {
2782
- await handler2(data);
1627
+ const handler = dialog.secondaryButton.onClick ?? dialog.secondaryButton.onConfirm;
1628
+ if (handler) {
1629
+ await handler(data);
2783
1630
  }
2784
1631
  closeDialog(dialogId, null);
2785
1632
  },
@@ -2816,8 +1663,8 @@ function NDialogSecondaryButton(_props) {
2816
1663
  function parseDirectDialogSlots(children) {
2817
1664
  const body = [];
2818
1665
  const parsed = {};
2819
- React__default.Children.forEach(children, (child) => {
2820
- if (!React__default.isValidElement(child)) {
1666
+ React60__default.Children.forEach(children, (child) => {
1667
+ if (!React60__default.isValidElement(child)) {
2821
1668
  body.push(child);
2822
1669
  return;
2823
1670
  }
@@ -2890,15 +1737,15 @@ var dialogVariants = cva(
2890
1737
  );
2891
1738
  var CONTENT_ACTIONS_SELECTOR = '[data-najm-dialog-actions="content"], [data-najm-wizard-form="true"]';
2892
1739
  function useContentOwnsActions() {
2893
- const [contentElement, setContentElement] = React__default.useState(null);
2894
- const [contentOwnsActions, setContentOwnsActions] = React__default.useState(false);
2895
- const contentElementRef = React__default.useRef(null);
2896
- const handleContentElementRef = React__default.useCallback((node) => {
1740
+ const [contentElement, setContentElement] = React60__default.useState(null);
1741
+ const [contentOwnsActions, setContentOwnsActions] = React60__default.useState(false);
1742
+ const contentElementRef = React60__default.useRef(null);
1743
+ const handleContentElementRef = React60__default.useCallback((node) => {
2897
1744
  if (contentElementRef.current === node) return;
2898
1745
  contentElementRef.current = node;
2899
1746
  setContentElement(node);
2900
1747
  }, []);
2901
- React__default.useLayoutEffect(() => {
1748
+ React60__default.useLayoutEffect(() => {
2902
1749
  if (!contentElement) {
2903
1750
  setContentOwnsActions((current) => current ? false : current);
2904
1751
  return;
@@ -3151,8 +1998,8 @@ function NDirectDialog({
3151
1998
  const resolvedHeaderClassName = cn(slots.header?.className, headerClassName);
3152
1999
  const resolvedTitleClassName = cn(slots.header?.titleClassName, titleClassName);
3153
2000
  const resolvedDescriptionClassName = cn(slots.description?.className, descriptionClassName);
3154
- const [internalOpen, setInternalOpen] = React__default.useState(defaultOpen);
3155
- const [primaryLoading, setPrimaryLoading] = React__default.useState(false);
2001
+ const [internalOpen, setInternalOpen] = React60__default.useState(defaultOpen);
2002
+ const [primaryLoading, setPrimaryLoading] = React60__default.useState(false);
3156
2003
  const isControlled = open !== void 0;
3157
2004
  const currentOpen = isControlled ? open : internalOpen;
3158
2005
  const setOpen = (nextOpen) => {
@@ -3434,7 +2281,7 @@ function useDialog(store) {
3434
2281
  description: options.description,
3435
2282
  size: options.size || "sm",
3436
2283
  className: options.className,
3437
- render: ({ dialog, zIndex, confirm, cancel, onOpenChange }) => React__default.createElement(NDeleteDialog, {
2284
+ render: ({ dialog, zIndex, confirm, cancel, onOpenChange }) => React60__default.createElement(NDeleteDialog, {
3438
2285
  itemName: options.itemName,
3439
2286
  itemType: options.itemType,
3440
2287
  icon: options.icon,
@@ -3639,7 +2486,7 @@ var SIZE_TEXT_MAP = {
3639
2486
  md: "text-sm",
3640
2487
  lg: "text-base"
3641
2488
  };
3642
- function renderIcon2(icon) {
2489
+ function renderIcon(icon) {
3643
2490
  if (!icon) return null;
3644
2491
  return /* @__PURE__ */ jsx(NIcon, { "aria-hidden": "true", icon, className: "shrink-0" });
3645
2492
  }
@@ -3675,7 +2522,7 @@ function Badge({
3675
2522
  const resolvedLabel = label ?? (typeof children === "string" ? children : void 0) ?? status;
3676
2523
  const content = typeof children !== "string" && children ? children : resolvedLabel ?? children;
3677
2524
  const resolvedIcon = icon ?? (resolvedColor ? iconMap?.[resolvedColor] : void 0);
3678
- const iconNode = renderIcon2(showIcon ? resolvedIcon : icon);
2525
+ const iconNode = renderIcon(showIcon ? resolvedIcon : icon);
3679
2526
  const isMinimal = look === "minimal" || look === "text";
3680
2527
  if (isMinimal) {
3681
2528
  const textColor = COLOR_TEXT_MAP[resolvedColor ?? ""] ?? "text-foreground";
@@ -3720,8 +2567,8 @@ function resolveIcon(icon) {
3720
2567
  }
3721
2568
  var MultiSelectInput = ({ ariaLabel, placeholder = "Select items...", value = [], onChange, icon, showIcon = true, iconColor, items, className = "", variant = "default", status = "default", bordered, borderColor, disabled = false, searchPlaceholder = "Search...", emptyMessage = "No items found.", maxDisplay = 3, showSearch = true }) => {
3722
2569
  const [open, setOpen] = useState(false);
3723
- const triggerRef = React__default.useRef(null);
3724
- const pointerDismissedRef = React__default.useRef(false);
2570
+ const triggerRef = React60__default.useRef(null);
2571
+ const pointerDismissedRef = React60__default.useRef(false);
3725
2572
  const shouldDisplayIcon = Boolean(icon) && showIcon && value.length === 0;
3726
2573
  const iconProps = getIconColorProps(iconColor, "h-4 w-4");
3727
2574
  const handleSelect = (itemValue) => {
@@ -3837,7 +2684,7 @@ function SelectScrollDownButton({ className, ...props }) {
3837
2684
  return /* @__PURE__ */ jsx(SelectPrimitive.ScrollDownButton, { "data-slot": "select-scroll-down-button", className: cn("flex cursor-default items-center justify-center py-1", className), ...props, children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-4" }) });
3838
2685
  }
3839
2686
  function SelectContent({ className, children, position = "popper", style, ...props }) {
3840
- const container = React.useContext(NajmThemeContainerCtx);
2687
+ const container = React60.useContext(NajmThemeContainerCtx);
3841
2688
  const recipe = useNajmComponentStyle("select");
3842
2689
  const contentSlot = recipe?.slots?.content;
3843
2690
  const borderWidth = contentSlot?.borderWidth ?? recipe?.borderWidth;
@@ -3920,9 +2767,9 @@ var SelectInput = ({ placeholder = "", ariaLabel, value, onChange, icon, showIco
3920
2767
  (item) => typeof item === "string" ? item === value : item.value === value
3921
2768
  );
3922
2769
  const displayLabel = typeof found === "string" ? found : found?.label ?? value;
3923
- const [open, setOpen] = React__default.useState(false);
3924
- const triggerRef = React__default.useRef(null);
3925
- const pointerDismissedRef = React__default.useRef(false);
2770
+ const [open, setOpen] = React60__default.useState(false);
2771
+ const triggerRef = React60__default.useRef(null);
2772
+ const pointerDismissedRef = React60__default.useRef(false);
3926
2773
  return /* @__PURE__ */ jsxs("div", { className: cn("group relative", className), children: [
3927
2774
  /* @__PURE__ */ jsxs(
3928
2775
  BaseInput,
@@ -4790,7 +3637,7 @@ function CollapsibleSection({
4790
3637
  children,
4791
3638
  disabled
4792
3639
  }) {
4793
- const [open, setOpen] = React.useState(true);
3640
+ const [open, setOpen] = React60.useState(true);
4794
3641
  const titleText = typeof title === "string" || typeof title === "number" ? String(title) : "Section";
4795
3642
  return /* @__PURE__ */ jsxs(
4796
3643
  Collapsible,
@@ -5108,7 +3955,7 @@ function TokenGroupSection({
5108
3955
  disabled,
5109
3956
  labels
5110
3957
  }) {
5111
- const [open, setOpen] = React.useState(groupId === "surface" || groupId === "brand");
3958
+ const [open, setOpen] = React60.useState(groupId === "surface" || groupId === "brand");
5112
3959
  const labelText = typeof label === "string" || typeof label === "number" ? String(label) : "Group";
5113
3960
  return /* @__PURE__ */ jsxs(
5114
3961
  Collapsible,
@@ -5440,7 +4287,7 @@ function normalizeCode(value, numeric, length) {
5440
4287
  const normalized = numeric ? value.replace(/\D/g, "") : value.replace(/\s/g, "");
5441
4288
  return normalized.slice(0, length);
5442
4289
  }
5443
- var OtpInput = React__default.forwardRef(
4290
+ var OtpInput = React60__default.forwardRef(
5444
4291
  ({
5445
4292
  value,
5446
4293
  onChange,
@@ -5622,8 +4469,8 @@ var TextAreaInput = ({ value, onChange, placeholder = "", className = "", varian
5622
4469
  };
5623
4470
  var ComboboxInput = ({ placeholder = "Select...", searchPlaceholder = "Search...", emptyMessage = "No results found.", loading = false, loadingMessage = "Loading...", onSearchChange, shouldFilter = true, value, onChange, icon, showIcon = true, iconColor, items = [], className = "", variant = "default", status = "default", bordered, borderColor, disabled = false, allowFreeText = false }) => {
5624
4471
  const [open, setOpen] = useState(false);
5625
- const triggerRef = React__default.useRef(null);
5626
- const pointerDismissedRef = React__default.useRef(false);
4472
+ const triggerRef = React60__default.useRef(null);
4473
+ const pointerDismissedRef = React60__default.useRef(false);
5627
4474
  const [query, setQuery] = useState("");
5628
4475
  const normalizedItems = items.map((item) => typeof item === "string" ? { value: item, label: item } : item);
5629
4476
  const selectedItem = normalizedItems.find((item) => item.value === value);
@@ -7010,7 +5857,7 @@ function DropdownMenuSubContent({ className, children, style, ...props }) {
7010
5857
  );
7011
5858
  }
7012
5859
  function DropdownMenuContent({ className, children, sideOffset = 4, style, ...props }) {
7013
- const container = React.useContext(NajmThemeContainerCtx);
5860
+ const container = React60.useContext(NajmThemeContainerCtx);
7014
5861
  const surface = useDropdownSurfaceRecipe("content");
7015
5862
  const { hostRef, viewportRef } = useNajmScrollViewport();
7016
5863
  useNajmPortalLayerStyles();
@@ -7414,8 +6261,8 @@ function NSlider({
7414
6261
  return Array.isArray(v) ? [...v] : [v];
7415
6262
  };
7416
6263
  const initialRadix = toRadix(controlledValue ?? defaultValue);
7417
- const [internalValues, setInternalValues] = React.useState(initialRadix);
7418
- const [active, setActive] = React.useState(null);
6264
+ const [internalValues, setInternalValues] = React60.useState(initialRadix);
6265
+ const [active, setActive] = React60.useState(null);
7419
6266
  const currentValues = controlledValue !== void 0 ? toRadix(controlledValue) : internalValues;
7420
6267
  const handleRadix = (arr) => {
7421
6268
  setInternalValues(arr);
@@ -7572,13 +6419,13 @@ function NThemePresets({
7572
6419
  disabled = false,
7573
6420
  className
7574
6421
  }) {
7575
- const [saveOpen, setSaveOpen] = React.useState(false);
7576
- const [name, setName] = React.useState("");
7577
- const [pendingDelete, setPendingDelete] = React.useState(
6422
+ const [saveOpen, setSaveOpen] = React60.useState(false);
6423
+ const [name, setName] = React60.useState("");
6424
+ const [pendingDelete, setPendingDelete] = React60.useState(
7578
6425
  null
7579
6426
  );
7580
- const [busy, setBusy] = React.useState(false);
7581
- const rows = React.useMemo(
6427
+ const [busy, setBusy] = React60.useState(false);
6428
+ const rows = React60.useMemo(
7582
6429
  () => [
7583
6430
  ...savedDesign ? [
7584
6431
  {
@@ -7830,12 +6677,12 @@ function NThemeCustomizer({
7830
6677
  }) {
7831
6678
  const inheritedMode = useNajmThemeMode();
7832
6679
  const resolvedPreviewMode = previewMode ?? inheritedMode ?? value.theme.mode ?? "light";
7833
- const visibleTabs = React.useMemo(() => buildTabs(tabs), [tabs]);
6680
+ const visibleTabs = React60.useMemo(() => buildTabs(tabs), [tabs]);
7834
6681
  const firstTab = visibleTabs[0] ?? "theme";
7835
- const [activeTab, setActiveTab] = React.useState(TAB_VALUE[firstTab]);
7836
- const [fileError, setFileError] = React.useState(false);
7837
- const fileInputRef = React.useRef(null);
7838
- React.useEffect(() => {
6682
+ const [activeTab, setActiveTab] = React60.useState(TAB_VALUE[firstTab]);
6683
+ const [fileError, setFileError] = React60.useState(false);
6684
+ const fileInputRef = React60.useRef(null);
6685
+ React60.useEffect(() => {
7839
6686
  setActiveTab(TAB_VALUE[firstTab]);
7840
6687
  }, [firstTab]);
7841
6688
  const themeLabel = resolveLabel("themeTab", labels);
@@ -7847,7 +6694,7 @@ function NThemeCustomizer({
7847
6694
  const invalidThemeFileLabel = resolveLabel("invalidThemeFile", labels);
7848
6695
  const defaultOptionLabel = resolveLabel("defaultOption", labels);
7849
6696
  const colorSwatchFallbackLabel = resolveLabel("colorSwatchFallback", labels);
7850
- const tokenLabels = React.useMemo(() => {
6697
+ const tokenLabels = React60.useMemo(() => {
7851
6698
  const out = {};
7852
6699
  const knownTokens = [
7853
6700
  "background",
@@ -8178,7 +7025,7 @@ function parseShortcut(shortcut) {
8178
7025
  key: parts.find((p) => !["ctrl", "shift", "alt", "cmd", "meta"].includes(p)) || ""
8179
7026
  };
8180
7027
  }
8181
- function useKeyboard(shortcut, handler2, options = {}) {
7028
+ function useKeyboard(shortcut, handler, options = {}) {
8182
7029
  const { enabled = true, preventDefault = false, ignoreInputs = true, scopeRef } = options;
8183
7030
  const callback = useCallback(
8184
7031
  (e) => {
@@ -8195,10 +7042,10 @@ function useKeyboard(shortcut, handler2, options = {}) {
8195
7042
  const keyMatch = parsed.key ? e.key.toLowerCase() === parsed.key : true;
8196
7043
  if (ctrlMatch && shiftMatch && altMatch && metaMatch && keyMatch) {
8197
7044
  if (preventDefault) e.preventDefault();
8198
- handler2(e);
7045
+ handler(e);
8199
7046
  }
8200
7047
  },
8201
- [shortcut, handler2, enabled, preventDefault, ignoreInputs, scopeRef]
7048
+ [shortcut, handler, enabled, preventDefault, ignoreInputs, scopeRef]
8202
7049
  );
8203
7050
  useEffect(() => {
8204
7051
  document.addEventListener("keydown", callback);
@@ -8217,13 +7064,13 @@ function useClickOutside(ref, options) {
8217
7064
  const { enabled = true, onClickOutside } = options;
8218
7065
  useEffect(() => {
8219
7066
  if (!enabled) return;
8220
- const handler2 = (e) => {
7067
+ const handler = (e) => {
8221
7068
  if (ref.current && !ref.current.contains(e.target)) {
8222
7069
  onClickOutside();
8223
7070
  }
8224
7071
  };
8225
- document.addEventListener("mousedown", handler2);
8226
- return () => document.removeEventListener("mousedown", handler2);
7072
+ document.addEventListener("mousedown", handler);
7073
+ return () => document.removeEventListener("mousedown", handler);
8227
7074
  }, [enabled, ref, onClickOutside]);
8228
7075
  }
8229
7076
  function useDebouncedValue(value, delay) {
@@ -8651,7 +7498,7 @@ function Alert({
8651
7498
  );
8652
7499
  }
8653
7500
  var NAlert = Alert;
8654
- var NativeSelect = React.forwardRef(
7501
+ var NativeSelect = React60.forwardRef(
8655
7502
  ({ className, options, placeholder, value, ...props }, ref) => {
8656
7503
  const hasValue = value !== void 0 && value !== "";
8657
7504
  return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
@@ -8817,7 +7664,7 @@ function Avatar({
8817
7664
  ...props
8818
7665
  }) {
8819
7666
  const hasShortcut = src !== void 0 || fallback !== void 0;
8820
- const hasChildren = React.Children.count(children) > 0;
7667
+ const hasChildren = React60.Children.count(children) > 0;
8821
7668
  return /* @__PURE__ */ jsxs(
8822
7669
  AvatarPrimitive.Root,
8823
7670
  {
@@ -8911,9 +7758,9 @@ function AvatarGroup({ ring = true, className, children, ...props }) {
8911
7758
  "data-slot": "avatar-group",
8912
7759
  className: cn("flex -space-x-2", className),
8913
7760
  ...props,
8914
- children: ring ? React.Children.map(children, (child) => {
8915
- if (React.isValidElement(child) && child.type === Avatar) {
8916
- return React.cloneElement(child, { ring: true, ...child.props });
7761
+ children: ring ? React60.Children.map(children, (child) => {
7762
+ if (React60.isValidElement(child) && child.type === Avatar) {
7763
+ return React60.cloneElement(child, { ring: true, ...child.props });
8917
7764
  }
8918
7765
  return child;
8919
7766
  }) : children
@@ -8980,7 +7827,7 @@ function Swap({
8980
7827
  className,
8981
7828
  ...props
8982
7829
  }) {
8983
- const [internalChecked, setInternalChecked] = React.useState(defaultChecked);
7830
+ const [internalChecked, setInternalChecked] = React60.useState(defaultChecked);
8984
7831
  const isControlled = controlledChecked !== void 0 || controlledState !== void 0;
8985
7832
  const currentState = getDerivedState(
8986
7833
  isControlled ? controlledChecked ?? false : internalChecked,
@@ -8988,7 +7835,7 @@ function Swap({
8988
7835
  );
8989
7836
  const dataState = currentState === "indeterminate" ? "indeterminate" : currentState ? "on" : "off";
8990
7837
  const ariaPressed = currentState === "indeterminate" ? "mixed" : currentState;
8991
- const handleClick = React.useCallback((event) => {
7838
+ const handleClick = React60.useCallback((event) => {
8992
7839
  onClick?.(event);
8993
7840
  if (event.defaultPrevented) return;
8994
7841
  if (disabled) return;
@@ -9113,7 +7960,7 @@ var toneClasses = {
9113
7960
  ring: "border-primary/30"
9114
7961
  }
9115
7962
  };
9116
- var StatusPill = React.forwardRef(
7963
+ var StatusPill = React60.forwardRef(
9117
7964
  ({ className, tone = "neutral", pulse = false, label, ...props }, ref) => {
9118
7965
  const c = toneClasses[tone];
9119
7966
  return /* @__PURE__ */ jsxs(
@@ -9172,20 +8019,20 @@ function Toaster({ toastOptions, ...props }) {
9172
8019
  );
9173
8020
  }
9174
8021
  var Form = FormProvider;
9175
- var FormFieldContext = React.createContext({});
8022
+ var FormFieldContext = React60.createContext({});
9176
8023
  var FormField = ({ ...props }) => /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
9177
8024
  var useFormField = () => {
9178
- const fieldContext = React.useContext(FormFieldContext);
9179
- const itemContext = React.useContext(FormItemContext);
8025
+ const fieldContext = React60.useContext(FormFieldContext);
8026
+ const itemContext = React60.useContext(FormItemContext);
9180
8027
  const { getFieldState, formState } = useFormContext();
9181
8028
  const fieldState = getFieldState(fieldContext.name, formState);
9182
8029
  if (!fieldContext) throw new Error("useFormField should be used within <FormField>");
9183
8030
  const { id } = itemContext;
9184
8031
  return { id, name: fieldContext.name, formItemId: `${id}-form-item`, formDescriptionId: `${id}-form-item-description`, formMessageId: `${id}-form-item-message`, ...fieldState };
9185
8032
  };
9186
- var FormItemContext = React.createContext({});
8033
+ var FormItemContext = React60.createContext({});
9187
8034
  function FormItem({ className, ...props }) {
9188
- const id = React.useId();
8035
+ const id = React60.useId();
9189
8036
  return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx("div", { "data-slot": "form-item", className: cn("grid gap-2", className), ...props }) });
9190
8037
  }
9191
8038
  function FormLabel({ className, ...props }) {
@@ -9329,7 +8176,7 @@ function NErrorState({ title = "Something went wrong", message, onRetry, retryLa
9329
8176
  ] });
9330
8177
  }
9331
8178
  function NEmptyState({ title = "No data", description, icon, action, className }) {
9332
- const iconContent = icon ? React__default.isValidElement(icon) ? icon : React__default.createElement(icon, { className: "h-8 w-8" }) : null;
8179
+ const iconContent = icon ? React60__default.isValidElement(icon) ? icon : React60__default.createElement(icon, { className: "h-8 w-8" }) : null;
9333
8180
  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col items-center justify-center gap-3 py-12", className), children: [
9334
8181
  iconContent && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground/50", children: iconContent }),
9335
8182
  /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
@@ -9339,7 +8186,7 @@ function NEmptyState({ title = "No data", description, icon, action, className }
9339
8186
  action && /* @__PURE__ */ jsx("div", { className: "mt-2", children: action })
9340
8187
  ] });
9341
8188
  }
9342
- var NErrorBoundary = class extends React__default.Component {
8189
+ var NErrorBoundary = class extends React60__default.Component {
9343
8190
  constructor(props) {
9344
8191
  super(props);
9345
8192
  this.state = { hasError: false, error: null };
@@ -9651,8 +8498,8 @@ function NCard({
9651
8498
  let footerClassName;
9652
8499
  let mediaSlot = null;
9653
8500
  const mainChildren = [];
9654
- React__default.Children.forEach(children, (child) => {
9655
- if (!React__default.isValidElement(child)) {
8501
+ React60__default.Children.forEach(children, (child) => {
8502
+ if (!React60__default.isValidElement(child)) {
9656
8503
  mainChildren.push(child);
9657
8504
  return;
9658
8505
  }
@@ -9828,7 +8675,7 @@ function truncateByCharacters(text, maxCharacters, suffix = "...") {
9828
8675
  const str = String(text);
9829
8676
  return str.length <= maxCharacters ? str : str.slice(0, maxCharacters) + suffix;
9830
8677
  }
9831
- var CardDensityContext = React__default.createContext("default");
8678
+ var CardDensityContext = React60__default.createContext("default");
9832
8679
  function NCardInfo({
9833
8680
  icon: Icon2,
9834
8681
  label,
@@ -9841,7 +8688,7 @@ function NCardInfo({
9841
8688
  className,
9842
8689
  ...props
9843
8690
  }) {
9844
- const inheritedDensity = React__default.useContext(CardDensityContext);
8691
+ const inheritedDensity = React60__default.useContext(CardDensityContext);
9845
8692
  const resolvedDensity = density ?? inheritedDensity;
9846
8693
  const isTruncated = typeof value === "string" && value.length > maxChars;
9847
8694
  const displayValue = isTruncated ? truncateByCharacters(value, maxChars) : value;
@@ -11090,7 +9937,7 @@ function NContextMenu({ x, y, items, onAction, onClose, className }) {
11090
9937
  children: items.map((item) => {
11091
9938
  const Icon2 = item.icon;
11092
9939
  const hasSub = !!item.submenu?.length;
11093
- return /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
9940
+ return /* @__PURE__ */ jsxs(React60__default.Fragment, { children: [
11094
9941
  item.separatorBefore && /* @__PURE__ */ jsx("div", { className: "my-1 border-t border-border/60" }),
11095
9942
  /* @__PURE__ */ jsxs(
11096
9943
  "div",
@@ -11562,19 +10409,19 @@ function Combobox({
11562
10409
  allowFreeText = false,
11563
10410
  disabled = false
11564
10411
  }) {
11565
- const [open, setOpen] = React.useState(false);
11566
- const [query, setQuery] = React.useState("");
11567
- const [highlight, setHighlight] = React.useState(0);
11568
- const wrapperRef = React.useRef(null);
11569
- const inputRef = React.useRef(null);
11570
- const filtered = React.useMemo(() => {
10412
+ const [open, setOpen] = React60.useState(false);
10413
+ const [query, setQuery] = React60.useState("");
10414
+ const [highlight, setHighlight] = React60.useState(0);
10415
+ const wrapperRef = React60.useRef(null);
10416
+ const inputRef = React60.useRef(null);
10417
+ const filtered = React60.useMemo(() => {
11571
10418
  const q = query.trim().toLowerCase();
11572
10419
  if (!q) return options;
11573
10420
  return options.filter(
11574
10421
  (opt) => opt.label.toLowerCase().includes(q) || opt.value.toLowerCase().includes(q)
11575
10422
  );
11576
10423
  }, [options, query]);
11577
- React.useEffect(() => {
10424
+ React60.useEffect(() => {
11578
10425
  if (!open) return;
11579
10426
  const onClick = (e) => {
11580
10427
  if (wrapperRef.current && !wrapperRef.current.contains(e.target)) {
@@ -11585,7 +10432,7 @@ function Combobox({
11585
10432
  document.addEventListener("mousedown", onClick);
11586
10433
  return () => document.removeEventListener("mousedown", onClick);
11587
10434
  }, [open]);
11588
- React.useEffect(() => {
10435
+ React60.useEffect(() => {
11589
10436
  if (open) {
11590
10437
  setHighlight(0);
11591
10438
  requestAnimationFrame(() => inputRef.current?.focus());
@@ -11593,7 +10440,7 @@ function Combobox({
11593
10440
  setQuery("");
11594
10441
  }
11595
10442
  }, [open]);
11596
- const selectedLabel = React.useMemo(() => {
10443
+ const selectedLabel = React60.useMemo(() => {
11597
10444
  const match = options.find((o) => o.value === value);
11598
10445
  return match?.label ?? value;
11599
10446
  }, [options, value]);
@@ -11733,14 +10580,14 @@ function NFormInner({ schema, defaultValues, onSubmit, form: externalForm, varia
11733
10580
  }, [devTools, form]);
11734
10581
  useEffect(() => {
11735
10582
  if (!devTools?.enabled) return;
11736
- const handler2 = (e) => {
10583
+ const handler = (e) => {
11737
10584
  if (e.key === "F8") {
11738
10585
  e.preventDefault();
11739
10586
  handleFill();
11740
10587
  }
11741
10588
  };
11742
- document.addEventListener("keydown", handler2);
11743
- return () => document.removeEventListener("keydown", handler2);
10589
+ document.addEventListener("keydown", handler);
10590
+ return () => document.removeEventListener("keydown", handler);
11744
10591
  }, [devTools?.enabled, handleFill]);
11745
10592
  useEffect(() => {
11746
10593
  const proc = globalThis.process;
@@ -12357,16 +11204,6 @@ function WizardForm({
12357
11204
  }
12358
11205
  );
12359
11206
  }
12360
- var TableStoreContext = createContext(null);
12361
- var useTableStore = { use: {} };
12362
- var handler = {
12363
- get: (_, prop) => () => {
12364
- const store = useContext(TableStoreContext);
12365
- if (!store) throw new Error("useTableStore must be used within NTable");
12366
- return store.use[prop]();
12367
- }
12368
- };
12369
- useTableStore.use = new Proxy({}, handler);
12370
11207
  var actionButtonClass = (bordered, danger) => cn(
12371
11208
  "flex h-7 w-7 cursor-pointer items-center justify-center rounded-md border border-transparent text-muted-foreground transition-colors",
12372
11209
  danger ? "hover:border-red-200 hover:bg-red-50 hover:text-red-500" : "hover:border-border hover:bg-muted hover:text-foreground",
@@ -12944,8 +11781,8 @@ function useTable(effectiveViewModeOverride) {
12944
11781
  ...effectiveColumns,
12945
11782
  {
12946
11783
  id: "actions",
12947
- header: () => isMenuActions ? null : React__default.createElement("div", { className: "flex w-full justify-start text-left" }, "Actions"),
12948
- cell: ({ row }) => React__default.createElement(TableActionCell, { row, onView, onEdit, onDelete, openRowMenu, menuButton, bordered }),
11784
+ header: () => isMenuActions ? null : React60__default.createElement("div", { className: "flex w-full justify-start text-left" }, "Actions"),
11785
+ cell: ({ row }) => React60__default.createElement(TableActionCell, { row, onView, onEdit, onDelete, openRowMenu, menuButton, bordered }),
12949
11786
  enableSorting: false,
12950
11787
  enableHiding: false
12951
11788
  }
@@ -13209,10 +12046,10 @@ function EditableCell({ cell, onCellEdit }) {
13209
12046
  const columnId = cell.column.id;
13210
12047
  const editor = meta.editor || "text";
13211
12048
  const initial = cell.getValue();
13212
- const [editing, setEditing] = React__default.useState(false);
13213
- const [value, setValue] = React__default.useState(initial);
13214
- const [saving, setSaving] = React__default.useState(false);
13215
- React__default.useEffect(() => {
12049
+ const [editing, setEditing] = React60__default.useState(false);
12050
+ const [value, setValue] = React60__default.useState(initial);
12051
+ const [saving, setSaving] = React60__default.useState(false);
12052
+ React60__default.useEffect(() => {
13216
12053
  if (!editing) setValue(initial);
13217
12054
  }, [initial, editing]);
13218
12055
  const commit = async (next) => {
@@ -13383,7 +12220,7 @@ function NTableContent({ effectiveMode }) {
13383
12220
  const isExpanded = canExpand && row.getIsExpanded();
13384
12221
  const totalCols = row.getVisibleCells().length + (showCheckbox ? 1 : 0) + (hasExpansion ? 1 : 0);
13385
12222
  const rowClassName = getRowClassName?.(row.original);
13386
- return /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
12223
+ return /* @__PURE__ */ jsxs(React60__default.Fragment, { children: [
13387
12224
  /* @__PURE__ */ jsxs(
13388
12225
  TableRow,
13389
12226
  {
@@ -13642,7 +12479,7 @@ function NTableCardSkeleton({ surface }) {
13642
12479
  }
13643
12480
  function NTableLoadingSkeleton({ rows }) {
13644
12481
  const rawColumns = useTableStore.use.columns();
13645
- const responsiveColumns = React__default.useMemo(() => filterResponsiveColumns(rawColumns), [rawColumns]);
12482
+ const responsiveColumns = React60__default.useMemo(() => filterResponsiveColumns(rawColumns), [rawColumns]);
13646
12483
  const columns = responsiveColumns;
13647
12484
  const showCheckbox = useTableStore.use.showCheckbox();
13648
12485
  const headerClassName = useTableStore.use.headerClassName();
@@ -13765,19 +12602,19 @@ function useCardContinuation({
13765
12602
  rowCount,
13766
12603
  viewportRef
13767
12604
  }) {
13768
- const [internalPending, setInternalPending] = React__default.useState(false);
13769
- const [internalError, setInternalError] = React__default.useState(null);
13770
- const [announcement, setAnnouncement] = React__default.useState("");
13771
- const [viewportReady, setViewportReady] = React__default.useState(false);
13772
- const pendingRef = React__default.useRef(false);
13773
- const previousRowCountRef = React__default.useRef(rowCount);
13774
- const configRef = React__default.useRef(config);
12605
+ const [internalPending, setInternalPending] = React60__default.useState(false);
12606
+ const [internalError, setInternalError] = React60__default.useState(null);
12607
+ const [announcement, setAnnouncement] = React60__default.useState("");
12608
+ const [viewportReady, setViewportReady] = React60__default.useState(false);
12609
+ const pendingRef = React60__default.useRef(false);
12610
+ const previousRowCountRef = React60__default.useRef(rowCount);
12611
+ const configRef = React60__default.useRef(config);
13775
12612
  configRef.current = config;
13776
12613
  const enabled = Boolean(config);
13777
12614
  const pending = Boolean(config?.loadingMore || internalPending);
13778
12615
  const error = config?.loadMoreError ?? internalError;
13779
12616
  const hasNextPage = Boolean(config?.hasNextPage);
13780
- const load = React__default.useCallback(async () => {
12617
+ const load = React60__default.useCallback(async () => {
13781
12618
  const current = configRef.current;
13782
12619
  if (!current) return;
13783
12620
  if (pendingRef.current || current.loadingMore || !current.hasNextPage) return;
@@ -13802,13 +12639,13 @@ function useCardContinuation({
13802
12639
  load,
13803
12640
  { rootMargin: config?.rootMargin ?? DEFAULT_ROOT_MARGIN }
13804
12641
  );
13805
- React__default.useLayoutEffect(() => {
12642
+ React60__default.useLayoutEffect(() => {
13806
12643
  const node = viewportRef.current ?? null;
13807
12644
  scrollContainerRef.current = node;
13808
12645
  const ready = Boolean(node);
13809
12646
  setViewportReady((value) => value === ready ? value : ready);
13810
12647
  });
13811
- React__default.useEffect(() => {
12648
+ React60__default.useEffect(() => {
13812
12649
  const previous = previousRowCountRef.current;
13813
12650
  previousRowCountRef.current = rowCount;
13814
12651
  if (!configRef.current) return;
@@ -13818,10 +12655,10 @@ function useCardContinuation({
13818
12655
  configRef.current.itemsLoadedLabel?.(appended) ?? `${appended} more ${appended === 1 ? "item" : "items"} loaded.`
13819
12656
  );
13820
12657
  }, [rowCount]);
13821
- React__default.useEffect(() => {
12658
+ React60__default.useEffect(() => {
13822
12659
  if (!pending) doneLoading();
13823
12660
  }, [pending, doneLoading]);
13824
- React__default.useEffect(() => {
12661
+ React60__default.useEffect(() => {
13825
12662
  if (!enabled || !hasNextPage || error) return;
13826
12663
  return observe();
13827
12664
  }, [enabled, hasNextPage, error, observe, viewportReady, rowCount]);
@@ -13875,7 +12712,7 @@ function NTableCards({ effectiveMode }) {
13875
12712
  const cardPagination = useTableStore.use.cardPagination();
13876
12713
  const cardColumnCount = useTableStore.use.cardColumnCount();
13877
12714
  const surface = useTableSurfaceAppearance(bordered, borderColor);
13878
- const viewportRef = React__default.useRef(null);
12715
+ const viewportRef = React60__default.useRef(null);
13879
12716
  const continuationConfig = cardPagination.mode === "infinite" ? cardPagination : null;
13880
12717
  const continuation = useCardContinuation({
13881
12718
  config: continuationConfig,
@@ -14090,41 +12927,23 @@ function page(pageIndex) {
14090
12927
  function range(from, to) {
14091
12928
  return Array.from({ length: to - from + 1 }, (_, index) => page(from + index));
14092
12929
  }
14093
- var NTableDefaultsContext = React__default.createContext({});
14094
- function NTableDefaultsProvider({
14095
- children,
14096
- value
14097
- }) {
14098
- return /* @__PURE__ */ jsx(NTableDefaultsContext.Provider, { value, children });
14099
- }
14100
- function useNTableDefaults() {
14101
- return React__default.useContext(NTableDefaultsContext);
14102
- }
14103
- function useResolvedPaginationLabels(own) {
14104
- const defaults = useNTableDefaults();
14105
- const inherited = defaults.paginationLabels;
14106
- return React__default.useMemo(
14107
- () => ({ ...inherited, ...own }),
14108
- [inherited, own]
14109
- );
14110
- }
14111
12930
  function CardLoadMorePagination({
14112
12931
  config,
14113
12932
  rowCount,
14114
12933
  bordered,
14115
12934
  className
14116
12935
  }) {
14117
- const [internalPending, setInternalPending] = React__default.useState(false);
14118
- const [internalError, setInternalError] = React__default.useState(null);
14119
- const [announcement, setAnnouncement] = React__default.useState("");
14120
- const buttonRef = React__default.useRef(null);
14121
- const pendingRef = React__default.useRef(false);
14122
- const restoreFocusRef = React__default.useRef(false);
14123
- const previousRowCountRef = React__default.useRef(rowCount);
14124
- const errorId = React__default.useId();
12936
+ const [internalPending, setInternalPending] = React60__default.useState(false);
12937
+ const [internalError, setInternalError] = React60__default.useState(null);
12938
+ const [announcement, setAnnouncement] = React60__default.useState("");
12939
+ const buttonRef = React60__default.useRef(null);
12940
+ const pendingRef = React60__default.useRef(false);
12941
+ const restoreFocusRef = React60__default.useRef(false);
12942
+ const previousRowCountRef = React60__default.useRef(rowCount);
12943
+ const errorId = React60__default.useId();
14125
12944
  const pending = Boolean(config.loadingMore || internalPending);
14126
12945
  const error = config.loadMoreError ?? internalError;
14127
- React__default.useEffect(() => {
12946
+ React60__default.useEffect(() => {
14128
12947
  const previous = previousRowCountRef.current;
14129
12948
  if (rowCount > previous) {
14130
12949
  const appended = rowCount - previous;
@@ -14134,7 +12953,7 @@ function CardLoadMorePagination({
14134
12953
  }
14135
12954
  previousRowCountRef.current = rowCount;
14136
12955
  }, [config.itemsLoadedLabel, rowCount]);
14137
- React__default.useEffect(() => {
12956
+ React60__default.useEffect(() => {
14138
12957
  if (pending || !restoreFocusRef.current) return;
14139
12958
  restoreFocusRef.current = false;
14140
12959
  const frame = requestAnimationFrame(() => buttonRef.current?.focus());
@@ -14204,9 +13023,9 @@ function CardLoadMorePagination({
14204
13023
  var navButtonClass = "h-8 w-8 p-0 text-foreground disabled:text-muted-foreground disabled:opacity-70";
14205
13024
  var chevronClass = "h-4 w-4 rtl:-scale-x-100";
14206
13025
  function useLowerBoundPageCountWarning(manualPagination, pageCount, pagination) {
14207
- const previous = React__default.useRef(null);
14208
- const warned = React__default.useRef(false);
14209
- React__default.useEffect(() => {
13026
+ const previous = React60__default.useRef(null);
13027
+ const warned = React60__default.useRef(false);
13028
+ React60__default.useEffect(() => {
14210
13029
  if (typeof console === "undefined") return;
14211
13030
  if (typeof process !== "undefined" && process.env?.NODE_ENV === "production") return;
14212
13031
  if (!manualPagination || pageCount === void 0 || !pagination) {
@@ -14675,21 +13494,6 @@ function NTableHeader() {
14675
13494
  ] })
14676
13495
  ] });
14677
13496
  }
14678
- function formatJsonValue(value) {
14679
- if (typeof value === "string") return value;
14680
- try {
14681
- return JSON.stringify(value ?? null, null, 2) ?? String(value);
14682
- } catch {
14683
- return String(value);
14684
- }
14685
- }
14686
- function NTableJson() {
14687
- const viewMode = useTableStore.use.viewMode();
14688
- const renderJson = useTableStore.use.renderJson();
14689
- const jsonValue = useTableStore.use.jsonValue();
14690
- if (viewMode !== "json") return null;
14691
- return /* @__PURE__ */ jsx("div", { className: "flex-1 flex flex-col min-h-0 overflow-hidden", children: renderJson?.() ?? /* @__PURE__ */ jsx(NajmScroll, { axis: "both", className: "h-full min-h-0 rounded-md border border-border bg-muted/40", children: /* @__PURE__ */ jsx("pre", { className: "p-4 font-mono text-xs leading-relaxed text-foreground", children: formatJsonValue(jsonValue) }) }) });
14692
- }
14693
13497
  function TableStateSlot({ children }) {
14694
13498
  return /* @__PURE__ */ jsx("div", { className: "flex min-h-64 flex-1 items-center justify-center", children });
14695
13499
  }
@@ -14744,9 +13548,9 @@ function TableLayout(props) {
14744
13548
  if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
14745
13549
  const mql = window.matchMedia("(max-width: 639px)");
14746
13550
  setIsMobile(mql.matches);
14747
- const handler2 = (e) => setIsMobile(e.matches);
14748
- mql.addEventListener("change", handler2);
14749
- return () => mql.removeEventListener("change", handler2);
13551
+ const handler = (e) => setIsMobile(e.matches);
13552
+ mql.addEventListener("change", handler);
13553
+ return () => mql.removeEventListener("change", handler);
14750
13554
  }, []);
14751
13555
  const effectiveMode = (() => {
14752
13556
  if (viewMode === "json") return "json";
@@ -16111,7 +14915,7 @@ function NNavbar({
16111
14915
  (userMenuActions.length > 0 || onLogout) && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
16112
14916
  userMenuActions.map((action) => {
16113
14917
  const ActionIcon = action.icon;
16114
- return /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
14918
+ return /* @__PURE__ */ jsxs(React60__default.Fragment, { children: [
16115
14919
  action.separator && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
16116
14920
  /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: action.onClick, className: "cursor-pointer", children: [
16117
14921
  ActionIcon && /* @__PURE__ */ jsx(ActionIcon, { className: "h-4 w-4 mr-2" }),
@@ -16178,11 +14982,11 @@ function NAppShell({
16178
14982
  [onNavigate]
16179
14983
  );
16180
14984
  useEffect(() => {
16181
- const handler2 = (e) => {
14985
+ const handler = (e) => {
16182
14986
  if (e.key === "Escape") setMobileOpen(false);
16183
14987
  };
16184
- document.addEventListener("keydown", handler2);
16185
- return () => document.removeEventListener("keydown", handler2);
14988
+ document.addEventListener("keydown", handler);
14989
+ return () => document.removeEventListener("keydown", handler);
16186
14990
  }, []);
16187
14991
  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-screen overflow-hidden", classNames?.root), children: [
16188
14992
  /* @__PURE__ */ jsx(
@@ -16381,4 +15185,4 @@ function NGridItem({
16381
15185
  return /* @__PURE__ */ jsx("div", { className: itemClassName, ...props, children });
16382
15186
  }
16383
15187
 
16384
- export { Alert, NCard as AsyncCard, Avatar, AvatarFallback, AvatarFormInput, AvatarGroup, AvatarImage, AvatarInput, AvatarStatus, Badge, BaseInput, Button, Calendar, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CheckboxGroupInput, CheckboxInput, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, ColorArrayInput, ColorPickerInput, Combobox, ComboboxInput, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, DEFAULT_THEME_FILE_NAME, DateInput, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicArray_default as DynamicArray, EmojiInput, FileImportButton, FileInput, Form, FormControl, FormDescription, FormField, FormInput, FormItem, FormLabel, FormMessage, IconButton, ImageInput, Indicator4 as Indicator, Input, Label2 as Label, LangInput, MultiSelectInput, NAJM_COMPONENT_NAMES, NAJM_SAVED_THEME_VALUE, NAlert, NAppShell, NCard as NAsyncCard, NAvatar, NBadge, NBarChart, NBrandingProvider, NBulkActionsBar, NButton, NCard, NCardAction, NCardFooter, NCardInfo, NCardMedia, NCardSection, NChartSkeleton, NCommandPalette, NConfirmDialog, NContextMenu, NDataCardShell, NDeleteDialog, NDeleteDialogContent, NDetailCard, NDetailItem, NDetailList, NDialog, NDialogDescription, NDialogHeader, NDialogPrimaryButton, NDialogSecondaryButton, NDonutCard, NEditorTabs, NEmptyState, NErrorBoundary, NErrorState, NFileBrowser, NFileTypeIcon, NFilterBar, NFolderIcon, NForm, NFormSectionHeader, NGrid, NGridItem, NIcon, NImage, NIndicator, NInspectorSheet, NLineChart, NLoadingState, NMultiDialog, NNavbar, NPageHeader, NPageHeaderActions, NPageHeaderCompactActions, NPageHeaderFilters, NPageHeaderTop, NPageLayout, NPieChart, NPortalScopeProvider, NProgress, NRowActions, NSection, NSectionHeader, NSectionInfo, NSectionWithInfo, NSheet, NSidebar, NSidebarBrand, NSidebarContent, NSidebarFooter, NSidebarHeader, NSidebarItem, NSidebarMobile, NSidebarProvider, NSidebarSection, NSkeleton, NSkeletonCalendar, NSkeletonChart, NSkeletonDonut, NSkeletonEventList, NSkeletonWidget, NSkeletonWidgets, NSlider, NSmartPasteDialog, NSpinner, NStatCard, NStatCardSkeleton, NStatusBreakdown, Swap as NSwap, NTable, NTableCardRoot, NTableCards, NTableContent, NTableDefaultsProvider, NTableHeader, NTableJson, NTableLoadingSkeleton, NTablePagination, NTableRowSkeleton, NTableSkeleton, NTabs, NThemeCustomizer, NThemePresets, NUploader, NViewBody, NViewToggle, NajmDesignProvider, NajmScroll, NajmThemeProvider, NativeSelect, NumberInput, OtpInput, PasswordInput, PhoneInput, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PrefixProvider, Progress, RADIUS_VALUE_MAP, RadioGroup, RadioGroupInput, RadioGroupItem, RepeatingFields, ScrollArea, SearchField, SearchField as SearchInput, SegmentedControl, Select, SelectContent, SelectGroup, SelectInput, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SimpleTooltip, NSkeleton as Skeleton, Slider, SliderInput, StarRatingInput, StatusPill, StepIndicator, StepsHeader, StepsProgress, Swap, SwapIndeterminate, SwapOff, SwapOn, Switch, SwitchInput, TAB_COLORS, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, TableStoreContext, Tabs, TabsContent, TabsList, TabsTrigger, TextAreaInput, TextInput, Textarea, TimeInput, TimeZoneInput, Toaster, Toggle, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, VariantProvider, WizardForm, alertVariants, avatarVariants, badgeColorVariants, badgeVariants, buildDefaultFileColumns, buildPageItems, buttonVariants, cn, composePreset, createDialogStore, createTableStore, defineNajmDesignConfig, defineNajmThemeConfig, detectFormat, dialogVariants, filterResponsiveColumns, formatColor, formatFileBytes, formatFileRelative, getIconColorProps, getNChartColor, getNextEditorTabValue, hiddenBelowClasses, indicatorVariants, inputBorderClasses, normalizeThemeFileName, parseColor, parseNajmDesignConfig, parseNajmThemeConfig, parseThemeFile, resolveHiddenBelowClass, resolvePreset, resolveRadiusValue, resolveSlot, resolveVariantAlias, sidebarBorderClasses, sliderVariants, stringifyNajmDesignConfig, stringifyNajmThemeConfig, stringifyThemeFile, surfaceBorderClasses, swapVariants, toPickerHex, toggleVariants, tooltipContentVariants, truncateByCharacters, useClickOutside, useContextMenu, useDebouncedValue, useDelayedLoading, useDialog, useDialogStore, useDynamicPageSize, useFormField, useFormSubmission, useInfiniteScroll, useKeyboard, useLocalStorageState, useNBranding, useNForm, useNPortalScope, useNSidebar, useNTableDefaults, useNajmAppearance, useNajmComponentStyle, useNajmDesign, useNajmThemeMode, usePrefix, useSelection, useStepNavigation, useStorageContextMenu, useStoreSync, useTable, useTableKeyboard, useTableStore, useVariant, useVariantPreset };
15188
+ export { Alert, NCard as AsyncCard, Avatar, AvatarFallback, AvatarFormInput, AvatarGroup, AvatarImage, AvatarInput, AvatarStatus, Badge, BaseInput, Calendar, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CheckboxGroupInput, CheckboxInput, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, ColorArrayInput, ColorPickerInput, Combobox, ComboboxInput, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, DEFAULT_THEME_FILE_NAME, DateInput, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicArray_default as DynamicArray, EmojiInput, FileImportButton, FileInput, Form, FormControl, FormDescription, FormField, FormInput, FormItem, FormLabel, FormMessage, IconButton, ImageInput, Indicator4 as Indicator, Input, Label2 as Label, LangInput, MultiSelectInput, NAJM_SAVED_THEME_VALUE, NAlert, NAppShell, NCard as NAsyncCard, NAvatar, NBadge, NBarChart, NBrandingProvider, NBulkActionsBar, NCard, NCardAction, NCardFooter, NCardInfo, NCardMedia, NCardSection, NChartSkeleton, NCommandPalette, NConfirmDialog, NContextMenu, NDataCardShell, NDeleteDialog, NDeleteDialogContent, NDetailCard, NDetailItem, NDetailList, NDialog, NDialogDescription, NDialogHeader, NDialogPrimaryButton, NDialogSecondaryButton, NDonutCard, NEditorTabs, NEmptyState, NErrorBoundary, NErrorState, NFileBrowser, NFileTypeIcon, NFilterBar, NFolderIcon, NForm, NFormSectionHeader, NGrid, NGridItem, NImage, NIndicator, NInspectorSheet, NLineChart, NLoadingState, NMultiDialog, NNavbar, NPageHeader, NPageHeaderActions, NPageHeaderCompactActions, NPageHeaderFilters, NPageHeaderTop, NPageLayout, NPieChart, NPortalScopeProvider, NProgress, NRowActions, NSection, NSectionHeader, NSectionInfo, NSectionWithInfo, NSheet, NSidebar, NSidebarBrand, NSidebarContent, NSidebarFooter, NSidebarHeader, NSidebarItem, NSidebarMobile, NSidebarProvider, NSidebarSection, NSkeleton, NSkeletonCalendar, NSkeletonChart, NSkeletonDonut, NSkeletonEventList, NSkeletonWidget, NSkeletonWidgets, NSlider, NSmartPasteDialog, NSpinner, NStatCard, NStatCardSkeleton, NStatusBreakdown, Swap as NSwap, NTable, NTableCardRoot, NTableCards, NTableContent, NTableHeader, NTableLoadingSkeleton, NTablePagination, NTableRowSkeleton, NTableSkeleton, NTabs, NThemeCustomizer, NThemePresets, NUploader, NViewBody, NViewToggle, NativeSelect, NumberInput, OtpInput, PasswordInput, PhoneInput, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PrefixProvider, Progress, RadioGroup, RadioGroupInput, RadioGroupItem, RepeatingFields, ScrollArea, SearchField, SearchField as SearchInput, SegmentedControl, Select, SelectContent, SelectGroup, SelectInput, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SimpleTooltip, NSkeleton as Skeleton, Slider, SliderInput, StarRatingInput, StatusPill, StepIndicator, StepsHeader, StepsProgress, Swap, SwapIndeterminate, SwapOff, SwapOn, Switch, SwitchInput, TAB_COLORS, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TextAreaInput, TextInput, Textarea, TimeInput, TimeZoneInput, Toaster, Toggle, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, VariantProvider, WizardForm, alertVariants, avatarVariants, badgeColorVariants, badgeVariants, buildDefaultFileColumns, buildPageItems, createDialogStore, createTableStore, detectFormat, dialogVariants, filterResponsiveColumns, formatColor, formatFileBytes, formatFileRelative, getIconColorProps, getNChartColor, getNextEditorTabValue, hiddenBelowClasses, indicatorVariants, normalizeThemeFileName, parseColor, parseThemeFile, resolveHiddenBelowClass, resolveSlot, sliderVariants, stringifyThemeFile, swapVariants, toPickerHex, toggleVariants, tooltipContentVariants, truncateByCharacters, useClickOutside, useContextMenu, useDebouncedValue, useDelayedLoading, useDialog, useDialogStore, useDynamicPageSize, useFormField, useFormSubmission, useInfiniteScroll, useKeyboard, useLocalStorageState, useNBranding, useNForm, useNPortalScope, useNSidebar, usePrefix, useSelection, useStepNavigation, useStorageContextMenu, useStoreSync, useTable, useTableKeyboard, useVariant, useVariantPreset };