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

package/lib/components/autolayout/DefaultSpacingMatrix.js

@@ -0,0 +1,79 @@
+import { SpacerSize } from '../spacer';
+import { SpacingMatrixMode } from './SpacingMatrix';
+const { HUGE, LARGE, MEDIUM, SMALL, NONE } = SpacerSize;
+export const { INSERT_SPACE_BETWEEN } = SpacingMatrixMode;
+/**
+ * Spacing matrix for defining spacings between component types
+ */
+export const DEFAULT_SPACING_MATRIX = [
+    [INSERT_SPACE_BETWEEN, 'Box', 'Box', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Box', 'Button', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Box', 'Title', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Button', 'Button', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Title', 'Button', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Button', 'Divider', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Button', 'Link', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Button', 'Title', HUGE],
+    [INSERT_SPACE_BETWEEN, 'Text', 'Button', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Text', 'Title', SMALL],
+    [INSERT_SPACE_BETWEEN, 'default', 'Divider', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Divider', 'Button', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Divider', 'default', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Image', 'Title', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Input', 'Input', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Input', 'Progress', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Link', 'Button', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Link', 'Link', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Notification', 'Notification', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Progress', 'Progress', SMALL],
+    [INSERT_SPACE_BETWEEN, 'ProgressRadial', 'ProgressRadial', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Radio', 'Button', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Sticker', 'Sticker', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Text', 'Radio', HUGE],
+    [INSERT_SPACE_BETWEEN, 'Text', 'Box', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Text', 'Title', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Title', 'Box', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Title', 'Text', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Title', 'Card', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Title', 'Icon', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Title', 'Notification', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Title', 'Title', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Title', 'Tag', LARGE],
+    [INSERT_SPACE_BETWEEN, 'Title', 'default', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Title', 'Text', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Tag', 'Text', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Tag', 'Title', LARGE],
+    [INSERT_SPACE_BETWEEN, 'AutoLayout', 'default', NONE],
+    [INSERT_SPACE_BETWEEN, 'default', 'AutoLayout', NONE],
+    [INSERT_SPACE_BETWEEN, 'Container', 'default', NONE],
+    [INSERT_SPACE_BETWEEN, 'default', 'Container', NONE],
+    [INSERT_SPACE_BETWEEN, 'Spacer', 'default', NONE],
+    [INSERT_SPACE_BETWEEN, 'default', 'Spacer', NONE],
+    [INSERT_SPACE_BETWEEN, 'View', 'default', NONE],
+    [INSERT_SPACE_BETWEEN, 'default', 'View', NONE],
+    [INSERT_SPACE_BETWEEN, 'Radio', 'default', HUGE],
+    [INSERT_SPACE_BETWEEN, 'default', 'Radio', HUGE],
+    [INSERT_SPACE_BETWEEN, 'Checkbox', 'default', HUGE],
+    [INSERT_SPACE_BETWEEN, 'default', 'Checkbox', HUGE],
+    [INSERT_SPACE_BETWEEN, 'default', 'Otp', HUGE],
+    [INSERT_SPACE_BETWEEN, 'Checkbox', 'default', HUGE],
+    [INSERT_SPACE_BETWEEN, 'default', 'Checkbox', HUGE],
+    [INSERT_SPACE_BETWEEN, 'Columns', 'Columns', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Columns', 'default', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'default', 'Columns', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Link', 'default', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'default', 'Link', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Input', 'default', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'default', 'Input', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Text', 'default', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'default', 'Text', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Icon', 'default', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Button', 'default', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'default', 'Button', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'default', 'default', SMALL],
+    [INSERT_SPACE_BETWEEN, 'Image', 'Text', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Image', 'Title', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'View', 'Card', MEDIUM],
+    [INSERT_SPACE_BETWEEN, 'Card', 'View', MEDIUM],
+];
+//# sourceMappingURL=DefaultSpacingMatrix.js.map

package/lib/components/autolayout/DefaultSpacingMatrix.js.map

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

package/lib/components/autolayout/SpacingMatrix.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+import type { TrilogyComponents } from '../index.d';
+import { SpacerSize } from '../spacer';
+export declare enum SpacingMatrixMode {
+    /**
+     * Insert space between two elements.
+     */
+    INSERT_SPACE_BETWEEN = 0,
+    /**
+     * Insert an element between two elements.
+     */
+    INSERT_ELEMENT_BETWEEN = 1
+}
+export type SpacingRule = [
+    typeof SpacingMatrixMode.INSERT_SPACE_BETWEEN,
+    TrilogyComponents | undefined | 'default',
+    TrilogyComponents | undefined | 'default',
+    SpacerSize
+] | [
+    typeof SpacingMatrixMode.INSERT_ELEMENT_BETWEEN,
+    TrilogyComponents | undefined | 'default',
+    TrilogyComponents | undefined | 'default',
+    JSX.Element
+];
+export type SpacingMatrix = SpacingRule[];

package/lib/components/autolayout/SpacingMatrix.js

@@ -0,0 +1,12 @@
+export var SpacingMatrixMode;
+(function (SpacingMatrixMode) {
+    /**
+     * Insert space between two elements.
+     */
+    SpacingMatrixMode[SpacingMatrixMode["INSERT_SPACE_BETWEEN"] = 0] = "INSERT_SPACE_BETWEEN";
+    /**
+     * Insert an element between two elements.
+     */
+    SpacingMatrixMode[SpacingMatrixMode["INSERT_ELEMENT_BETWEEN"] = 1] = "INSERT_ELEMENT_BETWEEN";
+})(SpacingMatrixMode || (SpacingMatrixMode = {}));
+//# sourceMappingURL=SpacingMatrix.js.map

package/lib/components/autolayout/SpacingMatrix.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpacingMatrix.js","sourceRoot":"","sources":["../../../components/autolayout/SpacingMatrix.ts"],"names":[],"mappings":"AAGA,MAAM,CAAN,IAAY,iBAUX;AAVD,WAAY,iBAAiB;IAC3B;;OAEG;IACH,yFAAoB,CAAA;IAEpB;;OAEG;IACH,6FAAsB,CAAA;AACxB,CAAC,EAVW,iBAAiB,KAAjB,iBAAiB,QAU5B"}

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

@@ -0,0 +1,3 @@
+import AutoLayout from './AutoLayout';
+import AutoLayoutWrapper from './AutoLayoutWrapper';
+export { AutoLayout, AutoLayoutWrapper };

package/lib/components/autolayout/index.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/autolayout/index.ts"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAEnD,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,CAAA"}

package/lib/components/badge/Badge.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { BadgeProps } from './BadgeProps';
+/**
+ * Badge Component
+ * @param children {React.ReactNode} If no content add children (Icon for example)
+ * @param textContent {string} Content text for badge with text, if textContent props, it will display badge with text
+ * @param content {string|number} Badge content text
+ * @param direction {BadgeTextDirection} Text direction for Badge (LEFT|RIGHT)
+ * @param color {BadgeColor} Change color for Badge
+ * @param onClick {Function} onClick Event for Badge
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal CSS Classes (ONLY FOR WEB)
+ */
+declare const Badge: ({ children, className, textContent, content, direction, color, onClick, testId, ...others }: BadgeProps) => JSX.Element;
+export default Badge;

package/lib/components/badge/Badge.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import { Text, TextMarkup } from '../text';
+import { BadgeTextDirection } from './BadgeEnum';
+import { has } from '../../services';
+import { getColorClassName } from '../../objects/facets';
+import clsx from 'clsx';
+import { hashClass } from '../../helpers';
+import { useTrilogyContext } from '../../context';
+/**
+ * Badge Component
+ * @param children {React.ReactNode} If no content add children (Icon for example)
+ * @param textContent {string} Content text for badge with text, if textContent props, it will display badge with text
+ * @param content {string|number} Badge content text
+ * @param direction {BadgeTextDirection} Text direction for Badge (LEFT|RIGHT)
+ * @param color {BadgeColor} Change color for Badge
+ * @param onClick {Function} onClick Event for Badge
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal CSS Classes (ONLY FOR WEB)
+ */
+const Badge = ({ children, className, textContent, content, direction, color, onClick, testId, ...others }) => {
+    const { styled } = useTrilogyContext();
+    const classes = hashClass(styled, clsx(textContent ? 'badge-and-text' : 'badge', className));
+    if (textContent) {
+        return (React.createElement("div", { "data-testid": testId, onClick: (e) => {
+                onClick === null || onClick === void 0 ? void 0 : onClick(e);
+                e.stopPropagation();
+            }, className: classes, ...others },
+            (!direction || direction === BadgeTextDirection.LEFT) && React.createElement(Text, { markup: TextMarkup.P }, textContent),
+            React.createElement("span", { className: hashClass(styled, clsx(color && has(`background-${getColorClassName(color)}`), 'badge is-level')) }, content || children),
+            direction === BadgeTextDirection.RIGHT && React.createElement(Text, { markup: TextMarkup.P }, textContent)));
+    }
+    return (React.createElement("div", { "data-testid": testId, onClick: (e) => {
+            onClick === null || onClick === void 0 ? void 0 : onClick(e);
+            e.stopPropagation();
+        } },
+        React.createElement(Text, { className: clsx(color && has(`background-${getColorClassName(color)}`), textContent ? 'badge-and-text' : 'badge', className), markup: TextMarkup.SPAN, ...others }, content || children)));
+};
+export default Badge;
+//# sourceMappingURL=Badge.js.map

package/lib/components/badge/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../components/badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAA;AACpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AACxD,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAEjD;;;;;;;;;;GAUG;AACH,MAAM,KAAK,GAAG,CAAC,EACb,QAAQ,EACR,SAAS,EACT,WAAW,EACX,OAAO,EACP,SAAS,EACT,KAAK,EACL,OAAO,EACP,MAAM,EACN,GAAG,MAAM,EACE,EAAe,EAAE;IAC5B,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,MAAM,OAAO,GAAG,SAAS,CACvB,MAAM,EACN,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,OAAO,EAAE,SAAS,CAAC,CAC1D,CAAA;IAED,IAAI,WAAW,EAAE;QACf,OAAO,CACL,4CACe,MAAM,EACnB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACb,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAA;gBACZ,CAAC,CAAC,eAAe,EAAE,CAAA;YACrB,CAAC,EACD,SAAS,EAAE,OAAO,KACd,MAAM;YAET,CAAC,CAAC,SAAS,IAAI,SAAS,KAAK,kBAAkB,CAAC,IAAI,CAAC,IAAI,oBAAC,IAAI,IAAC,MAAM,EAAE,UAAU,CAAC,CAAC,IAAG,WAAW,CAAQ;YAC1G,8BAAM,SAAS,EAAE,SAAS,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,IAAI,GAAG,CAAC,cAAc,iBAAiB,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,gBAAgB,CAAC,CAAC,IAAG,OAAO,IAAI,QAAQ,CAAQ;YAC/I,SAAS,KAAK,kBAAkB,CAAC,KAAK,IAAI,oBAAC,IAAI,IAAC,MAAM,EAAE,UAAU,CAAC,CAAC,IAAG,WAAW,CAAQ,CACvF,CACP,CAAA;KACF;IAED,OAAO,CACL,4CACe,MAAM,EACnB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACb,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAA;YACZ,CAAC,CAAC,eAAe,EAAE,CAAA;QACrB,CAAC;QAED,oBAAC,IAAI,IACH,SAAS,EAAE,IAAI,CACb,KAAK,IAAI,GAAG,CAAC,cAAc,iBAAiB,CAAC,KAAK,CAAC,EAAE,CAAC,EACtD,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,OAAO,EACxC,SAAS,CACV,EACD,MAAM,EAAE,UAAU,CAAC,IAAI,KACnB,MAAM,IAET,OAAO,IAAI,QAAQ,CACf,CACH,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,KAAK,CAAA"}

package/lib/components/badge/Badge.native.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { BadgeProps } from './BadgeProps';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * Badge Native Component
+ * @param children {React.ReactNode} If no content add children (Icon for example)
+ * @param textContent {string} Content text for badge with text, if textContent props, it will display badge with text
+ * @param content content {string|number} Badge content text
+ * @param direction {BadgeTextDirection} Text direction for Badge (LEFT|RIGHT)
+ * @param onClick {Function} onClick Event for Badge
+ * @param color {BadgeColor} Change color for Badge
+ */
+declare const Badge: {
+    ({ children, textContent, content, direction, color, onClick, ...others }: BadgeProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default Badge;

package/lib/components/badge/Badge.native.js

@@ -0,0 +1,60 @@
+import React from 'react';
+import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+import { BadgeTextDirection, BadgeColor } from './BadgeEnum';
+import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * Badge Native Component
+ * @param children {React.ReactNode} If no content add children (Icon for example)
+ * @param textContent {string} Content text for badge with text, if textContent props, it will display badge with text
+ * @param content content {string|number} Badge content text
+ * @param direction {BadgeTextDirection} Text direction for Badge (LEFT|RIGHT)
+ * @param onClick {Function} onClick Event for Badge
+ * @param color {BadgeColor} Change color for Badge
+ */
+const Badge = ({ children, textContent, content, direction, color, onClick, ...others }) => {
+    const badgeColor = color ? getColorStyle(color) : getColorStyle(BadgeColor.SECONDARY);
+    const textColor = getColorStyle(TrilogyColor.WHITE);
+    const styles = StyleSheet.create({
+        container: {
+            flexDirection: 'row',
+        },
+        badge: {
+            alignSelf: 'baseline',
+            minWidth: 20,
+            height: 20,
+            backgroundColor: badgeColor,
+            borderRadius: 30,
+            justifyContent: 'center',
+            alignItems: 'center',
+        },
+        text: {
+            color: textColor,
+            fontSize: 10,
+        },
+        textContent: {
+            fontSize: 15,
+            marginRight: 5,
+            marginLeft: 5,
+            color: getColorStyle(TrilogyColor.TERTIARY),
+        },
+    });
+    let badgeView;
+    if (textContent) {
+        badgeView = (React.createElement(View, { style: styles.container },
+            !direction && React.createElement(Text, { style: styles.textContent }, textContent),
+            direction && direction === BadgeTextDirection.LEFT && React.createElement(Text, { style: styles.textContent }, textContent),
+            React.createElement(View, { style: styles.badge },
+                React.createElement(Text, { style: styles.text }, content)),
+            direction && direction === BadgeTextDirection.RIGHT && React.createElement(Text, { style: styles.textContent }, textContent)));
+    }
+    else {
+        badgeView = (React.createElement(View, null, content ? (React.createElement(View, { style: styles.badge, ...others },
+            React.createElement(Text, { style: styles.text }, content))) : (React.createElement(View, { style: styles.badge, ...others }, children))));
+    }
+    return onClick ? (React.createElement(View, null,
+        React.createElement(TouchableOpacity, { onPress: onClick, activeOpacity: 0.85 }, badgeView))) : (badgeView);
+};
+Badge.displayName = ComponentName.Badge;
+export default Badge;
+//# sourceMappingURL=Badge.native.js.map

package/lib/components/badge/Badge.native.js.map

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

package/lib/components/badge/BadgeEnum.d.ts

@@ -0,0 +1,10 @@
+export declare enum BadgeTextDirection {
+    LEFT = "left",
+    RIGHT = "right"
+}
+export type BadgeTextDirectionValues = `${BadgeTextDirection}`;
+export declare enum BadgeColor {
+    TERTIARY = "TERTIARY",
+    SECONDARY = "SECONDARY"
+}
+export type BadgeColorValues = `${BadgeColor}`;

package/lib/components/badge/BadgeEnum.js

@@ -0,0 +1,11 @@
+export var BadgeTextDirection;
+(function (BadgeTextDirection) {
+    BadgeTextDirection["LEFT"] = "left";
+    BadgeTextDirection["RIGHT"] = "right";
+})(BadgeTextDirection || (BadgeTextDirection = {}));
+export var BadgeColor;
+(function (BadgeColor) {
+    BadgeColor["TERTIARY"] = "TERTIARY";
+    BadgeColor["SECONDARY"] = "SECONDARY";
+})(BadgeColor || (BadgeColor = {}));
+//# sourceMappingURL=BadgeEnum.js.map

package/lib/components/badge/BadgeEnum.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BadgeEnum.js","sourceRoot":"","sources":["../../../components/badge/BadgeEnum.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC5B,mCAAa,CAAA;IACb,qCAAe,CAAA;AACjB,CAAC,EAHW,kBAAkB,KAAlB,kBAAkB,QAG7B;AAID,MAAM,CAAN,IAAY,UAGX;AAHD,WAAY,UAAU;IACpB,mCAAqB,CAAA;IACrB,qCAAuB,CAAA;AACzB,CAAC,EAHW,UAAU,KAAV,UAAU,QAGrB"}

package/lib/components/badge/BadgeProps.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { Clickable } from './../../objects/facets/Clickable';
+import { BadgeColor, BadgeColorValues, BadgeTextDirection, BadgeTextDirectionValues } from './BadgeEnum';
+import { Accessibility } from '../../objects';
+/**
+ * Badge Interface
+ */
+export interface BadgeProps extends Clickable, Accessibility {
+    children?: React.ReactNode;
+    content?: string | number;
+    textContent?: string;
+    direction?: BadgeTextDirection | BadgeTextDirectionValues;
+    className?: string;
+    color?: BadgeColor | BadgeColorValues;
+}

package/lib/components/badge/BadgeProps.js

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

package/lib/components/badge/BadgeProps.js.map

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

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

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

package/lib/components/badge/index.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/badge/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,SAAS,CAAA;AAE3B,cAAc,aAAa,CAAA;AAE3B,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/lib/components/box/Box.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import { BoxProps } from './BoxProps';
+/**
+ * Box Component
+ * @param children {React.ReactNode} Box child
+ * @param onClick {Function} onClick Event
+ * @param skeleton {boolean} Box skeleton
+ * @param background {TrilogyColor} Box Content Background Color
+ * @param leftBorder {TrilogyColor} Add Left Highlight Border With Semantic Color
+ * @param shadowless {boolean} Remove box shadow
+ * @param flat {boolean} Flat box remove shadow and add plain border
+ * @param backgroundSrc {string} Source of background Image
+ * @param testId {string} Test id
+ * @param hat {boolean} Box with a component Sticker props:hat
+ * @param active {boolean} Activated box
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal css classes
+ * @param markup {BoxMarkup} Clickable Box => BoxMarkup.A Not clickable box => BoxMarkup.DIV || null
+ * @param to {string} Box link
+ * @param fullheight
+ * @param others
+ */
+declare const Box: ({ children, className, onClick, markup, skeleton, to, background, leftBorder, shadowless, backgroundSrc, testId, flat, hat, fullheight, active, ...others }: BoxProps) => JSX.Element;
+export default Box;

package/lib/components/box/Box.js

@@ -0,0 +1,53 @@
+import React, { useEffect, useState } from 'react';
+import { BoxMarkup } from './BoxProps';
+import { has, is } from '../../services/classify';
+import { getBackgroundClassName } from '../../objects/atoms/Background';
+import { getColorClassName } from '../../objects';
+import clsx from 'clsx';
+import { hashClass } from '../../helpers';
+import { useTrilogyContext } from '../../context';
+/**
+ * Box Component
+ * @param children {React.ReactNode} Box child
+ * @param onClick {Function} onClick Event
+ * @param skeleton {boolean} Box skeleton
+ * @param background {TrilogyColor} Box Content Background Color
+ * @param leftBorder {TrilogyColor} Add Left Highlight Border With Semantic Color
+ * @param shadowless {boolean} Remove box shadow
+ * @param flat {boolean} Flat box remove shadow and add plain border
+ * @param backgroundSrc {string} Source of background Image
+ * @param testId {string} Test id
+ * @param hat {boolean} Box with a component Sticker props:hat
+ * @param active {boolean} Activated box
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additionnal css classes
+ * @param markup {BoxMarkup} Clickable Box => BoxMarkup.A Not clickable box => BoxMarkup.DIV || null
+ * @param to {string} Box link
+ * @param fullheight
+ * @param others
+ */
+const Box = ({ children, className, onClick, markup, skeleton, to, background, leftBorder, shadowless, backgroundSrc, testId, flat, hat, fullheight, active, ...others }) => {
+    const { styled } = useTrilogyContext();
+    const [isLoading, setIsLoading] = useState(skeleton || false);
+    const classes = hashClass(styled, clsx('box', shadowless && is('shadowless'), className, background && has(getBackgroundClassName(background)), isLoading ? is('loading') : is('loaded'), backgroundSrc && has('background'), leftBorder && `${is('highlighted')} ${is(getColorClassName(leftBorder))}`, flat && is('flat'), hat && has('hat'), fullheight && is('fullheight'), active && is('active')));
+    useEffect(() => {
+        setIsLoading(skeleton || false);
+    }, [skeleton]);
+    if (markup === BoxMarkup.A || to) {
+        return (React.createElement("a", { "data-testid": testId, href: to, onClick: (e) => {
+                // eslint-disable-next-line no-unused-expressions
+                onClick === null || onClick === void 0 ? void 0 : onClick(e);
+            }, className: classes, ...others }, children));
+    }
+    const hoverStyle = {
+        cursor: 'pointer',
+    };
+    return (React.createElement("div", { style: onClick && { ...hoverStyle }, "data-testid": testId, onClick: (e) => {
+            // eslint-disable-next-line no-unused-expressions
+            onClick === null || onClick === void 0 ? void 0 : onClick(e);
+        }, className: classes, ...others, ...(backgroundSrc && {
+            style: { backgroundImage: `url(${backgroundSrc})`, backgroundSize: 'cover', backgroundPosition: '50%' },
+        }) }, children));
+};
+export default Box;
+//# sourceMappingURL=Box.js.map

package/lib/components/box/Box.js.map

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

package/lib/components/box/Box.native.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+import { BoxProps } from './BoxProps';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * Box Component
+ * @param children {React.ReactNode} Childrens
+ * @param onClick {Function} onClick Event
+ * @param skeleton {boolean} Box skeleton
+ * @param background {TrilogyColor} Box Content Background Color
+ * @param leftBorder {TrilogyColor} Add Left Highlight Border With Semantic Color
+ * @param testId {string} Test id
+ * @param shadowless {boolean} Remove box shadow
+ * @param backgroundSrc {string} Source of background Image
+ * @param flat {boolean} Flat box remove shadow and add plain border
+ * @param hat {boolean} Box with a component Sticker props:hat
+ * @param flex {boolean} Flex: 1 to the box if usage of Image for Example
+ * @param fullheight {boolean}
+ * @param active {boolean} Activated box
+ * @param others
+ */
+declare const Box: {
+    ({ children, onClick, skeleton, background, leftBorder, testId, shadowless, backgroundSrc, flat, hat, fullheight, active, ...others }: BoxProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default Box;

package/lib/components/box/Box.native.js

@@ -0,0 +1,117 @@
+import React, { useState } from 'react';
+import { StyleSheet, TouchableOpacity, View, Platform, ImageBackground } from 'react-native';
+import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import ContentLoader, { Rect } from 'react-content-loader/native';
+import { getBackgroundStyle } from '../../objects/atoms/Background';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * Box Component
+ * @param children {React.ReactNode} Childrens
+ * @param onClick {Function} onClick Event
+ * @param skeleton {boolean} Box skeleton
+ * @param background {TrilogyColor} Box Content Background Color
+ * @param leftBorder {TrilogyColor} Add Left Highlight Border With Semantic Color
+ * @param testId {string} Test id
+ * @param shadowless {boolean} Remove box shadow
+ * @param backgroundSrc {string} Source of background Image
+ * @param flat {boolean} Flat box remove shadow and add plain border
+ * @param hat {boolean} Box with a component Sticker props:hat
+ * @param flex {boolean} Flex: 1 to the box if usage of Image for Example
+ * @param fullheight {boolean}
+ * @param active {boolean} Activated box
+ * @param others
+ */
+const Box = ({ children, onClick, skeleton, background, leftBorder, testId, shadowless, backgroundSrc, flat, hat, fullheight, active, ...others }) => {
+    const colorBgc = getColorStyle(TrilogyColor.WHITE);
+    const boxRadius = 6;
+    const [boxHeight, setBoxHeight] = useState(0);
+    const styles = StyleSheet.create({
+        box: {
+            width: '100%',
+            backgroundColor: background ? getBackgroundStyle(background) : colorBgc,
+            borderRadius: boxRadius,
+            flexDirection: 'row',
+            justifyContent: 'flex-start',
+            position: 'relative',
+            borderStyle: flat ? 'solid' : undefined,
+            borderWidth: flat && 1 || active && 2 || 0,
+            borderColor: active ? getColorStyle(TrilogyColor.SECONDARY) : getColorStyle(TrilogyColor.GREY),
+            marginTop: hat ? 35 : 0,
+            flex: fullheight ? 1 : 0,
+        },
+        shadow: shadowless
+            ? {}
+            : {
+                shadowColor: '#000',
+                shadowOffset: {
+                    width: 0,
+                    height: 1,
+                },
+                shadowOpacity: 0.22,
+                shadowRadius: 2.22,
+                elevation: 1,
+            },
+        skeleton: {
+            width: '100%',
+            minHeight: 50,
+            backgroundColor: getColorStyle(TrilogyColor.GREY_LIGHTER),
+            overflow: 'hidden',
+            borderRadius: boxRadius,
+        },
+        leftBorder: {
+            position: 'absolute',
+            width: 8,
+            borderTopStartRadius: boxRadius,
+            borderBottomStartRadius: boxRadius,
+            height: boxHeight,
+            backgroundColor: getColorStyle(leftBorder) || 'transparent',
+        },
+        column: {
+            flexDirection: 'column',
+            width: '100%',
+        },
+        boxImage: {
+            width: '100%',
+            minHeight: 100,
+            maxHeight: 300,
+            height: 'auto',
+        },
+        boxImageProps: {},
+        content: {
+            padding: 16,
+        },
+    });
+    const boxTestId = testId || 'NotSpecified';
+    const BoxSkeleton = () => (React.createElement(ContentLoader, { style: styles.skeleton, ...others },
+        React.createElement(View, { style: { opacity: 0 } }, children),
+        Platform.OS === 'android' && (React.createElement(View, null,
+            React.createElement(Rect, { rx: '10', ry: '10', width: '100%', height: '100%' })))));
+    if (skeleton) {
+        return React.createElement(BoxSkeleton, null);
+    }
+    if (onClick) {
+        return (React.createElement(TouchableOpacity, { onPress: (e) => onClick === null || onClick === void 0 ? void 0 : onClick(e), 
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            style: [styles.box, !flat && styles.shadow, others === null || others === void 0 ? void 0 : others.style], onLayout: (event) => {
+                const { height } = event.nativeEvent.layout;
+                setBoxHeight(height);
+            }, testID: boxTestId }, backgroundSrc ? (React.createElement(ImageBackground, { imageStyle: { borderRadius: boxRadius }, style: styles.boxImage, source: typeof backgroundSrc === 'number' ? backgroundSrc : { uri: backgroundSrc } },
+            Boolean(leftBorder) && React.createElement(View, { style: styles.leftBorder }),
+            React.createElement(View, { style: styles.column }, children))) : (React.createElement(React.Fragment, null,
+            Boolean(leftBorder) && React.createElement(View, { style: styles.leftBorder }),
+            React.createElement(View, { style: styles.column }, children)))));
+    }
+    return (React.createElement(View, { onLayout: (event) => {
+            const { height } = event.nativeEvent.layout;
+            setBoxHeight(height);
+        }, 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        style: [styles.box, !flat && styles.shadow, others === null || others === void 0 ? void 0 : others.style], testID: boxTestId }, backgroundSrc ? (React.createElement(ImageBackground, { imageStyle: { borderRadius: boxRadius }, style: styles.boxImage, source: typeof backgroundSrc === 'number' ? backgroundSrc : { uri: backgroundSrc } },
+        Boolean(leftBorder) && React.createElement(View, { style: styles.leftBorder }),
+        React.createElement(View, { style: styles.column }, children))) : (React.createElement(React.Fragment, null,
+        Boolean(leftBorder) && React.createElement(View, { style: styles.leftBorder }),
+        React.createElement(View, { style: styles.column }, children)))));
+};
+Box.displayName = ComponentName.Box;
+export default Box;
+//# sourceMappingURL=Box.native.js.map

package/lib/components/box/Box.native.js.map

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