@trilogy-ds/react 0.0.1-beta.9 → 0.0.4-beta-v4

package/lib/components/columns/Columns.d.ts

@@ -1,19 +1,17 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { ColumnsProps } from './ColumnsProps';
 /**
  * Columns Component
  * @param centered {boolean} Center columns
  * @param verticalCentered {boolean} Vertical centered columns
- * @param gapless {boolean} Delete margins between columns
- * @param marginSize {ColumnsSize} Delete margins between columns with Size (apply is-variable)
- * @param inlined {boolean} Make colomns scrollable to vertical
+ * @param marginSize {ColumnsSize} Delete margins between columns with Size
+ * @param scrollable {boolean} Make colomns scrollable to vertical
  * @param children {React.ReactNode}
- * @param marginless {boolean}
+ * @param marginless {boolean} delete margin
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param multiline {boolean} Multiline Columns
  * @param className {string} Additionnal CSS Classes
  * @param mobile {boolean} Responsive mode
- * @param flex {boolean} Flex direction
  */
-declare const Columns: ({ className, multiline, inlined, mobile, centered, verticalCentered, gapless, marginSize, flex, marginless, ...others }: ColumnsProps) => JSX.Element;
+declare const Columns: ({ className, id, multiline, scrollable, mobile, gap, fullBleed, marginless, align, verticalAlign, ...others }: ColumnsProps) => React.JSX.Element;
 export default Columns;

package/lib/components/columns/Columns.js

@@ -1,27 +1,28 @@
-import React from 'react';
+import { __assign, __rest } from "tslib";
+import * as React from 'react';
 import clsx from 'clsx';
-import { is } from '../../services/classify';
+import { has, is } from '../../services/classify';
 import { hashClass } from '../../helpers';
 import { useTrilogyContext } from '../../context';
+import { getAlignClassName, getJustifiedClassName } from '../../objects';
 /**
  * Columns Component
  * @param centered {boolean} Center columns
  * @param verticalCentered {boolean} Vertical centered columns
- * @param gapless {boolean} Delete margins between columns
- * @param marginSize {ColumnsSize} Delete margins between columns with Size (apply is-variable)
- * @param inlined {boolean} Make colomns scrollable to vertical
+ * @param marginSize {ColumnsSize} Delete margins between columns with Size
+ * @param scrollable {boolean} Make colomns scrollable to vertical
  * @param children {React.ReactNode}
- * @param marginless {boolean}
+ * @param marginless {boolean} delete margin
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param multiline {boolean} Multiline Columns
  * @param className {string} Additionnal CSS Classes
  * @param mobile {boolean} Responsive mode
- * @param flex {boolean} Flex direction
  */
-const Columns = ({ className, multiline, inlined, mobile, centered, verticalCentered, gapless, marginSize, flex, marginless, ...others }) => {
-    const { styled } = useTrilogyContext();
-    const classes = hashClass(styled, clsx('columns', multiline && is('multiline'), inlined && is('inlined'), mobile && is('mobile'), centered && is('centered'), verticalCentered && is('vcentered'), !marginSize && gapless && is('gapless'), !gapless && marginSize && [is('variable'), is(`${marginSize}`)], flex && is('flex'), marginless && is('marginless'), className));
-    return React.createElement("div", { className: classes, ...others });
+var Columns = function (_a) {
+    var className = _a.className, id = _a.id, multiline = _a.multiline, scrollable = _a.scrollable, mobile = _a.mobile, gap = _a.gap, fullBleed = _a.fullBleed, marginless = _a.marginless, align = _a.align, verticalAlign = _a.verticalAlign, others = __rest(_a, ["className", "id", "multiline", "scrollable", "mobile", "gap", "fullBleed", "marginless", "align", "verticalAlign"]);
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx('columns', multiline && is('multiline'), fullBleed && is('fullbleed'), scrollable && is('scrollable'), gap && has("gap-".concat(gap)), typeof gap !== 'undefined' && gap === 0 && is('gapless'), mobile && is('mobile'), align && is(getJustifiedClassName(align)), verticalAlign && is(getAlignClassName(verticalAlign)), marginless && is("marginless"), className));
+    return React.createElement("div", __assign({ id: id, className: classes }, others));
 };
 export default Columns;
