@popsure/dirty-swan 20.0.11 → 27.0.2

package/dist/lib/components/button/index.d.ts

@@ -9,5 +9,5 @@ declare const _default: React.ForwardRefExoticComponent<Pick<{
     buttonType?: ButtonType | undefined;
     leftIcon?: Icon | undefined;
     loading?: boolean | undefined;
-} & Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children">, "title" | "form" | "slot" | "style" | "hidden" | "value" | "onChange" | "className" | "dir" | "onBlur" | "onFocus" | "onKeyDown" | "tabIndex" | "onDragEnter" | "onDragOver" | "onDragLeave" | "leftIcon" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "loading" | "buttonTitle" | "buttonType"> & React.RefAttributes<unknown>>;
+} & Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children">, "hidden" | "title" | "className" | "form" | "slot" | "style" | "value" | "onChange" | "dir" | "onBlur" | "onFocus" | "onKeyDown" | "tabIndex" | "onDragEnter" | "onDragOver" | "onDragLeave" | "leftIcon" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "disabled" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "loading" | "buttonTitle" | "buttonType"> & React.RefAttributes<HTMLButtonElement>>;
 export default _default;

package/dist/lib/components/cards/cardButton/index.d.ts

@@ -0,0 +1,16 @@
+import { FormEvent, ReactNode } from 'react';
+interface Props {
+    title: string;
+    description: string | ReactNode;
+    disabled?: boolean;
+    className?: string;
+}
+declare type ActionProps = {
+    href: string;
+    onClick?: (e: FormEvent) => void;
+} | {
+    href?: string;
+    onClick: (e: FormEvent) => void;
+};
+declare const CardButton: ({ title, description, disabled, onClick, href, className, }: Props & ActionProps) => JSX.Element;
+export default CardButton;

package/dist/lib/components/cards/cardWithLeftIcon/index.d.ts

@@ -1,13 +1,13 @@
 /// <reference types="react" />
 import { CardProps } from '..';
 import { Icon } from '../icons';
