@preply/ds-rn-lib 0.43.0 → 0.43.1

package/dist/components/LayoutFlex/LayoutFlex.d.ts

@@ -0,0 +1,17 @@
+import { LayoutGap } from '@preply/ds-core';
+import React from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+import { LayoutFlexStyle } from '../../props/layout/useLayoutFlexStyle';
+declare type ViewStyleProp = StyleProp<ViewStyle>;
+interface LayoutFlexProps extends LayoutFlexStyle {
+    gap?: LayoutGap;
+    hide?: boolean;
+    component?: React.ReactElement<{
+        style?: ViewStyleProp;
+        children?: React.ReactNode;
+    }> | React.ComponentType<{
+        style?: ViewStyleProp;
+    }>;
+}
+export declare const LayoutFlex: React.FC<LayoutFlexProps>;
+export {};

package/dist/components/LayoutFlex/LayoutFlex.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import { View } from 'react-native';
+import { useLayoutFlexStyle } from '../../props/layout/useLayoutFlexStyle.js';
+import { ChildrenWithGap } from './private/ChildrenWithGap.js';
+
+const LayoutFlex = React.memo(({ gap, padding, nowrap, direction, justifyContent, alignItems, hide, children, component, }) => {
+    const style = useLayoutFlexStyle({
+        padding,
+        direction,
+        alignItems,
+        justifyContent,
+        nowrap,
+    });
+    if (hide) {
+        return null;
+    }
+    const content = !gap || React.Children.count(children) === 1 ? (children) : (React.createElement(ChildrenWithGap, { gap: gap, direction: direction }, children));
+    if (component && React.isValidElement(component)) {
+        return React.cloneElement(component, {
+            ...component.props,
+            style: [component.props.style, style],
+            children: content,
+        });
+    }
+    const Component = component !== null && component !== void 0 ? component : View;
+    return React.createElement(Component, { style: style }, content);
+});
+
+export { LayoutFlex };
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGF5b3V0RmxleC5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvTGF5b3V0RmxleC9MYXlvdXRGbGV4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBMYXlvdXRHYXAgfSBmcm9tICdAcHJlcGx5L2RzLWNvcmUnO1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IFN0eWxlUHJvcCwgVmlldywgVmlld1N0eWxlIH0gZnJvbSAncmVhY3QtbmF0aXZlJztcblxuaW1wb3J0IHsgTGF5b3V0RmxleFN0eWxlLCB1c2VMYXlvdXRGbGV4U3R5bGUgfSBmcm9tICcuLi8uLi9wcm9wcy9sYXlvdXQvdXNlTGF5b3V0RmxleFN0eWxlJztcblxuaW1wb3J0IHsgQ2hpbGRyZW5XaXRoR2FwIH0gZnJvbSAnLi9wcml2YXRlL0NoaWxkcmVuV2l0aEdhcCc7XG5cbnR5cGUgVmlld1N0eWxlUHJvcCA9IFN0eWxlUHJvcDxWaWV3U3R5bGU+O1xuXG5pbnRlcmZhY2UgTGF5b3V0RmxleFByb3BzIGV4dGVuZHMgTGF5b3V0RmxleFN0eWxlIHtcbiAgICBnYXA/OiBMYXlvdXRHYXA7XG4gICAgaGlkZT86IGJvb2xlYW47XG4gICAgY29tcG9uZW50PzpcbiAgICAgICAgfCBSZWFjdC5SZWFjdEVsZW1lbnQ8eyBzdHlsZT86IFZpZXdTdHlsZVByb3A7IGNoaWxkcmVuPzogUmVhY3QuUmVhY3ROb2RlIH0+XG4gICAgICAgIHwgUmVhY3QuQ29tcG9uZW50VHlwZTx7IHN0eWxlPzogVmlld1N0eWxlUHJvcCB9Pjtcbn1cblxuZXhwb3J0IGNvbnN0IExheW91dEZsZXg6IFJlYWN0LkZDPExheW91dEZsZXhQcm9wcz4gPSBSZWFjdC5tZW1vKFxuICAgICh7XG4gICAgICAgIGdhcCxcbiAgICAgICAgcGFkZGluZyxcbiAgICAgICAgbm93cmFwLFxuICAgICAgICBkaXJlY3Rpb24sXG4gICAgICAgIGp1c3RpZnlDb250ZW50LFxuICAgICAgICBhbGlnbkl0ZW1zLFxuICAgICAgICBoaWRlLFxuICAgICAgICBjaGlsZHJlbixcbiAgICAgICAgY29tcG9uZW50LFxuICAgIH0pID0+IHtcbiAgICAgICAgY29uc3Qgc3R5bGUgPSB1c2VMYXlvdXRGbGV4U3R5bGUoe1xuICAgICAgICAgICAgcGFkZGluZyxcbiAgICAgICAgICAgIGRpcmVjdGlvbixcbiAgICAgICAgICAgIGFsaWduSXRlbXMsXG4gICAgICAgICAgICBqdXN0aWZ5Q29udGVudCxcbiAgICAgICAgICAgIG5vd3JhcCxcbiAgICAgICAgfSk7XG5cbiAgICAgICAgaWYgKGhpZGUpIHtcbiAgICAgICAgICAgIHJldHVybiBudWxsO1xuICAgICAgICB9XG5cbiAgICAgICAgY29uc3QgY29udGVudCA9XG4gICAgICAgICAgICAhZ2FwIHx8IFJlYWN0LkNoaWxkcmVuLmNvdW50KGNoaWxkcmVuKSA9PT0gMSA/IChcbiAgICAgICAgICAgICAgICBjaGlsZHJlblxuICAgICAgICAgICAgKSA6IChcbiAgICAgICAgICAgICAgICA8Q2hpbGRyZW5XaXRoR2FwIGdhcD17Z2FwfSBkaXJlY3Rpb249e2RpcmVjdGlvbn0+XG4gICAgICAgICAgICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgICAgICAgICA8L0NoaWxkcmVuV2l0aEdhcD5cbiAgICAgICAgICAgICk7XG5cbiAgICAgICAgaWYgKGNvbXBvbmVudCAmJiBSZWFjdC5pc1ZhbGlkRWxlbWVudChjb21wb25lbnQpKSB7XG4gICAgICAgICAgICByZXR1cm4gUmVhY3QuY2xvbmVFbGVtZW50KGNvbXBvbmVudCwge1xuICAgICAgICAgICAgICAgIC4uLmNvbXBvbmVudC5wcm9wcyxcbiAgICAgICAgICAgICAgICBzdHlsZTogW2NvbXBvbmVudC5wcm9wcy5zdHlsZSwgc3R5bGVdLFxuICAgICAgICAgICAgICAgIGNoaWxkcmVuOiBjb250ZW50LFxuICAgICAgICAgICAgfSk7XG4gICAgICAgIH1cblxuICAgICAgICBjb25zdCBDb21wb25lbnQgPSBjb21wb25lbnQgPz8gVmlldztcbiAgICAgICAgcmV0dXJuIDxDb21wb25lbnQgc3R5bGU9e3N0eWxlfT57Y29udGVudH08L0NvbXBvbmVudD47XG4gICAgfSxcbik7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7TUFrQmEsVUFBVSxHQUE4QixLQUFLLENBQUMsSUFBSSxDQUMzRCxDQUFDLEVBQ0csR0FBRyxFQUNILE9BQU8sRUFDUCxNQUFNLEVBQ04sU0FBUyxFQUNULGNBQWMsRUFDZCxVQUFVLEVBQ1YsSUFBSSxFQUNKLFFBQVEsRUFDUixTQUFTLEdBQ1o7SUFDRyxNQUFNLEtBQUssR0FBRyxrQkFBa0IsQ0FBQztRQUM3QixPQUFPO1FBQ1AsU0FBUztRQUNULFVBQVU7UUFDVixjQUFjO1FBQ2QsTUFBTTtLQUNULENBQUMsQ0FBQztJQUVILElBQUksSUFBSSxFQUFFO1FBQ04sT0FBTyxJQUFJLENBQUM7S0FDZjtJQUVELE1BQU0sT0FBTyxHQUNULENBQUMsR0FBRyxJQUFJLEtBQUssQ0FBQyxRQUFRLENBQUMsS0FBSyxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsSUFDeEMsUUFBUSxLQUVSLG9CQUFDLGVBQWUsSUFBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLFNBQVMsRUFBRSxTQUFTLElBQzFDLFFBQVEsQ0FDSyxDQUNyQixDQUFDO0lBRU4sSUFBSSxTQUFTLElBQUksS0FBSyxDQUFDLGNBQWMsQ0FBQyxTQUFTLENBQUMsRUFBRTtRQUM5QyxPQUFPLEtBQUssQ0FBQyxZQUFZLENBQUMsU0FBUyxFQUFFO1lBQ2pDLEdBQUcsU0FBUyxDQUFDLEtBQUs7WUFDbEIsS0FBSyxFQUFFLENBQUMsU0FBUyxDQUFDLEtBQUssQ0FBQyxLQUFLLEVBQUUsS0FBSyxDQUFDO1lBQ3JDLFFBQVEsRUFBRSxPQUFPO1NBQ3BCLENBQUMsQ0FBQztLQUNOO0lBRUQsTUFBTSxTQUFTLEdBQUcsU0FBUyxhQUFULFNBQVMsY0FBVCxTQUFTLEdBQUksSUFBSSxDQUFDO0lBQ3BDLE9BQU8sb0JBQUMsU0FBUyxJQUFDLEtBQUssRUFBRSxLQUFLLElBQUcsT0FBTyxDQUFhLENBQUM7QUFDMUQsQ0FBQzs7OzsifQ==

