@dexma/ui-components 6.8.1 → 7.0.0

package/dist/lib/styles/Select/StyledSelect.d.ts

@@ -0,0 +1,98 @@
+import { DefaultTheme } from 'styled-components';
+import { Theme } from '../../utils/theme';
+
+export declare const hexToRGBA: (hex: string, a: number) => string;
+export declare const StyledPaginationPageWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<{
+    xs?: number;
+    sm?: number;
+    md?: number;
+    lg?: number;
+    xsOffset?: number;
+    smOffset?: number;
+    mdOffset?: number;
+    lgOffset?: number;
+    direction?: string;
+    onClick?: () => void;
+    "data-testid"?: string;
+} & import('react').HTMLAttributes<HTMLDivElement>, {
+    $disabled?: boolean;
+    theme?: Theme;
+}>> & string & Omit<({ xs, sm, md, lg, xsOffset, smOffset, mdOffset, lgOffset, direction, children, onClick, ...props }: {
+    xs?: number;
+    sm?: number;
+    md?: number;
+    lg?: number;
+    xsOffset?: number;
+    smOffset?: number;
+    mdOffset?: number;
+    lgOffset?: number;
+    direction?: string;
+    onClick?: () => void;
+    "data-testid"?: string;
+} & import('react').HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element, keyof import('react').Component<any, {}, any>>;
+export declare const StyledIconButtonPagination: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<Omit<Omit<import('../../components/index.ts').IconProps, "ref"> & import('react').RefAttributes<SVGSVGElement>, "ref"> & {
+    ref?: ((instance: SVGSVGElement | null) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<SVGSVGElement> | null | undefined;
+}, never>> & string & Omit<import('react').ForwardRefExoticComponent<Omit<import('../../components/index.ts').IconProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>, keyof import('react').Component<any, {}, any>>;
+export declare const StyledRowButtonPagination: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<{
+    reverse?: boolean;
+    alignItems?: string;
+} & import('react').HTMLAttributes<HTMLDivElement>, never>> & string & Omit<({ alignItems, reverse, children, ...props }: import('../../components/index.ts').RowhProps) => import("react/jsx-runtime").JSX.Element, keyof import('react').Component<any, {}, any>>;
+export declare const StyledButtonSelectAll: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<Omit<Omit<{
+    text?: string;
+    size?: string | import('../../components/index.ts').ButtonSize;
+    variant?: string;
+    iconBefore?: string;
+    iconAfter?: string;
+    iconColor?: string;
+    tooltip?: string;
+    onClick?: (e?: any) => void;
+    onFocus?: () => void;
+    isLoading?: boolean;
+    isDisabled?: boolean;
+    isCircle?: boolean;
+    isExpanded?: boolean;
+    debounceTime?: number;
+    children?: import('react').ReactNode;
+    dataId?: string;
+    'data-testid'?: string;
+} & import('react').ButtonHTMLAttributes<HTMLButtonElement>, "dataId"> & Partial<{
+    dataId?: string;
+}> & import('react').RefAttributes<unknown>, "ref"> & {
+    ref?: ((instance: unknown) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<unknown> | null | undefined;
+}, never>> & string & Omit<import('react').ForwardRefExoticComponent<Omit<{
+    text?: string;
+    size?: string | import('../../components/index.ts').ButtonSize;
+    variant?: string;
+    iconBefore?: string;
+    iconAfter?: string;
+    iconColor?: string;
+    tooltip?: string;
+    onClick?: (e?: any) => void;
+    onFocus?: () => void;
+    isLoading?: boolean;
+    isDisabled?: boolean;
+    isCircle?: boolean;
+    isExpanded?: boolean;
+    debounceTime?: number;
+    children?: import('react').ReactNode;
+    dataId?: string;
+    'data-testid'?: string;
+} & import('react').ButtonHTMLAttributes<HTMLButtonElement>, "dataId"> & Partial<{
+    dataId?: string;
+}> & import('react').RefAttributes<unknown>>, keyof import('react').Component<any, {}, any>>;
+export declare const StyledPaginationSelector: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledSelectDropdown: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledSpanOptionSelected: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    theme: Theme;
+    icon?: any;
+    closable?: any;
+    onClose?: any;
+    value: string;
+}>> & string;
+export declare const StyledSpanOption: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    value: string | null;
+}>> & string;
+export declare const getSelectOptionStyle: (theme: DefaultTheme | Theme) => import('styled-components').RuleSet<object>;
+export declare const SelectOptionStyle: import('react').NamedExoticComponent<import('styled-components').ExecutionProps & {
+    $theme: DefaultTheme | Theme;
+}>;

package/dist/lib/styles/Spinner/StyledSpinner.d.ts

@@ -0,0 +1,9 @@
+import { Theme } from '../../utils/theme';
+
+type StyledSpinnerProps = {
+    $size: number;
+    color: string;
+    theme: Theme;
+};
+declare const StyledSpinner: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSpinnerProps>> & string;
+export { StyledSpinner };

package/dist/lib/styles/Switch/StyledSwitch.d.ts

@@ -0,0 +1,2 @@
+declare const StyledSwitch: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export { StyledSwitch };

package/dist/lib/styles/SwitchPeriodComparative/StyledSwitchPeriodComparative.d.ts

@@ -0,0 +1,7 @@
+import { Theme } from '../../utils/theme';
+
+type StyledSwitchPeriodComparativeProps = {
+    theme: Theme;
+};
+declare const StyledSwitchPeriodComparative: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSwitchPeriodComparativeProps>> & string;
+export { StyledSwitchPeriodComparative };

package/dist/lib/styles/Table/StyledTable.d.ts

@@ -0,0 +1,7 @@
+import { Theme } from '../../utils/theme';
+
+type StyledTableProps = {
+    theme: Theme;
+};
+declare const StyledTable: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTableProps>> & string;
+export { StyledTable };

package/dist/lib/styles/Tabs/StyledTabs.d.ts

@@ -0,0 +1,9 @@
+import { Theme } from '../../utils/theme';
+import { TabsVariant } from '../../components/Tabs';
+
+type StyledTabsProps = {
+    theme: Theme;
+    $variant: TabsVariant;
+};
+declare const StyledTabs: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTabsProps>> & string;
+export { StyledTabs };

package/dist/lib/styles/Tag/StyledTag.d.ts

@@ -0,0 +1,14 @@
+import { Theme } from '../../utils/theme';
+
+export declare const getTagPrimary: (props: StyledTagProps) => import('styled-components').RuleSet<object>;
+export declare const getTagOutline: (props: StyledTagProps) => import('styled-components').RuleSet<object>;
+type StyledTagProps = {
+    theme: Theme;
+    $color: string;
+    $type: 'normal' | 'rounded';
+    $variant: 'primary' | 'outline';
+    $icon?: string;
+    $closable?: boolean;
+};
+declare const StyledTag: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTagProps>> & string;
+export { StyledTag };

package/dist/lib/styles/TagGroup/StyledTagGroup.d.ts

@@ -0,0 +1,6 @@
+import { Theme } from '../../utils/theme';
+
+declare const StyledTagGroup: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    theme: Theme;
+}>> & string;
+export { StyledTagGroup };