-//# sourceMappingURL=Columns.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29sdW1ucy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvY29sdW1ucy9Db2x1bW5zLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBRXZCLE9BQU8sRUFBRSxHQUFHLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDN0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDN0MsT0FBTyxFQUFFLGlCQUFpQixFQUFFLHFCQUFxQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRXBFOzs7Ozs7Ozs7Ozs7R0FZRztBQUNILElBQU0sT0FBTyxHQUFHLFVBQUMsRUFZZTtJQVhiLElBQUEsU0FBUyxlQUFBLEVBQ1QsRUFBRSxRQUFBLEVBQ0YsU0FBUyxlQUFBLEVBQ1QsVUFBVSxnQkFBQSxFQUNWLE1BQU0sWUFBQSxFQUNOLEdBQUcsU0FBQSxFQUNILFNBQVMsZUFBQSxFQUNULFVBQVUsZ0JBQUEsRUFDVixLQUFLLFdBQUEsRUFDTCxhQUFhLG1CQUFBLEVBQ1YsTUFBTSxjQVhYLG9IQVlDLENBRFU7SUFFbEIsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFFdEMsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUN2QixNQUFNLEVBQ04sSUFBSSxDQUNGLFNBQVMsRUFDVCxTQUFTLElBQUksRUFBRSxDQUFDLFdBQVcsQ0FBQyxFQUM1QixTQUFTLElBQUksRUFBRSxDQUFDLFdBQVcsQ0FBQyxFQUM1QixVQUFVLElBQUksRUFBRSxDQUFDLFlBQVksQ0FBQyxFQUM5QixHQUFHLElBQUksR0FBRyxDQUFDLGNBQU8sR0FBRyxDQUFFLENBQUMsRUFDeEIsT0FBTyxHQUFHLEtBQUssV0FBVyxJQUFJLEdBQUcsS0FBSyxDQUFDLElBQUksRUFBRSxDQUFDLFNBQVMsQ0FBQyxFQUN4RCxNQUFNLElBQUksRUFBRSxDQUFDLFFBQVEsQ0FBQyxFQUN0QixLQUFLLElBQUksRUFBRSxDQUFDLHFCQUFxQixDQUFDLEtBQUssQ0FBQyxDQUFDLEVBQ3pDLGFBQWEsSUFBSSxFQUFFLENBQUMsaUJBQWlCLENBQUMsYUFBYSxDQUFDLENBQUMsRUFDckQsVUFBVSxJQUFJLEVBQUUsQ0FBQyxZQUFZLENBQUMsRUFDOUIsU0FBUyxDQUNWLENBQ0YsQ0FBQTtJQUVELE9BQU8sc0NBQUssRUFBRSxFQUFFLEVBQUUsRUFBRSxTQUFTLEVBQUUsT0FBTyxJQUFNLE1BQU0sRUFBSSxDQUFBO0FBQ3hELENBQUMsQ0FBQTtBQUVELGVBQWUsT0FBTyxDQUFBIn0=

package/lib/components/columns/Columns.native.d.ts

@@ -1,20 +1,19 @@
 import React from 'react';
 import { ColumnsProps } from './ColumnsProps';
-import { ComponentName } from '../enumsComponentsName';
+import { ComponentName } from '../../components/enumsComponentsName';
 /**
  * Columns Native Component
  * @param children {React.ReactNode}
  * @param centered {boolean} Center columns
  * @param verticalCentered {boolean} Vertical centered columns
- * @param gapless {boolean} Delete margins between columns
- * @param marginSize {ColumnsSize} Delete margins between columns with Size (apply is-variable)
- * @param inlined {boolean} Make colomns scrollable to vertical. Don't work with props 'marginSize'
+ * @param scrollable {boolean} Makes columns vertically scrollable.
+ * @param gap {GapSize} Gap between columns
  */
 export declare const ColumnsContext: React.Context<{
-    inlined: boolean;
+    scrollable: boolean;
 }>;
 declare const Columns: {
-    ({ children, centered, gapless, marginSize, verticalCentered, inlined, ...others }: ColumnsProps): JSX.Element;
+    ({ children, align, gap, verticalAlign, fullBleed, scrollable, multiline, ...others }: ColumnsProps): JSX.Element;
     displayName: ComponentName;
 };
 export default Columns;

package/lib/components/columns/Columns.native.js

@@ -1,66 +1,101 @@
-import React, { createContext } from 'react';
-import { ScrollView, StyleSheet } from 'react-native';
-import { View } from '../view';
-import { ComponentName } from '../enumsComponentsName';
+import { __assign, __read, __rest } from "tslib";
+import React, { createContext, useState } from 'react';
+import { Dimensions, ScrollView, StyleSheet } from 'react-native';
+import { View } from '../../components/view';
+import { ComponentName } from '../../components/enumsComponentsName';
+import { ColumnsGapValue } from '../../components/columns/ColumnsTypes';
+import { Alignable, getAlignStyle } from '../../objects';
 /**
  * Columns Native Component
  * @param children {React.ReactNode}
  * @param centered {boolean} Center columns
  * @param verticalCentered {boolean} Vertical centered columns
- * @param gapless {boolean} Delete margins between columns
- * @param marginSize {ColumnsSize} Delete margins between columns with Size (apply is-variable)
- * @param inlined {boolean} Make colomns scrollable to vertical. Don't work with props 'marginSize'
+ * @param scrollable {boolean} Makes columns vertically scrollable.
+ * @param gap {GapSize} Gap between columns
  */
