react-native-sj-ui 0.1.0 → 0.1.1

package/lib/module/components/Column.js

@@ -0,0 +1,13 @@
+"use strict";
+
+import React from 'react';
+import Flex from "./Flex.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const Column = props => {
+  return /*#__PURE__*/_jsx(Flex, {
+    direction: "column",
+    ...props
+  });
+};
+export default Column;
+//# sourceMappingURL=Column.js.map

package/lib/module/components/Column.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Flex","jsx","_jsx","Column","props","direction"],"sourceRoot":"../../../src","sources":["components/Column.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAGzB,OAAOC,IAAI,MAAM,WAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAI1B,MAAMC,MAA6B,GAAIC,KAAK,IAAK;EAC/C,oBAAOF,IAAA,CAACF,IAAI;IAACK,SAAS,EAAC,QAAQ;IAAA,GAAKD;EAAK,CAAG,CAAC;AAC/C,CAAC;AAED,eAAeD,MAAM","ignoreList":[]}

package/lib/module/components/Flex.js

@@ -0,0 +1,37 @@
+"use strict";
+
+import React from 'react';
+import { View } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+const Flex = ({
+  children,
+  direction = 'column',
+  flex,
+  flexGrow,
+  flexShrink,
+  flexWrap,
+  gap,
+  justifyContent = 'flex-start',
+  alignItems = 'stretch',
+  alignSelf,
+  style,
+  ...rest
+}) => {
+  return /*#__PURE__*/_jsx(View, {
+    ...rest,
+    style: [{
+      flexDirection: direction,
+      flex,
+      flexGrow,
+      flexShrink,
+      flexWrap,
+      gap,
+      justifyContent,
+      alignItems,
+      alignSelf
+    }, style],
+    children: children
+  });
+};
+export default Flex;
+//# sourceMappingURL=Flex.js.map

package/lib/module/components/Flex.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","jsx","_jsx","Flex","children","direction","flex","flexGrow","flexShrink","flexWrap","gap","justifyContent","alignItems","alignSelf","style","rest","flexDirection"],"sourceRoot":"../../../src","sources":["components/Flex.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAIzB,SAASC,IAAI,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAqBpC,MAAMC,IAAyB,GAAGA,CAAC;EACjCC,QAAQ;EAERC,SAAS,GAAG,QAAQ;EAEpBC,IAAI;EACJC,QAAQ;EACRC,UAAU;EACVC,QAAQ;EAERC,GAAG;EAEHC,cAAc,GAAG,YAAY;EAC7BC,UAAU,GAAG,SAAS;EACtBC,SAAS;EAETC,KAAK;EACL,GAAGC;AACL,CAAC,KAAK;EACJ,oBACEb,IAAA,CAACF,IAAI;IAAA,GACCe,IAAI;IACRD,KAAK,EAAE,CACL;MACEE,aAAa,EAAEX,SAAS;MAExBC,IAAI;MACJC,QAAQ;MACRC,UAAU;MACVC,QAAQ;MAERC,GAAG;MAEHC,cAAc;MACdC,UAAU;MACVC;IACF,CAAC,EACDC,KAAK,CACL;IAAAV,QAAA,EAEDA;EAAQ,CACL,CAAC;AAEX,CAAC;AAED,eAAeD,IAAI","ignoreList":[]}

package/lib/module/components/Row.js

@@ -0,0 +1,13 @@
+"use strict";
+
+import React from 'react';
+import Flex from "./Flex.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const Row = props => {
+  return /*#__PURE__*/_jsx(Flex, {
+    direction: "row",
+    ...props
+  });
+};
+export default Row;
+//# sourceMappingURL=Row.js.map

package/lib/module/components/Row.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Flex","jsx","_jsx","Row","props","direction"],"sourceRoot":"../../../src","sources":["components/Row.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAGzB,OAAOC,IAAI,MAAM,WAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAI1B,MAAMC,GAAuB,GAAIC,KAAK,IAAK;EACzC,oBAAOF,IAAA,CAACF,IAAI;IAACK,SAAS,EAAC,KAAK;IAAA,GAAKD;EAAK,CAAG,CAAC;AAC5C,CAAC;AAED,eAAeD,GAAG","ignoreList":[]}

package/lib/module/components/index.js

