@spaziodati/atoka-design-system 9.0.1-beta.0 → 10.0.0

package/AddableItems/AddableItems.d.ts

@@ -0,0 +1,80 @@
+import React from 'react';
+import { ItemAdditionType } from '../ClickableExcludableItem';
+import { NumberToStringFormatterType, PropsWithClassName } from '../Utils/CommonTypes';
+import { ClickableFacetItem } from './ClickableItemList';
+import './AddableItems.scss';
+export declare function extractFacetKeyFromItemValue(key: ClickableFacetItem | string): string;
+export type AddableItemsData<ItemType extends ClickableFacetItem, Extras = Record<string, unknown>> = {
+    count: number;
+    items: ItemType[];
+} & Extras;
+export interface AddableItemsFacetData<ItemType extends ClickableFacetItem, Extras = Record<string, unknown>> {
+    data: AddableItemsData<ItemType, Extras>;
+}
+export type AddableItemsConfig<ItemType extends ClickableFacetItem, Extras = Record<string, unknown>> = {
+    include: ItemType[];
+    exclude?: ItemType[];
+    itemCount?: number;
+    isActive?: boolean;
+} & Extras;
+export interface AddableItemsProps<ItemType extends ClickableFacetItem = ClickableFacetItem, ExtraConfig = Record<string, unknown>, ExtraData = Record<string, unknown>> extends PropsWithClassName {
+    config: AddableItemsConfig<ItemType, ExtraConfig>;
+    facetData: AddableItemsFacetData<ItemType, ExtraData>;
+    /** this function is used to define which key should be used for each item; if not set, `item.value` is used */
+    itemKeyGetter?: (item: ItemType) => string;
+    /** this function pushes the clicked item to the `selected items` list */
+    onAddItem: (item: ItemType, additionType: ItemAdditionType) => void;
+    /** this function removes the clicked item from lists */
+    onRemoveItem: (item: ItemType) => void;
+    /** this function removes all the items from lists */
+    onRemoveAll?: () => void;
+    /** this function renders an additional suggester field */
+    renderSuggester?: () => JSX.Element;
+    /** this function renders one or many additional generic fields */
+    renderModifiers?: () => JSX.Element;
+    /** this is the label on top of the selected items */
+    label?: string;
+    /** this is the label for `removeAll` button */
+    unselectLabel?: string;
+    /** the label used to prefix excluded items */
+    notSuffixLabel?: string;
+    /** an object that contains tooltips info messages for included and excluded items */
+    tooltipMessages?: {
+        [key: string]: string;
+    };
+    /** label for the on-hover include button */
+    includeBtnLabel: string;
+    /** label for the on-hover exclude button */
+    excludeBtnLabel: string;
+    /** this function returns a custom React Node to override the base content of an item */
+    itemContentRenderer?: (item: ItemType) => React.ReactNode;
+    /** this function allows to exclude/include the selected items */
+    onToggleIncludeExclude?: (item: ItemType, isExcluded: boolean) => void;
+    /** this is the message that appears when the list of selectable items will be empty */
+    emptyMessage?: string;
+    /** this function allow to use a custom formatters numbers, generally counts in facets items */
+    countFormatter?: NumberToStringFormatterType;
+    isLoading?: true;
+    /** shows a button on hover that allows the user to select an item as excluded */
+    supportsExclusionHoverButton?: true;
+}
+export interface AddableItemsState {
+    isFirstRender: boolean;
+}
+/**
+ * ### Overview
+ *
+ * The `AddableItems` component is most useful to display a selection list and select many items.
+ * All items selected are commonly used to include these voices on a search.
+ * */
+export declare class AddableItems<ItemType extends ClickableFacetItem> extends React.PureComponent<AddableItemsProps<ItemType>, AddableItemsState> {
+    static displayName: string;
+    constructor(props: AddableItemsProps<ItemType>);
+    componentDidUpdate(): void;
+    private renderItemContent;
+    private getItemContentRenderer;
+    private renderRemovableItemsTitle;
+    private renderRemovableItems;
+    private getEmptyMessage;
+    render(): React.ReactNode;
+}