-export const ColumnsContext = createContext({ inlined: false });
-const Columns = ({ children, centered, gapless, marginSize, verticalCentered, inlined, ...others }) => {
-    const styles = StyleSheet.create({
+export var ColumnsContext = createContext({ scrollable: false });
+var Columns = function (_a) {
+    var children = _a.children, align = _a.align, gap = _a.gap, verticalAlign = _a.verticalAlign, fullBleed = _a.fullBleed, scrollable = _a.scrollable, multiline = _a.multiline, others = __rest(_a, ["children", "align", "gap", "verticalAlign", "fullBleed", "scrollable", "multiline"]);
+    var _b = __read(useState(0), 2), width = _b[0], setWidth = _b[1];
+    var _c = __read(useState(0), 2), enlarge = _c[0], setEnlarge = _c[1];
+    var onLayoutHandler = function (event) {
+        if (!width) {
+            var width_1 = event.nativeEvent.layout.width;
+            if (fullBleed) {
+                setEnlarge((Dimensions.get('screen').width - width_1) / 2);
+            }
+            setWidth(width_1);
+        }
+    };
+    var realGap = (typeof gap === 'undefined' && 16) || ColumnsGapValue[gap];
+    var styles = StyleSheet.create({
         columns: {
+            width: width ? width + enlarge * 2 : '100%',
+            marginHorizontal: -enlarge,
+            paddingHorizontal: enlarge,
             flexDirection: 'row',
-            minWidth: '100%',
+            gap: realGap,
+            display: 'flex',
+            justifyContent: 'space-evenly',
         },
         centered: {
             alignSelf: 'center',
         },
         verticalAlign: {
-            justifyContent: 'center',
-            flex: 1,
+            alignItems: getAlignStyle(verticalAlign),
         },
-        gapless: {
-            margin: 0,
-            padding: 0,
+        multiline: {
+            flexWrap: 'wrap',
         },
-        variable: {
-            padding: marginSize || 0,
+        scrollContainer: {
+            width: 'auto',
+            paddingHorizontal: enlarge,
+            justifyContent: 'space-around',
+            gap: realGap,
+        },
+        mobile: {
+            flexDirection: 'column',
         },
     });
-    if (marginSize && !inlined) {
-        return (React.createElement(View, { style: [styles.columns, centered, verticalCentered && styles.verticalAlign], ...others }, children && marginSize
-            ? // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                React.Children.map(children, (child) => React.cloneElement(child, {
-                    style: [child.props.style, styles.variable],
-                }))
-            : children));
-    }
-    if (gapless) {
-        return (React.createElement(View, { style: [styles.columns, centered, verticalCentered && styles.verticalAlign], ...others }, children && gapless
-            ? // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                React.Children.map(children, (child) => React.cloneElement(child, {
-                    style: [child.props.style, styles.gapless],
-                }))
-            : children));
+    if (!scrollable) {
+        return (React.createElement(React.Fragment, null,
+            React.createElement(View, __assign({ style: [
+                    styles.columns,
+                    multiline && styles.multiline,
+                    (align === Alignable.ALIGNED_CENTER) && styles.centered,
+                    verticalAlign && styles.verticalAlign,
+                ] }, others, { onLayout: onLayoutHandler }), 
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            React.Children.map(children, function (child) {
+                return child &&
+                    React.cloneElement(child, {
+                        style: [
+                            child.props.style,
+                            { width: (child.props.size && (width * child.props.size) / 12 - realGap) || 'auto' },
+                            child.props.narrow && { flex: 'none', flexShrink: 1 },
+                        ],
+                    });
+            }))));
     }
-    return inlined ? (React.createElement(ColumnsContext.Provider, { value: {
-            inlined: inlined,
-        } },
-        React.createElement(ScrollView, { style: { marginLeft: 16 }, showsHorizontalScrollIndicator: false, horizontal: true, contentContainerStyle: {
-                flexGrow: 1,
-            } }, children))) : (React.createElement(View, { style: [
-            styles.columns,
-            centered && styles.centered,
-            gapless && styles.gapless,
-            verticalCentered && styles.verticalAlign,
-        ], ...others }, children));
+    return (React.createElement(View, __assign({ style: {
+            width: "100% + ".concat(enlarge * 2, "px"),
+            marginHorizontal: -enlarge,
+        } }, { onLayout: onLayoutHandler }),
+        React.createElement(ScrollView, { horizontal: true, contentContainerStyle: styles.scrollContainer }, 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        React.Children.map(children, function (child) {
+            return React.cloneElement(child, {
+                style: [
+                    child.props.style,
+                    {
+                        width: width / (12 / (child.props.size || child.props.mobileSize || 12)) - 2 * realGap,
+                        flexGrow: 0,
+                    },
+                    child.props.narrow && { flex: 'none', flexShrink: 1 },
+                ],
+            });
+        }))));
 };
 Columns.displayName = ComponentName.Columns;
 export default Columns;
