related-ui-components 2.3.9 → 2.4.1

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.
Files changed (11) hide show
  1. package/lib/module/app.js +109 -106
  2. package/lib/module/app.js.map +1 -1
  3. package/lib/module/theme/ThemeContext.js +17 -38
  4. package/lib/module/theme/ThemeContext.js.map +1 -1
  5. package/lib/typescript/src/app.d.ts +1 -3
  6. package/lib/typescript/src/app.d.ts.map +1 -1
  7. package/lib/typescript/src/theme/ThemeContext.d.ts +7 -10
  8. package/lib/typescript/src/theme/ThemeContext.d.ts.map +1 -1
  9. package/package.json +1 -1
  10. package/src/app.tsx +105 -92
  11. package/src/theme/ThemeContext.tsx +30 -44
package/lib/module/app.js CHANGED
@@ -1,109 +1,112 @@
1
- "use strict";
1
+ // import React, { useState } from "react";
2
+ // import { SafeAreaView, StyleSheet, StatusBar } from "react-native";
3
+ // import CarouselCardStack from "./components/CarouselCardStack/CarouselCardStack"; // Adjust path as needed
4
+ // import { GestureHandlerRootView } from "react-native-gesture-handler";
5
+ // import { CarRentalForm, DateRangePicker, FlightForm, FlightSummary, HotelForm, HotelSummary, Filters} from "./components";
6
+ // import { RelatedProvider, useTheme } from "./theme";
7
+
8
+ // // Sample data - replace with your actual image URLs
9
+ // const DUMMY_DATA = [
10
+ // {
11
+ // id: "1",
12
+ // image:
13
+ // "https://images.pexels.com/photos/3354648/pexels-photo-3354648.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
14
+ // title: "Mountain Lake",
15
+ // },
16
+ // // {
17
+ // // id: "2",
18
+ // // image:
19
+ // // "https://images.pexels.com/photos/163273/sunrise-speedboat-ocean-water-163273.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
20
+ // // title: "Sunset Cruise",
21
+ // // },
22
+ // {
23
+ // id: "3",
24
+ // image:
25
+ // "https://images.pexels.com/photos/1430677/pexels-photo-1430677.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
26
+ // title: "Ocean Horizon",
27
+ // },
28
+ // {
29
+ // id: "4",
30
+ // image:
31
+ // "https://images.pexels.com/photos/2387793/pexels-photo-2387793.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
32
+ // title: "Forest Trail",
33
+ // },
34
+ // // {
35
+ // // id: "5",
36
+ // // image:
37
+ // // "https://images.pexels.com/photos/302804/pexels-photo-302804.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
38
+ // // title: "City Lights",
39
+ // // },
40
+ // ];
41
+
42
+ // const App = () => {
43
+ // const { theme } = useTheme();
2
44
 
3
- import React from "react";
4
- import { SafeAreaView, StyleSheet, StatusBar } from "react-native";
5
- // Adjust path as needed
6
- import { GestureHandlerRootView } from "react-native-gesture-handler";
7
- import { Filters } from "./components/index.js";
8
- import { RelatedProvider, useTheme } from "./theme/index.js";
45
+ // const [departureDate, setDepartureDate] = useState<string | undefined>(undefined);
46
+ // const [returnDate, setReturnDate] = useState<string | undefined>(undefined);
9
47
 
