@officesdk/design 0.1.25 → 0.1.27

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

@@ -3,6 +3,7 @@ import { TooltipProps as TooltipProps$1 } from 'rc-tooltip/lib/Tooltip';
 import { DropdownProps as DropdownProps$1 } from 'rc-dropdown';
 import * as styled_components from 'styled-components';
 import { ThemedStyledInterface } from 'styled-components';
+import { DialogProps } from 'rc-dialog';
 import { Theme } from '@officesdk/design/theme';
 
 interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
@@ -969,7 +970,7 @@ interface TooltipProps extends Omit<Partial<TooltipProps$1>, 'prefixCls'> {
  */
 declare const Tooltip: React$1.FC<TooltipProps>;
 
-interface ToolbarButtonProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, 'onClick'> {
+interface ToolbarButtonProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, 'onClick' | 'onDoubleClick'> {
     /**
      * Whether the button is disabled
      */
@@ -977,15 +978,17 @@ interface ToolbarButtonProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>
     /**
      * Whether the button is in active state
      */
-    active?: boolean;
+    isActive?: boolean;
     /**
      * Icon to display
+     * - If string: image URL
+     * - If ReactNode: custom icon component
      */
-    icon?: React$1.ReactNode;
+    icon?: string | React$1.ReactNode;
     /**
-     * Label text
+     * Label text or custom node
      */
-    label?: string;
+    label?: string | React$1.ReactNode;
     /**
      * Whether to show dropdown arrow
      */
@@ -998,6 +1001,10 @@ interface ToolbarButtonProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>
      * Click handler for main button
      */
     onClick?: (e: React$1.MouseEvent<HTMLButtonElement>) => void;
+    /**
+     * Double click handler for main button
+     */
+    onDoubleClick?: (e: React$1.MouseEvent<HTMLButtonElement>) => void;
     /**
      * Click handler for dropdown section
      */
@@ -1017,14 +1024,22 @@ interface ToolbarButtonProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>
  * A toolbar button with optional icon, label, and dropdown functionality
  *
  * @example
- * // Icon only button
+ * // Icon component
  * <ToolbarButton icon={<Icon />} />
  *
  * @example
+ * // Icon from URL
+ * <ToolbarButton icon="https://example.com/icon.png" />
+ *
+ * @example
  * // Button with label and dropdown
  * <ToolbarButton icon={<Icon />} label="Format" hasDropdown />
  *
  * @example
+ * // Button with custom label node
+ * <ToolbarButton icon={<Icon />} label={<CustomLabel />} />
+ *
+ * @example
  * // Button with split dropdown
  * <ToolbarButton
  *   icon={<Icon />}
@@ -1307,6 +1322,146 @@ declare const Dropdown: React$1.FC<DropdownProps>;
 declare const DropdownGlobalStyles: styled_components.GlobalStyleComponent<{}, styled_components.DefaultTheme>;
 declare const MenuGlobalStyles: styled_components.GlobalStyleComponent<{}, styled_components.DefaultTheme>;
 
+interface ModalProps extends DialogProps {
+    /**
+     * Whether the modal is visible
+     */
+    visible?: boolean;
+    /**
+     * Modal variant type
+     * - 'message': Message dialog (max 400px, min 360px)
+     * - 'functional': Functional dialog (default 640px, max 800px, min 400px)
+     */
+    variant?: 'message' | 'functional';
+    /**
+     * Mask layer type
+     * - 'light': Light mask (rgba(65,70,75,0.5))
+     * - 'dark': Dark mask (rgba(44,48,51,0.8))
+     */
+    maskType?: 'light' | 'dark';
+    /**
+     * Modal title
+     */
+    title?: React$1.ReactNode;
+    /**
+     * Modal width
+     */
+    width?: string | number;
+    /**
+     * Modal height
+     */
+    height?: string | number;
+    /**
+     * Whether to show mask
+     */
+    mask?: boolean;
+    /**
+     * Whether to close modal when clicking mask
+     */
+    maskClosable?: boolean;
+    /**
+     * Whether to show close button
+     */
+    closable?: boolean;
+    /**
+     * OK button text, set to null to hide
+     */
+    okText?: string | null;
+    /**
+     * Cancel button text, set to null to hide
+     */
+    cancelText?: string | null;
+    /**
+     * Whether OK button is disabled
+     */
+    disabledOkButton?: boolean;
+    /**
+     * Custom footer, set to null to hide footer
+     */
+    footer?: React$1.ReactNode;
+    /**
+     * Callback when OK button is clicked
+     */
+    onOk?: (e: React$1.MouseEvent) => void;
+    /**
+     * Callback when Cancel button is clicked or modal is closed
+     */
+    onCancel?: (e: React$1.MouseEvent | React$1.KeyboardEvent) => void;
+    /**
+     * Modal content
+     */
+    children?: React$1.ReactNode;
+    /**
+     * CSS class prefix
+     */
+    prefixCls?: string;
+    /**
+     * Custom className
+     */
+    className?: string;
+    /**
+     * Custom style
+     */
+    style?: React$1.CSSProperties;
+    /**
+     * z-index of the modal
+     */
+    zIndex?: number;
+    /**
+     * Whether to destroy modal on close
+     */
+    destroyOnClose?: boolean;
+    /**
+     * Whether to focus on modal when opened
+     */
+    focusTriggerAfterClose?: boolean;
+    /**
+     * Return the mount node for Modal
+     */
+    getContainer?: () => HTMLElement;
+}
+/**
+ * Modal Component
+ *
+ * A dialog component for displaying content in a layer above the page.
+ *
+ * @example
+ * // Basic usage
+ * <Modal
+ *   visible={visible}
+ *   title="Modal Title"
+ *   onOk={handleOk}
+ *   onCancel={handleCancel}
+ * >
+ *   Modal content
+ * </Modal>
+ *
+ * @example
+ * // Custom footer
+ * <Modal
+ *   visible={visible}
+ *   title="Custom Footer"
+ *   footer={<Button onClick={handleClose}>Close</Button>}
+ *   onCancel={handleCancel}
+ * >
+ *   Modal content
+ * </Modal>
+ *
+ * @example
+ * // No footer
+ * <Modal
+ *   visible={visible}
+ *   title="No Footer"
+ *   footer={null}
+ *   onCancel={handleCancel}
+ * >
+ *   Modal content
+ * </Modal>
+ */
+declare const Modal: React$1.FC<ModalProps>;
+
+declare const ModalGlobalStyles: any;
+
 type DeepPartial<T extends object> = {
     [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
 };
@@ -1593,4 +1748,4 @@ declare const styled: ThemedStyledInterface<Theme>;
 
 declare const getGlobalTheme: () => Theme;
 
-export { type A11yConfig, type AnimationConfig, Button, type ButtonProps, Checkbox, type CheckboxProps, Dropdown, DropdownButton, type DropdownButtonProps, DropdownGlobalStyles, type DropdownProps, type I18nConfig, Icon, type IconComponent, type IconProps, IconProvider, type IconProviderProps, type IconRegistry, Input, type InputProps, Menu, type MenuDivider, MenuGlobalStyles, type MenuGroup, type MenuItem, type MenuItemType, type MenuProps, NumberInput, type NumberInputProps, Radio, type RadioProps, SearchInput, type SearchInputProps, Slider, type SliderProps, SpinButton, type SpinButtonProps, Switch, type SwitchProps, type TabItem, Tabs, type TabsProps, Toast, type ToastConfig, ToastContainer, type ToastContainerConfig, type ToastContainerProps, type ToastPosition, type ToastProps, ToolbarButton, type ToolbarButtonProps, Tooltip, type TooltipProps, type UIConfig, UIConfigProvider, type UIConfigProviderProps, UnderlinedInput, type InputProps as UnderlinedInputProps, type ZIndexConfig, createUIConfig, getGlobalIconRegistry, getGlobalTheme, getGlobalToastConfig, getUIConfig, initUIConfig, mergeUIConfig, styled, toast, useIconRegistry, useToast, useUIConfig };
+export { type A11yConfig, type AnimationConfig, Button, type ButtonProps, Checkbox, type CheckboxProps, Dropdown, DropdownButton, type DropdownButtonProps, DropdownGlobalStyles, type DropdownProps, type I18nConfig, Icon, type IconComponent, type IconProps, IconProvider, type IconProviderProps, type IconRegistry, Input, type InputProps, Menu, type MenuDivider, MenuGlobalStyles, type MenuGroup, type MenuItem, type MenuItemType, type MenuProps, Modal, ModalGlobalStyles, type ModalProps, NumberInput, type NumberInputProps, Radio, type RadioProps, SearchInput, type SearchInputProps, Slider, type SliderProps, SpinButton, type SpinButtonProps, Switch, type SwitchProps, type TabItem, Tabs, type TabsProps, Toast, type ToastConfig, ToastContainer, type ToastContainerConfig, type ToastContainerProps, type ToastPosition, type ToastProps, ToolbarButton, type ToolbarButtonProps, Tooltip, type TooltipProps, type UIConfig, UIConfigProvider, type UIConfigProviderProps, UnderlinedInput, type InputProps as UnderlinedInputProps, type ZIndexConfig, createUIConfig, getGlobalIconRegistry, getGlobalTheme, getGlobalToastConfig, getUIConfig, initUIConfig, mergeUIConfig, styled, toast, useIconRegistry, useToast, useUIConfig };