@react-fabric/core 1.0.0-beta.62 → 1.0.0-beta.63

package/dist/types/components/badge/Badge.d.ts

@@ -1,4 +1,4 @@
-import { type BadgeType, type ChildProp, type CssProp, type RefProp } from "../../types";
+import { type ChildProp, type CssProp, type RefProp } from "../../types";
 import { type IconProps } from "../icon/Icon";
 export interface BadgeProps extends CssProp, RefProp, Partial<ChildProp> {
     /**
@@ -30,14 +30,6 @@ export interface BadgeProps extends CssProp, RefProp, Partial<ChildProp> {
      */
     placement?: "top-start" | "top-end" | "bottom-start" | "bottom-end" | "top" | "bottom" | "start" | "end";
 }
-/**
- * Utility function to get badge properties from a badge value or object.
- * It checks if the badge is an object and returns its properties,
- *
- * @param {string | number | BadgeType} badge - The badge value or object.
- * @returns {AnyObject} An object containing badge properties.
- */
-export declare const getBadgeProps: (badge?: string | number | BadgeType) => AnyObject;
 /**
  * A component that displays a badge with a value, icon, and optional ping animation.
  * It can be used to indicate notifications, messages, or other important information.
@@ -45,7 +37,7 @@ export declare const getBadgeProps: (badge?: string | number | BadgeType) => Any
  * It can also wrap children elements, allowing for flexible usage in buttons or other components.
  *
  * @param {BadgeProps} props - The properties for the Badge component.
- * @returns {JSX.Element} The rendered Badge component.
+ * @returns {React.ReactElement} The rendered Badge component.
  *
  * @example
  * ```jsx

package/dist/types/components/breadcrumbs/Breadcrumbs.d.ts

@@ -21,7 +21,7 @@ export interface BreadcrumbProps extends CssProp, AriaProps, ChildrenProp<typeof
  * It automatically manages the display of overflow items when there are too many links to fit in the available space, providing a dropdown for additional links.
  *
  * @param {BreadcrumbProps} props - The properties for the Breadcrumbs component.
- * @returns {JSX.Element} The rendered Breadcrumbs component.
+ * @returns {React.ReactElement} The rendered Breadcrumbs component.
  *
  * @example
  * ```jsx

package/dist/types/components/button/Button.d.ts

@@ -106,7 +106,7 @@ export type ButtonProps<Tag extends React.ElementType = "button"> = BaseProps &
  * It also includes features like after action tooltips, badges, and keyboard shortcuts.
  *
  * @param {ButtonProps} props - The properties for the Button component.
- * @returns {JSX.Element} The rendered Button component.
+ * @returns {React.ReactElement} The rendered Button component.
  *
  * @example
  * ```jsx

package/dist/types/components/button/ButtonGroup.d.ts

@@ -37,7 +37,7 @@ export interface ButtonGroupProps extends CssProp, AriaProps, TestProps, RefProp
  * such as toolbars, action groups, or navigation buttons.
  *
  * @param {ButtonGroupProps} props - The properties for the ButtonGroup component.
- * @returns {JSX.Element} The rendered ButtonGroup component.
+ * @returns {React.ReactElement} The rendered ButtonGroup component.
  *
  * @example
  * ```jsx

package/dist/types/components/button/ConfirmButton.d.ts

@@ -32,7 +32,7 @@ export type ConfirmButtonProps = ExtendedProps & ButtonProps;
  * It also supports custom placement of the dialog, and can display an action message when the action is completed.
  *
  * @param {ConfirmButtonProps} props - The properties for the ConfirmButton component.
- * @returns {JSX.Element} The rendered ConfirmButton component.
+ * @returns {React.ReactElement} The rendered ConfirmButton component.
  *
  * @example
  * ```jsx

package/dist/types/components/button/ToggleButtonGroup.d.ts

@@ -59,7 +59,7 @@ export type ToggleButtonGroupProps<T> = BaseProps & ChildrenProp<React.ReactElem
  * such as toggle switches, selection groups, or multi-select options.
  *
  * @param {ToggleButtonGroupProps} props - The properties for the ToggleButtonGroup component.
- * @returns {JSX.Element} The rendered ToggleButtonGroup component.
+ * @returns {React.ReactElement} The rendered ToggleButtonGroup component.
  *
  * @example
  * ```jsx

package/dist/types/components/callout/Callout.d.ts

@@ -3,11 +3,15 @@ export interface CalloutProps extends AriaProps, ChildrenProp, CssProp, TestProp
     /**
      * callout color
      */
