greenole-design-system 1.1.83 → 1.1.85

package/dist/components/Card/Card.d.ts

@@ -1,4 +1,19 @@
 import { default as React } from 'react';
-import { CardProps } from './Card.types';
-declare const Card: React.FC<CardProps>;
+import { CardContentProps, CardDescriptionProps, CardProps, CardSectionProps, CardTitleProps } from './Card.types';
+declare const CardHeader: React.FC<CardSectionProps>;
+declare const CardTitle: React.FC<CardTitleProps>;
+declare const CardDescription: React.FC<CardDescriptionProps>;
+declare const CardAction: React.FC<CardSectionProps>;
+declare const CardContent: React.FC<CardContentProps>;
+declare const CardFooter: React.FC<CardSectionProps>;
+type CardCompound = React.FC<CardProps> & {
+    Header: typeof CardHeader;
+    Title: typeof CardTitle;
+    Description: typeof CardDescription;
+    Action: typeof CardAction;
+    Content: typeof CardContent;
+    Footer: typeof CardFooter;
+};
+declare const Card: CardCompound;
+export { CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, };
 export default Card;

package/dist/components/Card/Card.stories.d.ts

@@ -3,7 +3,8 @@ import { Card } from './';
 declare const meta: Meta<typeof Card>;
 export default meta;
 type Story = StoryObj<typeof Card>;
-export declare const Playground: Story;
-export declare const CardWithIconAndActions: Story;
-export declare const CardWithDropdownHeader: Story;
-export declare const CardWithSaveCancel: Story;
+export declare const Default: Story;
+export declare const AlertsWithScroll: Story;
+export declare const InsightsWithScroll: Story;
+export declare const CommandLogsWithFilterAndSearch: Story;
+export declare const AllCardFeatures: Story;

package/dist/components/Card/Card.styles.d.ts

@@ -1,15 +1,18 @@
 export declare const CardWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $width?: string;
     $height?: string;
+    $padding?: string;
+    $gap?: string;
+    $bordered: boolean;
+    $shadow: boolean;
+    $dividers: boolean;
 }>> & string;
-export declare const CardHeaderWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    $background?: string;
-}>> & string;
-export declare const CardHeaderLeft: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const CardBodyWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    $withImage?: boolean;
-}>> & string;
-export declare const CardBodyContent: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const CardFooterWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    $align: "left" | "center" | "right";
+export declare const CardHeaderCompound: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const CardTitleCompound: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const CardDescriptionCompound: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const CardActionCompound: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const CardContentCompound: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $scrollable?: boolean;
+    $maxHeight?: string;
 }>> & string;
+export declare const CardFooterCompound: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

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

@@ -1,26 +1,35 @@
 import { HTMLAttributes, ReactNode } from 'react';
-export interface CardProps extends HTMLAttributes<HTMLDivElement> {
-    children: ReactNode;
-    className?: string;
+import { TypographyVariant } from '../Typography/Typography';
+export interface CardLayout {
     width?: string | number;
     height?: string | number;
+    padding?: string | number;
+    gap?: string | number;
 }
-export interface CardHeaderProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
-    title?: string | ReactNode;
-    titleSize?: "sm" | "md" | "lg";
-    className?: string;
-    icon?: ReactNode;
-    actions?: ReactNode;
-    background?: string;
+export interface CardOptions {
+    bordered?: boolean;
+    shadow?: boolean;
+    dividers?: boolean;
 }
-export interface CardBodyProps extends HTMLAttributes<HTMLDivElement> {
-    children: ReactNode;
-    className?: string;
-    withImage?: boolean;
-    image?: ReactNode;
+export interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    layout?: CardLayout;
+    options?: CardOptions;
+    children?: ReactNode;
 }
-export interface CardFooterProps extends HTMLAttributes<HTMLDivElement> {
-    children: ReactNode;
-    className?: string;
-    align?: "left" | "center" | "right";
+export interface CardSectionProps extends HTMLAttributes<HTMLDivElement> {
+    children?: ReactNode;
+}
+export interface CardContentProps extends CardSectionProps {
+    scrollable?: boolean;
+    maxHeight?: string | number;
+}
+export interface CardTitleProps extends Omit<HTMLAttributes<HTMLHeadingElement>, "title"> {
+    children?: ReactNode;
+    variant?: TypographyVariant;
+    color?: string;
+}
+export interface CardDescriptionProps extends Omit<HTMLAttributes<HTMLParagraphElement>, "title"> {
+    children?: ReactNode;
+    variant?: TypographyVariant;
+    color?: string;
 }

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

@@ -1,5 +1,2 @@
-export { default as Card } from './Card';
+export { default as Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from './Card';
 export * from './Card.types';
-export { default as CardBody } from './CardBody';
-export { default as CardFooter } from './CardFooter';
-export { default as CardHeader } from './CardHeader';

package/dist/components/Table/Table.stories.d.ts

@@ -9,6 +9,7 @@ export declare const WithTitleAndSearch: Story;
 export declare const WithTitleSearchAndActions: Story;
 export declare const ManageColumns: Story;
 export declare const SortableWithRenderContent: Story;
+export declare const SearchableWithRenderContent: Story;
 export declare const FetchData: Story;
 export declare const WithReactQuery: Story;
 export declare const WithActions: Story;

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

@@ -14,6 +14,7 @@ export interface TableColumn<T = any> {
     key: keyof T | string;
     isLocked?: boolean;
     render?: (value: any, row: T) => ReactNode;
+    searchAccessor?: (row: T) => any;
     sortable?: boolean;
     sortAccessor?: (row: T) => any;
     filterable?: boolean;