|
1 | 1 | <pre class="-my-4">
|
2 | 2 | <code class="language-javascript">
|
3 |
| -import { TrieveModalSearch } from 'trieve-search-component'; |
4 |
| -import 'trieve-search-component/styles'; |
| 3 | +<link |
| 4 | + rel="stylesheet" |
| 5 | + href="https://unpkg.com/ [email protected]/dist/index.css" |
| 6 | +/> |
5 | 7 |
|
6 |
| -const App = () => { |
7 |
| - return ( |
8 |
| - <TrieveModalSearch |
| 8 | +<script type="module"> |
| 9 | + import {renderToDiv} from 'https://unpkg.com/ [email protected]/dist/vanilla/index.js'; |
| 10 | + window.addEventListener('load', () => { |
| 11 | + const root = document.getElementById('root'); |
| 12 | + renderToDiv(root, |
9 | 13 | {% if params.apiKey -%}
|
10 |
| - apiKey="{{ params.apiKey }}" |
| 14 | + apiKey: "{{ params.apiKey }}", |
| 15 | + {% endif -%} |
| 16 | + {% if params.datasetId -%} |
| 17 | + datasetId: "{{ params.datasetId }}", |
11 | 18 | {% endif -%}
|
12 | 19 | {% if params.baseUrl -%}
|
13 |
| - baseUrl="{{ params.baseUrl }}" |
| 20 | + baseUrl: "{{ params.baseUrl }}", |
14 | 21 | {% endif -%}
|
15 | 22 | {% if params.type -%}
|
16 |
| - type="{{ params.type }}" |
| 23 | + type: "{{ params.type }}", |
17 | 24 | {% endif -%}
|
18 | 25 | {% if params.suggestedQueries -%}
|
19 |
| - suggestedQueries={{ params.suggestedQueries }} |
| 26 | + suggestedQueries: {{ params.suggestedQueries }}, |
20 | 27 | {% endif -%}
|
21 | 28 | {% if params.analytics -%}
|
22 |
| - analytics={{ params.analytics }} |
| 29 | + analytics: {{ params.analytics }}, |
23 | 30 | {% endif -%}
|
24 | 31 | {% if params.tags -%}
|
25 |
| - tags={{ params.tags }} |
| 32 | + tags: {{ params.tags }}, |
26 | 33 | {% endif -%}
|
27 | 34 | {% if params.responsive -%}
|
28 |
| - responsive={{ params.responsive }} |
| 35 | + responsive: {{ params.responsive }}, |
29 | 36 | {% endif -%}
|
30 | 37 | {% if params.chat -%}
|
31 |
| - chat="{{ params.chat}}" |
| 38 | + chat: "{{ params.chat}}", |
32 | 39 | {% endif -%}
|
33 | 40 | {% if params.theme -%}
|
34 |
| - theme="{{ params.theme }}" |
| 41 | + theme: "{{ params.theme }}", |
35 | 42 | {% endif -%}
|
36 | 43 | {% if params.search_options -%}
|
37 |
| - search_options={{ params.searchOptions }} |
| 44 | + search_options: {{ params.searchOptions }}, |
38 | 45 | {% endif -%}
|
39 | 46 | {% if params.brandLogoImgSrcUrl -%}
|
40 |
| - brandLogoImgSrcUrl="{{ params.brandLogoImgSrcUrl }}" |
| 47 | + brandLogoImgSrcUrl: "{{ params.brandLogoImgSrcUrl }}", |
41 | 48 | {% endif -%}
|
42 | 49 | {% if params.brandName -%}
|
43 |
| - brandName="{{ params.brandName }}" |
| 50 | + brandName: "{{ params.brandName }}", |
44 | 51 | {% endif -%}
|
45 | 52 | {% if params.problemLink -%}
|
46 |
| - problemLink="{{ params.problemLink }}" |
| 53 | + problemLink: "{{ params.problemLink }}", |
47 | 54 | {% endif -%}
|
48 | 55 | {% if params.brandColor -%}
|
49 |
| - brandColor="{{ params.brandColor }}" |
| 56 | + brandColor: "{{ params.brandColor }}", |
50 | 57 | {% endif -%}
|
51 | 58 | {% if params.placeholder -%}
|
52 |
| - placeholder="{{ params.placeholder }}" |
| 59 | + placeholder: "{{ params.placeholder }}", |
53 | 60 | {% endif -%}
|
54 | 61 | {% if params.defaultSearchQueries -%}
|
55 |
| - defaultSearchQueries={{ params.defaultSearchQueries }} |
| 62 | + defaultSearchQueries: {{ params.defaultSearchQueries }}, |
56 | 63 | {% endif -%}
|
57 | 64 | {% if params.defaultAiQuestions -%}
|
58 |
| - defaultAiQuestions={{ params.defaultAiQuestions }} |
| 65 | + defaultAiQuestions: {{ params.defaultAiQuestions }}, |
59 | 66 | {% endif -%}
|
60 | 67 | {% if params.defaultSearchMode -%}
|
61 |
| - defaultSearchMode="{{ params.defaultSearchMode }}" |
| 68 | + defaultSearchMode: "{{ params.defaultSearchMode }}", |
62 | 69 | {% endif -%}
|
63 | 70 | {% if params.useGroupSearch -%}
|
64 |
| - useGroupSearch={{ params.useGroupSearch }} |
| 71 | + useGroupSearch: {{ params.useGroupSearch }}, |
65 | 72 | {% endif -%}
|
66 | 73 | {% if params.allowSwitchingModes -%}
|
67 |
| - allowSwitchingModes={{ params.allowSwitchingModes }} |
| 74 | + allowSwitchingModes: {{ params.allowSwitchingModes }}, |
68 | 75 | {% endif -%}
|
69 | 76 | {% if params.defaultCurrency -%}
|
70 |
| - defaultCurrency="{{ params.defaultCurrency }}" |
| 77 | + defaultCurrency: "{{ params.defaultCurrency }}", |
71 | 78 | {% endif -%}
|
72 | 79 | {% if params.currencyPosition -%}
|
73 |
| - currencyPosition="{{ params.currencyPosition }}" |
| 80 | + currencyPosition: "{{ params.currencyPosition }}", |
74 | 81 | {% endif -%}
|
75 | 82 | {% if params.debounceMs -%}
|
76 |
| - debounceMs={{ params.debounceMs }} |
| 83 | + debounceMs: {{ params.debounceMs }}, |
77 | 84 | {% endif -%}
|
78 |
| - /> |
79 |
| - ); |
80 |
| -} </code> |
| 85 | + |
| 86 | + ) |
| 87 | + }); |
| 88 | +</script> |
| 89 | + |
| 90 | +</code> |
81 | 91 | </pre>
|
0 commit comments