-//# sourceMappingURL=Columns.native.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29sdW1ucy5uYXRpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL2NvbHVtbnMvQ29sdW1ucy5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLGFBQWEsRUFBRSxRQUFRLEVBQUUsTUFBTSxPQUFPLENBQUE7QUFDdEQsT0FBTyxFQUFFLFVBQVUsRUFBcUIsVUFBVSxFQUFFLFVBQVUsRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUNwRixPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFFeEMsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBQ2hFLE9BQU8sRUFBRSxlQUFlLEVBQVcsTUFBTSxtQ0FBbUMsQ0FBQTtBQUM1RSxPQUFPLEVBQUUsU0FBUyxFQUFFLGFBQWEsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUVwRDs7Ozs7OztHQU9HO0FBRUgsTUFBTSxDQUFDLElBQU0sY0FBYyxHQUFHLGFBQWEsQ0FBQyxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsQ0FBQyxDQUFBO0FBRWxFLElBQU0sT0FBTyxHQUFHLFVBQUMsRUFTRjtJQVJiLElBQUEsUUFBUSxjQUFBLEVBQ1IsS0FBSyxXQUFBLEVBQ0wsR0FBRyxTQUFBLEVBQ0gsYUFBYSxtQkFBQSxFQUNiLFNBQVMsZUFBQSxFQUNULFVBQVUsZ0JBQUEsRUFDVixTQUFTLGVBQUEsRUFDTixNQUFNLGNBUk0scUZBU2hCLENBRFU7SUFFSCxJQUFBLEtBQUEsT0FBb0IsUUFBUSxDQUFDLENBQUMsQ0FBQyxJQUFBLEVBQTlCLEtBQUssUUFBQSxFQUFFLFFBQVEsUUFBZSxDQUFBO0lBQy9CLElBQUEsS0FBQSxPQUF3QixRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUEsRUFBbEMsT0FBTyxRQUFBLEVBQUUsVUFBVSxRQUFlLENBQUE7SUFFekMsSUFBTSxlQUFlLEdBQUcsVUFBQyxLQUF3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

package/lib/components/columns/ColumnsProps.d.ts

@@ -1,18 +1,16 @@
 /// <reference types="react" />
-import { ColumnsSize } from './ColumnsTypes';
-import { Marginless } from "../../objects";
+import { GapSize } from './ColumnsTypes';
+import { AlignableProps } from '../../objects';
+import { CommonProps } from '../../objects/facets/CommonProps';
 /**
  * Columns Interface
  */
-export interface ColumnsProps extends Marginless {
+export interface ColumnsProps extends AlignableProps, CommonProps {
     children?: React.ReactNode;
     multiline?: boolean;
-    inlined?: boolean;
-    centered?: boolean;
-    gapless?: boolean;
-    marginSize?: ColumnsSize;
-    verticalCentered?: boolean;
-    className?: string;
+    scrollable?: boolean;
+    gap?: GapSize;
+    fullBleed?: boolean;
     mobile?: boolean;
-    flex?: boolean | number;
+    marginless?: boolean;
 }

package/lib/components/columns/ColumnsProps.js

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=ColumnsProps.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29sdW1uc1Byb3BzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9jb2x1bW5zL0NvbHVtbnNQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=

package/lib/components/columns/ColumnsPropsDefaults.js

@@ -0,0 +1,111 @@
+export default {
+  "children": {
+    "type": "react",
+    "values": [
+      "undefined",
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal"
+    ]
+  },
+  "multiline": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "scrollable": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "gap": {
+    "type": "enum",
+    "values": [
+      "undefined",
+      0,
+      1,
+      2,
+      3,
+      4,
+      5,
+      6,
+      7,
+      8,
+      9,
+      10
+    ]
+  },
+  "fullBleed": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "mobile": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "marginless": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
+    ]
+  },
+  "align": {
+    "type": "enum",
+    "values": [
+      "undefined",
+      "ALIGNED_CENTER",
+      "ALIGNED_START",
+      "ALIGNED_END",
+      "ALIGNED_CENTER",
+      "ALIGNED_START",
+      "ALIGNED_END"
+    ]
+  },
+  "verticalAlign": {
+    "type": "enum",
+    "values": [
+      "undefined",
+      "ALIGNED_CENTER",
+      "ALIGNED_START",
+      "ALIGNED_END",
+      "ALIGNED_CENTER",
+      "ALIGNED_START",
+      "ALIGNED_END"
+    ]
+  },
+  "id": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "className": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  }
+};

