@trilogy-ds/react 0.0.1-beta.5 → 0.0.1-beta.50

package/lib/components/button/Button.native.js

@@ -1,37 +1,60 @@
-import React from 'react';
-import { ActivityIndicator, StyleSheet, Text, TouchableOpacity } from 'react-native';
-import { View } from '../view';
-import { getLoadingClassName, getVariantClassName, getVariantStyle } from '../../objects';
-import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
-import { Icon, IconSize } from '../icon';
-import { ButtonColor } from './ButtonEnum';
-import { ComponentName } from '../enumsComponentsName';
+import * as React from "react";
+import { ActivityIndicator, StyleSheet, Text, TouchableOpacity, } from "react-native";
+import { TrilogyColor, getButtonColorStyle, getColorStyle, getLoadingClassName, getVariantClassName } from "../../objects/facets";
+import { ComponentName } from "../../components/enumsComponentsName";
+import { Icon, IconSize } from "../../components/icon";
+import { View } from "../../components/view";
+import { ButtonVariant } from "./ButtonEnum";
 /*
  * Helpers (reduce complexity of component to meet sonarqube requirements)
  */
-const findBackgroundColor = ({ disabled, loading, variant }) => {
-    return ((disabled && variant === ButtonColor.TERTIARY && getColorStyle(TrilogyColor.WHITE)) ||
-        (disabled && getColorStyle(TrilogyColor.GREY_DISABLED)) ||
-        (!!loading && variant === ButtonColor.TERTIARY && getColorStyle(TrilogyColor.WHITE)) ||
-        (typeof loading === 'string' && getLoadingClassName(loading) === 'loading' && '#7F7F7F') ||
-        (typeof loading === 'boolean' && loading && '#7F7F7F') ||
-        (variant && !disabled && getVariantStyle(variant)) ||
-        (variant === ButtonColor.SECONDARY && getColorStyle(TrilogyColor.SECONDARY)) ||
-        getColorStyle(TrilogyColor.PRIMARY));
+const findBackgroundColor = ({ disabled, loading, variant, }) => {
+    return ((typeof loading === "string" &&
+        getLoadingClassName(loading) === "loading" &&
+        getButtonColorStyle(TrilogyColor.BACKGROUND)) ||
+        (typeof loading === "boolean" &&
+            loading &&
+            getColorStyle(TrilogyColor.NEUTRAL)) ||
+        (disabled && variant && getColorStyle(TrilogyColor.DISABLED, 1)) ||
+        (variant === ButtonVariant.PRIMARY && getColorStyle(TrilogyColor.MAIN)) ||
+        (variant === ButtonVariant.SECONDARY &&
+            getColorStyle(TrilogyColor.MAIN, 1)) ||
+        (variant === ButtonVariant.CONVERSION &&
+            getColorStyle(TrilogyColor.ACCENT, 1)) ||
+        (variant === ButtonVariant.GHOST && getColorStyle(TrilogyColor.BACKGROUND)) ||
+        (disabled &&
+            variant === ButtonVariant.PRIMARY &&
+            getButtonColorStyle(TrilogyColor.BACKGROUND)) ||
+        (disabled && getColorStyle(TrilogyColor.DISABLED)) ||
+        getColorStyle(TrilogyColor.MAIN, 1));
 };
 const findTextColor = ({ variant }) => {
-    return ((variant && getVariantClassName(variant) === 'secondary' && getColorStyle(TrilogyColor.WHITE)) ||
-        (variant && getVariantClassName(variant) === 'tertiary' && getColorStyle(TrilogyColor.SECONDARY)) ||
-        getColorStyle(TrilogyColor.WHITE));
+    return ((variant &&
+        getVariantClassName(variant) === "secondary" &&
+        getColorStyle(TrilogyColor.FONT)) ||
+        (variant &&
+            getVariantClassName(variant) === "accent" &&
+            getColorStyle(TrilogyColor.BACKGROUND)) ||
+        (variant &&
+            getVariantClassName(variant) === "primary" &&
+            getColorStyle(TrilogyColor.BACKGROUND)) ||
+        (variant &&
+            getVariantClassName(variant) === "ghost" &&
+            getColorStyle(TrilogyColor.FONT)) ||
+        getColorStyle(TrilogyColor.BACKGROUND));
 };
-const findBorderWidth = ({ variant }) => {
-    return variant === ButtonColor.TERTIARY ? 2 : 0;
-};
-const findBorderColor = ({ disabled, variant, loading }) => {
-    return ((disabled && variant === ButtonColor.TERTIARY && getColorStyle(TrilogyColor.GREY_DISABLED)) ||
-        (!disabled && !!loading && variant === ButtonColor.TERTIARY && getColorStyle(TrilogyColor.GREY_DISABLED)) ||
-        (!disabled && variant === ButtonColor.TERTIARY && getColorStyle(TrilogyColor.BG_INFO)) ||
-        getColorStyle(TrilogyColor.WHITE));
+const findBorderColor = ({ disabled, variant, loading, }) => {
+    return ((disabled &&
+        variant === ButtonVariant.PRIMARY &&
+        getColorStyle(TrilogyColor.DISABLED, 0)) ||
+        (!disabled &&
+            !!loading &&
+            variant === ButtonVariant.PRIMARY &&
+            getColorStyle(TrilogyColor.DISABLED, 0)) ||
+        (!disabled &&
+            variant === ButtonVariant.PRIMARY &&
+            getColorStyle(TrilogyColor.INFO, 1)) ||
+        getColorStyle(TrilogyColor.BACKGROUND, 0));
 };
 /**
  * Button Native Component
@@ -48,99 +71,111 @@ const findBorderColor = ({ disabled, variant, loading }) => {
 const Button = ({ children, variant, onClick, disabled, loading, fullwidth, testId, accessibilityLabel, iconName, ...others }) => {
     const styles = StyleSheet.create({
         button: {
-            maxWidth: '100%',
-            minWidth: '100%',
-            paddingTop: variant === ButtonColor.TERTIARY ? 13 : 15,
-            paddingBottom: variant === ButtonColor.TERTIARY ? 13 : 15,
-            paddingLeft: variant === ButtonColor.TERTIARY ? 13 : 15,
-            paddingRight: variant === ButtonColor.TERTIARY ? 13 : 15,
-            justifyContent: 'center',
-            alignItems: 'center',
+            maxWidth: "100%",
+            minWidth: "100%",
+            paddingTop: variant === ButtonVariant.PRIMARY ? 13 : 15,
+            paddingBottom: variant === ButtonVariant.PRIMARY ? 13 : 15,
+            paddingLeft: variant === ButtonVariant.PRIMARY ? 13 : 15,
+            paddingRight: variant === ButtonVariant.PRIMARY ? 13 : 15,
+            justifyContent: "center",
+            alignItems: "center",
             backgroundColor: findBackgroundColor({ disabled, loading, variant }),
             borderRadius: 4,
             minHeight: 45,
-            height: loading ? 52 : 'auto',
-            borderWidth: findBorderWidth({ variant }),
+            height: loading ? 52 : "auto",
             borderColor: findBorderColor({ disabled, variant, loading }),
         },
         text: {
-            fontFamily: 'poppins-semibold',
-            color: findTextColor({ variant }),
-            alignSelf: 'center',
-            alignItems: 'center',
-            fontWeight: 'bold',
-            justifyContent: 'center',
+            fontFamily: "poppins-semibold",
+            color: disabled
+                ? getColorStyle(TrilogyColor.BACKGROUND)
+                : findTextColor({ variant }),
+            alignSelf: "center",
+            alignItems: "center",
+            fontWeight: "bold",
+            justifyContent: "center",
         },
         textDisabled: {
-            color: getColorStyle(TrilogyColor.GREY),
-            alignSelf: 'center',
-            alignItems: 'center',
-            fontWeight: 'bold',
-            justifyContent: 'center',
+            color: getColorStyle(TrilogyColor.DISABLED),
+            alignSelf: "center",
+            alignItems: "center",
+            fontWeight: "bold",
+            justifyContent: "center",
         },
         textDisabledIcon: {
-            color: getColorStyle(TrilogyColor.GREY),
-            alignSelf: 'center',
-            alignItems: 'center',
-            fontWeight: 'bold',
-            justifyContent: 'center',
+            color: getColorStyle(TrilogyColor.DISABLED),
+            alignSelf: "center",
+            alignItems: "center",
+            fontWeight: "bold",
+            justifyContent: "center",
             marginLeft: 12,
         },
         fullwidth: {
-            alignSelf: 'stretch',
+            alignSelf: "stretch",
         },
         buttonIconContainer: {
-            flexDirection: 'row',
-            alignSelf: 'center',
-            alignItems: 'center',
-            fontWeight: 'bold',
-            justifyContent: 'center',
+            flexDirection: "row",
+            alignSelf: "center",
+            alignItems: "center",
+            fontWeight: "bold",
+            justifyContent: "center",
         },
         buttonIconText: {
-            color: findTextColor({ variant }),
-            alignSelf: 'center',
-            alignItems: 'center',
-            fontWeight: 'bold',
-            justifyContent: 'center',
+            color: disabled
+                ? getColorStyle(TrilogyColor.BACKGROUND)
+                : findTextColor({ variant }),
+            alignSelf: "center",
+            alignItems: "center",
+            fontWeight: "bold",
+            justifyContent: "center",
             marginLeft: 8,
         },
     });
-    const buttonTestId = testId ? testId : typeof children === 'string' ? children : 'NotSpecified';
+    const buttonTestId = testId
+        ? testId
+        : typeof children === "string"
+            ? children
+            : "NotSpecified";
     const buttonAccessibilityLabel = accessibilityLabel
         ? accessibilityLabel
-        : typeof children === 'string'
+        : typeof children === "string"
             ? children
-            : 'NotSpecified';
+            : "NotSpecified";
     /**
      * Returns variant's classname depending on variant type
      * @param variantType {string} - VariantType
      * @returns {string} - Variant value
      */
     const iconColorVariant = (variantType) => {
-        if (variantType && ['PRIMARY', 'SECONDARY'].includes(variantType))
-            return TrilogyColor.WHITE;
-        if (variantType === 'TERTIARY')
-            return TrilogyColor.SECONDARY;
-        return TrilogyColor.WHITE;
+        if (variantType && ["PRIMARY", "ACCENT"].includes(variantType))
+            return TrilogyColor.BACKGROUND;
+        if (variantType === "SECONDARY" || variantType === "GHOST")
+            return TrilogyColor.MAIN;
+        return TrilogyColor.BACKGROUND;
     };
-    return (React.createElement(TouchableOpacity, { accessible: !!buttonAccessibilityLabel, accessibilityLabel: buttonAccessibilityLabel, testID: buttonTestId, disabled: disabled, style: [styles.button, fullwidth && styles.fullwidth], onPress: (e) => onClick === null || onClick === void 0 ? void 0 : onClick(e), ...others },
-        loading && typeof loading === 'string' && getLoadingClassName(loading) === 'loading' && (React.createElement(View, { style: {
-                alignItems: 'center',
-                justifyContent: 'center',
+    return (React.createElement(TouchableOpacity, { accessible: !!buttonAccessibilityLabel, accessibilityLabel: buttonAccessibilityLabel, testID: buttonTestId, disabled: disabled || loading, style: [styles.button, fullwidth && styles.fullwidth], onPress: (e) => onClick === null || onClick === void 0 ? void 0 : onClick(e), ...others },
+        loading &&
+            typeof loading === "string" &&
+            getLoadingClassName(loading) === "loading" && (React.createElement(View, { style: {
+                alignItems: "center",
+                justifyContent: "center",
                 height: 45,
             } },
-            React.createElement(ActivityIndicator, { color: getColorStyle(TrilogyColor.GREY_DISABLED) }))),
-        loading && typeof loading === 'boolean' && loading === true && (React.createElement(View, { style: {
-                alignItems: 'center',
+            React.createElement(ActivityIndicator, { color: getColorStyle(TrilogyColor.BACKGROUND) }))),
+        loading && typeof loading === "boolean" && loading === true && (React.createElement(View, { style: {
+                alignItems: "center",
                 height: 45,
-                justifyContent: 'center',
+                justifyContent: "center",
             } },
-            React.createElement(ActivityIndicator, { color: getColorStyle(TrilogyColor.GREY_DISABLED) }))),
-        loading && typeof loading === 'string' && getLoadingClassName(loading) === 'loaded' && (React.createElement(Text, { style: (!disabled && styles.text) || (disabled && styles.textDisabled) }, children)),
-        !loading && children && typeof children === 'string' && !iconName && (React.createElement(Text, { style: (!disabled && styles.text) || (disabled && styles.textDisabled) }, children)),
-        !loading && children && typeof children === 'string' && iconName && (React.createElement(View, { style: styles.buttonIconContainer },
-            !disabled ? (React.createElement(Icon, { name: iconName, size: IconSize.SMALL, color: iconColorVariant(variant) })) : (React.createElement(Icon, { name: iconName, size: IconSize.SMALL, color: getColorStyle(TrilogyColor.GREY_DISABLED) })),
-            React.createElement(Text, { style: (!disabled && styles.buttonIconText) || (disabled && styles.textDisabledIcon) }, children)))));
+            React.createElement(ActivityIndicator, { color: getColorStyle(TrilogyColor.BACKGROUND) }))),
+        loading &&
+            typeof loading === "string" &&
+            getLoadingClassName(loading) === "loaded" && (React.createElement(Text, { style: (!disabled && styles.text) || (disabled && styles.textDisabled) }, children)),
+        !loading && children && typeof children === "string" && !iconName && (React.createElement(Text, { style: (!disabled && styles.text) || (disabled && styles.textDisabled) }, children)),
+        !loading && children && typeof children === "string" && iconName && (React.createElement(View, { style: styles.buttonIconContainer },
+            !disabled ? (React.createElement(Icon, { name: iconName, size: IconSize.SMALL, color: iconColorVariant(variant) })) : (React.createElement(Icon, { name: iconName, size: IconSize.SMALL, color: getColorStyle(TrilogyColor.DISABLED) })),
+            React.createElement(Text, { style: (!disabled && styles.buttonIconText) ||
+                    (disabled && styles.textDisabledIcon) }, children)))));
 };
 Button.displayName = ComponentName.Button;
 export default Button;

package/lib/components/button/Button.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.native.js","sourceRoot":"","sources":["../../../components/button/Button.native.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Button.native.js","sourceRoot":"","sources":["../../../components/button/Button.native.tsx"],"names":[],"mappings":"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"}

package/lib/components/button/ButtonEnum.d.ts

@@ -15,17 +15,18 @@ declare enum ButtonType {
     SUBMIT = "submit"
 }
 /**
- * Button Color
+ * Button Variant
  */
-export declare enum ButtonColor {
-    SECONDARY = "SECONDARY",
+export declare enum ButtonVariant {
+    CONVERSION = "CONVERSION",
     PRIMARY = "PRIMARY",
-    TERTIARY = "TERTIARY"
+    SECONDARY = "SECONDARY",
+    GHOST = "GHOST"
 }
 /**
  * List of available Markup values for Button
  */
 export type ButtonMarkupValues = `${ButtonMarkup}`;
 export type ButtonTypeValues = `${ButtonType}`;
-export type ButtonColorValues = `${ButtonColor}`;
+export type ButtonVariantValues = `${ButtonVariant}`;
 export { ButtonMarkup, ButtonType };

package/lib/components/button/ButtonEnum.js

@@ -17,13 +17,14 @@ var ButtonType;
     ButtonType["SUBMIT"] = "submit";
 })(ButtonType || (ButtonType = {}));
 /**
- * Button Color
+ * Button Variant
  */
-export var ButtonColor;
-(function (ButtonColor) {
-    ButtonColor["SECONDARY"] = "SECONDARY";
-    ButtonColor["PRIMARY"] = "PRIMARY";
-    ButtonColor["TERTIARY"] = "TERTIARY";
-})(ButtonColor || (ButtonColor = {}));
+export var ButtonVariant;
+(function (ButtonVariant) {
+    ButtonVariant["CONVERSION"] = "CONVERSION";
+    ButtonVariant["PRIMARY"] = "PRIMARY";
+    ButtonVariant["SECONDARY"] = "SECONDARY";
+    ButtonVariant["GHOST"] = "GHOST";
+})(ButtonVariant || (ButtonVariant = {}));
 export { ButtonMarkup, ButtonType };
 //# sourceMappingURL=ButtonEnum.js.map

package/lib/components/button/ButtonEnum.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonEnum.js","sourceRoot":"","sources":["../../../components/button/ButtonEnum.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,IAAK,YAIJ;AAJD,WAAK,YAAY;IACf,iCAAiB,CAAA;IACjB,+BAAe,CAAA;IACf,uBAAO,CAAA;AACT,CAAC,EAJI,YAAY,KAAZ,YAAY,QAIhB;AAED;;GAEG;AACH,IAAK,UAIJ;AAJD,WAAK,UAAU;IACb,+BAAiB,CAAA;IACjB,6BAAe,CAAA;IACf,+BAAiB,CAAA;AACnB,CAAC,EAJI,UAAU,KAAV,UAAU,QAId;AAED;;GAEG;AACH,MAAM,CAAN,IAAY,WAIX;AAJD,WAAY,WAAW;IACrB,sCAAuB,CAAA;IACvB,kCAAmB,CAAA;IACnB,oCAAqB,CAAA;AACvB,CAAC,EAJW,WAAW,KAAX,WAAW,QAItB;AAWD,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,CAAA"}
+{"version":3,"file":"ButtonEnum.js","sourceRoot":"","sources":["../../../components/button/ButtonEnum.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,IAAK,YAIJ;AAJD,WAAK,YAAY;IACf,iCAAiB,CAAA;IACjB,+BAAe,CAAA;IACf,uBAAO,CAAA;AACT,CAAC,EAJI,YAAY,KAAZ,YAAY,QAIhB;AAED;;GAEG;AACH,IAAK,UAIJ;AAJD,WAAK,UAAU;IACb,+BAAiB,CAAA;IACjB,6BAAe,CAAA;IACf,+BAAiB,CAAA;AACnB,CAAC,EAJI,UAAU,KAAV,UAAU,QAId;AAED;;GAEG;AAEH,MAAM,CAAN,IAAY,aAKX;AALD,WAAY,aAAa;IACvB,0CAAyB,CAAA;IACzB,oCAAmB,CAAA;IACnB,wCAAuB,CAAA;IACvB,gCAAe,CAAA;AACjB,CAAC,EALW,aAAa,KAAb,aAAa,QAKxB;AAWD,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,CAAA"}

package/lib/components/button/ButtonProps.d.ts

@@ -1,8 +1,8 @@
 /// <reference types="react" />
-import { ButtonColor, ButtonColorValues, ButtonMarkup, ButtonMarkupValues, ButtonType, ButtonTypeValues } from './ButtonEnum';
+import { ButtonMarkup, ButtonMarkupValues, ButtonType, ButtonTypeValues, ButtonVariant, ButtonVariantValues } from './ButtonEnum';
 import { Fullwidth } from '../../objects/facets/Fullwidth';
 import { Accessibility, Clickable } from '../../objects/facets';
-import { IconName, IconNameValues } from '..';
+import { IconName, IconNameValues } from '../../components/icon';
 /**
  * Button Interface
  */
@@ -19,5 +19,5 @@ export interface ButtonProps extends Accessibility, Fullwidth, Clickable {
     routerLink?: React.ElementType;
     type?: ButtonType | ButtonTypeValues;
     iconName?: IconName | IconNameValues;
-    variant?: ButtonColor | ButtonColorValues;
+    variant?: ButtonVariant | ButtonVariantValues;
 }

package/lib/components/button/list/ButtonList.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { ButtonListWebProps } from './ButtonListProps';
+import { ButtonListWebProps } from "./ButtonListProps";
 /**
  * Button List Component
  * @param children {ReactNode} ButtonList children

package/lib/components/button/list/ButtonList.js

@@ -1,8 +1,8 @@
-import React from 'react';
-import { has } from '../../../services';
-import clsx from 'clsx';
-import { hashClass } from '../../../helpers';
-import { useTrilogyContext } from '../../../context';
+import * as React from "react";
+import { has } from "../../../services";
+import clsx from "clsx";
+import { hashClass } from "../../../helpers";
+import { useTrilogyContext } from "../../../context";
 /**
  * Button List Component
  * @param children {ReactNode} ButtonList children
@@ -14,7 +14,7 @@ import { useTrilogyContext } from '../../../context';
  */
 const ButtonList = ({ className, centered, isMobile, vertical, ...others }) => {
     const { styled } = useTrilogyContext();
-    return (React.createElement("div", { className: hashClass(styled, clsx('buttons', className, centered && has('text-centered'), isMobile && 'is-mobile', vertical && 'is-vertical')), ...others }));
+    return (React.createElement("div", { className: hashClass(styled, clsx("buttons", className, centered && has("text-centered"), isMobile && "is-mobile", vertical && "is-vertical")), ...others }));
 };
 export default ButtonList;
 //# sourceMappingURL=ButtonList.js.map

package/lib/components/button/list/ButtonList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonList.js","sourceRoot":"","sources":["../../../../components/button/list/ButtonList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AACvC,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAC5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEpD;;;;;;;;GAQG;AAEH,MAAM,UAAU,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,MAAM,EAAsB,EAAe,EAAE;IAC7G,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,OAAO,CACL,6BACE,SAAS,EAAE,SAAS,CAClB,MAAM,EACN,IAAI,CACF,SAAS,EACT,SAAS,EACT,QAAQ,IAAI,GAAG,CAAC,eAAe,CAAC,EAChC,QAAQ,IAAI,WAAW,EACvB,QAAQ,IAAI,aAAa,CAC1B,CACF,KACG,MAAM,GACV,CACH,CAAA;AACH,CAAC,CAAA;AAED,eAAe,UAAU,CAAA"}
+{"version":3,"file":"ButtonList.js","sourceRoot":"","sources":["../../../../components/button/list/ButtonList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAA;AAChC,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAA;AACrC,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAE7C;;;;;;;;GAQG;AAEH,MAAM,UAAU,GAAG,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,GAAG,MAAM,EACU,EAAe,EAAE;IACpC,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,OAAO,CACL,6BACE,SAAS,EAAE,SAAS,CAClB,MAAM,EACN,IAAI,CACF,SAAS,EACT,SAAS,EACT,QAAQ,IAAI,GAAG,CAAC,eAAe,CAAC,EAChC,QAAQ,IAAI,WAAW,EACvB,QAAQ,IAAI,aAAa,CAC1B,CACF,KACG,MAAM,GACV,CACH,CAAA;AACH,CAAC,CAAA;AAED,eAAe,UAAU,CAAA"}

package/lib/components/button/list/ButtonList.native.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { ButtonListProps } from './ButtonListProps';
-import { ComponentName } from '../../enumsComponentsName';
+import type { ButtonListProps } from "./ButtonListProps";
+import { ComponentName } from "../../../components/enumsComponentsName";
 /**
  * ButtonList Native Component
  * @param children {ReactNode} ButtonList children
@@ -10,7 +10,7 @@ import { ComponentName } from '../../enumsComponentsName';
  * @deprecated
  */
 declare const ButtonList: {
-    ({ autolayout, children }: ButtonListProps): JSX.Element;
+    ({ autolayout, children, }: ButtonListProps): JSX.Element;
     displayName: ComponentName;
 };
 export default ButtonList;

package/lib/components/button/list/ButtonList.native.js

@@ -1,14 +1,14 @@
-import React from 'react';
-import { AutoLayoutWrapper } from '../../autolayout';
-import { SpacerSize } from '../../spacer';
-import { SpacingMatrixMode } from '../../autolayout/SpacingMatrix';
-import { ComponentName } from '../../enumsComponentsName';
+import * as React from "react";
+import { AutoLayoutWrapper } from "../../../components/autolayout";
+import { SpacerSize } from "../../../components/spacer";
+import { SpacingMatrixMode } from "../../../components/autolayout/SpacingMatrix";
+import { ComponentName } from "../../../components/enumsComponentsName";
 const { MEDIUM, SMALL } = SpacerSize;
 const { INSERT_SPACE_BETWEEN } = SpacingMatrixMode;
 const SPACING_MATRIX = [
-    [INSERT_SPACE_BETWEEN, 'Button', 'Divider', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Divider', 'Button', SMALL],
-    [INSERT_SPACE_BETWEEN, 'Button', 'Button', MEDIUM],
+    [INSERT_SPACE_BETWEEN, "Button", "Divider", SMALL],
+    [INSERT_SPACE_BETWEEN, "Divider", "Button", SMALL],
+    [INSERT_SPACE_BETWEEN, "Button", "Button", MEDIUM],
 ];
 /**
  * ButtonList Native Component
@@ -18,7 +18,7 @@ const SPACING_MATRIX = [
 /**
  * @deprecated
  */
-const ButtonList = ({ autolayout = SPACING_MATRIX, children }) => {
+const ButtonList = ({ autolayout = SPACING_MATRIX, children, }) => {
     return React.createElement(AutoLayoutWrapper, { ...{ autolayout, children } });
 };
 ButtonList.displayName = ComponentName.ButtonList;

package/lib/components/button/list/ButtonList.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonList.native.js","sourceRoot":"","sources":["../../../../components/button/list/ButtonList.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAKlE,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAEzD,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAA;AACpC,MAAM,EAAE,oBAAoB,EAAE,GAAG,iBAAiB,CAAA;AAElD,MAAM,cAAc,GAAkB;IACpC,CAAC,oBAAoB,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,CAAC;IAClD,CAAC,oBAAoB,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,CAAC;IAClD,CAAC,oBAAoB,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC;CACnD,CAAA;AAED;;;;GAIG;AAEH;;GAEG;AACH,MAAM,UAAU,GAAG,CAAC,EAAE,UAAU,GAAG,cAAc,EAAE,QAAQ,EAAmB,EAAe,EAAE;IAC7F,OAAO,oBAAC,iBAAiB,OAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAI,CAAA;AAC5D,CAAC,CAAA;AAED,UAAU,CAAC,WAAW,GAAG,aAAa,CAAC,UAAU,CAAA;AAEjD,eAAe,UAAU,CAAA"}
+{"version":3,"file":"ButtonList.native.js","sourceRoot":"","sources":["../../../../components/button/list/ButtonList.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAA;AAKzE,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AAEhE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAA;AACpC,MAAM,EAAE,oBAAoB,EAAE,GAAG,iBAAiB,CAAA;AAElD,MAAM,cAAc,GAAkB;IACpC,CAAC,oBAAoB,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,CAAC;IAClD,CAAC,oBAAoB,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,CAAC;IAClD,CAAC,oBAAoB,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC;CACnD,CAAA;AAED;;;;GAIG;AAEH;;GAEG;AACH,MAAM,UAAU,GAAG,CAAC,EAClB,UAAU,GAAG,cAAc,EAC3B,QAAQ,GACQ,EAAe,EAAE;IACjC,OAAO,oBAAC,iBAAiB,OAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAI,CAAA;AAC5D,CAAC,CAAA;AAED,UAAU,CAAC,WAAW,GAAG,aAAa,CAAC,UAAU,CAAA;AAEjD,eAAe,UAAU,CAAA"}

package/lib/components/button/list/ButtonListProps.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { Centerable, Layout } from '../../../objects';
-import type { DividerProps } from '../../divider/DividerProps';
-import type { ButtonProps } from '../ButtonProps';
+import type { DividerProps } from '../../../components/divider/DividerProps';
+import type { ButtonProps } from '../../../components/button/ButtonProps';
 type ButtonListChildrenTypes = React.ReactElement<ButtonProps | DividerProps> | undefined;
 /**
  * Button List Interface

package/lib/components/button/test/Button.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/button/test/Button.test.js

@@ -0,0 +1,120 @@
+// Dependencies
+import * as React from 'react';
+import renderer from 'react-test-renderer';
+import { is } from '../../../services/index';
+// Testing methods
+import { fireEvent, render, screen } from '@testing-library/react';
+// Component to test
+import { getEnumNames } from '../../../helpers';
+import { getButtonVariantClassName } from '../../../objects';
+import { Button, ButtonMarkup, ButtonVariant } from '../';
+describe('Button component', () => {
+    test('should have "button" className', () => {
+        const { getByRole } = render(React.createElement(Button, null));
+        const button = getByRole('button');
+        expect(button).toBeInTheDocument();
+        expect(button).toHaveClass('button');
+    });
+    test('should contain toto as text', () => {
+        const { getByText } = render(React.createElement(Button, null, "toto"));
+        expect(getByText('toto')).toBeInTheDocument();
+    });
+    test('should have a correct html tag', () => {
+        const { getByText } = render(React.createElement(Button, null, "toto"));
+        expect(getByText('toto')).toBeTruthy();
+        getEnumNames(ButtonMarkup).forEach((element) => {
+            const { getByText } = render(React.createElement(Button, { markup: element }, element));
+            expect(getByText(element)).toBeTruthy();
+        });
+    });
+    test('should have "is-loading" className', () => {
+        const { getByText } = render(React.createElement(Button, { loading: true }, "LOADING"));
+        expect(getByText('LOADING')).toHaveClass(is('loading'));
+        expect(getByText('LOADING')).not.toHaveClass(is('loaded'));
+    });
+    test('should have "is-loaded" className', () => {
+        const { getByText } = render(React.createElement(Button, null, "DEFAULT"));
+        expect(getByText('DEFAULT')).toHaveClass(is('loaded'));
+        expect(getByText('DEFAULT')).not.toHaveClass(is('loading'));
+    });
+    test('shouldn have "is-loaded" className', () => {
+        const { getByText } = render(React.createElement(Button, { loading: false }, "LOADED"));
+        expect(getByText('LOADED')).toHaveClass(is('loaded'));
+        expect(getByText('LOADED')).not.toHaveClass(is('loading'));
+    });
+    test('should have disabled attribut', () => {
+        render(React.createElement(Button, { disabled: true }, "DISABLED"));
+        render(React.createElement(Button, { disabled: true }, "DISABLED_BIS"));
+        expect(screen.getByText('DISABLED')).toBeDisabled();
+        expect(screen.getByText('DISABLED_BIS')).toBeDisabled();
+    });
+    test('should not have disabled attribut', () => {
+        render(React.createElement(Button, null, "DEFAULT"));
+        render(React.createElement(Button, { disabled: false }, "DISABLED"));
+        expect(screen.getByText('DEFAULT')).not.toBeDisabled();
+        expect(screen.getByText('DISABLED')).not.toBeDisabled();
+    });
+    test('should have a correct variant className', () => {
+        getEnumNames(ButtonVariant).forEach((element) => {
+            render(React.createElement(Button, { variant: element }, element));
+            expect(screen.getByText(element)).toHaveClass(is(getButtonVariantClassName(element)));
+        });
+    });
+    test('should have "is-fullwidth" className', () => {
+        render(React.createElement(Button, { fullwidth: true }, "FULLWIDTH"));
+        expect(screen.getByText('FULLWIDTH')).toHaveClass(is('fullwidth'));
+    });
+    test('should not have "is-fullwidth" className', () => {
+        render(React.createElement(Button, null, "DEFAULT"));
+        render(React.createElement(Button, { fullwidth: false }, "FULLWIDTH"));
+        expect(screen.getByText('DEFAULT')).not.toHaveClass(is('fullwidth'));
+        expect(screen.getByText('FULLWIDTH')).not.toHaveClass(is('fullwidth'));
+    });
+    test('should onClick attribut work', () => {
+        const mockCallBack = jest.fn();
+        render(React.createElement(Button, { onClick: mockCallBack }, "DEFAULT"));
+        fireEvent.click(screen.getByText('DEFAULT'));
+        expect(mockCallBack).toHaveBeenCalled();
+    });
+    test('should be disabled', () => {
+        const mockCallBack = jest.fn();
+        render(React.createElement(Button, { disabled: true, onClick: mockCallBack }, "DEFAULT"));
+        fireEvent.click(screen.getByText('DEFAULT'));
+        expect(screen.getByText('DEFAULT')).toBeDisabled();
+        expect(mockCallBack).not.toHaveBeenCalled();
+    });
+    test('should be disabled with input tag', () => {
+        const mockCallBack = jest.fn();
+        const { getByTestId } = render(React.createElement(Button, { testId: 'btn', markup: 'input', disabled: true, onClick: mockCallBack }, "DEFAULT"));
+        const btn = getByTestId('btn');
+        fireEvent.click(btn);
+        expect(btn).toBeDisabled();
+        expect(mockCallBack).not.toHaveBeenCalled();
+    });
+    test('should be disabled with <a> tag', () => {
+        const mockCallBack = jest.fn();
+        const { getByTestId } = render(React.createElement(Button, { testId: 'btn', markup: 'a', disabled: true, onClick: mockCallBack }, "DEFAULT"));
+        const btn = getByTestId('btn');
+        fireEvent.click(btn);
+        expect(mockCallBack).not.toHaveBeenCalled();
+    });
+    test('should execute onclick with input tag', () => {
+        const mockCallBack = jest.fn();
+        const { getByTestId } = render(React.createElement(Button, { testId: 'btn', markup: 'input', onClick: mockCallBack }, "DEFAULT"));
+        const btn = getByTestId('btn');
+        fireEvent.click(btn);
+        expect(mockCallBack).toHaveBeenCalled();
+    });
+    test('should be routerlink', () => {
+        const { getByTestId } = render(React.createElement(Button, { routerLink: 'a', to: 'test', testId: 'btn', markup: 'a' }, "DEFAULT"));
+        const btn = getByTestId('btn');
+        expect(btn).toBeInTheDocument();
+    });
+    test('snapshot', () => {
+        const tree = renderer
+            .create(React.createElement(Button, { onClick: jest.fn(), loading: false, markup: ButtonMarkup.INPUT, className: 'className', id: 'id', disabled: false, variant: ButtonVariant.PRIMARY, fullwidth: true }, "SnapShot"))
+            .toJSON();
+        expect(tree).toMatchSnapshot();
+    });
+});
+//# sourceMappingURL=Button.test.js.map