design-system-silkhaus 2.16.3 → 2.17.0-beta.notifications.2

package/dist/index.d.ts

@@ -347,6 +347,8 @@ export declare const DeleteIcon: FC<{
 
 export declare const desktopMinWidth: number;
 
+export declare const DesktopPopover: FC<PropsWithChildren<PopoverProps>>;
+
 export declare const DesktopTooltip: FC<PropsWithChildren<TooltipProps>>;
 
 export declare const Dialog: ForwardRefExoticComponent<DialogProps & RefAttributes<HTMLDivElement>>;
@@ -653,6 +655,8 @@ export declare interface MobileMultiSelectFilterDropDownProps extends HTMLAttrib
     disabled?: boolean;
 }
 
+export declare const MobilePopover: FC<PropsWithChildren<PopoverProps>>;
+
 export declare const MobileSelectCardDropDown: ForwardRefExoticComponent<MobileSelectCardDropDownProps & RefAttributes<HTMLDivElement>>;
 
 export declare interface MobileSelectCardDropDownProps extends HTMLAttributes<HTMLDivElement> {
@@ -684,6 +688,19 @@ export declare const MoonIcon: FC<{
     className?: string;
 }>;
 
+export declare const NotificationItem: FC<NotificationItemProps>;
+
+export declare type NotificationItemProps = {
+    id?: string | number;
+    className?: string;
+    title: string;
+    description1: string;
+    description2?: string;
+    thumbnailUrl?: string;
+    isRead?: boolean;
+    onClick?: (item: NotificationItemProps) => void;
+};
+
 export declare const OpenNewIcon: FC<{
     className?: string;
 }>;
@@ -818,6 +835,50 @@ export declare const PlusCircleIcon: FC<{
     className?: string;
 }>;
 
+/**
+ * A component that displays a floating popover with the `content` on click of the `trigger` element for desktop
+ * and for mobile it displays a dialog that slides from the bottom
+ */
+export declare const Popover: FC<PropsWithChildren<PopoverProps>>;
+
+export declare interface PopoverProps {
+    /**
+     * Content of the popover
+     */
+    content: ReactNode;
+    /**
+     * The element that triggers the popover
+     */
+    trigger: ReactNode;
+    /**
+     * The placement of the floating popover. Only used in desktop version
+     * @default 'bottom'
+     */
+    placement?: Placement;
+    /**
+     * The trigger of the popover is wrapped in a container. This classname is added to that container
+     */
+    triggerContainerClassName?: string;
+    /**
+     * The content of the popover is wrapped in a container. This classname is added to that container
+     */
+    contentContainerClassname?: string;
+    /**
+     * When set true, popover will not be shown
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * The offset of the popover from the trigger in px. Only applicable for desktop popover
+     * @default 4
+     */
+    offset?: number;
+    /**
+     * The title of the popover
+     */
+    title?: string;
+}
+
 export declare const PreviewIcon: FC<{
     className?: string;
 }>;
@@ -1184,7 +1245,7 @@ export declare interface TooltipProps {
     disabled?: boolean;
     /**
      * The offset of the tooltip from the trigger in px. Only applicable for desktop tooltip
-     * @dwefault 4
+     * @default 4
      */
     offset?: number;
 }