package/lib/components/columns/ColumnsTypes.d.ts

@@ -1 +1,15 @@
 export type ColumnsSize = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+export declare enum GapSize {
+    ZERO = 0,
+    ONE = 1,
+    TWO = 2,
+    THREE = 3,
+    FOUR = 4,
+    FIVE = 5,
+    SIX = 6,
+    SEVEN = 7,
+    EIGHT = 8,
+    NINE = 9,
+    TEN = 10
+}
+export declare const ColumnsGapValue: number[];

package/lib/components/columns/ColumnsTypes.js

@@ -1,2 +1,16 @@
-export {};
-//# sourceMappingURL=ColumnsTypes.js.map
+export var GapSize;
+(function (GapSize) {
+    GapSize[GapSize["ZERO"] = 0] = "ZERO";
+    GapSize[GapSize["ONE"] = 1] = "ONE";
+    GapSize[GapSize["TWO"] = 2] = "TWO";
+    GapSize[GapSize["THREE"] = 3] = "THREE";
+    GapSize[GapSize["FOUR"] = 4] = "FOUR";
+    GapSize[GapSize["FIVE"] = 5] = "FIVE";
+    GapSize[GapSize["SIX"] = 6] = "SIX";
+    GapSize[GapSize["SEVEN"] = 7] = "SEVEN";
+    GapSize[GapSize["EIGHT"] = 8] = "EIGHT";
+    GapSize[GapSize["NINE"] = 9] = "NINE";
+    GapSize[GapSize["TEN"] = 10] = "TEN";
+})(GapSize || (GapSize = {}));
+export var ColumnsGapValue = [0, 4, 8, 12, 16, 24, 32, 40, 48, 54, 62];
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29sdW1uc1R5cGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9jb2x1bW5zL0NvbHVtbnNUeXBlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFQSxNQUFNLENBQU4sSUFBWSxPQVlYO0FBWkQsV0FBWSxPQUFPO0lBQ2pCLHFDQUFRLENBQUE7SUFDUixtQ0FBTyxDQUFBO0lBQ1AsbUNBQU8sQ0FBQTtJQUNQLHVDQUFTLENBQUE7SUFDVCxxQ0FBUSxDQUFBO0lBQ1IscUNBQVEsQ0FBQTtJQUNSLG1DQUFPLENBQUE7SUFDUCx1Q0FBUyxDQUFBO0lBQ1QsdUNBQVMsQ0FBQTtJQUNULHFDQUFRLENBQUE7SUFDUixvQ0FBUSxDQUFBO0FBQ1YsQ0FBQyxFQVpXLE9BQU8sS0FBUCxPQUFPLFFBWWxCO0FBRUQsTUFBTSxDQUFDLElBQU0sZUFBZSxHQUFJLENBQUMsQ0FBQyxFQUFFLENBQUMsRUFBRSxDQUFDLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUFBIn0=

package/lib/components/columns/column/Column.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { ColumnProps } from './ColumnProps';
+/**
+ * Columns Item Component - Columns Child
+ * @param size {ColumnsSize} Size 1-12
+ * @param verticalCentered {boolean} Vertical center Column item
+ * @param centered {boolean} center Column item
+ * @param children {React.ReactNode}
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param narrow {boolean} Narrow column item
+ * @param className {string} Additionnal CSS Classes
+ * @param mobileSize {ColumnsSize} Apply => is-size-mobile
+ * @param tabletSize {ColumnsSize} Apply => is-size-tablet
+ * @param touchSize {ColumnsSize} Apply => is-size-touch
+ * @param desktopSize {ColumnsSize} Apply => is-size-desktop
+ * @param widescreenSize {ColumnsSize} Apply => is-size-widescreen
+ * @param fullhdSize {ColumnsSize} Apply => is-size-fullhd
+ * @param offset {ColumnSize} Apply => is-offset
+ * @param mobileOffset {ColumnsSize} Apply => is-offset-mobile
+ * @param tabletOffset {ColumnsSize} Apply => is-offset-tablet
+ * @param touchOffset {ColumnsSize} Apply => is-offset-touch
+ * @param desktopOffset {ColumnsSize} Apply => is-offset-desktop
+ * @param widescreenOffset {ColumnsSize} Apply => is-offset-widescreen
+ * @param fullhdOffset {ColumnsSize} Apply => is-offset-fullhd
+ * @param align { Alignable | AlignableValues} align content
+ */
+declare const Column: ({ className, id, size, mobileSize, tabletSize, touchSize, desktopSize, widescreenSize, fullhdSize, offset, mobileOffset, tabletOffset, touchOffset, desktopOffset, widescreenOffset, fullhdOffset, narrow, verticalAlign, ...others }: ColumnProps) => React.JSX.Element;
+export default Column;