package/dist/lib/styles/Toast/StyledToast.d.ts

@@ -0,0 +1,2 @@
+declare const StyledToast: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export { StyledToast };

package/dist/lib/utils/animation.d.ts

@@ -0,0 +1,13 @@
+export declare const easing: {
+    rubber: string;
+};
+export declare const rotate360: import('styled-components/dist/models/Keyframes').default;
+export declare const glow: import('styled-components/dist/models/Keyframes').default;
+export declare const float: import('styled-components/dist/models/Keyframes').default;
+export declare const jiggle: import('styled-components/dist/models/Keyframes').default;
+export declare const shake: import('styled-components/dist/models/Keyframes').default;
+export declare const inlineGlow: import('styled-components').RuleSet<{
+    theme: {
+        backgroundColor: string;
+    };
+}>;

package/dist/lib/utils/dates.d.ts

@@ -0,0 +1,29 @@
+import { default as moment, Moment } from 'moment';
+
+declare const ISO_FORMAT = "DD/MM/YY";
+declare const NUMBER_OF_MONTHS = 3;
+declare const START_DATE = "startDate";
+declare const END_DATE = "endDate";
+declare const DAY_SIZE = 25;
+export type Parser = (start: Moment, end: Moment) => string;
+declare const day: (number?: number) => moment.Moment;
+declare const today: (parser: Parser) => string;
+declare const yesterday: (parser: Parser) => string;
+declare const last7Days: (parser: Parser) => string;
+declare const last28Days: (parser: Parser) => string;
+declare const currentMonth: (parser: Parser) => string;
+declare const lastMonth: (parser: Parser) => string;
+declare const yearToDate: (parser: Parser) => string;
+declare const previousYear: (parser: Parser) => string;
+declare enum DateRange {
+    CUSTOM = "custom",
+    TODAY = "today",
+    YESTERDAY = "yesterday",
+    LAST_7_DAYS = "last_7_days",
+    LAST_28_DAYS = "last_28_days",
+    CURRENT_MONTH = "current_month",
+    LAST_MONTH = "last_month",
+    YEAR_TO_DATE = "year_to_date",
+    PREVIOUS_YEAR = "previous_year"
+}
+export { ISO_FORMAT, NUMBER_OF_MONTHS, START_DATE, END_DATE, DAY_SIZE, DateRange, day, today, yesterday, last7Days, last28Days, currentMonth, lastMonth, yearToDate, previousYear };