package/dist/components/LayoutFlex/private/ChildrenWithGap.d.ts

@@ -0,0 +1,8 @@
+import { LayoutFlexDirection, LayoutGap } from '@preply/ds-core';
+import React from 'react';
+interface Props {
+    gap: LayoutGap;
+    direction?: LayoutFlexDirection;
+}
+export declare const ChildrenWithGap: React.FC<Props>;
+export {};

package/dist/components/LayoutFlex/private/ChildrenWithGap.js

@@ -0,0 +1,25 @@
+import { root } from '@preply/ds-core';
+import { useToken } from '@preply/ds-rn-core';
+import React from 'react';
+import { View } from 'react-native';
+
+// This is a workaround for the fact that react-native doesn't support gap style.
+const ChildrenWithGap = React.memo(({ gap, direction, children }) => {
+    const gapSize = useToken(root.space[gap]);
+    const isRow = direction === 'row' || direction === 'row-reverse';
+    const spacerStyle = isRow ? { width: gapSize } : { height: gapSize };
+    const spacer = React.createElement(View, { style: spacerStyle });
+    return (React.createElement(React.Fragment, null, React.Children.map(children, (child, index) => {
+        if (index === 0) {
+            return child;
+        }
+        return (
+        // eslint-disable-next-line react/no-array-index-key
+        React.createElement(React.Fragment, { key: index },
+            spacer,
+            child));
+    })));
+});
+
+export { ChildrenWithGap };
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpbGRyZW5XaXRoR2FwLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9MYXlvdXRGbGV4L3ByaXZhdGUvQ2hpbGRyZW5XaXRoR2FwLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBMYXlvdXRGbGV4RGlyZWN0aW9uLCBMYXlvdXRHYXAsIHJvb3QgfSBmcm9tICdAcHJlcGx5L2RzLWNvcmUnO1xuaW1wb3J0IHsgdXNlVG9rZW4gfSBmcm9tICdAcHJlcGx5L2RzLXJuLWNvcmUnO1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IFZpZXcgfSBmcm9tICdyZWFjdC1uYXRpdmUnO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICAgIGdhcDogTGF5b3V0R2FwO1xuICAgIGRpcmVjdGlvbj86IExheW91dEZsZXhEaXJlY3Rpb247XG59XG5cbi8vIFRoaXMgaXMgYSB3b3JrYXJvdW5kIGZvciB0aGUgZmFjdCB0aGF0IHJlYWN0LW5hdGl2ZSBkb2Vzbid0IHN1cHBvcnQgZ2FwIHN0eWxlLlxuZXhwb3J0IGNvbnN0IENoaWxkcmVuV2l0aEdhcDogUmVhY3QuRkM8UHJvcHM+ID0gUmVhY3QubWVtbygoeyBnYXAsIGRpcmVjdGlvbiwgY2hpbGRyZW4gfSkgPT4ge1xuICAgIGNvbnN0IGdhcFNpemUgPSB1c2VUb2tlbihyb290LnNwYWNlW2dhcF0pO1xuICAgIGNvbnN0IGlzUm93ID0gZGlyZWN0aW9uID09PSAncm93JyB8fCBkaXJlY3Rpb24gPT09ICdyb3ctcmV2ZXJzZSc7XG4gICAgY29uc3Qgc3BhY2VyU3R5bGUgPSBpc1JvdyA/IHsgd2lkdGg6IGdhcFNpemUgfSA6IHsgaGVpZ2h0OiBnYXBTaXplIH07XG4gICAgY29uc3Qgc3BhY2VyID0gPFZpZXcgc3R5bGU9e3NwYWNlclN0eWxlfSAvPjtcblxuICAgIHJldHVybiAoXG4gICAgICAgIDw+XG4gICAgICAgICAgICB7UmVhY3QuQ2hpbGRyZW4ubWFwKGNoaWxkcmVuLCAoY2hpbGQsIGluZGV4KSA9PiB7XG4gICAgICAgICAgICAgICAgaWYgKGluZGV4ID09PSAwKSB7XG4gICAgICAgICAgICAgICAgICAgIHJldHVybiBjaGlsZDtcbiAgICAgICAgICAgICAgICB9XG5cbiAgICAgICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICAgICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgcmVhY3Qvbm8tYXJyYXktaW5kZXgta2V5XG4gICAgICAgICAgICAgICAgICAgIDxSZWFjdC5GcmFnbWVudCBrZXk9e2luZGV4fT5cbiAgICAgICAgICAgICAgICAgICAgICAgIHtzcGFjZXJ9XG4gICAgICAgICAgICAgICAgICAgICAgICB7Y2hpbGR9XG4gICAgICAgICAgICAgICAgICAgIDwvUmVhY3QuRnJhZ21lbnQ+XG4gICAgICAgICAgICAgICAgKTtcbiAgICAgICAgICAgIH0pfVxuICAgICAgICA8Lz5cbiAgICApO1xufSk7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFVQTtNQUNhLGVBQWUsR0FBb0IsS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDLEVBQUUsR0FBRyxFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUU7SUFDcEYsTUFBTSxPQUFPLEdBQUcsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQztJQUMxQyxNQUFNLEtBQUssR0FBRyxTQUFTLEtBQUssS0FBSyxJQUFJLFNBQVMsS0FBSyxhQUFhLENBQUM7SUFDakUsTUFBTSxXQUFXLEdBQUcsS0FBSyxHQUFHLEVBQUUsS0FBSyxFQUFFLE9BQU8sRUFBRSxHQUFHLEVBQUUsTUFBTSxFQUFFLE9BQU8sRUFBRSxDQUFDO0lBQ3JFLE1BQU0sTUFBTSxHQUFHLG9CQUFDLElBQUksSUFBQyxLQUFLLEVBQUUsV0FBVyxHQUFJLENBQUM7SUFFNUMsUUFDSSwwQ0FDSyxLQUFLLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxRQUFRLEVBQUUsQ0FBQyxLQUFLLEVBQUUsS0FBSztRQUN2QyxJQUFJLEtBQUssS0FBSyxDQUFDLEVBQUU7WUFDYixPQUFPLEtBQUssQ0FBQztTQUNoQjtRQUVEOztRQUVJLG9CQUFDLEtBQUssQ0FBQyxRQUFRLElBQUMsR0FBRyxFQUFFLEtBQUs7WUFDckIsTUFBTTtZQUNOLEtBQUssQ0FDTyxFQUNuQjtLQUNMLENBQUMsQ0FDSCxFQUNMO0FBQ04sQ0FBQzs7OzsifQ==

