@xfers/design-system 7.2.0-dev.56a2d7c5ca → 8.0.0-dev.0d1c1edcc0

package/dist/types/components/Select/style.d.ts

@@ -1,10 +1,10 @@
 export declare const LabelContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
 export declare const OptionContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
 export declare const SelectContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
-export declare const StyledAntSelect: import("@emotion/styled-base").StyledComponent<Omit<import("antd").SelectProps<unknown, import("rc-select/lib/Select").DefaultOptionType | import("rc-select/lib/Select").BaseOptionType> & {
+export declare const StyledAntSelect: import("@emotion/styled-base").StyledComponent<Omit<import("antd").SelectProps<unknown, import("@rc-component/select").DefaultOptionType | import("@rc-component/select").BaseOptionType> & {
     children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<import("rc-select").BaseSelectRef>, "ref"> & {
-    ref?: ((instance: import("rc-select").BaseSelectRef | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<import("rc-select").BaseSelectRef> | null | undefined;
+} & import("react").RefAttributes<import("antd").RefSelectProps>, "ref"> & {
+    ref?: ((instance: import("antd").RefSelectProps | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<import("antd").RefSelectProps> | null | undefined;
 }, {
     $size: "sm" | "lg";
     $mode?: "multiple";

package/dist/types/components/Sidebar/CompanyProfile.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import type { CompanyOption, DropdownMenuItem } from './CompanyProfileDropdown';
+type CompanyProfileProps = {
+    companyName?: string;
+    subtitle?: string;
+    enableDropdown?: boolean;
+    /** Renders only the company switcher, without the menu items. */
+    switchOnly?: boolean;
+    companies?: CompanyOption[];
+    /** Menu items shown below the divider. Consumer provides icon + label. */
+    menuItems?: DropdownMenuItem[];
+    onMenuItemClick?: (label: string) => void;
+    onClick?: () => void;
+};
+declare const CompanyProfile: ({ companyName, subtitle, enableDropdown, switchOnly, companies, menuItems, onMenuItemClick, onClick, }: CompanyProfileProps) => React.JSX.Element;
+export default CompanyProfile;

package/dist/types/components/Sidebar/CompanyProfileDropdown.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import { MaterialSymbol } from 'material-symbols';
+export type CompanyOption = {
+    name: string;
+    subtitle?: string;
+    active?: boolean;
+    onClick?: () => void;
+};
+export type DropdownMenuItem = {
+    /** Material Symbol icon name (e.g. 'domain', 'group', 'receipt_long'). */
+    icon: MaterialSymbol;
+    /** Display label for the menu item. */
+    label: string;
+    onClick?: () => void;
+};
+type CompanyProfileDropdownProps = {
+    /** When false, only the company switcher is rendered (Figma `switchOnly`). */
+    showMenuItems?: boolean;
+    /** When false, the switch-company block is hidden (Figma `switchCompany`). */
+    switchCompany?: boolean;
+    /** Companies shown in the SWITCH COMPANY section. */
+    companies?: CompanyOption[];
+    /**
+     * Menu items shown below the divider. Each item needs an icon (MaterialSymbol)
+     * and a label. Consumer must provide this explicitly.
+     */
+    menuItems?: DropdownMenuItem[];
+    /** Fired when a menu item is clicked (if the item doesn't have its own onClick). */
+    onMenuItemClick?: (label: string) => void;
+};
+declare const CompanyProfileDropdown: ({ showMenuItems, switchCompany, companies, menuItems, onMenuItemClick, }: CompanyProfileDropdownProps) => React.JSX.Element;
+export default CompanyProfileDropdown;

package/dist/types/components/Sidebar/CopyrightNotice.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type CopyrightNoticeProps = {
+    text?: string;
+};
+declare const CopyrightNotice: ({ text, }: CopyrightNoticeProps) => React.JSX.Element;
+export default CopyrightNotice;

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

@@ -0,0 +1,40 @@
+import React from 'react';
+import type { SidebarVariant } from './styles';
+type SidebarContextValue = {
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    toggle: () => void;
+    isMobile: boolean;
+};
+export declare const useSidebar: () => SidebarContextValue;
+type SidebarProviderProps = {
+    /** Controlled open state. Omit for uncontrolled. */
+    open?: boolean;
+    /** Callback when open state changes. */
+    onOpenChange?: (open: boolean) => void;
+    /** Default open state for uncontrolled usage. */
+    defaultOpen?: boolean;
+    /** Breakpoint in px below which sidebar renders as a mobile drawer. */
+    mobileBreakpoint?: number;
+    children: React.ReactNode;
+};
+export declare const SidebarProvider: ({ open: controlledOpen, onOpenChange, defaultOpen, mobileBreakpoint, children, }: SidebarProviderProps) => React.JSX.Element;
+type SidebarTriggerProps = {
+    className?: string;
+    label?: string;
+};
+export declare const SidebarTrigger: ({ className, label, }: SidebarTriggerProps) => React.JSX.Element;
+type SidebarBaseProps = {
+    variant?: SidebarVariant;
+    logo?: React.ReactNode;
+    companyProfile?: React.ReactNode;
+    children?: React.ReactNode;
+    footer?: React.ReactNode;
+};
+export declare const SidebarBase: ({ variant, logo, companyProfile, children, footer, }: SidebarBaseProps) => React.JSX.Element | null;
+declare const Sidebar: {
+    Base: ({ variant, logo, companyProfile, children, footer, }: SidebarBaseProps) => React.JSX.Element | null;
+    Provider: ({ open: controlledOpen, onOpenChange, defaultOpen, mobileBreakpoint, children, }: SidebarProviderProps) => React.JSX.Element;
+    Trigger: ({ className, label, }: SidebarTriggerProps) => React.JSX.Element;
+};
+export default Sidebar;

package/dist/types/components/Sidebar/SidebarNavItem.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+import { MaterialSymbol } from 'material-symbols';
+import type { SidebarVariant } from './styles';
+export type SubItem = {
+    id: string;
+    label: string;
+    active?: boolean;
+    onClick?: () => void;
+};
+type SidebarNavItemProps = {
+    /** Stable identifier for this nav item (used for selection, routing). */
+    id: string;
+    icon: MaterialSymbol;
+    label: string;
+    variant?: SidebarVariant;
+    active?: boolean;
+    onClick?: () => void;
+    subItems?: SubItem[];
+    isExpanded?: boolean;
+    /** Optional trailing tag text (e.g. "New"). Uses DS Tag component. */
+    tag?: string;
+    /**
+     * When true and this item has sub-items, expanding the parent also fires
+     * the first sub-item's onClick, so the child is selected without an extra
+     * click. Only applies on expand (not collapse) and only to the first child.
+     */
+    autoSelectFirstSubItem?: boolean;
+};
+declare const SidebarNavItem: ({ id, icon, label, variant, active, onClick, subItems, isExpanded, tag, autoSelectFirstSubItem, }: SidebarNavItemProps) => React.JSX.Element;
+export default SidebarNavItem;

package/dist/types/components/Sidebar/SidebarSubItem.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { SidebarVariant } from './styles';
+type SidebarSubItemProps = {
+    label: string;
+    variant?: SidebarVariant;
+    active?: boolean;
+    onClick?: () => void;
+};
+declare const SidebarSubItem: ({ label, variant, active, onClick, }: SidebarSubItemProps) => React.JSX.Element;
+export default SidebarSubItem;

package/dist/types/components/Sidebar/dropdownStyles.d.ts

@@ -0,0 +1,11 @@
+export declare const DropdownPanel: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const DropdownSectionLabel: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const DropdownRow: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    active?: boolean;
+}, object>;
+export declare const DropdownMenuRow: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const DropdownRowContent: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const DropdownPrimaryText: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, keyof import("react").HTMLAttributes<HTMLSpanElement>>, object>;
+export declare const DropdownSecondaryText: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, keyof import("react").HTMLAttributes<HTMLSpanElement>>, object>;
+export declare const DropdownMenuLabel: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, keyof import("react").HTMLAttributes<HTMLSpanElement>>, object>;
+export declare const DropdownDivider: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;

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

@@ -0,0 +1,11 @@
+import Sidebar, { SidebarBase, SidebarProvider, SidebarTrigger, useSidebar } from './Sidebar';
+import SidebarNavItem from './SidebarNavItem';
+import SidebarSubItem from './SidebarSubItem';
+import CompanyProfile from './CompanyProfile';
+import CompanyProfileDropdown from './CompanyProfileDropdown';
+import CopyrightNotice from './CopyrightNotice';
+export { SidebarBase, SidebarProvider, SidebarTrigger, useSidebar, SidebarNavItem, SidebarSubItem, CompanyProfile, CompanyProfileDropdown, CopyrightNotice, };
+export type { SidebarVariant } from './styles';
+export type { SubItem } from './SidebarNavItem';
+export type { CompanyOption, DropdownMenuItem } from './CompanyProfileDropdown';
+export default Sidebar;

package/dist/types/components/Sidebar/styles.d.ts

@@ -0,0 +1,33 @@
+import { BASE, STATUS } from '../../constants/Colors/colors';
+export type SidebarVariant = 'business' | 'personal' | 'sandbox';
+export declare const itemTextColor: (variant: SidebarVariant, active?: boolean) => BASE.ON_CONTAINER | BASE.ON_NEUTRAL_SECONDARY | STATUS.POSITIVE;
+export declare const SidebarWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    variant: SidebarVariant;
+}, object>;
+export declare const MenuHeader: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const LogoWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const MenuContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const NavItemWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    variant: SidebarVariant;
+    active?: boolean;
+}, object>;
+export declare const NavItemLabel: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    variant: SidebarVariant;
+    active?: boolean;
+}, object>;
+export declare const NavItemAffordance: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, keyof import("react").HTMLAttributes<HTMLSpanElement>>, object>;
+export declare const SubItemWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    variant: SidebarVariant;
+    active?: boolean;
+}, object>;
+export declare const SubItemLabel: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    variant: SidebarVariant;
+    active?: boolean;
+}, object>;
+export declare const CompanyProfileContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const CompanyProfileWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const CompanyProfileContent: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const CompanyName: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, keyof import("react").HTMLAttributes<HTMLSpanElement>>, object>;
+export declare const CompanySubtitle: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, keyof import("react").HTMLAttributes<HTMLSpanElement>>, object>;
+export declare const CopyrightNoticeWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const CopyrightNoticeText: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, keyof import("react").HTMLAttributes<HTMLSpanElement>>, object>;

package/dist/types/components/Steps/DesktopSteps.d.ts

@@ -1,9 +1,18 @@
 import React from 'react';
-import { StepsProps, StepProps } from 'antd';
+import { StepsProps } from 'antd';
+type StepItem = {
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    status?: 'wait' | 'process' | 'finish' | 'error';
+    disabled?: boolean;
+    icon?: React.ReactNode;
+    subTitle?: React.ReactNode;
+    className?: string;
+};
 declare const DesktopSteps: {
-    ({ className, ...rest }: StepsProps & {
-        children: React.ReactNode;
+    ({ className, children, ...rest }: StepsProps & {
+        children?: React.ReactNode;
     }): React.JSX.Element;
-    Step: React.FC<StepProps>;
+    Step: React.FC<StepItem>;
 };
 export default DesktopSteps;

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

@@ -1,12 +1,14 @@
 import React from 'react';
+import type { TabsProps } from 'antd';
 type Props = {
     activeKey?: string;
     onChange?: any;
     animated?: boolean;
-    children: React.ReactNode;
+    items?: TabsProps['items'];
+    children?: React.ReactNode;
 };
 declare const Tabs: {
-    ({ children, ...rest }: Props): React.JSX.Element;
+    ({ children, items, ...rest }: Props): React.JSX.Element;
     TabPane: React.FC<import("antd").TabPaneProps>;
 };
 export default Tabs;

package/dist/types/constants/Colors/colors.d.ts

@@ -105,5 +105,7 @@ export declare enum COMPONENT {
     BUTTON_PRIMARY = "#00A965",
     LABEL_INPUT = "#757575",
     HELPER_INPUT = "#757575",
-    PLACEHOLDER_INPUT = "#B6B6B6"
+    PLACEHOLDER_INPUT = "#B6B6B6",
+    SIDEBAR_ACTIVE = "#D7EFE2",
+    SIDEBAR_ACTIVE_SANDBOX = "#005755"
 }

package/dist/types/index.d.ts

@@ -44,6 +44,8 @@ export { default as Spin } from './components/Spin';
 export { default as SummaryCard } from './components/SummaryCard';
 export { default as Timeline } from './components/Timeline';
 export { default as Coachmark } from './components/Coachmark';
+export { default as Sidebar, SidebarBase, SidebarProvider, SidebarTrigger, useSidebar, SidebarNavItem, SidebarSubItem, CompanyProfile, CompanyProfileDropdown, CopyrightNotice, } from './components/Sidebar';
+export type { SidebarVariant, SubItem as SidebarSubItemType, CompanyOption as SidebarCompanyOption, DropdownMenuItem as SidebarDropdownMenuItem, } from './components/Sidebar';
 export { getCoachmarkJoyrideConfig } from './components/Coachmark/getJoyrideConfig';
 export * from './icons';
 export { MaterialSymbols } from './icons/MaterialSymbols';

package/dist/types/shared/momentDatePicker.d.ts

@@ -1,18 +1,18 @@
 import type { Moment } from 'moment';
-declare const MomentDatePicker: (<ValueType = Moment>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, import("antd/es/date-picker/generatePicker").PickerProps<Moment>, ValueType>) => React.ReactElement) & {
+declare const MomentDatePicker: (<ValueType = Moment, IsMultiple extends boolean = false>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, import("antd/es/date-picker/generatePicker").PickerProps<Moment>, ValueType, IsMultiple>) => React.ReactElement) & {
     displayName?: string;
 } & {
     displayName?: string;
-    WeekPicker: (<ValueType = Moment>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker").PickerProps<Moment>, "picker">, ValueType>) => React.ReactElement) & {
+    WeekPicker: (<ValueType = Moment, IsMultiple extends boolean = false>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker").PickerProps<Moment>, "picker">, ValueType, IsMultiple>) => React.ReactElement) & {
         displayName?: string;
     };
-    MonthPicker: (<ValueType = Moment>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker").PickerProps<Moment>, "picker">, ValueType>) => React.ReactElement) & {
+    MonthPicker: (<ValueType = Moment, IsMultiple extends boolean = false>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker").PickerProps<Moment>, "picker">, ValueType, IsMultiple>) => React.ReactElement) & {
         displayName?: string;
     };
-    YearPicker: (<ValueType = Moment>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker").PickerProps<Moment>, "picker">, ValueType>) => React.ReactElement) & {
+    YearPicker: (<ValueType = Moment, IsMultiple extends boolean = false>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker").PickerProps<Moment>, "picker">, ValueType, IsMultiple>) => React.ReactElement) & {
         displayName?: string;
     };
-    RangePicker: import("react").ForwardRefExoticComponent<Omit<import("rc-picker").RangePickerProps<Moment>, "locale" | "generateConfig" | "hideHeader"> & {
+    RangePicker: import("react").ForwardRefExoticComponent<Omit<import("@rc-component/picker").RangePickerProps<Moment>, "locale" | "generateConfig" | "hideHeader" | "classNames" | "styles"> & {
         locale?: import("antd/es/date-picker/generatePicker").PickerLocale;
         size?: import("antd/es/button").ButtonSize;
         placement?: "bottomLeft" | "bottomRight" | "topLeft" | "topRight";
@@ -23,11 +23,73 @@ declare const MomentDatePicker: (<ValueType = Moment>(props: import("antd/es/dat
         popupClassName?: string;
         rootClassName?: string;
         popupStyle?: React.CSSProperties;
-    } & import("react").RefAttributes<import("rc-picker").PickerRef>>;
-    TimePicker: (<ValueType = Moment>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker/interface").GenericTimePickerProps<Moment>, "picker">, ValueType>) => React.ReactElement) & {
+        classNames?: import("antd/es/_util/hooks/useMergeSemantic/semanticType").DeepClassNameType<{
+            root?: string;
+            prefix?: string;
+            input?: string;
+            suffix?: string;
+            popup?: string | {
+                root?: string;
+                header?: string;
+                body?: string;
+                content?: string;
+                item?: string;
+                footer?: string;
+                container?: string;
+            };
+        } | undefined> | ((info: {
+            props: import("antd/es/date-picker/generatePicker/interface").InjectDefaultProps<import("@rc-component/picker").RangePickerProps<Moment>>;
+        }) => import("antd/es/_util/hooks/useMergeSemantic/semanticType").DeepClassNameType<{
+            root?: string;
+            prefix?: string;
+            input?: string;
+            suffix?: string;
+            popup?: string | {
+                root?: string;
+                header?: string;
+                body?: string;
+                content?: string;
+                item?: string;
+                footer?: string;
+                container?: string;
+            };
+        } | undefined>);
+        styles?: import("antd/es/_util/hooks/useMergeSemantic/semanticType").DeepStylesType<{
+            root?: React.CSSProperties;
+            prefix?: React.CSSProperties;
+            input?: React.CSSProperties;
+            suffix?: React.CSSProperties;
+            popup?: {
+                root?: React.CSSProperties;
+                header?: React.CSSProperties;
+                body?: React.CSSProperties;
+                content?: React.CSSProperties;
+                item?: React.CSSProperties;
+                footer?: React.CSSProperties;
+                container?: React.CSSProperties;
+            };
+        } | undefined> | ((info: {
+            props: import("antd/es/date-picker/generatePicker/interface").InjectDefaultProps<import("@rc-component/picker").RangePickerProps<Moment>>;
+        }) => import("antd/es/_util/hooks/useMergeSemantic/semanticType").DeepStylesType<{
+            root?: React.CSSProperties;
+            prefix?: React.CSSProperties;
+            input?: React.CSSProperties;
+            suffix?: React.CSSProperties;
+            popup?: {
+                root?: React.CSSProperties;
+                header?: React.CSSProperties;
+                body?: React.CSSProperties;
+                content?: React.CSSProperties;
+                item?: React.CSSProperties;
+                footer?: React.CSSProperties;
+                container?: React.CSSProperties;
+            };
+        } | undefined>);
+    } & import("react").RefAttributes<import("@rc-component/picker").PickerRef>>;
+    TimePicker: (<ValueType = Moment, IsMultiple extends boolean = false>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker/interface").GenericTimePickerProps<Moment>, "picker">, ValueType, IsMultiple>) => React.ReactElement) & {
         displayName?: string;
     };
-    QuarterPicker: (<ValueType = Moment>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker").PickerProps<Moment>, "picker">, ValueType>) => React.ReactElement) & {
+    QuarterPicker: (<ValueType = Moment, IsMultiple extends boolean = false>(props: import("antd/es/date-picker/generatePicker/interface").PickerPropsWithMultiple<Moment, Omit<import("antd/es/date-picker/generatePicker").PickerProps<Moment>, "picker">, ValueType, IsMultiple>) => React.ReactElement) & {
         displayName?: string;
     };
 };