-declare const _default: ({ className, title, titleSize, children, leftIcon, rightIcon, state, dropshadow, ...props }: {
+declare const _default: ({ className, title, cardSize, children, leftIcon, rightIcon, state, dropshadow, ...props }: {
     title: string;
     children: import("react").ReactNode;
     state?: ("actionable" | "static" | "muted") | undefined;
     dropshadow?: boolean | undefined;
 } & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    titleSize?: "big" | "small" | "medium" | undefined;
+    cardSize?: "big" | "small" | "xsmall" | "medium" | undefined;
     leftIcon?: Icon | undefined;
     rightIcon?: Icon | "arrow" | undefined;
 }) => JSX.Element;

package/dist/lib/components/cards/cardWithTopIcon/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { CardProps } from '..';
 import { Icon, IconSize } from '../icons';
-declare const _default: ({ className, title, titleSize, children, topIcon, topIconSize, rightIcon, state, dropshadow, ...props }: {
+declare const _default: ({ className, title, cardSize, children, topIcon, topIconSize, rightIcon, state, dropshadow, ...props }: {
     title: string;
     children: import("react").ReactNode;
     state?: ("actionable" | "static" | "muted") | undefined;
@@ -9,7 +9,7 @@ declare const _default: ({ className, title, titleSize, children, topIcon, topIc
 } & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
     topIcon: Icon;
     topIconSize: IconSize;
-    titleSize?: "big" | "small" | "medium" | undefined;
+    cardSize?: "big" | "small" | "medium" | undefined;
     rightIcon?: Icon | "arrow" | undefined;
 }) => JSX.Element;
 export default _default;

package/dist/lib/components/cards/cardWithTopLeftIcon/index.d.ts

@@ -1,13 +1,13 @@
 /// <reference types="react" />
 import { CardProps } from '..';
 import { Icon } from '../icons';
-declare const _default: ({ className, title, titleSize, children, leftIcon, rightIcon, state, dropshadow, ...props }: {
+declare const _default: ({ className, title, cardSize, children, leftIcon, rightIcon, state, dropshadow, ...props }: {
     title: string;
     children: import("react").ReactNode;
     state?: ("actionable" | "static" | "muted") | undefined;
     dropshadow?: boolean | undefined;
 } & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    titleSize?: "big" | "small" | "xsmall" | "medium" | undefined;
+    cardSize?: "big" | "small" | "xsmall" | "medium" | undefined;
     leftIcon?: Icon | "logo" | undefined;
     rightIcon?: Icon | "arrow" | undefined;
 }) => JSX.Element;

package/dist/lib/components/cards/icons/index.d.ts

@@ -9,4 +9,5 @@ export interface IconSize {
 declare const arrowRight: Icon;
 declare const featherLogo: Icon;
 declare const info: Icon;
-export { arrowRight, featherLogo, info };
+declare const chevronRight: Icon;
+export { arrowRight, featherLogo, info, chevronRight };

package/dist/lib/components/cards/index.d.ts

@@ -3,6 +3,7 @@ import CardWithTopLeftIcon from './cardWithTopLeftIcon';
 import CardWithLeftIcon from './cardWithLeftIcon';
 import CardWithTopIcon from './cardWithTopIcon';
 import InfoCard from './infoCard';
+import CardButton from './cardButton';
 declare type CardState = 'actionable' | 'static' | 'muted';
 export declare type CardProps = {
     title: string;
@@ -10,6 +11,6 @@ export declare type CardProps = {
     state?: CardState;
     dropshadow?: boolean;
 } & JSX.IntrinsicElements['div'];
-export declare const headingForTitleSize: (titleSize: 'xsmall' | 'small' | 'medium' | 'big') => string;
+export declare const headingForCardSize: (cardSize: 'xsmall' | 'small' | 'medium' | 'big') => string;
 export declare const associatedClassForCardState: (state: CardState, dropshadow: boolean) => string;
-export { CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard };
+export { CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, };

package/dist/lib/components/comparisonTable/components/Chevron.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const Chevron: ({ className }: {
+    className?: string | undefined;
+}) => JSX.Element;
+export default Chevron;

package/dist/lib/components/comparisonTable/components/Row/index.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { Cell } from '../../index';
+interface RowProps<T> {
+    cell: Cell<T>;
+    data: Array<T>;
+    isRowHeader?: boolean;
+    rowId: string;
+}
+declare const _default: <T extends {
+    id: number;
+}>(props: RowProps<T>) => JSX.Element;
+export default _default;

package/dist/lib/components/comparisonTable/components/TableArrows/Arrow.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const ArrowIcon: ({ className }: {
+    className?: string | undefined;
+}) => JSX.Element;
+export default ArrowIcon;

package/dist/lib/components/comparisonTable/components/TableArrows/index.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { ActiveTableArrows } from '../../hooks/useActiveTableArrows';
+export declare type ArrowValues = 'prev' | 'next';
+interface TableArrowsProps {
+    onClick: (value: ArrowValues) => void;
+    active: ActiveTableArrows;
+}
+declare const TableArrows: (props: TableArrowsProps) => JSX.Element;
+export default TableArrows;

package/dist/lib/components/comparisonTable/components/TableInfoButton/index.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const TableInfoButton: ({ onClick, className, }: {
+    onClick: () => void;
+    className?: string | undefined;
+}) => JSX.Element;
+export default TableInfoButton;

package/dist/lib/components/comparisonTable/components/TableRating/StarIcon.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const StarIcon: ({ className }: {
+    className: string;
+}) => JSX.Element;
+export default StarIcon;

package/dist/lib/components/comparisonTable/components/TableRating/ZapIcon.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const ZapIcon: ({ className }: {
+    className: string;
+}) => JSX.Element;
+export default ZapIcon;

package/dist/lib/components/comparisonTable/components/TableRating/index.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+declare type RatingTypes = 'star' | 'zap';
+interface TableRatingProps {
+    type: RatingTypes;
+    rating: number;
+}
+declare const TableRating: (props: TableRatingProps) => JSX.Element;
+export default TableRating;

package/dist/lib/components/comparisonTable/components/TableRowHeader/index.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+declare const TableRowHeader: (props: {
+    label: string;
+    icon?: string | undefined;
+    subtitle?: string | undefined;
+    onClickInfo?: (() => void) | undefined;
+}) => JSX.Element;
+export default TableRowHeader;

package/dist/lib/components/comparisonTable/components/TableTrueFalse.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const TableTrueFalse: ({ value, className, }: {
+    value: boolean;
+    className?: string | undefined;
+}) => JSX.Element;
+export default TableTrueFalse;

package/dist/lib/components/comparisonTable/hooks/useActiveTableArrows.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface ActiveTableArrows {
+    left: boolean;
+    right: boolean;
+}
+export declare const useActiveTableArrows: () => {
+    activeArrows: ActiveTableArrows;
+    contentContainerRef: React.Ref<HTMLDivElement>;
+    contentWrapperRef: React.Ref<HTMLDivElement>;
+};

package/dist/lib/components/comparisonTable/index.d.ts

@@ -0,0 +1,45 @@
+import React from 'react';
+import TableRating from './components/TableRating';
+import TableTrueFalse from './components/TableTrueFalse';
+import TableRowHeader from './components/TableRowHeader';
+import TableInfoButton from './components/TableInfoButton';
+export interface CellBaseProps<T> {
+    /** Used to display the row's title */
+    label?: React.ReactNode;
+    /**
+     *
+     * @param value The current data value
+     * @param element The complete data object
+     */
+    render?: (value: any, element: T) => React.ReactNode;
+}
+interface CellWithId<T> extends CellBaseProps<T> {
+    /** Used when adding component add-ons */
+    addonId: string | number;
+}
+export declare type Cell<T> = ({
+    key: Extract<keyof T, string>;
+} & CellBaseProps<T>) | ({
+    key?: undefined;
+} & CellWithId<T>);
+export interface TableHeader<T> {
+    /** Required unique id number for each table group */
+    id: number;
+    /** Used to display a table group subheader */
+    label?: React.ReactNode;
+    cells: Array<Cell<T>>;
+    default?: boolean;
+}
+export interface ComparisonTableProps<T> {
+    headers: Array<TableHeader<T>>;
+    data: Array<T>;
+    hideDetails?: boolean;
+    styles?: {
+        header?: string;
+        container?: string;
+    };
+}
+declare const ComparisonTable: <T extends {
+    id: number;
+}>(props: ComparisonTableProps<T>) => JSX.Element;
+export { ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableInfoButton, };

package/dist/lib/components/downloadButton/index.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { DownloadStatus } from '../../models/download';
+interface Props {
+    downloadStatus: DownloadStatus;
+    onDownload: () => void;
+    className?: string;
+    customFail?: React.ReactNode;
+}
+declare const DownloadButton: ({ downloadStatus, onDownload, className, customFail, }: Props) => JSX.Element;
+export default DownloadButton;

package/dist/lib/components/input/autoSuggestInput/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { Option } from '../../../models/autoSuggestInput';
-declare const _default: ({ currentOption, suggestions, handleSuggestionSelected, onChange, handleSuggestionFetchRequest, handleSuggestionClearRequest, placeholder, className, }: {
+declare const _default: ({ currentOption, suggestions, handleSuggestionSelected, onChange, handleSuggestionFetchRequest, handleSuggestionClearRequest, placeholder, className, wrapText, }: {
     currentOption: string;
     suggestions: Option[];
     handleSuggestionSelected: (value: Option) => void;
@@ -9,5 +9,6 @@ declare const _default: ({ currentOption, suggestions, handleSuggestionSelected,
     handleSuggestionClearRequest: () => void;
     placeholder: string;
     className?: string | undefined;
+    wrapText?: boolean | undefined;
 }) => JSX.Element;
 export default _default;

package/dist/lib/components/input/autoSuggestMultiSelect/index.d.ts

@@ -1,11 +1,12 @@
 /// <reference types="react" />
 import { Option } from '../../../models/autoSuggestInput';
-declare const _default: ({ options, selectedValues, setValues, placeholder, chipsListClassName, multiSelectClassName, }: {
+declare const _default: ({ options, selectedValues, setValues, placeholder, chipsListClassName, multiSelectClassName, wrapText, }: {
     options: Option[];
     selectedValues?: Option[] | undefined;
     setValues: (values: Option[]) => void;
     placeholder: string;
     chipsListClassName?: string | undefined;
     multiSelectClassName?: string | undefined;
+    wrapText?: boolean | undefined;
 }) => JSX.Element;
 export default _default;

package/dist/lib/components/input/index.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
 export declare type InputProps = {
-    hasError?: boolean;
+    error?: string;
     prefix?: string;
 } & Omit<JSX.IntrinsicElements['input'], 'enterKeyHint'> & Partial<Pick<JSX.IntrinsicElements['input'], 'enterKeyHint'>>;
 declare const _default: React.ForwardRefExoticComponent<Pick<{
-    hasError?: boolean | undefined;
+    error?: string | undefined;
     prefix?: string | undefined;
-} & Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "enterKeyHint"> & Partial<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "enterKeyHint">>, "title" | "children" | "form" | "slot" | "style" | "pattern" | "hidden" | "value" | "onChange" | "className" | "dir" | "onBlur" | "onFocus" | "onKeyDown" | "tabIndex" | "multiple" | "onDragEnter" | "onDragOver" | "onDragLeave" | "list" | "step" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "enterKeyHint" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "max" | "maxLength" | "min" | "minLength" | "name" | "readOnly" | "required" | "size" | "src" | "type" | "width" | "hasError"> & React.RefAttributes<HTMLInputElement>>;
+} & Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "enterKeyHint"> & Partial<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "enterKeyHint">>, "error" | "hidden" | "title" | "children" | "className" | "form" | "slot" | "style" | "pattern" | "value" | "onChange" | "dir" | "onBlur" | "onFocus" | "onKeyDown" | "tabIndex" | "multiple" | "onDragEnter" | "onDragOver" | "onDragLeave" | "list" | "step" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "disabled" | "enterKeyHint" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "max" | "maxLength" | "min" | "minLength" | "name" | "readOnly" | "required" | "size" | "src" | "type" | "width"> & React.RefAttributes<HTMLInputElement>>;
 export default _default;

package/dist/lib/components/modal/bottomModal/index.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { Props } from '..';
-declare const _default: ({ title, isOpen, children, onClose }: Props) => JSX.Element;
+declare const _default: ({ title, isOpen, children, onClose, className, dismissible, }: Props) => JSX.Element;
 export default _default;

package/dist/lib/components/modal/hooks/useOnClose.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare const useOnClose: (onClose: () => void, isOpen: boolean, dismissable: boolean) => {
+    isClosing: boolean;
+    handleContainerClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    handleOnClose: () => void;
+};
+export default useOnClose;

package/dist/lib/components/modal/index.d.ts

@@ -7,5 +7,7 @@ export interface Props {
     isOpen: boolean;
     children: React.ReactNode;
     onClose: () => void;
+    className?: string;
+    dismissible?: boolean;
 }
 export { BottomModal, RegularModal, BottomOrRegularModal };

package/dist/lib/components/modal/regularModal/index.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { Props } from '..';
-declare const _default: ({ title, isOpen, children, onClose }: Props) => JSX.Element;
+declare const _default: ({ title, isOpen, children, onClose, className, dismissible, }: Props) => JSX.Element;
 export default _default;

package/dist/lib/components/segmentedControl/index.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+interface TitleWithSubtitle {
+    title: string;
+    subtitle: string;
+}
+declare const SegmentedControl: ({ className, values, selectedIndex, onChange, }: {
+    className?: string | undefined;
+    values: Array<TitleWithSubtitle> | Array<string>;
+    selectedIndex: number;
+    onChange: (selectedIndex: number) => void;
+}) => JSX.Element;
+export default SegmentedControl;

package/dist/lib/index.d.ts

@@ -5,13 +5,18 @@ import AutocompleteAddress from './components/autocompleteAddress';
 import Input from './components/input';
 import MultiDropzone from './components/multiDropzone';
 import DownloadRing from './components/downloadRing';
+import DownloadButton from './components/downloadButton';
 import IbanInput from './components/input/iban';
 import CurrencyInput from './components/input/currency';
 import { BottomModal, RegularModal, BottomOrRegularModal } from './components/modal';
-import { CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard } from './components/cards';
+import { CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton } from './components/cards';
 import Button from './components/button';
 import AutoSuggestMultiSelect from './components/input/autoSuggestMultiSelect';
 import Chip from './components/chip';
 import AutoSuggestInput from './components/input/autoSuggestInput';
-export { DateSelector, Dropzone, SignaturePad, AutocompleteAddress, Input, MultiDropzone, DownloadRing, IbanInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, Button, CurrencyInput, AutoSuggestMultiSelect, Chip, AutoSuggestInput, };
+import { ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableInfoButton, TableHeader } from './components/comparisonTable';
+import SegmentedControl from './components/segmentedControl';
+export { DateSelector, Dropzone, SignaturePad, AutocompleteAddress, Input, MultiDropzone, DownloadRing, DownloadButton, IbanInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, Button, CurrencyInput, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableInfoButton, SegmentedControl, };
+export type { TableHeader };
 export type { DownloadRingDownloadStatus } from './models/downloadRing';
+export type { DownloadStatus } from './models/download';

package/dist/lib/models/download.d.ts

@@ -0,0 +1 @@
+export declare type DownloadStatus = 'INITIAL' | 'GENERATING' | 'COMPLETED' | 'FAILED';

package/dist/lib/scss/private/_reset.scss

@@ -78,7 +78,11 @@ summary,
 time,
 mark,
 audio,
-video {
+video,
+input,
+select,
+button,
+textarea {
   margin: 0;
   padding: 0;
   border: 0;
@@ -143,3 +147,8 @@ input[type='number']::-webkit-outer-spin-button {
   -webkit-appearance: none;
   margin: 0;
 }
+
+/* Firefox */
+input[type='number'] {
+  -moz-appearance: textfield;
+}

package/dist/lib/scss/private/base/_border_radius.scss

@@ -0,0 +1,15 @@
+$border_sizes: 0, 2, 4, 8, 12, 16, 24;
+
+@each $size in $border_sizes {
+  .br#{$size} {
+    border-radius: $size * 1px;
+  }
+}
+
+.br-circle {
+  border-radius: 50%;
+}
+
+.br-pill {
+  border-radius: 999px;
+}

package/dist/lib/scss/private/base/_display.scss

@@ -29,3 +29,7 @@
 .d-none {
   display: none !important;
 }
+
+.d-grid {
+  display: grid !important;
+}

package/dist/lib/scss/private/base/_grid.scss

@@ -14,3 +14,47 @@
     margin: 0 auto;
   }
 }
+
+.p-container {
+  max-width: 928px; // 896px + 2 * 16px padding
+  padding-left: 16px;
+  padding-right: 16px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+// Taken from https://gist.github.com/Bamieh/912a6f0b63cbb53f3ad0bd8df7171c6a
+@function remove-dot-from-class($class) {
+  $class-string: quote($class);
+  @return if(
+    str-slice($class-string, 0, 1) == '.',
+    str-slice($class-string, 2, str-length($class-string)),
+    $class-string
+  );
+}
+
+@mixin add-responsive {
+  $selector: remove-dot-from-class(#{&});
+  @content;
+
+  // We need to use @at-root to prevent the following rules to be nested inside the selector
+  @at-root {
+    .sm\:#{$selector} {
+      @include grid.p-size-mobile {
+        @content;
+      }
+    }
+
+    .md\:#{$selector} {
+      @include grid.p-size-tablet {
+        @content;
+      }
+    }
+
+    .lg\:#{$selector} {
+      @include grid.p-size-desktop {
+        @content;
+      }
+    }
+  }
+}

package/dist/lib/scss/private/base/_index.scss

@@ -1,8 +1,10 @@
 @forward "display";
 @forward "shadows";
+@forward "flex/flex";
 @forward "grid";
 @forward "spacing";
 @forward "width_and_height";
 @forward "colors";
 @forward "typography";
 @forward "cursors";
+@forward "border_radius";