@woopze/react-native-sdk 0.1.0
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/LICENSE +21 -0
- package/README.md +66 -0
- package/dist/assets/cam-icon.d.ts +2 -0
- package/dist/assets/cam-icon.js +7 -0
- package/dist/assets/cam-icon.js.map +1 -0
- package/dist/assets/cam-icon.png +0 -0
- package/dist/assets/chevron-icon.d.ts +2 -0
- package/dist/assets/chevron-icon.js +7 -0
- package/dist/assets/chevron-icon.js.map +1 -0
- package/dist/assets/chevron-icon.png +0 -0
- package/dist/assets/close-icon.d.ts +2 -0
- package/dist/assets/close-icon.js +7 -0
- package/dist/assets/close-icon.js.map +1 -0
- package/dist/assets/close-icon.png +0 -0
- package/dist/assets/filter-icon.d.ts +2 -0
- package/dist/assets/filter-icon.js +7 -0
- package/dist/assets/filter-icon.js.map +1 -0
- package/dist/assets/filter-icon.png +0 -0
- package/dist/assets/search-icon.d.ts +2 -0
- package/dist/assets/search-icon.js +7 -0
- package/dist/assets/search-icon.js.map +1 -0
- package/dist/assets/search-icon.png +0 -0
- package/dist/cam-icon-II34AEJC.png +0 -0
- package/dist/chevron-icon-7YWXX66A.png +0 -0
- package/dist/close-icon-VE65QPHD.png +0 -0
- package/dist/comments/AllCommentsModal.d.ts +11 -0
- package/dist/comments/AllCommentsModal.js +84 -0
- package/dist/comments/AllCommentsModal.js.map +1 -0
- package/dist/comments/index.d.ts +9 -0
- package/dist/comments/index.js +67 -0
- package/dist/comments/index.js.map +1 -0
- package/dist/components/ProductCard.d.ts +16 -0
- package/dist/components/ProductCard.js +123 -0
- package/dist/components/ProductCard.js.map +1 -0
- package/dist/components/SearchInput.d.ts +16 -0
- package/dist/components/SearchInput.js +186 -0
- package/dist/components/SearchInput.js.map +1 -0
- package/dist/constants.d.ts +7 -0
- package/dist/constants.js +31 -0
- package/dist/constants.js.map +1 -0
- package/dist/filter-icon-TNVJNKA2.png +0 -0
- package/dist/index.d.ts +18 -0
- package/dist/index.js +22 -0
- package/dist/index.js.map +1 -0
- package/dist/search/FilterModal.d.ts +28 -0
- package/dist/search/FilterModal.js +444 -0
- package/dist/search/FilterModal.js.map +1 -0
- package/dist/search/index.d.ts +39 -0
- package/dist/search/index.js +652 -0
- package/dist/search/index.js.map +1 -0
- package/dist/search-icon-6SVD6L4Q.png +0 -0
- package/dist/tracking.d.ts +11 -0
- package/dist/tracking.js +79 -0
- package/dist/tracking.js.map +1 -0
- package/dist/types.d.ts +14 -0
- package/dist/types.js +4 -0
- package/dist/types.js.map +1 -0
- package/package.json +47 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Woopze
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
# @woopze/react-native-sdk
|
|
2
|
+
|
|
3
|
+
React Native SDK package for Woopze projects.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @woopze/react-native-sdk
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
```ts
|
|
14
|
+
import Woopze from '@woopze/react-native-sdk';
|
|
15
|
+
|
|
16
|
+
// Optional: configure globally for tracking calls outside Search
|
|
17
|
+
Woopze.configure({
|
|
18
|
+
apiKey: 'YOUR_API_KEY',
|
|
19
|
+
uid: 'DEVICE_ID_OR_MEMBER_ID',
|
|
20
|
+
originDomain: 'www.setrms.com',
|
|
21
|
+
});
|
|
22
|
+
|
|
23
|
+
// Search component (required: apiKey, uid, originDomain)
|
|
24
|
+
<Woopze.Search
|
|
25
|
+
apiKey="YOUR_API_KEY"
|
|
26
|
+
uid="DEVICE_ID_OR_MEMBER_ID"
|
|
27
|
+
originDomain="www.setrms.com"
|
|
28
|
+
onProductPressed={({id, url}) => {
|
|
29
|
+
console.log(id, url);
|
|
30
|
+
}}
|
|
31
|
+
hideHeaderCloseIcon
|
|
32
|
+
hideRecentSearchCloseIcon
|
|
33
|
+
theme={{
|
|
34
|
+
backgroundColor: '#fff',
|
|
35
|
+
inputBackgroundColor: '#f4f4f4',
|
|
36
|
+
chipBackgroundColor: '#ececec',
|
|
37
|
+
buttonTextColor: '#4f4f4f',
|
|
38
|
+
accentColor: '#111',
|
|
39
|
+
iconTintColor: '#111',
|
|
40
|
+
}}
|
|
41
|
+
/>;
|
|
42
|
+
|
|
43
|
+
// Event tracking
|
|
44
|
+
await Woopze.track(
|
|
45
|
+
'view',
|
|
46
|
+
{
|
|
47
|
+
category_id: 54024,
|
|
48
|
+
category_name: 'Kaban & Manto',
|
|
49
|
+
},
|
|
50
|
+
'category',
|
|
51
|
+
);
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
## Development
|
|
55
|
+
|
|
56
|
+
```bash
|
|
57
|
+
npm install
|
|
58
|
+
npm run build
|
|
59
|
+
npm run dev
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
## Publish
|
|
63
|
+
|
|
64
|
+
```bash
|
|
65
|
+
npm publish --access public
|
|
66
|
+
```
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"cam-icon.js"}
|
|
Binary file
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"chevron-icon.js"}
|
|
Binary file
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"close-icon.js"}
|
|
Binary file
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"filter-icon.js"}
|
|
Binary file
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"search-icon.js"}
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
|
|
3
|
+
type Props = {
|
|
4
|
+
visible: boolean;
|
|
5
|
+
onClose: () => void;
|
|
6
|
+
apiKey: string;
|
|
7
|
+
modelCode: string;
|
|
8
|
+
};
|
|
9
|
+
declare const AllCommentsModal: ({ visible, onClose, apiKey, modelCode }: Props) => React__default.JSX.Element;
|
|
10
|
+
|
|
11
|
+
export { AllCommentsModal as default };
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var reactNative = require('react-native');
|
|
4
|
+
var WebView = require('react-native-webview');
|
|
5
|
+
var React = require('react');
|
|
6
|
+
|
|
7
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
|
+
|
|
9
|
+
var WebView__default = /*#__PURE__*/_interopDefault(WebView);
|
|
10
|
+
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
11
|
+
|
|
12
|
+
const AllCommentsModal = ({ visible, onClose, apiKey, modelCode }) => {
|
|
13
|
+
return /* @__PURE__ */ React__default.default.createElement(reactNative.Modal, { presentationStyle: "fullScreen", visible }, /* @__PURE__ */ React__default.default.createElement(reactNative.SafeAreaView, { style: { flex: 1 } }, /* @__PURE__ */ React__default.default.createElement(
|
|
14
|
+
reactNative.View,
|
|
15
|
+
{
|
|
16
|
+
style: {
|
|
17
|
+
paddingHorizontal: 16,
|
|
18
|
+
paddingVertical: 10,
|
|
19
|
+
paddingBottom: 16,
|
|
20
|
+
borderBottomWidth: 1,
|
|
21
|
+
borderBottomColor: "#efefef"
|
|
22
|
+
}
|
|
23
|
+
},
|
|
24
|
+
/* @__PURE__ */ React__default.default.createElement(
|
|
25
|
+
reactNative.TouchableOpacity,
|
|
26
|
+
{
|
|
27
|
+
activeOpacity: 0.8,
|
|
28
|
+
onPress: onClose,
|
|
29
|
+
style: {
|
|
30
|
+
alignItems: "center",
|
|
31
|
+
gap: 12,
|
|
32
|
+
flexDirection: "row"
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
/* @__PURE__ */ React__default.default.createElement(
|
|
36
|
+
reactNative.Image,
|
|
37
|
+
{
|
|
38
|
+
source: require("../assets/chevron-icon.png"),
|
|
39
|
+
style: {
|
|
40
|
+
transform: [{ rotateZ: "90deg" }],
|
|
41
|
+
height: 12,
|
|
42
|
+
width: 12
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
),
|
|
46
|
+
/* @__PURE__ */ React__default.default.createElement(reactNative.Text, { style: { fontSize: 14 } }, "Geri D\xF6n")
|
|
47
|
+
)
|
|
48
|
+
), /* @__PURE__ */ React__default.default.createElement(
|
|
49
|
+
reactNative.View,
|
|
50
|
+
{
|
|
51
|
+
style: {
|
|
52
|
+
flex: 1,
|
|
53
|
+
backgroundColor: "red"
|
|
54
|
+
}
|
|
55
|
+
},
|
|
56
|
+
/* @__PURE__ */ React__default.default.createElement(
|
|
57
|
+
WebView__default.default,
|
|
58
|
+
{
|
|
59
|
+
source: {
|
|
60
|
+
uri: `https://cdn.woopze.com/widgets/reviews-modal.html?apikey=${apiKey}&model_code=${modelCode}`
|
|
61
|
+
},
|
|
62
|
+
style: {
|
|
63
|
+
height: "100%",
|
|
64
|
+
width: "100%"
|
|
65
|
+
},
|
|
66
|
+
injectedJavaScript: `
|
|
67
|
+
document.body.style.overflow = 'auto';
|
|
68
|
+
document.documentElement.style.overflow = 'auto';
|
|
69
|
+
true;
|
|
70
|
+
`,
|
|
71
|
+
scrollEnabled: true,
|
|
72
|
+
nestedScrollEnabled: true,
|
|
73
|
+
setBuiltInZoomControls: false,
|
|
74
|
+
setDisplayZoomControls: false,
|
|
75
|
+
scalesPageToFit: false
|
|
76
|
+
}
|
|
77
|
+
)
|
|
78
|
+
)));
|
|
79
|
+
};
|
|
80
|
+
var AllCommentsModal_default = AllCommentsModal;
|
|
81
|
+
|
|
82
|
+
module.exports = AllCommentsModal_default;
|
|
83
|
+
//# sourceMappingURL=AllCommentsModal.js.map
|
|
84
|
+
//# sourceMappingURL=AllCommentsModal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/comments/AllCommentsModal.tsx"],"names":["React","Modal","SafeAreaView","View","TouchableOpacity","Image","Text","WebView"],"mappings":";;;;;;;;;;;AAkBA,MAAM,mBAAmB,CAAC,EAAE,SAAS,OAAA,EAAS,MAAA,EAAQ,WAAU,KAAa;AAC3E,EAAA,uBACEA,sBAAA,CAAA,aAAA,CAACC,iBAAA,EAAA,EAAM,iBAAA,EAAkB,YAAA,EAAa,OAAA,EAAA,kBACpCD,sBAAA,CAAA,aAAA,CAACE,wBAAA,EAAA,EAAa,KAAA,EAAO,EAAE,IAAA,EAAM,CAAA,EAAE,EAAA,kBAC7BF,sBAAA,CAAA,aAAA;AAAA,IAACG,gBAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO;AAAA,QACL,iBAAA,EAAmB,EAAA;AAAA,QACnB,eAAA,EAAiB,EAAA;AAAA,QACjB,aAAA,EAAe,EAAA;AAAA,QACf,iBAAA,EAAmB,CAAA;AAAA,QACnB,iBAAA,EAAmB;AAAA;AACrB,KAAA;AAAA,oBAEAH,sBAAA,CAAA,aAAA;AAAA,MAACI,4BAAA;AAAA,MAAA;AAAA,QACC,aAAA,EAAe,GAAA;AAAA,QACf,OAAA,EAAS,OAAA;AAAA,QACT,KAAA,EAAO;AAAA,UACL,UAAA,EAAY,QAAA;AAAA,UACZ,GAAA,EAAK,EAAA;AAAA,UACL,aAAA,EAAe;AAAA;AACjB,OAAA;AAAA,sBAEAJ,sBAAA,CAAA,aAAA;AAAA,QAACK,iBAAA;AAAA,QAAA;AAAA,UACC,MAAA,EAAQ,QAAQ,4BAA4B,CAAA;AAAA,UAC5C,KAAA,EAAO;AAAA,YACL,SAAA,EAAW,CAAC,EAAE,OAAA,EAAS,SAAS,CAAA;AAAA,YAChC,MAAA,EAAQ,EAAA;AAAA,YACR,KAAA,EAAO;AAAA;AACT;AAAA,OACF;AAAA,2DACCC,gBAAA,EAAA,EAAK,KAAA,EAAO,EAAE,QAAA,EAAU,EAAA,MAAM,aAAQ;AAAA;AACzC,GACF,kBACAN,sBAAA,CAAA,aAAA;AAAA,IAACG,gBAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO;AAAA,QACL,IAAA,EAAM,CAAA;AAAA,QACN,eAAA,EAAiB;AAAA;AACnB,KAAA;AAAA,oBAEAH,sBAAA,CAAA,aAAA;AAAA,MAACO,wBAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAQ;AAAA,UACN,GAAA,EAAK,CAAA,yDAAA,EAA4D,MAAM,CAAA,YAAA,EAAe,SAAS,CAAA;AAAA,SACjG;AAAA,QACA,KAAA,EAAO;AAAA,UACL,MAAA,EAAQ,MAAA;AAAA,UACR,KAAA,EAAO;AAAA,SACT;AAAA,QACA,kBAAA,EAAoB;AAAA;AAAA;AAAA;AAAA,MAAA,CAAA;AAAA,QAKpB,aAAA,EAAa,IAAA;AAAA,QACb,mBAAA,EAAmB,IAAA;AAAA,QACnB,sBAAA,EAAwB,KAAA;AAAA,QACxB,sBAAA,EAAwB,KAAA;AAAA,QACxB,eAAA,EAAiB;AAAA;AAAA;AACnB,GAEJ,CACF,CAAA;AAEJ,CAAA;AAEA,IAAO,wBAAA,GAAQ","file":"AllCommentsModal.js","sourcesContent":["import {\n Image,\n Modal,\n SafeAreaView,\n Text,\n TouchableOpacity,\n View,\n} from \"react-native\";\nimport WebView from \"react-native-webview\";\nimport React from \"react\";\n\ntype Props = {\n visible: boolean;\n onClose: () => void;\n apiKey: string;\n modelCode: string;\n};\n\nconst AllCommentsModal = ({ visible, onClose, apiKey, modelCode }: Props) => {\n return (\n <Modal presentationStyle=\"fullScreen\" visible={visible}>\n <SafeAreaView style={{ flex: 1 }}>\n <View\n style={{\n paddingHorizontal: 16,\n paddingVertical: 10,\n paddingBottom: 16,\n borderBottomWidth: 1,\n borderBottomColor: \"#efefef\",\n }}\n >\n <TouchableOpacity\n activeOpacity={0.8}\n onPress={onClose}\n style={{\n alignItems: \"center\",\n gap: 12,\n flexDirection: \"row\",\n }}\n >\n <Image\n source={require(\"../assets/chevron-icon.png\")}\n style={{\n transform: [{ rotateZ: \"90deg\" }],\n height: 12,\n width: 12,\n }}\n />\n <Text style={{ fontSize: 14 }}>Geri Dön</Text>\n </TouchableOpacity>\n </View>\n <View\n style={{\n flex: 1,\n backgroundColor: \"red\",\n }}\n >\n <WebView\n source={{\n uri: `https://cdn.woopze.com/widgets/reviews-modal.html?apikey=${apiKey}&model_code=${modelCode}`,\n }}\n style={{\n height: \"100%\",\n width: \"100%\",\n }}\n injectedJavaScript={`\n document.body.style.overflow = 'auto';\n document.documentElement.style.overflow = 'auto';\n true;\n `}\n scrollEnabled\n nestedScrollEnabled\n setBuiltInZoomControls={false}\n setDisplayZoomControls={false}\n scalesPageToFit={false}\n />\n </View>\n </SafeAreaView>\n </Modal>\n );\n};\n\nexport default AllCommentsModal;\n"]}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var reactNative = require('react-native');
|
|
5
|
+
var WebView = require('react-native-webview');
|
|
6
|
+
var AllCommentsModal = require('./AllCommentsModal');
|
|
7
|
+
|
|
8
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
+
|
|
10
|
+
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
11
|
+
var WebView__default = /*#__PURE__*/_interopDefault(WebView);
|
|
12
|
+
var AllCommentsModal__default = /*#__PURE__*/_interopDefault(AllCommentsModal);
|
|
13
|
+
|
|
14
|
+
const Comments = ({ apiKey, modelCode }) => {
|
|
15
|
+
const [isShowAllComments, setIsShowAllComments] = React.useState(false);
|
|
16
|
+
if (!apiKey || !modelCode) {
|
|
17
|
+
return null;
|
|
18
|
+
}
|
|
19
|
+
return /* @__PURE__ */ React__default.default.createElement(reactNative.View, { style: { width: "100%" } }, /* @__PURE__ */ React__default.default.createElement(
|
|
20
|
+
AllCommentsModal__default.default,
|
|
21
|
+
{
|
|
22
|
+
visible: isShowAllComments,
|
|
23
|
+
onClose: () => setIsShowAllComments(false),
|
|
24
|
+
apiKey,
|
|
25
|
+
modelCode
|
|
26
|
+
}
|
|
27
|
+
), /* @__PURE__ */ React__default.default.createElement(reactNative.View, { style: { height: 350, width: "100%" } }, /* @__PURE__ */ React__default.default.createElement(
|
|
28
|
+
WebView__default.default,
|
|
29
|
+
{
|
|
30
|
+
source: {
|
|
31
|
+
uri: `https://cdn.woopze.com/widgets/reviews-slider.html?apikey=${apiKey}&model_code=${modelCode}`
|
|
32
|
+
},
|
|
33
|
+
style: { flex: 1 }
|
|
34
|
+
}
|
|
35
|
+
)), /* @__PURE__ */ React__default.default.createElement(
|
|
36
|
+
reactNative.View,
|
|
37
|
+
{
|
|
38
|
+
style: {
|
|
39
|
+
flexDirection: "row",
|
|
40
|
+
alignItems: "center",
|
|
41
|
+
paddingBottom: 16,
|
|
42
|
+
width: "100%"
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
/* @__PURE__ */ React__default.default.createElement(reactNative.View, { style: { flex: 1, height: 1, backgroundColor: "#efefef" } }),
|
|
46
|
+
/* @__PURE__ */ React__default.default.createElement(
|
|
47
|
+
reactNative.TouchableOpacity,
|
|
48
|
+
{
|
|
49
|
+
activeOpacity: 0.8,
|
|
50
|
+
onPress: () => setIsShowAllComments(true),
|
|
51
|
+
style: {
|
|
52
|
+
backgroundColor: "#efefef",
|
|
53
|
+
borderRadius: 26,
|
|
54
|
+
paddingVertical: 8,
|
|
55
|
+
paddingHorizontal: 16
|
|
56
|
+
}
|
|
57
|
+
},
|
|
58
|
+
/* @__PURE__ */ React__default.default.createElement(reactNative.Text, { style: { marginHorizontal: 8, fontWeight: "500" } }, "T\xDCM YORUMLARI G\xD6R")
|
|
59
|
+
),
|
|
60
|
+
/* @__PURE__ */ React__default.default.createElement(reactNative.View, { style: { flex: 1, height: 1, backgroundColor: "#efefef" } })
|
|
61
|
+
));
|
|
62
|
+
};
|
|
63
|
+
var comments_default = Comments;
|
|
64
|
+
|
|
65
|
+
module.exports = comments_default;
|
|
66
|
+
//# sourceMappingURL=index.js.map
|
|
67
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/comments/index.tsx"],"names":["useState","View","React","AllCommentsModal","WebView","TouchableOpacity","Text"],"mappings":";;;;;;;;;;;;;AAiBA,MAAM,QAAA,GAAW,CAAC,EAAE,MAAA,EAAQ,WAAU,KAA2B;AAC/D,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAIA,eAAS,KAAK,CAAA;AAChE,EAAA,IAAI,CAAC,MAAA,IAAU,CAAC,SAAA,EAAW;AACzB,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,4DACGC,gBAAA,EAAA,EAAK,KAAA,EAAO,EAAE,KAAA,EAAO,QAAO,EAAA,kBAC3BC,sBAAA,CAAA,aAAA;AAAA,IAACC,iCAAA;AAAA,IAAA;AAAA,MACC,OAAA,EAAS,iBAAA;AAAA,MACT,OAAA,EAAS,MAAM,oBAAA,CAAqB,KAAK,CAAA;AAAA,MACzC,MAAA;AAAA,MACA;AAAA;AAAA,GACF,uDAECF,gBAAA,EAAA,EAAK,KAAA,EAAO,EAAE,MAAA,EAAQ,GAAA,EAAK,KAAA,EAAO,MAAA,EAAO,EAAA,kBACxCC,sBAAA,CAAA,aAAA;AAAA,IAACE,wBAAA;AAAA,IAAA;AAAA,MACC,MAAA,EAAQ;AAAA,QACN,GAAA,EAAK,CAAA,0DAAA,EAA6D,MAAM,CAAA,YAAA,EAAe,SAAS,CAAA;AAAA,OAClG;AAAA,MACA,KAAA,EAAO,EAAE,IAAA,EAAM,CAAA;AAAE;AAAA,GAErB,CAAA,kBAEAF,sBAAA,CAAA,aAAA;AAAA,IAACD,gBAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO;AAAA,QACL,aAAA,EAAe,KAAA;AAAA,QACf,UAAA,EAAY,QAAA;AAAA,QACZ,aAAA,EAAe,EAAA;AAAA,QACf,KAAA,EAAO;AAAA;AACT,KAAA;AAAA,oBAEAC,sBAAA,CAAA,aAAA,CAACD,gBAAA,EAAA,EAAK,KAAA,EAAO,EAAE,IAAA,EAAM,GAAG,MAAA,EAAQ,CAAA,EAAG,eAAA,EAAiB,SAAA,EAAU,EAAG,CAAA;AAAA,oBAEjEC,sBAAA,CAAA,aAAA;AAAA,MAACG,4BAAA;AAAA,MAAA;AAAA,QACC,aAAA,EAAe,GAAA;AAAA,QACf,OAAA,EAAS,MAAM,oBAAA,CAAqB,IAAI,CAAA;AAAA,QACxC,KAAA,EAAO;AAAA,UACL,eAAA,EAAiB,SAAA;AAAA,UACjB,YAAA,EAAc,EAAA;AAAA,UACd,eAAA,EAAiB,CAAA;AAAA,UACjB,iBAAA,EAAmB;AAAA;AACrB,OAAA;AAAA,sBAEAH,sBAAA,CAAA,aAAA,CAACI,oBAAK,KAAA,EAAO,EAAE,kBAAkB,CAAA,EAAG,UAAA,EAAY,KAAA,EAAM,EAAA,EAAG,yBAEzD;AAAA,KACF;AAAA,oBAEAJ,sBAAA,CAAA,aAAA,CAACD,gBAAA,EAAA,EAAK,KAAA,EAAO,EAAE,IAAA,EAAM,GAAG,MAAA,EAAQ,CAAA,EAAG,eAAA,EAAiB,SAAA,EAAU,EAAG;AAAA,GAErE,CAAA;AAEJ,CAAA;AAEA,IAAO,gBAAA,GAAQ","file":"index.js","sourcesContent":["import React, { useState } from \"react\";\nimport {\n Image,\n Modal,\n Text,\n TouchableOpacity,\n View,\n SafeAreaView,\n} from \"react-native\";\nimport WebView from \"react-native-webview\";\nimport AllCommentsModal from \"./AllCommentsModal\";\n\ntype WoopzeCommentsProps = {\n apiKey: string;\n modelCode: string;\n};\n\nconst Comments = ({ apiKey, modelCode }: WoopzeCommentsProps) => {\n const [isShowAllComments, setIsShowAllComments] = useState(false);\n if (!apiKey || !modelCode) {\n return null;\n }\n\n return (\n <View style={{ width: \"100%\" }}>\n <AllCommentsModal\n visible={isShowAllComments}\n onClose={() => setIsShowAllComments(false)}\n apiKey={apiKey}\n modelCode={modelCode}\n />\n\n <View style={{ height: 350, width: \"100%\" }}>\n <WebView\n source={{\n uri: `https://cdn.woopze.com/widgets/reviews-slider.html?apikey=${apiKey}&model_code=${modelCode}`,\n }}\n style={{ flex: 1 }}\n />\n </View>\n\n <View\n style={{\n flexDirection: \"row\",\n alignItems: \"center\",\n paddingBottom: 16,\n width: \"100%\",\n }}\n >\n <View style={{ flex: 1, height: 1, backgroundColor: \"#efefef\" }} />\n\n <TouchableOpacity\n activeOpacity={0.8}\n onPress={() => setIsShowAllComments(true)}\n style={{\n backgroundColor: \"#efefef\",\n borderRadius: 26,\n paddingVertical: 8,\n paddingHorizontal: 16,\n }}\n >\n <Text style={{ marginHorizontal: 8, fontWeight: \"500\" }}>\n TÜM YORUMLARI GÖR\n </Text>\n </TouchableOpacity>\n\n <View style={{ flex: 1, height: 1, backgroundColor: \"#efefef\" }} />\n </View>\n </View>\n );\n};\n\nexport default Comments;\n"]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { WoopzeSearchTheme } from '../search/index.js';
|
|
3
|
+
import { ProductItem } from '../types.js';
|
|
4
|
+
import 'react-native';
|
|
5
|
+
|
|
6
|
+
declare function ProductCard({ item, onProductPress, onVisualSearchPress, theme, }: {
|
|
7
|
+
item: ProductItem;
|
|
8
|
+
onProductPress: (product: {
|
|
9
|
+
id: string;
|
|
10
|
+
url: string;
|
|
11
|
+
}) => void;
|
|
12
|
+
onVisualSearchPress: () => void;
|
|
13
|
+
theme: WoopzeSearchTheme;
|
|
14
|
+
}): React__default.JSX.Element;
|
|
15
|
+
|
|
16
|
+
export { ProductCard as default };
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var reactNative = require('react-native');
|
|
5
|
+
|
|
6
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
7
|
+
|
|
8
|
+
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
9
|
+
|
|
10
|
+
function ProductCard({
|
|
11
|
+
item,
|
|
12
|
+
onProductPress,
|
|
13
|
+
onVisualSearchPress,
|
|
14
|
+
theme
|
|
15
|
+
}) {
|
|
16
|
+
return /* @__PURE__ */ React__default.default.createElement(
|
|
17
|
+
reactNative.TouchableOpacity,
|
|
18
|
+
{
|
|
19
|
+
activeOpacity: 0.7,
|
|
20
|
+
onPress: () => onProductPress({ id: item.ids[0], url: item.url }),
|
|
21
|
+
style: styles.card
|
|
22
|
+
},
|
|
23
|
+
/* @__PURE__ */ React__default.default.createElement(reactNative.View, { style: styles.imageWrap }, /* @__PURE__ */ React__default.default.createElement(
|
|
24
|
+
reactNative.Image,
|
|
25
|
+
{
|
|
26
|
+
source: { uri: item.imageUrl },
|
|
27
|
+
resizeMode: "contain",
|
|
28
|
+
style: styles.image
|
|
29
|
+
}
|
|
30
|
+
), item.photo_embedding ? /* @__PURE__ */ React__default.default.createElement(
|
|
31
|
+
reactNative.TouchableOpacity,
|
|
32
|
+
{
|
|
33
|
+
activeOpacity: 0.7,
|
|
34
|
+
style: [
|
|
35
|
+
styles.cameraButton,
|
|
36
|
+
{ backgroundColor: theme.cameraButtonBackgroundColor }
|
|
37
|
+
],
|
|
38
|
+
onPress: onVisualSearchPress
|
|
39
|
+
},
|
|
40
|
+
/* @__PURE__ */ React__default.default.createElement(
|
|
41
|
+
reactNative.Image,
|
|
42
|
+
{
|
|
43
|
+
source: require("../assets/cam-icon.png"),
|
|
44
|
+
style: styles.cameraIcon
|
|
45
|
+
}
|
|
46
|
+
)
|
|
47
|
+
) : null),
|
|
48
|
+
/* @__PURE__ */ React__default.default.createElement(
|
|
49
|
+
reactNative.Text,
|
|
50
|
+
{
|
|
51
|
+
numberOfLines: 1,
|
|
52
|
+
style: [styles.productTitle, { color: theme.accentColor }]
|
|
53
|
+
},
|
|
54
|
+
item.title
|
|
55
|
+
),
|
|
56
|
+
/* @__PURE__ */ React__default.default.createElement(reactNative.View, { style: styles.priceRow }, item.oldPrice ? /* @__PURE__ */ React__default.default.createElement(reactNative.Text, { style: styles.oldPrice }, item.oldPrice) : null, item.discount ? /* @__PURE__ */ React__default.default.createElement(reactNative.Text, { style: [styles.discount, { color: theme.dangerColor }] }, item.discount) : null, /* @__PURE__ */ React__default.default.createElement(reactNative.Text, { style: [styles.newPrice, { color: theme.accentColor }] }, item.newPrice))
|
|
57
|
+
);
|
|
58
|
+
}
|
|
59
|
+
const styles = reactNative.StyleSheet.create({
|
|
60
|
+
card: {
|
|
61
|
+
width: "48.3%"
|
|
62
|
+
},
|
|
63
|
+
image: {
|
|
64
|
+
width: "100%",
|
|
65
|
+
height: "100%"
|
|
66
|
+
},
|
|
67
|
+
newPrice: {
|
|
68
|
+
fontSize: 12,
|
|
69
|
+
color: "#000",
|
|
70
|
+
fontWeight: "600"
|
|
71
|
+
},
|
|
72
|
+
imageWrap: {
|
|
73
|
+
width: "100%",
|
|
74
|
+
aspectRatio: 0.65
|
|
75
|
+
},
|
|
76
|
+
cameraButton: {
|
|
77
|
+
position: "absolute",
|
|
78
|
+
top: 8,
|
|
79
|
+
right: 8,
|
|
80
|
+
width: 28,
|
|
81
|
+
height: 28,
|
|
82
|
+
borderRadius: 24,
|
|
83
|
+
backgroundColor: "#fff",
|
|
84
|
+
alignItems: "center",
|
|
85
|
+
justifyContent: "center",
|
|
86
|
+
shadowColor: "#000",
|
|
87
|
+
shadowOpacity: 0.15,
|
|
88
|
+
shadowRadius: 6,
|
|
89
|
+
shadowOffset: { width: 0, height: 2 },
|
|
90
|
+
elevation: 3
|
|
91
|
+
},
|
|
92
|
+
cameraIcon: {
|
|
93
|
+
width: 20,
|
|
94
|
+
height: 20
|
|
95
|
+
},
|
|
96
|
+
productTitle: {
|
|
97
|
+
fontSize: 12,
|
|
98
|
+
color: "#000",
|
|
99
|
+
marginTop: 8
|
|
100
|
+
},
|
|
101
|
+
priceRow: {
|
|
102
|
+
flexDirection: "row",
|
|
103
|
+
alignItems: "center",
|
|
104
|
+
flexWrap: "wrap",
|
|
105
|
+
gap: 4,
|
|
106
|
+
marginTop: 6
|
|
107
|
+
},
|
|
108
|
+
oldPrice: {
|
|
109
|
+
fontSize: 12,
|
|
110
|
+
color: "#767676",
|
|
111
|
+
textDecorationLine: "line-through"
|
|
112
|
+
},
|
|
113
|
+
discount: {
|
|
114
|
+
fontSize: 12,
|
|
115
|
+
color: "#ff0000",
|
|
116
|
+
fontWeight: "700"
|
|
117
|
+
}
|
|
118
|
+
});
|
|
119
|
+
var ProductCard_default = ProductCard;
|
|
120
|
+
|
|
121
|
+
module.exports = ProductCard_default;
|
|
122
|
+
//# sourceMappingURL=ProductCard.js.map
|
|
123
|
+
//# sourceMappingURL=ProductCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/ProductCard.tsx"],"names":["React","TouchableOpacity","View","Image","Text","StyleSheet"],"mappings":"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","file":"ProductCard.js","sourcesContent":["import React from \"react\";\nimport { TouchableOpacity, View, StyleSheet, Image, Text } from \"react-native\";\nimport { WoopzeSearchTheme } from \"../search\";\nimport { ProductItem } from \"../types\";\n\nfunction ProductCard({\n item,\n onProductPress,\n onVisualSearchPress,\n theme,\n}: {\n item: ProductItem;\n onProductPress: (product: { id: string; url: string }) => void;\n onVisualSearchPress: () => void;\n theme: WoopzeSearchTheme;\n}) {\n return (\n <TouchableOpacity\n activeOpacity={0.7}\n onPress={() => onProductPress({ id: item.ids[0], url: item.url })}\n style={styles.card}\n >\n <View style={styles.imageWrap}>\n <Image\n source={{ uri: item.imageUrl }}\n resizeMode=\"contain\"\n style={styles.image}\n />\n {item.photo_embedding ? (\n <TouchableOpacity\n activeOpacity={0.7}\n style={[\n styles.cameraButton,\n { backgroundColor: theme.cameraButtonBackgroundColor },\n ]}\n onPress={onVisualSearchPress}\n >\n <Image\n source={require(\"../assets/cam-icon.png\")}\n style={styles.cameraIcon}\n />\n </TouchableOpacity>\n ) : null}\n </View>\n <Text\n numberOfLines={1}\n style={[styles.productTitle, { color: theme.accentColor }]}\n >\n {item.title}\n </Text>\n <View style={styles.priceRow}>\n {item.oldPrice ? (\n <Text style={styles.oldPrice}>{item.oldPrice}</Text>\n ) : null}\n {item.discount ? (\n <Text style={[styles.discount, { color: theme.dangerColor }]}>\n {item.discount}\n </Text>\n ) : null}\n <Text style={[styles.newPrice, { color: theme.accentColor }]}>\n {item.newPrice}\n </Text>\n </View>\n </TouchableOpacity>\n );\n}\n\nconst styles = StyleSheet.create({\n card: {\n width: \"48.3%\",\n },\n image: {\n width: \"100%\",\n height: \"100%\",\n },\n newPrice: {\n fontSize: 12,\n color: \"#000\",\n fontWeight: \"600\",\n },\n imageWrap: {\n width: \"100%\",\n aspectRatio: 0.65,\n },\n cameraButton: {\n position: \"absolute\",\n top: 8,\n right: 8,\n width: 28,\n height: 28,\n borderRadius: 24,\n backgroundColor: \"#fff\",\n alignItems: \"center\",\n justifyContent: \"center\",\n shadowColor: \"#000\",\n shadowOpacity: 0.15,\n shadowRadius: 6,\n shadowOffset: { width: 0, height: 2 },\n elevation: 3,\n },\n cameraIcon: {\n width: 20,\n height: 20,\n },\n productTitle: {\n fontSize: 12,\n color: \"#000\",\n marginTop: 8,\n },\n priceRow: {\n flexDirection: \"row\",\n alignItems: \"center\",\n flexWrap: \"wrap\",\n gap: 4,\n marginTop: 6,\n },\n oldPrice: {\n fontSize: 12,\n color: \"#767676\",\n textDecorationLine: \"line-through\",\n },\n discount: {\n fontSize: 12,\n color: \"#ff0000\",\n fontWeight: \"700\",\n },\n});\n\nexport default ProductCard;\n"]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { WoopzeSearchTheme } from '../search/index.js';
|
|
3
|
+
import 'react-native';
|
|
4
|
+
|
|
5
|
+
type Props = {
|
|
6
|
+
query: string;
|
|
7
|
+
setQuery: (query: string) => void;
|
|
8
|
+
hideHeaderCloseIcon: boolean;
|
|
9
|
+
isResultsMode: boolean;
|
|
10
|
+
clearSearch: () => void;
|
|
11
|
+
onClosePress: (() => void) | undefined;
|
|
12
|
+
mergedTheme: WoopzeSearchTheme;
|
|
13
|
+
};
|
|
14
|
+
declare const SearchInput: ({ query, setQuery, hideHeaderCloseIcon, isResultsMode, clearSearch, onClosePress, mergedTheme, }: Props) => React__default.JSX.Element;
|
|
15
|
+
|
|
16
|
+
export { SearchInput as default };
|