tcce-design-system 0.1.13 → 0.3.15

package/dist/tcce-design-system-components.d.ts

@@ -1,12 +1,19 @@
 import { AnchorHTMLAttributes } from 'react';
+import { ButtonHTMLAttributes } from 'react';
+import { Component } from 'react';
+import { Context } from 'react';
 import { default as default_2 } from 'react';
 import { DetailedHTMLProps } from 'react';
+import { FastOmit } from 'styled-components';
+import { ForwardRefComponent } from 'motion/react';
 import { ForwardRefExoticComponent } from 'react';
 import { HTMLAttributeAnchorTarget } from 'react';
 import { HTMLAttributes } from 'react';
+import { HTMLMotionProps } from 'motion/react';
 import { IStyledComponentBase } from 'styled-components/dist/types';
 import { JSX } from 'react/jsx-runtime';
 import { MouseEventHandler } from 'react';
+import { PropsWithChildren } from 'react';
 import { ReactNode } from 'react';
 import { RefAttributes } from 'react';
 import { RemixiconComponentType } from '@remixicon/react';
@@ -22,6 +29,16 @@ export declare const ALLOWED_INPUT_TYPES: readonly ["text", "email", "password",
 
 export declare type AllowedInputType = (typeof ALLOWED_INPUT_TYPES)[number];
 
+/**
+ * Sidebar container.
+ * @param $collapsed - Whether the sidebar is collapsed.
+ * @param $open - Whether the sidebar is open (mobile).
+ */
+export declare const Aside: IStyledComponentBase<"web", Substitute<DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>, {
+$collapsed: boolean;
+$open: boolean;
+}>> & string;
+
 export declare const baseContentTableStyles: RuleSet<object>;
 
 export declare const baseFieldStyles: RuleSet<object>;
@@ -68,6 +85,8 @@ export declare const bodyTextStyles: {
     12: RuleSet<object>;
 };
 
+export declare const BrandLogo: IStyledComponentBase<"web", FastOmit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+
 export declare const Button: default_2.FC<ButtonProps>;
 
 declare interface ButtonProps extends default_2.ButtonHTMLAttributes<HTMLButtonElement>, WithIconsProps {
@@ -136,6 +155,11 @@ export declare interface CheckboxSpecificProps {
     checkboxLabel?: string;
 }
 
+/**
+ * Button to toggle sidebar collapse/expand.
+ */
+export declare const CloseOpenButton: IStyledComponentBase<"web", FastOmit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+
 declare type ColorKey = 'primary' | 'orange' | 'white' | 'gray';
 
 declare type ColorKey_2 = 'primary' | 'orange' | 'white' | 'gray';
@@ -420,6 +444,19 @@ export declare type HasIcons<T extends WithIconsProps> = {
     hasRightIcon: boolean;
 } & T;
 
+/**
+ * Checks if the user has at least one of the required permissions.
+ *
+ * @param {string[]} userRoles - The roles or permissions assigned to the user.
+ * @param {string[]} permissions - The required permissions to check against.
+ * @returns {boolean} True if the user has permission, otherwise false.
+ *
+ * - Returns false if no permissions are provided.
+ * - Returns true if 'all' is included in the permissions array.
+ * - Returns true if any of the user's roles match the required permissions.
+ */
+export declare const hasPermission: (userRoles?: string[], permissions?: string[]) => boolean;
+
 /**
  * Main Header component for the application.
  * Displays notifications, user profile, and optional children.
@@ -431,7 +468,6 @@ export declare const Header: default_2.FC<HeaderProps>;
 
 /**
  * Props for the Header component.
- * @param sidebarCollapsed: Whether the sidebar is collapsed.
  * @param user: User information for profile display.
  * @param hasNotifications: Whether there are new notifications.
  * @param notificationCount: Optional count of notifications to display.
@@ -441,7 +477,7 @@ export declare const Header: default_2.FC<HeaderProps>;
  * @param userMenuItems: Additional menu items for the user dropdown.
  * @param children: Any additional elements to render in the left section.
  */
-export declare interface HeaderProps {
+declare interface HeaderProps {
     user?: User;
     hasNotifications?: boolean;
     notificationCount?: number;
@@ -449,7 +485,7 @@ export declare interface HeaderProps {
     onUserProfileClick?: () => void;
     onLogout?: () => void;
     userMenuItems?: UserMenuItem[];
-    children?: default_2.ReactNode;
+    children?: React.ReactNode;
 }
 
 export declare const HeadingBold: IStyledComponentBase<"web", Substitute<DetailedHTMLProps<HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {
@@ -576,6 +612,7 @@ export declare interface LayoutProps extends SidebarProps {
     notificationCount?: number;
     onNotificationClick?: () => void;
     onUserProfileClick?: () => void;
+    onNavigate?: (href: string) => void;
     onLogout?: () => void;
     userMenuItems?: UserMenuItem[];
     contentClassName?: string;
@@ -590,6 +627,11 @@ export declare interface LayoutProps extends SidebarProps {
  */
 export declare const Link: default_2.ForwardRefExoticComponent<LinkProps & default_2.RefAttributes<HTMLAnchorElement>>;
 
+/**
+ * CSS styles applied when the Link is disabled.
+ */
+export declare const LinkDisabledStyles: RuleSet<object>;
+
 /**
  * Props for the Link component.
  * Extends standard anchor attributes and WithIconsProps.
@@ -618,11 +660,41 @@ export declare interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElemen
  */
 export declare type LinkSize = 'sm' | 'md' | 'lg';
 
+/**
+ * CSS styles for each Link size.
+ */
+export declare const LinkSizeStyles: {
+    sm: RuleSet<object>;
+    md: RuleSet<object>;
+    lg: RuleSet<object>;
+};
+
 /**
  * Defines the available visual variants for the Link component.
  */
 export declare type LinkVariant = 'underlined' | 'plain';
 
+/**
+ * CSS styles for each Link variant.
+ */
+export declare const LinkVariantStyles: {
+    underlined: RuleSet<object>;
+    plain: RuleSet<object>;
+};
+
+/**
+ * Button to open sidebar on mobile devices.
+ * @param $hidden - Whether the button is hidden.
+ */
+export declare const MobileOpenBtn: IStyledComponentBase<"web", Substitute<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+$hidden: boolean;
+}>> & string;
+
+/**
+ * Navigation container for sidebar menu items.
+ */
+export declare const Nav: IStyledComponentBase<"web", FastOmit<DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
+
 /**
  * Represents a navigation item used in the sidebar navigation component.
  *
@@ -665,6 +737,11 @@ export declare const normalizeSelectOptions: (options: Array<{
     label: string;
 }> | SelectOption[]) => SelectOption[];
 
+/**
+ * Overlay component for mobile sidebar.
+ */
+export declare const Overlay: IStyledComponentBase<"web", FastOmit<Omit<HTMLMotionProps<"div">, "ref"> & RefAttributes<HTMLDivElement>, never>> & string & Omit<ForwardRefComponent<HTMLDivElement, HTMLMotionProps<"div">>, keyof Component<any, {}, any>>;
+
 /**
  * Animation for overlay/backdrop elements.
  * Provides a simple fade animation for modal backdrops.
@@ -815,6 +892,8 @@ export declare type SetDigits = default_2.Dispatch<default_2.SetStateAction<stri
  */
 export declare const Sidebar: default_2.FC<SidebarProps>;
 
+export declare const SidebarContext: Context<SidebarContextValue | undefined>;
+
 /**
  * Context value for managing the sidebar state.
  * @property isCollapsed - Boolean indicating whether the sidebar is collapsed.
@@ -829,6 +908,14 @@ export declare interface SidebarContextValue {
     setIsMobileOpen: (v: boolean) => void;
 }
 
+/**
+ * Sidebar header container.
+ * @param $collapsed - Whether the sidebar is collapsed.
+ */
+export declare const SidebarHeader: IStyledComponentBase<"web", Substitute<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+$collapsed: boolean;
+}>> & string;
+
 /**
  * Props for the Sidebar component.
  *
@@ -845,8 +932,11 @@ export declare interface SidebarProps {
     activePath?: string;
     logoImgExpanded?: default_2.ReactNode;
     logoImgCollapsed?: default_2.ReactNode;
+    onNavigate?: (href: string) => void;
 }
 
+export declare const SidebarProvider: ({ children }: PropsWithChildren) => JSX.Element;
+
 declare type Size = 'sm' | 'md' | 'lg' | 'xl';
 
 export declare const sizeStyles: {
@@ -935,7 +1025,7 @@ export declare const slideAnimation: {
 
 /**
  * Smart animation configuration for consistent motion across the design system.
- * Provides default animation properties for framer-motion components.
+ * Provides default animation properties for motion/react components.
  *
  * Features:
  * - Consistent transition timing and easing
@@ -1205,7 +1295,7 @@ export declare interface User {
 declare interface UserMenuItem {
     id: string;
     label: string;
-    icon: default_2.ComponentType;
+    icon: React.ReactNode | RemixiconComponentType;
     onClick: () => void;
     variant?: 'default' | 'danger';
 }