package/AddableItems/ClickableItemList.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import { ClickableExcludableItemProps, ItemAdditionType } from '../ClickableExcludableItem/ClickableExcludableItem';
+import { PropsWithClassName } from '../Utils';
+import { AddableItemsProps } from '.';
+export declare enum ClickableItemKind {
+    add = 0,
+    remove = 1
+}
+export interface ClickableFacetItem {
+    count?: number;
+    size?: number;
+    label?: string;
+    value: string;
+    key?: string;
+    legalName?: string;
+    type?: string;
+}
+export interface ClickableItemListProps<ItemType extends ClickableFacetItem> extends Pick<AddableItemsProps<ItemType>, 'onToggleIncludeExclude' | 'itemContentRenderer' | 'tooltipMessages' | 'notSuffixLabel' | 'countFormatter' | 'itemKeyGetter' | 'includeBtnLabel' | 'excludeBtnLabel' | 'supportsExclusionHoverButton' | 'emptyMessage'>, Pick<ClickableExcludableItemProps, 'kind'>, PropsWithClassName {
+    items: ItemType[];
+    onClick: (item: ItemType, additionType: ItemAdditionType) => void;
+    supportsExclusionAfterInclusion?: boolean;
+    areItemsExcluded?: boolean;
+    'aria-label': string;
+}
+export declare class ClickableItemList<ItemType extends ClickableFacetItem = ClickableFacetItem> extends React.Component<ClickableItemListProps<ItemType>> {
+    static displayName: string;
+    private getItemKey;
+    private renderItem;
+    private needToShowEmptyMessage;
+    private getItems;
+    render(): JSX.Element;
+}

package/AddableItems/index.d.ts

@@ -0,0 +1,2 @@
+export * from './AddableItems';
+export * from './ClickableItemList';

package/{es37.js → AddableItems/index.js}

@@ -1,9 +1,9 @@
-import { j as jsxRuntimeExports } from "./jsx-runtime-CkWJgiG5.js";
+import { j as jsxRuntimeExports } from "../_shared/jsx-runtime-CkWJgiG5.js";
 import classnames from "classnames";
 import React__default from "react";
-import { B as Button } from "./Button-Bn8PyQFK.js";
-import { T as Text } from "./Text-B4AyT0Tx.js";
-import { a as ClickableItemKind, b as ClickableItemList } from "./ClickableItemList-Cid_9WPj.js";
+import { B as Button } from "../_shared/Button-Bn8PyQFK.js";
+import { T as Text } from "../_shared/Text-B4AyT0Tx.js";
+import { a as ClickableItemKind, b as ClickableItemList } from "../_shared/ClickableItemList-Cid_9WPj.js";
 function extractFacetKeyFromItemValue(key) {
   return typeof key === "object" ? key.value : key;
 }

package/Alert/Alert.d.ts