10
- // Sample data - replace with your actual image URLs
11
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
12
- const DUMMY_DATA = [{
13
- id: "1",
14
- image: "https://images.pexels.com/photos/3354648/pexels-photo-3354648.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
15
- title: "Mountain Lake"
16
- },
17
- // {
18
- // id: "2",
19
- // image:
20
- // "https://images.pexels.com/photos/163273/sunrise-speedboat-ocean-water-163273.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
21
- // title: "Sunset Cruise",
22
- // },
23
- {
24
- id: "3",
25
- image: "https://images.pexels.com/photos/1430677/pexels-photo-1430677.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
26
- title: "Ocean Horizon"
27
- }, {
28
- id: "4",
29
- image: "https://images.pexels.com/photos/2387793/pexels-photo-2387793.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
30
- title: "Forest Trail"
31
- }
32
- // {
33
- // id: "5",
34
- // image:
35
- // "https://images.pexels.com/photos/302804/pexels-photo-302804.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
36
- // title: "City Lights",
37
- // },
38
- ];
39
- const App = () => {
40
- const {
41
- theme
42
- } = useTheme();
43
- return /*#__PURE__*/_jsx(_Fragment, {
44
- children: /*#__PURE__*/_jsx(RelatedProvider, {
45
- children: /*#__PURE__*/_jsxs(GestureHandlerRootView, {
46
- style: {
47
- flex: 1
48
- },
49
- children: [/*#__PURE__*/_jsx(StatusBar, {
50
- barStyle: "light-content"
51
- }), /*#__PURE__*/_jsx(SafeAreaView, {
52
- style: styles.appContainer,
53
- children: /*#__PURE__*/_jsx(Filters, {
54
- bottomSheetBackgroundStyle: {
55
- borderTopRightRadius: 30,
56
- borderTopLeftRadius: 30,
57
- padding: 10,
58
- backgroundColor: "white"
59
- },
60
- containerStyle: {
61
- backgroundColor: "white",
62
- borderTopRightRadius: 60,
63
- borderTopLeftRadius: 60
64
- },
65
- resetTextStyle: {
66
- color: theme.primary
67
- },
68
- sectionTitleStyle: {
69
- color: "black"
70
- },
71
- titleStyle: {
72
- color: "black"
73
- },
74
- onActionButtonPress: result => {
75
- // setFiltersResult(result);
76
- },
77
- sortOptions: [{
78
- id: 1,
79
- name: "test",
80
- value: "test"
81
- }]
82
- // onClose={() => setDisplayFilters(false)}
83
- ,
84
- applyButtonStyle: {
85
- borderRadius: 8,
86
- backgroundColor: "black"
87
- },
88
- applyButtonTextStyle: {
89
- color: theme.secondary
90
- },
91
- headerStyle: {
92
- borderBottomWidth: 0
93
- }
94
- })
95
- })]
96
- })
97
- })
98
- });
99
- };
100
- const styles = StyleSheet.create({
101
- appContainer: {
102
- flex: 1,
103
- backgroundColor: "#212121",
104
- // Match carousel background or choose another
105
- justifyContent: "center" // Center the carousel vertically if it's the main content
106
- }
107
- });
108
- export default App;
48
+ // return (
49
+ // <>
50
+ // <RelatedProvider>
51
+ // <GestureHandlerRootView style={{ flex: 1 }}>
52
+ // <StatusBar barStyle="light-content" />
53
+ // <SafeAreaView style={styles.appContainer}>
54
+ // <DateRangePicker
55
+ // onDatesChange={(t) => {
56
+ // setDepartureDate(t.departure);
57
+ // setReturnDate(t.return);
58
+ // }}
59
+ // departureDate={departureDate}
60
+ // // departureDisplayValue={departureDate}
61
+ // returnDate={returnDate}
62
+ // // returnDisplayValue={returnDate}
63
+ // ></DateRangePicker>
64
+ // {/* <Filters
65
+ // bottomSheetBackgroundStyle={{
66
+ // borderTopRightRadius: 30,
67
+ // borderTopLeftRadius: 30,
68
+ // padding: 10,
69
+ // backgroundColor: "white",
70
+ // }}
71
+ // containerStyle={{
72
+ // backgroundColor: "white",
73
+ // borderTopRightRadius: 60,
74
+ // borderTopLeftRadius: 60,
75
+ // }}
76
+ // resetTextStyle={{ color: theme.primary }}
77
+ // sectionTitleStyle={{ color: "black" }}
78
+ // titleStyle={{ color: "black" }}
79
+ // onActionButtonPress={(result) => {
80
+ // // setFiltersResult(result);
81
+ // }}
82
+ // sortOptions={[{ id: 1, name: "test", value: "test" }]}
83
+ // // onClose={() => setDisplayFilters(false)}
84
+ // applyButtonStyle={{ borderRadius: 8, backgroundColor: "black" }}
85
+ // applyButtonTextStyle={{ color: theme.secondary }}
86
+ // headerStyle={{ borderBottomWidth: 0 }}
87
+ // ></Filters> */}
88
+ // {/* <FlightSummary></FlightSummary> */}
89
+ // {/* <FlightForm></FlightForm> */}
90
+ // {/* <HotelSummary></HotelSummary> */}
91
+ // {/* <HotelForm></HotelForm> */}
92
+ // {/* <DateRangePicker onDatesChange={()=>{}} labelContainerStyle={{backgroundColor:"red"}}></DateRangePicker> */}
93
+ // {/* <CarRentalForm onSelectionChange={console.log}></CarRentalForm> */}
94
+ // {/* <CarouselCardStack data={DUMMY_DATA} /> */}
95
+ // </SafeAreaView>
96
+ // </GestureHandlerRootView>
97
+ // </RelatedProvider>
98
+ // </>
99
+ // );
100
+ // };
101
+
102
+ // const styles = StyleSheet.create({
103
+ // appContainer: {
104
+ // flex: 1,
105
+ // backgroundColor: "#212121", // Match carousel background or choose another
106
+ // justifyContent: "center", // Center the carousel vertically if it's the main content
107
+ // },
108
+ // });
109
+
110
+ // export default App;
111
+ "use strict";
109
112
  //# sourceMappingURL=app.js.map
