@react-fabric/core 1.0.0-beta.8 → 1.0.1

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

@@ -1,6 +1,10 @@
-import { type CallbackReturn, type ChildrenProp } from "../../types";
-import { Tab } from "./Tab";
-export interface TabPanelProps extends ChildrenProp<typeof Tab> {
+import type { CallbackReturn, ChildrenProp, CssPropWithMap } from "../../types";
+import type { TabProps } from "./Tab";
+export interface TabPanelProps extends ChildrenProp<TabProps>, CssPropWithMap<{
+    root: string;
+    header: string;
+    active: string;
+}> {
     /**
      * tab list orientation
      */
@@ -12,11 +16,15 @@ export interface TabPanelProps extends ChildrenProp<typeof Tab> {
     /**
      * tab variations
      */
-    variant?: "soft" | "solid" | "outline";
+    variant?: "soft" | "solid" | "outline" | "pills";
     /**
      * tab button flex to fill tabs
      */
     tabFlex?: boolean;
+    /**
+     * rotate tab sideways for start/end orientation
+     */
+    tabRotate?: boolean;
     /**
      * tab button gap
      */
@@ -26,9 +34,13 @@ export interface TabPanelProps extends ChildrenProp<typeof Tab> {
      */
     activeTab?: string;
     /**
-     * tab list className
+     * append element
+     */
+    append?: React.ReactNode;
+    /**
+     * prepend element
      */
-    headerClassName?: string;
+    prepend?: React.ReactNode;
     /**
      * change handler
      */
@@ -38,4 +50,32 @@ export interface TabPanelProps extends ChildrenProp<typeof Tab> {
      */
     onBeforeChange?: (nextTab: string, currentTab?: string) => CallbackReturn;
 }
-export declare const TabPanel: ({ children, headerClassName, orientation, activeTab, justify, variant, tabFlex, gap, onBeforeChange, onChange, }: TabPanelProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * A component that provides a tabbed interface for displaying content.
+ * It allows users to switch between different tabs, each containing its own content.
+ * It supports various orientations, justify options, and variants for the tab header.
+ * It also provides hooks for handling tab changes before and after they occur.
+ * This component is useful for organizing content into separate sections that can be easily navigated by the user.
+ * It can be customized with different styles and behaviors to fit the needs of the application.
+ *
+ * @example
+ * ```jsx
+ * <TabPanel
+ *   orientation="top"
+ *   activeTab="tab1"
+ *   justify="start"
+ *   variant="solid"
+ *   tabFlex={true}
+ *   onBeforeChange={(nextTab, currentTab) => {
+ *     console.log(`Switching from ${currentTab} to ${nextTab}`);
+ *     return true; // or false to prevent change
+ *   }}
+ *   onChange={(id) => console.log(`Active tab changed to: ${id}`)}
+ * >
+ *   <Tab id="tab1" label="Tab 1">Content for Tab 1</Tab>
+ *   <Tab id="tab2" label="Tab 2">Content for Tab 2</Tab>
+ *   <Tab id="tab3" label="Tab 3">Content for Tab 3</Tab>
+ * </TabPanel>
+ * ```
+ */
+export declare function TabPanel({ children, className, classNames, orientation, activeTab, justify, variant, tabFlex, append, prepend, tabRotate, gap, onBeforeChange, onChange, }: TabPanelProps): import("react").JSX.Element;

package/dist/types/components/titlebar/Titlebar.d.ts

@@ -0,0 +1,54 @@
+/**
+ * React Fabric
+ * @version 1.0.0
+ * @license MIT
+ * @copyright 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import type { CssPropWithMap } from "../../types";
+import type { IconProps } from "../icon/Icon";
+export interface TitlebarProps {
+    title?: string | React.ReactNode;
+    /**
+     * icon path or props
+     */
+    icon?: IconProps;
+    /**
+     * header append actions
+     */
+    actions?: React.ReactElement | false | null;
+    /**
+     * header prepend actions
+     */
+    prepend?: React.ReactElement | false | null;
+}
+/**
+ * Header bar with optional icon, title, and action elements.
+ * Renders as a semantic <header> element.
+ */
+export declare function Titlebar({ title, className, classNames, icon, actions, prepend, onClick, }: TitlebarProps & {
+    onClick?: () => void;
+} & CssPropWithMap<{
+    root?: string;
+    title?: string;
+    icon?: string;
+    actions?: string;
+    prepend?: string;
+}>): import("react").JSX.Element;

package/dist/types/components/tooltip/Tooltip.d.ts

@@ -0,0 +1,76 @@
+/**
+ * React Fabric
+ * @version 1.0.0
+ * @license MIT
+ * @copyright 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import { type Placement } from "@floating-ui/react";
+import type { ColorBase, CustomColors } from "../../types/colors";
+export interface TooltipType {
+    /**
+     * tooltip content
+     */
+    content?: string | React.ReactElement;
+    /**
+     * tooltip color
+     */
+    color?: CustomColors<ColorBase>;
+    /**
+     * tooltip placement
+     */
+    placement?: Placement;
+}
+export interface TooltipProps extends TooltipType {
+    /**
+     * force open
+     */
+    open?: boolean;
+    /**
+     * show copy action, pass string as copy content
+     */
+    copyContent?: boolean | string;
+    /**
+     * disable tooltip
+     */
+    disabled?: boolean;
+    children: React.ReactElement<KeyValue>;
+}
+/**
+ * Floating tooltip that displays content on hover.
+ *
+ * Renders a tooltip using Floating UI with an arrow, positioned relative
+ * to its child element. Supports color theming, copy-to-clipboard action,
+ * and RTL-aware placement flipping.
+ *
+ * @example
+ * ```tsx
+ * import { Tooltip } from "@react-fabric/core";
+ *
+ * <Tooltip content="Hello world">
+ *   <button>Hover me</button>
+ * </Tooltip>
+ *
+ * <Tooltip content="Copy me" copyContent="Copy me">
+ *   <span>Copy this</span>
+ * </Tooltip>
+ * ```
+ */
+export declare function Tooltip({ children, color, content, open, copyContent, disabled, placement: _placement, ...rest }: TooltipProps): import("react").JSX.Element;

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

@@ -1,81 +1,51 @@
-import { type ComponentType, type FC, type PropsWithChildren } from "react";
-import { type NotificationManagerRef } from "./NotificationCenter";
-interface State {
-    locale: string;
-    colorScheme: "light" | "dark";
-    calendar: "gregorian" | "hijri";
-}
+/**
+ * React Fabric
+ * @version 1.0.0
+ * @license MIT
+ * @copyright 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import type { PropsWithChildren } from "react";
+import type { State } from "./context";
 export interface GlobalProps extends PropsWithChildren {
     /**
      * application default error display
      */
-    errorElement?: ComponentType<{
+    errorElement?: React.ComponentType<{
         error?: string;
     }>;
+    styleEffect?: "glass" | "matte";
     defaultLocale?: string;
     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
+ * Root context provider for the application.
+ * Wraps the app with global state management for locale, calendar system, and color scheme,
+ * and provides context to all descendant components via `GlobalContext`.
+ *
+ * @example
+ * ```tsx
+ * <ApplicationProvider defaultLocale="en" defaultColorScheme="dark">
+ *    <App />
+ * </ApplicationProvider>
+ * ```
  */
-export declare const useGlobals: () => GlobalContextType;
-/**
- * global application context
- */
-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;
-};
-export declare const useNotificationService: () => NotificationManagerRef;
-export {};
+export declare function ApplicationProvider({ children, errorElement, defaultLocale, defaultCalendar, defaultColorScheme, styleEffect }: GlobalProps): import("react").JSX.Element;

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

@@ -0,0 +1,30 @@
+/**
+ * React Fabric
+ * @version 1.0.0
+ * @license MIT
+ * @copyright 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import type { PropsWithChildren } from "react";
+export declare function ModalManagerProvider({ children }: PropsWithChildren): import("react").JSX.Element;
+export declare const useModalManager: () => {
+    closeModal: (id: string) => void;
+    closeAllModal: () => void;
+};

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

@@ -0,0 +1,107 @@
+/**
+ * React Fabric
+ * @version 1.0.0
+ * @license MIT
+ * @copyright 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import type { GlobalProps } from "./Global";
+export interface State {
+    locale: string;
+    colorScheme: "light" | "dark";
+    calendar: "gregorian" | "hijri";
+}
+interface GlobalContextType {
+    /**
+     * change language locale
+     */
+    changeLocale: (locale: string) => string;
+    /**
+     * change date calendar
+     */
+    changeCalendar: (calendar: State["calendar"]) => State["calendar"];
+    /**
+     * toggle theme between light and dark
+     * or force to theme provided
+     */
+    toggleColorScheme: (colorScheme?: State["colorScheme"]) => State["colorScheme"];
+    /**
+     * application default error display
+     */
+    errorElement: GlobalProps["errorElement"];
+    /**
+     * collapsable layout sections
+     */
+    registerArea: (area: string, callback: (open?: boolean) => void) => void;
+    unregisterArea: (area: string) => void;
+    toggleArea: (area: string, open?: boolean) => void;
+    showAlert: (alert?: React.ReactElement) => void;
+    styleEffect?: "glass" | "matte";
+    isDark: boolean;
+    currentLocale: string;
+    currentCalendar: State["calendar"];
+    currentColorScheme: State["colorScheme"];
+}
+export declare const GlobalContext: import("react").Context<GlobalContextType>;
+interface ModalContextType {
+    activeModal?: string;
+    registerModal: (id: string, callback: () => void) => void;
+    removeModal: (id: string) => void;
+    closeModal: (id: string) => void;
+    closeAllModal: () => void;
+}
+export declare const ModalContext: import("react").Context<ModalContextType>;
+/**
+ * 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
+     */
+    changeLocale: (locale: string) => string;
+    /**
+     * change date calendar
+     */
+    changeCalendar: (calendar: State["calendar"]) => State["calendar"];
+    /**
+     * toggle theme between light and dark
+     * or force to theme provided
+     */
+    toggleColorScheme: (colorScheme?: State["colorScheme"]) => State["colorScheme"];
+    showAlert: (alert?: React.ReactElement) => void;
+    isDark: boolean;
+    currentLocale: string;
+    currentCalendar: State["calendar"];
+    currentColorScheme: State["colorScheme"];
+};
+export {};

package/dist/types/core/areaToggle/AreaToggle.d.ts

@@ -0,0 +1,33 @@
+/**
+ * React Fabric
+ * @version 1.0.0
+ * @license MIT
+ * @copyright 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import type { CallbackReturn } from "../../types";
+export declare function AreaToggle({ children, id, }: {
+    id: string;
+    children: React.ReactElement<{
+        onClick?: (e: React.MouseEvent) => CallbackReturn;
+    }>;
+}): import("react").ReactElement<{
+    onClick?: (e: React.MouseEvent) => CallbackReturn;
+}, string | import("react").JSXElementConstructor<any>>;

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

@@ -1,26 +1,45 @@
-import { type ReactNode } from "react";
-import { type ChildrenProp, type CollapseProps, type CssProp, type Elements, type IconProps, type TestProps } from "../../types";
-export interface AsideProps extends IconProps, ChildrenProp, CollapseProps, CssProp, TestProps {
-    /**
-     * page title
-     */
-    title?: ReactNode;
+/**
+ * React Fabric
+ * @version 1.0.0
+ * @license MIT
+ * @copyright 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import type { TitlebarProps } from "../../components/titlebar/Titlebar";
+import type { ChildrenProp, CollapseProps, CssPropWithMap, TestProps } from "../../types";
+export interface AsideProps extends ChildrenProp, CollapseProps, CssPropWithMap<{
+    root?: string;
+    titlebar?: string;
+    body?: string;
+    title?: string;
+    icon?: string;
+    actions?: string;
+}>, TestProps {
     /**
      * align inline-end
      */
     align?: "start" | "end";
     /**
-     * header actions
-     */
-    actions?: Elements<JSX.Element>;
-    /**
-     * header class
-     */
-    headerClassName?: string;
-    /**
-     * header class
+     * margin (uses tailwind spacing calculation, ie. 2 = 0.5rem)
      */
-    bodyClassName?: string;
+    margin?: number;
     /**
      * show loading indicator
      */
@@ -32,11 +51,13 @@ export interface AsideProps extends IconProps, ChildrenProp, CollapseProps, CssP
     /**
      * allow flyout with collapsed
      */
-    flyout?: boolean;
+    enableFlyout?: boolean;
     /**
      * event handler when shown
      */
     onFlyout?: () => void;
+    id?: string;
+    hideCollapseHandle?: boolean;
     /**
      * fixed width
      */
@@ -49,8 +70,42 @@ export interface AsideProps extends IconProps, ChildrenProp, CollapseProps, CssP
      * min width
      */
     minWidth?: number | string;
+    /**
+     * Resize event
+     */
+    onResize?: (width: number) => void;
 }
 /**
- * Side panel
+ * A sidebar component that can be collapsed, resized, and has a flyout feature.
+ * It supports a title, icon, actions, and loading state.
+ * It can be aligned to the start or end of the page.
+ *
+ * @example
+ * ```jsx
+ * <Aside
+ *   title="Sidebar Title"
+ *   icon=icon-[mdi--menu]
+ *   rtlFlip={true}
+ *   className="custom-aside"
+ *   bodyClassName="custom-aside-body"
+ *   headerClassName="custom-aside-header"
+ *   resizeable={true}
+ *   flyout={true}
+ *   onFlyout={() => console.log("Flyout triggered")}
+ *   collapsed={false}
+ *   collapsable={true}
+ *   onCollapse={() => console.log("Collapsed toggled")}
+ *   actions={<button>Action</button>}
+ *   loading={false}
+ *   align="start"
+ *   width="20rem"
+ *   minWidth="2rem"
+ *   maxWidth="30vw"
+ *   data-testid="aside-test"
+ *   data-test-value="aside-value"
+ * >
+ *   <Content>This is the content of the aside.</Content>
+ * </Aside>
+ * ```
  */
-export declare const Aside: ({ children, title, icon, iconBg, iconColor, rtlFlip, className, bodyClassName, headerClassName, resizeable, flyout, onFlyout, collapsed, collapsable, onCollapse, actions, loading, align, width: wd, minWidth, maxWidth, "data-testid": testId, "data-test-value": testValue, }: AsideProps) => import("react/jsx-runtime").JSX.Element;
+export declare function Aside({ children, title, icon, id, margin, hideCollapseHandle, className, classNames, resizeable, enableFlyout, onFlyout, onResize, collapsed: _collapsed, collapsable, onCollapse, actions, loading, align, width: wd, minWidth, maxWidth, "data-testid": testId, "data-test-value": testValue, }: AsideProps & TitlebarProps): import("react").JSX.Element;