@@ -0,0 +1,59 @@
+import React from 'react';
+import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
+import './Alert.scss';
+import { PropsWithClassName } from '../Utils';
+import { ButtonProps } from '../Button';
+type AlertVariant = 'danger' | 'success' | 'warning' | 'info';
+declare const titleIcons: Record<AlertVariant, IconDefinition>;
+type OniruLinkProps<ToProp> = {
+    to: ToProp;
+} | {
+    href: string;
+};
+type AlertButtonProps<OwnProps> = OwnProps & PropsWithClassName & Pick<ButtonProps, 'disabled' | 'onClick'> & {
+    children: string;
+    target?: '_blank';
+};
+interface BaseAlertProps extends PropsWithClassName {
+    variant: AlertVariant;
+    title?: string;
+    isDismissible?: boolean;
+    onClose?: () => void;
+    isShown?: boolean;
+}
+interface LinkComponentSpecificProps {
+    withIcon?: true;
+}
+type PropsForLinkComponent<Props, ToProp> = AlertButtonProps<Props> & OniruLinkProps<ToProp> & LinkComponentSpecificProps;
+interface AlertPropsWithWrapper<Props, ToProp> extends BaseAlertProps {
+    LinkComponent: React.ComponentType<PropsForLinkComponent<Props, ToProp>>;
+    buttonOrLinkProps: PropsForLinkComponent<Props, ToProp>;
+}
+interface AlertPropsWithoutWrapper<Props> extends BaseAlertProps {
+    LinkComponent?: undefined;
+    buttonOrLinkProps?: AlertButtonProps<Props> & {
+        to?: never;
+        href?: string;
+        withIcon?: never;
+    };
+}
+type AlertProps<Props, ToProp> = AlertPropsWithWrapper<Props, ToProp> | AlertPropsWithoutWrapper<Props>;
+/**
+ * ### Overview
+ * An alert is a contextual notification which appears in the page to give the user an information regarding their current work. They will remain displayed until dismissed or no longer relevant. There are four types of alerts:
+ *
+ * - Danger: this message indicates a dangerous or potentially negative action that the user must take notice of
+ * - Warning: this alert tells the user to proceed with caution with their actions on the platform
+ * - Success: this message is indicative that the user just performed a successful or positive action
+ * - Info: this alert has the scope of letting the user know about a neutral and informative change or action on Atoka
+ *
+ * ### Best practices
+ * - Use alerts sparingly: if there are too many alerts, the user will end up avoiding them due to cognitive overload and miss important information
+ * - Use alerts to notify the user of information that is either time-sensitive or relevant to the action the user is performing
+ * - Keep the text informative but not too long
+ */
+declare function Alert<Props, ToProp>({ variant, title, isDismissible, onClose, isShown, buttonOrLinkProps, className, children, LinkComponent, }: React.PropsWithChildren<AlertProps<Props, ToProp>>): JSX.Element;
+declare namespace Alert {
+    var displayName: string;
+}
+export { Alert, type AlertVariant, type AlertProps, type AlertButtonProps, type OniruLinkProps, type PropsForLinkComponent, titleIcons, };

package/Alert/index.d.ts

@@ -0,0 +1 @@
+export * from './Alert';

package/Alert/index.js

@@ -0,0 +1,5 @@
+import { A, t } from "../_shared/Alert-DfrkiukZ.js";
+export {
+  A as Alert,
+  t as titleIcons
+};

package/Badge/Badge.d.ts

@@ -0,0 +1,42 @@
+import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
+import React from 'react';
+import { BadgeProps as BsBadgeProps } from 'react-bootstrap/Badge';
+import { ColorName } from '../Utils/Style';
+import './Badge.scss';
+export type BadgeVariant = 'primary' | 'secondary' | 'tertiary';
+export type BadgeSizes = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+export type BadgeColor = Extract<ColorName, 'error' | 'highEmphasis' | 'info' | 'lowEmphasis' | 'mediumEmphasis' | 'primary' | 'success' | 'warning'> | 'pink' | 'yellow';
+export type BadgeProps = BsBadgeProps & {
+    icon?: IconDefinition;
+    size?: BadgeSizes;
+    disabled?: true;
+} /**
+ * Variant defines the form of the badge.
+ */ & ({
+    variant: Extract<BadgeVariant, 'primary' | 'secondary'>;
+    color: BadgeColor;
+} | {
+    variant: Extract<BadgeVariant, 'tertiary'>;
+    color: Extract<BadgeColor, 'success' | 'warning' | 'error'>;
+});
+/**
+ * ### Overview
+ *
+ * A `Badge` is a component which represents an attribute of a specific element. There are three types of badges:
+ *
+ * - **Primary** is used for:
+ *  - Sales funnel states
+ *  - Indication of customer divisions
+ *  - Variant with icon: used to show user state in settings page
+ *
+ * - **Secondary** is used for:
+ *  - specific company types e.g. startup
+ *  - Indication of customer divisions
+ *  - Variant with icon: used to show division permissions
+ *
+ * - **Tertiary** is used to display a company’s state
+ *
+ * Note: color should be left undefined when `Badge` needs to inherit color properties from outside.
+ */
+declare const Badge: React.FC<React.PropsWithChildren<BadgeProps>>;
+export { Badge };

