@pixpilot/shadcn-ui 0.50.0 → 0.52.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -15,7 +15,7 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
15
15
  const DEFAULT_DELAY = 0;
16
16
  const FADE_DURATION = 300;
17
17
  const LoadingOverlay = (props) => {
18
- const { backdrop = true, placement = "center", loading, delay = DEFAULT_DELAY, message } = props;
18
+ const { backdrop = true, placement = "center", loading, delay = DEFAULT_DELAY, message, scope = "container ", size = "default", className, spinnerClassName, messageClassName } = props;
19
19
  const [mounted, setMounted] = (0, react.useState)(false);
20
20
  const [visible, setVisible] = (0, react.useState)(false);
21
21
  (0, react.useEffect)(() => {
@@ -47,19 +47,43 @@ const LoadingOverlay = (props) => {
47
47
  center: "items-center",
48
48
  bottom: "items-end pb-[50px]"
49
49
  }[placement];
50
+ const sizeClass = {
51
+ sm: "h-6 w-6",
52
+ default: "h-10 w-10",
53
+ lg: "h-16 w-16"
54
+ }[size];
55
+ const messageSizeClass = {
56
+ sm: "text-xs",
57
+ default: "text-sm",
58
+ lg: "text-base"
59
+ }[size];
50
60
  if (!mounted) return null;
51
61
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
52
- className: (0, __pixpilot_shadcn.cn)("fixed inset-0 z-[9999] flex justify-center transition-opacity", positionClass, backdrop ? "bg-black/50" : "pointer-events-none", visible ? "opacity-100" : "opacity-0"),
62
+ className: (0, __pixpilot_shadcn.cn)("inset-0 z-[9999] flex justify-center transition-opacity", scope === "fullscreen" ? "fixed" : "absolute", positionClass, backdrop ? "bg-black/50" : "pointer-events-none", visible ? "opacity-100" : "opacity-0", className),
53
63
  style: { transitionDuration: `${FADE_DURATION}ms` },
64
+ role: "status",
65
+ "aria-live": "polite",
66
+ "aria-busy": loading,
54
67
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
55
- className: "flex flex-col items-center",
56
- children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Loader2, { className: "text-foreground h-10 w-10 animate-spin" }), message != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
57
- className: "mt-2 text-foreground",
58
- children: message
59
- })]
68
+ className: "flex flex-col items-center gap-2",
69
+ children: [
70
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Loader2, {
71
+ className: (0, __pixpilot_shadcn.cn)("text-foreground animate-spin", sizeClass, spinnerClassName),
72
+ "aria-hidden": "true"
73
+ }),
74
+ message != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
75
+ className: (0, __pixpilot_shadcn.cn)("text-foreground font-medium", messageSizeClass, messageClassName),
76
+ children: message
77
+ }),
78
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
79
+ className: "sr-only",
80
+ children: message || "Loading, please wait..."
81
+ })
82
+ ]
60
83
  })
61
84
  });
62
85
  };
86
+ LoadingOverlay.displayName = "LoadingOverlay";
63
87
 
64
88
  //#endregion
65
89
  exports.LoadingOverlay = LoadingOverlay;
@@ -1,13 +1,55 @@
1
1
  import React from "react";
2
2
 
3
3
  //#region src/LoadingOverlay.d.ts