package/dist/lib/utils/formatter.d.ts

@@ -0,0 +1,2 @@
+export declare const numberFormatter: (number: number, decimal: string, grouping: string) => string;
+export declare const applyScientific: (number: number, decimal: string, exponential: number) => string;

package/dist/lib/utils/global.d.ts

@@ -0,0 +1,4 @@
+export declare const UIComponentsStyle: import('react').NamedExoticComponent<import('styled-components').ExecutionProps & object>;
+export declare const IsolatedGlobalStyle: import('react').NamedExoticComponent<import('styled-components').ExecutionProps & object>;
+export declare const GlobalStyle: import('react').NamedExoticComponent<import('styled-components').ExecutionProps & object>;
+export declare const StorybookStyles: import('react').NamedExoticComponent<import('styled-components').ExecutionProps & object>;

package/dist/lib/utils/selectors.d.ts

@@ -0,0 +1,113 @@
+import { Theme } from './theme';
+import { DefaultTheme } from 'styled-components';
+
+export declare const padding: (theme?: Theme) => any;
+export declare const margin: (theme?: Theme) => any;
+export declare const border: (theme?: Theme) => any;
+export declare const borderRadius: (theme?: Theme) => any;
+export declare const borderColor: (theme?: Theme) => any;
+export declare const fontSize: (theme?: Theme) => any;
+export declare const fontColor: (theme?: Theme) => any;
+export declare const fontColorActive: (theme?: Theme) => any;
+export declare const fontWeightLight: (theme?: Theme) => any;
+export declare const fontWeightNormal: (theme?: Theme) => any;
+export declare const fontWeightSemiBold: (theme?: Theme) => any;
+export declare const fontWeightBold: (theme?: Theme) => any;
+export declare const iconSize: (theme?: Theme) => any;
+export declare const iconColor: (theme?: Theme) => any;
+export declare const iconColorActive: (theme?: Theme) => any;
+export declare const backgroundColor: (theme?: Theme) => any;
+export declare const backgroundColorSelected: (theme?: Theme) => any;
+export declare const backgroundColorActive: (theme?: Theme) => any;
+export declare const backgroundColorHover: (theme?: Theme) => any;
+export declare const backgroundColorFocused: (theme?: Theme) => any;
+export declare const backgroundColorDisabled: (theme?: Theme) => any;
+export declare const boxShadow: (theme?: Theme) => any;
+export declare const boxShadowHover: (theme?: Theme) => any;
+export declare const blue50: (theme?: Theme) => any;
+export declare const blue100: (theme?: Theme) => any;
+export declare const blue200: (theme?: Theme) => any;
+export declare const blue300: (theme?: Theme) => any;
+export declare const blue400: (theme?: Theme) => any;
+export declare const blue500: (theme?: Theme) => any;
+export declare const blue600: (theme?: Theme) => any;
+export declare const blue700: (theme?: Theme) => any;
+export declare const blue800: (theme?: Theme) => any;
+export declare const blue900: (theme?: Theme) => any;
+export declare const gray50: (theme?: Theme) => any;
+export declare const gray100: (theme?: Theme) => any;
+export declare const gray200: (theme?: Theme) => any;
+export declare const gray300: (theme?: Theme) => any;
+export declare const gray400: (theme?: Theme) => any;
+export declare const gray500: (theme?: Theme) => any;
+export declare const gray600: (theme?: Theme) => any;
+export declare const gray700: (theme?: Theme) => any;
+export declare const gray800: (theme?: Theme) => any;
+export declare const gray900: (theme?: Theme) => any;
+export declare const teal: (theme?: Theme) => any;
+export declare const red: (theme?: Theme) => any;
+export declare const orange: (theme?: Theme) => any;
+export declare const amber: (theme?: Theme) => any;
+export declare const green: (theme?: Theme) => any;
+export declare const cyan: (theme?: Theme) => any;
+export declare const blueLight: (theme?: Theme) => any;
+export declare const blue: (theme?: Theme) => any;
+export declare const violet: (theme?: Theme) => any;
+export declare const magenta: (theme?: Theme) => any;
+export declare const pink: (theme?: Theme) => any;
+export declare const brown: (theme?: Theme) => any;
+export declare const gray: (theme?: Theme) => any;
+export declare const white: (theme?: Theme) => any;
+export declare const black: (theme?: Theme) => any;
+export declare const error: (theme?: Theme) => any;
+export declare const primaryColor: (theme?: DefaultTheme | Theme) => any;
+export declare const primaryColorSvg: (theme?: Theme) => string;
+export declare const successColor: (theme?: Theme) => any;
+export declare const warningColor: (theme?: Theme) => any;
+export declare const errorColor: (theme?: Theme) => any;
+export declare const infoColor: (theme?: Theme) => any;
+export declare const componentHeight: (theme?: Theme) => any;
+export declare const alertMessageFontSize: (theme?: Theme) => any;
+export declare const alertDescriptionMessageFontSize: (theme?: Theme) => any;
+export declare const headingFontSize: (theme?: Theme) => any;
+export declare const buttonSize: (theme?: Theme) => any;
+export declare const dataPickerHeight: (theme?: Theme) => any;
+export declare const dataPickerFontSize: (theme?: Theme) => any;
+export declare const dataPickerPaddingX: (theme?: Theme) => any;
+export declare const paginationHeight: (theme?: Theme) => any;
+export declare const paginationFontSize: (theme?: Theme) => any;
+export declare const paginationPaddingX: (theme?: Theme) => any;
+export declare const paragraphSize: (theme?: Theme) => any;
+export declare const tableFontSize: (theme?: Theme) => any;
+export declare const tagLineHeight: (theme?: Theme) => any;
+export declare const tagFontSize: (theme?: Theme) => any;
+export declare const tagPaddingX: (theme?: Theme) => any;
+export declare const tagPaddingY: (theme?: Theme) => any;
+export declare const tabHeight: (theme?: Theme) => any;
+export declare const tabFontSize: (theme?: Theme) => any;
+export declare const tabPaddingX: (theme?: Theme) => any;
+export declare const inputHeight: (theme?: Theme) => any;
+export declare const inputFontSize: (theme?: Theme) => any;
+export declare const inputPaddingX: (theme?: Theme) => any;
+export declare const selectHeight: (theme?: Theme) => any;
+export declare const selectFontSize: (theme?: Theme) => any;
+export declare const selectPaddingX: (theme?: Theme) => any;
+export declare const cardPaddingX: (theme?: Theme) => any;
+export declare const cardPaddingY: (theme?: Theme) => any;
+export declare const cardFontSize: (theme?: Theme) => any;
+export declare const cardLineHeight: (theme?: Theme) => any;
+export declare const switchPeriodComparativeFontSize: (theme?: Theme) => any;
+export declare const gridOuterPadding: (theme?: Theme) => any;
+export declare const gridOuterMargin: (theme?: Theme) => any;
+export declare const gridGutterWidth: (theme?: Theme) => any;
+export declare const gridGutterCompensation: (theme?: Theme) => any;
+export declare const gridHalfGutterWidth: (theme?: Theme) => any;
+export declare const gridBreakpoints: (theme?: Theme) => any;
+export declare const gridColumns: (theme?: Theme) => any;
+export declare const gridContainerSm: (theme?: Theme) => any;
+export declare const gridContainerMd: (theme?: Theme) => any;
+export declare const gridContainerLg: (theme?: Theme) => any;
+export declare const progressHeight: (theme?: Theme) => any;
+export declare const progressFontSize: (theme?: Theme) => any;
+export declare const progressBackgroundColor: (theme?: Theme) => any;
+export declare const formControlMessageFontSize: (theme?: Theme) => any;