package/Badge/index.d.ts

@@ -0,0 +1 @@
+export * from './Badge';

package/Badge/index.js

@@ -0,0 +1,4 @@
+import { B } from "../_shared/Badge-BZz9-F86.js";
+export {
+  B as Badge
+};

package/Bs4V3Wrapper/Bs4V3Wrapper.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import './Bs4V3Wrapper.scss';
+import { PropsWithClassName } from '../Utils';
+export declare class Bs4V3Wrapper extends React.PureComponent<React.PropsWithChildren<PropsWithClassName>> {
+    static displayName: string;
+    render(): React.ReactNode;
+}

package/Bs4V3Wrapper/StoryWrapper.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export interface StoryWrapperProps {
+    span?: number;
+    offset?: number;
+    style?: React.CSSProperties;
+    fluid?: boolean;
+}
+export declare const StoryWrapper: React.FC<React.PropsWithChildren<StoryWrapperProps>>;

package/Bs4V3Wrapper/index.d.ts

@@ -0,0 +1 @@
+export { Bs4V3Wrapper } from './Bs4V3Wrapper';

package/Bs4V3Wrapper/index.js

@@ -0,0 +1,4 @@
+import { B } from "../_shared/Bs4V3Wrapper-BKRW0pvE.js";
+export {
+  B as Bs4V3Wrapper
+};

package/BubbleChart/BubbleChart.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { ComputedDatum } from '@nivo/circle-packing';
+import { DataPoint, PropsWithClassName } from '../Utils/CommonTypes';
+import { BubbleChartCommonProps } from './BubbleChartUI';
+export type BubbleChartTooltip = (props: ComputedDatum<BubbleChartDataPoint>) => JSX.Element;
+export interface BubbleChartDataPoint extends Record<string, unknown>, DataPoint {
+    significance?: number;
+    children?: BubbleChartDataPoint[];
+}
+export type BubbleChartProps = PropsWithClassName & BubbleChartCommonProps & {
+    data: BubbleChartDataPoint[];
+    colors?: string[];
+    labelSkipRadius?: number;
+    otherId: string;
+    maxBubbleNumber?: number;
+};
+/**
+ * ### Overview
+ *
+ * The `BubbleChart` is most useful to display large sets of data.
+ * Please note this chart is not suited for tree data structures.
+ * Circle colors and size by default derive from the `significance`
+ * prop of a given `datapoint`.
+ * */
+export declare class BubbleChart extends React.Component<BubbleChartProps> {
+    static defaultDataValueKey: string;
+    static displayName: string;
+    shouldComponentUpdate(nextProps: BubbleChartProps): boolean;
+    static defaultProps: Partial<BubbleChartProps>;
+    private getComponentSetup;
+    private computeColors;
+    render(): React.ReactNode;
+}

package/BubbleChart/BubbleChartUI.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import { Dimensions } from '@nivo/core';
+import { NumberToStringFormatterType, PropsWithClassName } from '../Utils/CommonTypes';
+import { BubbleChartDataPoint, BubbleChartTooltip } from './BubbleChart';
+export type BubbleChartCommonProps = {
+    renderTooltip: BubbleChartTooltip;
+    id: string;
+    chartRef?: React.RefObject<HTMLDivElement>;
+    numberToStringFormatter: NumberToStringFormatterType;
+    dataValueKey?: string;
+    size?: Partial<Dimensions>;
+    isCanvas?: boolean;
+    total?: number;
+    fontSize?: number;
+};
+export type BubbleChartUIProps = PropsWithClassName & BubbleChartCommonProps & {
+    data: BubbleChartDataPoint;
+    colors?: Record<string, string>;
+    labelSkipRadius: number;
+};
+export declare class BubbleChartUI extends React.PureComponent<React.PropsWithChildren<BubbleChartUIProps>> {
+    static displayName: string;
+    static ESTIMATED_LETTER_PIXELS: number;
+    private defaultLayers;
+    static defaultProps: Partial<BubbleChartUIProps>;
+    private getEllipsedLabel;
+    private renderColor;
+    private getLabel;
+    private renderContent;
+    render(): React.ReactNode;
+}