-    color?: ColorState | "none";
+    color?: ColorState | "dimmed";
     /**
      * legend title
      */
     legend?: string | React.ReactElement;
+    /**
+     * legend class name
+     */
+    legendClassName?: string;
     /**
      * callout icon
      */
@@ -33,7 +37,7 @@ export interface CalloutProps extends AriaProps, ChildrenProp, CssProp, TestProp
  * such as alerts, notifications, or important messages.
  *
  * @param {CalloutProps} props - The properties for the Callout component.
- * @returns {JSX.Element} The rendered Callout component.
+ * @returns {React.ReactElement} The rendered Callout component.
  *
  * @example
  * ```jsx
@@ -51,4 +55,4 @@ export interface CalloutProps extends AriaProps, ChildrenProp, CssProp, TestProp
  *
  * @see {@link https://adarshpastakia.github.io/react-fabric/?path=/story/core-components-callout--docs} for more details.
  */
-export declare const Callout: ({ children, color, legend, title, icon, border, onClose, className, ...aria }: CalloutProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Callout: ({ children, color, legend, legendClassName, title, icon, border, onClose, className, ...aria }: CalloutProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/card/Card.d.ts

@@ -1,7 +1,7 @@
 import { type DragEvent, type MouseEventHandler } from "react";
 import { type ContentProps } from "../../core/content/Content";
 import { type HeadFootProps } from "../../core/headfoot/HeadFoot";
-import { type PolymorphicProps, type AriaProps, type ChildrenProp, type CssProp, type RefProp, type TestProps } from "../../types";
+import { type AriaProps, type ChildrenProp, type CssProp, type PolymorphicProps, type RefProp, type TestProps } from "../../types";
 interface BaseProps extends CssProp, AriaProps, TestProps, RefProp<HTMLDivElement>, ChildrenProp<React.ReactElement<HeadFootProps | ContentProps>> {
     /**
      * apply flex fill styling
@@ -50,7 +50,7 @@ export type CardProps<Tag extends React.ElementType = "div"> = BaseProps & Polym
  * It can be styled with custom CSS classes and supports features like selection indication and drag-and-drop functionality.
  *
  * @param {CardProps} props - The properties for the Card component.
- * @returns {JSX.Element} The rendered Card component.
+ * @returns {React.ReactElement} The rendered Card component.
  *
  * @example
  * ```jsx

package/dist/types/components/card/CardCover.d.ts