package/lib/module/app.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","SafeAreaView","StyleSheet","StatusBar","GestureHandlerRootView","Filters","RelatedProvider","useTheme","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","DUMMY_DATA","id","image","title","App","theme","children","style","flex","barStyle","styles","appContainer","bottomSheetBackgroundStyle","borderTopRightRadius","borderTopLeftRadius","padding","backgroundColor","containerStyle","resetTextStyle","color","primary","sectionTitleStyle","titleStyle","onActionButtonPress","result","sortOptions","name","value","applyButtonStyle","borderRadius","applyButtonTextStyle","secondary","headerStyle","borderBottomWidth","create","justifyContent"],"sourceRoot":"..\\..\\src","sources":["app.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY,EAAEC,UAAU,EAAEC,SAAS,QAAQ,cAAc;AACgB;AAClF,SAASC,sBAAsB,QAAQ,8BAA8B;AACrE,SAA6FC,OAAO,QAAO,uBAAc;AACzH,SAASC,eAAe,EAAEC,QAAQ,QAAQ,kBAAS;;AAEnD;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA,EAAAC,QAAA,IAAAC,SAAA;AACA,MAAMC,UAAU,GAAG,CACjB;EACEC,EAAE,EAAE,GAAG;EACPC,KAAK,EACH,iHAAiH;EACnHC,KAAK,EAAE;AACT,CAAC;AACD;AACA;AACA;AACA;AACA;AACA;AACA;EACEF,EAAE,EAAE,GAAG;EACPC,KAAK,EACH,iHAAiH;EACnHC,KAAK,EAAE;AACT,CAAC,EACD;EACEF,EAAE,EAAE,GAAG;EACPC,KAAK,EACH,iHAAiH;EACnHC,KAAK,EAAE;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AAAA,CACD;AAED,MAAMC,GAAG,GAAGA,CAAA,KAAM;EAChB,MAAM;IAAEC;EAAM,CAAC,GAAGZ,QAAQ,CAAC,CAAC;EAE5B,oBACEE,IAAA,CAAAI,SAAA;IAAAO,QAAA,eACEX,IAAA,CAACH,eAAe;MAAAc,QAAA,eACdT,KAAA,CAACP,sBAAsB;QAACiB,KAAK,EAAE;UAAEC,IAAI,EAAE;QAAE,CAAE;QAAAF,QAAA,gBACzCX,IAAA,CAACN,SAAS;UAACoB,QAAQ,EAAC;QAAe,CAAE,CAAC,eACtCd,IAAA,CAACR,YAAY;UAACoB,KAAK,EAAEG,MAAM,CAACC,YAAa;UAAAL,QAAA,eACvCX,IAAA,CAACJ,OAAO;YACNqB,0BAA0B,EAAE;cAC1BC,oBAAoB,EAAE,EAAE;cACxBC,mBAAmB,EAAE,EAAE;cACvBC,OAAO,EAAE,EAAE;cACXC,eAAe,EAAE;YACnB,CAAE;YACFC,cAAc,EAAE;cACdD,eAAe,EAAE,OAAO;cACxBH,oBAAoB,EAAE,EAAE;cACxBC,mBAAmB,EAAE;YACvB,CAAE;YACFI,cAAc,EAAE;cAAEC,KAAK,EAAEd,KAAK,CAACe;YAAQ,CAAE;YACzCC,iBAAiB,EAAE;cAAEF,KAAK,EAAE;YAAQ,CAAE;YACtCG,UAAU,EAAE;cAAEH,KAAK,EAAE;YAAQ,CAAE;YAC/BI,mBAAmB,EAAGC,MAAM,IAAK;cAC/B;YAAA,CACA;YACFC,WAAW,EAAE,CAAC;cAAExB,EAAE,EAAE,CAAC;cAAEyB,IAAI,EAAE,MAAM;cAAEC,KAAK,EAAE;YAAO,CAAC;YACpD;YAAA;YACAC,gBAAgB,EAAE;cAAEC,YAAY,EAAE,CAAC;cAAEb,eAAe,EAAE;YAAQ,CAAE;YAChEc,oBAAoB,EAAE;cAAEX,KAAK,EAAEd,KAAK,CAAC0B;YAAU,CAAE;YACjDC,WAAW,EAAE;cAAEC,iBAAiB,EAAE;YAAE;UAAE,CAC9B;QAAC,CAQC,CAAC;MAAA,CACO;IAAC,CACV;EAAC,CAClB,CAAC;AAEP,CAAC;AAED,MAAMvB,MAAM,GAAGtB,UAAU,CAAC8C,MAAM,CAAC;EAC/BvB,YAAY,EAAE;IACZH,IAAI,EAAE,CAAC;IACPQ,eAAe,EAAE,SAAS;IAAE;IAC5BmB,cAAc,EAAE,QAAQ,CAAE;EAC5B;AACF,CAAC,CAAC;AAEF,eAAe/B,GAAG","ignoreList":[]}
1
+ {"version":3,"names":[],"sourceRoot":"..\\..\\src","sources":["app.tsx"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAAA","ignoreList":[]}
package/lib/module/theme/ThemeContext.js CHANGED
@@ -1,53 +1,32 @@
1
1
  "use strict";
2
2
 
3
- import React, { createContext, useContext, useState } from "react";
4
- import { I18nManager, useColorScheme } from "react-native";
5
- import { lightTheme, darkTheme } from "./Colors.js";
3
+ import React, { createContext, useContext, useState, useMemo, useEffect } from "react";
4
+ import { I18nManager } from "react-native";
6
5
  import { jsx as _jsx } from "react/jsx-runtime";
7
6
  export const ThemeContext = /*#__PURE__*/createContext({
8
- theme: lightTheme,
7
+ theme: {},
9
8
  isRTL: I18nManager.isRTL,
10
- isDark: false,
11
- toggleTheme: () => {}
9
+ setTheme: () => {
10
+ console.warn("setTheme was called without a ThemeProvider");
11
+ }
12
12
  });
13
-
14
- // Define props for ThemeProvider
15
-
16
- // Provider component
17
- export const RelatedProvider = ({
13
+ export const ThemeProvider = ({
18
14
  children,
19
- customLightTheme,
20
- customDarkTheme,
21
- dark
22
- // forceRTL,
15
+ theme: initialTheme
23
16
  }) => {
24
- const [isDark, setIsDark] = useState(dark || useColorScheme() === "dark");
25
-
26
- // Allow custom themes to override defaults
27
- const [themes, setThemes] = useState({
28
- light: {
29
- ...lightTheme,
30
- ...customLightTheme
31
- },
32
- dark: {
33
- ...darkTheme,
34
- ...customDarkTheme
35
- }
36
- });
37
- const toggleTheme = () => setIsDark(prev => !prev);
38
- const currentTheme = isDark ? themes.dark : themes.light;
39
- const contextValue = {
40
- theme: currentTheme,
41
- isRTL: I18nManager.isRTL,
42
- isDark,
43
- toggleTheme
44
- };
17
+ const [theme, setTheme] = useState(initialTheme);
18
+ useEffect(() => {
19
+ setTheme(initialTheme);
20
+ }, [initialTheme]);
21
+ const contextValue = useMemo(() => ({
22
+ theme,
23
+ setTheme,
24
+ isRTL: I18nManager.isRTL
25
+ }), [theme]);
45
26
  return /*#__PURE__*/_jsx(ThemeContext.Provider, {
46
27
  value: contextValue,
47
28
  children: children
48
29
  });
49
30
  };
50
-
51
- // Hook for easy access
52
31
  export const useTheme = () => useContext(ThemeContext);
53
32
  //# sourceMappingURL=ThemeContext.js.map
package/lib/module/theme/ThemeContext.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","createContext","useContext","useState","I18nManager","useColorScheme","lightTheme","darkTheme","jsx","_jsx","ThemeContext","theme","isRTL","isDark","toggleTheme","RelatedProvider","children","customLightTheme","customDarkTheme","dark","setIsDark","themes","setThemes","light","prev","currentTheme","contextValue","Provider","value","useTheme"],"sourceRoot":"..\\..\\..\\src","sources":["theme/ThemeContext.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IACVC,aAAa,EACbC,UAAU,EACVC,QAAQ,QAGH,OAAO;AAEd,SAASC,WAAW,EAAEC,cAAc,QAAQ,cAAc;AAC1D,SAASC,UAAU,EAAaC,SAAS,QAAQ,aAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQ5D,OAAO,MAAMC,YAAY,gBAAGT,aAAa,CAAiB;EACxDU,KAAK,EAAEL,UAAU;EACjBM,KAAK,EAAER,WAAW,CAACQ,KAAK;EACxBC,MAAM,EAAE,KAAK;EACbC,WAAW,EAAEA,CAAA,KAAM,CAAC;AACtB,CAAC,CAAC;;AAEF;;AASA;AACA,OAAO,MAAMC,eAA+C,GAAGA,CAAC;EAC9DC,QAAQ;EACRC,gBAAgB;EAChBC,eAAe;EACfC;EACA;AACF,CAAC,KAAK;EACJ,MAAM,CAACN,MAAM,EAAEO,SAAS,CAAC,GAAGjB,QAAQ,CAClCgB,IAAI,IAAId,cAAc,CAAC,CAAC,KAAK,MAC/B,CAAC;;EAED;EACA,MAAM,CAACgB,MAAM,EAAEC,SAAS,CAAC,GAAGnB,QAAQ,CAAC;IACnCoB,KAAK,EAAE;MAAE,GAAGjB,UAAU;MAAE,GAAGW;IAAiB,CAAc;IAC1DE,IAAI,EAAE;MAAE,GAAGZ,SAAS;MAAE,GAAGW;IAAgB;EAC3C,CAAC,CAAC;EAEF,MAAMJ,WAAW,GAAGA,CAAA,KAAMM,SAAS,CAAEI,IAAI,IAAK,CAACA,IAAI,CAAC;EAEpD,MAAMC,YAAY,GAAGZ,MAAM,GAAGQ,MAAM,CAACF,IAAI,GAAGE,MAAM,CAACE,KAAK;EAExD,MAAMG,YAA4B,GAAG;IACnCf,KAAK,EAAEc,YAAY;IACnBb,KAAK,EAAER,WAAW,CAACQ,KAAK;IACxBC,MAAM;IACNC;EACF,CAAC;EAED,oBACEL,IAAA,CAACC,YAAY,CAACiB,QAAQ;IAACC,KAAK,EAAEF,YAAa;IAAAV,QAAA,EACxCA;EAAQ,CACY,CAAC;AAE5B,CAAC;;AAED;AACA,OAAO,MAAMa,QAAQ,GAAGA,CAAA,KAAM3B,UAAU,CAACQ,YAAY,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["React","createContext","useContext","useState","useMemo","useEffect","I18nManager","jsx","_jsx","ThemeContext","theme","isRTL","setTheme","console","warn","ThemeProvider","children","initialTheme","contextValue","Provider","value","useTheme"],"sourceRoot":"..\\..\\..\\src","sources":["theme/ThemeContext.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IACVC,aAAa,EACbC,UAAU,EAEVC,QAAQ,EACRC,OAAO,EACPC,SAAS,QACJ,OAAO;AACd,SAASC,WAAW,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAS3C,OAAO,MAAMC,YAAY,gBAAGR,aAAa,CAAoB;EAC3DS,KAAK,EAAE,CAAC,CAAc;EACtBC,KAAK,EAAEL,WAAW,CAACK,KAAK;EACxBC,QAAQ,EAAEA,CAAA,KAAM;IACdC,OAAO,CAACC,IAAI,CAAC,6CAA6C,CAAC;EAC7D;AACF,CAAC,CAAC;AAOF,OAAO,MAAMC,aAA2C,GAAGA,CAAC;EAC1DC,QAAQ;EACRN,KAAK,EAAEO;AACT,CAAC,KAAK;EACJ,MAAM,CAACP,KAAK,EAAEE,QAAQ,CAAC,GAAGT,QAAQ,CAAYc,YAAY,CAAC;EAE3DZ,SAAS,CAAC,MAAM;IACdO,QAAQ,CAACK,YAAY,CAAC;EACxB,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;EAElB,MAAMC,YAAY,GAAGd,OAAO,CAC1B,OAAO;IACLM,KAAK;IACLE,QAAQ;IACRD,KAAK,EAAEL,WAAW,CAACK;EACrB,CAAC,CAAC,EACF,CAACD,KAAK,CACR,CAAC;EAED,oBACEF,IAAA,CAACC,YAAY,CAACU,QAAQ;IAACC,KAAK,EAAEF,YAAa;IAAAF,QAAA,EACxCA;EAAQ,CACY,CAAC;AAE5B,CAAC;AAED,OAAO,MAAMK,QAAQ,GAAGA,CAAA,KAAMnB,UAAU,CAACO,YAAY,CAAC","ignoreList":[]}
package/lib/typescript/src/app.d.ts CHANGED
@@ -1,4 +1,2 @@
1
- import React from "react";
2
- declare const App: () => React.JSX.Element;
3
- export default App;
1
+ export {};
4
2
  //# sourceMappingURL=app.d.ts.map
package/lib/typescript/src/app.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../../src/app.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAyC1B,QAAA,MAAM,GAAG,yBA6CR,CAAC;AAUF,eAAe,GAAG,CAAC"}
1
+ {"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../../src/app.tsx"],"names":[],"mappings":""}
package/lib/typescript/src/theme/ThemeContext.d.ts CHANGED
@@ -1,19 +1,16 @@
1
1
  import React, { ReactNode } from "react";
2
2
  import { ThemeType } from "./Colors";
3
- interface RelatedContext {
3
+ interface ThemeContextValue {
4
4
  theme: ThemeType;
5
5
  isRTL: boolean;
6
- isDark: boolean;
7
- toggleTheme: () => void;
6
+ setTheme: (theme: ThemeType) => void;
8
7
  }
9
- export declare const ThemeContext: React.Context<RelatedContext>;
10
- interface RelatedProviderProps {
8
+ export declare const ThemeContext: React.Context<ThemeContextValue>;
9
+ interface ThemeProviderProps {
11
10
  children: ReactNode;
12
- customLightTheme?: Partial<ThemeType>;
13
- customDarkTheme?: Partial<ThemeType>;
14
- dark?: boolean;
11
+ theme: ThemeType;
15
12
  }
16
- export declare const RelatedProvider: React.FC<RelatedProviderProps>;
17
- export declare const useTheme: () => RelatedContext;
13
+ export declare const ThemeProvider: React.FC<ThemeProviderProps>;
14
+ export declare const useTheme: () => ThemeContextValue;
18
15
  export {};
19
16
  //# sourceMappingURL=ThemeContext.d.ts.map
package/lib/typescript/src/theme/ThemeContext.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../../src/theme/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAKZ,SAAS,EACV,MAAM,OAAO,CAAC;AAGf,OAAO,EAAc,SAAS,EAAa,MAAM,UAAU,CAAC;AAE5D,UAAU,cAAc;IACtB,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AACD,eAAO,MAAM,YAAY,+BAKvB,CAAC;AAGH,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACtC,eAAe,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,OAAO,CAAC;CAEhB;AAGD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAiC1D,CAAC;AAGF,eAAO,MAAM,QAAQ,sBAAiC,CAAC"}
1
+ {"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../../src/theme/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAGZ,SAAS,EAIV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,UAAU,iBAAiB;IACzB,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACtC;AAED,eAAO,MAAM,YAAY,kCAMvB,CAAC;AAEH,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwBtD,CAAC;AAEF,eAAO,MAAM,QAAQ,yBAAiC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "related-ui-components",
3
- "version": "2.3.9",
3
+ "version": "2.4.1",
4
4
  "main": "./src/index.ts",
5
5
  "scripts": {
6
6
  "start": "expo start",
package/src/app.tsx CHANGED
@@ -1,97 +1,110 @@
1
- import React from "react";
2
- import { SafeAreaView, StyleSheet, StatusBar } from "react-native";
3
- import CarouselCardStack from "./components/CarouselCardStack/CarouselCardStack"; // Adjust path as needed
4
- import { GestureHandlerRootView } from "react-native-gesture-handler";
5
- import { CarRentalForm, DateRangePicker, FlightForm, FlightSummary, HotelForm, HotelSummary, Filters} from "./components";
6
- import { RelatedProvider, useTheme } from "./theme";
1
+ // import React, { useState } from "react";
2
+ // import { SafeAreaView, StyleSheet, StatusBar } from "react-native";
3
+ // import CarouselCardStack from "./components/CarouselCardStack/CarouselCardStack"; // Adjust path as needed
4
+ // import { GestureHandlerRootView } from "react-native-gesture-handler";
5
+ // import { CarRentalForm, DateRangePicker, FlightForm, FlightSummary, HotelForm, HotelSummary, Filters} from "./components";
6
+ // import { RelatedProvider, useTheme } from "./theme";
7
7
 
8
- // Sample data - replace with your actual image URLs
9
- const DUMMY_DATA = [
10
- {
11
- id: "1",
12
- image:
13
- "https://images.pexels.com/photos/3354648/pexels-photo-3354648.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
14
- title: "Mountain Lake",
15
- },
16
- // {
17
- // id: "2",
18
- // image:
19
- // "https://images.pexels.com/photos/163273/sunrise-speedboat-ocean-water-163273.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
20
- // title: "Sunset Cruise",
21
- // },
22
- {
23
- id: "3",
24
- image:
25
- "https://images.pexels.com/photos/1430677/pexels-photo-1430677.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
26
- title: "Ocean Horizon",
27
- },
28
- {
29
- id: "4",
30
- image:
31
- "https://images.pexels.com/photos/2387793/pexels-photo-2387793.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
32
- title: "Forest Trail",
33
- },
34
- // {
35
- // id: "5",
36
- // image:
37
- // "https://images.pexels.com/photos/302804/pexels-photo-302804.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
38
- // title: "City Lights",
39
- // },
40
- ];
8
+ // // Sample data - replace with your actual image URLs
9
+ // const DUMMY_DATA = [
10
+ // {
11
+ // id: "1",
12
+ // image:
13
+ // "https://images.pexels.com/photos/3354648/pexels-photo-3354648.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
14
+ // title: "Mountain Lake",
15
+ // },
16
+ // // {
17
+ // // id: "2",
18
+ // // image:
19
+ // // "https://images.pexels.com/photos/163273/sunrise-speedboat-ocean-water-163273.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
20
+ // // title: "Sunset Cruise",
21
+ // // },
22
+ // {
23
+ // id: "3",
24
+ // image:
25
+ // "https://images.pexels.com/photos/1430677/pexels-photo-1430677.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
26
+ // title: "Ocean Horizon",
27
+ // },
28
+ // {
29
+ // id: "4",
30
+ // image:
31
+ // "https://images.pexels.com/photos/2387793/pexels-photo-2387793.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
32
+ // title: "Forest Trail",
33
+ // },
34
+ // // {
35
+ // // id: "5",
36
+ // // image:
37
+ // // "https://images.pexels.com/photos/302804/pexels-photo-302804.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
38
+ // // title: "City Lights",
39
+ // // },
40
+ // ];
41
41
 
42
- const App = () => {
43
- const { theme } = useTheme();
42
+ // const App = () => {
43
+ // const { theme } = useTheme();
44
44
 
45
- return (
46
- <>
47
- <RelatedProvider>
48
- <GestureHandlerRootView style={{ flex: 1 }}>
49
- <StatusBar barStyle="light-content" />
50
- <SafeAreaView style={styles.appContainer}>
51
- <Filters
52
- bottomSheetBackgroundStyle={{
53
- borderTopRightRadius: 30,
54
- borderTopLeftRadius: 30,
55
- padding: 10,
56
- backgroundColor: "white",
57
- }}
58
- containerStyle={{
59
- backgroundColor: "white",
60
- borderTopRightRadius: 60,
61
- borderTopLeftRadius: 60,
62
- }}
63
- resetTextStyle={{ color: theme.primary }}
64
- sectionTitleStyle={{ color: "black" }}
65
- titleStyle={{ color: "black" }}
66
- onActionButtonPress={(result) => {
67
- // setFiltersResult(result);
68
- }}
69
- sortOptions={[{ id: 1, name: "test", value: "test" }]}
70
- // onClose={() => setDisplayFilters(false)}
71
- applyButtonStyle={{ borderRadius: 8, backgroundColor: "black" }}
72
- applyButtonTextStyle={{ color: theme.secondary }}
73
- headerStyle={{ borderBottomWidth: 0 }}
74
- ></Filters>
75
- {/* <FlightSummary></FlightSummary> */}
76
- {/* <FlightForm></FlightForm> */}
77
- {/* <HotelSummary></HotelSummary> */}
78
- {/* <HotelForm></HotelForm> */}
79
- {/* <DateRangePicker onDatesChange={()=>{}} labelContainerStyle={{backgroundColor:"red"}}></DateRangePicker> */}
80
- {/* <CarRentalForm onSelectionChange={console.log}></CarRentalForm> */}
81
- {/* <CarouselCardStack data={DUMMY_DATA} /> */}
82
- </SafeAreaView>
83
- </GestureHandlerRootView>
84
- </RelatedProvider>
85
- </>
86
- );
87
- };
45
+ // const [departureDate, setDepartureDate] = useState<string | undefined>(undefined);
46
+ // const [returnDate, setReturnDate] = useState<string | undefined>(undefined);
88
47
 
89
- const styles = StyleSheet.create({
90
- appContainer: {
91
- flex: 1,
92
- backgroundColor: "#212121", // Match carousel background or choose another
93
- justifyContent: "center", // Center the carousel vertically if it's the main content
94
- },
95
- });
48
+ // return (
49
+ // <>
50
+ // <RelatedProvider>
51
+ // <GestureHandlerRootView style={{ flex: 1 }}>
52
+ // <StatusBar barStyle="light-content" />
53
+ // <SafeAreaView style={styles.appContainer}>
54
+ // <DateRangePicker
55
+ // onDatesChange={(t) => {
56
+ // setDepartureDate(t.departure);
57
+ // setReturnDate(t.return);
58
+ // }}
59
+ // departureDate={departureDate}
60
+ // // departureDisplayValue={departureDate}
61
+ // returnDate={returnDate}
62
+ // // returnDisplayValue={returnDate}
63
+ // ></DateRangePicker>
64
+ // {/* <Filters
65
+ // bottomSheetBackgroundStyle={{
66
+ // borderTopRightRadius: 30,
67
+ // borderTopLeftRadius: 30,
68
+ // padding: 10,
69
+ // backgroundColor: "white",
70
+ // }}
71
+ // containerStyle={{
72
+ // backgroundColor: "white",
73
+ // borderTopRightRadius: 60,
74
+ // borderTopLeftRadius: 60,
75
+ // }}
76
+ // resetTextStyle={{ color: theme.primary }}
77
+ // sectionTitleStyle={{ color: "black" }}
78
+ // titleStyle={{ color: "black" }}
79
+ // onActionButtonPress={(result) => {
80
+ // // setFiltersResult(result);
81
+ // }}
82
+ // sortOptions={[{ id: 1, name: "test", value: "test" }]}
83
+ // // onClose={() => setDisplayFilters(false)}
84
+ // applyButtonStyle={{ borderRadius: 8, backgroundColor: "black" }}
85
+ // applyButtonTextStyle={{ color: theme.secondary }}
86
+ // headerStyle={{ borderBottomWidth: 0 }}
87
+ // ></Filters> */}
88
+ // {/* <FlightSummary></FlightSummary> */}
89
+ // {/* <FlightForm></FlightForm> */}
90
+ // {/* <HotelSummary></HotelSummary> */}
91
+ // {/* <HotelForm></HotelForm> */}
92
+ // {/* <DateRangePicker onDatesChange={()=>{}} labelContainerStyle={{backgroundColor:"red"}}></DateRangePicker> */}
93
+ // {/* <CarRentalForm onSelectionChange={console.log}></CarRentalForm> */}
94
+ // {/* <CarouselCardStack data={DUMMY_DATA} /> */}
95
+ // </SafeAreaView>
96
+ // </GestureHandlerRootView>
97
+ // </RelatedProvider>
98
+ // </>
99
+ // );
100
+ // };
96
101
 
97
- export default App;
102
+ // const styles = StyleSheet.create({
103
+ // appContainer: {
104
+ // flex: 1,
105
+ // backgroundColor: "#212121", // Match carousel background or choose another
106
+ // justifyContent: "center", // Center the carousel vertically if it's the main content
107
+ // },
108
+ // });
109
+
110
+ // export default App;
package/src/theme/ThemeContext.tsx CHANGED
@@ -1,65 +1,52 @@
1
1
  import React, {
2
2
  createContext,
3
3
  useContext,
4
+ ReactNode,
4
5
  useState,
6
+ useMemo,
5
7
  useEffect,
6
- ReactNode,
7
8
  } from "react";
9
+ import { I18nManager } from "react-native";
10
+ import { ThemeType } from "./Colors";
8
11
 
9
- import { I18nManager, useColorScheme } from "react-native";
10
- import { lightTheme, ThemeType, darkTheme } from "./Colors";
11
-
12
- interface RelatedContext {
12
+ interface ThemeContextValue {
13
13
  theme: ThemeType;
14
14
  isRTL: boolean;
15
- isDark: boolean,
16
- toggleTheme: () => void;
15
+ setTheme: (theme: ThemeType) => void;
17
16
  }
18
- export const ThemeContext = createContext<RelatedContext>({
19
- theme: lightTheme,
17
+
18
+ export const ThemeContext = createContext<ThemeContextValue>({
19
+ theme: {} as ThemeType,
20
20
  isRTL: I18nManager.isRTL,
21
- isDark: false,
22
- toggleTheme: () => {}
21
+ setTheme: () => {
22
+ console.warn("setTheme was called without a ThemeProvider");
23
+ },
23
24
  });
24
25
 
25
- // Define props for ThemeProvider
26
- interface RelatedProviderProps {
26
+ interface ThemeProviderProps {
27
27
  children: ReactNode;
28
- customLightTheme?: Partial<ThemeType>;
29
- customDarkTheme?: Partial<ThemeType>;
30
- dark?: boolean;
31
- // forceRTL?: boolean;
28
+ theme: ThemeType;
32
29
  }
33
30
 
34
- // Provider component
35
- export const RelatedProvider: React.FC<RelatedProviderProps> = ({
31
+ export const ThemeProvider: React.FC<ThemeProviderProps> = ({
36
32
  children,
37
- customLightTheme,
38
- customDarkTheme,
39
- dark,
40
- // forceRTL,
33
+ theme: initialTheme,
41
34
  }) => {
42
- const [isDark, setIsDark] = useState<boolean>(
43
- dark || useColorScheme() === "dark"
35
+ const [theme, setTheme] = useState<ThemeType>(initialTheme);
36
+
37
+ useEffect(() => {
38
+ setTheme(initialTheme);
39
+ }, [initialTheme]);
40
+
41
+ const contextValue = useMemo(
42
+ () => ({
43
+ theme,
44
+ setTheme,
45
+ isRTL: I18nManager.isRTL,
46
+ }),
47
+ [theme],
44
48
  );
45
49
 
46
- // Allow custom themes to override defaults
47
- const [themes, setThemes] = useState({
48
- light: { ...lightTheme, ...customLightTheme } as ThemeType,
49
- dark: { ...darkTheme, ...customDarkTheme } as ThemeType,
50
- });
51
-
52
- const toggleTheme = () => setIsDark((prev) => !prev);
53
-
54
- const currentTheme = isDark ? themes.dark : themes.light;
55
-
56
- const contextValue: RelatedContext = {
57
- theme: currentTheme,
58
- isRTL: I18nManager.isRTL,
59
- isDark,
60
- toggleTheme
61
- };
62
-
63
50
  return (
64
51
  <ThemeContext.Provider value={contextValue}>
65
52
  {children}
@@ -67,5 +54,4 @@ export const RelatedProvider: React.FC<RelatedProviderProps> = ({
67
54
  );
68
55
  };
69
56
 
70
- // Hook for easy access
71
- export const useTheme = () => useContext(ThemeContext);
57
+ export const useTheme = () => useContext(ThemeContext);