@heycater/qualification-funnel 1.3.21 → 1.4.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/dist/heycater-funnel.iife.js +69 -151
- package/dist/index.cjs.js +90 -173
- package/dist/index.esm.js +233 -301
- package/package.json +5 -2
- package/dist/artifacts/images/shared/bestsellers/breakfast.png +0 -0
- package/dist/artifacts/images/shared/bestsellers/buffet.png +0 -0
- package/dist/artifacts/images/shared/bestsellers/business_lunch.png +0 -0
- package/dist/artifacts/images/shared/bestsellers/dinner.png +0 -0
- package/dist/artifacts/images/shared/bestsellers/drinks.png +0 -0
- package/dist/artifacts/images/shared/bestsellers/fingerfood.png +0 -0
- package/dist/artifacts/images/shared/bestsellers/street_food.png +0 -0
- package/dist/artifacts/images/shared/bestsellers/sweets.png +0 -0
- package/dist/demo/README.md +0 -65
- package/dist/demo/iife-auto.html +0 -53
- package/dist/demo/iife-fullscreen.html +0 -49
- package/dist/demo/iife.html +0 -134
- package/dist/index.cjs.js.map +0 -1
- package/dist/index.esm.js.map +0 -1
- package/dist/stats.html +0 -4949
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@heycater/qualification-funnel",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.4.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Heycater embedded qualification funnel widget",
|
|
6
6
|
"main": "dist/index.cjs.js",
|
|
@@ -17,7 +17,10 @@
|
|
|
17
17
|
"./widget.css": "./dist/heycater-funnel.css"
|
|
18
18
|
},
|
|
19
19
|
"files": [
|
|
20
|
-
"dist"
|
|
20
|
+
"dist/**",
|
|
21
|
+
"!dist/**/*.map",
|
|
22
|
+
"!dist/stats.html",
|
|
23
|
+
"!dist/demo"
|
|
21
24
|
],
|
|
22
25
|
"repository": "https://github.com/heycater/npm-packages",
|
|
23
26
|
"scripts": {
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
package/dist/demo/README.md
DELETED
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
# Qualification Funnel Demos
|
|
2
|
-
|
|
3
|
-
## IIFE Examples (Script Tag)
|
|
4
|
-
|
|
5
|
-
For non-React applications or simple integrations using script tags.
|
|
6
|
-
|
|
7
|
-
### Auto-init (iife-auto.html)
|
|
8
|
-
```html
|
|
9
|
-
<script>
|
|
10
|
-
window.__HEYCATER_CONFIG__ = {
|
|
11
|
-
graphqlEndpoint: 'https://api.heycater.com/graphql',
|
|
12
|
-
googleMapsApiKey: 'YOUR_KEY',
|
|
13
|
-
locale: 'de',
|
|
14
|
-
};
|
|
15
|
-
</script>
|
|
16
|
-
<link rel="stylesheet" href="path/to/heycater-funnel.css" />
|
|
17
|
-
<script src="path/to/heycater-funnel.iife.js"></script>
|
|
18
|
-
|
|
19
|
-
<!-- Widget auto-initializes on elements with this attribute -->
|
|
20
|
-
<div data-heycater-funnel></div>
|
|
21
|
-
```
|
|
22
|
-
|
|
23
|
-
### Manual mount (iife.html)
|
|
24
|
-
```html
|
|
25
|
-
<script>
|
|
26
|
-
window.__HEYCATER_CONFIG__ = { /* ... */ };
|
|
27
|
-
</script>
|
|
28
|
-
<link rel="stylesheet" href="path/to/heycater-funnel.css" />
|
|
29
|
-
<script src="path/to/heycater-funnel.iife.js"></script>
|
|
30
|
-
|
|
31
|
-
<div id="my-funnel"></div>
|
|
32
|
-
<script>
|
|
33
|
-
HeycaterFunnel.mount('#my-funnel');
|
|
34
|
-
</script>
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
## React Example
|
|
38
|
-
|
|
39
|
-
For React applications using the ESM build.
|
|
40
|
-
|
|
41
|
-
```bash
|
|
42
|
-
cd react-example
|
|
43
|
-
npm install
|
|
44
|
-
npm run dev
|
|
45
|
-
```
|
|
46
|
-
|
|
47
|
-
Then open http://localhost:3001
|
|
48
|
-
|
|
49
|
-
### Usage in React
|
|
50
|
-
```tsx
|
|
51
|
-
import { QualificationFunnel } from '@heycater/qualification-funnel';
|
|
52
|
-
import '@heycater/qualification-funnel/style.css';
|
|
53
|
-
|
|
54
|
-
function App() {
|
|
55
|
-
return (
|
|
56
|
-
<QualificationFunnel
|
|
57
|
-
apiEndpoint="https://api.heycater.com/graphql"
|
|
58
|
-
googleMapsApiKey="YOUR_KEY"
|
|
59
|
-
locale="de"
|
|
60
|
-
onBackground="light"
|
|
61
|
-
highlightColor="primary"
|
|
62
|
-
/>
|
|
63
|
-
);
|
|
64
|
-
}
|
|
65
|
-
```
|
package/dist/demo/iife-auto.html
DELETED
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="de">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8" />
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
-
<title>Heycater Funnel - Auto-init Demo</title>
|
|
7
|
-
<style>
|
|
8
|
-
body {
|
|
9
|
-
margin: 0;
|
|
10
|
-
padding: 20px;
|
|
11
|
-
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
12
|
-
background-color: #f5f5f5;
|
|
13
|
-
}
|
|
14
|
-
.info {
|
|
15
|
-
max-width: 800px;
|
|
16
|
-
margin: 0 auto 20px;
|
|
17
|
-
padding: 15px;
|
|
18
|
-
background: #e7f3ff;
|
|
19
|
-
border-radius: 8px;
|
|
20
|
-
font-size: 14px;
|
|
21
|
-
}
|
|
22
|
-
.funnel-container {
|
|
23
|
-
width: 100%;
|
|
24
|
-
margin: 0 auto;
|
|
25
|
-
background: #fff;
|
|
26
|
-
border-radius: 8px;
|
|
27
|
-
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
28
|
-
min-height: 500px;
|
|
29
|
-
}
|
|
30
|
-
</style>
|
|
31
|
-
</head>
|
|
32
|
-
<body>
|
|
33
|
-
<div class="info">
|
|
34
|
-
<strong>Auto-init mode:</strong> Using <code>data-heycater-funnel</code> attribute.
|
|
35
|
-
No JavaScript needed - widget initializes automatically.
|
|
36
|
-
</div>
|
|
37
|
-
|
|
38
|
-
<div class="funnel-container">
|
|
39
|
-
<!-- Widget auto-initializes on elements with this attribute -->
|
|
40
|
-
<div data-heycater-funnel></div>
|
|
41
|
-
</div>
|
|
42
|
-
|
|
43
|
-
<script>
|
|
44
|
-
window.__HEYCATER_CONFIG__ = {
|
|
45
|
-
graphqlEndpoint: 'https://api.heycater.com/graphql',
|
|
46
|
-
googleMapsApiKey: 'AIzaSyCrunI86W7p8zk5yoGX9i1s0SzIJ7GTRDU',
|
|
47
|
-
locale: 'de',
|
|
48
|
-
};
|
|
49
|
-
</script>
|
|
50
|
-
<link rel="stylesheet" href="../heycater-funnel.css" />
|
|
51
|
-
<script src="../heycater-funnel.iife.js"></script>
|
|
52
|
-
</body>
|
|
53
|
-
</html>
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="de">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8" />
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
-
<title>Heycater Funnel - Fullscreen Mode</title>
|
|
7
|
-
<style>
|
|
8
|
-
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
9
|
-
html, body { height: 100%; }
|
|
10
|
-
.lang-switcher {
|
|
11
|
-
position: fixed;
|
|
12
|
-
top: 10px;
|
|
13
|
-
right: 10px;
|
|
14
|
-
z-index: 100;
|
|
15
|
-
display: flex;
|
|
16
|
-
gap: 8px;
|
|
17
|
-
}
|
|
18
|
-
.lang-switcher button {
|
|
19
|
-
padding: 6px 14px;
|
|
20
|
-
border: 1px solid #ccc;
|
|
21
|
-
border-radius: 4px;
|
|
22
|
-
background: #fff;
|
|
23
|
-
cursor: pointer;
|
|
24
|
-
font-size: 14px;
|
|
25
|
-
}
|
|
26
|
-
.lang-switcher button:hover { background: #f0f0f0; }
|
|
27
|
-
</style>
|
|
28
|
-
</head>
|
|
29
|
-
<body>
|
|
30
|
-
<div class="lang-switcher">
|
|
31
|
-
<button onclick="HeycaterFunnel.setLocale('de')">DE</button>
|
|
32
|
-
<button onclick="HeycaterFunnel.setLocale('en')">EN</button>
|
|
33
|
-
</div>
|
|
34
|
-
|
|
35
|
-
<div data-heycater-funnel style="min-height: 100vh;"></div>
|
|
36
|
-
|
|
37
|
-
<script>
|
|
38
|
-
window.__HEYCATER_CONFIG__ = {
|
|
39
|
-
graphqlEndpoint: 'https://api.heycater.com/graphql',
|
|
40
|
-
googleMapsApiKey: 'AIzaSyCrunI86W7p8zk5yoGX9i1s0SzIJ7GTRDU',
|
|
41
|
-
locale: 'de',
|
|
42
|
-
mode: 'fullscreen',
|
|
43
|
-
};
|
|
44
|
-
</script>
|
|
45
|
-
|
|
46
|
-
<link rel="stylesheet" href="../heycater-funnel.css" />
|
|
47
|
-
<script src="../heycater-funnel.iife.js"></script>
|
|
48
|
-
</body>
|
|
49
|
-
</html>
|
package/dist/demo/iife.html
DELETED
|
@@ -1,134 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="de">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8" />
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
-
<title>Heycater Funnel Widget - Demo</title>
|
|
7
|
-
<style>
|
|
8
|
-
* {
|
|
9
|
-
box-sizing: border-box;
|
|
10
|
-
}
|
|
11
|
-
body {
|
|
12
|
-
margin: 0;
|
|
13
|
-
padding: 20px;
|
|
14
|
-
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
15
|
-
background-color: #f5f5f5;
|
|
16
|
-
}
|
|
17
|
-
.header {
|
|
18
|
-
max-width: 800px;
|
|
19
|
-
margin: 0 auto 20px;
|
|
20
|
-
padding: 20px;
|
|
21
|
-
background: #fff;
|
|
22
|
-
border-radius: 8px;
|
|
23
|
-
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
24
|
-
}
|
|
25
|
-
.header h1 {
|
|
26
|
-
margin: 0 0 10px;
|
|
27
|
-
color: #333;
|
|
28
|
-
}
|
|
29
|
-
.header p {
|
|
30
|
-
margin: 0;
|
|
31
|
-
color: #666;
|
|
32
|
-
}
|
|
33
|
-
.status {
|
|
34
|
-
margin-top: 15px;
|
|
35
|
-
padding: 10px;
|
|
36
|
-
border-radius: 4px;
|
|
37
|
-
font-size: 14px;
|
|
38
|
-
}
|
|
39
|
-
.status.success {
|
|
40
|
-
background: #d4edda;
|
|
41
|
-
color: #155724;
|
|
42
|
-
}
|
|
43
|
-
.status.error {
|
|
44
|
-
background: #f8d7da;
|
|
45
|
-
color: #721c24;
|
|
46
|
-
}
|
|
47
|
-
.status.info {
|
|
48
|
-
background: #cce5ff;
|
|
49
|
-
color: #004085;
|
|
50
|
-
}
|
|
51
|
-
.config-info {
|
|
52
|
-
margin-top: 15px;
|
|
53
|
-
padding: 10px;
|
|
54
|
-
background: #f8f9fa;
|
|
55
|
-
border-radius: 4px;
|
|
56
|
-
font-family: monospace;
|
|
57
|
-
font-size: 12px;
|
|
58
|
-
}
|
|
59
|
-
.funnel-container {
|
|
60
|
-
width: 100%;
|
|
61
|
-
margin: 0 auto;
|
|
62
|
-
background: #fff;
|
|
63
|
-
border-radius: 8px;
|
|
64
|
-
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
65
|
-
min-height: 500px;
|
|
66
|
-
}
|
|
67
|
-
</style>
|
|
68
|
-
</head>
|
|
69
|
-
<body>
|
|
70
|
-
<div class="header">
|
|
71
|
-
<h1>Heycater Qualification Funnel</h1>
|
|
72
|
-
<p>Production build demo - testing IIFE widget bundle</p>
|
|
73
|
-
|
|
74
|
-
<div id="status" class="status info">Loading widget...</div>
|
|
75
|
-
|
|
76
|
-
<div class="config-info">
|
|
77
|
-
<strong>Configuration:</strong><br>
|
|
78
|
-
<span id="config-display"></span>
|
|
79
|
-
</div>
|
|
80
|
-
</div>
|
|
81
|
-
|
|
82
|
-
<div class="funnel-container">
|
|
83
|
-
<div id="heycater-funnel"></div>
|
|
84
|
-
</div>
|
|
85
|
-
|
|
86
|
-
<script>
|
|
87
|
-
// Configuration - simulating what parent app would provide
|
|
88
|
-
window.__HEYCATER_CONFIG__ = {
|
|
89
|
-
graphqlEndpoint: 'https://api.heycater.com/graphql',
|
|
90
|
-
googleMapsApiKey: 'AIzaSyCrunI86W7p8zk5yoGX9i1s0SzIJ7GTRDU',
|
|
91
|
-
locale: 'de',
|
|
92
|
-
isProduction: false,
|
|
93
|
-
// bugsnagApiKey: 'your-key-here', // Uncomment to enable Bugsnag
|
|
94
|
-
};
|
|
95
|
-
|
|
96
|
-
// Display config
|
|
97
|
-
document.getElementById('config-display').innerHTML =
|
|
98
|
-
'API: ' + window.__HEYCATER_CONFIG__.graphqlEndpoint + '<br>' +
|
|
99
|
-
'Google Maps: ' + (window.__HEYCATER_CONFIG__.googleMapsApiKey ? 'Configured' : 'Not set') + '<br>' +
|
|
100
|
-
'Bugsnag: ' + (window.__HEYCATER_CONFIG__.bugsnagApiKey ? 'Enabled' : 'Disabled') + '<br>' +
|
|
101
|
-
'Locale: ' + window.__HEYCATER_CONFIG__.locale;
|
|
102
|
-
</script>
|
|
103
|
-
|
|
104
|
-
<!-- Load the built widget CSS and JS -->
|
|
105
|
-
<link rel="stylesheet" href="../heycater-funnel.css" />
|
|
106
|
-
<script src="../heycater-funnel.iife.js"></script>
|
|
107
|
-
|
|
108
|
-
<script>
|
|
109
|
-
// Check if widget loaded successfully
|
|
110
|
-
window.addEventListener('load', function() {
|
|
111
|
-
var statusEl = document.getElementById('status');
|
|
112
|
-
|
|
113
|
-
if (window.HeycaterFunnel && typeof window.HeycaterFunnel.mount === 'function') {
|
|
114
|
-
statusEl.className = 'status success';
|
|
115
|
-
statusEl.innerHTML = '✓ Widget loaded successfully! HeycaterFunnel.mount() is available.';
|
|
116
|
-
|
|
117
|
-
// Mount the widget
|
|
118
|
-
window.HeycaterFunnel.mount('#heycater-funnel');
|
|
119
|
-
} else {
|
|
120
|
-
statusEl.className = 'status error';
|
|
121
|
-
statusEl.innerHTML = '✗ Widget failed to load. Check console for errors.';
|
|
122
|
-
}
|
|
123
|
-
});
|
|
124
|
-
|
|
125
|
-
// Log any errors
|
|
126
|
-
window.addEventListener('error', function(e) {
|
|
127
|
-
console.error('Widget error:', e);
|
|
128
|
-
var statusEl = document.getElementById('status');
|
|
129
|
-
statusEl.className = 'status error';
|
|
130
|
-
statusEl.innerHTML = '✗ Error: ' + e.message;
|
|
131
|
-
});
|
|
132
|
-
</script>
|
|
133
|
-
</body>
|
|
134
|
-
</html>
|