@@ -0,0 +1,9 @@
+"use strict";
+
+import Column from "./Column.js";
+import Flex from "./Flex.js";
+import Row from "./Row.js";
+import TextView from "./TextView.js";
+import ViewCard from "./ViewCard.js";
+export { Column, Flex, Row, TextView, ViewCard };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["Column","Flex","Row","TextView","ViewCard"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,OAAOA,MAAM,MAAM,aAAU;AAC7B,OAAOC,IAAI,MAAM,WAAQ;AACzB,OAAOC,GAAG,MAAM,UAAO;AACvB,OAAOC,QAAQ,MAAM,eAAY;AACjC,OAAOC,QAAQ,MAAM,eAAY;AAEjC,SAASJ,MAAM,EAAEC,IAAI,EAAEC,GAAG,EAAEC,QAAQ,EAAEC,QAAQ","ignoreList":[]}

package/lib/module/index.js

@@ -1,9 +1,5 @@
 "use strict";
 
-import { SjUiProvider } from "./provider/UIProvider.js";
-import TextView from "./components/TextView.js";
-import ViewCard from "./components/ViewCard.js";
-export { TextView };
-export { SjUiProvider };
-export { ViewCard };
+export { SjUiProvider } from "./provider/UIProvider.js";
+export { TextView, ViewCard, Row, Column, Flex } from "./components/index.js";
 //# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["SjUiProvider","TextView","ViewCard"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,SAASA,YAAY,QAAQ,0BAAuB;AACpD,OAAOC,QAAQ,MAAM,0BAAuB;AAC5C,OAAOC,QAAQ,MAAM,0BAAuB;AAE5C,SAASD,QAAQ;AACjB,SAASD,YAAY;AACrB,SAASE,QAAQ","ignoreList":[]}
+{"version":3,"names":["SjUiProvider","TextView","ViewCard","Row","Column","Flex"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,SAASA,YAAY,QAAQ,0BAAuB;AAEpD,SAASC,QAAQ,EAAEC,QAAQ,EAAEC,GAAG,EAAEC,MAAM,EAAEC,IAAI,QAAQ,uBAAc","ignoreList":[]}

package/lib/typescript/src/components/Column.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { ComponentProps } from 'react';
+import Flex from './Flex.js';
+type ColumnProps = Omit<ComponentProps<typeof Flex>, 'direction'>;
+declare const Column: React.FC<ColumnProps>;
+export default Column;
+//# sourceMappingURL=Column.d.ts.map

package/lib/typescript/src/components/Column.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Column.d.ts","sourceRoot":"","sources":["../../../../src/components/Column.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,IAAI,MAAM,WAAQ,CAAC;AAE1B,KAAK,WAAW,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EAAE,WAAW,CAAC,CAAC;AAElE,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAEjC,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/lib/typescript/src/components/Flex.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import type { ReactNode } from 'react';
+import type { ViewProps, ViewStyle, StyleProp } from 'react-native';
+interface FlexProps extends ViewProps {
+    children?: ReactNode;
+    direction?: ViewStyle['flexDirection'];
+    flex?: ViewStyle['flex'];
+    flexGrow?: ViewStyle['flexGrow'];
+    flexShrink?: ViewStyle['flexShrink'];
+    flexWrap?: ViewStyle['flexWrap'];
+    gap?: ViewStyle['gap'];
+    justifyContent?: ViewStyle['justifyContent'];
+    alignItems?: ViewStyle['alignItems'];
+    alignSelf?: ViewStyle['alignSelf'];
+    style?: StyleProp<ViewStyle>;
+}
+declare const Flex: React.FC<FlexProps>;
+export default Flex;
+//# sourceMappingURL=Flex.d.ts.map

package/lib/typescript/src/components/Flex.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex.d.ts","sourceRoot":"","sources":["../../../../src/components/Flex.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIpE,UAAU,SAAU,SAAQ,SAAS;IACnC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,SAAS,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IAEvC,IAAI,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACzB,QAAQ,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IACjC,UAAU,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IACrC,QAAQ,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IAEjC,GAAG,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC;IAEvB,cAAc,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC7C,UAAU,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IACrC,SAAS,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IAEnC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;AAED,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CA2C7B,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/lib/typescript/src/components/Row.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { ComponentProps } from 'react';
+import Flex from './Flex.js';
+type RowProps = Omit<ComponentProps<typeof Flex>, 'direction'>;
+declare const Row: React.FC<RowProps>;
+export default Row;
+//# sourceMappingURL=Row.d.ts.map

package/lib/typescript/src/components/Row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.d.ts","sourceRoot":"","sources":["../../../../src/components/Row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,IAAI,MAAM,WAAQ,CAAC;AAE1B,KAAK,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EAAE,WAAW,CAAC,CAAC;AAE/D,QAAA,MAAM,GAAG,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,CAE3B,CAAC;AAEF,eAAe,GAAG,CAAC"}

package/lib/typescript/src/components/index.d.ts

@@ -0,0 +1,7 @@
+import Column from './Column.js';
+import Flex from './Flex.js';
+import Row from './Row.js';
+import TextView from './TextView.js';
+import ViewCard from './ViewCard.js';
+export { Column, Flex, Row, TextView, ViewCard };
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAU,CAAC;AAC9B,OAAO,IAAI,MAAM,WAAQ,CAAC;AAC1B,OAAO,GAAG,MAAM,UAAO,CAAC;AACxB,OAAO,QAAQ,MAAM,eAAY,CAAC;AAClC,OAAO,QAAQ,MAAM,eAAY,CAAC;AAElC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC"}

package/lib/typescript/src/index.d.ts

@@ -1,7 +1,3 @@
-import { SjUiProvider } from './provider/UIProvider.js';
-import TextView from './components/TextView.js';
-import ViewCard from './components/ViewCard.js';
-export { TextView };
-export { SjUiProvider };
-export { ViewCard };
+export { SjUiProvider } from './provider/UIProvider.js';
+export { TextView, ViewCard, Row, Column, Flex } from './components/index.js';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,0BAAuB,CAAC;AACrD,OAAO,QAAQ,MAAM,0BAAuB,CAAC;AAC7C,OAAO,QAAQ,MAAM,0BAAuB,CAAC;AAE7C,OAAO,EAAE,QAAQ,EAAE,CAAC;AACpB,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,0BAAuB,CAAC;AAErD,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,uBAAc,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-sj-ui",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "The ui library for react native application.",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",

package/src/components/Column.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { ComponentProps } from 'react';
+
+import Flex from './Flex';
+
+type ColumnProps = Omit<ComponentProps<typeof Flex>, 'direction'>;
+
+const Column: React.FC<ColumnProps> = (props) => {
+  return <Flex direction="column" {...props} />;
+};
+
+export default Column;

package/src/components/Flex.tsx

@@ -0,0 +1,71 @@
+import React from 'react';
+import type { ReactNode } from 'react';
+import type { ViewProps, ViewStyle, StyleProp } from 'react-native';
+
+import { View } from 'react-native';
+
+interface FlexProps extends ViewProps {
+  children?: ReactNode;
+
+  direction?: ViewStyle['flexDirection'];
+
+  flex?: ViewStyle['flex'];
+  flexGrow?: ViewStyle['flexGrow'];
+  flexShrink?: ViewStyle['flexShrink'];
+  flexWrap?: ViewStyle['flexWrap'];
+
+  gap?: ViewStyle['gap'];
+
+  justifyContent?: ViewStyle['justifyContent'];
+  alignItems?: ViewStyle['alignItems'];
+  alignSelf?: ViewStyle['alignSelf'];
+
+  style?: StyleProp<ViewStyle>;
+}
+
+const Flex: React.FC<FlexProps> = ({
+  children,
+
+  direction = 'column',
+
+  flex,
+  flexGrow,
+  flexShrink,
+  flexWrap,
+
+  gap,
+
+  justifyContent = 'flex-start',
+  alignItems = 'stretch',
+  alignSelf,
+
+  style,
+  ...rest
+}) => {
+  return (
+    <View
+      {...rest}
+      style={[
+        {
+          flexDirection: direction,
+
+          flex,
+          flexGrow,
+          flexShrink,
+          flexWrap,
+
+          gap,
+
+          justifyContent,
+          alignItems,
+          alignSelf,
+        },
+        style,
+      ]}
+    >
+      {children}
+    </View>
+  );
+};
+
+export default Flex;

package/src/components/Row.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { ComponentProps } from 'react';
+
+import Flex from './Flex';
+
+type RowProps = Omit<ComponentProps<typeof Flex>, 'direction'>;
+
+const Row: React.FC<RowProps> = (props) => {
+  return <Flex direction="row" {...props} />;
+};
+
+export default Row;

package/src/components/index.ts

@@ -0,0 +1,7 @@
+import Column from './Column';
+import Flex from './Flex';
+import Row from './Row';
+import TextView from './TextView';
+import ViewCard from './ViewCard';
+
+export { Column, Flex, Row, TextView, ViewCard };

package/src/index.tsx

@@ -1,7 +1,3 @@
-import { SjUiProvider } from './provider/UIProvider';
-import TextView from './components/TextView';
-import ViewCard from './components/ViewCard';
+export { SjUiProvider } from './provider/UIProvider';
 
-export { TextView };
-export { SjUiProvider };
-export { ViewCard };
+export { TextView, ViewCard, Row, Column, Flex } from './components';