package/dist/components/index.d.ts

@@ -1 +1,2 @@
 export { Text } from './Text/Text';
+export { LayoutFlex } from './LayoutFlex/LayoutFlex';

package/dist/components/index.js

@@ -1,2 +1,3 @@
 export { Text } from './Text/Text.js';
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=
+export { LayoutFlex } from './LayoutFlex/LayoutFlex.js';
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOyJ9

package/dist/index.js

@@ -1,2 +1,3 @@
 export { Text } from './components/Text/Text.js';
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=
+export { LayoutFlex } from './components/LayoutFlex/LayoutFlex.js';
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOyJ9

package/dist/props/layout/useLayoutFlexStyle.d.ts

@@ -0,0 +1,10 @@
+import { LayoutAlignItems, LayoutFlexDirection, LayoutJustifyContent, LayoutPadding, ShortHand } from '@preply/ds-core';
+import { StyleProp, ViewStyle } from 'react-native';
+export interface LayoutFlexStyle {
+    padding?: ShortHand<LayoutPadding>;
+    nowrap?: boolean;
+    direction?: LayoutFlexDirection;
+    justifyContent?: LayoutJustifyContent;
+    alignItems?: LayoutAlignItems;
+}
+export declare function useLayoutFlexStyle({ padding, direction, nowrap, alignItems, justifyContent, }: LayoutFlexStyle): StyleProp<ViewStyle>;

package/dist/props/layout/useLayoutFlexStyle.js

@@ -0,0 +1,34 @@
+import { useMemo } from 'react';
+import { StyleSheet } from 'react-native';
+import { usePaddingStyle } from './usePaddingStyle.js';
+
+const alignItemsMap = {
+    start: 'flex-start',
+    end: 'flex-end',
+    center: 'center',
+    stretch: 'stretch',
+    baseline: 'baseline',
+};
+const justifyContentMap = {
+    start: 'flex-start',
+    end: 'flex-end',
+    center: 'center',
+    'space-between': 'space-between',
+    'space-around': 'space-around',
+    'space-evenly': 'space-evenly',
+};
+function useLayoutFlexStyle({ padding, direction, nowrap, alignItems, justifyContent, }) {
+    const paddingStyle = usePaddingStyle(padding);
+    const flexStyle = useMemo(() => {
+        return {
+            ...(direction ? { flexDirection: direction } : {}),
+            ...(nowrap ? { flexWrap: 'nowrap' } : {}),
+            ...(alignItems ? { alignItems: alignItemsMap[alignItems] } : {}),
+            ...(justifyContent ? { justifyContent: justifyContentMap[justifyContent] } : {}),
+        };
+    }, [alignItems, direction, justifyContent, nowrap]);
+    return useMemo(() => StyleSheet.flatten([paddingStyle, flexStyle]), [paddingStyle, flexStyle]);
+}
+
+export { useLayoutFlexStyle };
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlTGF5b3V0RmxleFN0eWxlLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvcHJvcHMvbGF5b3V0L3VzZUxheW91dEZsZXhTdHlsZS50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIExheW91dEFsaWduSXRlbXMsXG4gICAgTGF5b3V0RmxleERpcmVjdGlvbixcbiAgICBMYXlvdXRKdXN0aWZ5Q29udGVudCxcbiAgICBMYXlvdXRQYWRkaW5nLFxuICAgIFNob3J0SGFuZCxcbn0gZnJvbSAnQHByZXBseS9kcy1jb3JlJztcbmltcG9ydCB7IHVzZU1lbW8gfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBGbGV4U3R5bGUsIFN0eWxlUHJvcCwgU3R5bGVTaGVldCwgVmlld1N0eWxlIH0gZnJvbSAncmVhY3QtbmF0aXZlJztcblxuaW1wb3J0IHsgdXNlUGFkZGluZ1N0eWxlIH0gZnJvbSAnLi91c2VQYWRkaW5nU3R5bGUnO1xuXG5jb25zdCBhbGlnbkl0ZW1zTWFwOiBSZWNvcmQ8TGF5b3V0QWxpZ25JdGVtcywgVmlld1N0eWxlWydhbGlnbkl0ZW1zJ10+ID0ge1xuICAgIHN0YXJ0OiAnZmxleC1zdGFydCcsXG4gICAgZW5kOiAnZmxleC1lbmQnLFxuICAgIGNlbnRlcjogJ2NlbnRlcicsXG4gICAgc3RyZXRjaDogJ3N0cmV0Y2gnLFxuICAgIGJhc2VsaW5lOiAnYmFzZWxpbmUnLFxufTtcblxuY29uc3QganVzdGlmeUNvbnRlbnRNYXA6IFJlY29yZDxMYXlvdXRKdXN0aWZ5Q29udGVudCwgVmlld1N0eWxlWydqdXN0aWZ5Q29udGVudCddPiA9IHtcbiAgICBzdGFydDogJ2ZsZXgtc3RhcnQnLFxuICAgIGVuZDogJ2ZsZXgtZW5kJyxcbiAgICBjZW50ZXI6ICdjZW50ZXInLFxuICAgICdzcGFjZS1iZXR3ZWVuJzogJ3NwYWNlLWJldHdlZW4nLFxuICAgICdzcGFjZS1hcm91bmQnOiAnc3BhY2UtYXJvdW5kJyxcbiAgICAnc3BhY2UtZXZlbmx5JzogJ3NwYWNlLWV2ZW5seScsXG59O1xuZXhwb3J0IGludGVyZmFjZSBMYXlvdXRGbGV4U3R5bGUge1xuICAgIHBhZGRpbmc/OiBTaG9ydEhhbmQ8TGF5b3V0UGFkZGluZz47XG4gICAgbm93cmFwPzogYm9vbGVhbjtcbiAgICBkaXJlY3Rpb24/OiBMYXlvdXRGbGV4RGlyZWN0aW9uO1xuICAgIGp1c3RpZnlDb250ZW50PzogTGF5b3V0SnVzdGlmeUNvbnRlbnQ7XG4gICAgYWxpZ25JdGVtcz86IExheW91dEFsaWduSXRlbXM7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiB1c2VMYXlvdXRGbGV4U3R5bGUoe1xuICAgIHBhZGRpbmcsXG4gICAgZGlyZWN0aW9uLFxuICAgIG5vd3JhcCxcbiAgICBhbGlnbkl0ZW1zLFxuICAgIGp1c3RpZnlDb250ZW50LFxufTogTGF5b3V0RmxleFN0eWxlKTogU3R5bGVQcm9wPFZpZXdTdHlsZT4ge1xuICAgIGNvbnN0IHBhZGRpbmdTdHlsZSA9IHVzZVBhZGRpbmdTdHlsZShwYWRkaW5nKTtcblxuICAgIGNvbnN0IGZsZXhTdHlsZTogRmxleFN0eWxlID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICAgIHJldHVybiB7XG4gICAgICAgICAgICAuLi4oZGlyZWN0aW9uID8geyBmbGV4RGlyZWN0aW9uOiBkaXJlY3Rpb24gfSA6IHt9KSxcbiAgICAgICAgICAgIC4uLihub3dyYXAgPyB7IGZsZXhXcmFwOiAnbm93cmFwJyB9IDoge30pLFxuICAgICAgICAgICAgLi4uKGFsaWduSXRlbXMgPyB7IGFsaWduSXRlbXM6IGFsaWduSXRlbXNNYXBbYWxpZ25JdGVtc10gfSA6IHt9KSxcbiAgICAgICAgICAgIC4uLihqdXN0aWZ5Q29udGVudCA/IHsganVzdGlmeUNvbnRlbnQ6IGp1c3RpZnlDb250ZW50TWFwW2p1c3RpZnlDb250ZW50XSB9IDoge30pLFxuICAgICAgICB9O1xuICAgIH0sIFthbGlnbkl0ZW1zLCBkaXJlY3Rpb24sIGp1c3RpZnlDb250ZW50LCBub3dyYXBdKTtcblxuICAgIHJldHVybiB1c2VNZW1vKCgpID0+IFN0eWxlU2hlZXQuZmxhdHRlbihbcGFkZGluZ1N0eWxlLCBmbGV4U3R5bGVdKSwgW3BhZGRpbmdTdHlsZSwgZmxleFN0eWxlXSk7XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQVlBLE1BQU0sYUFBYSxHQUFzRDtJQUNyRSxLQUFLLEVBQUUsWUFBWTtJQUNuQixHQUFHLEVBQUUsVUFBVTtJQUNmLE1BQU0sRUFBRSxRQUFRO0lBQ2hCLE9BQU8sRUFBRSxTQUFTO0lBQ2xCLFFBQVEsRUFBRSxVQUFVO0NBQ3ZCLENBQUM7QUFFRixNQUFNLGlCQUFpQixHQUE4RDtJQUNqRixLQUFLLEVBQUUsWUFBWTtJQUNuQixHQUFHLEVBQUUsVUFBVTtJQUNmLE1BQU0sRUFBRSxRQUFRO0lBQ2hCLGVBQWUsRUFBRSxlQUFlO0lBQ2hDLGNBQWMsRUFBRSxjQUFjO0lBQzlCLGNBQWMsRUFBRSxjQUFjO0NBQ2pDLENBQUM7U0FTYyxrQkFBa0IsQ0FBQyxFQUMvQixPQUFPLEVBQ1AsU0FBUyxFQUNULE1BQU0sRUFDTixVQUFVLEVBQ1YsY0FBYyxHQUNBO0lBQ2QsTUFBTSxZQUFZLEdBQUcsZUFBZSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBRTlDLE1BQU0sU0FBUyxHQUFjLE9BQU8sQ0FBQztRQUNqQyxPQUFPO1lBQ0gsSUFBSSxTQUFTLEdBQUcsRUFBRSxhQUFhLEVBQUUsU0FBUyxFQUFFLEdBQUcsRUFBRSxDQUFDO1lBQ2xELElBQUksTUFBTSxHQUFHLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxHQUFHLEVBQUUsQ0FBQztZQUN6QyxJQUFJLFVBQVUsR0FBRyxFQUFFLFVBQVUsRUFBRSxhQUFhLENBQUMsVUFBVSxDQUFDLEVBQUUsR0FBRyxFQUFFLENBQUM7WUFDaEUsSUFBSSxjQUFjLEdBQUcsRUFBRSxjQUFjLEVBQUUsaUJBQWlCLENBQUMsY0FBYyxDQUFDLEVBQUUsR0FBRyxFQUFFLENBQUM7U0FDbkYsQ0FBQztLQUNMLEVBQUUsQ0FBQyxVQUFVLEVBQUUsU0FBUyxFQUFFLGNBQWMsRUFBRSxNQUFNLENBQUMsQ0FBQyxDQUFDO0lBRXBELE9BQU8sT0FBTyxDQUFDLE1BQU0sVUFBVSxDQUFDLE9BQU8sQ0FBQyxDQUFDLFlBQVksRUFBRSxTQUFTLENBQUMsQ0FBQyxFQUFFLENBQUMsWUFBWSxFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUM7QUFDbkc7Ozs7In0=

package/dist/props/layout/usePaddingStyle.d.ts

@@ -0,0 +1,7 @@
+import { LayoutPadding, ShortHand } from '@preply/ds-core';
+export declare function usePaddingStyle(padding?: ShortHand<LayoutPadding>): {
+    paddingTop?: string | number;
+    paddingBottom?: string | number;
+    paddingRight?: string | number;
+    paddingLeft?: string | number;
+};

package/dist/props/layout/usePaddingStyle.js

@@ -0,0 +1,24 @@
+import { normalizeShorthand, root } from '@preply/ds-core';
+import { createStyleSheet, useStyleSheet } from '@preply/ds-rn-core';
+import { useMemo } from 'react';
+
+function usePaddingStyle(padding) {
+    const rawStyles = useMemo(() => {
+        if (!padding) {
+            return createStyleSheet({ padding: {} });
+        }
+        const [top, right, bottom, left] = normalizeShorthand(padding);
+        return createStyleSheet({
+            padding: {
+                paddingTop: root.space[top],
+                paddingRight: root.space[right],
+                paddingBottom: root.space[bottom],
+                paddingLeft: root.space[left],
+            },
+        });
+    }, [padding === null || padding === void 0 ? void 0 : padding.toString()]);
+    return useStyleSheet(rawStyles).padding;
+}
+
+export { usePaddingStyle };
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlUGFkZGluZ1N0eWxlLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvcHJvcHMvbGF5b3V0L3VzZVBhZGRpbmdTdHlsZS50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBMYXlvdXRQYWRkaW5nLCBTaG9ydEhhbmQsIG5vcm1hbGl6ZVNob3J0aGFuZCwgcm9vdCB9IGZyb20gJ0BwcmVwbHkvZHMtY29yZSc7XG5pbXBvcnQgeyBjcmVhdGVTdHlsZVNoZWV0LCB1c2VTdHlsZVNoZWV0IH0gZnJvbSAnQHByZXBseS9kcy1ybi1jb3JlJztcbmltcG9ydCB7IHVzZU1lbW8gfSBmcm9tICdyZWFjdCc7XG5cbmV4cG9ydCBmdW5jdGlvbiB1c2VQYWRkaW5nU3R5bGUocGFkZGluZz86IFNob3J0SGFuZDxMYXlvdXRQYWRkaW5nPik6IHtcbiAgICBwYWRkaW5nVG9wPzogc3RyaW5nIHwgbnVtYmVyO1xuICAgIHBhZGRpbmdCb3R0b20/OiBzdHJpbmcgfCBudW1iZXI7XG4gICAgcGFkZGluZ1JpZ2h0Pzogc3RyaW5nIHwgbnVtYmVyO1xuICAgIHBhZGRpbmdMZWZ0Pzogc3RyaW5nIHwgbnVtYmVyO1xufSB7XG4gICAgY29uc3QgcmF3U3R5bGVzID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICAgIGlmICghcGFkZGluZykge1xuICAgICAgICAgICAgcmV0dXJuIGNyZWF0ZVN0eWxlU2hlZXQoeyBwYWRkaW5nOiB7fSB9KTtcbiAgICAgICAgfVxuXG4gICAgICAgIGNvbnN0IFt0b3AsIHJpZ2h0LCBib3R0b20sIGxlZnRdID0gbm9ybWFsaXplU2hvcnRoYW5kKHBhZGRpbmcpO1xuXG4gICAgICAgIHJldHVybiBjcmVhdGVTdHlsZVNoZWV0KHtcbiAgICAgICAgICAgIHBhZGRpbmc6IHtcbiAgICAgICAgICAgICAgICBwYWRkaW5nVG9wOiByb290LnNwYWNlW3RvcF0sXG4gICAgICAgICAgICAgICAgcGFkZGluZ1JpZ2h0OiByb290LnNwYWNlW3JpZ2h0XSxcbiAgICAgICAgICAgICAgICBwYWRkaW5nQm90dG9tOiByb290LnNwYWNlW2JvdHRvbV0sXG4gICAgICAgICAgICAgICAgcGFkZGluZ0xlZnQ6IHJvb3Quc3BhY2VbbGVmdF0sXG4gICAgICAgICAgICB9LFxuICAgICAgICB9KTtcbiAgICB9LCBbcGFkZGluZz8udG9TdHJpbmcoKV0pO1xuXG4gICAgcmV0dXJuIHVzZVN0eWxlU2hlZXQocmF3U3R5bGVzKS5wYWRkaW5nO1xufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7U0FJZ0IsZUFBZSxDQUFDLE9BQWtDO0lBTTlELE1BQU0sU0FBUyxHQUFHLE9BQU8sQ0FBQztRQUN0QixJQUFJLENBQUMsT0FBTyxFQUFFO1lBQ1YsT0FBTyxnQkFBZ0IsQ0FBQyxFQUFFLE9BQU8sRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUFDO1NBQzVDO1FBRUQsTUFBTSxDQUFDLEdBQUcsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLElBQUksQ0FBQyxHQUFHLGtCQUFrQixDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBRS9ELE9BQU8sZ0JBQWdCLENBQUM7WUFDcEIsT0FBTyxFQUFFO2dCQUNMLFVBQVUsRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQztnQkFDM0IsWUFBWSxFQUFFLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDO2dCQUMvQixhQUFhLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUM7Z0JBQ2pDLFdBQVcsRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQzthQUNoQztTQUNKLENBQUMsQ0FBQztLQUNOLEVBQUUsQ0FBQyxPQUFPLGFBQVAsT0FBTyx1QkFBUCxPQUFPLENBQUUsUUFBUSxHQUFHLENBQUMsQ0FBQztJQUUxQixPQUFPLGFBQWEsQ0FBQyxTQUFTLENBQUMsQ0FBQyxPQUFPLENBQUM7QUFDNUM7Ozs7In0=

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@preply/ds-rn-lib",
-    "version": "0.43.0",
+    "version": "0.43.1",
     "publishConfig": {
         "access": "public"
     },
@@ -11,30 +11,30 @@
     "sideEffects": false,
     "scripts": {
         "clean": "rm -rf dist",
-        "lint": "run --top-level eslint --ext .js,.ts,.tsx,.mdx *.config.js src/",
+        "lint": "run --top-level eslint --ext .js,.ts,.tsx,.mdx *.config.js src/ test/",
         "test": "run --top-level jest --coverage",
         "build": "NODE_ENV=production && run build:rollup",
         "build:rollup": "run --top-level rollup -c rollup.config.js",
         "dev": "run build:rollup -w"
     },
     "dependencies": {
-        "@preply/ds-core": "0.43.0",
-        "@preply/ds-rn-core": "0.43.0",
-        "@preply/ds-rn-root": "0.43.0"
+        "@preply/ds-core": "0.43.1",
+        "@preply/ds-rn-core": "0.43.1",
+        "@preply/ds-rn-root": "0.43.1"
     },
     "peerDependencies": {
-        "@preply/ds-core": "0.43.0",
-        "@preply/ds-rn-core": "0.43.0",
-        "@preply/ds-rn-root": "0.43.0",
-        "react": "^18.0.0",
-        "react-native": "^0.69.4"
+        "@preply/ds-core": "0.43.1",
+        "@preply/ds-rn-core": "0.43.1",
+        "@preply/ds-rn-root": "0.43.1",
+        "react": "^16.8.3",
+        "react-native": "^0.63.4"
     },
     "devDependencies": {
-        "@testing-library/react-native": "11.0.0",
-        "metro-react-native-babel-preset": "0.72.2",
-        "react": "18.0.0",
-        "react-native": "0.69.4",
-        "react-test-renderer": "18.0.0"
+        "@testing-library/react-native": "^9.1.0",
+        "metro-react-native-babel-preset": "^0.59.0",
+        "react": "16.8.3",
+        "react-native": "^0.63.4",
+        "react-test-renderer": "16.8.3"
     },
-    "gitHead": "043b2f262b8ca9e8d5a30dce93bf03fcb3d5cfce"
+    "gitHead": "91b5d772936f0a8f93706d15a4648d23f96a0b32"
 }