4
- interface LoaderProps {
4
+ interface LoadingOverlayProps {
5
+ /**
6
+ * Show semi-transparent backdrop
7
+ * @default true
8
+ */
5
9
  backdrop?: boolean;
10
+ /**
11
+ * Vertical alignment of the loader
12
+ * @default 'center'
13
+ */
6
14
  placement?: 'top' | 'bottom' | 'center';
15
+ /**
16
+ * Whether to show the loader
17
+ */
7
18
  loading: boolean;
19
+ /**
20
+ * Optional loading message to display below spinner
21
+ */
8
22
  message?: string;
23
+ /**
24
+ * Delay in milliseconds before showing the loader
25
+ * @default 0
26
+ */
9
27
  delay?: number;
28
+ /**
29
+ * Scope of the loader overlay
30
+ * - 'container': Fills parent container (requires parent with position: relative)
31
+ * - 'fullscreen': Covers entire viewport
32
+ * @default 'container'
33
+ */
34
+ scope?: 'container' | 'fullscreen';
35
+ /**
36
+ * Size of the spinner
37
+ * @default 'default'
38
+ */
39
+ size?: 'sm' | 'default' | 'lg';
40
+ /**
41
+ * Custom class name for the overlay wrapper
42
+ */
43
+ className?: string;
44
+ /**
45
+ * Custom class name for the spinner
46
+ */
47
+ spinnerClassName?: string;
48
+ /**
49
+ * Custom class name for the message
50
+ */
51
+ messageClassName?: string;
10
52
  }
11
- declare const LoadingOverlay: React.FC<LoaderProps>;
53
+ declare const LoadingOverlay: React.FC<LoadingOverlayProps>;
12
54
  //#endregion
13
- export { LoaderProps, LoadingOverlay };
55
+ export { LoadingOverlay, LoadingOverlayProps };
@@ -1,13 +1,55 @@
1
1
  import React from "react";
2
2
 
3
3
  //#region src/LoadingOverlay.d.ts
4
- interface LoaderProps {
4
+ interface LoadingOverlayProps {
5
+ /**
6
+ * Show semi-transparent backdrop
7
+ * @default true
8
+ */
5
9
  backdrop?: boolean;
10
+ /**
11
+ * Vertical alignment of the loader
12
+ * @default 'center'
13
+ */
6
14
  placement?: 'top' | 'bottom' | 'center';
15
+ /**
16
+ * Whether to show the loader
17
+ */
7
18
  loading: boolean;
19
+ /**
20
+ * Optional loading message to display below spinner
21
+ */
8
22
  message?: string;
23
+ /**
24
+ * Delay in milliseconds before showing the loader
25
+ * @default 0
26
+ */
9
27
  delay?: number;
28
+ /**
29
+ * Scope of the loader overlay
30
+ * - 'container': Fills parent container (requires parent with position: relative)
31
+ * - 'fullscreen': Covers entire viewport
32
+ * @default 'container'
33
+ */
34
+ scope?: 'container' | 'fullscreen';
35
+ /**
36
+ * Size of the spinner
37
+ * @default 'default'
38
+ */
39
+ size?: 'sm' | 'default' | 'lg';
40
+ /**
41
+ * Custom class name for the overlay wrapper
42
+ */
43
+ className?: string;
44
+ /**
45
+ * Custom class name for the spinner
46
+ */
47
+ spinnerClassName?: string;
48
+ /**
49
+ * Custom class name for the message
50
+ */
51
+ messageClassName?: string;
10
52
  }
11
- declare const LoadingOverlay: React.FC<LoaderProps>;
53
+ declare const LoadingOverlay: React.FC<LoadingOverlayProps>;
12
54
  //#endregion
13
- export { LoaderProps, LoadingOverlay };
55
+ export { LoadingOverlay, LoadingOverlayProps };
@@ -10,7 +10,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
10
10
  const DEFAULT_DELAY = 0;
11
11
  const FADE_DURATION = 300;
12
12
  const LoadingOverlay = (props) => {
13
- const { backdrop = true, placement = "center", loading, delay = DEFAULT_DELAY, message } = props;
13
+ const { backdrop = true, placement = "center", loading, delay = DEFAULT_DELAY, message, scope = "container ", size = "default", className, spinnerClassName, messageClassName } = props;
14
14
  const [mounted, setMounted] = useState(false);
15
15
  const [visible, setVisible] = useState(false);
16
16
  useEffect(() => {
@@ -42,19 +42,43 @@ const LoadingOverlay = (props) => {
42
42
  center: "items-center",
43
43
  bottom: "items-end pb-[50px]"
44
44
  }[placement];
45
+ const sizeClass = {
46
+ sm: "h-6 w-6",
47
+ default: "h-10 w-10",
48
+ lg: "h-16 w-16"
49
+ }[size];
50
+ const messageSizeClass = {
51
+ sm: "text-xs",
52
+ default: "text-sm",
53
+ lg: "text-base"
54
+ }[size];
45
55
  if (!mounted) return null;
46
56
  return /* @__PURE__ */ jsx("div", {
47
- className: cn("fixed inset-0 z-[9999] flex justify-center transition-opacity", positionClass, backdrop ? "bg-black/50" : "pointer-events-none", visible ? "opacity-100" : "opacity-0"),
57
+ className: cn("inset-0 z-[9999] flex justify-center transition-opacity", scope === "fullscreen" ? "fixed" : "absolute", positionClass, backdrop ? "bg-black/50" : "pointer-events-none", visible ? "opacity-100" : "opacity-0", className),
48
58
  style: { transitionDuration: `${FADE_DURATION}ms` },
59
+ role: "status",
60
+ "aria-live": "polite",
61
+ "aria-busy": loading,
49
62
  children: /* @__PURE__ */ jsxs("div", {
50
- className: "flex flex-col items-center",
51
- children: [/* @__PURE__ */ jsx(Loader2, { className: "text-foreground h-10 w-10 animate-spin" }), message != null && /* @__PURE__ */ jsx("div", {
52
- className: "mt-2 text-foreground",
53
- children: message
54
- })]
63
+ className: "flex flex-col items-center gap-2",
64
+ children: [
65
+ /* @__PURE__ */ jsx(Loader2, {
66
+ className: cn("text-foreground animate-spin", sizeClass, spinnerClassName),
67
+ "aria-hidden": "true"
68
+ }),
69
+ message != null && /* @__PURE__ */ jsx("div", {
70
+ className: cn("text-foreground font-medium", messageSizeClass, messageClassName),
71
+ children: message
72
+ }),
73
+ /* @__PURE__ */ jsx("span", {
74
+ className: "sr-only",
75
+ children: message || "Loading, please wait..."
76
+ })
77
+ ]
55
78
  })
56
79
  });
57
80
  };
81
+ LoadingOverlay.displayName = "LoadingOverlay";
58
82
 
59
83
  //#endregion
60
84
  export { LoadingOverlay };
@@ -1,7 +1,7 @@
1
1
  import { FileUploadProps } from "./types/index.cjs";
2
- import * as react_jsx_runtime12 from "react/jsx-runtime";
2
+ import * as react_jsx_runtime18 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/file-upload/FileUpload.d.ts
5
- declare function FileUpload(props: FileUploadProps): react_jsx_runtime12.JSX.Element;
5
+ declare function FileUpload(props: FileUploadProps): react_jsx_runtime18.JSX.Element;
6
6
  //#endregion
7
7
  export { FileUpload };
@@ -1,10 +1,10 @@
1
1
  import { FileUploadInlineProps } from "./types.cjs";
2
- import * as react_jsx_runtime11 from "react/jsx-runtime";
2
+ import * as react_jsx_runtime10 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/file-upload-inline/FileUploadInline.d.ts
5
5
  /**
6
6
  * FileUploadInline - An inline file upload component using FileUpload primitives
7
7
  */
8
- declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime11.JSX.Element;
8
+ declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime10.JSX.Element;
9
9
  //#endregion
10
10
  export { FileUploadInline };
package/dist/index.cjs CHANGED
@@ -157,10 +157,6 @@ exports.isSvgMarkupString = require_svg.isSvgMarkupString;
157
157
  exports.showConfirmDialog = require_confirmation_dialogs.showConfirmDialog;
158
158
  exports.svgMarkupToMaskUrl = require_svg.svgMarkupToMaskUrl;
159
159
  exports.toast = require_toast.toast;
160
- exports.toastError = require_toast.toastError;
161
- exports.toastInfo = require_toast.toastInfo;
162
- exports.toastSuccess = require_toast.toastSuccess;
163
- exports.toastWarning = require_toast.toastWarning;
164
160
  exports.useMediaQuery = require_use_media_query.useMediaQuery;
165
161
  exports.useSelectKeyboard = require_use_select_keyboard.useSelectKeyboard;
166
162
  exports.useTabsContext = require_TabsContext.useTabsContext;
package/dist/index.d.cts CHANGED
@@ -41,7 +41,7 @@ import { LayoutFooter, LayoutFooterProps } from "./layout/LayoutFooter.cjs";
41
41
  import { LayoutHeader, LayoutHeaderProps } from "./layout/LayoutHeader.cjs";
42
42
  import { LayoutMain, LayoutMainProps } from "./layout/LayoutMain.cjs";
43
43
  import "./layout/index.cjs";
44
- import { LoaderProps, LoadingOverlay } from "./LoadingOverlay.cjs";
44
+ import { LoadingOverlay, LoadingOverlayProps } from "./LoadingOverlay.cjs";
45
45
  import { Pagination, PaginationProps } from "./pagination/Pagination.cjs";
46
46
  import "./pagination/index.cjs";
47
47
  import { Popover, PopoverAnchor, PopoverContent, PopoverContentProps, PopoverTrigger } from "./popover/Popover.cjs";
@@ -73,10 +73,10 @@ import { ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps } from "./theme-tog
73
73
  import { ThemeModeToggleButton, ThemeModeToggleButtonProps } from "./theme-toggle/ThemeModeToggleButton.cjs";
74
74
  import "./theme-toggle/index.cjs";
75
75
  import { AlertToastProps } from "./toast/types.cjs";
76
- import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast/toast.cjs";
76
+ import { DEFAULT_ALERT_DURATION, ToastFunction, ToastMessage, toast } from "./toast/toast.cjs";
77
77
  import { Toaster } from "./toast/ToastProvider.cjs";
78
78
  import "./toast/index.cjs";
79
79
  import { ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue } from "./ToggleGroup.cjs";
80
80
  import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.cjs";
81
81
  import { cn } from "@pixpilot/shadcn";
82
- export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
82
+ export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
package/dist/index.d.ts CHANGED
@@ -43,7 +43,7 @@ import { LayoutFooter, LayoutFooterProps } from "./layout/LayoutFooter.js";
43
43
  import { LayoutHeader, LayoutHeaderProps } from "./layout/LayoutHeader.js";
44
44
  import { LayoutMain, LayoutMainProps } from "./layout/LayoutMain.js";
45
45
  import "./layout/index.js";
46
- import { LoaderProps, LoadingOverlay } from "./LoadingOverlay.js";
46
+ import { LoadingOverlay, LoadingOverlayProps } from "./LoadingOverlay.js";
47
47
  import { Pagination, PaginationProps } from "./pagination/Pagination.js";
48
48
  import "./pagination/index.js";
49
49
  import { Popover, PopoverAnchor, PopoverContent, PopoverContentProps, PopoverTrigger } from "./popover/Popover.js";
@@ -75,10 +75,10 @@ import { ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps } from "./theme-tog
75
75
  import { ThemeModeToggleButton, ThemeModeToggleButtonProps } from "./theme-toggle/ThemeModeToggleButton.js";
76
76
  import "./theme-toggle/index.js";
77
77
  import { AlertToastProps } from "./toast/types.js";
78
- import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast/toast.js";
78
+ import { DEFAULT_ALERT_DURATION, ToastFunction, ToastMessage, toast } from "./toast/toast.js";
79
79
  import { Toaster } from "./toast/ToastProvider.js";
80
80
  import "./toast/index.js";
81
81
  import { ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue } from "./ToggleGroup.js";
82
82
  import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.js";
83
83
  import { cn } from "@pixpilot/shadcn";
84
- export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
84
+ export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
package/dist/index.js CHANGED
@@ -69,10 +69,10 @@ import { ThemeModeSwitchInside } from "./theme-toggle/ThemeModeSwitchInside.js";
69
69
  import { ThemeModeSwitchOutside } from "./theme-toggle/ThemeModeSwitchOutside.js";
70
70
  import { ThemeModeToggleButton } from "./theme-toggle/ThemeModeToggleButton.js";
71
71
  import "./theme-toggle/index.js";
72
- import { DEFAULT_ALERT_DURATION, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast/toast.js";
72
+ import { DEFAULT_ALERT_DURATION, toast } from "./toast/toast.js";
73
73
  import { Toaster } from "./toast/ToastProvider.js";
74
74
  import "./toast/index.js";
75
75
  import { ToggleGroup, ToggleGroupItem } from "./ToggleGroup.js";
76
76
  import { cn } from "@pixpilot/shadcn";
77
77
 
78
- export { AbsoluteFill, Alert, AvatarUpload, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogTitle, DialogTrigger, FileUpload, FileUploadInline, IconPicker, IconToggle, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Rating, RatingButton, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, TagsInputInline, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, Toaster, ToggleGroup, ToggleGroupItem, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
78
+ export { AbsoluteFill, Alert, AvatarUpload, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogTitle, DialogTrigger, FileUpload, FileUploadInline, IconPicker, IconToggle, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Rating, RatingButton, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, TagsInputInline, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, Toaster, ToggleGroup, ToggleGroupItem, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
@@ -1,4 +1,4 @@
1
- import * as react_jsx_runtime10 from "react/jsx-runtime";
1
+ import * as react_jsx_runtime11 from "react/jsx-runtime";
2
2
  import { InputProps } from "@pixpilot/shadcn";
3
3
  import * as React$1 from "react";
4
4
 
@@ -10,6 +10,6 @@ type InputProps$1 = InputProps & {
10
10
  prefixClassName?: string;
11
11
  suffixClassName?: string;
12
12
  };
13
- declare function Input(props: InputProps$1): react_jsx_runtime10.JSX.Element;
13
+ declare function Input(props: InputProps$1): react_jsx_runtime11.JSX.Element;
14
14
  //#endregion
15
15
  export { Input, InputProps$1 as InputProps };
@@ -1,5 +1,5 @@
1
1
  import { CommandOptionListItem } from "../CommandOptionList.js";
2
- import * as react_jsx_runtime13 from "react/jsx-runtime";
2
+ import * as react_jsx_runtime14 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/tags-input/TagsInput.d.ts
5
5
  interface TagsInputProps {
@@ -57,6 +57,6 @@ declare function TagsInput({
57
57
  addOnTab,
58
58
  onValidate,
59
59
  addButtonVisibility
60
- }: TagsInputProps): react_jsx_runtime13.JSX.Element;
60
+ }: TagsInputProps): react_jsx_runtime14.JSX.Element;
61
61
  //#endregion
62
62
  export { TagsInput, TagsInputProps };
@@ -1,4 +1,4 @@
1
- import * as react_jsx_runtime14 from "react/jsx-runtime";
1
+ import * as react_jsx_runtime12 from "react/jsx-runtime";
2
2
  import { ChangeEventHandler, FocusEventHandler, KeyboardEventHandler, MouseEventHandler, Ref } from "react";
3
3
 
4
4
  //#region src/tags-input/TagsInputInline.d.ts
@@ -75,6 +75,6 @@ declare function TagsInputInline({
75
75
  canAddCurrentValue,
76
76
  onAddCurrentInput,
77
77
  showClear
78
- }: TagsInputInlineProps): react_jsx_runtime14.JSX.Element;
78
+ }: TagsInputInlineProps): react_jsx_runtime12.JSX.Element;
79
79
  //#endregion
80
80
  export { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps };
@@ -1,5 +1,5 @@
1
1
  import { ChangeEventHandler, FocusEventHandler, KeyboardEventHandler, MouseEventHandler, Ref } from "react";
2
- import * as react_jsx_runtime14 from "react/jsx-runtime";
2
+ import * as react_jsx_runtime13 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/tags-input/TagsInputInline.d.ts
5
5
  interface TagsInputInlineItem {
@@ -75,6 +75,6 @@ declare function TagsInputInline({
75
75
  canAddCurrentValue,
76
76
  onAddCurrentInput,
77
77
  showClear
78
- }: TagsInputInlineProps): react_jsx_runtime14.JSX.Element;
78
+ }: TagsInputInlineProps): react_jsx_runtime13.JSX.Element;
79
79
  //#endregion
80
80
  export { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps };
@@ -1,4 +1,4 @@
1
- import * as react_jsx_runtime16 from "react/jsx-runtime";
1
+ import * as react_jsx_runtime15 from "react/jsx-runtime";
2
2
 
3
3
  //#region src/theme-toggle/ThemeModeDropdown.d.ts
4
4
  interface ThemeModeDropdownProps {
@@ -17,7 +17,7 @@ interface ThemeModeDropdownProps {
17
17
  * Provides Light / Dark / System options.
18
18
  * Pure component - requires themeValue and onChange props.
19
19
  */
20
- declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime16.JSX.Element;
20
+ declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime15.JSX.Element;
21
21
  declare namespace ThemeModeDropdown {
22
22
  var displayName: string;
23
23
  }
@@ -1,4 +1,4 @@
1
- import * as react_jsx_runtime15 from "react/jsx-runtime";
1
+ import * as react_jsx_runtime16 from "react/jsx-runtime";
2
2
 
3
3
  //#region src/theme-toggle/ThemeModeSwitchInside.d.ts
4
4
  type ThemeModeSwitchInsideSize = 'sm' | 'md' | 'lg';
@@ -25,7 +25,7 @@ interface ThemeModeSwitchInsideProps {
25
25
  * Icons are embedded within the switch control.
26
26
  * Pure component - requires value and onChange props.
27
27
  */
28
- declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime15.JSX.Element;
28
+ declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime16.JSX.Element;
29
29
  declare namespace ThemeModeSwitchInside {
30
30
  var displayName: string;
31
31
  }
@@ -1,4 +1,4 @@
1
- import * as react_jsx_runtime18 from "react/jsx-runtime";
1
+ import * as react_jsx_runtime14 from "react/jsx-runtime";
2
2
 
3
3
  //#region src/theme-toggle/ThemeModeToggleButton.d.ts
4
4
  interface ThemeModeToggleButtonProps {
@@ -13,7 +13,7 @@ interface ThemeModeToggleButtonProps {
13
13
  * Light/Dark toggle button.
14
14
  * Pure component - toggles between light and dark.
15
15
  */
16
- declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime18.JSX.Element;
16
+ declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime14.JSX.Element;
17
17
  declare namespace ThemeModeToggleButton {
18
18
  var displayName: string;
19
19
  }
@@ -1,3 +1,3 @@
1
1
  import { AlertToastProps } from "./types.cjs";
2
- import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast.cjs";
2
+ import { DEFAULT_ALERT_DURATION, ToastFunction, ToastMessage, toast } from "./toast.cjs";
3
3
  import { Toaster } from "./ToastProvider.cjs";
@@ -1,3 +1,3 @@
1
1
  import { AlertToastProps } from "./types.js";
2
- import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast.js";
2
+ import { DEFAULT_ALERT_DURATION, ToastFunction, ToastMessage, toast } from "./toast.js";
3
3
  import { Toaster } from "./ToastProvider.js";
@@ -1,2 +1,2 @@
1
- import { DEFAULT_ALERT_DURATION, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast.js";
1
+ import { DEFAULT_ALERT_DURATION, toast } from "./toast.js";
2
2
  import { Toaster } from "./ToastProvider.js";
@@ -10,7 +10,7 @@ sonner = require_rolldown_runtime.__toESM(sonner);
10
10
  //#region src/toast/toast.tsx
11
11
  const DEFAULT_ALERT_DURATION = 1e4;
12
12
  const toastInstances = /* @__PURE__ */ new Map();
13
- function toast(props) {
13
+ const toast = function(props) {
14
14
  const { duration,...rest } = props;
15
15
  const baseId = `toast_${(0, __pixpilot_hash.simpleHash)(`${props.title ?? ""}::${props.description ?? ""}`)}`;
16
16
  const instance = toastInstances.get(baseId);
@@ -40,7 +40,7 @@ function toast(props) {
40
40
  cleanUp(t.id);
41
41
  }
42
42
  });
43
- }
43
+ };
44
44
  function createToast(variant, message, duration) {
45
45
  if (typeof message === "string") toast({
46
46
  variant,
@@ -53,23 +53,11 @@ function createToast(variant, message, duration) {
53
53
  duration
54
54
  });
55
55
  }
56
- function toastInfo(message, duration) {
57
- createToast("info", message, duration);
58
- }
59
- function toastSuccess(message, duration) {
60
- createToast("success", message, duration);
61
- }
62
- function toastWarning(message, duration) {
63
- createToast("warning", message, duration);
64
- }
65
- function toastError(message, duration) {
66
- createToast("error", message, duration);
67
- }
56
+ toast.error = (message, duration) => createToast("error", message, duration);
57
+ toast.success = (message, duration) => createToast("success", message, duration);
58
+ toast.warning = (message, duration) => createToast("warning", message, duration);
59
+ toast.info = (message, duration) => createToast("info", message, duration);
68
60
 
69
61
  //#endregion
70
62
  exports.DEFAULT_ALERT_DURATION = DEFAULT_ALERT_DURATION;
71
- exports.toast = toast;
72
- exports.toastError = toastError;
73
- exports.toastInfo = toastInfo;
74
- exports.toastSuccess = toastSuccess;
75
- exports.toastWarning = toastWarning;
63
+ exports.toast = toast;
@@ -8,14 +8,17 @@ interface ToastProps extends AlertBaseProps {
8
8
  duration?: number;
9
9
  description?: string;
10
10
  }
11
- declare function toast(props: ToastProps): void;
12
11
  type ToastMessage = string | ({
13
12
  title: string;
14
13
  description: string;
15
14
  } & AlertToastProps);
16
- declare function toastInfo(message: ToastMessage, duration?: number): void;
17
- declare function toastSuccess(message: ToastMessage, duration?: number): void;
18
- declare function toastWarning(message: ToastMessage, duration?: number): void;
19
- declare function toastError(message: ToastMessage, duration?: number): void;
15
+ interface ToastFunction {
16
+ (props: ToastProps): void;
17
+ error: (message: ToastMessage, duration?: number) => void;
18
+ success: (message: ToastMessage, duration?: number) => void;
19
+ warning: (message: ToastMessage, duration?: number) => void;
20
+ info: (message: ToastMessage, duration?: number) => void;
21
+ }
22
+ declare const toast: ToastFunction;
20
23
  //#endregion
21
- export { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning };
24
+ export { DEFAULT_ALERT_DURATION, ToastFunction, ToastMessage, toast };
@@ -8,14 +8,17 @@ interface ToastProps extends AlertBaseProps {
8
8
  duration?: number;
9
9
  description?: string;
10
10
  }
11
- declare function toast(props: ToastProps): void;
12
11
  type ToastMessage = string | ({
13
12
  title: string;
14
13
  description: string;
15
14
  } & AlertToastProps);
16
- declare function toastInfo(message: ToastMessage, duration?: number): void;
17
- declare function toastSuccess(message: ToastMessage, duration?: number): void;
18
- declare function toastWarning(message: ToastMessage, duration?: number): void;
19
- declare function toastError(message: ToastMessage, duration?: number): void;
15
+ interface ToastFunction {
16
+ (props: ToastProps): void;
17
+ error: (message: ToastMessage, duration?: number) => void;
18
+ success: (message: ToastMessage, duration?: number) => void;
19
+ warning: (message: ToastMessage, duration?: number) => void;
20
+ info: (message: ToastMessage, duration?: number) => void;
21
+ }
22
+ declare const toast: ToastFunction;
20
23
  //#endregion
21
- export { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning };
24
+ export { DEFAULT_ALERT_DURATION, ToastFunction, ToastMessage, toast };
@@ -6,7 +6,7 @@ import { toast } from "sonner";
6
6
  //#region src/toast/toast.tsx
7
7
  const DEFAULT_ALERT_DURATION = 1e4;
8
8
  const toastInstances = /* @__PURE__ */ new Map();
9
- function toast$1(props) {
9
+ const toast$1 = function(props) {
10
10
  const { duration,...rest } = props;
11
11
  const baseId = `toast_${simpleHash(`${props.title ?? ""}::${props.description ?? ""}`)}`;
12
12
  const instance = toastInstances.get(baseId);
@@ -36,7 +36,7 @@ function toast$1(props) {
36
36
  cleanUp(t.id);
37
37
  }
38
38
  });
39
- }
39
+ };
40
40
  function createToast(variant, message, duration) {
41
41
  if (typeof message === "string") toast$1({
42
42
  variant,
@@ -49,18 +49,10 @@ function createToast(variant, message, duration) {
49
49
  duration
50
50
  });
51
51
  }
52
- function toastInfo(message, duration) {
53
- createToast("info", message, duration);
54
- }
55
- function toastSuccess(message, duration) {
56
- createToast("success", message, duration);
57
- }
58
- function toastWarning(message, duration) {
59
- createToast("warning", message, duration);
60
- }
61
- function toastError(message, duration) {
62
- createToast("error", message, duration);
63
- }
52
+ toast$1.error = (message, duration) => createToast("error", message, duration);
53
+ toast$1.success = (message, duration) => createToast("success", message, duration);
54
+ toast$1.warning = (message, duration) => createToast("warning", message, duration);
55
+ toast$1.info = (message, duration) => createToast("info", message, duration);
64
56
 
65
57
  //#endregion
66
- export { DEFAULT_ALERT_DURATION, toast$1 as toast, toastError, toastInfo, toastSuccess, toastWarning };
58
+ export { DEFAULT_ALERT_DURATION, toast$1 as toast };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pixpilot/shadcn-ui",
3
3
  "type": "module",
4
- "version": "0.50.0",
4
+ "version": "0.52.0",
5
5
  "description": "Custom UI components and utilities built with shadcn/ui.",
6
6
  "author": "m.doaie <m.doaie@hotmail.com>",
7
7
  "license": "MIT",