package/BubbleChart/index.d.ts

@@ -0,0 +1,2 @@
+export * from './BubbleChart';
+export type { ComputedDatum } from '@nivo/circle-packing';

package/{es38.js → BubbleChart/index.js}

@@ -1,13 +1,13 @@
-import { j as jsxRuntimeExports } from "./jsx-runtime-CkWJgiG5.js";
+import { j as jsxRuntimeExports } from "../_shared/jsx-runtime-CkWJgiG5.js";
 import React__default from "react";
-import { e as blue300, d as blue30, n as generateRangeColor } from "./Style-CSNnkrg3.js";
-import "./StatisticsTooltip-7DgI4Yoj.js";
-import { g as getRenderStatisticsTooltip } from "./helpers-DbJ4Yobs.js";
-import { c as createDataWithOtherSlice } from "./Statistics-Coxe2jk5.js";
-import { d as deepEqual, s as sortObjDesc } from "./Utils-CXFvxozf.js";
+import { e as blue300, d as blue30, n as generateRangeColor } from "../_shared/Style-CSNnkrg3.js";
+import "../_shared/StatisticsTooltip-7DgI4Yoj.js";
+import { g as getRenderStatisticsTooltip } from "../_shared/helpers-DbJ4Yobs.js";
+import { c as createDataWithOtherSlice } from "../_shared/Statistics-Coxe2jk5.js";
+import { d as deepEqual, s as sortObjDesc } from "../_shared/Utils-CXFvxozf.js";
 import { ResponsiveCirclePackingCanvas, ResponsiveCirclePacking } from "@nivo/circle-packing";
 import classnames from "classnames";