package/lib/components/columns/column/Column.js

@@ -0,0 +1,39 @@
+import { __assign, __rest } from "tslib";
+import * as React from 'react';
+import clsx from 'clsx';
+import { is } from '../../../services/classify';
+import { hashClass } from '../../../helpers';
+import { useTrilogyContext } from '../../../context';
+import { getAlignClassName } from '../../../objects';
+/**
+ * Columns Item Component - Columns Child
+ * @param size {ColumnsSize} Size 1-12
+ * @param verticalCentered {boolean} Vertical center Column item
+ * @param centered {boolean} center Column item
+ * @param children {React.ReactNode}
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param narrow {boolean} Narrow column item
+ * @param className {string} Additionnal CSS Classes
+ * @param mobileSize {ColumnsSize} Apply => is-size-mobile
+ * @param tabletSize {ColumnsSize} Apply => is-size-tablet
+ * @param touchSize {ColumnsSize} Apply => is-size-touch
+ * @param desktopSize {ColumnsSize} Apply => is-size-desktop
+ * @param widescreenSize {ColumnsSize} Apply => is-size-widescreen
+ * @param fullhdSize {ColumnsSize} Apply => is-size-fullhd
+ * @param offset {ColumnSize} Apply => is-offset
+ * @param mobileOffset {ColumnsSize} Apply => is-offset-mobile
+ * @param tabletOffset {ColumnsSize} Apply => is-offset-tablet
+ * @param touchOffset {ColumnsSize} Apply => is-offset-touch
+ * @param desktopOffset {ColumnsSize} Apply => is-offset-desktop
+ * @param widescreenOffset {ColumnsSize} Apply => is-offset-widescreen
+ * @param fullhdOffset {ColumnsSize} Apply => is-offset-fullhd
+ * @param align { Alignable | AlignableValues} align content
+ */
+var Column = function (_a) {
+    var className = _a.className, id = _a.id, size = _a.size, mobileSize = _a.mobileSize, tabletSize = _a.tabletSize, touchSize = _a.touchSize, desktopSize = _a.desktopSize, widescreenSize = _a.widescreenSize, fullhdSize = _a.fullhdSize, offset = _a.offset, mobileOffset = _a.mobileOffset, tabletOffset = _a.tabletOffset, touchOffset = _a.touchOffset, desktopOffset = _a.desktopOffset, widescreenOffset = _a.widescreenOffset, fullhdOffset = _a.fullhdOffset, narrow = _a.narrow, verticalAlign = _a.verticalAlign, others = __rest(_a, ["className", "id", "size", "mobileSize", "tabletSize", "touchSize", "desktopSize", "widescreenSize", "fullhdSize", "offset", "mobileOffset", "tabletOffset", "touchOffset", "desktopOffset", "widescreenOffset", "fullhdOffset", "narrow", "verticalAlign"]);
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx('column', size && is("".concat(size)), mobileSize && is("".concat(mobileSize, "-mobile")), tabletSize && is("".concat(tabletSize, "-tablet")), touchSize && is("".concat(touchSize, "-tablet")), desktopSize && is("".concat(desktopSize, "-desktop")), widescreenSize && is("".concat(widescreenSize, "-widescreen")), fullhdSize && is("".concat(fullhdSize, "-fullhd")), offset && is("offset-".concat(offset)), mobileOffset && is("offset-".concat(mobileOffset, "-mobile")), tabletOffset && is("offset-".concat(tabletOffset, "-tablet")), touchOffset && is("offset-".concat(touchOffset, "-tablet")), desktopOffset && is("offset-".concat(desktopOffset, "-desktop")), widescreenOffset && is("offset-".concat(widescreenOffset, "-widescreen")), fullhdOffset && is("offset-".concat(fullhdOffset, "-fullhd")), narrow && is('narrow'), verticalAlign && is(getAlignClassName(verticalAlign)), className));
+    return React.createElement("div", __assign({ id: id, className: classes }, others));
+};
+export default Column;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29sdW1uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9jb2x1bW5zL2NvbHVtbi9Db2x1bW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFFdkIsT0FBTyxFQUFFLEVBQUUsRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBQ3hDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUU3Qzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0F1Qkc7QUFDSCxJQUFNLE1BQU0sR0FBRyxVQUFDLEVBb0JjO0lBbkJaLElBQUEsU0FBUyxlQUFBLEVBQ1QsRUFBRSxRQUFBLEVBQ0YsSUFBSSxVQUFBLEVBQ0osVUFBVSxnQkFBQSxFQUNWLFVBQVUsZ0JBQUEsRUFDVixTQUFTLGVBQUEsRUFDVCxXQUFXLGlCQUFBLEVBQ1gsY0FBYyxvQkFBQSxFQUNkLFVBQVUsZ0JBQUEsRUFDVixNQUFNLFlBQUEsRUFDTixZQUFZLGtCQUFBLEVBQ1osWUFBWSxrQkFBQSxFQUNaLFdBQVcsaUJBQUEsRUFDWCxhQUFhLG1CQUFBLEVBQ2IsZ0JBQWdCLHNCQUFBLEVBQ2hCLFlBQVksa0JBQUEsRUFDWixNQUFNLFlBQUEsRUFDTixhQUFhLG1CQUFBLEVBQ1YsTUFBTSxjQW5CWCw0UEFvQkMsQ0FEVTtJQUdqQixJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUV0QyxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLE1BQU0sRUFDTixJQUFJLENBQ0YsUUFBUSxFQUNSLElBQUksSUFBSSxFQUFFLENBQUMsVUFBRyxJQUFJLENBQUUsQ0FBQyxFQUNyQixVQUFVLElBQUksRUFBRSxDQUFDLFVBQUcsVUFBVSxZQUFTLENBQUMsRUFDeEMsVUFBVSxJQUFJLEVBQUUsQ0FBQyxVQUFHLFVBQVUsWUFBUyxDQUFDLEVBQ3hDLFNBQVMsSUFBSSxFQUFFLENBQUMsVUFBRyxTQUFTLFlBQVMsQ0FBQyxFQUN0QyxXQUFXLElBQUksRUFBRSxDQUFDLFVBQUcsV0FBVyxhQUFVLENBQUMsRUFDM0MsY0FBYyxJQUFJLEVBQUUsQ0FBQyxVQUFHLGNBQWMsZ0JBQWEsQ0FBQyxFQUNwRCxVQUFVLElBQUksRUFBRSxDQUFDLFVBQUcsVUFBVSxZQUFTLENBQUMsRUFDeEMsTUFBTSxJQUFJLEVBQUUsQ0FBQyxpQkFBVSxNQUFNLENBQUUsQ0FBQyxFQUNoQyxZQUFZLElBQUksRUFBRSxDQUFDLGlCQUFVLFlBQVksWUFBUyxDQUFDLEVBQ25ELFlBQVksSUFBSSxFQUFFLENBQUMsaUJBQVUsWUFBWSxZQUFTLENBQUMsRUFDbkQsV0FBVyxJQUFJLEVBQUUsQ0FBQyxpQkFBVSxXQUFXLFlBQVMsQ0FBQyxFQUNqRCxhQUFhLElBQUksRUFBRSxDQUFDLGlCQUFVLGFBQWEsYUFBVSxDQUFDLEVBQ3RELGdCQUFnQixJQUFJLEVBQUUsQ0FBQyxpQkFBVSxnQkFBZ0IsZ0JBQWEsQ0FBQyxFQUMvRCxZQUFZLElBQUksRUFBRSxDQUFDLGlCQUFVLFlBQVksWUFBUyxDQUFDLEVBQ25ELE1BQU0sSUFBSSxFQUFFLENBQUMsUUFBUSxDQUFDLEVBQ3RCLGFBQWEsSUFBSSxFQUFFLENBQUMsaUJBQWlCLENBQUMsYUFBYSxDQUFDLENBQUMsRUFDckQsU0FBUyxDQUNWLENBQ0YsQ0FBQTtJQUVELE9BQU8sc0NBQUssRUFBRSxFQUFFLEVBQUUsRUFBRSxTQUFTLEVBQUUsT0FBTyxJQUFNLE1BQU0sRUFBSSxDQUFBO0FBQ3hELENBQUMsQ0FBQTtBQUVELGVBQWUsTUFBTSxDQUFBIn0=