package/dist/lib/utils/theme.d.ts

@@ -0,0 +1,85 @@
+import { DefaultTheme } from 'styled-components';
+
+export declare const color: {
+    teal50: string;
+    teal100: string;
+    teal200: string;
+    teal300: string;
+    teal400: string;
+    teal500: string;
+    teal600: string;
+    teal700: string;
+    teal800: string;
+    teal900: string;
+    blue50: string;
+    blue100: string;
+    blue200: string;
+    blue300: string;
+    blue400: string;
+    blue500: string;
+    blue600: string;
+    blue700: string;
+    blue800: string;
+    blue900: string;
+    gray50: string;
+    gray100: string;
+    gray200: string;
+    gray300: string;
+    gray400: string;
+    gray500: string;
+    gray600: string;
+    gray700: string;
+    gray800: string;
+    gray900: string;
+    teal: string;
+    red: string;
+    orange: string;
+    amber: string;
+    green: string;
+    cyan: string;
+    blueLight: string;
+    blue: string;
+    irisBlue: string;
+    violet: string;
+    magenta: string;
+    pink: string;
+    brown: string;
+    gray: string;
+    white: string;
+    black: string;
+};
+export declare const transparent = "transparent";
+export declare const primary: string;
+export declare const success: string;
+export declare const warning: string;
+export declare const error: string;
+export declare const info: string;
+export declare const fontSizeNumber = 1;
+export declare const fontSizeType = "rem";
+export declare const fontSize = "1rem";
+export declare const fontColor: string;
+export declare const fontColorActive: string;
+export declare const fontWeightLight = 300;
+export declare const fontWeightNormal = 400;
+export declare const fontWeightSemiBold = 600;
+export declare const fontWeightBold = 700;
+export declare const fontFamily = "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"";
+export declare const pxToRem: (px: number) => number;
+export declare const iconSize = "1rem";
+export declare const iconColor: string;
+export declare const iconColorActive: string;
+export declare const backgroundColor: string;
+export declare const backgroundColorSelected: string;
+export declare const backgroundColorActive: string;
+export declare const backgroundColorHover: string;
+export declare const backgroundColorFocused: string;
+export declare const radius = "4px";
+export declare const padding = "20px";
+export declare const borderColor: string;
+export declare const heightElements = "30px";
+export declare const heightComponents: number;
+export declare const boxShadow = "0 1px 5px 0 rgba(0,0,0,0.2)";
+export declare const boxShadowHover = "0 4px 8px 0 rgba(0, 0, 0, 0.2)";
+declare const defaultTheme: DefaultTheme;
+export type Theme = DefaultTheme;
+export default defaultTheme;