-import { e as ellipse } from "./Text-CfPEdZ8Z.js";
+import { e as ellipse } from "../_shared/Text-CfPEdZ8Z.js";
 class BubbleChartUI extends React__default.PureComponent {
   static displayName = "BubbleChartUI";
   static ESTIMATED_LETTER_PIXELS = 6.2;

package/Button/Button.d.ts

@@ -0,0 +1,27 @@
+import React, { SyntheticEvent } from 'react';
+import { ButtonProps as BsButtonProps } from 'react-bootstrap/Button';
+import './Button.scss';
+import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
+import { PropsWithClassName } from '../Utils';
+type ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'tertiary-danger' | 'danger' | 'primary-warning' | 'primary-white' | 'primary-danger' | 'primary-violet';
+type ButtonSize = 'xxs' | 'xs' | 'sm' | 'md' | 'lg';
+export type OriginalButtonProps = Omit<BsButtonProps, 'variant' | 'size'>;
+interface ButtonProps extends PropsWithClassName, OriginalButtonProps {
+    variant: ButtonVariant;
+    size: ButtonSize;
+    icon?: IconDefinition;
+    iconLeft?: IconDefinition;
+    iconRight?: IconDefinition;
+    onClick?: (e?: SyntheticEvent) => void;
+}
+declare class Button extends React.PureComponent<React.PropsWithChildren<ButtonProps>> {
+    static displayName: string;
+    static defaultProps: Partial<ButtonProps>;
+    private renderIcon;
+    private renderChildren;
+    private renderLeftSide;
+    private renderRightSide;
+    private renderContent;
+    render(): React.ReactNode;
+}
+export { Button, type ButtonVariant, type ButtonSize, type ButtonProps as ButtonProps };

package/Button/Button.storiesConfig.d.ts

@@ -0,0 +1,58 @@
+export declare const config: {
+    argTypes: {
+        onClick: {
+            action: string;
+            table: {
+                category: string;
+            };
+        };
+        icon: {
+            control: {
+                disable: boolean;
+            };
+            table: {
+                category: string;
+            };
+        };
+        iconLeft: {
+            control: {
+                disable: boolean;
+            };
+            table: {
+                category: string;
+            };
+        };
+        iconRight: {
+            control: {
+                disable: boolean;
+            };
+            table: {
+                category: string;
+            };
+        };
+        href: {
+            control: {
+                disable: boolean;
+            };
+            table: {
+                category: string;
+            };
+        };
+        target: {
+            control: {
+                disable: boolean;
+            };
+            table: {
+                category: string;
+            };
+        };
+        className: {
+            control: {
+                disable: boolean;
+            };
+            table: {
+                category: string;
+            };
+        };
+    };
+};

package/Button/index.d.ts

@@ -0,0 +1 @@
+export * from './Button';

package/Button/index.js

@@ -0,0 +1,4 @@
+import { B } from "../_shared/Button-Bn8PyQFK.js";
+export {
+  B as Button
+};

package/ButtonDropdown/ButtonDropdown.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import './ButtonDropdown.scss';
+import { Button } from '../Button';
+import { ButtonProps } from '../Button/Button';
+interface ButtonDropdownState {
+    isButtonDropdownOpen: boolean;
+}
+export interface ButtonDropdownProps extends Omit<ButtonProps, 'onClick' | 'iconRight' | 'block' | 'variant'> {
+    toggleText: React.ReactNode;
+}
+export declare class ButtonDropdown extends React.Component<ButtonDropdownProps, ButtonDropdownState> {
+    static displayName: string;
+    static defaultProps: typeof Button.defaultProps;
+    private wrapperRef;
+    state: ButtonDropdownState;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    private handleClickOutside;
+    private onToggle;
+    private renderChildren;
+    render(): React.ReactNode;
+}
+export {};

package/ButtonDropdown/index.d.ts

@@ -0,0 +1,2 @@
+import { ButtonDropdown } from './ButtonDropdown';
+export { ButtonDropdown };

package/{es39.js → ButtonDropdown/index.js}

@@ -1,9 +1,9 @@
-import { j as jsxRuntimeExports } from "./jsx-runtime-CkWJgiG5.js";
+import { j as jsxRuntimeExports } from "../_shared/jsx-runtime-CkWJgiG5.js";
 import React__default from "react";
 import classnames from "classnames";
 import { faChevronUp } from "@fortawesome/pro-light-svg-icons/faChevronUp";
 import { faChevronDown } from "@fortawesome/pro-light-svg-icons/faChevronDown";
-import { B as Button } from "./Button-Bn8PyQFK.js";
+import { B as Button } from "../_shared/Button-Bn8PyQFK.js";
 class ButtonDropdown extends React__default.Component {
   static displayName = "ButtonDropdown";
   static defaultProps = Button.defaultProps;

package/CardsPage/CardsPage.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { CardsPageTabContent } from './CardsPageTabContent';
+import { CardsPageTabSwitcher } from './CardsPageTabSwitcher';
+import { CardsPageHeader } from './CardsPageHeader';
+import './CardsPage.scss';
+export declare class CardsPage extends React.PureComponent<{
+    children?: React.ReactNode;
+}> {
+    static displayName: string;
+    static Header: typeof CardsPageHeader;
+    static TabSwitcher: typeof CardsPageTabSwitcher;
+    static TabContent: typeof CardsPageTabContent;
+    render(): React.ReactNode;
+}

package/CardsPage/CardsPageActions.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const CardsPageActions: React.FC<{
+    children?: React.ReactNode;
+}>;

package/CardsPage/CardsPageCards.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { LayoutModeVariants } from './CardsPageLayoutMode';
+export interface CardsPageCardsProps {
+    emptyStateMessage: string;
+    layoutMode?: LayoutModeVariants;
+    headerLabel?: React.ReactNode;
+    rowContentLabels?: React.ReactNode[];
+    hasRowActions?: boolean;
+}
+export declare const CardsPageCards: React.FC<React.PropsWithChildren<CardsPageCardsProps>>;

package/CardsPage/CardsPageCardsCounter.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface CardsPageCardsCounterProps {
+    label: string;
+    count?: number;
+}
+export declare const CardsPageCardsCounter: React.FC<React.PropsWithChildren<CardsPageCardsCounterProps>>;

package/CardsPage/CardsPageFilters.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './CardsPageFilters.scss';
+export declare const CardsPageFilters: React.FC<{
+    children?: React.ReactNode;
+}>;

package/CardsPage/CardsPageFullText.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './CardsPageFilters.scss';
+export declare const CardsPageFullText: React.FC<{
+    children?: React.ReactNode;
+}>;

package/CardsPage/CardsPageHeader.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { CardsPageTitle } from './CardsPageTitle';
+import { CardsPageSubtitle } from './CardsPageSubtitle';
+import { CardsPageActions } from './CardsPageActions';
+export declare class CardsPageHeader extends React.PureComponent<{
+    children?: React.ReactNode;
+}> {
+    static displayName: string;
+    static Title: typeof CardsPageTitle;
+    static Subtitle: typeof CardsPageSubtitle;
+    static Actions: typeof CardsPageActions;
+    render(): React.ReactNode;
+}

package/CardsPage/CardsPageLayoutMode.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import './CardsPageLayoutMode.scss';
+export type LayoutModeVariants = 'grid' | 'list';
+export interface CardsPageLayoutModeProps {
+    selected: LayoutModeVariants;
+    onSet: (layoutMode: LayoutModeVariants) => void;
+    isDisabled?: boolean;
+}
+export declare class CardsPageLayoutMode extends React.PureComponent<React.PropsWithChildren<CardsPageLayoutModeProps>> {
+    static displayName: string;
+    render(): React.ReactNode;
+}

package/CardsPage/CardsPageSelectionActions.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import './CardsPageSelectionAction.scss';
+export interface CardsPageSelectionActionsProps {
+    onCancel: () => void;
+    onSelectAll: () => void;
+    onUnselectAll: () => void;
+    areItemsSelectable: boolean;
+    isDisabled?: boolean;
+    selectAllLabel: string;
+    unselectAllLabel: string;
+    cancelLabel: string;
+    title: string;
+}
+export declare class CardsPageSelectionActions extends React.PureComponent<React.PropsWithChildren<CardsPageSelectionActionsProps>> {
+    static displayName: string;
+    render(): React.ReactNode;
+}

package/CardsPage/CardsPageSelectionToggler.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export interface CardsPageSelectionTogglerProps {
+    onToggle: () => void;
+    isChecked: boolean;
+    label: string;
+    isDisabled?: boolean;
+}
+export declare const CardsPageSelectionToggler: React.FC<React.PropsWithChildren<CardsPageSelectionTogglerProps>>;

package/CardsPage/CardsPageSorting.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { PropsWithClassName, OptionData } from '../Utils';
+export type OptionType = Record<string, string> | OptionData[];
+export interface CardsPageSortingProps extends PropsWithClassName {
+    label?: string;
+    sortValue: string;
+    onSortValueSelect: (sortValue: string) => void;
+    options: OptionType;
+    isDisabled?: boolean;
+}
+export declare class CardsPageSorting extends React.PureComponent<React.PropsWithChildren<CardsPageSortingProps>> {
+    static displayName: string;
+    private getOptions;
+    render(): React.ReactNode;
+}

package/CardsPage/CardsPageSubtitle.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const CardsPageSubtitle: React.FC<{
+    children?: React.ReactNode;
+}>;