package/lib/components/columns/column/Column.native.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { ColumnProps } from './ColumnProps';
+import { ComponentName } from '../../../components/enumsComponentsName';
+/**
+ * Columns Item Component - Columns Child
+ * @param size {ColumnsSize} Size 1-12
+ * @param mobileSize {ColumnsSize} if size is missing.
+ * @param children {React.ReactNode}
+ * @param verticalCentered {boolean} Vertical center Column item
+ */
+declare const Column: {
+    ({ children, size, mobileSize, verticalAlign, ...others }: ColumnProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default Column;

package/lib/components/columns/column/Column.native.js

@@ -0,0 +1,32 @@
+import { __assign, __rest } from "tslib";
+import React, { useContext } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { ColumnsContext } from '../../../components/columns/Columns.native';
+import { ComponentName } from '../../../components/enumsComponentsName';
+import { Alignable } from '../../../objects';
+/**
+ * Columns Item Component - Columns Child
+ * @param size {ColumnsSize} Size 1-12
+ * @param mobileSize {ColumnsSize} if size is missing.
+ * @param children {React.ReactNode}
+ * @param verticalCentered {boolean} Vertical center Column item
+ */
+var Column = function (_a) {
+    var children = _a.children, size = _a.size, mobileSize = _a.mobileSize, verticalAlign = _a.verticalAlign, others = __rest(_a, ["children", "size", "mobileSize", "verticalAlign"]);
+    var columnsContextValues = useContext(ColumnsContext);
+    var realSize = size || mobileSize;
+    var styles = StyleSheet.create({
+        Column: {
+            height: columnsContextValues.scrollable ? '100%' : undefined,
+            flex: !realSize ? 1 : realSize,
+            justifyContent: verticalAlign === Alignable.ALIGNED_CENTER ? 'center' : 'flex-start',
+            flexBasis: "".concat((realSize ? realSize / 12 : 12) * 100, "%"),
+            flexGrow: 0,
+            maxWidth: "".concat(((realSize ? realSize : 12) / 12) * 100, "%"),
+        },
+    });
+    return (React.createElement(View, __assign({ style: styles.Column }, others), children));
+};
+Column.displayName = ComponentName.Column;
+export default Column;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29sdW1uLm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvY29sdW1ucy9jb2x1bW4vQ29sdW1uLm5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxFQUFFLEVBQUUsVUFBVSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQ3pDLE9BQU8sRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBRS9DLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSxxQ0FBcUMsQ0FBQTtBQUNwRSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFDaEUsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUVyQzs7Ozs7O0dBTUc7QUFDSCxJQUFNLE1BQU0sR0FBRyxVQUFDLEVBQXFFO0lBQW5FLElBQUEsUUFBUSxjQUFBLEVBQUUsSUFBSSxVQUFBLEVBQUUsVUFBVSxnQkFBQSxFQUFFLGFBQWEsbUJBQUEsRUFBSyxNQUFNLGNBQXRELG1EQUF3RCxDQUFGO0lBQ3BFLElBQU0sb0JBQW9CLEdBQUcsVUFBVSxDQUFDLGNBQWMsQ0FBQyxDQUFBO0lBRXZELElBQU0sUUFBUSxHQUFHLElBQUksSUFBSSxVQUFVLENBQUE7SUFFbkMsSUFBTSxNQUFNLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztRQUMvQixNQUFNLEVBQUU7WUFDTixNQUFNLEVBQUUsb0JBQW9CLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLFNBQVM7WUFDNUQsSUFBSSxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLFFBQVE7WUFDOUIsY0FBYyxFQUFFLGFBQWEsS0FBSyxTQUFTLENBQUMsY0FBYyxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFlBQVk7WUFDcEYsU0FBUyxFQUFFLFVBQUcsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFFBQVEsR0FBRyxFQUFFLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxHQUFHLEdBQUcsTUFBRztZQUN0RCxRQUFRLEVBQUUsQ0FBQztZQUNYLFFBQVEsRUFBRSxVQUFHLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLEdBQUcsRUFBRSxDQUFDLEdBQUcsR0FBRyxNQUFHO1NBQ3hEO0tBQ0YsQ0FBQyxDQUFBO0lBRUYsT0FBTyxDQUNMLG9CQUFDLElBQUksYUFBQyxLQUFLLEVBQUUsTUFBTSxDQUFDLE1BQU0sSUFBTSxNQUFNLEdBQ25DLFFBQVEsQ0FDSixDQUNSLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxNQUFNLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxNQUFNLENBQUE7QUFFekMsZUFBZSxNQUFNLENBQUEifQ==

package/lib/components/columns/column/ColumnProps.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+import { AlignableProps } from '../../../objects';
+import { ColumnsSize } from '../../../components/columns/ColumnsTypes';
+import { CommonProps } from '../../../objects/facets/CommonProps';
+/**
+ * Columns Item Interface
+ */
+export interface ColumnProps extends AlignableProps, CommonProps {
+    children?: React.ReactNode;
+    size?: ColumnsSize;
+    mobileSize?: ColumnsSize;
+    tabletSize?: ColumnsSize;
+    touchSize?: ColumnsSize;
+    desktopSize?: ColumnsSize;
+    widescreenSize?: ColumnsSize;
+    fullhdSize?: ColumnsSize;
+    offset?: ColumnsSize;
+    mobileOffset?: ColumnsSize;
+    tabletOffset?: ColumnsSize;
+    touchOffset?: ColumnsSize;
+    desktopOffset?: ColumnsSize;
+    widescreenOffset?: ColumnsSize;
+    fullhdOffset?: ColumnsSize;
+    narrow?: boolean;
+}

package/lib/components/columns/column/ColumnProps.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29sdW1uUHJvcHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2NvbHVtbnMvY29sdW1uL0NvbHVtblByb3BzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIifQ==