@preply/ds-rn-lib 0.43.0 → 0.43.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/LayoutFlex/LayoutFlex.d.ts +17 -0
- package/dist/components/LayoutFlex/LayoutFlex.js +30 -0
- package/dist/components/LayoutFlex/private/ChildrenWithGap.d.ts +8 -0
- package/dist/components/LayoutFlex/private/ChildrenWithGap.js +25 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +2 -1
- package/dist/index.js +2 -1
- package/dist/props/layout/useLayoutFlexStyle.d.ts +10 -0
- package/dist/props/layout/useLayoutFlexStyle.js +34 -0
- package/dist/props/layout/usePaddingStyle.d.ts +7 -0
- package/dist/props/layout/usePaddingStyle.js +24 -0
- package/package.json +16 -16
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { LayoutGap } from '@preply/ds-core';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { StyleProp, ViewStyle } from 'react-native';
|
|
4
|
+
import { LayoutFlexStyle } from '../../props/layout/useLayoutFlexStyle';
|
|
5
|
+
declare type ViewStyleProp = StyleProp<ViewStyle>;
|
|
6
|
+
interface LayoutFlexProps extends LayoutFlexStyle {
|
|
7
|
+
gap?: LayoutGap;
|
|
8
|
+
hide?: boolean;
|
|
9
|
+
component?: React.ReactElement<{
|
|
10
|
+
style?: ViewStyleProp;
|
|
11
|
+
children?: React.ReactNode;
|
|
12
|
+
}> | React.ComponentType<{
|
|
13
|
+
style?: ViewStyleProp;
|
|
14
|
+
}>;
|
|
15
|
+
}
|
|
16
|
+
export declare const LayoutFlex: React.FC<LayoutFlexProps>;
|
|
17
|
+
export {};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { useLayoutFlexStyle } from '../../props/layout/useLayoutFlexStyle.js';
|
|
4
|
+
import { ChildrenWithGap } from './private/ChildrenWithGap.js';
|
|
5
|
+
|
|
6
|
+
const LayoutFlex = React.memo(({ gap, padding, nowrap, direction, justifyContent, alignItems, hide, children, component, }) => {
|
|
7
|
+
const style = useLayoutFlexStyle({
|
|
8
|
+
padding,
|
|
9
|
+
direction,
|
|
10
|
+
alignItems,
|
|
11
|
+
justifyContent,
|
|
12
|
+
nowrap,
|
|
13
|
+
});
|
|
14
|
+
if (hide) {
|
|
15
|
+
return null;
|
|
16
|
+
}
|
|
17
|
+
const content = !gap || React.Children.count(children) === 1 ? (children) : (React.createElement(ChildrenWithGap, { gap: gap, direction: direction }, children));
|
|
18
|
+
if (component && React.isValidElement(component)) {
|
|
19
|
+
return React.cloneElement(component, {
|
|
20
|
+
...component.props,
|
|
21
|
+
style: [component.props.style, style],
|
|
22
|
+
children: content,
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
const Component = component !== null && component !== void 0 ? component : View;
|
|
26
|
+
return React.createElement(Component, { style: style }, content);
|
|
27
|
+
});
|
|
28
|
+
|
|
29
|
+
export { LayoutFlex };
|
|
30
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGF5b3V0RmxleC5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvTGF5b3V0RmxleC9MYXlvdXRGbGV4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBMYXlvdXRHYXAgfSBmcm9tICdAcHJlcGx5L2RzLWNvcmUnO1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IFN0eWxlUHJvcCwgVmlldywgVmlld1N0eWxlIH0gZnJvbSAncmVhY3QtbmF0aXZlJztcblxuaW1wb3J0IHsgTGF5b3V0RmxleFN0eWxlLCB1c2VMYXlvdXRGbGV4U3R5bGUgfSBmcm9tICcuLi8uLi9wcm9wcy9sYXlvdXQvdXNlTGF5b3V0RmxleFN0eWxlJztcblxuaW1wb3J0IHsgQ2hpbGRyZW5XaXRoR2FwIH0gZnJvbSAnLi9wcml2YXRlL0NoaWxkcmVuV2l0aEdhcCc7XG5cbnR5cGUgVmlld1N0eWxlUHJvcCA9IFN0eWxlUHJvcDxWaWV3U3R5bGU+O1xuXG5pbnRlcmZhY2UgTGF5b3V0RmxleFByb3BzIGV4dGVuZHMgTGF5b3V0RmxleFN0eWxlIHtcbiAgICBnYXA/OiBMYXlvdXRHYXA7XG4gICAgaGlkZT86IGJvb2xlYW47XG4gICAgY29tcG9uZW50PzpcbiAgICAgICAgfCBSZWFjdC5SZWFjdEVsZW1lbnQ8eyBzdHlsZT86IFZpZXdTdHlsZVByb3A7IGNoaWxkcmVuPzogUmVhY3QuUmVhY3ROb2RlIH0+XG4gICAgICAgIHwgUmVhY3QuQ29tcG9uZW50VHlwZTx7IHN0eWxlPzogVmlld1N0eWxlUHJvcCB9Pjtcbn1cblxuZXhwb3J0IGNvbnN0IExheW91dEZsZXg6IFJlYWN0LkZDPExheW91dEZsZXhQcm9wcz4gPSBSZWFjdC5tZW1vKFxuICAgICh7XG4gICAgICAgIGdhcCxcbiAgICAgICAgcGFkZGluZyxcbiAgICAgICAgbm93cmFwLFxuICAgICAgICBkaXJlY3Rpb24sXG4gICAgICAgIGp1c3RpZnlDb250ZW50LFxuICAgICAgICBhbGlnbkl0ZW1zLFxuICAgICAgICBoaWRlLFxuICAgICAgICBjaGlsZHJlbixcbiAgICAgICAgY29tcG9uZW50LFxuICAgIH0pID0+IHtcbiAgICAgICAgY29uc3Qgc3R5bGUgPSB1c2VMYXlvdXRGbGV4U3R5bGUoe1xuICAgICAgICAgICAgcGFkZGluZyxcbiAgICAgICAgICAgIGRpcmVjdGlvbixcbiAgICAgICAgICAgIGFsaWduSXRlbXMsXG4gICAgICAgICAgICBqdXN0aWZ5Q29udGVudCxcbiAgICAgICAgICAgIG5vd3JhcCxcbiAgICAgICAgfSk7XG5cbiAgICAgICAgaWYgKGhpZGUpIHtcbiAgICAgICAgICAgIHJldHVybiBudWxsO1xuICAgICAgICB9XG5cbiAgICAgICAgY29uc3QgY29udGVudCA9XG4gICAgICAgICAgICAhZ2FwIHx8IFJlYWN0LkNoaWxkcmVuLmNvdW50KGNoaWxkcmVuKSA9PT0gMSA/IChcbiAgICAgICAgICAgICAgICBjaGlsZHJlblxuICAgICAgICAgICAgKSA6IChcbiAgICAgICAgICAgICAgICA8Q2hpbGRyZW5XaXRoR2FwIGdhcD17Z2FwfSBkaXJlY3Rpb249e2RpcmVjdGlvbn0+XG4gICAgICAgICAgICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgICAgICAgICA8L0NoaWxkcmVuV2l0aEdhcD5cbiAgICAgICAgICAgICk7XG5cbiAgICAgICAgaWYgKGNvbXBvbmVudCAmJiBSZWFjdC5pc1ZhbGlkRWxlbWVudChjb21wb25lbnQpKSB7XG4gICAgICAgICAgICByZXR1cm4gUmVhY3QuY2xvbmVFbGVtZW50KGNvbXBvbmVudCwge1xuICAgICAgICAgICAgICAgIC4uLmNvbXBvbmVudC5wcm9wcyxcbiAgICAgICAgICAgICAgICBzdHlsZTogW2NvbXBvbmVudC5wcm9wcy5zdHlsZSwgc3R5bGVdLFxuICAgICAgICAgICAgICAgIGNoaWxkcmVuOiBjb250ZW50LFxuICAgICAgICAgICAgfSk7XG4gICAgICAgIH1cblxuICAgICAgICBjb25zdCBDb21wb25lbnQgPSBjb21wb25lbnQgPz8gVmlldztcbiAgICAgICAgcmV0dXJuIDxDb21wb25lbnQgc3R5bGU9e3N0eWxlfT57Y29udGVudH08L0NvbXBvbmVudD47XG4gICAgfSxcbik7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7TUFrQmEsVUFBVSxHQUE4QixLQUFLLENBQUMsSUFBSSxDQUMzRCxDQUFDLEVBQ0csR0FBRyxFQUNILE9BQU8sRUFDUCxNQUFNLEVBQ04sU0FBUyxFQUNULGNBQWMsRUFDZCxVQUFVLEVBQ1YsSUFBSSxFQUNKLFFBQVEsRUFDUixTQUFTLEdBQ1o7SUFDRyxNQUFNLEtBQUssR0FBRyxrQkFBa0IsQ0FBQztRQUM3QixPQUFPO1FBQ1AsU0FBUztRQUNULFVBQVU7UUFDVixjQUFjO1FBQ2QsTUFBTTtLQUNULENBQUMsQ0FBQztJQUVILElBQUksSUFBSSxFQUFFO1FBQ04sT0FBTyxJQUFJLENBQUM7S0FDZjtJQUVELE1BQU0sT0FBTyxHQUNULENBQUMsR0FBRyxJQUFJLEtBQUssQ0FBQyxRQUFRLENBQUMsS0FBSyxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsSUFDeEMsUUFBUSxLQUVSLG9CQUFDLGVBQWUsSUFBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLFNBQVMsRUFBRSxTQUFTLElBQzFDLFFBQVEsQ0FDSyxDQUNyQixDQUFDO0lBRU4sSUFBSSxTQUFTLElBQUksS0FBSyxDQUFDLGNBQWMsQ0FBQyxTQUFTLENBQUMsRUFBRTtRQUM5QyxPQUFPLEtBQUssQ0FBQyxZQUFZLENBQUMsU0FBUyxFQUFFO1lBQ2pDLEdBQUcsU0FBUyxDQUFDLEtBQUs7WUFDbEIsS0FBSyxFQUFFLENBQUMsU0FBUyxDQUFDLEtBQUssQ0FBQyxLQUFLLEVBQUUsS0FBSyxDQUFDO1lBQ3JDLFFBQVEsRUFBRSxPQUFPO1NBQ3BCLENBQUMsQ0FBQztLQUNOO0lBRUQsTUFBTSxTQUFTLEdBQUcsU0FBUyxhQUFULFNBQVMsY0FBVCxTQUFTLEdBQUksSUFBSSxDQUFDO0lBQ3BDLE9BQU8sb0JBQUMsU0FBUyxJQUFDLEtBQUssRUFBRSxLQUFLLElBQUcsT0FBTyxDQUFhLENBQUM7QUFDMUQsQ0FBQzs7OzsifQ==
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { root } from '@preply/ds-core';
|
|
2
|
+
import { useToken } from '@preply/ds-rn-core';
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { View } from 'react-native';
|
|
5
|
+
|
|
6
|
+
// This is a workaround for the fact that react-native doesn't support gap style.
|
|
7
|
+
const ChildrenWithGap = React.memo(({ gap, direction, children }) => {
|
|
8
|
+
const gapSize = useToken(root.space[gap]);
|
|
9
|
+
const isRow = direction === 'row' || direction === 'row-reverse';
|
|
10
|
+
const spacerStyle = isRow ? { width: gapSize } : { height: gapSize };
|
|
11
|
+
const spacer = React.createElement(View, { style: spacerStyle });
|
|
12
|
+
return (React.createElement(React.Fragment, null, React.Children.map(children, (child, index) => {
|
|
13
|
+
if (index === 0) {
|
|
14
|
+
return child;
|
|
15
|
+
}
|
|
16
|
+
return (
|
|
17
|
+
// eslint-disable-next-line react/no-array-index-key
|
|
18
|
+
React.createElement(React.Fragment, { key: index },
|
|
19
|
+
spacer,
|
|
20
|
+
child));
|
|
21
|
+
})));
|
|
22
|
+
});
|
|
23
|
+
|
|
24
|
+
export { ChildrenWithGap };
|
|
25
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hpbGRyZW5XaXRoR2FwLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9MYXlvdXRGbGV4L3ByaXZhdGUvQ2hpbGRyZW5XaXRoR2FwLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBMYXlvdXRGbGV4RGlyZWN0aW9uLCBMYXlvdXRHYXAsIHJvb3QgfSBmcm9tICdAcHJlcGx5L2RzLWNvcmUnO1xuaW1wb3J0IHsgdXNlVG9rZW4gfSBmcm9tICdAcHJlcGx5L2RzLXJuLWNvcmUnO1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IFZpZXcgfSBmcm9tICdyZWFjdC1uYXRpdmUnO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICAgIGdhcDogTGF5b3V0R2FwO1xuICAgIGRpcmVjdGlvbj86IExheW91dEZsZXhEaXJlY3Rpb247XG59XG5cbi8vIFRoaXMgaXMgYSB3b3JrYXJvdW5kIGZvciB0aGUgZmFjdCB0aGF0IHJlYWN0LW5hdGl2ZSBkb2Vzbid0IHN1cHBvcnQgZ2FwIHN0eWxlLlxuZXhwb3J0IGNvbnN0IENoaWxkcmVuV2l0aEdhcDogUmVhY3QuRkM8UHJvcHM+ID0gUmVhY3QubWVtbygoeyBnYXAsIGRpcmVjdGlvbiwgY2hpbGRyZW4gfSkgPT4ge1xuICAgIGNvbnN0IGdhcFNpemUgPSB1c2VUb2tlbihyb290LnNwYWNlW2dhcF0pO1xuICAgIGNvbnN0IGlzUm93ID0gZGlyZWN0aW9uID09PSAncm93JyB8fCBkaXJlY3Rpb24gPT09ICdyb3ctcmV2ZXJzZSc7XG4gICAgY29uc3Qgc3BhY2VyU3R5bGUgPSBpc1JvdyA/IHsgd2lkdGg6IGdhcFNpemUgfSA6IHsgaGVpZ2h0OiBnYXBTaXplIH07XG4gICAgY29uc3Qgc3BhY2VyID0gPFZpZXcgc3R5bGU9e3NwYWNlclN0eWxlfSAvPjtcblxuICAgIHJldHVybiAoXG4gICAgICAgIDw+XG4gICAgICAgICAgICB7UmVhY3QuQ2hpbGRyZW4ubWFwKGNoaWxkcmVuLCAoY2hpbGQsIGluZGV4KSA9PiB7XG4gICAgICAgICAgICAgICAgaWYgKGluZGV4ID09PSAwKSB7XG4gICAgICAgICAgICAgICAgICAgIHJldHVybiBjaGlsZDtcbiAgICAgICAgICAgICAgICB9XG5cbiAgICAgICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICAgICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgcmVhY3Qvbm8tYXJyYXktaW5kZXgta2V5XG4gICAgICAgICAgICAgICAgICAgIDxSZWFjdC5GcmFnbWVudCBrZXk9e2luZGV4fT5cbiAgICAgICAgICAgICAgICAgICAgICAgIHtzcGFjZXJ9XG4gICAgICAgICAgICAgICAgICAgICAgICB7Y2hpbGR9XG4gICAgICAgICAgICAgICAgICAgIDwvUmVhY3QuRnJhZ21lbnQ+XG4gICAgICAgICAgICAgICAgKTtcbiAgICAgICAgICAgIH0pfVxuICAgICAgICA8Lz5cbiAgICApO1xufSk7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFVQTtNQUNhLGVBQWUsR0FBb0IsS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDLEVBQUUsR0FBRyxFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUU7SUFDcEYsTUFBTSxPQUFPLEdBQUcsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQztJQUMxQyxNQUFNLEtBQUssR0FBRyxTQUFTLEtBQUssS0FBSyxJQUFJLFNBQVMsS0FBSyxhQUFhLENBQUM7SUFDakUsTUFBTSxXQUFXLEdBQUcsS0FBSyxHQUFHLEVBQUUsS0FBSyxFQUFFLE9BQU8sRUFBRSxHQUFHLEVBQUUsTUFBTSxFQUFFLE9BQU8sRUFBRSxDQUFDO0lBQ3JFLE1BQU0sTUFBTSxHQUFHLG9CQUFDLElBQUksSUFBQyxLQUFLLEVBQUUsV0FBVyxHQUFJLENBQUM7SUFFNUMsUUFDSSwwQ0FDSyxLQUFLLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxRQUFRLEVBQUUsQ0FBQyxLQUFLLEVBQUUsS0FBSztRQUN2QyxJQUFJLEtBQUssS0FBSyxDQUFDLEVBQUU7WUFDYixPQUFPLEtBQUssQ0FBQztTQUNoQjtRQUVEOztRQUVJLG9CQUFDLEtBQUssQ0FBQyxRQUFRLElBQUMsR0FBRyxFQUFFLEtBQUs7WUFDckIsTUFBTTtZQUNOLEtBQUssQ0FDTyxFQUNuQjtLQUNMLENBQUMsQ0FDSCxFQUNMO0FBQ04sQ0FBQzs7OzsifQ==
|
package/dist/components/index.js
CHANGED
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
export { Text } from './Text/Text.js';
|
|
2
|
-
|
|
2
|
+
export { LayoutFlex } from './LayoutFlex/LayoutFlex.js';
|
|
3
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOyJ9
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
export { Text } from './components/Text/Text.js';
|
|
2
|
-
|
|
2
|
+
export { LayoutFlex } from './components/LayoutFlex/LayoutFlex.js';
|
|
3
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOyJ9
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { LayoutAlignItems, LayoutFlexDirection, LayoutJustifyContent, LayoutPadding, ShortHand } from '@preply/ds-core';
|
|
2
|
+
import { StyleProp, ViewStyle } from 'react-native';
|
|
3
|
+
export interface LayoutFlexStyle {
|
|
4
|
+
padding?: ShortHand<LayoutPadding>;
|
|
5
|
+
nowrap?: boolean;
|
|
6
|
+
direction?: LayoutFlexDirection;
|
|
7
|
+
justifyContent?: LayoutJustifyContent;
|
|
8
|
+
alignItems?: LayoutAlignItems;
|
|
9
|
+
}
|
|
10
|
+
export declare function useLayoutFlexStyle({ padding, direction, nowrap, alignItems, justifyContent, }: LayoutFlexStyle): StyleProp<ViewStyle>;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { useMemo } from 'react';
|
|
2
|
+
import { StyleSheet } from 'react-native';
|
|
3
|
+
import { usePaddingStyle } from './usePaddingStyle.js';
|
|
4
|
+
|
|
5
|
+
const alignItemsMap = {
|
|
6
|
+
start: 'flex-start',
|
|
7
|
+
end: 'flex-end',
|
|
8
|
+
center: 'center',
|
|
9
|
+
stretch: 'stretch',
|
|
10
|
+
baseline: 'baseline',
|
|
11
|
+
};
|
|
12
|
+
const justifyContentMap = {
|
|
13
|
+
start: 'flex-start',
|
|
14
|
+
end: 'flex-end',
|
|
15
|
+
center: 'center',
|
|
16
|
+
'space-between': 'space-between',
|
|
17
|
+
'space-around': 'space-around',
|
|
18
|
+
'space-evenly': 'space-evenly',
|
|
19
|
+
};
|
|
20
|
+
function useLayoutFlexStyle({ padding, direction, nowrap, alignItems, justifyContent, }) {
|
|
21
|
+
const paddingStyle = usePaddingStyle(padding);
|
|
22
|
+
const flexStyle = useMemo(() => {
|
|
23
|
+
return {
|
|
24
|
+
...(direction ? { flexDirection: direction } : {}),
|
|
25
|
+
...(nowrap ? { flexWrap: 'nowrap' } : {}),
|
|
26
|
+
...(alignItems ? { alignItems: alignItemsMap[alignItems] } : {}),
|
|
27
|
+
...(justifyContent ? { justifyContent: justifyContentMap[justifyContent] } : {}),
|
|
28
|
+
};
|
|
29
|
+
}, [alignItems, direction, justifyContent, nowrap]);
|
|
30
|
+
return useMemo(() => StyleSheet.flatten([paddingStyle, flexStyle]), [paddingStyle, flexStyle]);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
export { useLayoutFlexStyle };
|
|
34
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlTGF5b3V0RmxleFN0eWxlLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvcHJvcHMvbGF5b3V0L3VzZUxheW91dEZsZXhTdHlsZS50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIExheW91dEFsaWduSXRlbXMsXG4gICAgTGF5b3V0RmxleERpcmVjdGlvbixcbiAgICBMYXlvdXRKdXN0aWZ5Q29udGVudCxcbiAgICBMYXlvdXRQYWRkaW5nLFxuICAgIFNob3J0SGFuZCxcbn0gZnJvbSAnQHByZXBseS9kcy1jb3JlJztcbmltcG9ydCB7IHVzZU1lbW8gfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBGbGV4U3R5bGUsIFN0eWxlUHJvcCwgU3R5bGVTaGVldCwgVmlld1N0eWxlIH0gZnJvbSAncmVhY3QtbmF0aXZlJztcblxuaW1wb3J0IHsgdXNlUGFkZGluZ1N0eWxlIH0gZnJvbSAnLi91c2VQYWRkaW5nU3R5bGUnO1xuXG5jb25zdCBhbGlnbkl0ZW1zTWFwOiBSZWNvcmQ8TGF5b3V0QWxpZ25JdGVtcywgVmlld1N0eWxlWydhbGlnbkl0ZW1zJ10+ID0ge1xuICAgIHN0YXJ0OiAnZmxleC1zdGFydCcsXG4gICAgZW5kOiAnZmxleC1lbmQnLFxuICAgIGNlbnRlcjogJ2NlbnRlcicsXG4gICAgc3RyZXRjaDogJ3N0cmV0Y2gnLFxuICAgIGJhc2VsaW5lOiAnYmFzZWxpbmUnLFxufTtcblxuY29uc3QganVzdGlmeUNvbnRlbnRNYXA6IFJlY29yZDxMYXlvdXRKdXN0aWZ5Q29udGVudCwgVmlld1N0eWxlWydqdXN0aWZ5Q29udGVudCddPiA9IHtcbiAgICBzdGFydDogJ2ZsZXgtc3RhcnQnLFxuICAgIGVuZDogJ2ZsZXgtZW5kJyxcbiAgICBjZW50ZXI6ICdjZW50ZXInLFxuICAgICdzcGFjZS1iZXR3ZWVuJzogJ3NwYWNlLWJldHdlZW4nLFxuICAgICdzcGFjZS1hcm91bmQnOiAnc3BhY2UtYXJvdW5kJyxcbiAgICAnc3BhY2UtZXZlbmx5JzogJ3NwYWNlLWV2ZW5seScsXG59O1xuZXhwb3J0IGludGVyZmFjZSBMYXlvdXRGbGV4U3R5bGUge1xuICAgIHBhZGRpbmc/OiBTaG9ydEhhbmQ8TGF5b3V0UGFkZGluZz47XG4gICAgbm93cmFwPzogYm9vbGVhbjtcbiAgICBkaXJlY3Rpb24/OiBMYXlvdXRGbGV4RGlyZWN0aW9uO1xuICAgIGp1c3RpZnlDb250ZW50PzogTGF5b3V0SnVzdGlmeUNvbnRlbnQ7XG4gICAgYWxpZ25JdGVtcz86IExheW91dEFsaWduSXRlbXM7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiB1c2VMYXlvdXRGbGV4U3R5bGUoe1xuICAgIHBhZGRpbmcsXG4gICAgZGlyZWN0aW9uLFxuICAgIG5vd3JhcCxcbiAgICBhbGlnbkl0ZW1zLFxuICAgIGp1c3RpZnlDb250ZW50LFxufTogTGF5b3V0RmxleFN0eWxlKTogU3R5bGVQcm9wPFZpZXdTdHlsZT4ge1xuICAgIGNvbnN0IHBhZGRpbmdTdHlsZSA9IHVzZVBhZGRpbmdTdHlsZShwYWRkaW5nKTtcblxuICAgIGNvbnN0IGZsZXhTdHlsZTogRmxleFN0eWxlID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICAgIHJldHVybiB7XG4gICAgICAgICAgICAuLi4oZGlyZWN0aW9uID8geyBmbGV4RGlyZWN0aW9uOiBkaXJlY3Rpb24gfSA6IHt9KSxcbiAgICAgICAgICAgIC4uLihub3dyYXAgPyB7IGZsZXhXcmFwOiAnbm93cmFwJyB9IDoge30pLFxuICAgICAgICAgICAgLi4uKGFsaWduSXRlbXMgPyB7IGFsaWduSXRlbXM6IGFsaWduSXRlbXNNYXBbYWxpZ25JdGVtc10gfSA6IHt9KSxcbiAgICAgICAgICAgIC4uLihqdXN0aWZ5Q29udGVudCA/IHsganVzdGlmeUNvbnRlbnQ6IGp1c3RpZnlDb250ZW50TWFwW2p1c3RpZnlDb250ZW50XSB9IDoge30pLFxuICAgICAgICB9O1xuICAgIH0sIFthbGlnbkl0ZW1zLCBkaXJlY3Rpb24sIGp1c3RpZnlDb250ZW50LCBub3dyYXBdKTtcblxuICAgIHJldHVybiB1c2VNZW1vKCgpID0+IFN0eWxlU2hlZXQuZmxhdHRlbihbcGFkZGluZ1N0eWxlLCBmbGV4U3R5bGVdKSwgW3BhZGRpbmdTdHlsZSwgZmxleFN0eWxlXSk7XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQVlBLE1BQU0sYUFBYSxHQUFzRDtJQUNyRSxLQUFLLEVBQUUsWUFBWTtJQUNuQixHQUFHLEVBQUUsVUFBVTtJQUNmLE1BQU0sRUFBRSxRQUFRO0lBQ2hCLE9BQU8sRUFBRSxTQUFTO0lBQ2xCLFFBQVEsRUFBRSxVQUFVO0NBQ3ZCLENBQUM7QUFFRixNQUFNLGlCQUFpQixHQUE4RDtJQUNqRixLQUFLLEVBQUUsWUFBWTtJQUNuQixHQUFHLEVBQUUsVUFBVTtJQUNmLE1BQU0sRUFBRSxRQUFRO0lBQ2hCLGVBQWUsRUFBRSxlQUFlO0lBQ2hDLGNBQWMsRUFBRSxjQUFjO0lBQzlCLGNBQWMsRUFBRSxjQUFjO0NBQ2pDLENBQUM7U0FTYyxrQkFBa0IsQ0FBQyxFQUMvQixPQUFPLEVBQ1AsU0FBUyxFQUNULE1BQU0sRUFDTixVQUFVLEVBQ1YsY0FBYyxHQUNBO0lBQ2QsTUFBTSxZQUFZLEdBQUcsZUFBZSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBRTlDLE1BQU0sU0FBUyxHQUFjLE9BQU8sQ0FBQztRQUNqQyxPQUFPO1lBQ0gsSUFBSSxTQUFTLEdBQUcsRUFBRSxhQUFhLEVBQUUsU0FBUyxFQUFFLEdBQUcsRUFBRSxDQUFDO1lBQ2xELElBQUksTUFBTSxHQUFHLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxHQUFHLEVBQUUsQ0FBQztZQUN6QyxJQUFJLFVBQVUsR0FBRyxFQUFFLFVBQVUsRUFBRSxhQUFhLENBQUMsVUFBVSxDQUFDLEVBQUUsR0FBRyxFQUFFLENBQUM7WUFDaEUsSUFBSSxjQUFjLEdBQUcsRUFBRSxjQUFjLEVBQUUsaUJBQWlCLENBQUMsY0FBYyxDQUFDLEVBQUUsR0FBRyxFQUFFLENBQUM7U0FDbkYsQ0FBQztLQUNMLEVBQUUsQ0FBQyxVQUFVLEVBQUUsU0FBUyxFQUFFLGNBQWMsRUFBRSxNQUFNLENBQUMsQ0FBQyxDQUFDO0lBRXBELE9BQU8sT0FBTyxDQUFDLE1BQU0sVUFBVSxDQUFDLE9BQU8sQ0FBQyxDQUFDLFlBQVksRUFBRSxTQUFTLENBQUMsQ0FBQyxFQUFFLENBQUMsWUFBWSxFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUM7QUFDbkc7Ozs7In0=
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { LayoutPadding, ShortHand } from '@preply/ds-core';
|
|
2
|
+
export declare function usePaddingStyle(padding?: ShortHand<LayoutPadding>): {
|
|
3
|
+
paddingTop?: string | number;
|
|
4
|
+
paddingBottom?: string | number;
|
|
5
|
+
paddingRight?: string | number;
|
|
6
|
+
paddingLeft?: string | number;
|
|
7
|
+
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { normalizeShorthand, root } from '@preply/ds-core';
|
|
2
|
+
import { createStyleSheet, useStyleSheet } from '@preply/ds-rn-core';
|
|
3
|
+
import { useMemo } from 'react';
|
|
4
|
+
|
|
5
|
+
function usePaddingStyle(padding) {
|
|
6
|
+
const rawStyles = useMemo(() => {
|
|
7
|
+
if (!padding) {
|
|
8
|
+
return createStyleSheet({ padding: {} });
|
|
9
|
+
}
|
|
10
|
+
const [top, right, bottom, left] = normalizeShorthand(padding);
|
|
11
|
+
return createStyleSheet({
|
|
12
|
+
padding: {
|
|
13
|
+
paddingTop: root.space[top],
|
|
14
|
+
paddingRight: root.space[right],
|
|
15
|
+
paddingBottom: root.space[bottom],
|
|
16
|
+
paddingLeft: root.space[left],
|
|
17
|
+
},
|
|
18
|
+
});
|
|
19
|
+
}, [padding === null || padding === void 0 ? void 0 : padding.toString()]);
|
|
20
|
+
return useStyleSheet(rawStyles).padding;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
export { usePaddingStyle };
|
|
24
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlUGFkZGluZ1N0eWxlLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvcHJvcHMvbGF5b3V0L3VzZVBhZGRpbmdTdHlsZS50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBMYXlvdXRQYWRkaW5nLCBTaG9ydEhhbmQsIG5vcm1hbGl6ZVNob3J0aGFuZCwgcm9vdCB9IGZyb20gJ0BwcmVwbHkvZHMtY29yZSc7XG5pbXBvcnQgeyBjcmVhdGVTdHlsZVNoZWV0LCB1c2VTdHlsZVNoZWV0IH0gZnJvbSAnQHByZXBseS9kcy1ybi1jb3JlJztcbmltcG9ydCB7IHVzZU1lbW8gfSBmcm9tICdyZWFjdCc7XG5cbmV4cG9ydCBmdW5jdGlvbiB1c2VQYWRkaW5nU3R5bGUocGFkZGluZz86IFNob3J0SGFuZDxMYXlvdXRQYWRkaW5nPik6IHtcbiAgICBwYWRkaW5nVG9wPzogc3RyaW5nIHwgbnVtYmVyO1xuICAgIHBhZGRpbmdCb3R0b20/OiBzdHJpbmcgfCBudW1iZXI7XG4gICAgcGFkZGluZ1JpZ2h0Pzogc3RyaW5nIHwgbnVtYmVyO1xuICAgIHBhZGRpbmdMZWZ0Pzogc3RyaW5nIHwgbnVtYmVyO1xufSB7XG4gICAgY29uc3QgcmF3U3R5bGVzID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICAgIGlmICghcGFkZGluZykge1xuICAgICAgICAgICAgcmV0dXJuIGNyZWF0ZVN0eWxlU2hlZXQoeyBwYWRkaW5nOiB7fSB9KTtcbiAgICAgICAgfVxuXG4gICAgICAgIGNvbnN0IFt0b3AsIHJpZ2h0LCBib3R0b20sIGxlZnRdID0gbm9ybWFsaXplU2hvcnRoYW5kKHBhZGRpbmcpO1xuXG4gICAgICAgIHJldHVybiBjcmVhdGVTdHlsZVNoZWV0KHtcbiAgICAgICAgICAgIHBhZGRpbmc6IHtcbiAgICAgICAgICAgICAgICBwYWRkaW5nVG9wOiByb290LnNwYWNlW3RvcF0sXG4gICAgICAgICAgICAgICAgcGFkZGluZ1JpZ2h0OiByb290LnNwYWNlW3JpZ2h0XSxcbiAgICAgICAgICAgICAgICBwYWRkaW5nQm90dG9tOiByb290LnNwYWNlW2JvdHRvbV0sXG4gICAgICAgICAgICAgICAgcGFkZGluZ0xlZnQ6IHJvb3Quc3BhY2VbbGVmdF0sXG4gICAgICAgICAgICB9LFxuICAgICAgICB9KTtcbiAgICB9LCBbcGFkZGluZz8udG9TdHJpbmcoKV0pO1xuXG4gICAgcmV0dXJuIHVzZVN0eWxlU2hlZXQocmF3U3R5bGVzKS5wYWRkaW5nO1xufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7U0FJZ0IsZUFBZSxDQUFDLE9BQWtDO0lBTTlELE1BQU0sU0FBUyxHQUFHLE9BQU8sQ0FBQztRQUN0QixJQUFJLENBQUMsT0FBTyxFQUFFO1lBQ1YsT0FBTyxnQkFBZ0IsQ0FBQyxFQUFFLE9BQU8sRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUFDO1NBQzVDO1FBRUQsTUFBTSxDQUFDLEdBQUcsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLElBQUksQ0FBQyxHQUFHLGtCQUFrQixDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBRS9ELE9BQU8sZ0JBQWdCLENBQUM7WUFDcEIsT0FBTyxFQUFFO2dCQUNMLFVBQVUsRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQztnQkFDM0IsWUFBWSxFQUFFLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDO2dCQUMvQixhQUFhLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUM7Z0JBQ2pDLFdBQVcsRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQzthQUNoQztTQUNKLENBQUMsQ0FBQztLQUNOLEVBQUUsQ0FBQyxPQUFPLGFBQVAsT0FBTyx1QkFBUCxPQUFPLENBQUUsUUFBUSxHQUFHLENBQUMsQ0FBQztJQUUxQixPQUFPLGFBQWEsQ0FBQyxTQUFTLENBQUMsQ0FBQyxPQUFPLENBQUM7QUFDNUM7Ozs7In0=
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@preply/ds-rn-lib",
|
|
3
|
-
"version": "0.43.
|
|
3
|
+
"version": "0.43.2",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -11,30 +11,30 @@
|
|
|
11
11
|
"sideEffects": false,
|
|
12
12
|
"scripts": {
|
|
13
13
|
"clean": "rm -rf dist",
|
|
14
|
-
"lint": "run --top-level eslint --ext .js,.ts,.tsx,.mdx *.config.js src/",
|
|
14
|
+
"lint": "run --top-level eslint --ext .js,.ts,.tsx,.mdx *.config.js src/ test/",
|
|
15
15
|
"test": "run --top-level jest --coverage",
|
|
16
16
|
"build": "NODE_ENV=production && run build:rollup",
|
|
17
17
|
"build:rollup": "run --top-level rollup -c rollup.config.js",
|
|
18
18
|
"dev": "run build:rollup -w"
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"@preply/ds-core": "0.43.
|
|
22
|
-
"@preply/ds-rn-core": "0.43.
|
|
23
|
-
"@preply/ds-rn-root": "0.43.
|
|
21
|
+
"@preply/ds-core": "0.43.2",
|
|
22
|
+
"@preply/ds-rn-core": "0.43.2",
|
|
23
|
+
"@preply/ds-rn-root": "0.43.2"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
|
-
"@preply/ds-core": "0.43.
|
|
27
|
-
"@preply/ds-rn-core": "0.43.
|
|
28
|
-
"@preply/ds-rn-root": "0.43.
|
|
29
|
-
"react": "^
|
|
30
|
-
"react-native": "^0.
|
|
26
|
+
"@preply/ds-core": "0.43.2",
|
|
27
|
+
"@preply/ds-rn-core": "0.43.2",
|
|
28
|
+
"@preply/ds-rn-root": "0.43.2",
|
|
29
|
+
"react": "^16.8.3",
|
|
30
|
+
"react-native": "^0.63.4"
|
|
31
31
|
},
|
|
32
32
|
"devDependencies": {
|
|
33
|
-
"@testing-library/react-native": "
|
|
34
|
-
"metro-react-native-babel-preset": "0.
|
|
35
|
-
"react": "
|
|
36
|
-
"react-native": "0.
|
|
37
|
-
"react-test-renderer": "
|
|
33
|
+
"@testing-library/react-native": "^9.1.0",
|
|
34
|
+
"metro-react-native-babel-preset": "^0.59.0",
|
|
35
|
+
"react": "16.8.3",
|
|
36
|
+
"react-native": "^0.63.4",
|
|
37
|
+
"react-test-renderer": "16.8.3"
|
|
38
38
|
},
|
|
39
|
-
"gitHead": "
|
|
39
|
+
"gitHead": "e93cea4c45ddb12062fb8dfe40204cc8c4abb805"
|
|
40
40
|
}
|