@@ -19,7 +19,7 @@ export interface CardCoverProps extends CssProp, AriaProps, ChildrenProp {
  * It can be used to create visually appealing card layouts with media content.
  *
  * @param {CardCoverProps} props - The properties for the CardCover component.
- * @returns {JSX.Element} The rendered CardCover component.
+ * @returns {React.ReactElement} The rendered CardCover component.
  *
  * @example
  * ```jsx

package/dist/types/components/card/FlipContent.d.ts

@@ -13,7 +13,7 @@ export interface Props extends ChildrenProp, RefProp<FlipContentRef> {
  * The `flipCard` method can be called to toggle the visibility of the back content.
  *
  * @param {Props} props - The properties for the FlipContent component.
- * @returns {JSX.Element} The rendered FlipContent component.
+ * @returns {React.ReactElement} The rendered FlipContent component.
  *
  * @example
  * ```jsx

package/dist/types/components/chip/Chip.d.ts

@@ -56,7 +56,7 @@ export interface ChipProps extends CssProp, AriaProps, TestProps, ChildProp<stri
  * It can also include an icon and a remove button, making it versatile for different use cases.
  *
  * @param {ChipProps} props - The properties for the Chip component.
- * @returns {JSX.Element} The rendered Chip component.
+ * @returns {React.ReactElement} The rendered Chip component.
  *
  * @example
  * ```jsx

package/dist/types/components/collapsable/Collapsable.d.ts

@@ -54,7 +54,7 @@ export interface CollapsableProps extends CssProp, AriaProps, TestProps, RefProp
  * This component is ideal for creating accordions, expandable panels, or sections that can be toggled by the user.
  *
  * @param {CollapsableProps} props - The properties for the Collapsable component.
- * @returns {JSX.Element} The rendered Collapsable component.
+ * @returns {React.ReactElement} The rendered Collapsable component.
  *
  * @example
  * ```jsx

package/dist/types/components/divider/Divider.d.ts

@@ -28,7 +28,7 @@ export interface DividerProps extends CssProp, Partial<ChildProp> {
  * styles, and alignment options.
  *
  * @param {DividerProps} props - The properties for the Divider component.
- * @returns {JSX.Element} The rendered Divider component.
+ * @returns {React.ReactElement} The rendered Divider component.
  *
  * @example
  * ```jsx

package/dist/types/components/dropdown/Dropdown.d.ts

@@ -31,9 +31,13 @@ export interface DropdownProps extends RefProp {
      */
     dropdownClassName?: string;
     /**
-     * dropdown event
+     * dropdown trigger event, default is click
      */
-    dropdownEvent?: "click" | "hover";
+    trigger?: "click" | "hover";
+    /**
+     * portal root element
+     */
+    root?: HTMLElement;
     /**
      * open handler
      */
@@ -84,6 +88,6 @@ export declare const Dropdown: (props: DropdownProps) => import("react/jsx-runti
  * @param dismiss - Whether to dismiss the dropdown on click (default: true).
  * @returns JSX Element
  */
-export declare const DropdownDismiss: ({ children, dismiss, }: ChildProp & {
+export declare const DropdownDismiss: ({ children, dismiss }: ChildProp & {
     dismiss?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/dropdown/DropdownTool.d.ts

@@ -11,7 +11,7 @@ import { type DropdownProps } from "./Dropdown";
  * @param {string} icon - The icon to be displayed in the dropdown.
  * @param {boolean} groupHover - If true, the dropdown will only be visible when the parent group is hovered.
  * @param {DropdownProps} props - Additional properties for the dropdown.
- * @returns {JSX.Element} The rendered DropdownTool component.
+ * @returns {React.ReactElement} The rendered DropdownTool component.
  *
  * @example
  * ```jsx

package/dist/types/components/empty/EmptyContent.d.ts

@@ -3,11 +3,11 @@ export interface EmptyContentProps extends CssProp, TestProps, Partial<ChildrenP
     /**
      * empty title
      */
-    title?: string | JSX.Element;
+    title?: string | React.ReactElement;
     /**
      * empty message
      */
-    message: string | JSX.Element;
+    message: string | React.ReactElement;
     /**
      * content size
      */
@@ -29,7 +29,7 @@ export interface EmptyContentProps extends CssProp, TestProps, Partial<ChildrenP
  * such as in empty states of lists, tables, or other content areas.
  *
  * @param {EmptyContentProps} props - The properties for the EmptyContent component.
- * @returns {JSX.Element} The rendered EmptyContent component.
+ * @returns {React.ReactElement} The rendered EmptyContent component.
  *
  * @example
  * ```jsx

package/dist/types/components/icon/Icon.d.ts

@@ -3,7 +3,7 @@ export interface Props extends CssProp, AriaProps, RefProp, TestProps {
     /**
      * svg path / webfont className / 1-4 letter text
      */
-    icon: string | JSX.Element;
+    icon: string | React.ReactElement;
     /**
      * icon image source URL, if failed to load then shows icon
      */
@@ -42,8 +42,7 @@ export interface Props extends CssProp, AriaProps, RefProp, TestProps {
      */
     onClick?: React.MouseEventHandler;
 }
-export type IconProps = string | JSX.Element | Pick<Props, "icon" | "iconSrc" | "bg" | "color" | "size" | "rtlFlip" | "viewBox" | "rounded" | "animate">;
-export declare const getIconProps: (props: IconProps) => Props;
+export type IconProps = string | React.ReactElement | Pick<Props, "icon" | "iconSrc" | "bg" | "color" | "size" | "rtlFlip" | "viewBox" | "rounded" | "animate">;
 /**
  * A versatile icon component that supports SVG paths, webfont icons, and text icons.
  * It can be styled with background color, icon color, size, and animations.
@@ -53,7 +52,7 @@ export declare const getIconProps: (props: IconProps) => Props;
  * These include `bg`, `color`, `size`, `rtlFlip`, `animate`, and `rounded`.
  *
  * @param {IconProps} props - The properties for the Icon component.
- * @returns {JSX.Element} The rendered Icon component.
+ * @returns {React.ReactElement} The rendered Icon component.
  *
  * @example
  * ```jsx

package/dist/types/components/index.d.ts

@@ -2,7 +2,7 @@ export { ActionLabel } from "./actionLabel/ActionLabel";
 export { AnimationIndicator, AnimationLoader, LoadingBars, LoadingLine, LoadingSpinner, Skeleton, } from "./animations/Animations";
 export { Avatar } from "./avatar/Avatar";
 export { AvatarGroup } from "./avatar/AvatarGroup";
-export { Badge, getBadgeProps } from "./badge/Badge";
+export { Badge } from "./badge/Badge";
 export { Breadcrumbs } from "./breadcrumbs/Breadcrumbs";
 export { Button } from "./button/Button";
 export { ButtonGroup } from "./button/ButtonGroup";
@@ -18,7 +18,7 @@ export { Divider } from "./divider/Divider";
 export { Dropdown, DropdownDismiss } from "./dropdown/Dropdown";
 export { DropdownTool } from "./dropdown/DropdownTool";
 export { EmptyContent } from "./empty/EmptyContent";
-export { getIconProps, Icon } from "./icon/Icon";
+export { Icon } from "./icon/Icon";
 export { Image, Video } from "./media/Media";
 export { ContextMenu } from "./menu/ContextMenu";
 export { Menu } from "./menu/Menu";

package/dist/types/components/media/Media.d.ts

@@ -41,7 +41,7 @@ export interface VideoProps extends BaseProps {
  * It automatically adjusts the display based on the provided fit property, allowing for different styles such as cover, contain, or fill.
  *
  * @param {ImageProps | VideoProps} props - The properties for the Media component.
- * @returns {JSX.Element} The rendered Media component.
+ * @returns {React.ReactElement} The rendered Media component.
  *
  * @example
  * ```jsx
@@ -70,7 +70,7 @@ export declare const Image: ({ src, alt, reel, fit, className, ...aria }: ImageP
  * It also includes a reel decoration for a more engaging visual presentation.
  *
  * @param {VideoProps} props - The properties for the Video component.
- * @returns {JSX.Element} The rendered Video component.
+ * @returns {React.ReactElement} The rendered Video component.
  *
  * @example
  * ```jsx

package/dist/types/components/menu/ContextMenu.d.ts

@@ -10,7 +10,7 @@ export interface ContextMenuProps extends ChildrenProp {
  * This component is useful for creating custom context menus that can be triggered by right-clicking on elements.
  *
  * @param {ContextMenuProps} props - The properties for the ContextMenu component.
- * @returns {JSX.Element} The rendered ContextMenu component.
+ * @returns {React.ReactElement} The rendered ContextMenu component.
  *
  * @example
  * ```jsx

package/dist/types/components/menu/Menu.d.ts

@@ -6,7 +6,7 @@ import { type MenuProps } from "./types";
  * It can be nested within other menus to create complex menu structures.
  *
  * @param {MenuProps} props - The properties for the Menu component.
- * @returns {JSX.Element} The rendered Menu component.
+ * @returns {React.ReactElement} The rendered Menu component.
  *
  * @example
  * ```jsx

package/dist/types/components/menu/types.d.ts

@@ -13,7 +13,7 @@ export interface MenuItemProps extends CssProp, AriaProps, TestProps {
     /**
      * append label badge text
      */
-    appendLabel?: JSX.Element | string | number | false;
+    appendLabel?: React.ReactElement | string | number | false;
     /**
      * menu color
      */

package/dist/types/components/meter/Meter.d.ts

@@ -17,7 +17,7 @@ export interface MeterProps extends CssProp, AriaProps, TestProps {
  * The component can also display a label showing the percentage value.
  *
  * @param {MeterProps} props - The properties for the Meter component.
- * @returns {JSX.Element} The rendered Meter component.
+ * @returns {React.ReactElement} The rendered Meter component.
  *
  * @example
  * ```jsx

package/dist/types/components/navigator/Navigator.d.ts

@@ -23,7 +23,7 @@ export interface NavigatorProps extends CssProp, AriaProps, TestProps, Partial<C
  * It includes previous and next buttons, and supports keyboard navigation.
  *
  * @param {NavigatorProps} props - The properties for the Navigator component.
- * @returns {JSX.Element} The rendered Navigator component.
+ * @returns {React.ReactElement} The rendered Navigator component.
  *
  * @example
  * ```jsx

package/dist/types/components/panel/Panel.d.ts

@@ -14,7 +14,7 @@ export interface PanelProps extends CssProp, AriaProps, TestProps, ExpandProps,
     /**
      * header actions
      */
-    actions?: JSX.Element;
+    actions?: React.ReactElement;
     /**
      * header css classname(s)
      */
@@ -69,7 +69,7 @@ export interface PanelProps extends CssProp, AriaProps, TestProps, ExpandProps,
  * It can be used in various applications where panels are needed, such as dashboards, settings pages, or content management systems.
  *
  * @param {PanelProps} props - The properties for the Panel component.
- * @returns {JSX.Element} The rendered Panel component.
+ * @returns {React.ReactElement} The rendered Panel component.
  *
  * @example
  * ```jsx

package/dist/types/components/panel/PanelGroup.d.ts

@@ -17,7 +17,7 @@ export interface PanelGroupProps extends ChildrenProp {
  * It uses the `Panel` component to render each individual panel within the group.
  *
  * @param {PanelGroupProps} props - The properties for the PanelGroup component.
- * @returns {JSX.Element} The rendered PanelGroup component.
+ * @returns {React.ReactElement} The rendered PanelGroup component.
  *
  * @example
  * ```jsx

package/dist/types/components/panel/PanelStack.d.ts

@@ -24,7 +24,7 @@ export interface PanelStackProps extends CssProp, ChildrenProp {
  * and it updates the active panel based on user interactions.
  *
  * @param {PanelStackProps} props - The properties for the PanelStack component.
- * @returns {JSX.Element} The rendered PanelStack component.
+ * @returns {React.ReactElement} The rendered PanelStack component.
  *
  * @example
  * ```jsx

package/dist/types/components/progress/ProgressBar.d.ts

@@ -28,7 +28,7 @@ export interface ProgressProps {
  * The label can be customized or hidden based on the props provided.
  *
  * @param {ProgressProps} props - The properties for the ProgressBar component.
- * @returns {JSX.Element} The rendered ProgressBar component.
+ * @returns {React.ReactElement} The rendered ProgressBar component.
  *
  * @example
  * ```jsx

package/dist/types/components/progress/ProgressCircle.d.ts

@@ -19,7 +19,7 @@ export interface ProgressProps {
  * The component is customizable with size and color props.
  *
  * @param {ProgressProps} props - The properties for the ProgressCircle component.
- * @returns {JSX.Element} - A circular progress indicator.
+ * @returns {React.ReactElement} - A circular progress indicator.
  *
  * @example
  * ```jsx

package/dist/types/components/tabpanel/Tab.d.ts

@@ -53,7 +53,7 @@ export interface TabProps extends Partial<ChildrenProp>, CssProp, RefProp, AriaP
  * It also supports tooltips, active states, and click handling.
  *
  * @param {TabProps} props - The properties for the Tab component.
- * @returns {JSX.Element} The rendered Tab component.
+ * @returns {React.ReactElement} The rendered Tab component.
  *
  * @example
  * ```jsx

package/dist/types/components/tabpanel/TabPanel.d.ts

@@ -63,7 +63,7 @@ export interface TabPanelProps extends ChildrenProp<typeof Tab> {
  * It can be customized with different styles and behaviors to fit the needs of the application.
  *
  * @param {TabPanelProps} props - The properties for the TabPanel component.
- * @returns {JSX.Element} The rendered TabPanel component.
+ * @returns {React.ReactElement} The rendered TabPanel component.
  *
  * @example
  * ```jsx

package/dist/types/context/Global.d.ts

@@ -1,5 +1,4 @@
 import { type ComponentType, type FC, type PropsWithChildren } from "react";
-import { type NotificationManagerRef } from "./NotificationCenter";
 interface State {
     locale: string;
     colorScheme: "light" | "dark";
@@ -16,89 +15,8 @@ export interface GlobalProps extends PropsWithChildren {
     defaultCalendar?: State["calendar"];
     defaultColorScheme?: State["colorScheme"];
 }
-interface GlobalContextType {
-    /**
-     * change language locale
-     * @param locale
-     */
-    changeLocale: (locale: string) => string;
-    /**
-     * change date calendat
-     * @param locale
-     */
-    changeCalendar: (calendar: State["calendar"]) => State["calendar"];
-    /**
-     * toggle theme between light and dark
-     * or force to theme provided
-     * @param theme
-     */
-    toggleColorScheme: (colorScheme?: State["colorScheme"]) => State["colorScheme"];
-    /**
-     * application default error display
-     */
-    errorElement: GlobalProps["errorElement"];
-    currentLocale: string;
-    currentCalendar: State["calendar"];
-    currentColorScheme: State["colorScheme"];
-    notificationManager: NotificationManagerRef;
-}
-export declare const GlobalContext: import("react").Context<GlobalContextType>;
 /**
  * global context provider
  */
 export declare const ApplicationProvider: FC<GlobalProps>;
-/**
- * internal usage only
- * @internal
- */
-export declare const useGlobals: () => GlobalContextType;
-/**
- * Hook to access the global application context.
- * This hook provides access to the global context values, including the current locale, calendar, and color scheme.
- *
- * @returns {GlobalContextType} The global context values excluding the error element.
- *
- * @example
- * ```jsx
- * const { changeLocale, currentLocale, toggleColorScheme } = useApplicationContext();
- * ```
- */
-export declare const useApplicationContext: () => {
-    /**
-     * change language locale
-     * @param locale
-     */
-    changeLocale: (locale: string) => string;
-    /**
-     * change date calendat
-     * @param locale
-     */
-    changeCalendar: (calendar: State["calendar"]) => State["calendar"];
-    /**
-     * toggle theme between light and dark
-     * or force to theme provided
-     * @param theme
-     */
-    toggleColorScheme: (colorScheme?: State["colorScheme"]) => State["colorScheme"];
-    currentLocale: string;
-    currentCalendar: State["calendar"];
-    currentColorScheme: State["colorScheme"];
-    notificationManager: NotificationManagerRef;
-};
-/**
- * Hook to access the notification manager from the global context.
- * This hook provides methods to show alerts, errors, messages, and toasts.
- * It returns a reference to the notification manager, which can be used to display notifications in the application.
- *
- * @returns {NotificationManagerRef} The notification manager reference.
- *
- * @example
- * ```jsx
- * const notificationService = useNotificationService();
- * notificationService.showMessage("Hello World");
- * ```
- *
- * @see {@link https://adarshpastakia.github.io/react-fabric/?path=/docs/core-components-notifications--notifications} for more details on available methods.
- */
-export declare const useNotificationService: () => NotificationManagerRef;
 export {};

package/dist/types/context/context.d.ts

@@ -0,0 +1,85 @@
+import { State } from "storybook/manager-api";
+import { GlobalProps } from "./Global";
+import { NotificationManagerRef } from "./NotificationCenter";
+interface GlobalContextType {
+    /**
+     * change language locale
+     * @param locale
+     */
+    changeLocale: (locale: string) => string;
+    /**
+     * change date calendar
+     * @param locale
+     */
+    changeCalendar: (calendar: State["calendar"]) => State["calendar"];
+    /**
+     * toggle theme between light and dark
+     * or force to theme provided
+     * @param theme
+     */
+    toggleColorScheme: (colorScheme?: State["colorScheme"]) => State["colorScheme"];
+    /**
+     * application default error display
+     */
+    errorElement: GlobalProps["errorElement"];
+    currentLocale: string;
+    currentCalendar: State["calendar"];
+    currentColorScheme: State["colorScheme"];
+    notificationManager: NotificationManagerRef;
+}
+export declare const GlobalContext: import("react").Context<GlobalContextType>;
+/**
+ * internal usage only
+ * @internal
+ */
+export declare const useGlobals: () => GlobalContextType;
+/**
+ * Hook to access the global application context.
+ * This hook provides access to the global context values, including the current locale, calendar, and color scheme.
+ *
+ * @returns {GlobalContextType} The global context values excluding the error element.
+ *
+ * @example
+ * ```jsx
+ * const { changeLocale, currentLocale, toggleColorScheme } = useApplicationContext();
+ * ```
+ */
+export declare const useApplicationContext: () => {
+    /**
+     * change language locale
+     * @param locale
+     */
+    changeLocale: (locale: string) => string;
+    /**
+     * change date calendar
+     * @param locale
+     */
+    changeCalendar: (calendar: State["calendar"]) => State["calendar"];
+    /**
+     * toggle theme between light and dark
+     * or force to theme provided
+     * @param theme
+     */
+    toggleColorScheme: (colorScheme?: State["colorScheme"]) => State["colorScheme"];
+    currentLocale: string;
+    currentCalendar: State["calendar"];
+    currentColorScheme: State["colorScheme"];
+    notificationManager: NotificationManagerRef;
+};
+/**
+ * Hook to access the notification manager from the global context.
+ * This hook provides methods to show alerts, errors, messages, and toasts.
+ * It returns a reference to the notification manager, which can be used to display notifications in the application.
+ *
+ * @returns {NotificationManagerRef} The notification manager reference.
+ *
+ * @example
+ * ```jsx
+ * const notificationService = useNotificationService();
+ * notificationService.showMessage("Hello World");
+ * ```
+ *
+ * @see {@link https://adarshpastakia.github.io/react-fabric/?path=/docs/core-components-notifications--notifications} for more details on available methods.
+ */
+export declare const useNotificationService: () => NotificationManagerRef;
+export {};

package/dist/types/core/aside/Aside.d.ts

@@ -16,7 +16,7 @@ export interface AsideProps extends ChildrenProp, CollapseProps, CssProp, TestPr
     /**
      * header actions
      */
-    actions?: Elements<JSX.Element>;
+    actions?: Elements<React.ReactElement>;
     /**
      * header class
      */
@@ -60,7 +60,7 @@ export interface AsideProps extends ChildrenProp, CollapseProps, CssProp, TestPr
  * It can be aligned to the start or end of the page.
  *
  * @param {AsideProps} props - The properties for the Aside component.
- * @returns {JSX.Element} The rendered Aside component.
+ * @returns {React.ReactElement} The rendered Aside component.
  *
  * @example
  * ```jsx