@trilogy-ds/react 0.0.1-beta-1 → 0.0.1-beta-3

package/lib/components/otp/Otp.native.js

@@ -0,0 +1,138 @@
+import React, { useState, useRef, useEffect } from 'react';
+import { SafeAreaView, StyleSheet, View, TextInput, Pressable } from 'react-native';
+import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import { Icon, IconSize, IconColor, IconName } from '../icon';
+import { Title, TitleLevels } from '../title';
+import { Text, TextLevels } from '../text';
+import { TypographyAlign } from '../../objects';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * OTP Code Component
+ * @param code {string} Code Text Input
+ * @param codeSize {number} Code Size Number
+ * @param disabled {boolean} Disabled OTP Code Input
+ * @param error {boolean} OTP Code Input has error | Display error icon
+ * @param onCompleted {Function} Return code input string
+ * @param onFocus {Function} onFocus return if focused opt
+ * @param activated {boolean} Activated OTP
+ * @param onChange {Function} onChange Input return current code
+ */
+const Otp = ({ code, codeSize = 6, disabled, error, onCompleted, onFocus, activated, onChange, label, ...others }) => {
+    const [codeInput, setCodeInput] = useState(code || '');
+    // eslint-disable-next-line prefer-spread
+    const [codeDigitsArray] = useState(Array.apply(null, Array(codeSize)).map((_val, idx) => idx));
+    const [focused, setFocused] = useState(false);
+    const color = (disabled && getColorStyle(TrilogyColor.GREY)) ||
+        (activated && getColorStyle(TrilogyColor.GREY)) ||
+        (error && getColorStyle(TrilogyColor.ERROR)) ||
+        (focused && getColorStyle(TrilogyColor.TERTIARY)) ||
+        getColorStyle(TrilogyColor.GREY);
+    useEffect(() => {
+        if (/^-?\d*\.?\d*$/.test(codeInput) && !disabled) {
+            setCodeInput(code || '');
+        }
+    }, [code]);
+    useEffect(() => {
+        if (!disabled && codeInput && codeInput.length >= codeSize) {
+            onCompleted === null || onCompleted === void 0 ? void 0 : onCompleted(codeInput);
+        }
+    }, [code, codeSize, codeInput]);
+    const ref = useRef(null);
+    const handleOnPress = () => {
+        var _a;
+        (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.focus();
+    };
+    const style = StyleSheet.create({
+        container: {
+            flex: 1,
+            alignItems: 'flex-start',
+            justifyContent: 'center',
+            alignSelf: 'center',
+        },
+        inputsContainer: {
+            flexDirection: 'row',
+            justifyContent: 'center',
+            alignItems: 'center',
+        },
+        inputContainer: {
+            borderColor: (disabled && getColorStyle(TrilogyColor.GREY)) ||
+                (activated && getColorStyle(TrilogyColor.GREY)) ||
+                (error && getColorStyle(TrilogyColor.ERROR)) ||
+                getColorStyle(TrilogyColor.GREY),
+            borderWidth: 1,
+            borderRadius: 4,
+            marginHorizontal: 5,
+            justifyContent: 'center',
+            alignContent: 'center',
+            alignItems: 'center',
+            width: 28,
+            height: 35,
+        },
+        inputSelectedContainer: {
+            borderColor: color,
+            borderWidth: 1,
+            borderRadius: 4,
+            marginHorizontal: 5,
+            justifyContent: 'center',
+            alignContent: 'center',
+            alignItems: 'center',
+            width: 28,
+            height: 35,
+        },
+        hiddenCodeInput: {
+            position: 'absolute',
+            height: 1,
+            width: 1,
+            opacity: 0,
+        },
+        icon: {
+            marginHorizontal: 8,
+            marginBottom: 8,
+        },
+        currentInput: {
+            width: 15,
+            height: 1,
+            backgroundColor: (focused && getColorStyle(TrilogyColor.TERTIARY)) || 'transparent',
+        },
+        text: {
+            paddingLeft: 5,
+            marginBottom: 8,
+            color: color,
+        },
+    });
+    const toDigitInput = (_value, idx) => {
+        const emptyInputChar = ' ';
+        const digit = codeInput[idx] || emptyInputChar;
+        if (idx <= codeInput.length) {
+            return (React.createElement(View, { key: idx, style: style.inputSelectedContainer },
+                React.createElement(Title, { typo: TypographyAlign.TEXT_CENTERED, level: TitleLevels.THREE }, digit),
+                Boolean(idx === codeInput.length) && React.createElement(View, { style: style.currentInput })));
+        }
+        return (React.createElement(View, { key: idx, style: style.inputContainer },
+            React.createElement(Title, { level: TitleLevels.THREE }, digit)));
+    };
+    return (React.createElement(SafeAreaView, { style: style.container, ...others },
+        React.createElement(View, { style: { flexDirection: 'row', alignItems: 'center' } },
+            Boolean(label) && (React.createElement(Text, { style: style.text, level: TextLevels.THREE }, label)),
+            error && (React.createElement(Icon, { style: style.icon, name: IconName.EXCLAMATION_CIRCLE, color: IconColor.ERROR, size: IconSize.SMALL }))),
+        React.createElement(Pressable, { style: style.inputsContainer, onPress: handleOnPress }, codeDigitsArray.map((_item, index) => (React.createElement(View, { key: index }, toDigitInput(index, index))))),
+        React.createElement(TextInput, { ref: ref, value: codeInput, onChangeText: (code) => {
+                if (/^-?\d*\.?\d*$/.test(code) && !disabled) {
+                    if (onChange) {
+                        onChange(code);
+                    }
+                    setCodeInput(code);
+                }
+            }, keyboardType: 'numeric', returnKeyType: 'send', textContentType: 'oneTimeCode', maxLength: codeSize, onFocus: () => {
+                if (!disabled) {
+                    setFocused(true);
+                    onFocus === null || onFocus === void 0 ? void 0 : onFocus(true);
+                }
+            }, onBlur: () => {
+                setFocused(false);
+                onFocus === null || onFocus === void 0 ? void 0 : onFocus(false);
+            }, editable: !disabled, style: style.hiddenCodeInput })));
+};
+Otp.displayName = ComponentName.Otp;
+export default Otp;
+//# sourceMappingURL=Otp.native.js.map

package/lib/components/otp/Otp.native.js.map

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

package/lib/components/otp/OtpProps.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+/**
+ * Otp Interface
+ */
+export interface OtpProps {
+    className?: string;
+    code?: string;
+    codeSize?: number;
+    disabled?: boolean;
+    error?: boolean;
+    onCompleted?: (code?: string) => void;
+    onFocus?: (focused: boolean) => void;
+    onChange?: (code?: string) => void;
+    activated?: boolean;
+    label?: string;
+    errorMessage?: React.ReactNode | string;
+    autoFocus?: boolean;
+}

package/lib/components/otp/OtpProps.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=OtpProps.js.map

package/lib/components/otp/OtpProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OtpProps.js","sourceRoot":"","sources":["../../../components/otp/OtpProps.ts"],"names":[],"mappings":""}

package/lib/components/otp/index.d.ts

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

package/lib/components/otp/index.js

@@ -0,0 +1,3 @@
+import Otp from './Otp';
+export { Otp };
+//# sourceMappingURL=index.js.map

package/lib/components/otp/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/otp/index.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,OAAO,CAAA;AAEvB,OAAO,EAAE,GAAG,EAAE,CAAA"}

package/lib/components/pagination/Pagination.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { PaginationProps } from './PaginationProps';
+/**
+ * Pagination Component
+ * @param count {number} Number elements
+ * @param defaultPage {number} Current default active page (default is 1)
+ * @param pageSize {number} Element per page (default is 10)
+ * @param onClick {Function} Return pagination object
+ * * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal css classes
+ * @param href {Function} Function that generates a link for seo bots
+ */
+declare const Pagination: ({ className, count, defaultPage, pageSize, onClick, testId, href, ...others }: PaginationProps) => JSX.Element;
+export default Pagination;

package/lib/components/pagination/Pagination.js

@@ -0,0 +1,90 @@
+import React, { useEffect, useState, useRef } from 'react';
+import { is } from '../../services/index';
+import { Icon, IconName } from '../icon';
+import { hashClass } from '../../helpers';
+import clsx from 'clsx';
+import { useTrilogyContext } from '../../context';
+/**
+ * Pagination Component
+ * @param count {number} Number elements
+ * @param defaultPage {number} Current default active page (default is 1)
+ * @param pageSize {number} Element per page (default is 10)
+ * @param onClick {Function} Return pagination object
+ * * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal css classes
+ * @param href {Function} Function that generates a link for seo bots
+ */
+const Pagination = ({ className, count, defaultPage = 1, pageSize = 10, onClick, testId, href, ...others }) => {
+    const [currentPage, setCurrentPage] = useState(defaultPage);
+    const { styled } = useTrilogyContext();
+    const classes = hashClass(styled, clsx('pagination', is('rounded'), is('centered'), className));
+    const prevCurrentPage = useRef(currentPage);
+    const pager = React.useMemo(() => {
+        // Calculate total pages
+        const totalPages = Math.ceil(count / pageSize);
+        let startPage = 1;
+        let endPage = 5;
+        if (totalPages <= 5) {
+            // less than pageSize(default is 5) total pages so show all
+            startPage = 1;
+            endPage = totalPages;
+        }
+        else {
+            // more than 3 total pages so calculate start and end pages
+            if (currentPage <= 3) {
+                startPage = 1;
+                endPage = 5;
+            }
+            else if (currentPage + 3 >= totalPages) {
+                startPage = totalPages - 4;
+                endPage = totalPages;
+            }
+            else {
+                startPage = currentPage - 2;
+                endPage = currentPage + 2;
+            }
+        }
+        // Create an array of pages
+        const pages = [...Array(endPage + 1 - startPage).keys()].map((i) => startPage + i);
+        // Set pager object
+        return {
+            currentPage,
+            pageSize,
+            totalPages,
+            endPage,
+            pages,
+        };
+    }, [currentPage, pageSize, count]);
+    useEffect(() => {
+        if (onClick && prevCurrentPage.current !== pager.currentPage) {
+            onClick(pager);
+        }
+        setCurrentPage(pager.currentPage);
+        prevCurrentPage.current = pager.currentPage;
+    }, [pager.currentPage]);
+    const totalCountPages = count / pageSize;
+    return (React.createElement("nav", { "data-testid": testId, className: classes, ...others },
+        React.createElement("a", { className: hashClass(styled, clsx('pagination-previous')), "aria-disabled": currentPage === 1, onClick: () => {
+                if (currentPage !== 1) {
+                    setCurrentPage(currentPage - 1);
+                }
+            }, href: href === null || href === void 0 ? void 0 : href(currentPage - 1) },
+            React.createElement(Icon, { name: IconName.ARROW_LEFT })),
+        React.createElement("ul", { className: hashClass(styled, clsx('pagination-list')) },
+            !pager.pages.includes(1) && (React.createElement("li", null,
+                React.createElement("span", { className: hashClass(styled, clsx('pagination-ellipsis')) }, "\u2026"))),
+            pager.pages.map((pageNumber) => (React.createElement("li", { "data-testid": `${testId}_${pageNumber}`, key: pageNumber },
+                React.createElement("a", { className: hashClass(styled, clsx('pagination-link', currentPage === pageNumber && is('current'))), "aria-label": `Aller à la page ${pageNumber}`, onClick: () => {
+                        setCurrentPage(pageNumber);
+                    }, href: href === null || href === void 0 ? void 0 : href(pageNumber) }, pageNumber)))),
+            !pager.pages.includes(totalCountPages) && (React.createElement("li", null,
+                React.createElement("span", { className: hashClass(styled, clsx('pagination-ellipsis')) }, "\u2026")))),
+        React.createElement("a", { className: hashClass(styled, clsx('pagination-next')), "aria-disabled": currentPage === Math.max(pager.totalPages), onClick: () => {
+                if (currentPage !== Math.max(pager.totalPages)) {
+                    setCurrentPage(currentPage + 1);
+                }
+            }, href: href === null || href === void 0 ? void 0 : href(currentPage + 1) },
+            React.createElement(Icon, { name: IconName.ARROW_RIGHT }))));
+};
+export default Pagination;
+//# sourceMappingURL=Pagination.js.map

package/lib/components/pagination/Pagination.js.map

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

package/lib/components/pagination/Pagination.native.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { PaginationProps } from './PaginationProps';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * Pagination Component
+ * @param count {number} Number elements
+ * @param defaultPage {number} Current default active page (default is 1)
+ * @param pageSize {number} Element per page (default is 10)
+ * @param onClick {Function} Return pagination object
+ */
+declare const Pagination: {
+    ({ count, defaultPage, pageSize, onClick, ...others }: PaginationProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default Pagination;

package/lib/components/pagination/Pagination.native.js

@@ -0,0 +1,155 @@
+import React, { useEffect, useState, useRef } from 'react';
+import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+import { Icon, IconName, IconSize } from '../icon';
+import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * Pagination Component
+ * @param count {number} Number elements
+ * @param defaultPage {number} Current default active page (default is 1)
+ * @param pageSize {number} Element per page (default is 10)
+ * @param onClick {Function} Return pagination object
+ */
+const Pagination = ({ count, defaultPage = 1, pageSize = 10, onClick, ...others }) => {
+    const [currentPage, setCurrentPage] = useState(defaultPage);
+    const [arrayPage] = useState(Array.from(Array(count + 1).keys()));
+    const prevCurrentPage = useRef(currentPage);
+    const [pager, setPager] = useState({
+        currentPage: currentPage,
+        pageSize: pageSize,
+        totalPages: pageSize,
+        endPage: count,
+        pages: arrayPage,
+    });
+    useEffect(() => {
+        // Calculate total pages
+        const totalPages = Math.ceil(count / pageSize);
+        let startPage = 1;
+        let endPage = 5;
+        if (totalPages <= 5) {
+            // less than pageSize(default is 5) total pages so show all
+            startPage = 1;
+            endPage = totalPages;
+        }
+        else {
+            // more than 3 total pages so calculate start and end pages
+            if (currentPage <= 3) {
+                startPage = 1;
+                endPage = 5;
+            }
+            else if (currentPage + 3 >= totalPages) {
+                startPage = totalPages - 4;
+                endPage = totalPages;
+            }
+            else {
+                startPage = currentPage - 2;
+                endPage = currentPage + 2;
+            }
+        }
+        // Create an array of pages
+        const pages = [...Array(endPage + 1 - startPage).keys()].map((i) => startPage + i);
+        // Set pager object
+        setPager({
+            currentPage,
+            pageSize,
+            totalPages,
+            endPage,
+            pages,
+        });
+    }, [currentPage, pageSize, count]);
+    useEffect(() => {
+        if (onClick && prevCurrentPage.current !== currentPage) {
+            onClick(pager);
+        }
+    }, [currentPage]);
+    const totalCountPages = count / pageSize;
+    const styles = StyleSheet.create({
+        container: {
+            flexDirection: 'row',
+            alignSelf: 'center',
+            alignItems: 'center',
+            justifyContent: 'center',
+        },
+        text: {
+            fontSize: 18,
+            color: '#333',
+            alignSelf: 'center',
+            alignItems: 'center',
+            justifyContent: 'center',
+            fontWeight: '400',
+            marginRight: 12,
+        },
+        textCurrent: {
+            fontSize: 18,
+            color: getColorStyle(TrilogyColor.WHITE),
+            alignSelf: 'center',
+            alignItems: 'center',
+            justifyContent: 'center',
+            fontWeight: '400',
+            // marginRight: 12,
+        },
+        rounded: {
+            backgroundColor: getColorStyle(TrilogyColor.SECONDARY),
+            width: 30,
+            height: 30,
+            borderRadius: 30,
+            alignSelf: 'center',
+            alignItems: 'center',
+            justifyContent: 'center',
+            marginRight: 12,
+            marginTop: -3,
+        },
+        currentPage: {
+            fontSize: 18,
+            color: getColorStyle(TrilogyColor.SECONDARY),
+            fontWeight: '500',
+            alignSelf: 'center',
+            alignItems: 'center',
+            justifyContent: 'center',
+            marginRight: 12,
+        },
+        dotsLeft: {
+            color: '#D1D1D1',
+            marginRight: 12,
+        },
+        dotsRight: {
+            color: '#D1D1D1',
+            marginRight: -12,
+        },
+        arrowLeft: {
+            marginRight: 7,
+        },
+        arrowRight: {
+            marginLeft: 7,
+        },
+    });
+    return (React.createElement(View, { style: styles.container, ...others },
+        React.createElement(TouchableOpacity, { style: { marginRight: 5 }, onPress: () => {
+                if (currentPage !== 1) {
+                    setCurrentPage(currentPage - 1);
+                    prevCurrentPage.current = currentPage - 1;
+                }
+            } },
+            React.createElement(Icon, { style: styles.arrowLeft, name: IconName.ARROW_LEFT, size: IconSize.SMALL, color: TrilogyColor.GREY_DARK })),
+        React.createElement(View, { style: { flexDirection: 'row', justifyContent: 'center' } },
+            !pager.pages.includes(1) && (React.createElement(View, null,
+                React.createElement(Text, { style: styles.dotsLeft }, "\u2026"))),
+            pager.pages.map((pageNumber) => (React.createElement(View, { key: pageNumber },
+                React.createElement(TouchableOpacity, { style: currentPage === pageNumber && styles.rounded, onPress: () => {
+                        setCurrentPage(pageNumber);
+                        prevCurrentPage.current = pageNumber;
+                    } },
+                    React.createElement(Text, { style: currentPage === pageNumber ? styles.textCurrent : styles.text }, pageNumber))))),
+            !pager.pages.includes(totalCountPages) && (React.createElement(View, { style: { marginRight: 15 } },
+                React.createElement(Text, { style: styles.dotsRight }, "\u2026")))),
+        React.createElement(TouchableOpacity, { style: { marginLeft: 5 }, onPress: () => {
+                if (currentPage !== Math.max(pager.totalPages)) {
+                    setCurrentPage(currentPage + 1);
+                    prevCurrentPage.current = currentPage + 1;
+                }
+            } },
+            React.createElement(Icon, { style: styles.arrowRight, name: IconName.ARROW_RIGHT, size: IconSize.SMALL, color: TrilogyColor.GREY_DARK }))));
+};
+Pagination.displayName = ComponentName.Pagination;
+export default Pagination;
+//# sourceMappingURL=Pagination.native.js.map

package/lib/components/pagination/Pagination.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.native.js","sourceRoot":"","sources":["../../../components/pagination/Pagination.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAEvE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClD,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAA;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAA;AAGtD;;;;;;GAMG;AACH,MAAM,UAAU,GAAG,CAAC,EAAE,KAAK,EAAE,WAAW,GAAG,CAAC,EAAE,QAAQ,GAAG,EAAE,EAAE,OAAO,EAAE,GAAG,MAAM,EAAmB,EAAe,EAAE;IACjH,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAS,WAAW,CAAC,CAAA;IACnE,MAAM,CAAC,SAAS,CAAC,GAAG,QAAQ,CAAgB,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,CAAA;IAChF,MAAM,eAAe,GAAG,MAAM,CAAS,WAAW,CAAC,CAAA;IAEnD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAQ;QACxC,WAAW,EAAE,WAAW;QACxB,QAAQ,EAAE,QAAQ;QAClB,UAAU,EAAE,QAAQ;QACpB,OAAO,EAAE,KAAK;QACd,KAAK,EAAE,SAAS;KACjB,CAAC,CAAA;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,wBAAwB;QACxB,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,CAAA;QAE9C,IAAI,SAAS,GAAG,CAAC,CAAA;QACjB,IAAI,OAAO,GAAG,CAAC,CAAA;QAEf,IAAI,UAAU,IAAI,CAAC,EAAE;YACnB,2DAA2D;YAC3D,SAAS,GAAG,CAAC,CAAA;YACb,OAAO,GAAG,UAAU,CAAA;SACrB;aAAM;YACL,2DAA2D;YAC3D,IAAI,WAAW,IAAI,CAAC,EAAE;gBACpB,SAAS,GAAG,CAAC,CAAA;gBACb,OAAO,GAAG,CAAC,CAAA;aACZ;iBAAM,IAAI,WAAW,GAAG,CAAC,IAAI,UAAU,EAAE;gBACxC,SAAS,GAAG,UAAU,GAAG,CAAC,CAAA;gBAC1B,OAAO,GAAG,UAAU,CAAA;aACrB;iBAAM;gBACL,SAAS,GAAG,WAAW,GAAG,CAAC,CAAA;gBAC3B,OAAO,GAAG,WAAW,GAAG,CAAC,CAAA;aAC1B;SACF;QAED,2BAA2B;QAC3B,MAAM,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC,OAAO,GAAG,CAAC,GAAG,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,SAAS,GAAG,CAAC,CAAC,CAAA;QAElF,mBAAmB;QACnB,QAAQ,CAAC;YACP,WAAW;YACX,QAAQ;YACR,UAAU;YACV,OAAO;YACP,KAAK;SACN,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,WAAW,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAA;IAElC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,IAAI,eAAe,CAAC,OAAO,KAAK,WAAW,EAAE;YACtD,OAAO,CAAC,KAAK,CAAC,CAAA;SACf;IACH,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAA;IAEjB,MAAM,eAAe,GAAG,KAAK,GAAG,QAAQ,CAAA;IAExC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;QAC/B,SAAS,EAAE;YACT,aAAa,EAAE,KAAK;YACpB,SAAS,EAAE,QAAQ;YACnB,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;SACzB;QACD,IAAI,EAAE;YACJ,QAAQ,EAAE,EAAE;YACZ,KAAK,EAAE,MAAM;YACb,SAAS,EAAE,QAAQ;YACnB,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,UAAU,EAAE,KAAK;YACjB,WAAW,EAAE,EAAE;SAChB;QACD,WAAW,EAAE;YACX,QAAQ,EAAE,EAAE;YACZ,KAAK,EAAE,aAAa,CAAC,YAAY,CAAC,KAAK,CAAC;YACxC,SAAS,EAAE,QAAQ;YACnB,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,UAAU,EAAE,KAAK;YACjB,mBAAmB;SACpB;QACD,OAAO,EAAE;YACP,eAAe,EAAE,aAAa,CAAC,YAAY,CAAC,SAAS,CAAC;YACtD,KAAK,EAAE,EAAE;YACT,MAAM,EAAE,EAAE;YACV,YAAY,EAAE,EAAE;YAChB,SAAS,EAAE,QAAQ;YACnB,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,WAAW,EAAE,EAAE;YACf,SAAS,EAAE,CAAC,CAAC;SACd;QACD,WAAW,EAAE;YACX,QAAQ,EAAE,EAAE;YACZ,KAAK,EAAE,aAAa,CAAC,YAAY,CAAC,SAAS,CAAC;YAC5C,UAAU,EAAE,KAAK;YACjB,SAAS,EAAE,QAAQ;YACnB,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,WAAW,EAAE,EAAE;SAChB;QACD,QAAQ,EAAE;YACR,KAAK,EAAE,SAAS;YAChB,WAAW,EAAE,EAAE;SAChB;QACD,SAAS,EAAE;YACT,KAAK,EAAE,SAAS;YAChB,WAAW,EAAE,CAAC,EAAE;SACjB;QACD,SAAS,EAAE;YACT,WAAW,EAAE,CAAC;SACf;QACD,UAAU,EAAE;YACV,UAAU,EAAE,CAAC;SACd;KACF,CAAC,CAAA;IAEF,OAAO,CACL,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,SAAS,KAAM,MAAM;QACvC,oBAAC,gBAAgB,IACf,KAAK,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,EACzB,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,WAAW,KAAK,CAAC,EAAE;oBACrB,cAAc,CAAC,WAAW,GAAG,CAAC,CAAC,CAAA;oBAC/B,eAAe,CAAC,OAAO,GAAG,WAAW,GAAG,CAAC,CAAA;iBAC1C;YACH,CAAC;YAGD,oBAAC,IAAI,IACH,KAAK,EAAE,MAAM,CAAC,SAAS,EACvB,IAAI,EAAE,QAAQ,CAAC,UAAU,EACzB,IAAI,EAAE,QAAQ,CAAC,KAAK,EACpB,KAAK,EAAE,YAAY,CAAC,SAAS,GAC7B,CAEe;QAEnB,oBAAC,IAAI,IAAC,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,cAAc,EAAE,QAAQ,EAAE;YAC5D,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAC3B,oBAAC,IAAI;gBACH,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,QAAQ,aAAU,CACjC,CACR;YACA,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC,CAC/B,oBAAC,IAAI,IAAC,GAAG,EAAE,UAAU;gBACnB,oBAAC,gBAAgB,IACf,KAAK,EAAE,WAAW,KAAK,UAAU,IAAI,MAAM,CAAC,OAAO,EACnD,OAAO,EAAE,GAAG,EAAE;wBACZ,cAAc,CAAC,UAAU,CAAC,CAAA;wBAC1B,eAAe,CAAC,OAAO,GAAG,UAAU,CAAA;oBACtC,CAAC;oBAED,oBAAC,IAAI,IAAC,KAAK,EAAE,WAAW,KAAK,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,IAAG,UAAU,CAAQ,CAC9E,CACd,CACR,CAAC;YACD,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,eAAe,CAAC,IAAI,CACzC,oBAAC,IAAI,IAAC,KAAK,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE;gBAC9B,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,SAAS,aAAU,CAClC,CACR,CACI;QACP,oBAAC,gBAAgB,IACf,KAAK,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,EACxB,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,WAAW,KAAK,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,EAAE;oBAC9C,cAAc,CAAC,WAAW,GAAG,CAAC,CAAC,CAAA;oBAC/B,eAAe,CAAC,OAAO,GAAG,WAAW,GAAG,CAAC,CAAA;iBAC1C;YACH,CAAC;YAGD,oBAAC,IAAI,IACH,KAAK,EAAE,MAAM,CAAC,UAAU,EACxB,IAAI,EAAE,QAAQ,CAAC,WAAW,EAC1B,IAAI,EAAE,QAAQ,CAAC,KAAK,EACpB,KAAK,EAAE,YAAY,CAAC,SAAS,GAC7B,CAEe,CACd,CACR,CAAA;AACH,CAAC,CAAA;AAED,UAAU,CAAC,WAAW,GAAG,aAAa,CAAC,UAAU,CAAA;AAEjD,eAAe,UAAU,CAAA"}

package/lib/components/pagination/PaginationEnum.d.ts

@@ -0,0 +1,7 @@
+export interface Pager {
+    currentPage: number;
+    pageSize: number;
+    totalPages: number;
+    endPage: number;
+    pages: number[];
+}

package/lib/components/pagination/PaginationEnum.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=PaginationEnum.js.map

package/lib/components/pagination/PaginationEnum.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationEnum.js","sourceRoot":"","sources":["../../../components/pagination/PaginationEnum.ts"],"names":[],"mappings":""}

package/lib/components/pagination/PaginationProps.d.ts

@@ -0,0 +1,13 @@
+import { Accessibility } from '../../objects';
+import { Pager } from './PaginationEnum';
+/**
+ * Pagination Interface
+ */
+export interface PaginationProps extends Accessibility {
+    count: number;
+    defaultPage?: number;
+    pageSize?: number;
+    onClick?: (pager: Pager) => void;
+    className?: string;
+    href?: (page: number) => string;
+}

package/lib/components/pagination/PaginationProps.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=PaginationProps.js.map

package/lib/components/pagination/PaginationProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationProps.js","sourceRoot":"","sources":["../../../components/pagination/PaginationProps.ts"],"names":[],"mappings":""}

package/lib/components/pagination/index.d.ts

@@ -0,0 +1,3 @@
+import Pagination from './Pagination';
+export { Pagination };
+export * from './PaginationEnum';

package/lib/components/pagination/index.js

@@ -0,0 +1,4 @@
+import Pagination from './Pagination';
+export { Pagination };
+export * from './PaginationEnum';
+//# sourceMappingURL=index.js.map

package/lib/components/pagination/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/pagination/index.ts"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,cAAc,CAAA;AAErC,OAAO,EAAE,UAAU,EAAE,CAAA;AAErB,cAAc,kBAAkB,CAAA"}

package/lib/components/popover/Popover.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { PopoverWebProps } from './PopoverProps';
+/**
+ * Popover Component
+ * @param children {ReactNode} Popover children
+ * @param className {string} Additionnal CSS Classes
+ * @param direction {PopoverDirection} Popover direction (DOWN|LEFT|RIGHT)
+ * @param content {ReactNode} Content of the popover (hidden popover if null|undefined)
+ * @param active {boolean} Is the popover active
+ * @param arrowPosition {PopoverArrowPosition} Position of the popover arrow
+ */
+declare const Popover: ({ className, direction, children, active, arrowPosition, content, testId, ...others }: PopoverWebProps) => JSX.Element;
+export default Popover;

package/lib/components/popover/Popover.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { is } from '../../services/classify';
+import { hashClass } from '../../helpers';
+import clsx from 'clsx';
+import { useTrilogyContext } from '../../context';
+/**
+ * Popover Component
+ * @param children {ReactNode} Popover children
+ * @param className {string} Additionnal CSS Classes
+ * @param direction {PopoverDirection} Popover direction (DOWN|LEFT|RIGHT)
+ * @param content {ReactNode} Content of the popover (hidden popover if null|undefined)
+ * @param active {boolean} Is the popover active
+ * @param arrowPosition {PopoverArrowPosition} Position of the popover arrow
+ */
+const Popover = ({ className, direction, children, active, arrowPosition, content, testId, ...others }) => {
+    const { styled } = useTrilogyContext();
+    const classes = hashClass(styled, clsx('popover', direction && is(`popover-${direction}`), active && is('popover-active'), arrowPosition && is(`arrow-${arrowPosition}`), className));
+    return (React.createElement("div", { "data-testid": testId, className: classes, ...others },
+        children,
+        content && (React.createElement("div", { "data-testid": `${testId}_content`, className: hashClass(styled, clsx('popover-content')) }, content))));
+};
+export default Popover;
+//# sourceMappingURL=Popover.js.map

package/lib/components/popover/Popover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../components/popover/Popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAA;AAE5C,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAEjD;;;;;;;;GAQG;AACH,MAAM,OAAO,GAAG,CAAC,EACf,SAAS,EACT,SAAS,EACT,QAAQ,EACR,MAAM,EACN,aAAa,EACb,OAAO,EACP,MAAM,EACN,GAAG,MAAM,EACO,EAAe,EAAE;IACjC,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,MAAM,OAAO,GAAG,SAAS,CACvB,MAAM,EACN,IAAI,CACF,SAAS,EACT,SAAS,IAAI,EAAE,CAAC,WAAW,SAAS,EAAE,CAAC,EACvC,MAAM,IAAI,EAAE,CAAC,gBAAgB,CAAC,EAC9B,aAAa,IAAI,EAAE,CAAC,SAAS,aAAa,EAAE,CAAC,EAC7C,SAAS,CACV,CACF,CAAA;IAED,OAAO,CACL,4CAAkB,MAAM,EAAE,SAAS,EAAE,OAAO,KAAM,MAAM;QACrD,QAAQ;QACR,OAAO,IAAI,CACV,4CAAkB,GAAG,MAAM,UAAU,EAAE,SAAS,EAAE,SAAS,CAAC,MAAM,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC,IACzF,OAAO,CACJ,CACP,CACG,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,OAAO,CAAA"}

package/lib/components/popover/Popover.native.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { PopoverProps } from './PopoverProps';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * Popover Component
+ * @param children {ReactNode} Popover children
+ * @param className {string} Additionnal CSS Classes
+ * @param direction {PopoverDirection} Popover direction (DOWN|LEFT|RIGHT)
+ * @param content {ReactNode} Content of the popover (hidden popover if null|undefined)
+ * @param active {boolean} Is the popover active
+ * @param arrowPosition {PopoverArrowPosition} Position of the popover arrow
+ */
+declare const Popover: {
+    ({ children, active, content, direction }: PopoverProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default Popover;