najm-kit 2.1.1 → 2.1.2
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.d.ts +22 -1
- package/dist/index.mjs +53 -17
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -544,6 +544,14 @@ interface DialogConfig {
|
|
|
544
544
|
width?: DialogWidth;
|
|
545
545
|
height?: DialogHeight;
|
|
546
546
|
className?: string;
|
|
547
|
+
/** Class applied to the rendered dialog header. */
|
|
548
|
+
headerClassName?: string;
|
|
549
|
+
/** Class applied to the dialog title. */
|
|
550
|
+
titleClassName?: string;
|
|
551
|
+
/** Class applied to the dialog description. */
|
|
552
|
+
descriptionClassName?: string;
|
|
553
|
+
/** Class applied to the inline close button used by window/page-header dialogs. */
|
|
554
|
+
closeButtonClassName?: string;
|
|
547
555
|
/** Visual treatment for the dialog chrome. `window` adds a compact title bar with an inline bordered close button. */
|
|
548
556
|
variant?: DialogVariant;
|
|
549
557
|
actionMode?: DialogActionMode;
|
|
@@ -569,6 +577,14 @@ interface PushDialogOptions {
|
|
|
569
577
|
width?: DialogWidth;
|
|
570
578
|
height?: DialogHeight;
|
|
571
579
|
className?: string;
|
|
580
|
+
/** Class applied to the rendered dialog header. */
|
|
581
|
+
headerClassName?: string;
|
|
582
|
+
/** Class applied to the dialog title. */
|
|
583
|
+
titleClassName?: string;
|
|
584
|
+
/** Class applied to the dialog description. */
|
|
585
|
+
descriptionClassName?: string;
|
|
586
|
+
/** Class applied to the inline close button used by window/page-header dialogs. */
|
|
587
|
+
closeButtonClassName?: string;
|
|
572
588
|
/** Visual treatment for the dialog chrome. `window` adds a compact title bar with an inline bordered close button. */
|
|
573
589
|
variant?: DialogVariant;
|
|
574
590
|
/**
|
|
@@ -1809,6 +1825,8 @@ interface SelectInputProps extends BaseProps {
|
|
|
1809
1825
|
icon?: InputIcon;
|
|
1810
1826
|
showIcon?: boolean;
|
|
1811
1827
|
disabled?: boolean;
|
|
1828
|
+
/** Class applied to the portalled dropdown surface. */
|
|
1829
|
+
dropdownClassName?: string;
|
|
1812
1830
|
}
|
|
1813
1831
|
interface ComboboxInputProps extends BaseProps {
|
|
1814
1832
|
value: string;
|
|
@@ -2105,6 +2123,7 @@ declare const VariantProvider: React__default.FC<{
|
|
|
2105
2123
|
declare const useVariant: () => FormVariant;
|
|
2106
2124
|
declare const useVariantPreset: () => FormSlotClassNames;
|
|
2107
2125
|
|
|
2126
|
+
type FormInputBackground = "card" | "background" | "secondary" | "muted" | "transparent";
|
|
2108
2127
|
interface BaseFormInputProps {
|
|
2109
2128
|
name: string;
|
|
2110
2129
|
formLabel?: string;
|
|
@@ -2117,6 +2136,8 @@ interface BaseFormInputProps {
|
|
|
2117
2136
|
readOnly?: boolean;
|
|
2118
2137
|
hidden?: boolean;
|
|
2119
2138
|
className?: string;
|
|
2139
|
+
/** Semantic surface color for the input control. */
|
|
2140
|
+
background?: FormInputBackground;
|
|
2120
2141
|
classNames?: FormSlotClassNames;
|
|
2121
2142
|
onChange?: (value: any) => void;
|
|
2122
2143
|
}
|
|
@@ -3396,4 +3417,4 @@ interface InspectorSheetProps {
|
|
|
3396
3417
|
}
|
|
3397
3418
|
declare function NInspectorSheet({ open, onClose, title, children }: InspectorSheetProps): react_jsx_runtime.JSX.Element;
|
|
3398
3419
|
|
|
3399
|
-
export { Alert, type AlertLook, type AlertOrientation, type AlertProps, type AlertSize, type AlertTone, type AlertVariant, NCard as AsyncCard, Avatar, AvatarFallback, AvatarGroup, type AvatarGroupProps, AvatarImage, type AvatarProps$1 as AvatarProps, type AvatarShape$1 as AvatarShape, type AvatarSize, AvatarStatus, type AvatarStatusType, Badge, type BadgeColor, type BadgeIcon, type BadgeLook, type BadgeProps, type BadgeShape, type BadgeSize, type BadgeVariant, BaseInput, type BuildDefaultFileColumnsOptions, Button, type ButtonConfig, type ButtonIcon, type ButtonLoaderPosition, type ButtonProps, type ButtonRounded, type ButtonSize, type ButtonVariant, Calendar, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CheckboxGroupInput, type CheckboxGroupInputProps, CheckboxInput, type CheckboxInputProps, Collapsible, CollapsibleContent, CollapsibleTrigger, ColorArrayInput, type ColorArrayInputProps, type ColorFormat, ColorPickerInput, type ColorPickerInputProps, Combobox, ComboboxInput, type ComboboxInputProps, type ComboboxOption, type ComboboxProps, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, type ContextMenuItem, DateInput, type DateInputProps, type DeleteDialogOptions, Dialog, type DialogActionMode, type DialogApi, DialogClose, type DialogConfig, DialogContent, type DialogContentProps, DialogDescription, DialogFooter, DialogHeader, type DialogHeight, DialogOverlay, type DialogPadding, DialogPortal, type DialogRenderContext, type DialogRenderer, type DialogSize, type DialogStore, DialogTitle, DialogTrigger, type DialogVariant, type DialogWidth, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicArray, type DynamicArrayProps, EmojiInput, type EmojiInputProps, type FileBrowserMode, FileImportButton, FileInput, type FileInputProps, type FileNode, Form, FormControl, FormDescription, FormField, FormInput, type FormInputProps, FormItem, FormLabel, FormMessage, type FormProps, type FormSlotClassNames, type FormVariant, IconButton, type IconButtonProps, type IconButtonSize, type IconButtonVariant, ImageInput, type ImageInputProps, Indicator, type IndicatorHorizontal, type IndicatorOverlay, type IndicatorPosition, type IndicatorProps, type IndicatorResponsivePosition, type IndicatorSize, type IndicatorVertical, Input, type InputIcon, Label, LangInput, type LangInputProps, type LinkComponentType, MultiSelectInput, type MultiSelectInputProps, NAJM_COMPONENT_NAMES, NAlert, type NAppCommandItem, NAppShell, type NAppShellAction, type NAppShellClassNames, type NAppShellProps, type NAppShellUser, NCard as NAsyncCard, type CardClassNames as NAsyncCardClassNames, type CardProps as NAsyncCardProps, NAvatar, type NAvatarClassNames, type NAvatarProps, type AvatarShape as NAvatarShape, NBadge, type NBadgeLook, type NBadgeProps, type NBulkAction, type NBulkActionButton, type NBulkActionSelect, NBulkActionsBar, type NBulkActionsBarProps, NButton, type NButtonProps, NCard, NCardAction, type CardClassNames as NCardClassNames, NCardFooter, type CardProps as NCardProps, NCommandPalette, type NCommandPaletteProps, NConfirmDialog, type NConfirmDialogProps, NContextMenu, type NContextMenuItem, type NContextMenuProps, NDataCardShell, type NDataCardShellActions, type NDataCardShellProps, NDeleteDialog, NDeleteDialogContent, type NDeleteDialogContentProps, type NDeleteDialogProps, NDetailCard, type NDetailCardClassNames, type NDetailCardProps, NDetailItem, type NDetailItemProps, NDetailList, type NDetailListItem, type NDetailListProps, NDialog, type NDialogDirectProps, type NDialogProps, type NEditorTab, NEditorTabs, type NEditorTabsProps, NEmptyState, type NEmptyStateProps, NErrorBoundary, NErrorState, type NErrorStateProps, NFileBrowser, type NFileBrowserCardProps, type NFileBrowserProps, type NFileBrowserRenderThumbProps, NFileTypeIcon, type NFileTypeIconProps, NFilterBar, NFolderIcon, type NFolderIconProps, NForm, NFormSectionHeader, type NFormSectionHeaderProps, NIcon, type NIconProps, type NIconSource, NIndicator, NInspectorSheet, NLoadingState, type NLoadingStateProps, NMultiDialog, type NMultiDialogProps, NNavbar, NPageHeader, NPageHeaderActions, NPageHeaderFilters, type NPageHeaderProps, NPageHeaderTop, NPageLayout, type NPageLayoutProps, NPortalScopeProvider, NProgress, type NProgressProps, NRowActions, NSection, NSectionHeader, type NSectionHeaderActionsProps, type NSectionHeaderContentProps, type NSectionHeaderProps, type NSectionHeaderSubtitleProps, type NSectionHeaderTitleProps, NSectionInfo, type NSectionInfoProps, type NSectionProps, NSectionWithInfo, type NSectionWithInfoItem, type NSectionWithInfoProps, NSheet, type NSheetProps, NSidebar, NSidebarContent, type NSidebarContentProps, NSidebarFooter, type NSidebarFooterProps, NSidebarHeader, type NSidebarHeaderProps, NSidebarItem, NSidebarLogo, type NSidebarLogoProps, NSidebarMobile, type NSidebarMobileProps, NSidebarSection, type NSidebarSectionProps, NSkeleton, NSkeletonCalendar, NSkeletonChart, NSkeletonDonut, NSkeletonEventList, NSkeletonWidget, NSkeletonWidgets, NSlider, type NSliderProps, NSmartPasteDialog, type NSmartPasteDialogProps, NSpinner, type NSpinnerProps, NStatCard, type NStatCardClassNames, type NStatCardProps, NStatCardSkeleton, type NStatCardVariant, Swap as NSwap, type NSwapProps, NTable, NTableCardRoot, type NTableCardRootProps, NTableCards, type NTableClassNames, NTableContent, NTableHeader, NTableLoadingSkeleton, type NTableMenu, type NTableMenuProp, NTablePagination, type NTableProps, NTableRowSkeleton, NTableSkeleton, type NTableState, NTabs, type NTabsClassNames, type NTabsColor, type NTabsItem, type NTabsProps, type NTabsStyles, NUploader, type NUploaderItem, type NUploaderItemStatus, type NUploaderProps, NViewBody, NViewToggle, type NajmAccent, type NajmAppearance, type NajmBorderSide, type NajmComponentName, type NajmComponentRadius, type NajmComponentStyleConfig, type NajmComponentThemeConfig, type NajmDensity, type NajmDesignConfig, NajmDesignProvider, type NajmDesignProviderProps, type NajmLayoutConfig, type NajmMode, type NajmPreset, type NajmRadiusScale, NajmScroll, type NajmScrollProps, type NajmSlotStyle, type NajmThemeConfig, NajmThemeProvider, type NajmThemeProviderProps, type NajmThemeTokens, type NajmTypographyConfig, type NajmVariantStyle, NativeSelect, type NativeSelectOption, type NativeSelectProps, type NavItem, type NavItemGroup, NumberInput, type NumberInputProps, PasswordInput, type PasswordInputProps, PhoneInput, type PhoneInputProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PrefixProvider, Progress, type ProgressColor, type ProgressLabelPosition, type ProgressProps, type ProgressSize, type PushDialogOptions, RADIUS_VALUE_MAP, RadioGroup, RadioGroupInput, type RadioGroupInputProps, RadioGroupItem, type RenderSlot, RepeatingFields, type RepeatingFieldsProps, ScrollArea, type ScrollAreaProps, SearchField, SearchField as SearchInput, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, SelectContent, SelectGroup, SelectInput, type SelectInputProps, SelectItem, type SelectItemType$1 as SelectItemDataType, type SelectItemType, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, type SidebarItemProps, type SidebarProps, type SidebarWidths, SimpleTooltip, type SimpleTooltipProps, NSkeleton as Skeleton, Slider, SliderInput, type SliderInputProps, type SliderOrientation, type SliderProps, type SliderSize, type SliderVariant, type SmartPastePreview, type SpinnerVariant, StarRatingInput, type StarRatingInputProps, StatusPill, type StatusPillProps, type StatusPillTone, type StepConfig, StepIndicator, type StepMeta, StepsHeader, StepsProgress, type StorageMenuAction, type StorageSortOption, type StorageTarget, Swap, type SwapEffect, SwapIndeterminate, SwapOff, SwapOn, type SwapProps, type SwapSize, type SwapState, Switch, type SwitchColor, SwitchInput, type SwitchInputProps, type SwitchSize, TAB_COLORS, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableHeaderColor, TableRow, type TableState, type TableStore, TableStoreContext, Tabs, TabsContent, TabsList, type TabsListProps, type TabsOrientation, type TabsProps, TabsTrigger, type TabsTriggerProps, type TabsVariant, TextAreaInput, type TextAreaInputProps, TextInput, type TextInputProps, Textarea, TimeInput, type TimeInputProps, Toaster, Toggle, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UseContextMenuResult, type UseNFormOptions, type UseStorageContextMenuOptions, type UseStorageContextMenuResult, type UserMenuAction, VariantProvider, type WizardClassNames, WizardForm, type WizardFormProps, alertVariants, avatarVariants, badgeColorVariants, badgeVariants, buildDefaultFileColumns, buttonVariants, cn, composePreset, createDialogStore, createTableStore, defineNajmDesignConfig, defineNajmThemeConfig, detectFormat, dialogVariants, formatColor, formatFileBytes, formatFileRelative, getIconColorProps, getNextEditorTabValue, indicatorVariants, inputBorderClasses, parseColor, parseNajmDesignConfig, parseNajmThemeConfig, resolvePreset, resolveRadiusValue, resolveSlot, resolveVariantAlias, sidebarBorderClasses, sliderVariants, stringifyNajmDesignConfig, stringifyNajmThemeConfig, surfaceBorderClasses, swapVariants, toPickerHex, toggleVariants, tooltipContentVariants, truncateByCharacters, useClickOutside, useContextMenu, useDebouncedValue, useDelayedLoading, useDialog, useDialogStore, useDynamicPageSize, useFormField, useFormSubmission, useInfiniteScroll, useKeyboard, useLocalStorageState, useNForm, useNPortalScope, useNajmAppearance, useNajmComponentStyle, useNajmDesign, usePrefix, useSelection, useStepNavigation, useStorageContextMenu, useStoreSync, useTable, useTableKeyboard, useTableStore, useVariant, useVariantPreset };
|
|
3420
|
+
export { Alert, type AlertLook, type AlertOrientation, type AlertProps, type AlertSize, type AlertTone, type AlertVariant, NCard as AsyncCard, Avatar, AvatarFallback, AvatarGroup, type AvatarGroupProps, AvatarImage, type AvatarProps$1 as AvatarProps, type AvatarShape$1 as AvatarShape, type AvatarSize, AvatarStatus, type AvatarStatusType, Badge, type BadgeColor, type BadgeIcon, type BadgeLook, type BadgeProps, type BadgeShape, type BadgeSize, type BadgeVariant, BaseInput, type BuildDefaultFileColumnsOptions, Button, type ButtonConfig, type ButtonIcon, type ButtonLoaderPosition, type ButtonProps, type ButtonRounded, type ButtonSize, type ButtonVariant, Calendar, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CheckboxGroupInput, type CheckboxGroupInputProps, CheckboxInput, type CheckboxInputProps, Collapsible, CollapsibleContent, CollapsibleTrigger, ColorArrayInput, type ColorArrayInputProps, type ColorFormat, ColorPickerInput, type ColorPickerInputProps, Combobox, ComboboxInput, type ComboboxInputProps, type ComboboxOption, type ComboboxProps, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, type ContextMenuItem, DateInput, type DateInputProps, type DeleteDialogOptions, Dialog, type DialogActionMode, type DialogApi, DialogClose, type DialogConfig, DialogContent, type DialogContentProps, DialogDescription, DialogFooter, DialogHeader, type DialogHeight, DialogOverlay, type DialogPadding, DialogPortal, type DialogRenderContext, type DialogRenderer, type DialogSize, type DialogStore, DialogTitle, DialogTrigger, type DialogVariant, type DialogWidth, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicArray, type DynamicArrayProps, EmojiInput, type EmojiInputProps, type FileBrowserMode, FileImportButton, FileInput, type FileInputProps, type FileNode, Form, FormControl, FormDescription, FormField, FormInput, type FormInputBackground, type FormInputProps, FormItem, FormLabel, FormMessage, type FormProps, type FormSlotClassNames, type FormVariant, IconButton, type IconButtonProps, type IconButtonSize, type IconButtonVariant, ImageInput, type ImageInputProps, Indicator, type IndicatorHorizontal, type IndicatorOverlay, type IndicatorPosition, type IndicatorProps, type IndicatorResponsivePosition, type IndicatorSize, type IndicatorVertical, Input, type InputIcon, Label, LangInput, type LangInputProps, type LinkComponentType, MultiSelectInput, type MultiSelectInputProps, NAJM_COMPONENT_NAMES, NAlert, type NAppCommandItem, NAppShell, type NAppShellAction, type NAppShellClassNames, type NAppShellProps, type NAppShellUser, NCard as NAsyncCard, type CardClassNames as NAsyncCardClassNames, type CardProps as NAsyncCardProps, NAvatar, type NAvatarClassNames, type NAvatarProps, type AvatarShape as NAvatarShape, NBadge, type NBadgeLook, type NBadgeProps, type NBulkAction, type NBulkActionButton, type NBulkActionSelect, NBulkActionsBar, type NBulkActionsBarProps, NButton, type NButtonProps, NCard, NCardAction, type CardClassNames as NCardClassNames, NCardFooter, type CardProps as NCardProps, NCommandPalette, type NCommandPaletteProps, NConfirmDialog, type NConfirmDialogProps, NContextMenu, type NContextMenuItem, type NContextMenuProps, NDataCardShell, type NDataCardShellActions, type NDataCardShellProps, NDeleteDialog, NDeleteDialogContent, type NDeleteDialogContentProps, type NDeleteDialogProps, NDetailCard, type NDetailCardClassNames, type NDetailCardProps, NDetailItem, type NDetailItemProps, NDetailList, type NDetailListItem, type NDetailListProps, NDialog, type NDialogDirectProps, type NDialogProps, type NEditorTab, NEditorTabs, type NEditorTabsProps, NEmptyState, type NEmptyStateProps, NErrorBoundary, NErrorState, type NErrorStateProps, NFileBrowser, type NFileBrowserCardProps, type NFileBrowserProps, type NFileBrowserRenderThumbProps, NFileTypeIcon, type NFileTypeIconProps, NFilterBar, NFolderIcon, type NFolderIconProps, NForm, NFormSectionHeader, type NFormSectionHeaderProps, NIcon, type NIconProps, type NIconSource, NIndicator, NInspectorSheet, NLoadingState, type NLoadingStateProps, NMultiDialog, type NMultiDialogProps, NNavbar, NPageHeader, NPageHeaderActions, NPageHeaderFilters, type NPageHeaderProps, NPageHeaderTop, NPageLayout, type NPageLayoutProps, NPortalScopeProvider, NProgress, type NProgressProps, NRowActions, NSection, NSectionHeader, type NSectionHeaderActionsProps, type NSectionHeaderContentProps, type NSectionHeaderProps, type NSectionHeaderSubtitleProps, type NSectionHeaderTitleProps, NSectionInfo, type NSectionInfoProps, type NSectionProps, NSectionWithInfo, type NSectionWithInfoItem, type NSectionWithInfoProps, NSheet, type NSheetProps, NSidebar, NSidebarContent, type NSidebarContentProps, NSidebarFooter, type NSidebarFooterProps, NSidebarHeader, type NSidebarHeaderProps, NSidebarItem, NSidebarLogo, type NSidebarLogoProps, NSidebarMobile, type NSidebarMobileProps, NSidebarSection, type NSidebarSectionProps, NSkeleton, NSkeletonCalendar, NSkeletonChart, NSkeletonDonut, NSkeletonEventList, NSkeletonWidget, NSkeletonWidgets, NSlider, type NSliderProps, NSmartPasteDialog, type NSmartPasteDialogProps, NSpinner, type NSpinnerProps, NStatCard, type NStatCardClassNames, type NStatCardProps, NStatCardSkeleton, type NStatCardVariant, Swap as NSwap, type NSwapProps, NTable, NTableCardRoot, type NTableCardRootProps, NTableCards, type NTableClassNames, NTableContent, NTableHeader, NTableLoadingSkeleton, type NTableMenu, type NTableMenuProp, NTablePagination, type NTableProps, NTableRowSkeleton, NTableSkeleton, type NTableState, NTabs, type NTabsClassNames, type NTabsColor, type NTabsItem, type NTabsProps, type NTabsStyles, NUploader, type NUploaderItem, type NUploaderItemStatus, type NUploaderProps, NViewBody, NViewToggle, type NajmAccent, type NajmAppearance, type NajmBorderSide, type NajmComponentName, type NajmComponentRadius, type NajmComponentStyleConfig, type NajmComponentThemeConfig, type NajmDensity, type NajmDesignConfig, NajmDesignProvider, type NajmDesignProviderProps, type NajmLayoutConfig, type NajmMode, type NajmPreset, type NajmRadiusScale, NajmScroll, type NajmScrollProps, type NajmSlotStyle, type NajmThemeConfig, NajmThemeProvider, type NajmThemeProviderProps, type NajmThemeTokens, type NajmTypographyConfig, type NajmVariantStyle, NativeSelect, type NativeSelectOption, type NativeSelectProps, type NavItem, type NavItemGroup, NumberInput, type NumberInputProps, PasswordInput, type PasswordInputProps, PhoneInput, type PhoneInputProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PrefixProvider, Progress, type ProgressColor, type ProgressLabelPosition, type ProgressProps, type ProgressSize, type PushDialogOptions, RADIUS_VALUE_MAP, RadioGroup, RadioGroupInput, type RadioGroupInputProps, RadioGroupItem, type RenderSlot, RepeatingFields, type RepeatingFieldsProps, ScrollArea, type ScrollAreaProps, SearchField, SearchField as SearchInput, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, SelectContent, SelectGroup, SelectInput, type SelectInputProps, SelectItem, type SelectItemType$1 as SelectItemDataType, type SelectItemType, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, type SidebarItemProps, type SidebarProps, type SidebarWidths, SimpleTooltip, type SimpleTooltipProps, NSkeleton as Skeleton, Slider, SliderInput, type SliderInputProps, type SliderOrientation, type SliderProps, type SliderSize, type SliderVariant, type SmartPastePreview, type SpinnerVariant, StarRatingInput, type StarRatingInputProps, StatusPill, type StatusPillProps, type StatusPillTone, type StepConfig, StepIndicator, type StepMeta, StepsHeader, StepsProgress, type StorageMenuAction, type StorageSortOption, type StorageTarget, Swap, type SwapEffect, SwapIndeterminate, SwapOff, SwapOn, type SwapProps, type SwapSize, type SwapState, Switch, type SwitchColor, SwitchInput, type SwitchInputProps, type SwitchSize, TAB_COLORS, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableHeaderColor, TableRow, type TableState, type TableStore, TableStoreContext, Tabs, TabsContent, TabsList, type TabsListProps, type TabsOrientation, type TabsProps, TabsTrigger, type TabsTriggerProps, type TabsVariant, TextAreaInput, type TextAreaInputProps, TextInput, type TextInputProps, Textarea, TimeInput, type TimeInputProps, Toaster, Toggle, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UseContextMenuResult, type UseNFormOptions, type UseStorageContextMenuOptions, type UseStorageContextMenuResult, type UserMenuAction, VariantProvider, type WizardClassNames, WizardForm, type WizardFormProps, alertVariants, avatarVariants, badgeColorVariants, badgeVariants, buildDefaultFileColumns, buttonVariants, cn, composePreset, createDialogStore, createTableStore, defineNajmDesignConfig, defineNajmThemeConfig, detectFormat, dialogVariants, formatColor, formatFileBytes, formatFileRelative, getIconColorProps, getNextEditorTabValue, indicatorVariants, inputBorderClasses, parseColor, parseNajmDesignConfig, parseNajmThemeConfig, resolvePreset, resolveRadiusValue, resolveSlot, resolveVariantAlias, sidebarBorderClasses, sliderVariants, stringifyNajmDesignConfig, stringifyNajmThemeConfig, surfaceBorderClasses, swapVariants, toPickerHex, toggleVariants, tooltipContentVariants, truncateByCharacters, useClickOutside, useContextMenu, useDebouncedValue, useDelayedLoading, useDialog, useDialogStore, useDynamicPageSize, useFormField, useFormSubmission, useInfiniteScroll, useKeyboard, useLocalStorageState, useNForm, useNPortalScope, useNajmAppearance, useNajmComponentStyle, useNajmDesign, usePrefix, useSelection, useStepNavigation, useStorageContextMenu, useStoreSync, useTable, useTableKeyboard, useTableStore, useVariant, useVariantPreset };
|
package/dist/index.mjs
CHANGED
|
@@ -2337,23 +2337,35 @@ var windowHeaderSpacing = {
|
|
|
2337
2337
|
md: "-mx-6 -mt-6 px-3 py-2",
|
|
2338
2338
|
lg: "-mx-8 -mt-8 px-3 py-2"
|
|
2339
2339
|
};
|
|
2340
|
-
function DialogChrome({
|
|
2340
|
+
function DialogChrome({
|
|
2341
|
+
pageHeader,
|
|
2342
|
+
title,
|
|
2343
|
+
description,
|
|
2344
|
+
padding,
|
|
2345
|
+
variant = "default",
|
|
2346
|
+
headerClassName,
|
|
2347
|
+
titleClassName,
|
|
2348
|
+
descriptionClassName,
|
|
2349
|
+
closeButtonClassName,
|
|
2350
|
+
contentRef,
|
|
2351
|
+
children
|
|
2352
|
+
}) {
|
|
2341
2353
|
const noTitle = !title || title.trim() === "";
|
|
2342
2354
|
const noDescription = !description || description.trim() === "";
|
|
2343
2355
|
const noHeader = noTitle && noDescription;
|
|
2344
2356
|
const flush = padding === "none";
|
|
2345
2357
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
2346
2358
|
pageHeader ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
2347
|
-
/* @__PURE__ */ jsx(DialogTitle, { className: "sr-only", children: pageHeader.title || title || "Dialog" }),
|
|
2348
|
-
(pageHeader.subtitle || description) && /* @__PURE__ */ jsx(DialogDescription, { className: "sr-only", children: pageHeader.subtitle || description }),
|
|
2349
|
-
/* @__PURE__ */ jsx("div", { className: "shrink-0", children: /* @__PURE__ */ jsx(
|
|
2359
|
+
/* @__PURE__ */ jsx(DialogTitle, { className: cn("sr-only", titleClassName), children: pageHeader.title || title || "Dialog" }),
|
|
2360
|
+
(pageHeader.subtitle || description) && /* @__PURE__ */ jsx(DialogDescription, { className: cn("sr-only", descriptionClassName), children: pageHeader.subtitle || description }),
|
|
2361
|
+
/* @__PURE__ */ jsx("div", { className: cn("shrink-0", headerClassName), children: /* @__PURE__ */ jsx(
|
|
2350
2362
|
NPageHeader,
|
|
2351
2363
|
{
|
|
2352
2364
|
...pageHeader,
|
|
2353
2365
|
card: false,
|
|
2354
2366
|
actions: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
2355
2367
|
pageHeader.actions,
|
|
2356
|
-
/* @__PURE__ */ jsx(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx(IconButton, { "aria-label": "Close", variant: "ghost", children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) }) })
|
|
2368
|
+
/* @__PURE__ */ jsx(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx(IconButton, { "aria-label": "Close", variant: "ghost", className: closeButtonClassName, children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) }) })
|
|
2357
2369
|
] })
|
|
2358
2370
|
}
|
|
2359
2371
|
) })
|
|
@@ -2362,12 +2374,13 @@ function DialogChrome({ pageHeader, title, description, padding, variant = "defa
|
|
|
2362
2374
|
{
|
|
2363
2375
|
className: cn(
|
|
2364
2376
|
"flex-row items-center justify-between gap-3 border-b border-border bg-secondary text-left text-secondary-foreground",
|
|
2365
|
-
windowHeaderSpacing[padding ?? "md"]
|
|
2377
|
+
windowHeaderSpacing[padding ?? "md"],
|
|
2378
|
+
headerClassName
|
|
2366
2379
|
),
|
|
2367
2380
|
children: [
|
|
2368
2381
|
/* @__PURE__ */ jsxs("div", { className: "min-w-0 space-y-1", children: [
|
|
2369
|
-
/* @__PURE__ */ jsx(DialogTitle, { className: cn("truncate text-sm", noTitle && "sr-only"), children: title || "Dialog" }),
|
|
2370
|
-
/* @__PURE__ */ jsx(DialogDescription, { className: cn("text-xs", noDescription && "sr-only"), children: description })
|
|
2382
|
+
/* @__PURE__ */ jsx(DialogTitle, { className: cn("truncate text-sm", noTitle && "sr-only", titleClassName), children: title || "Dialog" }),
|
|
2383
|
+
/* @__PURE__ */ jsx(DialogDescription, { className: cn("text-xs", noDescription && "sr-only", descriptionClassName), children: description })
|
|
2371
2384
|
] }),
|
|
2372
2385
|
/* @__PURE__ */ jsx(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx(
|
|
2373
2386
|
IconButton,
|
|
@@ -2375,15 +2388,15 @@ function DialogChrome({ pageHeader, title, description, padding, variant = "defa
|
|
|
2375
2388
|
"aria-label": "Close",
|
|
2376
2389
|
variant: "ghost",
|
|
2377
2390
|
size: "sm",
|
|
2378
|
-
className: "border border-border bg-background text-foreground hover:bg-accent",
|
|
2391
|
+
className: cn("border border-border bg-background text-foreground hover:bg-accent", closeButtonClassName),
|
|
2379
2392
|
children: /* @__PURE__ */ jsx(X, { className: "h-3.5 w-3.5" })
|
|
2380
2393
|
}
|
|
2381
2394
|
) })
|
|
2382
2395
|
]
|
|
2383
2396
|
}
|
|
2384
|
-
) : /* @__PURE__ */ jsxs(DialogHeader, { className: cn(noHeader && "sr-only"), children: [
|
|
2385
|
-
/* @__PURE__ */ jsx(DialogTitle, { className: cn(noTitle && "sr-only"), children: title }),
|
|
2386
|
-
/* @__PURE__ */ jsx(DialogDescription, { className: cn(noDescription && "sr-only"), children: description })
|
|
2397
|
+
) : /* @__PURE__ */ jsxs(DialogHeader, { className: cn(noHeader && "sr-only", headerClassName), children: [
|
|
2398
|
+
/* @__PURE__ */ jsx(DialogTitle, { className: cn(noTitle && "sr-only", titleClassName), children: title }),
|
|
2399
|
+
/* @__PURE__ */ jsx(DialogDescription, { className: cn(noDescription && "sr-only", descriptionClassName), children: description })
|
|
2387
2400
|
] }),
|
|
2388
2401
|
flush ? (
|
|
2389
2402
|
// Full-bleed content owns its own layout/scrolling; no outer scroll wrapper.
|
|
@@ -2417,6 +2430,10 @@ function DialogItem({ dialog, index, store }) {
|
|
|
2417
2430
|
width,
|
|
2418
2431
|
height,
|
|
2419
2432
|
className,
|
|
2433
|
+
headerClassName,
|
|
2434
|
+
titleClassName,
|
|
2435
|
+
descriptionClassName,
|
|
2436
|
+
closeButtonClassName,
|
|
2420
2437
|
variant = "default",
|
|
2421
2438
|
actionMode = "auto"
|
|
2422
2439
|
} = dialog;
|
|
@@ -2450,6 +2467,10 @@ function DialogItem({ dialog, index, store }) {
|
|
|
2450
2467
|
description,
|
|
2451
2468
|
padding,
|
|
2452
2469
|
variant,
|
|
2470
|
+
headerClassName,
|
|
2471
|
+
titleClassName,
|
|
2472
|
+
descriptionClassName,
|
|
2473
|
+
closeButtonClassName,
|
|
2453
2474
|
contentRef: setContentElement,
|
|
2454
2475
|
children
|
|
2455
2476
|
}
|
|
@@ -2502,7 +2523,7 @@ var buildButtonConfig2 = (partial, defaults) => {
|
|
|
2502
2523
|
return { ...defaults, ...partial };
|
|
2503
2524
|
};
|
|
2504
2525
|
var isDirectDialogProps = (props) => {
|
|
2505
|
-
return "trigger" in props || "open" in props || "defaultOpen" in props || "onOpenChange" in props || "title" in props || "description" in props || "children" in props || "primaryButton" in props || "secondaryButton" in props || "showButtons" in props || "size" in props || "width" in props || "height" in props || "className" in props || "variant" in props || "pageHeader" in props || "padding" in props;
|
|
2526
|
+
return "trigger" in props || "open" in props || "defaultOpen" in props || "onOpenChange" in props || "title" in props || "description" in props || "children" in props || "primaryButton" in props || "secondaryButton" in props || "showButtons" in props || "size" in props || "width" in props || "height" in props || "className" in props || "headerClassName" in props || "titleClassName" in props || "descriptionClassName" in props || "closeButtonClassName" in props || "variant" in props || "pageHeader" in props || "padding" in props;
|
|
2506
2527
|
};
|
|
2507
2528
|
function NDirectDialog({
|
|
2508
2529
|
trigger,
|
|
@@ -2521,6 +2542,10 @@ function NDirectDialog({
|
|
|
2521
2542
|
width,
|
|
2522
2543
|
height,
|
|
2523
2544
|
className,
|
|
2545
|
+
headerClassName,
|
|
2546
|
+
titleClassName,
|
|
2547
|
+
descriptionClassName,
|
|
2548
|
+
closeButtonClassName,
|
|
2524
2549
|
variant = "default",
|
|
2525
2550
|
actionMode = "auto",
|
|
2526
2551
|
closeOnPrimary = true,
|
|
@@ -2596,6 +2621,10 @@ function NDirectDialog({
|
|
|
2596
2621
|
description,
|
|
2597
2622
|
padding,
|
|
2598
2623
|
variant,
|
|
2624
|
+
headerClassName,
|
|
2625
|
+
titleClassName,
|
|
2626
|
+
descriptionClassName,
|
|
2627
|
+
closeButtonClassName,
|
|
2599
2628
|
contentRef: setContentElement,
|
|
2600
2629
|
children
|
|
2601
2630
|
}
|
|
@@ -6126,7 +6155,7 @@ function renderItems(items) {
|
|
|
6126
6155
|
return /* @__PURE__ */ jsx(SelectItem, { value, children: label }, value);
|
|
6127
6156
|
});
|
|
6128
6157
|
}
|
|
6129
|
-
var SelectInput = ({ placeholder = "", value, onChange, icon, showIcon = true, iconColor, items, className = "", variant = "default", status = "default", bordered, borderColor, disabled = false }) => {
|
|
6158
|
+
var SelectInput = ({ placeholder = "", value, onChange, icon, showIcon = true, iconColor, items, className = "", dropdownClassName, variant = "default", status = "default", bordered, borderColor, disabled = false }) => {
|
|
6130
6159
|
const shouldDisplayIcon = Boolean(icon) && showIcon && !value;
|
|
6131
6160
|
const iconProps = getIconColorProps(iconColor, "h-4 w-4");
|
|
6132
6161
|
const displayLabel = value ? (() => {
|
|
@@ -6148,7 +6177,7 @@ var SelectInput = ({ placeholder = "", value, onChange, icon, showIcon = true, i
|
|
|
6148
6177
|
"aria-label": placeholder || "Select"
|
|
6149
6178
|
}
|
|
6150
6179
|
),
|
|
6151
|
-
/* @__PURE__ */ jsx(SelectContent, { children: renderItems(items) })
|
|
6180
|
+
/* @__PURE__ */ jsx(SelectContent, { className: dropdownClassName, children: renderItems(items) })
|
|
6152
6181
|
] }, String(value))
|
|
6153
6182
|
] });
|
|
6154
6183
|
};
|
|
@@ -7675,6 +7704,13 @@ function NFormSectionHeader({
|
|
|
7675
7704
|
var PrefixContext = createContext(void 0);
|
|
7676
7705
|
var PrefixProvider = ({ prefix, children }) => /* @__PURE__ */ jsx(PrefixContext.Provider, { value: prefix, children });
|
|
7677
7706
|
var usePrefix = () => useContext(PrefixContext);
|
|
7707
|
+
var inputBackgroundClasses = {
|
|
7708
|
+
card: "!bg-card [&>div:first-child]:!bg-card",
|
|
7709
|
+
background: "!bg-background [&>div:first-child]:!bg-background",
|
|
7710
|
+
secondary: "!bg-secondary [&>div:first-child]:!bg-secondary",
|
|
7711
|
+
muted: "!bg-muted [&>div:first-child]:!bg-muted",
|
|
7712
|
+
transparent: "!bg-transparent [&>div:first-child]:!bg-transparent"
|
|
7713
|
+
};
|
|
7678
7714
|
var Inputs = {
|
|
7679
7715
|
switch: SwitchInput,
|
|
7680
7716
|
checkbox: CheckboxInput,
|
|
@@ -7698,7 +7734,7 @@ var Inputs = {
|
|
|
7698
7734
|
time: TimeInput,
|
|
7699
7735
|
slider: SliderInput
|
|
7700
7736
|
};
|
|
7701
|
-
var FormInput = ({ name, type, formLabel, formDescription, required = false, disabled = false, readOnly = false, hidden = false, icon, iconColor, classNames, ...rest }) => {
|
|
7737
|
+
var FormInput = ({ name, type, formLabel, formDescription, required = false, disabled = false, readOnly = false, hidden = false, icon, iconColor, classNames, background, ...rest }) => {
|
|
7702
7738
|
const InputComponent = Inputs[type];
|
|
7703
7739
|
const { control } = useFormContext();
|
|
7704
7740
|
const { className, onChange: consumerOnChange, ...inputRest } = rest;
|
|
@@ -7718,7 +7754,7 @@ var FormInput = ({ name, type, formLabel, formDescription, required = false, dis
|
|
|
7718
7754
|
const slot = {
|
|
7719
7755
|
item: cn(preset.item, classNames?.item),
|
|
7720
7756
|
label: cn(preset.label, classNames?.label),
|
|
7721
|
-
input: cn(presetInput, classNames?.input, className),
|
|
7757
|
+
input: cn(presetInput, background && inputBackgroundClasses[background], classNames?.input, className),
|
|
7722
7758
|
description: cn(preset.description, classNames?.description),
|
|
7723
7759
|
error: cn(preset.error, classNames?.error)
|
|
7724
7760
|
};
|