buktiin 0.0.1 → 0.0.3

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 (2) hide show
  1. package/dist/widget.iife.js +168 -13
  2. package/package.json +1 -1
@@ -1,13 +1,168 @@
1
- (function(){"use strict";function a(n){const e=document.createElement("div");e.innerText=n,e.style.cssText=`
2
- position: fixed;
3
- bottom: 20px;
4
- left: 20px;
5
- background: #ffffff;
6
- color: #333;
7
- padding: 12px 16px;
8
- border-radius: 10px;
9
- box-shadow: 0 4px 14px rgba(0,0,0,.15);
10
- font-size: 14px;
11
- z-index: 9999;
12
- max-width: 280px;
13
- `,document.body.appendChild(e),setTimeout(()=>{e.remove()},4e3)}const o={messages:["Undangan Andi & Rina baru saja dibuat 💍","Pasangan dari Bandung baru saja mendaftar","Template 'Elegant Gold' sedang populer"],delay:3e3,interval:8e3};function i(){return{...o,...window.SocialProofConfig||{}}}(function(){const n=i();let e=0;function t(){a(n.messages[e%n.messages.length]),e++}setTimeout(()=>{t(),setInterval(t,n.interval)},n.delay)})()})();
1
+ (function(){"use strict";function p(i,t){const e=document.createElement("div");e.classList.add("bukt-container");const n=document.createElement("div");n.classList.add("bukt-main-content");const a=document.createElement("div");if(a.classList.add("bukt-thumbnail"),t){const r=document.createElement("img");r.src=t,a.appendChild(r)}else{const r=document.createElement("span");r.innerHTML="I&A",a.appendChild(r)}const o=document.createElement("div");o.classList.add("bukt-main");const c=document.createElement("p");c.classList.add("bukt-title"),c.innerHTML=i;const l=document.createElement("div");l.classList.add("bukt-info");const u=document.createElement("span");u.classList.add("bukt-desc"),u.innerHTML="Baru saja";const d=document.createElement("span");d.classList.add("bukt-stamp"),d.innerHTML="diverifikasi oleh ";const s=document.createElement("a");s.classList.add("bukt-brand"),s.href="https://buktiin.id",s.target="_blank",s.innerHTML="Buktiin",d.appendChild(s),l.appendChild(u),l.appendChild(d),o.appendChild(c),o.appendChild(l),n.appendChild(a),n.appendChild(o);const m=document.createElement("button");m.classList.add("bukt-close"),m.onclick=()=>e.remove(),e.appendChild(n),e.appendChild(m),document.body.appendChild(e),setTimeout(()=>{e.style.animation="bukt-fade-out 0.3s ease-in forwards",setTimeout(()=>e.remove(),300)},3500)}function b(){return document.currentScript?.dataset.site||null}async function h(i){const t="https://kgzpnnofxtxtaatwayvg.supabase.co",e="sb_publishable_4bdBlPzHrzcSiKzRyWd6Kw_WIn3zn2Y",n=`${t}/rest/v1/sites?id=eq.${i}&select=enabled,messages,interval,img_src`,a=await fetch(n,{headers:{apikey:e,Authorization:`Bearer ${e}`}});return a.ok&&(await a.json())[0]||null}(async function(){const i=b();if(!i){console.error("Site ID not found");return}const t=await h(i);if(!t){console.error("Site not found");return}if(!t.enabled){console.error("Site not enabled");return}let e=0;function n(){p(t.messages[e%t.messages.length],t.img_src),e++}setTimeout(()=>{n(),setInterval(n,t.interval)},500)})(),(function(){if(document.getElementById("bukt-style"))return;const t=document.createElement("style");t.id="bukt-style",t.innerHTML=`
2
+ @import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
3
+
4
+ @keyframes bukt-fade-in {
5
+ from {
6
+ opacity: 0;
7
+ transform: translateY(10px);
8
+ }
9
+ to {
10
+ opacity: 1;
11
+ transform: translateY(0);
12
+ }
13
+ }
14
+ @keyframes bukt-fade-out {
15
+ from {
16
+ opacity: 1;
17
+ }
18
+ to {
19
+ opacity: 0;
20
+ transform: translateY(10px);
21
+ }
22
+ }
23
+
24
+ .bukt-container {
25
+ box-sizing: border-box;
26
+ font-family: "Inter", sans-serif;
27
+ font-optical-sizing: auto;
28
+ font-style: normal;
29
+ position: fixed;
30
+ bottom: 2rem;
31
+ left: 0.5rem;
32
+ right: 0.5rem;
33
+ width: fit-content;
34
+ max-width: 480px;
35
+ margin: 0 auto;
36
+ background-color: #fff;
37
+ padding: 0.5rem;
38
+ border-radius: 0.5rem;
39
+ box-shadow: 1px 1px 8px 2px rgba(31, 31, 31, 0.2);
40
+ display: flex;
41
+ justify-content: space-between;
42
+ align-items: start;
43
+ gap: 0.5rem;
44
+
45
+ animation: bukt-fade-in 500ms ease-in-out;
46
+ transition-duration: 300ms;
47
+ }
48
+ .bukt-container :where(p, span) {
49
+ margin: 0;
50
+ padding: 0;
51
+ }
52
+ .bukt-main-content {
53
+ display: flex;
54
+ justify-content: start;
55
+ align-items: center;
56
+ gap: 0.5rem;
57
+ }
58
+ button.bukt-close {
59
+ padding: 0;
60
+ background-color: transparent;
61
+ border: none;
62
+ display: flex;
63
+ align-items: center;
64
+ justify-content: center;
65
+ cursor: pointer;
66
+ border-radius: 0.25rem;
67
+ }
68
+ button.bukt-close:hover {
69
+ background-color: #d5d5d5;
70
+ }
71
+ button.bukt-close::after {
72
+ content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2212%22%20viewBox%3D%220%200%2012%2012%22%20fill%3D%22none%22%20stroke%3D%22%23525252%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20class%3D%22icon%20icon-tabler%20icons-tabler-outline%20icon-tabler-x%22%3E%3Cpath%20stroke%3D%22none%22%20d%3D%22M0%200h12v12H0z%22%20fill%3D%22none%22%20stroke-width%3D%220.5%22%2F%3E%3Cpath%20d%3D%22m9%203%20-6%206%22%2F%3E%3Cpath%20d%3D%22m3%203%206%206%22%2F%3E%3C%2Fsvg%3E");
73
+ height: 0.75rem;
74
+ width: 0.75rem;
75
+ }
76
+ .bukt-thumbnail {
77
+ border-radius: 0.5rem;
78
+ display: flex;
79
+ justify-content: center;
80
+ align-items: center;
81
+ height: 52px;
82
+ width: auto;
83
+ aspect-ratio: 1;
84
+ }
85
+ .bukt-thumbnail > img {
86
+ width: 80%;
87
+ height: 80%;
88
+ object-fit: cover;
89
+ }
90
+ .bukt-thumbnail > span {
91
+ color: #1f1f1f;
92
+ }
93
+ .bukt-main {
94
+ display: flex;
95
+ flex-direction: column;
96
+ gap: 0.25rem;
97
+ }
98
+ .bukt-title {
99
+ font-size: 0.875rem;
100
+ font-weight: 600;
101
+ color: #1f1f1f;
102
+ display: -webkit-box;
103
+ -webkit-box-orient: vertical;
104
+ -webkit-line-clamp: 2;
105
+ line-clamp: 2;
106
+ overflow: hidden;
107
+ text-overflow: ellipsis;
108
+ }
109
+ .bukt-info {
110
+ display: flex;
111
+ justify-content: space-between;
112
+ align-items: center;
113
+ gap: 0.5rem;
114
+ color: #525252;
115
+ }
116
+ .bukt-desc {
117
+ font-size: 0.75rem;
118
+ font-weight: 400;
119
+ line-height: 1.25;
120
+ }
121
+ .bukt-stamp {
122
+ font-size: 0.5rem;
123
+ display: flex;
124
+ align-items: center;
125
+ justify-content: start;
126
+ gap: 2px;
127
+ }
128
+ .bukt-stamp > .bukt-brand {
129
+ font-weight: 500;
130
+ color: #0084d4;
131
+ text-decoration: none;
132
+ }
133
+ .bukt-stamp::before {
134
+ content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%2210%22%20viewBox%3D%220%200%2010%2010%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M4.99935%200C5.38824%202.36384e-05%205.76381%200.141685%206.05585%200.3985L6.13285%200.471L6.48185%200.82C6.57763%200.915156%206.7027%200.975227%206.83685%200.9905L6.90435%200.9945H7.40435C7.81295%200.994477%208.20609%201.15078%208.50313%201.43137C8.80017%201.71195%208.97861%202.09555%209.00185%202.5035L9.00435%202.5945V3.0945C9.00435%203.2295%209.05035%203.361%209.13335%203.466L9.17835%203.516L9.52685%203.865C9.81571%204.15222%209.98414%204.53881%209.99779%204.94593C10.0115%205.35306%209.86931%205.75006%209.60035%206.056L9.52785%206.133L9.17885%206.482C9.08369%206.57778%209.02362%206.70285%209.00835%206.837L9.00435%206.9045V7.4045C9.00437%207.81311%208.84806%208.20624%208.56748%208.50328C8.28689%208.80032%207.90329%208.97876%207.49535%209.002L7.40435%209.0045H6.90435C6.76954%209.00455%206.63867%209.04999%206.53285%209.1335L6.48285%209.1785L6.13385%209.527C5.84662%209.81586%205.46004%209.98429%205.05291%209.99795C4.64579%2010.0116%204.24878%209.86946%203.94285%209.6005L3.86585%209.528L3.51685%209.179C3.42107%209.08384%203.29599%209.02377%203.16185%209.0085L3.09435%209.0045H2.59435C2.18574%209.00452%201.7926%208.84822%201.49556%208.56763C1.19852%208.28705%201.02009%207.90345%200.996847%207.4955L0.994346%207.4045V6.9045C0.994302%206.76969%200.94886%206.63882%200.865347%206.533L0.820346%206.483L0.471846%206.134C0.182987%205.84678%200.0145579%205.46019%200.000900375%205.05307C-0.0127572%204.64594%200.129386%204.24894%200.398347%203.943L0.470847%203.866L0.819847%203.517C0.915002%203.42122%200.975073%203.29615%200.990347%203.162L0.994346%203.0945V2.5945L0.996847%202.5035C1.01917%202.11122%201.18506%201.74087%201.46289%201.46304C1.74072%201.18521%202.11107%201.01933%202.50335%200.997L2.59435%200.9945H3.09435C3.22916%200.994456%203.36002%200.949014%203.46585%200.8655L3.51585%200.8205L3.86485%200.472C4.01351%200.322444%204.19028%200.203753%204.38498%200.12275C4.57968%200.0417467%204.78847%203.0538e-05%204.99935%200ZM6.84785%203.641C6.75408%203.54726%206.62693%203.49461%206.49435%203.49461C6.36176%203.49461%206.23461%203.54726%206.14085%203.641L4.49435%205.287L3.84785%204.641L3.80085%204.5995C3.70035%204.52179%203.57404%204.48525%203.44758%204.4973C3.32112%204.50935%203.20399%204.56908%203.11997%204.66436C3.03595%204.75964%202.99135%204.88333%202.99523%205.01031C2.99911%205.13728%203.05117%205.25802%203.14085%205.348L4.14085%206.348L4.18785%206.3895C4.28405%206.46413%204.40417%206.50108%204.52569%206.49344C4.6472%206.4858%204.76175%206.43409%204.84785%206.348L6.84785%204.348L6.88935%204.301C6.96397%204.2048%207.00093%204.08467%206.99329%203.96316C6.98565%203.84165%206.93393%203.7271%206.84785%203.641Z%22%20fill%3D%22%230084D4%22%2F%3E%3C%2Fsvg%3E");
135
+ width: 10px;
136
+ height: 10px;
137
+ }
138
+
139
+ @media (min-width: 40rem) {
140
+ .bukt-container {
141
+ margin: 0;
142
+ bottom: 2rem;
143
+ left: 2rem;
144
+ }
145
+ button.bukt-close::after {
146
+ content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20stroke%3D%22%23525252%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20class%3D%22icon%20icon-tabler%20icons-tabler-outline%20icon-tabler-x%22%3E%3Cpath%20stroke%3D%22none%22%20d%3D%22M0%200h16v16H0z%22%20fill%3D%22none%22%20stroke-width%3D%220.6666666666666666%22%2F%3E%3Cpath%20d%3D%22M12%204%204%2012%22%2F%3E%3Cpath%20d%3D%22m4%204%208%208%22%2F%3E%3C%2Fsvg%3E");
147
+ height: 1rem;
148
+ width: 1rem;
149
+ }
150
+ .bukt-main {
151
+ gap: 0.5rem;
152
+ }
153
+ .bukt-title {
154
+ font-size: 1rem;
155
+ }
156
+ .bukt-desc {
157
+ font-size: 0.875rem;
158
+ }
159
+ .bukt-stamp {
160
+ font-size: 0.75rem;
161
+ }
162
+ .bukt-stamp::before {
163
+ content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22%230084D4%22%20class%3D%22icon%20icon-tabler%20icons-tabler-filled%20icon-tabler-rosette-discount-check%22%3E%3Cpath%20stroke%3D%22none%22%20d%3D%22M0%200h16v16H0z%22%20fill%3D%22none%22%20stroke-width%3D%220.6666666666666666%22%2F%3E%3Cpath%20d%3D%22M8.007%201.341a2.133%202.133%200%200%201%201.409%200.531l0.103%200.097%200.465%200.465a0.8%200.8%200%200%200%200.473%200.227L10.547%202.667h0.667a2.133%202.133%200%200%201%202.13%202.012l0.003%200.121v0.667c0%200.18%200.061%200.355%200.172%200.495l0.06%200.067%200.465%200.465a2.133%202.133%200%200%201%200.098%202.921l-0.097%200.103%20-0.465%200.465a0.8%200.8%200%200%200%20-0.227%200.473l-0.005%200.09v0.667a2.133%202.133%200%200%201%20-2.012%202.13l-0.121%200.003h-0.667a0.8%200.8%200%200%200%20-0.495%200.172l-0.067%200.06%20-0.465%200.465a2.133%202.133%200%200%201%20-2.921%200.098l-0.103%20-0.097%20-0.465%20-0.465a0.8%200.8%200%200%200%20-0.473%20-0.227L5.467%2013.347h-0.667a2.133%202.133%200%200%201%20-2.13%20-2.012L2.667%2011.213v-0.667a0.8%200.8%200%200%200%20-0.172%20-0.495l-0.06%20-0.067%20-0.465%20-0.465a2.133%202.133%200%200%201%20-0.098%20-2.921l0.097%20-0.103%200.465%20-0.465a0.8%200.8%200%200%200%200.227%20-0.473L2.667%205.467v-0.667l0.003%20-0.121a2.133%202.133%200%200%201%202.009%20-2.009L4.8%202.667h0.667a0.8%200.8%200%200%200%200.495%20-0.172l0.067%20-0.06%200.465%20-0.465a2.133%202.133%200%200%201%201.513%20-0.629m2.465%204.855a0.667%200.667%200%200%200%20-0.943%200L7.333%208.39l-0.862%20-0.861%20-0.063%20-0.055a0.667%200.667%200%200%200%20-0.88%200.998l1.333%201.333%200.063%200.055a0.667%200.667%200%200%200%200.88%20-0.055l2.667%20-2.667%200.055%20-0.063a0.667%200.667%200%200%200%20-0.055%20-0.88%22%2F%3E%3C%2Fsvg%3E");
164
+ width: 1rem;
165
+ height: 1rem;
166
+ }
167
+ }
168
+ `,document.head.appendChild(t)})()})();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "buktiin",
3
- "version": "0.0.1",
3
+ "version": "0.0.3",
4
4
  "description": "Social proof app to improve convertion rate",
5
5
  "main": "dist/widget.js",
6
6
  "files": [