@resulticks/trustsignal-wa-hsm 0.6.0 → 0.7.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/README.md +118 -94
- package/dist/resulticks-trustsignal-wa-hsm.cjs.js +27 -22
- package/dist/resulticks-trustsignal-wa-hsm.es.js +1161 -1148
- package/dist/style.css +1 -1
- package/package.json +2 -4
|
@@ -1,94 +1,99 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),C=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),C=require("react"),Me=async(a,s={})=>{try{return await Le(a.apiKey)}catch(r){return console.error("API Error:",r),{status:"error",message:r instanceof Error?r.message:"Failed to fetch templates"}}},Le=async a=>{const s=await fetch("https://wpapi.trustsignal.io/api/v1/template?page=1&limit=100",{method:"GET",headers:{Authorization:`Bearer ${a}`,"Content-Type":"application/json"}});if(!s.ok)throw new Error(`HTTP error! status: ${s.status}`);const r=await s.json();if(!r.success)throw new Error(r.message||"Failed to fetch templates");return{status:"success",data:r.templates.map(t=>({id:t.id,name:t.name,category:t.category,language:t.lang,type:t.temptype||"TEXT",body:t.temp_var_data||"",status:t.status,creation_time:new Date(t.created_at).getTime(),updation_time:new Date(t.modified_at).getTime(),medialist:t.medialist,shortlink:t.shortlink})),meta:{total:r.totalrecords,page:r.page,limit:r.limit}}};/**
|
|
2
2
|
* @license lucide-react v0.344.0 - ISC
|
|
3
3
|
*
|
|
4
4
|
* This source code is licensed under the ISC license.
|
|
5
5
|
* See the LICENSE file in the root directory of this source tree.
|
|
6
|
-
*/var
|
|
6
|
+
*/var Te={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};/**
|
|
7
7
|
* @license lucide-react v0.344.0 - ISC
|
|
8
8
|
*
|
|
9
9
|
* This source code is licensed under the ISC license.
|
|
10
10
|
* See the LICENSE file in the root directory of this source tree.
|
|
11
|
-
*/const
|
|
11
|
+
*/const Se=a=>a.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase().trim(),F=(a,s)=>{const r=C.forwardRef(({color:n="currentColor",size:t=24,strokeWidth:p=2,absoluteStrokeWidth:i,className:w="",children:b,...f},v)=>C.createElement("svg",{ref:v,...Te,width:t,height:t,stroke:n,strokeWidth:i?Number(p)*24/Number(t):p,className:["lucide",`lucide-${Se(a)}`,w].join(" "),...f},[...s.map(([S,c])=>C.createElement(S,c)),...Array.isArray(b)?b:[b]]));return r.displayName=`${a}`,r};/**
|
|
12
12
|
* @license lucide-react v0.344.0 - ISC
|
|
13
13
|
*
|
|
14
14
|
* This source code is licensed under the ISC license.
|
|
15
15
|
* See the LICENSE file in the root directory of this source tree.
|
|
16
|
-
*/const
|
|
16
|
+
*/const me=F("AlertCircle",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["line",{x1:"12",x2:"12",y1:"8",y2:"12",key:"1pkeuh"}],["line",{x1:"12",x2:"12.01",y1:"16",y2:"16",key:"4dfq90"}]]);/**
|
|
17
17
|
* @license lucide-react v0.344.0 - ISC
|
|
18
18
|
*
|
|
19
19
|
* This source code is licensed under the ISC license.
|
|
20
20
|
* See the LICENSE file in the root directory of this source tree.
|
|
21
|
-
*/const
|
|
21
|
+
*/const Ve=F("ArrowRight",[["path",{d:"M5 12h14",key:"1ays0h"}],["path",{d:"m12 5 7 7-7 7",key:"xquz4c"}]]);/**
|
|
22
22
|
* @license lucide-react v0.344.0 - ISC
|
|
23
23
|
*
|
|
24
24
|
* This source code is licensed under the ISC license.
|
|
25
25
|
* See the LICENSE file in the root directory of this source tree.
|
|
26
|
-
*/const
|
|
26
|
+
*/const Ue=F("ChevronLeft",[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]]);/**
|
|
27
27
|
* @license lucide-react v0.344.0 - ISC
|
|
28
28
|
*
|
|
29
29
|
* This source code is licensed under the ISC license.
|
|
30
30
|
* See the LICENSE file in the root directory of this source tree.
|
|
31
|
-
*/const
|
|
31
|
+
*/const Ae=F("ExternalLink",[["path",{d:"M15 3h6v6",key:"1q9fwt"}],["path",{d:"M10 14 21 3",key:"gplh6r"}],["path",{d:"M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6",key:"a6xqqp"}]]);/**
|
|
32
32
|
* @license lucide-react v0.344.0 - ISC
|
|
33
33
|
*
|
|
34
34
|
* This source code is licensed under the ISC license.
|
|
35
35
|
* See the LICENSE file in the root directory of this source tree.
|
|
36
|
-
*/const
|
|
36
|
+
*/const Re=F("FileText",[["path",{d:"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z",key:"1rqfz7"}],["path",{d:"M14 2v4a2 2 0 0 0 2 2h4",key:"tnqrlb"}],["path",{d:"M10 9H8",key:"b1mrlr"}],["path",{d:"M16 13H8",key:"t4e002"}],["path",{d:"M16 17H8",key:"z1uh3a"}]]);/**
|
|
37
37
|
* @license lucide-react v0.344.0 - ISC
|
|
38
38
|
*
|
|
39
39
|
* This source code is licensed under the ISC license.
|
|
40
40
|
* See the LICENSE file in the root directory of this source tree.
|
|
41
|
-
*/const
|
|
41
|
+
*/const Ie=F("FileVideo",[["path",{d:"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z",key:"1rqfz7"}],["path",{d:"M14 2v4a2 2 0 0 0 2 2h4",key:"tnqrlb"}],["path",{d:"m10 11 5 3-5 3v-6Z",key:"7ntvm4"}]]);/**
|
|
42
42
|
* @license lucide-react v0.344.0 - ISC
|
|
43
43
|
*
|
|
44
44
|
* This source code is licensed under the ISC license.
|
|
45
45
|
* See the LICENSE file in the root directory of this source tree.
|
|
46
|
-
*/const
|
|
46
|
+
*/const Be=F("Link",[["path",{d:"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71",key:"1cjeqo"}],["path",{d:"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71",key:"19qd67"}]]);/**
|
|
47
47
|
* @license lucide-react v0.344.0 - ISC
|
|
48
48
|
*
|
|
49
49
|
* This source code is licensed under the ISC license.
|
|
50
50
|
* See the LICENSE file in the root directory of this source tree.
|
|
51
|
-
*/const
|
|
51
|
+
*/const ie=F("MessageCircle",[["path",{d:"M7.9 20A9 9 0 1 0 4 16.1L2 22Z",key:"vv11sd"}]]);/**
|
|
52
52
|
* @license lucide-react v0.344.0 - ISC
|
|
53
53
|
*
|
|
54
54
|
* This source code is licensed under the ISC license.
|
|
55
55
|
* See the LICENSE file in the root directory of this source tree.
|
|
56
|
-
*/const
|
|
56
|
+
*/const Oe=F("Pencil",[["path",{d:"M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z",key:"5qss01"}],["path",{d:"m15 5 4 4",key:"1mk7zo"}]]);/**
|
|
57
57
|
* @license lucide-react v0.344.0 - ISC
|
|
58
58
|
*
|
|
59
59
|
* This source code is licensed under the ISC license.
|
|
60
60
|
* See the LICENSE file in the root directory of this source tree.
|
|
61
|
-
*/const
|
|
61
|
+
*/const je=F("Phone",[["path",{d:"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z",key:"foiqr5"}]]);/**
|
|
62
62
|
* @license lucide-react v0.344.0 - ISC
|
|
63
63
|
*
|
|
64
64
|
* This source code is licensed under the ISC license.
|
|
65
65
|
* See the LICENSE file in the root directory of this source tree.
|
|
66
|
-
*/const
|
|
66
|
+
*/const de=F("Plus",[["path",{d:"M5 12h14",key:"1ays0h"}],["path",{d:"M12 5v14",key:"s699le"}]]);/**
|
|
67
67
|
* @license lucide-react v0.344.0 - ISC
|
|
68
68
|
*
|
|
69
69
|
* This source code is licensed under the ISC license.
|
|
70
70
|
* See the LICENSE file in the root directory of this source tree.
|
|
71
|
-
*/const
|
|
71
|
+
*/const Pe=F("Reply",[["polyline",{points:"9 17 4 12 9 7",key:"hvgpf2"}],["path",{d:"M20 18v-2a4 4 0 0 0-4-4H4",key:"5vmcpk"}]]);/**
|
|
72
72
|
* @license lucide-react v0.344.0 - ISC
|
|
73
73
|
*
|
|
74
74
|
* This source code is licensed under the ISC license.
|
|
75
75
|
* See the LICENSE file in the root directory of this source tree.
|
|
76
|
-
*/const
|
|
76
|
+
*/const pe=F("Smile",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"M8 14s1.5 2 4 2 4-2 4-2",key:"1y1vjs"}],["line",{x1:"9",x2:"9.01",y1:"9",y2:"9",key:"yxxnd0"}],["line",{x1:"15",x2:"15.01",y1:"9",y2:"9",key:"1p4y9e"}]]);/**
|
|
77
77
|
* @license lucide-react v0.344.0 - ISC
|
|
78
78
|
*
|
|
79
79
|
* This source code is licensed under the ISC license.
|
|
80
80
|
* See the LICENSE file in the root directory of this source tree.
|
|
81
|
-
*/const
|
|
81
|
+
*/const ze=F("Trash2",[["path",{d:"M3 6h18",key:"d0wm0j"}],["path",{d:"M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6",key:"4alrt4"}],["path",{d:"M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2",key:"v07s0e"}],["line",{x1:"10",x2:"10",y1:"11",y2:"17",key:"1uufr5"}],["line",{x1:"14",x2:"14",y1:"11",y2:"17",key:"xtxkd"}]]);/**
|
|
82
82
|
* @license lucide-react v0.344.0 - ISC
|
|
83
83
|
*
|
|
84
84
|
* This source code is licensed under the ISC license.
|
|
85
85
|
* See the LICENSE file in the root directory of this source tree.
|
|
86
|
-
*/const
|
|
86
|
+
*/const De=F("Upload",[["path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4",key:"ih7n3h"}],["polyline",{points:"17 8 12 3 7 8",key:"t8dd8p"}],["line",{x1:"12",x2:"12",y1:"3",y2:"15",key:"widbto"}]]);/**
|
|
87
87
|
* @license lucide-react v0.344.0 - ISC
|
|
88
88
|
*
|
|
89
89
|
* This source code is licensed under the ISC license.
|
|
90
90
|
* See the LICENSE file in the root directory of this source tree.
|
|
91
|
-
*/const
|
|
92
|
-
${f.status.toLowerCase()==="approved"?"rsp-bg-green-100 rsp-text-green-800":f.status.toLowerCase()==="rejected"?"rsp-bg-red-100 rsp-text-red-800":"rsp-bg-yellow-100 rsp-text-yellow-800"}`,children:f.status})}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-700",children:f.creation_time?new Date(f.creation_time).toLocaleDateString():"N/A"}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-700",children:f.updation_time?new Date(f.updation_time).toLocaleDateString():"N/A"}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-700",children:f.medialist&&typeof f.medialist=="object"&&"header"in f.medialist&&f.medialist.header?e.jsxs("button",{onClick:()=>O(String(f.medialist.header||""),f.name),className:"rsp-inline-flex rsp-items-center rsp-px-3 rsp-py-1 rsp-rounded rsp-text-xs rsp-font-medium rsp-bg-blue-100 rsp-text-blue-800 hover:rsp-bg-blue-200 rsp-transition-colors",children:[e.jsxs("svg",{className:"rsp-w-3 rsp-h-3 rsp-mr-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:[e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 12a3 3 0 11-6 0 3 3 0 016 0z"}),e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"})]}),e.jsx("span",{children:"View Media"})]}):e.jsx("span",{className:"rsp-inline-flex rsp-px-2 rsp-py-1 rsp-rounded-full rsp-text-xs rsp-font-medium rsp-bg-gray-100 rsp-text-gray-800",children:"No Media"})}),e.jsx("td",{className:"rsp-px-6 rsp-py-4",children:e.jsxs("div",{className:"rsp-flex rsp-gap-2",children:[e.jsx("button",{onClick:()=>a(`/create?edit=${encodeURIComponent(String(f.id))}`),className:"rsp-inline-flex rsp-items-center rsp-justify-center rsp-w-8 rsp-h-8 rsp-rounded rsp-bg-blue-600 rsp-text-white hover:rsp-bg-blue-700 rsp-transition-colors",title:"Update",children:e.jsx(Oe,{className:"rsp-w-4 rsp-h-4"})}),e.jsx("button",{onClick:()=>j({isOpen:!0,templateId:String(f.id),templateName:f.name}),disabled:v===f.id,className:`rsp-inline-flex rsp-items-center rsp-justify-center rsp-w-8 rsp-h-8 rsp-rounded rsp-text-white rsp-transition-colors ${v===f.id?"rsp-bg-red-400":"rsp-bg-red-600 hover:rsp-bg-red-700"}`,title:v===f.id?"Deleting...":"Delete",children:e.jsx(ze,{className:"rsp-w-4 rsp-h-4"})})]})})]},f.id)):e.jsx("tr",{children:e.jsx("td",{colSpan:9,className:"rsp-px-6 rsp-py-8 rsp-text-center rsp-text-gray-500",children:"No templates found"})})})]})})}),I.length>0&&e.jsxs("div",{className:"rsp-flex rsp-justify-between rsp-items-center rsp-mt-6 rsp-px-6 rsp-py-4 rsp-bg-white rsp-rounded-lg rsp-shadow-sm rsp-border rsp-border-gray-200",children:[e.jsxs("div",{className:"rsp-text-sm rsp-text-gray-700",children:["Showing ",e.jsx("span",{className:"rsp-font-medium",children:L+1})," to ",e.jsx("span",{className:"rsp-font-medium",children:Math.min(A,x.length)})," of ",e.jsx("span",{className:"rsp-font-medium",children:x.length})," results"]}),e.jsxs("div",{className:"rsp-flex rsp-gap-2",children:[e.jsx("button",{onClick:()=>S(f=>Math.max(f-1,1)),disabled:h===1,className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-bg-white rsp-border rsp-border-gray-300 rsp-rounded-md hover:rsp-bg-gray-50 disabled:rsp-opacity-50 disabled:rsp-cursor-not-allowed rsp-transition-colors",children:"Previous"}),e.jsxs("span",{className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-gray-700",children:["Page ",h," of ",k]}),e.jsx("button",{onClick:()=>S(f=>Math.min(f+1,k)),disabled:h===k,className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-bg-white rsp-border rsp-border-gray-300 rsp-rounded-md hover:rsp-bg-gray-50 disabled:rsp-opacity-50 disabled:rsp-cursor-not-allowed rsp-transition-colors",children:"Next"})]})]}),e.jsx(ie,{isOpen:c.isOpen,onClose:R,title:`Media - ${c.templateName||"Template"}`,children:e.jsxs("div",{className:"rsp-space-y-4",children:[c.url&&e.jsxs("div",{className:"rsp-text-center",children:[e.jsxs("div",{className:"rsp-relative rsp-bg-gray-50 rsp-rounded-lg rsp-p-4 rsp-min-h-[200px] rsp-flex rsp-items-center rsp-justify-center",children:[e.jsx("img",{src:c.url,alt:"Template media",className:"rsp-max-w-full rsp-max-h-[400px] rsp-mx-auto rsp-rounded-lg rsp-shadow-md rsp-object-contain",onLoad:f=>{const T=f.currentTarget.parentElement,P=T==null?void 0:T.querySelector(".loading-placeholder");P&&(P.style.display="none")},onError:f=>{f.currentTarget.style.display="none";const T=f.currentTarget.parentElement,P=T==null?void 0:T.querySelector(".error-placeholder");P&&(P.style.display="block")}}),r&&e.jsx("div",{className:"loading-placeholder rsp-absolute rsp-inset-0 rsp-flex rsp-items-center rsp-justify-center",children:e.jsx("div",{className:"rsp-text-gray-500 rsp-text-sm",children:"Loading media..."})}),e.jsxs("div",{className:"error-placeholder rsp-absolute rsp-inset-0 rsp-flex rsp-flex-col rsp-items-center rsp-justify-center",style:{display:"none"},children:[e.jsx("svg",{className:"rsp-w-[100%] rsp-h-12 rsp-text-gray-400 rsp-m-2",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"})}),e.jsx("p",{className:"rsp-text-gray-500 rsp-text-sm rsp-mb-2",children:"Load media on new tab"})]})]}),e.jsxs("div",{className:"rsp-mt-4 rsp-p-3 rsp-bg-gray-50 rsp-rounded-lg",children:[e.jsx("p",{className:"rsp-text-xs rsp-text-gray-600 rsp-mb-1",children:"Media URL:"}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-800 rsp-break-all rsp-font-mono",children:c.url})]})]}),e.jsx("div",{className:"rsp-flex rsp-justify-end rsp-pt-4",children:e.jsxs("a",{href:c.url,target:"_blank",rel:"noopener noreferrer",className:"rsp-inline-flex rsp-items-center rsp-px-4 rsp-py-2 rsp-bg-blue-600 rsp-text-white rsp-text-sm rsp-font-medium rsp-rounded-md hover:rsp-bg-blue-700 rsp-transition-colors",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-mr-2",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"})}),"Open in New Tab"]})})]})}),e.jsx(ie,{isOpen:p.isOpen,onClose:()=>j({isOpen:!1}),title:"Delete Template",children:e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsxs("p",{className:"rsp-text-sm rsp-text-gray-700",children:["Are you sure you want to delete the template ",e.jsx("span",{className:"rsp-font-medium",children:p.templateName}),"?"]}),e.jsxs("div",{className:"rsp-flex rsp-justify-end rsp-gap-3",children:[e.jsx("button",{onClick:()=>j({isOpen:!1}),className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-bg-white rsp-border rsp-border-gray-300 rsp-rounded-md hover:rsp-bg-gray-50",children:"Cancel"}),e.jsx("button",{onClick:()=>p.templateId&&D(p.templateId),className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-white rsp-bg-red-600 rsp-rounded-md hover:rsp-bg-red-700",children:"Delete"})]})]})})]})}const qe=async(a,s)=>{var n,r,l,m,i,v,y;try{console.log("Creating template with data:",s);const p=s.language,j=s.headerType==="MEDIA"&&s.mediaType==="DOCUMENT",V=s.type==="CAROUSEL";let o="";j?o=Ne(s,p):V?o=Ce(s,p):o=Ee(s,p),console.log("Raw JSON string being sent:",o);const u={method:"POST",headers:{"Content-Type":"application/json"},body:o,redirect:"follow"};console.log("Making request to:",`https://wpapi.trustsignal.io/api/v1/template?api_key=${a}`),console.log("Request options:",u);const E=await fetch(`https://wpapi.trustsignal.io/api/v1/template?api_key=${a}`,u);console.log("Response status:",E.status),console.log("Response headers:",Object.fromEntries(E.headers.entries()));const b=await E.text();console.log("Raw response:",b);const w=JSON.parse(b);if(console.log("Parsed response:",w),!w.success)throw new Error(w.message||"Template creation failed");return{status:"success",message:"Template created successfully",data:{template:w.template,details:[{template_name:((n=w.template)==null?void 0:n.name)||s.name,template_id:((r=w.template)==null?void 0:r.id)||"unknown",meta_tid:(l=w.template)==null?void 0:l.meta_tid,status:(m=w.template)==null?void 0:m.status,quality:(i=w.template)==null?void 0:i.quality,temp_route:(v=w.template)==null?void 0:v.temp_route,temptype:(y=w.template)==null?void 0:y.temptype}]}}}catch(p){return console.error("TrustSignal API Error:",p),{status:"error",message:p instanceof Error?p.message:"Failed to create template"}}};function He(a){const s=a.language,n=a.headerType==="MEDIA"&&a.mediaType==="DOCUMENT",r=a.type==="CAROUSEL";return n?Ne(a,s):r?Ce(a,s):Ee(a,s)}const Ne=(a,s)=>{var m,i;const n={name:a.name,lang:s,category:a.category,components:[]};a.headerType==="MEDIA"&&a.mediaUrl&&(n.media={header:a.mediaUrl},n.components.push({type:"HEADER",format:"DOCUMENT"}));const r=Q(a.body),l={type:"BODY",text:a.body};if(r.length>0&&((m=a.sampleContent)!=null&&m.bodyVariables)){const v=fe(a,r);l.example={body_text:[v]}}if(n.components.push(l),(i=a.footer)!=null&&i.trim()&&n.components.push({type:"FOOTER",text:a.footer}),a.buttons&&a.buttons.length>0){const v=a.buttons.map(y=>{var j;const p={type:y.type==="CALL"?"PHONE_NUMBER":y.type,text:y.text};if(y.type==="URL"&&y.value&&(p.url=y.value,y.urlType==="dynamic"&&y.value.includes("{{"))){const V=Q(y.value);if(V.length>0&&((j=a.sampleContent)!=null&&j.buttonVariables)){const o=V.map(({number:u})=>{var E,b;return((b=(E=a.sampleContent)==null?void 0:E.buttonVariables)==null?void 0:b[u])||`sample${u}`});p.example=o}}return(y.type==="CALL"||y.type==="PHONE_NUMBER")&&y.value&&(p.phone_number=oe(y.value)),p});n.components.push({type:"BUTTONS",buttons:v})}return JSON.stringify(n)},Ce=(a,s)=>{var i,v,y;const n={name:a.name,lang:s,category:a.category,shortlink:a.enableClickTracking?"1":"0",components:[]};(i=a.carousel)!=null&&i.cards.length&&(n.media={},a.carousel.cards.forEach((p,j)=>{p.mediaUrl&&(n.media[`card${j}header`]=p.mediaUrl)}));const r=[],l=Q(a.body),m={type:"BODY",text:a.body,...l.length>0&&((v=a.sampleContent)==null?void 0:v.bodyVariables)&&{example:{body_text:[fe(a,l)]}}};if(r.push(m),(y=a.carousel)!=null&&y.cards.length){const p={type:"CAROUSEL",cards:a.carousel.cards.map(j=>{var V;return{components:[{type:"HEADER",format:((V=a.carousel)==null?void 0:V.type)||"IMAGE"},{type:"BODY",text:j.body,...Q(j.body).length>0&&{example:{body_text:[$e(j)]}}},...j.buttons.length>0?[{type:"BUTTONS",buttons:j.buttons.map(o=>{var E;const u={type:o.type==="CALL"?"PHONE_NUMBER":o.type,text:o.text};if(o.type==="URL"&&o.value&&(u.url=o.value,o.urlType==="dynamic"&&o.value.includes("{{"))){const b=Q(o.value);if(b.length>0){const w=((E=j==null?void 0:j.sampleContent)==null?void 0:E.buttonVariables)||{},t=b.map(({number:d})=>w[d]||`sample${d}`);u.example=t}}return(o.type==="CALL"||o.type==="PHONE_NUMBER")&&o.value&&(u.phone_number=oe(o.value)),console.log("Carousel card button data:",u),u})}]:[]]}})};r.push(p)}return n.components=r,JSON.stringify(n)},$e=a=>{var r;const s=Q(a.body||""),n=((r=a==null?void 0:a.sampleContent)==null?void 0:r.bodyVariables)||{};return s.map(({number:l})=>n[l]||`Sample ${l}`)},Ee=(a,s)=>{var i,v;const n={name:a.name,lang:s,category:a.category,shortlink:a.enableClickTracking?"1":"0",components:[]};a.headerType==="MEDIA"&&a.mediaUrl&&a.mediaType!=="DOCUMENT"&&(n.media={header:a.mediaUrl});const r=[];if(a.type!=="CAROUSEL"){if(a.headerType==="TEXT"&&a.headerText){const y=Q(a.headerText),p={type:"HEADER",format:"TEXT",text:a.headerText,...y.length>0&&((i=a.sampleContent)==null?void 0:i.headerVariables)&&{example:{header_text:Ge(a,y)}}};r.push(p)}else if(a.headerType==="MEDIA"){const y={type:"HEADER",format:a.mediaType||"IMAGE"};r.push(y)}}const l=Q(a.body),m={type:"BODY",text:a.body,...l.length>0&&((v=a.sampleContent)==null?void 0:v.bodyVariables)&&{example:{body_text:[fe(a,l)]}}};if(r.push(m),a.footer&&a.type!=="CAROUSEL"&&r.push({type:"FOOTER",text:a.footer}),a.buttons.length>0){const y=a.buttons.map(p=>{var V;const j={type:p.type==="CALL"?"PHONE_NUMBER":p.type,text:p.text};if(p.type==="URL"&&p.value&&(j.url=p.value,p.urlType==="dynamic"&&p.value.includes("{{"))){const o=Q(p.value);if(o.length>0&&((V=a.sampleContent)!=null&&V.buttonVariables)){const u=o.map(({number:E})=>{var b,w;return((w=(b=a.sampleContent)==null?void 0:b.buttonVariables)==null?void 0:w[E])||`sample${E}`});j.example=u}}return(p.type==="CALL"||p.type==="PHONE_NUMBER")&&p.value&&(j.phone_number=oe(p.value)),j});r.push({type:"BUTTONS",buttons:y})}return n.components=r,JSON.stringify(n)},Q=a=>(a.match(/\{\{(\d+)\}\}/g)||[]).map(n=>({variable:n.replace(/[{}]/g,""),number:n.replace(/[{}]/g,"")})),oe=a=>a.startsWith("+")?a:`+${a}`,Ge=(a,s)=>s.map(({number:n})=>{var r,l;return((l=(r=a.sampleContent)==null?void 0:r.headerVariables)==null?void 0:l[n])||`Sample ${n}`}),fe=(a,s)=>s.map(({number:n})=>{var r,l;return((l=(r=a.sampleContent)==null?void 0:r.bodyVariables)==null?void 0:l[n])||`Sample ${n}`}),We=async(a,s)=>{try{if(!s.name||!s.body)throw new Error("Missing required template fields: name and body are required");if(!a.apiKey)throw new Error("Missing TrustSignal API key");return await qe(a.apiKey,s)}catch(n){return console.error("API Error:",n),{status:"error",message:n instanceof Error?n.message:"An unexpected error occurred while creating the template"}}};async function Ke(a,s,n){const r=He(n),m={method:"POST",headers:{"Content-Type":"application/json"},body:r,redirect:"follow"},i=`https://wpapi.trustsignal.io/v1/user-templates/update/${encodeURIComponent(s)}?api_key=${encodeURIComponent(a)}`,v=await fetch(i,m),y=await v.text();if(!v.ok)return{success:!1,message:`Update failed (${v.status}): ${y}`,raw:r};try{const p=JSON.parse(y);return{success:!!((p==null?void 0:p.success)??!0),message:p==null?void 0:p.message,raw:r}}catch{return{success:!0,raw:r}}}async function Je(a,s){var v;const n=`https://wpapi.trustsignal.io/api/v1/template/${encodeURIComponent(s)}?api_key=${encodeURIComponent(a)}`,r=await fetch(n,{method:"GET",redirect:"follow"});if(!r.ok)throw new Error(`Failed to fetch template ${s}: ${r.status}`);const l=await r.text(),m=JSON.parse(l),i=m.template||((v=m.data)==null?void 0:v.template)||m;if(!i)throw new Error("Invalid template details response");return Xe(i)}function Xe(a){var j,V;const s={headerVariables:{},bodyVariables:{},buttonVariables:{}};let n="NONE",r="",l,m,i="",v="";const y=[];if(a.jsonstruct)try{const o=JSON.parse(a.jsonstruct);if(o!=null&&o.header){const u=o.header.format;u&&u!=="TEXT"?(n="MEDIA",l=u,m=o.header.url||((j=a.medialist)==null?void 0:j.header)):u==="TEXT"&&(n="TEXT",r=o.header.text||"")}if(o!=null&&o.body&&(i=o.body.text||""),(V=o==null?void 0:o.buttons)!=null&&V.buttons&&Array.isArray(o.buttons.buttons))for(const u of o.buttons.buttons){if(!u||!u.type||!u.text)continue;const E={id:te(),type:u.type==="PHONE_NUMBER"?"PHONE_NUMBER":u.type,text:u.text};u.type==="URL"&&(E.value=u.url,typeof u.url=="string"&&u.url.includes("{{")&&Array.isArray(u.example)?(ge(u.url).forEach((w,t)=>{s.buttonVariables[w]=u.example[t]??""}),E.urlType="dynamic"):E.urlType="static"),(u.type==="CALL"||u.type==="PHONE_NUMBER")&&(E.value=u.phone_number||""),y.push(E)}if(o!=null&&o.carousel){const u=Object.keys(o.carousel).filter(d=>/^card\d+$/.test(d));u.sort((d,g)=>{const h=parseInt(d.replace("card",""),10),S=parseInt(g.replace("card",""),10);return h-S});const E=u.map(d=>{const g=o.carousel[d]||{},h=g.header||{},S=g.body||{},B=g.buttons&&Array.isArray(g.buttons.buttons)?g.buttons.buttons:[],c=h.format,N=c==="IMAGE"||c==="VIDEO"||c==="DOCUMENT"?c:void 0,O=`card${d.replace("card","")}header`,R=h.url||(a.medialist?a.medialist[O]:void 0),D=S.text||"",x=[];for(const k of B){if(!k||!k.type||!k.text)continue;const L={id:te(),type:k.type==="PHONE_NUMBER"?"PHONE_NUMBER":k.type,text:k.text};k.type==="URL"&&(L.value=k.url,typeof k.url=="string"&&k.url.includes("{{")&&Array.isArray(k.example)?(ge(k.url).forEach((I,f)=>{}),L.urlType="dynamic"):L.urlType="static"),(k.type==="CALL"||k.type==="PHONE_NUMBER")&&(L.value=k.phone_number||""),x.push(L)}return{id:te(),headerType:N?"MEDIA":"NONE",mediaType:N,mediaUrl:R,body:D,buttons:x,sampleContent:{headerVariables:{},bodyVariables:{},buttonVariables:{}}}});let b="IMAGE";const w=E[0];(w==null?void 0:w.mediaType)==="VIDEO"&&(b="VIDEO");const t={type:b,cards:E};return{name:a.name,category:a.category==="MARKETING"||a.category==="UTILITY"?a.category:"MARKETING",type:"CAROUSEL",language:a.lang||"en",enableClickTracking:!1,headerType:"NONE",headerText:"",body:i,footer:v,buttons:[],sampleContent:s,carousel:t}}}catch(o){console.warn("Failed to parse jsonstruct; falling back",o)}return{name:a.name,category:a.category==="MARKETING"||a.category==="UTILITY"?a.category:"MARKETING",type:"BASIC",language:a.lang||"en",enableClickTracking:!1,headerType:n,headerText:r,mediaType:l,mediaUrl:m,body:i,footer:v,buttons:y,sampleContent:s}}function ge(a){if(!a)return[];const s=a.match(/\{\{(\d+)\}\}/g)||[];return[...new Set(s.map(n=>n.replace(/[{}]/g,"")))]}function te(){return typeof crypto<"u"&&"randomUUID"in crypto?crypto.randomUUID():"id-"+Math.random().toString(36).slice(2)}const Ye=[{value:"af",label:"Afrikaans"},{value:"sq",label:"Albanian"},{value:"ar",label:"Arabic"},{value:"az",label:"Azerbaijani"},{value:"bn",label:"Bengali"},{value:"bg",label:"Bulgarian"},{value:"ca",label:"Catalan"},{value:"zh_CN",label:"Chinese (CHN)"},{value:"zh_HK",label:"Chinese (HKG)"},{value:"zh_TW",label:"Chinese (TAI)"},{value:"hr",label:"Croatian"},{value:"cs",label:"Czech"},{value:"da",label:"Danish"},{value:"nl",label:"Dutch"},{value:"en_GB",label:"English (UK)"},{value:"en_US",label:"English (US)"},{value:"en",label:"English"},{value:"et",label:"Estonian"},{value:"fil",label:"Filipino"},{value:"fi",label:"Finnish"},{value:"fr",label:"French"},{value:"de",label:"German"},{value:"el",label:"Greek"},{value:"gu",label:"Gujarati"},{value:"he",label:"Hebrew"},{value:"hi",label:"Hindi"},{value:"hu",label:"Hungarian"},{value:"id",label:"Indonesian"},{value:"ga",label:"Irish"},{value:"it",label:"Italian"},{value:"ja",label:"Japanese"},{value:"kn",label:"Kannada"},{value:"kk",label:"Kazakh"},{value:"ko",label:"Korean"},{value:"lo",label:"Lao"},{value:"lv",label:"Latvian"},{value:"lt",label:"Lithuanian"},{value:"mk",label:"Macedonian"},{value:"ms",label:"Malay"},{value:"mr",label:"Marathi"},{value:"nb",label:"Norwegian"},{value:"fa",label:"Persian"},{value:"pl",label:"Polish"},{value:"pt_BR",label:"Portuguese (BR)"},{value:"pt_PT",label:"Portuguese (POR)"},{value:"pa",label:"Punjabi"},{value:"ro",label:"Romanian"},{value:"ru",label:"Russian"},{value:"sr",label:"Serbian"},{value:"sk",label:"Slovak"},{value:"sl",label:"Slovenian"},{value:"es",label:"Spanish"},{value:"es_AR",label:"Spanish (ARG)"},{value:"es_ES",label:"Spanish (SPA)"},{value:"es_MX",label:"Spanish (MEX)"},{value:"sw",label:"Swahili"},{value:"sv",label:"Swedish"},{value:"ta",label:"Tamil"},{value:"te",label:"Telugu"},{value:"th",label:"Thai"},{value:"tr",label:"Turkish"},{value:"uk",label:"Ukrainian"},{value:"ur",label:"Urdu"},{value:"uz",label:"Uzbek"},{value:"vi",label:"Vietnamese"}],Qe=[{value:"NONE",label:"None"},{value:"TEXT",label:"Text"},{value:"MEDIA",label:"Media"}],Ze=[{value:"IMAGE",label:"Image"},{value:"VIDEO",label:"Video"},{value:"DOCUMENT",label:"Document"}],ea=5*1024*1024,aa=16*1024*1024,sa=100*1024*1024,xe=["jpg","jpeg","png"],ce=["mp4","3gpp"],me=["pdf","docx","xlsx","pptx","txt"];function ra({template:a,setTemplate:s,onFileUpload:n}){var S,B;const[r,l]=C.useState(null),[m,i]=C.useState(!1),[v,y]=C.useState(null),[p,j]=C.useState(null),V=()=>{const N=(a.headerText||"").match(/{{\d+}}/g);if(!N)return 0;const U=N.map(O=>{const R=O.match(/{{(\d+)}}/);return R?parseInt(R[1],10):0});return U.length>0?Math.max(...U):0},o=()=>{const U=`{{${V()+1}}}`;if(v&&a.headerText.length+U.length<=60){const O=v.selectionStart||a.headerText.length,R=a.headerText.substring(0,O),D=a.headerText.substring(O),x=R+U+D;s({...a,headerText:x}),setTimeout(()=>{if(v){const k=O+U.length;v.setSelectionRange(k,k),v.focus()}},0)}},u=c=>{s(N=>({...N,headerType:c,headerText:c==="TEXT"?N.headerText:"",mediaType:c==="MEDIA"?N.mediaType||"IMAGE":void 0,mediaUrl:c==="MEDIA"?N.mediaUrl:void 0})),c!=="MEDIA"&&(l(null),j(null))},E=c=>{var N;return((N=c.split("?")[0].split(".").pop())==null?void 0:N.toLowerCase())||""},b=(c,N)=>{const U=E(c.name);switch(N){case"IMAGE":if(!xe.includes(U))return"Invalid format. Only JPG, JPEG, PNG are allowed.";if(c.size>ea)return"File is too large. Max size is 5 MB.";break;case"VIDEO":if(!ce.includes(U))return"Invalid format. Only MP4, 3GPP are allowed.";if(c.size>aa)return"File is too large. Max size is 16 MB.";break;case"DOCUMENT":if(!me.includes(U))return"Invalid format. Allowed types: PDF, DOCX, XLSX, PPTX, TXT.";if(c.size>sa)return"File is too large. Max size is 100 MB.";break;default:return"Invalid media type."}return null},w=(c,N)=>{if(!c)return null;const U=E(c);switch(N){case"IMAGE":if(!xe.includes(U))return"URL does not point to a valid image (JPG, JPEG, PNG).";break;case"VIDEO":if(!ce.includes(U))return"URL does not point to a valid video (MP4, 3GPP).";break;case"DOCUMENT":if(!me.includes(U))return"URL does not point to a valid document.";break}return null},t=()=>{l(null),s({...a,mediaUrl:""}),j(null)},d=async c=>{var O;const N=(O=c.target.files)==null?void 0:O[0];if(!N||!a.mediaType)return;j(null);const U=b(N,a.mediaType);if(U){j(U);return}i(!0),l(N);try{const R=await n(N);s({...a,mediaUrl:R})}catch(R){console.error("File upload failed:",R),t();const D=R instanceof Error?R.message:"File upload failed. Please try again.";j(D)}finally{i(!1)}},g=c=>{const N=c.target.value;if(l(null),s({...a,mediaUrl:N}),a.mediaType){const U=w(N,a.mediaType);j(U)}},h=()=>{switch(a.mediaType){case"IMAGE":return xe.map(c=>`.${c}`).join(",");case"VIDEO":return ce.map(c=>`.${c}`).join(",");case"DOCUMENT":return me.map(c=>`.${c}`).join(",");default:return"*/*"}};return e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Header Type"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("select",{value:a.headerType,onChange:c=>u(c.target.value),className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent rsp-appearance-none",children:Qe.map(c=>e.jsx("option",{value:c.value,children:c.label},c.value))}),e.jsx("div",{className:"rsp-absolute rsp-inset-y-0 rsp-right-0 rsp-flex rsp-items-center rsp-px-2 rsp-pointer-events-none",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-gray-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})}),e.jsx("div",{className:"rsp-absolute rsp-bottom-0 rsp-left-0 rsp-w-4 rsp-h-0.5 rsp-bg-red-500"})]})]}),a.headerType==="TEXT"&&e.jsxs("div",{className:"rsp-animate-fade-in",children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Header Text"}),e.jsx("div",{className:"rsp-relative",children:e.jsx("input",{ref:y,type:"text",value:a.headerText,onChange:c=>s({...a,headerText:c.target.value}),maxLength:60,className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent",placeholder:"Add a 60 character title to your message"})}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mt-2",children:[e.jsx("button",{onClick:o,className:"rsp-px-2 rsp-py-1 rsp-text-xs hover:rsp-bg-gray-100 rsp-rounded rsp-text-gray-500 rsp-flex rsp-items-center rsp-gap-1",title:"Add variable to header",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"})})}),e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-500",children:[a.headerText.length,"/60"]})]}),(()=>{const c=[...new Set((a.headerText.match(/\{\{(\d+)\}\}/g)||[]).map(N=>N.replace(/[{}]/g,"")))];return c.length===0?null:e.jsxs("div",{className:"rsp-mt-3",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-2",children:"Sample Values"}),e.jsx("div",{className:"rsp-grid rsp-grid-cols-3 rsp-gap-2",children:c.map(N=>{var U,O;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-xs rsp-text-gray-500 rsp-whitespace-nowrap",children:[`{{${N}}}`,":"]}),e.jsx("input",{type:"text",value:((O=(U=a.sampleContent)==null?void 0:U.headerVariables)==null?void 0:O[N])||"",onChange:R=>{var x,k,L;const D={...a.sampleContent,headerVariables:{...(x=a.sampleContent)==null?void 0:x.headerVariables,[N]:R.target.value},bodyVariables:((k=a.sampleContent)==null?void 0:k.bodyVariables)||{},buttonVariables:((L=a.sampleContent)==null?void 0:L.buttonVariables)||{}};s({...a,sampleContent:D})},className:"rsp-flex-1 rsp-px-2 rsp-py-1 rsp-border rsp-border-gray-300 rsp-rounded rsp-text-xs focus:rsp-outline-none focus:rsp-border-blue-500",placeholder:"Sample"}),e.jsx("button",{type:"button",onClick:()=>{var k,L,A;const R=new RegExp(`\\{\\{${N}\\}\\}`,"g"),D=(a.headerText||"").replace(R,""),x=Object.fromEntries(Object.entries(((k=a.sampleContent)==null?void 0:k.headerVariables)||{}).filter(([I])=>I!==N));s({...a,headerText:D,sampleContent:{...a.sampleContent,headerVariables:x,bodyVariables:((L=a.sampleContent)==null?void 0:L.bodyVariables)||{},buttonVariables:((A=a.sampleContent)==null?void 0:A.buttonVariables)||{}}})},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`header-sample-${N}`)})})]})})()]}),a.headerType==="MEDIA"&&e.jsxs("div",{className:"rsp-space-y-6 rsp-animate-fade-in",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Media Type"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("select",{value:a.mediaType||"IMAGE",onChange:c=>{s(N=>({...N,mediaType:c.target.value,mediaUrl:""})),l(null),j(null)},className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent rsp-appearance-none",children:Ze.map(c=>e.jsx("option",{value:c.value,children:c.label},c.value))}),e.jsx("div",{className:"rsp-absolute rsp-inset-y-0 rsp-right-0 rsp-flex rsp-items-center rsp-px-2 rsp-pointer-events-none",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-gray-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})})]})]}),e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700",children:"Media"}),a.mediaUrl?e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-p-3 rsp-bg-gray-50 rsp-border rsp-border-gray-200 rsp-rounded-md",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-space-x-3 overflow-hidden",children:[a.mediaType==="IMAGE"&&e.jsx("img",{src:a.mediaUrl,alt:"Preview",className:"rsp-w-12 rsp-h-12 rsp-object-cover rsp-rounded",onError:c=>{c.currentTarget.style.display="none",p||j("Could not load image preview from URL.")},onLoad:()=>{p!=null&&p.includes("Could not load")&&j(null)}}),a.mediaType==="VIDEO"&&e.jsx("div",{className:"rsp-w-12 rsp-h-12 rsp-bg-gray-200 rsp-rounded rsp-flex rsp-items-center rsp-justify-center flex-shrink-0",children:e.jsx(Ie,{className:"rsp-w-6 rsp-h-6 rsp-text-gray-500"})}),a.mediaType==="DOCUMENT"&&e.jsx("div",{className:"rsp-w-12 rsp-h-12 rsp-bg-gray-200 rsp-rounded rsp-flex rsp-items-center rsp-justify-center flex-shrink-0",children:e.jsx(Re,{className:"rsp-w-6 rsp-h-6 rsp-text-gray-500"})}),e.jsxs("div",{className:"overflow-hidden",children:[e.jsx("p",{className:"rsp-text-sm rsp-font-medium rsp-text-gray-900 rsp-truncate",children:r?r.name:a.mediaUrl}),r&&e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500",children:`${(r.size/1024/1024).toFixed(2)} MB`})]})]}),e.jsx("button",{onClick:t,className:"rsp-p-1 rsp-text-gray-400 hover:rsp-text-red-500 rsp-transition-colors flex-shrink-0",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})})]}):e.jsxs("div",{children:[e.jsx("input",{type:"file",accept:h(),onChange:d,className:"rsp-hidden",id:"media-upload",disabled:m}),e.jsxs("label",{htmlFor:"media-upload",className:`rsp-w-full rsp-px-4 rsp-py-3 rsp-border-2 rsp-border-dashed rsp-border-gray-300 rsp-rounded-md rsp-flex rsp-flex-col rsp-items-center rsp-justify-center rsp-cursor-pointer rsp-transition-colors hover:rsp-border-gray-400 hover:rsp-bg-gray-50 ${m?"rsp-opacity-50 rsp-cursor-not-allowed":""}`,children:[e.jsx(De,{className:"rsp-w-6 rsp-h-6 rsp-text-gray-400 rsp-mb-2"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-600",children:m?"Uploading...":`Upload ${((S=a.mediaType)==null?void 0:S.toLowerCase())||"file"}`}),e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-400 rsp-mt-1",children:[a.mediaType==="IMAGE"&&"JPG, PNG up to 5MB",a.mediaType==="VIDEO"&&"MP4, 3GPP up to 16MB",a.mediaType==="DOCUMENT"&&"PDF, DOCX, etc. up to 100MB"]})]})]}),p&&e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2 rsp-text-xs rsp-text-red-600",children:[e.jsx(de,{className:"rsp-w-4 rsp-h-4"}),e.jsx("span",{children:p})]}),e.jsxs("div",{className:"rsp-flex rsp-items-center",children:[e.jsx("div",{className:"rsp-flex-1 rsp-border-t rsp-border-gray-300"}),e.jsx("span",{className:"rsp-px-3 rsp-text-sm rsp-text-gray-500",children:"OR"}),e.jsx("div",{className:"rsp-flex-1 rsp-border-t rsp-border-gray-300"})]}),e.jsx("div",{className:"rsp-relative",children:e.jsx("input",{type:"url",value:a.mediaUrl||"",onChange:g,className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent",placeholder:`Enter ${(B=a.mediaType)==null?void 0:B.toLowerCase()} URL`})})]})]})]})}const ye=[{name:"grinning-face",hexadecimal:"😀"},{name:"grinning-face-with-smiling-eyes",hexadecimal:"😁"},{name:"face-with-tears-of-joy",hexadecimal:"😂"},{name:"rolling-on-the-floor-laughing",hexadecimal:"🤣"},{name:"smiling-face-with-open-mouth",hexadecimal:"😃"},{name:"smiling-face-with-open-mouth-and-smiling-eyes",hexadecimal:"😄"},{name:"smiling-face-with-open-mouth-and-cold-sweat",hexadecimal:"😅"},{name:"smiling-face-with-open-mouth-and-tightly-closed-eyes",hexadecimal:"😆"},{name:"winking-face",hexadecimal:"😉"},{name:"smiling-face-with-smiling-eyes",hexadecimal:"😊"},{name:"face-savouring-delicious-food",hexadecimal:"😋"},{name:"smiling-face-with-sunglasses",hexadecimal:"😎"},{name:"smiling-face-with-heart-shaped-eyes",hexadecimal:"😍"},{name:"face-throwing-a-kiss",hexadecimal:"😘"},{name:"kissing-face",hexadecimal:"😗"},{name:"kissing-face-with-smiling-eyes",hexadecimal:"😙"},{name:"kissing-face-with-closed-eyes",hexadecimal:"😚"},{name:"slightly-smiling-face",hexadecimal:"🙂"},{name:"hugging-face",hexadecimal:"🤗"},{name:"thinking-face",hexadecimal:"🤔"},{name:"neutral-face",hexadecimal:"😐"},{name:"expressionless-face",hexadecimal:"😑"},{name:"face-without-mouth",hexadecimal:"😶"},{name:"face-with-rolling-eyes",hexadecimal:"🙄"},{name:"smirking-face",hexadecimal:"😏"},{name:"persevering-face",hexadecimal:"😣"},{name:"disappointed-but-relieved-face",hexadecimal:"😥"},{name:"face-with-open-mouth",hexadecimal:"😮"},{name:"zipper-mouth-face",hexadecimal:"🤐"},{name:"hushed-face",hexadecimal:"😯"},{name:"sleepy-face",hexadecimal:"😪"},{name:"tired-face",hexadecimal:"😫"},{name:"sleeping-face",hexadecimal:"😴"},{name:"relieved-face",hexadecimal:"😌"},{name:"nerd-face",hexadecimal:"🤓"},{name:"face-with-stuck-out-tongue",hexadecimal:"😛"},{name:"face-with-stuck-out-tongue-and-winking-eye",hexadecimal:"😜"},{name:"face-with-stuck-out-tongue-and-tightly-closed-eyes",hexadecimal:"😝"},{name:"drooling-face",hexadecimal:"🤤"},{name:"unamused-face",hexadecimal:"😒"},{name:"face-with-cold-sweat",hexadecimal:"😓"},{name:"pensive-face",hexadecimal:"😔"},{name:"confused-face",hexadecimal:"😕"},{name:"upside-down-face",hexadecimal:"🙃"},{name:"money-mouth-face",hexadecimal:"🤑"},{name:"astonished-face",hexadecimal:"😲"},{name:"slightly-frowning-face",hexadecimal:"🙁"},{name:"confounded-face",hexadecimal:"😖"},{name:"disappointed-face",hexadecimal:"😞"},{name:"worried-face",hexadecimal:"😟"},{name:"face-with-look-of-triumph",hexadecimal:"😤"},{name:"crying-face",hexadecimal:"😢"},{name:"loudly-crying-face",hexadecimal:"😭"},{name:"frowning-face-with-open-mouth",hexadecimal:"😦"},{name:"anguished-face",hexadecimal:"😧"},{name:"fearful-face",hexadecimal:"😨"},{name:"weary-face",hexadecimal:"😩"},{name:"grimacing-face",hexadecimal:"😬"},{name:"face-with-open-mouth-and-cold-sweat",hexadecimal:"😰"},{name:"face-screaming-in-fear",hexadecimal:"😱"},{name:"flushed-face",hexadecimal:"😳"},{name:"dizzy-face",hexadecimal:"😵"},{name:"pouting-face",hexadecimal:"😡"},{name:"angry-face",hexadecimal:"😠"},{name:"smiling-face-with-halo",hexadecimal:"😇"},{name:"face-with-cowboy-hat",hexadecimal:"🤠"},{name:"clown-face",hexadecimal:"🤡"},{name:"lying-face",hexadecimal:"🤥"},{name:"face-with-medical-mask",hexadecimal:"😷"},{name:"face-with-thermometer",hexadecimal:"🤒"},{name:"face-with-head-bandage",hexadecimal:"🤕"},{name:"nauseated-face",hexadecimal:"🤢"},{name:"sneezing-face",hexadecimal:"🤧"},{name:"smiling-face-with-horns",hexadecimal:"😈"},{name:"imp",hexadecimal:"👿"},{name:"japanese-ogre",hexadecimal:"👹"},{name:"japanese-goblin",hexadecimal:"👺"},{name:"skull",hexadecimal:"💀"},{name:"skull-and-crossbones",hexadecimal:"☠"},{name:"ghost",hexadecimal:"👻"},{name:"extraterrestrial-alien",hexadecimal:"👽"},{name:"alien-monster",hexadecimal:"👾"},{name:"robot-face",hexadecimal:"🤖"},{name:"pile-of-poo",hexadecimal:"💩"},{name:"smiling-cat-face-with-open-mouth",hexadecimal:"😺"},{name:"grinning-cat-face-with-smiling-eyes",hexadecimal:"😸"},{name:"cat-face-with-tears-of-joy",hexadecimal:"😹"},{name:"smiling-cat-face-with-heart-shaped-eyes",hexadecimal:"😻"},{name:"cat-face-with-wry-smile",hexadecimal:"😼"},{name:"kissing-cat-face-with-closed-eyes",hexadecimal:"😽"},{name:"weary-cat-face",hexadecimal:"🙀"},{name:"crying-cat-face",hexadecimal:"😿"},{name:"pouting-cat-face",hexadecimal:"😾"},{name:"see-no-evil-monkey",hexadecimal:"🙈"},{name:"hear-no-evil-monkey",hexadecimal:"🙉"},{name:"speak-no-evil-monkey",hexadecimal:"🙊"},{name:"boy",hexadecimal:"👦"},{name:"boy-type-1-2",hexadecimal:"👦🏻"},{name:"boy-type-3",hexadecimal:"👦🏼"},{name:"boy-type-4",hexadecimal:"👦🏽"},{name:"boy-type-5",hexadecimal:"👦🏾"},{name:"boy-type-6",hexadecimal:"👦🏿"},{name:"girl",hexadecimal:"👧"},{name:"girl-type-1-2",hexadecimal:"👧🏻"},{name:"girl-type-3",hexadecimal:"👧🏼"},{name:"girl-type-4",hexadecimal:"👧🏽"},{name:"girl-type-5",hexadecimal:"👧🏾"},{name:"girl-type-6",hexadecimal:"👧🏿"},{name:"man",hexadecimal:"👨"},{name:"man-type-1-2",hexadecimal:"👨🏻"},{name:"man-type-3",hexadecimal:"👨🏼"},{name:"man-type-4",hexadecimal:"👨🏽"},{name:"man-type-5",hexadecimal:"👨🏾"},{name:"man-type-6",hexadecimal:"👨🏿"},{name:"woman",hexadecimal:"👩"},{name:"woman-type-1-2",hexadecimal:"👩🏻"},{name:"woman-type-3",hexadecimal:"👩🏼"},{name:"woman-type-4",hexadecimal:"👩🏽"},{name:"woman-type-5",hexadecimal:"👩🏾"},{name:"woman-type-6",hexadecimal:"👩🏿"},{name:"older-man",hexadecimal:"👴"},{name:"old-man-type-1-2",hexadecimal:"👴🏻"},{name:"old-man-type-3",hexadecimal:"👴🏼"},{name:"old-man-type-4",hexadecimal:"👴🏽"},{name:"old-man-type-5",hexadecimal:"👴🏾"},{name:"old-man-type-6",hexadecimal:"👴🏿"},{name:"older-woman",hexadecimal:"👵"},{name:"old-woman-type-1-2",hexadecimal:"👵🏻"},{name:"old-woman-type-3",hexadecimal:"👵🏼"},{name:"old-woman-type-4",hexadecimal:"👵🏽"},{name:"old-woman-type-5",hexadecimal:"👵🏾"},{name:"old-woman-type-6",hexadecimal:"👵🏿"},{name:"baby",hexadecimal:"👶"},{name:"baby-type-1-2",hexadecimal:"👶🏻"},{name:"baby-type-3",hexadecimal:"👶🏼"},{name:"baby-type-4",hexadecimal:"👶🏽"},{name:"baby-type-5",hexadecimal:"👶🏾"},{name:"baby-type-6",hexadecimal:"👶🏿"},{name:"baby-angel",hexadecimal:"👼"},{name:"baby-angel-type-1-2",hexadecimal:"👼🏻"},{name:"baby-angel-type-3",hexadecimal:"👼🏼"},{name:"baby-angel-type-4",hexadecimal:"👼🏽"},{name:"baby-angel-type-5",hexadecimal:"👼🏾"},{name:"baby-angel-type-6",hexadecimal:"👼🏿"},{name:"police-officer",hexadecimal:"👮"},{name:"police-officer-type-1-2",hexadecimal:"👮🏻"},{name:"police-officer-type-3",hexadecimal:"👮🏼"},{name:"police-officer-type-4",hexadecimal:"👮🏽"},{name:"police-officer-type-5",hexadecimal:"👮🏾"},{name:"police-officer-type-6",hexadecimal:"👮🏿"},{name:"sleuth-or-spy",hexadecimal:"🕵"},{name:"detective-type-1-2",hexadecimal:"🕵🏻"},{name:"detective-type-3",hexadecimal:"🕵🏼"},{name:"detective-type-4",hexadecimal:"🕵🏽"},{name:"detective-type-5",hexadecimal:"🕵🏾"},{name:"detective-type-6",hexadecimal:"🕵🏿"},{name:"guardsman",hexadecimal:"💂"},{name:"guardsman-type-1-2",hexadecimal:"💂🏻"},{name:"guardsman-type-3",hexadecimal:"💂🏼"},{name:"guardsman-type-4",hexadecimal:"💂🏽"},{name:"guardsman-type-5",hexadecimal:"💂🏾"},{name:"guardsman-type-6",hexadecimal:"💂🏿"},{name:"construction-worker",hexadecimal:"👷"},{name:"construction-worker-type-1-2",hexadecimal:"👷🏻"},{name:"construction-worker-type-3",hexadecimal:"👷🏼"},{name:"construction-worker-type-4",hexadecimal:"👷🏽"},{name:"construction-worker-type-5",hexadecimal:"👷🏾"},{name:"construction-worker-type-6",hexadecimal:"👷🏿"},{name:"man-with-turban",hexadecimal:"👳"},{name:"person-with-turban-type-1-2",hexadecimal:"👳🏻"},{name:"person-with-turban-type-3",hexadecimal:"👳🏼"},{name:"person-with-turban-type-4",hexadecimal:"👳🏽"},{name:"person-with-turban-type-5",hexadecimal:"👳🏾"},{name:"person-with-turban-type-6",hexadecimal:"👳🏿"},{name:"person-with-blond-hair",hexadecimal:"👱"},{name:"blond-person-type-1-2",hexadecimal:"👱🏻"},{name:"blond-person-type-3",hexadecimal:"👱🏼"},{name:"blond-person-type-4",hexadecimal:"👱🏽"},{name:"blond-person-type-5",hexadecimal:"👱🏾"},{name:"blond-person-type-6",hexadecimal:"👱🏿"},{name:"father-christmas",hexadecimal:"🎅"},{name:"santa-claus-type-1-2",hexadecimal:"🎅🏻"},{name:"santa-claus-type-3",hexadecimal:"🎅🏼"},{name:"santa-claus-type-4",hexadecimal:"🎅🏽"},{name:"santa-claus-type-5",hexadecimal:"🎅🏾"},{name:"santa-claus-type-6",hexadecimal:"🎅🏿"},{name:"mother-christmas",hexadecimal:"🤶"},{name:"mother-christmas-type-1-2",hexadecimal:"🤶🏻"},{name:"mother-christmas-type-3",hexadecimal:"🤶🏼"},{name:"mother-christmas-type-4",hexadecimal:"🤶🏽"},{name:"mother-christmas-type-5",hexadecimal:"🤶🏾"},{name:"mother-christmas-type-6",hexadecimal:"🤶🏿"},{name:"princess",hexadecimal:"👸"},{name:"princess-type-1-2",hexadecimal:"👸🏻"},{name:"princess-type-3",hexadecimal:"👸🏼"},{name:"princess-type-4",hexadecimal:"👸🏽"},{name:"princess-type-5",hexadecimal:"👸🏾"},{name:"princess-type-6",hexadecimal:"👸🏿"},{name:"prince",hexadecimal:"🤴"},{name:"prince-type-1-2",hexadecimal:"🤴🏻"},{name:"prince-type-3",hexadecimal:"🤴🏼"},{name:"prince-type-4",hexadecimal:"🤴🏽"},{name:"prince-type-5",hexadecimal:"🤴🏾"},{name:"prince-type-6",hexadecimal:"🤴🏿"},{name:"bride-with-veil",hexadecimal:"👰"},{name:"bride-with-veil-type-1-2",hexadecimal:"👰🏻"},{name:"bride-with-veil-type-3",hexadecimal:"👰🏼"},{name:"bride-with-veil-type-4",hexadecimal:"👰🏽"},{name:"bride-with-veil-type-5",hexadecimal:"👰🏾"},{name:"bride-with-veil-type-6",hexadecimal:"👰🏿"},{name:"man-in-tuxedo",hexadecimal:"🤵"},{name:"man-in-tuxedo-type-1-2",hexadecimal:"🤵🏻"},{name:"man-in-tuxedo-type-3",hexadecimal:"🤵🏼"},{name:"man-in-tuxedo-type-4",hexadecimal:"🤵🏽"},{name:"man-in-tuxedo-type-5",hexadecimal:"🤵🏾"},{name:"man-in-tuxedo-type-6",hexadecimal:"🤵🏿"},{name:"pregnant-woman",hexadecimal:"🤰"},{name:"pregnant-woman-type-1-2",hexadecimal:"🤰🏻"},{name:"pregnant-woman-type-3",hexadecimal:"🤰🏼"},{name:"pregnant-woman-type-4",hexadecimal:"🤰🏽"},{name:"pregnant-woman-type-5",hexadecimal:"🤰🏾"},{name:"pregnant-woman-type-6",hexadecimal:"🤰🏿"},{name:"man-with-gua-pi-mao",hexadecimal:"👲"},{name:"man-with-chinese-cap-type-1-2",hexadecimal:"👲🏻"},{name:"man-with-chinese-cap-type-3",hexadecimal:"👲🏼"},{name:"man-with-chinese-cap-type-4",hexadecimal:"👲🏽"},{name:"man-with-chinese-cap-type-5",hexadecimal:"👲🏾"},{name:"man-with-chinese-cap-type-6",hexadecimal:"👲🏿"},{name:"person-frowning",hexadecimal:"🙍"},{name:"person-frowning-type-1-2",hexadecimal:"🙍🏻"},{name:"person-frowning-type-3",hexadecimal:"🙍🏼"},{name:"person-frowning-type-4",hexadecimal:"🙍🏽"},{name:"person-frowning-type-5",hexadecimal:"🙍🏾"},{name:"person-frowning-type-6",hexadecimal:"🙍🏿"},{name:"person-with-pouting-face",hexadecimal:"🙎"},{name:"person-pouting-type-1-2",hexadecimal:"🙎🏻"},{name:"person-pouting-type-3",hexadecimal:"🙎🏼"},{name:"person-pouting-type-4",hexadecimal:"🙎🏽"},{name:"person-pouting-type-5",hexadecimal:"🙎🏾"},{name:"person-pouting-type-6",hexadecimal:"🙎🏿"},{name:"face-with-no-good-gesture",hexadecimal:"🙅"},{name:"person-gesturing-not-ok-type-1-2",hexadecimal:"🙅🏻"},{name:"person-gesturing-not-ok-type-3",hexadecimal:"🙅🏼"},{name:"person-gesturing-not-ok-type-4",hexadecimal:"🙅🏽"},{name:"person-gesturing-not-ok-type-5",hexadecimal:"🙅🏾"},{name:"person-gesturing-not-ok-type-6",hexadecimal:"🙅🏿"},{name:"face-with-ok-gesture",hexadecimal:"🙆"},{name:"person-gesturing-ok-type-1-2",hexadecimal:"🙆🏻"},{name:"person-gesturing-ok-type-3",hexadecimal:"🙆🏼"},{name:"person-gesturing-ok-type-4",hexadecimal:"🙆🏽"},{name:"person-gesturing-ok-type-5",hexadecimal:"🙆🏾"},{name:"person-gesturing-ok-type-6",hexadecimal:"🙆🏿"},{name:"information-desk-person",hexadecimal:"💁"},{name:"person-tipping-hand-type-1-2",hexadecimal:"💁🏻"},{name:"person-tipping-hand-type-3",hexadecimal:"💁🏼"},{name:"person-tipping-hand-type-4",hexadecimal:"💁🏽"},{name:"person-tipping-hand-type-5",hexadecimal:"💁🏾"},{name:"person-tipping-hand-type-6",hexadecimal:"💁🏿"},{name:"happy-person-raising-one-hand",hexadecimal:"🙋"},{name:"person-raising-hand-type-1-2",hexadecimal:"🙋🏻"},{name:"person-raising-hand-type-3",hexadecimal:"🙋🏼"},{name:"person-raising-hand-type-4",hexadecimal:"🙋🏽"},{name:"person-raising-hand-type-5",hexadecimal:"🙋🏾"},{name:"person-raising-hand-type-6",hexadecimal:"🙋🏿"},{name:"person-bowing-deeply",hexadecimal:"🙇"},{name:"person-bowing-type-1-2",hexadecimal:"🙇🏻"},{name:"person-bowing-type-3",hexadecimal:"🙇🏼"},{name:"person-bowing-type-4",hexadecimal:"🙇🏽"},{name:"person-bowing-type-5",hexadecimal:"🙇🏾"},{name:"person-bowing-type-6",hexadecimal:"🙇🏿"},{name:"face-palm",hexadecimal:"🤦"},{name:"person-facepalming-type-1-2",hexadecimal:"🤦🏻"},{name:"person-facepalming-type-3",hexadecimal:"🤦🏼"},{name:"person-facepalming-type-4",hexadecimal:"🤦🏽"},{name:"person-facepalming-type-5",hexadecimal:"🤦🏾"},{name:"person-facepalming-type-6",hexadecimal:"🤦🏿"},{name:"shrug",hexadecimal:"🤷"},{name:"person-shrugging-type-1-2",hexadecimal:"🤷🏻"},{name:"person-shrugging-type-3",hexadecimal:"🤷🏼"},{name:"person-shrugging-type-4",hexadecimal:"🤷🏽"},{name:"person-shrugging-type-5",hexadecimal:"🤷🏾"},{name:"person-shrugging-type-6",hexadecimal:"🤷🏿"},{name:"face-massage",hexadecimal:"💆"},{name:"person-getting-massage-type-1-2",hexadecimal:"💆🏻"},{name:"person-getting-massage-type-3",hexadecimal:"💆🏼"},{name:"person-getting-massage-type-4",hexadecimal:"💆🏽"},{name:"person-getting-massage-type-5",hexadecimal:"💆🏾"},{name:"person-getting-massage-type-6",hexadecimal:"💆🏿"},{name:"haircut",hexadecimal:"💇"},{name:"person-getting-haircut-type-1-2",hexadecimal:"💇🏻"},{name:"person-getting-haircut-type-3",hexadecimal:"💇🏼"},{name:"person-getting-haircut-type-4",hexadecimal:"💇🏽"},{name:"person-getting-haircut-type-5",hexadecimal:"💇🏾"},{name:"person-getting-haircut-type-6",hexadecimal:"💇🏿"},{name:"pedestrian",hexadecimal:"🚶"},{name:"person-walking-type-1-2",hexadecimal:"🚶🏻"},{name:"person-walking-type-3",hexadecimal:"🚶🏼"},{name:"person-walking-type-4",hexadecimal:"🚶🏽"},{name:"person-walking-type-5",hexadecimal:"🚶🏾"},{name:"person-walking-type-6",hexadecimal:"🚶🏿"},{name:"runner",hexadecimal:"🏃"},{name:"person-running-type-1-2",hexadecimal:"🏃🏻"},{name:"person-running-type-3",hexadecimal:"🏃🏼"},{name:"person-running-type-4",hexadecimal:"🏃🏽"},{name:"person-running-type-5",hexadecimal:"🏃🏾"},{name:"person-running-type-6",hexadecimal:"🏃🏿"},{name:"dancer",hexadecimal:"💃"},{name:"woman-dancing-type-1-2",hexadecimal:"💃🏻"},{name:"woman-dancing-type-3",hexadecimal:"💃🏼"},{name:"woman-dancing-type-4",hexadecimal:"💃🏽"},{name:"woman-dancing-type-5",hexadecimal:"💃🏾"},{name:"woman-dancing-type-6",hexadecimal:"💃🏿"},{name:"man-dancing",hexadecimal:"🕺"},{name:"man-dancing-type-1-2",hexadecimal:"🕺🏻"},{name:"man-dancing-type-3",hexadecimal:"🕺🏼"},{name:"man-dancing-type-4",hexadecimal:"🕺🏽"},{name:"man-dancing-type-5",hexadecimal:"🕺🏾"},{name:"man-dancing-type-6",hexadecimal:"🕺🏿"},{name:"woman-with-bunny-ears",hexadecimal:"👯"},{name:"man-in-business-suit-levitating",hexadecimal:"🕴"},{name:"speaking-head-in-silhouette",hexadecimal:"🗣"},{name:"bust-in-silhouette",hexadecimal:"👤"},{name:"busts-in-silhouette",hexadecimal:"👥"},{name:"man-and-woman-holding-hands",hexadecimal:"👫"},{name:"two-men-holding-hands",hexadecimal:"👬"},{name:"two-women-holding-hands",hexadecimal:"👭"},{name:"kiss",hexadecimal:"💏"},{name:"kiss-woman-man",hexadecimal:"👩‍❤️‍💋‍👨"},{name:"kiss-man-man",hexadecimal:"👨‍❤️‍💋‍👨"},{name:"kiss-woman-woman",hexadecimal:"👩‍❤️‍💋‍👩"},{name:"couple-with-heart",hexadecimal:"💑"},{name:"couple-with-heart-woman-man",hexadecimal:"👩‍❤️‍👨"},{name:"couple-with-heart-man-man",hexadecimal:"👨‍❤️‍👨"},{name:"couple-with-heart-woman-woman",hexadecimal:"👩‍❤️‍👩"},{name:"family",hexadecimal:"👪"},{name:"family-man-woman-boy",hexadecimal:"👨‍👩‍👦"},{name:"family-man-woman-girl",hexadecimal:"👨‍👩‍👧"},{name:"family-man-woman-girl-boy",hexadecimal:"👨‍👩‍👧‍👦"},{name:"family-man-woman-boy-boy",hexadecimal:"👨‍👩‍👦‍👦"},{name:"family-man-woman-girl-girl",hexadecimal:"👨‍👩‍👧‍👧"},{name:"family-man-man-boy",hexadecimal:"👨‍👨‍👦"},{name:"family-man-man-girl",hexadecimal:"👨‍👨‍👧"},{name:"family-man-man-girl-boy",hexadecimal:"👨‍👨‍👧‍👦"},{name:"family-man-man-boy-boy",hexadecimal:"👨‍👨‍👦‍👦"},{name:"family-man-man-girl-girl",hexadecimal:"👨‍👨‍👧‍👧"},{name:"family-woman-woman-boy",hexadecimal:"👩‍👩‍👦"},{name:"family-woman-woman-girl",hexadecimal:"👩‍👩‍👧"},{name:"family-woman-woman-girl-boy",hexadecimal:"👩‍👩‍👧‍👦"},{name:"family-woman-woman-boy-boy",hexadecimal:"👩‍👩‍👦‍👦"},{name:"family-woman-woman-girl-girl",hexadecimal:"👩‍👩‍👧‍👧"},{name:"emoji-modifier-fitzpatrick-type-1-2",hexadecimal:"🏻"},{name:"emoji-modifier-fitzpatrick-type-3",hexadecimal:"🏼"},{name:"emoji-modifier-fitzpatrick-type-4",hexadecimal:"🏽"},{name:"emoji-modifier-fitzpatrick-type-5",hexadecimal:"🏾"},{name:"emoji-modifier-fitzpatrick-type-6",hexadecimal:"🏿"},{name:"flexed-biceps",hexadecimal:"💪"},{name:"flexed-biceps-type-1-2",hexadecimal:"💪🏻"},{name:"flexed-biceps-type-3",hexadecimal:"💪🏼"},{name:"flexed-biceps-type-4",hexadecimal:"💪🏽"},{name:"flexed-biceps-type-5",hexadecimal:"💪🏾"},{name:"flexed-biceps-type-6",hexadecimal:"💪🏿"},{name:"selfie",hexadecimal:"🤳"},{name:"selfie-type-1-2",hexadecimal:"🤳🏻"},{name:"selfie-type-3",hexadecimal:"🤳🏼"},{name:"selfie-type-4",hexadecimal:"🤳🏽"},{name:"selfie-type-5",hexadecimal:"🤳🏾"},{name:"selfie-type-6",hexadecimal:"🤳🏿"},{name:"white-left-pointing-backhand-index",hexadecimal:"👈"},{name:"backhand-index-pointing-left-type-1-2",hexadecimal:"👈🏻"},{name:"backhand-index-pointing-left-type-3",hexadecimal:"👈🏼"},{name:"backhand-index-pointing-left-type-4",hexadecimal:"👈🏽"},{name:"backhand-index-pointing-left-type-5",hexadecimal:"👈🏾"},{name:"backhand-index-pointing-left-type-6",hexadecimal:"👈🏿"},{name:"white-right-pointing-backhand-index",hexadecimal:"👉"},{name:"backhand-index-pointing-right-type-1-2",hexadecimal:"👉🏻"},{name:"backhand-index-pointing-right-type-3",hexadecimal:"👉🏼"},{name:"backhand-index-pointing-right-type-4",hexadecimal:"👉🏽"},{name:"backhand-index-pointing-right-type-5",hexadecimal:"👉🏾"},{name:"backhand-index-pointing-right-type-6",hexadecimal:"👉🏿"},{name:"white-up-pointing-index",hexadecimal:"☝"},{name:"index-pointing-up-type-1-2",hexadecimal:"☝🏻"},{name:"index-pointing-up-type-3",hexadecimal:"☝🏼"},{name:"index-pointing-up-type-4",hexadecimal:"☝🏽"},{name:"index-pointing-up-type-5",hexadecimal:"☝🏾"},{name:"index-pointing-up-type-6",hexadecimal:"☝🏿"},{name:"white-up-pointing-backhand-index",hexadecimal:"👆"},{name:"backhand-index-pointing-up-type-1-2",hexadecimal:"👆🏻"},{name:"backhand-index-pointing-up-type-3",hexadecimal:"👆🏼"},{name:"backhand-index-pointing-up-type-4",hexadecimal:"👆🏽"},{name:"backhand-index-pointing-up-type-5",hexadecimal:"👆🏾"},{name:"backhand-index-pointing-up-type-6",hexadecimal:"👆🏿"},{name:"reversed-hand-with-middle-finger-extended",hexadecimal:"🖕"},{name:"middle-finger-type-1-2",hexadecimal:"🖕🏻"},{name:"middle-finger-type-3",hexadecimal:"🖕🏼"},{name:"middle-finger-type-4",hexadecimal:"🖕🏽"},{name:"middle-finger-type-5",hexadecimal:"🖕🏾"},{name:"middle-finger-type-6",hexadecimal:"🖕🏿"},{name:"white-down-pointing-backhand-index",hexadecimal:"👇"},{name:"backhand-index-pointing-down-type-1-2",hexadecimal:"👇🏻"},{name:"backhand-index-pointing-down-type-3",hexadecimal:"👇🏼"},{name:"backhand-index-pointing-down-type-4",hexadecimal:"👇🏽"},{name:"backhand-index-pointing-down-type-5",hexadecimal:"👇🏾"},{name:"backhand-index-pointing-down-type-6",hexadecimal:"👇🏿"},{name:"victory-hand",hexadecimal:"✌"},{name:"victory-hand-type-1-2",hexadecimal:"✌🏻"},{name:"victory-hand-type-3",hexadecimal:"✌🏼"},{name:"victory-hand-type-4",hexadecimal:"✌🏽"},{name:"victory-hand-type-5",hexadecimal:"✌🏾"},{name:"victory-hand-type-6",hexadecimal:"✌🏿"},{name:"hand-with-index-and-middle-fingers-crossed",hexadecimal:"🤞"},{name:"crossed-fingers-type-1-2",hexadecimal:"🤞🏻"},{name:"crossed-fingers-type-3",hexadecimal:"🤞🏼"},{name:"crossed-fingers-type-4",hexadecimal:"🤞🏽"},{name:"crossed-fingers-type-5",hexadecimal:"🤞🏾"},{name:"crossed-fingers-type-6",hexadecimal:"🤞🏿"},{name:"raised-hand-with-part-between-middle-and-ring-fingers",hexadecimal:"🖖"},{name:"vulcan-salute-type-1-2",hexadecimal:"🖖🏻"},{name:"vulcan-salute-type-3",hexadecimal:"🖖🏼"},{name:"vulcan-salute-type-4",hexadecimal:"🖖🏽"},{name:"vulcan-salute-type-5",hexadecimal:"🖖🏾"},{name:"vulcan-salute-type-6",hexadecimal:"🖖🏿"},{name:"sign-of-the-horns",hexadecimal:"🤘"},{name:"sign-of-the-horns-type-1-2",hexadecimal:"🤘🏻"},{name:"sign-of-the-horns-type-3",hexadecimal:"🤘🏼"},{name:"sign-of-the-horns-type-4",hexadecimal:"🤘🏽"},{name:"sign-of-the-horns-type-5",hexadecimal:"🤘🏾"},{name:"sign-of-the-horns-type-6",hexadecimal:"🤘🏿"},{name:"call-me-hand",hexadecimal:"🤙"},{name:"call-me-hand-type-1-2",hexadecimal:"🤙🏻"},{name:"call-me-hand-type-3",hexadecimal:"🤙🏼"},{name:"call-me-hand-type-4",hexadecimal:"🤙🏽"},{name:"call-me-hand-type-5",hexadecimal:"🤙🏾"},{name:"call-me-hand-type-6",hexadecimal:"🤙🏿"},{name:"raised-hand-with-fingers-splayed",hexadecimal:"🖐"},{name:"raised-hand-with-fingers-splayed-type-1-2",hexadecimal:"🖐🏻"},{name:"raised-hand-with-fingers-splayed-type-3",hexadecimal:"🖐🏼"},{name:"raised-hand-with-fingers-splayed-type-4",hexadecimal:"🖐🏽"},{name:"raised-hand-with-fingers-splayed-type-5",hexadecimal:"🖐🏾"},{name:"raised-hand-with-fingers-splayed-type-6",hexadecimal:"🖐🏿"},{name:"raised-hand",hexadecimal:"✋"},{name:"raised-hand-type-1-2",hexadecimal:"✋🏻"},{name:"raised-hand-type-3",hexadecimal:"✋🏼"},{name:"raised-hand-type-4",hexadecimal:"✋🏽"},{name:"raised-hand-type-5",hexadecimal:"✋🏾"},{name:"raised-hand-type-6",hexadecimal:"✋🏿"},{name:"ok-hand-sign",hexadecimal:"👌"},{name:"ok-hand-type-1-2",hexadecimal:"👌🏻"},{name:"ok-hand-type-3",hexadecimal:"👌🏼"},{name:"ok-hand-type-4",hexadecimal:"👌🏽"},{name:"ok-hand-type-5",hexadecimal:"👌🏾"},{name:"ok-hand-type-6",hexadecimal:"👌🏿"},{name:"thumbs-up-sign",hexadecimal:"👍"},{name:"thumbs-up-type-1-2",hexadecimal:"👍🏻"},{name:"thumbs-up-type-3",hexadecimal:"👍🏼"},{name:"thumbs-up-type-4",hexadecimal:"👍🏽"},{name:"thumbs-up-type-5",hexadecimal:"👍🏾"},{name:"thumbs-up-type-6",hexadecimal:"👍🏿"},{name:"thumbs-down-sign",hexadecimal:"👎"},{name:"thumbs-down-type-1-2",hexadecimal:"👎🏻"},{name:"thumbs-down-type-3",hexadecimal:"👎🏼"},{name:"thumbs-down-type-4",hexadecimal:"👎🏽"},{name:"thumbs-down-type-5",hexadecimal:"👎🏾"},{name:"thumbs-down-type-6",hexadecimal:"👎🏿"},{name:"raised-fist",hexadecimal:"✊"},{name:"raised-fist-type-1-2",hexadecimal:"✊🏻"},{name:"raised-fist-type-3",hexadecimal:"✊🏼"},{name:"raised-fist-type-4",hexadecimal:"✊🏽"},{name:"raised-fist-type-5",hexadecimal:"✊🏾"},{name:"raised-fist-type-6",hexadecimal:"✊🏿"},{name:"fisted-hand-sign",hexadecimal:"👊"},{name:"oncoming-fist-type-1-2",hexadecimal:"👊🏻"},{name:"oncoming-fist-type-3",hexadecimal:"👊🏼"},{name:"oncoming-fist-type-4",hexadecimal:"👊🏽"},{name:"oncoming-fist-type-5",hexadecimal:"👊🏾"},{name:"oncoming-fist-type-6",hexadecimal:"👊🏿"},{name:"left-facing-fist",hexadecimal:"🤛"},{name:"left-facing-fist-type-1-2",hexadecimal:"🤛🏻"},{name:"left-facing-fist-type-3",hexadecimal:"🤛🏼"},{name:"left-facing-fist-type-4",hexadecimal:"🤛🏽"},{name:"left-facing-fist-type-5",hexadecimal:"🤛🏾"},{name:"left-facing-fist-type-6",hexadecimal:"🤛🏿"},{name:"right-facing-fist",hexadecimal:"🤜"},{name:"right-facing-fist-type-1-2",hexadecimal:"🤜🏻"},{name:"right-facing-fist-type-3",hexadecimal:"🤜🏼"},{name:"right-facing-fist-type-4",hexadecimal:"🤜🏽"},{name:"right-facing-fist-type-5",hexadecimal:"🤜🏾"},{name:"right-facing-fist-type-6",hexadecimal:"🤜🏿"},{name:"raised-back-of-hand",hexadecimal:"🤚"},{name:"raised-back-of-hand-type-1-2",hexadecimal:"🤚🏻"},{name:"raised-back-of-hand-type-3",hexadecimal:"🤚🏼"},{name:"raised-back-of-hand-type-4",hexadecimal:"🤚🏽"},{name:"raised-back-of-hand-type-5",hexadecimal:"🤚🏾"},{name:"raised-back-of-hand-type-6",hexadecimal:"🤚🏿"},{name:"waving-hand-sign",hexadecimal:"👋"},{name:"waving-hand-type-1-2",hexadecimal:"👋🏻"},{name:"waving-hand-type-3",hexadecimal:"👋🏼"},{name:"waving-hand-type-4",hexadecimal:"👋🏽"},{name:"waving-hand-type-5",hexadecimal:"👋🏾"},{name:"waving-hand-type-6",hexadecimal:"👋🏿"},{name:"clapping-hands-sign",hexadecimal:"👏"},{name:"clapping-hands-type-1-2",hexadecimal:"👏🏻"},{name:"clapping-hands-type-3",hexadecimal:"👏🏼"},{name:"clapping-hands-type-4",hexadecimal:"👏🏽"},{name:"clapping-hands-type-5",hexadecimal:"👏🏾"},{name:"clapping-hands-type-6",hexadecimal:"👏🏿"},{name:"writing-hand",hexadecimal:"✍"},{name:"writing-hand-type-1-2",hexadecimal:"✍🏻"},{name:"writing-hand-type-3",hexadecimal:"✍🏼"},{name:"writing-hand-type-4",hexadecimal:"✍🏽"},{name:"writing-hand-type-5",hexadecimal:"✍🏾"},{name:"writing-hand-type-6",hexadecimal:"✍🏿"},{name:"open-hands-sign",hexadecimal:"👐"},{name:"open-hands-type-1-2",hexadecimal:"👐🏻"},{name:"open-hands-type-3",hexadecimal:"👐🏼"},{name:"open-hands-type-4",hexadecimal:"👐🏽"},{name:"open-hands-type-5",hexadecimal:"👐🏾"},{name:"open-hands-type-6",hexadecimal:"👐🏿"},{name:"person-raising-both-hands-in-celebration",hexadecimal:"🙌"},{name:"person-raising-hands-type-1-2",hexadecimal:"🙌🏻"},{name:"person-raising-hands-type-3",hexadecimal:"🙌🏼"},{name:"person-raising-hands-type-4",hexadecimal:"🙌🏽"},{name:"person-raising-hands-type-5",hexadecimal:"🙌🏾"},{name:"person-raising-hands-type-6",hexadecimal:"🙌🏿"},{name:"person-with-folded-hands",hexadecimal:"🙏"},{name:"folded-hands-type-1-2",hexadecimal:"🙏🏻"},{name:"folded-hands-type-3",hexadecimal:"🙏🏼"},{name:"folded-hands-type-4",hexadecimal:"🙏🏽"},{name:"folded-hands-type-5",hexadecimal:"🙏🏾"},{name:"folded-hands-type-6",hexadecimal:"🙏🏿"},{name:"handshake",hexadecimal:"🤝"},{name:"handshake-type-1-2",hexadecimal:"🤝🏻"},{name:"handshake-type-3",hexadecimal:"🤝🏼"},{name:"handshake-type-4",hexadecimal:"🤝🏽"},{name:"handshake-type-5",hexadecimal:"🤝🏾"},{name:"handshake-type-6",hexadecimal:"🤝🏿"},{name:"nail-polish",hexadecimal:"💅"},{name:"nail-polish-type-1-2",hexadecimal:"💅🏻"},{name:"nail-polish-type-3",hexadecimal:"💅🏼"},{name:"nail-polish-type-4",hexadecimal:"💅🏽"},{name:"nail-polish-type-5",hexadecimal:"💅🏾"},{name:"nail-polish-type-6",hexadecimal:"💅🏿"},{name:"ear",hexadecimal:"👂"},{name:"ear-type-1-2",hexadecimal:"👂🏻"},{name:"ear-type-3",hexadecimal:"👂🏼"},{name:"ear-type-4",hexadecimal:"👂🏽"},{name:"ear-type-5",hexadecimal:"👂🏾"},{name:"ear-type-6",hexadecimal:"👂🏿"},{name:"nose",hexadecimal:"👃"},{name:"nose-type-1-2",hexadecimal:"👃🏻"},{name:"nose-type-3",hexadecimal:"👃🏼"},{name:"nose-type-4",hexadecimal:"👃🏽"},{name:"nose-type-5",hexadecimal:"👃🏾"},{name:"nose-type-6",hexadecimal:"👃🏿"},{name:"footprints",hexadecimal:"👣"},{name:"eyes",hexadecimal:"👀"},{name:"eye",hexadecimal:"👁"},{name:"eye-left-speech-bubble",hexadecimal:"👁‍🗨"},{name:"tongue",hexadecimal:"👅"},{name:"mouth",hexadecimal:"👄"},{name:"kiss-mark",hexadecimal:"💋"},{name:"heart-with-arrow",hexadecimal:"💘"},{name:"heavy-black-heart",hexadecimal:"❤"},{name:"beating-heart",hexadecimal:"💓"},{name:"broken-heart",hexadecimal:"💔"},{name:"two-hearts",hexadecimal:"💕"},{name:"sparkling-heart",hexadecimal:"💖"},{name:"growing-heart",hexadecimal:"💗"},{name:"blue-heart",hexadecimal:"💙"},{name:"green-heart",hexadecimal:"💚"},{name:"yellow-heart",hexadecimal:"💛"},{name:"purple-heart",hexadecimal:"💜"},{name:"black-heart",hexadecimal:"🖤"},{name:"heart-with-ribbon",hexadecimal:"💝"},{name:"revolving-hearts",hexadecimal:"💞"},{name:"heart-decoration",hexadecimal:"💟"},{name:"heavy-heart-exclamation-mark-ornament",hexadecimal:"❣"},{name:"love-letter",hexadecimal:"💌"},{name:"sleeping-symbol",hexadecimal:"💤"},{name:"anger-symbol",hexadecimal:"💢"},{name:"bomb",hexadecimal:"💣"},{name:"collision-symbol",hexadecimal:"💥"},{name:"splashing-sweat-symbol",hexadecimal:"💦"},{name:"dash-symbol",hexadecimal:"💨"},{name:"dizzy-symbol",hexadecimal:"💫"},{name:"speech-balloon",hexadecimal:"💬"},{name:"left-speech-bubble",hexadecimal:"🗨"},{name:"right-anger-bubble",hexadecimal:"🗯"},{name:"thought-balloon",hexadecimal:"💭"},{name:"hole",hexadecimal:"🕳"},{name:"eyeglasses",hexadecimal:"👓"},{name:"dark-sunglasses",hexadecimal:"🕶"},{name:"necktie",hexadecimal:"👔"},{name:"t-shirt",hexadecimal:"👕"},{name:"jeans",hexadecimal:"👖"},{name:"dress",hexadecimal:"👗"},{name:"kimono",hexadecimal:"👘"},{name:"bikini",hexadecimal:"👙"},{name:"womans-clothes",hexadecimal:"👚"},{name:"purse",hexadecimal:"👛"},{name:"handbag",hexadecimal:"👜"},{name:"pouch",hexadecimal:"👝"},{name:"shopping-bags",hexadecimal:"🛍"},{name:"school-satchel",hexadecimal:"🎒"},{name:"mans-shoe",hexadecimal:"👞"},{name:"athletic-shoe",hexadecimal:"👟"},{name:"high-heeled-shoe",hexadecimal:"👠"},{name:"womans-sandal",hexadecimal:"👡"},{name:"womans-boots",hexadecimal:"👢"},{name:"crown",hexadecimal:"👑"},{name:"womans-hat",hexadecimal:"👒"},{name:"top-hat",hexadecimal:"🎩"},{name:"graduation-cap",hexadecimal:"🎓"},{name:"helmet-with-white-cross",hexadecimal:"⛑"},{name:"prayer-beads",hexadecimal:"📿"},{name:"lipstick",hexadecimal:"💄"},{name:"ring",hexadecimal:"💍"},{name:"gem-stone",hexadecimal:"💎"},{name:"monkey-face",hexadecimal:"🐵"},{name:"monkey",hexadecimal:"🐒"},{name:"gorilla",hexadecimal:"🦍"},{name:"dog-face",hexadecimal:"🐶"},{name:"dog",hexadecimal:"🐕"},{name:"poodle",hexadecimal:"🐩"},{name:"wolf-face",hexadecimal:"🐺"},{name:"fox-face",hexadecimal:"🦊"},{name:"cat-face",hexadecimal:"🐱"},{name:"cat",hexadecimal:"🐈"},{name:"lion-face",hexadecimal:"🦁"},{name:"tiger-face",hexadecimal:"🐯"},{name:"tiger",hexadecimal:"🐅"},{name:"leopard",hexadecimal:"🐆"},{name:"horse-face",hexadecimal:"🐴"},{name:"horse",hexadecimal:"🐎"},{name:"deer",hexadecimal:"🦌"},{name:"unicorn-face",hexadecimal:"🦄"},{name:"cow-face",hexadecimal:"🐮"},{name:"ox",hexadecimal:"🐂"},{name:"water-buffalo",hexadecimal:"🐃"},{name:"cow",hexadecimal:"🐄"},{name:"pig-face",hexadecimal:"🐷"},{name:"pig",hexadecimal:"🐖"},{name:"boar",hexadecimal:"🐗"},{name:"pig-nose",hexadecimal:"🐽"},{name:"ram",hexadecimal:"🐏"},{name:"sheep",hexadecimal:"🐑"},{name:"goat",hexadecimal:"🐐"},{name:"dromedary-camel",hexadecimal:"🐪"},{name:"bactrian-camel",hexadecimal:"🐫"},{name:"elephant",hexadecimal:"🐘"},{name:"rhinoceros",hexadecimal:"🦏"},{name:"mouse-face",hexadecimal:"🐭"},{name:"mouse",hexadecimal:"🐁"},{name:"rat",hexadecimal:"🐀"},{name:"hamster-face",hexadecimal:"🐹"},{name:"rabbit-face",hexadecimal:"🐰"},{name:"rabbit",hexadecimal:"🐇"},{name:"chipmunk",hexadecimal:"🐿"},{name:"bat",hexadecimal:"🦇"},{name:"bear-face",hexadecimal:"🐻"},{name:"koala",hexadecimal:"🐨"},{name:"panda-face",hexadecimal:"🐼"},{name:"paw-prints",hexadecimal:"🐾"},{name:"turkey",hexadecimal:"🦃"},{name:"chicken",hexadecimal:"🐔"},{name:"rooster",hexadecimal:"🐓"},{name:"hatching-chick",hexadecimal:"🐣"},{name:"baby-chick",hexadecimal:"🐤"},{name:"front-facing-baby-chick",hexadecimal:"🐥"},{name:"bird",hexadecimal:"🐦"},{name:"penguin",hexadecimal:"🐧"},{name:"dove-of-peace",hexadecimal:"🕊"},{name:"eagle",hexadecimal:"🦅"},{name:"duck",hexadecimal:"🦆"},{name:"owl",hexadecimal:"🦉"},{name:"frog-face",hexadecimal:"🐸"},{name:"crocodile",hexadecimal:"🐊"},{name:"turtle",hexadecimal:"🐢"},{name:"lizard",hexadecimal:"🦎"},{name:"snake",hexadecimal:"🐍"},{name:"dragon-face",hexadecimal:"🐲"},{name:"dragon",hexadecimal:"🐉"},{name:"spouting-whale",hexadecimal:"🐳"},{name:"whale",hexadecimal:"🐋"},{name:"dolphin",hexadecimal:"🐬"},{name:"fish",hexadecimal:"🐟"},{name:"tropical-fish",hexadecimal:"🐠"},{name:"blowfish",hexadecimal:"🐡"},{name:"shark",hexadecimal:"🦈"},{name:"octopus",hexadecimal:"🐙"},{name:"spiral-shell",hexadecimal:"🐚"},{name:"crab",hexadecimal:"🦀"},{name:"shrimp",hexadecimal:"🦐"},{name:"squid",hexadecimal:"🦑"},{name:"butterfly",hexadecimal:"🦋"},{name:"snail",hexadecimal:"🐌"},{name:"bug",hexadecimal:"🐛"},{name:"ant",hexadecimal:"🐜"},{name:"honeybee",hexadecimal:"🐝"},{name:"lady-beetle",hexadecimal:"🐞"},{name:"spider",hexadecimal:"🕷"},{name:"spider-web",hexadecimal:"🕸"},{name:"scorpion",hexadecimal:"🦂"},{name:"bouquet",hexadecimal:"💐"},{name:"cherry-blossom",hexadecimal:"🌸"},{name:"white-flower",hexadecimal:"💮"},{name:"rosette",hexadecimal:"🏵"},{name:"rose",hexadecimal:"🌹"},{name:"wilted-flower",hexadecimal:"🥀"},{name:"hibiscus",hexadecimal:"🌺"},{name:"sunflower",hexadecimal:"🌻"},{name:"blossom",hexadecimal:"🌼"},{name:"tulip",hexadecimal:"🌷"},{name:"seedling",hexadecimal:"🌱"},{name:"evergreen-tree",hexadecimal:"🌲"},{name:"deciduous-tree",hexadecimal:"🌳"},{name:"palm-tree",hexadecimal:"🌴"},{name:"cactus",hexadecimal:"🌵"},{name:"ear-of-rice",hexadecimal:"🌾"},{name:"herb",hexadecimal:"🌿"},{name:"shamrock",hexadecimal:"☘"},{name:"four-leaf-clover",hexadecimal:"🍀"},{name:"maple-leaf",hexadecimal:"🍁"},{name:"fallen-leaf",hexadecimal:"🍂"},{name:"leaf-fluttering-in-wind",hexadecimal:"🍃"},{name:"grapes",hexadecimal:"🍇"},{name:"melon",hexadecimal:"🍈"},{name:"watermelon",hexadecimal:"🍉"},{name:"tangerine",hexadecimal:"🍊"},{name:"lemon",hexadecimal:"🍋"},{name:"banana",hexadecimal:"🍌"},{name:"pineapple",hexadecimal:"🍍"},{name:"red-apple",hexadecimal:"🍎"},{name:"green-apple",hexadecimal:"🍏"},{name:"pear",hexadecimal:"🍐"},{name:"peach",hexadecimal:"🍑"},{name:"cherries",hexadecimal:"🍒"},{name:"strawberry",hexadecimal:"🍓"},{name:"kiwifruit",hexadecimal:"🥝"},{name:"tomato",hexadecimal:"🍅"},{name:"avocado",hexadecimal:"🥑"},{name:"aubergine",hexadecimal:"🍆"},{name:"potato",hexadecimal:"🥔"},{name:"carrot",hexadecimal:"🥕"},{name:"ear-of-maize",hexadecimal:"🌽"},{name:"hot-pepper",hexadecimal:"🌶"},{name:"cucumber",hexadecimal:"🥒"},{name:"mushroom",hexadecimal:"🍄"},{name:"peanuts",hexadecimal:"🥜"},{name:"chestnut",hexadecimal:"🌰"},{name:"bread",hexadecimal:"🍞"},{name:"croissant",hexadecimal:"🥐"},{name:"baguette-bread",hexadecimal:"🥖"},{name:"pancakes",hexadecimal:"🥞"},{name:"cheese-wedge",hexadecimal:"🧀"},{name:"meat-on-bone",hexadecimal:"🍖"},{name:"poultry-leg",hexadecimal:"🍗"},{name:"bacon",hexadecimal:"🥓"},{name:"hamburger",hexadecimal:"🍔"},{name:"french-fries",hexadecimal:"🍟"},{name:"slice-of-pizza",hexadecimal:"🍕"},{name:"hot-dog",hexadecimal:"🌭"},{name:"taco",hexadecimal:"🌮"},{name:"burrito",hexadecimal:"🌯"},{name:"stuffed-flatbread",hexadecimal:"🥙"},{name:"egg",hexadecimal:"🥚"},{name:"cooking",hexadecimal:"🍳"},{name:"shallow-pan-of-food",hexadecimal:"🥘"},{name:"pot-of-food",hexadecimal:"🍲"},{name:"green-salad",hexadecimal:"🥗"},{name:"popcorn",hexadecimal:"🍿"},{name:"bento-box",hexadecimal:"🍱"},{name:"rice-cracker",hexadecimal:"🍘"},{name:"rice-ball",hexadecimal:"🍙"},{name:"cooked-rice",hexadecimal:"🍚"},{name:"curry-and-rice",hexadecimal:"🍛"},{name:"steaming-bowl",hexadecimal:"🍜"},{name:"spaghetti",hexadecimal:"🍝"},{name:"roasted-sweet-potato",hexadecimal:"🍠"},{name:"oden",hexadecimal:"🍢"},{name:"sushi",hexadecimal:"🍣"},{name:"fried-shrimp",hexadecimal:"🍤"},{name:"fish-cake-with-swirl-design",hexadecimal:"🍥"},{name:"dango",hexadecimal:"🍡"},{name:"soft-ice-cream",hexadecimal:"🍦"},{name:"shaved-ice",hexadecimal:"🍧"},{name:"ice-cream",hexadecimal:"🍨"},{name:"doughnut",hexadecimal:"🍩"},{name:"cookie",hexadecimal:"🍪"},{name:"birthday-cake",hexadecimal:"🎂"},{name:"shortcake",hexadecimal:"🍰"},{name:"chocolate-bar",hexadecimal:"🍫"},{name:"candy",hexadecimal:"🍬"},{name:"lollipop",hexadecimal:"🍭"},{name:"custard",hexadecimal:"🍮"},{name:"honey-pot",hexadecimal:"🍯"},{name:"baby-bottle",hexadecimal:"🍼"},{name:"glass-of-milk",hexadecimal:"🥛"},{name:"hot-beverage",hexadecimal:"☕"},{name:"teacup-without-handle",hexadecimal:"🍵"},{name:"sake-bottle-and-cup",hexadecimal:"🍶"},{name:"bottle-with-popping-cork",hexadecimal:"🍾"},{name:"wine-glass",hexadecimal:"🍷"},{name:"cocktail-glass",hexadecimal:"🍸"},{name:"tropical-drink",hexadecimal:"🍹"},{name:"beer-mug",hexadecimal:"🍺"},{name:"clinking-beer-mugs",hexadecimal:"🍻"},{name:"clinking-glasses",hexadecimal:"🥂"},{name:"tumbler-glass",hexadecimal:"🥃"},{name:"fork-and-knife-with-plate",hexadecimal:"🍽"},{name:"fork-and-knife",hexadecimal:"🍴"},{name:"spoon",hexadecimal:"🥄"},{name:"hocho",hexadecimal:"🔪"},{name:"amphora",hexadecimal:"🏺"},{name:"earth-globe-europe-africa",hexadecimal:"🌍"},{name:"earth-globe-americas",hexadecimal:"🌎"},{name:"earth-globe-asia-australia",hexadecimal:"🌏"},{name:"globe-with-meridians",hexadecimal:"🌐"},{name:"world-map",hexadecimal:"🗺"},{name:"silhouette-of-japan",hexadecimal:"🗾"},{name:"snow-capped-mountain",hexadecimal:"🏔"},{name:"mountain",hexadecimal:"⛰"},{name:"volcano",hexadecimal:"🌋"},{name:"mount-fuji",hexadecimal:"🗻"},{name:"camping",hexadecimal:"🏕"},{name:"beach-with-umbrella",hexadecimal:"🏖"},{name:"desert",hexadecimal:"🏜"},{name:"desert-island",hexadecimal:"🏝"},{name:"national-park",hexadecimal:"🏞"},{name:"stadium",hexadecimal:"🏟"},{name:"classical-building",hexadecimal:"🏛"},{name:"building-construction",hexadecimal:"🏗"},{name:"house-buildings",hexadecimal:"🏘"},{name:"cityscape",hexadecimal:"🏙"},{name:"derelict-house-building",hexadecimal:"🏚"},{name:"house-building",hexadecimal:"🏠"},{name:"house-with-garden",hexadecimal:"🏡"},{name:"office-building",hexadecimal:"🏢"},{name:"japanese-post-office",hexadecimal:"🏣"},{name:"european-post-office",hexadecimal:"🏤"},{name:"hospital",hexadecimal:"🏥"},{name:"bank",hexadecimal:"🏦"},{name:"hotel",hexadecimal:"🏨"},{name:"love-hotel",hexadecimal:"🏩"},{name:"convenience-store",hexadecimal:"🏪"},{name:"school",hexadecimal:"🏫"},{name:"department-store",hexadecimal:"🏬"},{name:"factory",hexadecimal:"🏭"},{name:"japanese-castle",hexadecimal:"🏯"},{name:"european-castle",hexadecimal:"🏰"},{name:"wedding",hexadecimal:"💒"},{name:"tokyo-tower",hexadecimal:"🗼"},{name:"statue-of-liberty",hexadecimal:"🗽"},{name:"church",hexadecimal:"⛪"},{name:"mosque",hexadecimal:"🕌"},{name:"synagogue",hexadecimal:"🕍"},{name:"shinto-shrine",hexadecimal:"⛩"},{name:"kaaba",hexadecimal:"🕋"},{name:"fountain",hexadecimal:"⛲"},{name:"tent",hexadecimal:"⛺"},{name:"foggy",hexadecimal:"🌁"},{name:"night-with-stars",hexadecimal:"🌃"},{name:"sunrise-over-mountains",hexadecimal:"🌄"},{name:"sunrise",hexadecimal:"🌅"},{name:"cityscape-at-dusk",hexadecimal:"🌆"},{name:"sunset-over-buildings",hexadecimal:"🌇"},{name:"bridge-at-night",hexadecimal:"🌉"},{name:"hot-springs",hexadecimal:"♨"},{name:"milky-way",hexadecimal:"🌌"},{name:"carousel-horse",hexadecimal:"🎠"},{name:"ferris-wheel",hexadecimal:"🎡"},{name:"roller-coaster",hexadecimal:"🎢"},{name:"barber-pole",hexadecimal:"💈"},{name:"circus-tent",hexadecimal:"🎪"},{name:"performing-arts",hexadecimal:"🎭"},{name:"frame-with-picture",hexadecimal:"🖼"},{name:"artist-palette",hexadecimal:"🎨"},{name:"slot-machine",hexadecimal:"🎰"},{name:"steam-locomotive",hexadecimal:"🚂"},{name:"railway-car",hexadecimal:"🚃"},{name:"high-speed-train",hexadecimal:"🚄"},{name:"high-speed-train-with-bullet-nose",hexadecimal:"🚅"},{name:"train",hexadecimal:"🚆"},{name:"metro",hexadecimal:"🚇"},{name:"light-rail",hexadecimal:"🚈"},{name:"station",hexadecimal:"🚉"},{name:"tram",hexadecimal:"🚊"},{name:"monorail",hexadecimal:"🚝"},{name:"mountain-railway",hexadecimal:"🚞"},{name:"tram-car",hexadecimal:"🚋"},{name:"bus",hexadecimal:"🚌"},{name:"oncoming-bus",hexadecimal:"🚍"},{name:"trolleybus",hexadecimal:"🚎"},{name:"minibus",hexadecimal:"🚐"},{name:"ambulance",hexadecimal:"🚑"},{name:"fire-engine",hexadecimal:"🚒"},{name:"police-car",hexadecimal:"🚓"},{name:"oncoming-police-car",hexadecimal:"🚔"},{name:"taxi",hexadecimal:"🚕"},{name:"oncoming-taxi",hexadecimal:"🚖"},{name:"automobile",hexadecimal:"🚗"},{name:"oncoming-automobile",hexadecimal:"🚘"},{name:"recreational-vehicle",hexadecimal:"🚙"},{name:"delivery-truck",hexadecimal:"🚚"},{name:"articulated-lorry",hexadecimal:"🚛"},{name:"tractor",hexadecimal:"🚜"},{name:"bicycle",hexadecimal:"🚲"},{name:"scooter",hexadecimal:"🛴"},{name:"motor-scooter",hexadecimal:"🛵"},{name:"racing-car",hexadecimal:"🏎"},{name:"racing-motorcycle",hexadecimal:"🏍"},{name:"bus-stop",hexadecimal:"🚏"},{name:"motorway",hexadecimal:"🛣"},{name:"railway-track",hexadecimal:"🛤"},{name:"fuel-pump",hexadecimal:"⛽"},{name:"police-cars-revolving-light",hexadecimal:"🚨"},{name:"horizontal-traffic-light",hexadecimal:"🚥"},{name:"vertical-traffic-light",hexadecimal:"🚦"},{name:"construction-sign",hexadecimal:"🚧"},{name:"octagonal-sign",hexadecimal:"🛑"},{name:"anchor",hexadecimal:"⚓"},{name:"sailboat",hexadecimal:"⛵"},{name:"canoe",hexadecimal:"🛶"},{name:"speedboat",hexadecimal:"🚤"},{name:"passenger-ship",hexadecimal:"🛳"},{name:"ferry",hexadecimal:"⛴"},{name:"motor-boat",hexadecimal:"🛥"},{name:"ship",hexadecimal:"🚢"},{name:"airplane",hexadecimal:"✈"},{name:"small-airplane",hexadecimal:"🛩"},{name:"airplane-departure",hexadecimal:"🛫"},{name:"airplane-arriving",hexadecimal:"🛬"},{name:"seat",hexadecimal:"💺"},{name:"helicopter",hexadecimal:"🚁"},{name:"suspension-railway",hexadecimal:"🚟"},{name:"mountain-cableway",hexadecimal:"🚠"},{name:"aerial-tramway",hexadecimal:"🚡"},{name:"rocket",hexadecimal:"🚀"},{name:"satellite",hexadecimal:"🛰"},{name:"bellhop-bell",hexadecimal:"🛎"},{name:"door",hexadecimal:"🚪"},{name:"sleeping-accommodation",hexadecimal:"🛌"},{name:"bed",hexadecimal:"🛏"},{name:"couch-and-lamp",hexadecimal:"🛋"},{name:"toilet",hexadecimal:"🚽"},{name:"shower",hexadecimal:"🚿"},{name:"bath",hexadecimal:"🛀"},{name:"person-taking-bath-type-1-2",hexadecimal:"🛀🏻"},{name:"person-taking-bath-type-3",hexadecimal:"🛀🏼"},{name:"person-taking-bath-type-4",hexadecimal:"🛀🏽"},{name:"person-taking-bath-type-5",hexadecimal:"🛀🏾"},{name:"person-taking-bath-type-6",hexadecimal:"🛀🏿"},{name:"bathtub",hexadecimal:"🛁"},{name:"hourglass",hexadecimal:"⌛"},{name:"hourglass-with-flowing-sand",hexadecimal:"⏳"},{name:"watch",hexadecimal:"⌚"},{name:"alarm-clock",hexadecimal:"⏰"},{name:"stopwatch",hexadecimal:"⏱"},{name:"timer-clock",hexadecimal:"⏲"},{name:"mantelpiece-clock",hexadecimal:"🕰"},{name:"clock-face-twelve-oclock",hexadecimal:"🕛"},{name:"clock-face-twelve-thirty",hexadecimal:"🕧"},{name:"clock-face-one-oclock",hexadecimal:"🕐"},{name:"clock-face-one-thirty",hexadecimal:"🕜"},{name:"clock-face-two-oclock",hexadecimal:"🕑"},{name:"clock-face-two-thirty",hexadecimal:"🕝"},{name:"clock-face-three-oclock",hexadecimal:"🕒"},{name:"clock-face-three-thirty",hexadecimal:"🕞"},{name:"clock-face-four-oclock",hexadecimal:"🕓"},{name:"clock-face-four-thirty",hexadecimal:"🕟"},{name:"clock-face-five-oclock",hexadecimal:"🕔"},{name:"clock-face-five-thirty",hexadecimal:"🕠"},{name:"clock-face-six-oclock",hexadecimal:"🕕"},{name:"clock-face-six-thirty",hexadecimal:"🕡"},{name:"clock-face-seven-oclock",hexadecimal:"🕖"},{name:"clock-face-seven-thirty",hexadecimal:"🕢"},{name:"clock-face-eight-oclock",hexadecimal:"🕗"},{name:"clock-face-eight-thirty",hexadecimal:"🕣"},{name:"clock-face-nine-oclock",hexadecimal:"🕘"},{name:"clock-face-nine-thirty",hexadecimal:"🕤"},{name:"clock-face-ten-oclock",hexadecimal:"🕙"},{name:"clock-face-ten-thirty",hexadecimal:"🕥"},{name:"clock-face-eleven-oclock",hexadecimal:"🕚"},{name:"clock-face-eleven-thirty",hexadecimal:"🕦"},{name:"new-moon-symbol",hexadecimal:"🌑"},{name:"waxing-crescent-moon-symbol",hexadecimal:"🌒"},{name:"first-quarter-moon-symbol",hexadecimal:"🌓"},{name:"waxing-gibbous-moon-symbol",hexadecimal:"🌔"},{name:"full-moon-symbol",hexadecimal:"🌕"},{name:"waning-gibbous-moon-symbol",hexadecimal:"🌖"},{name:"last-quarter-moon-symbol",hexadecimal:"🌗"},{name:"waning-crescent-moon-symbol",hexadecimal:"🌘"},{name:"crescent-moon",hexadecimal:"🌙"},{name:"new-moon-with-face",hexadecimal:"🌚"},{name:"first-quarter-moon-with-face",hexadecimal:"🌛"},{name:"last-quarter-moon-with-face",hexadecimal:"🌜"},{name:"thermometer",hexadecimal:"🌡"},{name:"black-sun-with-rays",hexadecimal:"☀"},{name:"full-moon-with-face",hexadecimal:"🌝"},{name:"sun-with-face",hexadecimal:"🌞"},{name:"white-medium-star",hexadecimal:"⭐"},{name:"glowing-star",hexadecimal:"🌟"},{name:"shooting-star",hexadecimal:"🌠"},{name:"cloud",hexadecimal:"☁"},{name:"sun-behind-cloud",hexadecimal:"⛅"},{name:"thunder-cloud-and-rain",hexadecimal:"⛈"},{name:"white-sun-with-small-cloud",hexadecimal:"🌤"},{name:"white-sun-behind-cloud",hexadecimal:"🌥"},{name:"white-sun-behind-cloud-with-rain",hexadecimal:"🌦"},{name:"cloud-with-rain",hexadecimal:"🌧"},{name:"cloud-with-snow",hexadecimal:"🌨"},{name:"cloud-with-lightning",hexadecimal:"🌩"},{name:"cloud-with-tornado",hexadecimal:"🌪"},{name:"fog",hexadecimal:"🌫"},{name:"wind-blowing-face",hexadecimal:"🌬"},{name:"cyclone",hexadecimal:"🌀"},{name:"rainbow",hexadecimal:"🌈"},{name:"closed-umbrella",hexadecimal:"🌂"},{name:"umbrella",hexadecimal:"☂"},{name:"umbrella-with-rain-drops",hexadecimal:"☔"},{name:"umbrella-on-ground",hexadecimal:"⛱"},{name:"high-voltage-sign",hexadecimal:"⚡"},{name:"snowflake",hexadecimal:"❄"},{name:"snowman",hexadecimal:"☃"},{name:"snowman-without-snow",hexadecimal:"⛄"},{name:"comet",hexadecimal:"☄"},{name:"fire",hexadecimal:"🔥"},{name:"droplet",hexadecimal:"💧"},{name:"water-wave",hexadecimal:"🌊"},{name:"jack-o-lantern",hexadecimal:"🎃"},{name:"christmas-tree",hexadecimal:"🎄"},{name:"fireworks",hexadecimal:"🎆"},{name:"firework-sparkler",hexadecimal:"🎇"},{name:"sparkles",hexadecimal:"✨"},{name:"balloon",hexadecimal:"🎈"},{name:"party-popper",hexadecimal:"🎉"},{name:"confetti-ball",hexadecimal:"🎊"},{name:"tanabata-tree",hexadecimal:"🎋"},{name:"pine-decoration",hexadecimal:"🎍"},{name:"japanese-dolls",hexadecimal:"🎎"},{name:"carp-streamer",hexadecimal:"🎏"},{name:"wind-chime",hexadecimal:"🎐"},{name:"moon-viewing-ceremony",hexadecimal:"🎑"},{name:"ribbon",hexadecimal:"🎀"},{name:"wrapped-present",hexadecimal:"🎁"},{name:"reminder-ribbon",hexadecimal:"🎗"},{name:"admission-tickets",hexadecimal:"🎟"},{name:"ticket",hexadecimal:"🎫"},{name:"military-medal",hexadecimal:"🎖"},{name:"trophy",hexadecimal:"🏆"},{name:"sports-medal",hexadecimal:"🏅"},{name:"first-place-medal",hexadecimal:"🥇"},{name:"second-place-medal",hexadecimal:"🥈"},{name:"third-place-medal",hexadecimal:"🥉"},{name:"soccer-ball",hexadecimal:"⚽"},{name:"baseball",hexadecimal:"⚾"},{name:"basketball-and-hoop",hexadecimal:"🏀"},{name:"volleyball",hexadecimal:"🏐"},{name:"american-football",hexadecimal:"🏈"},{name:"rugby-football",hexadecimal:"🏉"},{name:"tennis-racquet-and-ball",hexadecimal:"🎾"},{name:"billiards",hexadecimal:"🎱"},{name:"bowling",hexadecimal:"🎳"},{name:"cricket-bat-and-ball",hexadecimal:"🏏"},{name:"field-hockey-stick-and-ball",hexadecimal:"🏑"},{name:"ice-hockey-stick-and-puck",hexadecimal:"🏒"},{name:"table-tennis-paddle-and-ball",hexadecimal:"🏓"},{name:"badminton-racquet-and-shuttlecock",hexadecimal:"🏸"},{name:"boxing-glove",hexadecimal:"🥊"},{name:"martial-arts-uniform",hexadecimal:"🥋"},{name:"goal-net",hexadecimal:"🥅"},{name:"direct-hit",hexadecimal:"🎯"},{name:"flag-in-hole",hexadecimal:"⛳"},{name:"ice-skate",hexadecimal:"⛸"},{name:"fishing-pole-and-fish",hexadecimal:"🎣"},{name:"running-shirt-with-sash",hexadecimal:"🎽"},{name:"ski-and-ski-boot",hexadecimal:"🎿"},{name:"fencer",hexadecimal:"🤺"},{name:"horse-racing",hexadecimal:"🏇"},{name:"skier",hexadecimal:"⛷"},{name:"snowboarder",hexadecimal:"🏂"},{name:"golfer",hexadecimal:"🏌"},{name:"surfer",hexadecimal:"🏄"},{name:"person-surfing-type-1-2",hexadecimal:"🏄🏻"},{name:"person-surfing-type-3",hexadecimal:"🏄🏼"},{name:"person-surfing-type-4",hexadecimal:"🏄🏽"},{name:"person-surfing-type-5",hexadecimal:"🏄🏾"},{name:"person-surfing-type-6",hexadecimal:"🏄🏿"},{name:"rowboat",hexadecimal:"🚣"},{name:"person-rowing-boat-type-1-2",hexadecimal:"🚣🏻"},{name:"person-rowing-boat-type-3",hexadecimal:"🚣🏼"},{name:"person-rowing-boat-type-4",hexadecimal:"🚣🏽"},{name:"person-rowing-boat-type-5",hexadecimal:"🚣🏾"},{name:"person-rowing-boat-type-6",hexadecimal:"🚣🏿"},{name:"swimmer",hexadecimal:"🏊"},{name:"person-swimming-type-1-2",hexadecimal:"🏊🏻"},{name:"person-swimming-type-3",hexadecimal:"🏊🏼"},{name:"person-swimming-type-4",hexadecimal:"🏊🏽"},{name:"person-swimming-type-5",hexadecimal:"🏊🏾"},{name:"person-swimming-type-6",hexadecimal:"🏊🏿"},{name:"person-with-ball",hexadecimal:"⛹"},{name:"person-with-ball-type-1-2",hexadecimal:"⛹🏻"},{name:"person-with-ball-type-3",hexadecimal:"⛹🏼"},{name:"person-with-ball-type-4",hexadecimal:"⛹🏽"},{name:"person-with-ball-type-5",hexadecimal:"⛹🏾"},{name:"person-with-ball-type-6",hexadecimal:"⛹🏿"},{name:"weight-lifter",hexadecimal:"🏋"},{name:"person-weight-lifting-type-1-2",hexadecimal:"🏋🏻"},{name:"person-weight-lifting-type-3",hexadecimal:"🏋🏼"},{name:"person-weight-lifting-type-4",hexadecimal:"🏋🏽"},{name:"person-weight-lifting-type-5",hexadecimal:"🏋🏾"},{name:"person-weight-lifting-type-6",hexadecimal:"🏋🏿"},{name:"bicyclist",hexadecimal:"🚴"},{name:"person-biking-type-1-2",hexadecimal:"🚴🏻"},{name:"person-biking-type-3",hexadecimal:"🚴🏼"},{name:"person-biking-type-4",hexadecimal:"🚴🏽"},{name:"person-biking-type-5",hexadecimal:"🚴🏾"},{name:"person-biking-type-6",hexadecimal:"🚴🏿"},{name:"mountain-bicyclist",hexadecimal:"🚵"},{name:"person-mountain-biking-type-1-2",hexadecimal:"🚵🏻"},{name:"person-mountain-biking-type-3",hexadecimal:"🚵🏼"},{name:"person-mountain-biking-type-4",hexadecimal:"🚵🏽"},{name:"person-mountain-biking-type-5",hexadecimal:"🚵🏾"},{name:"person-mountain-biking-type-6",hexadecimal:"🚵🏿"},{name:"person-doing-cartwheel",hexadecimal:"🤸"},{name:"person-doing-cartwheel-type-1-2",hexadecimal:"🤸🏻"},{name:"person-doing-cartwheel-type-3",hexadecimal:"🤸🏼"},{name:"person-doing-cartwheel-type-4",hexadecimal:"🤸🏽"},{name:"person-doing-cartwheel-type-5",hexadecimal:"🤸🏾"},{name:"person-doing-cartwheel-type-6",hexadecimal:"🤸🏿"},{name:"wrestlers",hexadecimal:"🤼"},{name:"people-wrestling-type-1-2",hexadecimal:"🤼🏻"},{name:"people-wrestling-type-3",hexadecimal:"🤼🏼"},{name:"people-wrestling-type-4",hexadecimal:"🤼🏽"},{name:"people-wrestling-type-5",hexadecimal:"🤼🏾"},{name:"people-wrestling-type-6",hexadecimal:"🤼🏿"},{name:"water-polo",hexadecimal:"🤽"},{name:"person-playing-water-polo-type-1-2",hexadecimal:"🤽🏻"},{name:"person-playing-water-polo-type-3",hexadecimal:"🤽🏼"},{name:"person-playing-water-polo-type-4",hexadecimal:"🤽🏽"},{name:"person-playing-water-polo-type-5",hexadecimal:"🤽🏾"},{name:"person-playing-water-polo-type-6",hexadecimal:"🤽🏿"},{name:"handball",hexadecimal:"🤾"},{name:"person-playing-handball-type-1-2",hexadecimal:"🤾🏻"},{name:"person-playing-handball-type-3",hexadecimal:"🤾🏼"},{name:"person-playing-handball-type-4",hexadecimal:"🤾🏽"},{name:"person-playing-handball-type-5",hexadecimal:"🤾🏾"},{name:"person-playing-handball-type-6",hexadecimal:"🤾🏿"},{name:"juggling",hexadecimal:"🤹"},{name:"person-juggling-type-1-2",hexadecimal:"🤹🏻"},{name:"person-juggling-type-3",hexadecimal:"🤹🏼"},{name:"person-juggling-type-4",hexadecimal:"🤹🏽"},{name:"person-juggling-type-5",hexadecimal:"🤹🏾"},{name:"person-juggling-type-6",hexadecimal:"🤹🏿"},{name:"video-game",hexadecimal:"🎮"},{name:"joystick",hexadecimal:"🕹"},{name:"game-die",hexadecimal:"🎲"},{name:"black-spade-suit",hexadecimal:"♠"},{name:"black-heart-suit",hexadecimal:"♥"},{name:"black-diamond-suit",hexadecimal:"♦"},{name:"black-club-suit",hexadecimal:"♣"},{name:"playing-card-black-joker",hexadecimal:"🃏"},{name:"mahjong-tile-red-dragon",hexadecimal:"🀄"},{name:"flower-playing-cards",hexadecimal:"🎴"},{name:"speaker-with-cancellation-stroke",hexadecimal:"🔇"},{name:"speaker",hexadecimal:"🔈"},{name:"speaker-with-one-sound-wave",hexadecimal:"🔉"},{name:"speaker-with-three-sound-waves",hexadecimal:"🔊"},{name:"public-address-loudspeaker",hexadecimal:"📢"},{name:"cheering-megaphone",hexadecimal:"📣"},{name:"postal-horn",hexadecimal:"📯"},{name:"bell",hexadecimal:"🔔"},{name:"bell-with-cancellation-stroke",hexadecimal:"🔕"},{name:"musical-score",hexadecimal:"🎼"},{name:"musical-note",hexadecimal:"🎵"},{name:"multiple-musical-notes",hexadecimal:"🎶"},{name:"studio-microphone",hexadecimal:"🎙"},{name:"level-slider",hexadecimal:"🎚"},{name:"control-knobs",hexadecimal:"🎛"},{name:"microphone",hexadecimal:"🎤"},{name:"headphone",hexadecimal:"🎧"},{name:"radio",hexadecimal:"📻"},{name:"saxophone",hexadecimal:"🎷"},{name:"guitar",hexadecimal:"🎸"},{name:"musical-keyboard",hexadecimal:"🎹"},{name:"trumpet",hexadecimal:"🎺"},{name:"violin",hexadecimal:"🎻"},{name:"drum-with-drumsticks",hexadecimal:"🥁"},{name:"mobile-phone",hexadecimal:"📱"},{name:"mobile-phone-with-rightwards-arrow-at-left",hexadecimal:"📲"},{name:"black-telephone",hexadecimal:"☎"},{name:"telephone-receiver",hexadecimal:"📞"},{name:"pager",hexadecimal:"📟"},{name:"fax-machine",hexadecimal:"📠"},{name:"battery",hexadecimal:"🔋"},{name:"electric-plug",hexadecimal:"🔌"},{name:"personal-computer",hexadecimal:"💻"},{name:"desktop-computer",hexadecimal:"🖥"},{name:"printer",hexadecimal:"🖨"},{name:"keyboard",hexadecimal:"⌨"},{name:"three-button-mouse",hexadecimal:"🖱"},{name:"trackball",hexadecimal:"🖲"},{name:"minidisc",hexadecimal:"💽"},{name:"floppy-disk",hexadecimal:"💾"},{name:"optical-disc",hexadecimal:"💿"},{name:"dvd",hexadecimal:"📀"},{name:"movie-camera",hexadecimal:"🎥"},{name:"film-frames",hexadecimal:"🎞"},{name:"film-projector",hexadecimal:"📽"},{name:"clapper-board",hexadecimal:"🎬"},{name:"television",hexadecimal:"📺"},{name:"camera",hexadecimal:"📷"},{name:"camera-with-flash",hexadecimal:"📸"},{name:"video-camera",hexadecimal:"📹"},{name:"videocassette",hexadecimal:"📼"},{name:"left-pointing-magnifying-glass",hexadecimal:"🔍"},{name:"right-pointing-magnifying-glass",hexadecimal:"🔎"},{name:"microscope",hexadecimal:"🔬"},{name:"telescope",hexadecimal:"🔭"},{name:"satellite-antenna",hexadecimal:"📡"},{name:"candle",hexadecimal:"🕯"},{name:"electric-light-bulb",hexadecimal:"💡"},{name:"electric-torch",hexadecimal:"🔦"},{name:"izakaya-lantern",hexadecimal:"🏮"},{name:"notebook-with-decorative-cover",hexadecimal:"📔"},{name:"closed-book",hexadecimal:"📕"},{name:"open-book",hexadecimal:"📖"},{name:"green-book",hexadecimal:"📗"},{name:"blue-book",hexadecimal:"📘"},{name:"orange-book",hexadecimal:"📙"},{name:"books",hexadecimal:"📚"},{name:"notebook",hexadecimal:"📓"},{name:"ledger",hexadecimal:"📒"},{name:"page-with-curl",hexadecimal:"📃"},{name:"scroll",hexadecimal:"📜"},{name:"page-facing-up",hexadecimal:"📄"},{name:"newspaper",hexadecimal:"📰"},{name:"rolled-up-newspaper",hexadecimal:"🗞"},{name:"bookmark-tabs",hexadecimal:"📑"},{name:"bookmark",hexadecimal:"🔖"},{name:"label",hexadecimal:"🏷"},{name:"money-bag",hexadecimal:"💰"},{name:"banknote-with-yen-sign",hexadecimal:"💴"},{name:"banknote-with-dollar-sign",hexadecimal:"💵"},{name:"banknote-with-euro-sign",hexadecimal:"💶"},{name:"banknote-with-pound-sign",hexadecimal:"💷"},{name:"money-with-wings",hexadecimal:"💸"},{name:"credit-card",hexadecimal:"💳"},{name:"chart-with-upwards-trend-and-yen-sign",hexadecimal:"💹"},{name:"currency-exchange",hexadecimal:"💱"},{name:"heavy-dollar-sign",hexadecimal:"💲"},{name:"envelope",hexadecimal:"✉"},{name:"e-mail-symbol",hexadecimal:"📧"},{name:"incoming-envelope",hexadecimal:"📨"},{name:"envelope-with-downwards-arrow-above",hexadecimal:"📩"},{name:"outbox-tray",hexadecimal:"📤"},{name:"inbox-tray",hexadecimal:"📥"},{name:"package",hexadecimal:"📦"},{name:"closed-mailbox-with-raised-flag",hexadecimal:"📫"},{name:"closed-mailbox-with-lowered-flag",hexadecimal:"📪"},{name:"open-mailbox-with-raised-flag",hexadecimal:"📬"},{name:"open-mailbox-with-lowered-flag",hexadecimal:"📭"},{name:"postbox",hexadecimal:"📮"},{name:"ballot-box-with-ballot",hexadecimal:"🗳"},{name:"pencil",hexadecimal:"✏"},{name:"black-nib",hexadecimal:"✒"},{name:"lower-left-fountain-pen",hexadecimal:"🖋"},{name:"lower-left-ballpoint-pen",hexadecimal:"🖊"},{name:"lower-left-paintbrush",hexadecimal:"🖌"},{name:"lower-left-crayon",hexadecimal:"🖍"},{name:"memo",hexadecimal:"📝"},{name:"briefcase",hexadecimal:"💼"},{name:"file-folder",hexadecimal:"📁"},{name:"open-file-folder",hexadecimal:"📂"},{name:"card-index-dividers",hexadecimal:"🗂"},{name:"calendar",hexadecimal:"📅"},{name:"tear-off-calendar",hexadecimal:"📆"},{name:"spiral-note-pad",hexadecimal:"🗒"},{name:"spiral-calendar-pad",hexadecimal:"🗓"},{name:"card-index",hexadecimal:"📇"},{name:"chart-with-upwards-trend",hexadecimal:"📈"},{name:"chart-with-downwards-trend",hexadecimal:"📉"},{name:"bar-chart",hexadecimal:"📊"},{name:"clipboard",hexadecimal:"📋"},{name:"pushpin",hexadecimal:"📌"},{name:"round-pushpin",hexadecimal:"📍"},{name:"paperclip",hexadecimal:"📎"},{name:"linked-paperclips",hexadecimal:"🖇"},{name:"straight-ruler",hexadecimal:"📏"},{name:"triangular-ruler",hexadecimal:"📐"},{name:"black-scissors",hexadecimal:"✂"},{name:"card-file-box",hexadecimal:"🗃"},{name:"file-cabinet",hexadecimal:"🗄"},{name:"wastebasket",hexadecimal:"🗑"},{name:"lock",hexadecimal:"🔒"},{name:"open-lock",hexadecimal:"🔓"},{name:"lock-with-ink-pen",hexadecimal:"🔏"},{name:"closed-lock-with-key",hexadecimal:"🔐"},{name:"key",hexadecimal:"🔑"},{name:"old-key",hexadecimal:"🗝"},{name:"hammer",hexadecimal:"🔨"},{name:"pick",hexadecimal:"⛏"},{name:"hammer-and-pick",hexadecimal:"⚒"},{name:"hammer-and-wrench",hexadecimal:"🛠"},{name:"dagger-knife",hexadecimal:"🗡"},{name:"crossed-swords",hexadecimal:"⚔"},{name:"pistol",hexadecimal:"🔫"},{name:"bow-and-arrow",hexadecimal:"🏹"},{name:"shield",hexadecimal:"🛡"},{name:"wrench",hexadecimal:"🔧"},{name:"nut-and-bolt",hexadecimal:"🔩"},{name:"gear",hexadecimal:"⚙"},{name:"compression",hexadecimal:"🗜"},{name:"alembic",hexadecimal:"⚗"},{name:"scales",hexadecimal:"⚖"},{name:"link-symbol",hexadecimal:"🔗"},{name:"chains",hexadecimal:"⛓"},{name:"syringe",hexadecimal:"💉"},{name:"pill",hexadecimal:"💊"},{name:"smoking-symbol",hexadecimal:"🚬"},{name:"coffin",hexadecimal:"⚰"},{name:"funeral-urn",hexadecimal:"⚱"},{name:"moyai",hexadecimal:"🗿"},{name:"oil-drum",hexadecimal:"🛢"},{name:"crystal-ball",hexadecimal:"🔮"},{name:"shopping-trolley",hexadecimal:"🛒"},{name:"automated-teller-machine",hexadecimal:"🏧"},{name:"put-litter-in-its-place-symbol",hexadecimal:"🚮"},{name:"potable-water-symbol",hexadecimal:"🚰"},{name:"wheelchair-symbol",hexadecimal:"♿"},{name:"mens-symbol",hexadecimal:"🚹"},{name:"womens-symbol",hexadecimal:"🚺"},{name:"restroom",hexadecimal:"🚻"},{name:"baby-symbol",hexadecimal:"🚼"},{name:"water-closet",hexadecimal:"🚾"},{name:"passport-control",hexadecimal:"🛂"},{name:"customs",hexadecimal:"🛃"},{name:"baggage-claim",hexadecimal:"🛄"},{name:"left-luggage",hexadecimal:"🛅"},{name:"warning-sign",hexadecimal:"⚠"},{name:"children-crossing",hexadecimal:"🚸"},{name:"no-entry",hexadecimal:"⛔"},{name:"no-entry-sign",hexadecimal:"🚫"},{name:"no-bicycles",hexadecimal:"🚳"},{name:"no-smoking-symbol",hexadecimal:"🚭"},{name:"do-not-litter-symbol",hexadecimal:"🚯"},{name:"non-potable-water-symbol",hexadecimal:"🚱"},{name:"no-pedestrians",hexadecimal:"🚷"},{name:"no-mobile-phones",hexadecimal:"📵"},{name:"no-one-under-eighteen-symbol",hexadecimal:"🔞"},{name:"radioactive-sign",hexadecimal:"☢"},{name:"biohazard-sign",hexadecimal:"☣"},{name:"upwards-black-arrow",hexadecimal:"⬆"},{name:"north-east-arrow",hexadecimal:"↗"},{name:"black-rightwards-arrow",hexadecimal:"➡"},{name:"south-east-arrow",hexadecimal:"↘"},{name:"downwards-black-arrow",hexadecimal:"⬇"},{name:"south-west-arrow",hexadecimal:"↙"},{name:"leftwards-black-arrow",hexadecimal:"⬅"},{name:"north-west-arrow",hexadecimal:"↖"},{name:"up-down-arrow",hexadecimal:"↕"},{name:"left-right-arrow",hexadecimal:"↔"},{name:"leftwards-arrow-with-hook",hexadecimal:"↩"},{name:"rightwards-arrow-with-hook",hexadecimal:"↪"},{name:"arrow-pointing-rightwards-then-curving-upwards",hexadecimal:"⤴"},{name:"arrow-pointing-rightwards-then-curving-downwards",hexadecimal:"⤵"},{name:"clockwise-downwards-and-upwards-open-circle-arrows",hexadecimal:"🔃"},{name:"anticlockwise-downwards-and-upwards-open-circle-arrows",hexadecimal:"🔄"},{name:"back-with-leftwards-arrow-above",hexadecimal:"🔙"},{name:"end-with-leftwards-arrow-above",hexadecimal:"🔚"},{name:"on-with-exclamation-mark-with-left-right-arrow-above",hexadecimal:"🔛"},{name:"soon-with-rightwards-arrow-above",hexadecimal:"🔜"},{name:"top-with-upwards-arrow-above",hexadecimal:"🔝"},{name:"place-of-worship",hexadecimal:"🛐"},{name:"atom-symbol",hexadecimal:"⚛"},{name:"om-symbol",hexadecimal:"🕉"},{name:"star-of-david",hexadecimal:"✡"},{name:"wheel-of-dharma",hexadecimal:"☸"},{name:"yin-yang",hexadecimal:"☯"},{name:"latin-cross",hexadecimal:"✝"},{name:"orthodox-cross",hexadecimal:"☦"},{name:"star-and-crescent",hexadecimal:"☪"},{name:"peace-symbol",hexadecimal:"☮"},{name:"menorah-with-nine-branches",hexadecimal:"🕎"},{name:"six-pointed-star-with-middle-dot",hexadecimal:"🔯"},{name:"black-universal-recycling-symbol",hexadecimal:"♻"},{name:"name-badge",hexadecimal:"📛"},{name:"fleur-de-lis",hexadecimal:"⚜"},{name:"japanese-symbol-for-beginner",hexadecimal:"🔰"},{name:"trident-emblem",hexadecimal:"🔱"},{name:"heavy-large-circle",hexadecimal:"⭕"},{name:"white-heavy-check-mark",hexadecimal:"✅"},{name:"ballot-box-with-check",hexadecimal:"☑"},{name:"heavy-check-mark",hexadecimal:"✔"},{name:"heavy-multiplication-x",hexadecimal:"✖"},{name:"cross-mark",hexadecimal:"❌"},{name:"negative-squared-cross-mark",hexadecimal:"❎"},{name:"heavy-plus-sign",hexadecimal:"➕"},{name:"heavy-minus-sign",hexadecimal:"➖"},{name:"heavy-division-sign",hexadecimal:"➗"},{name:"curly-loop",hexadecimal:"➰"},{name:"double-curly-loop",hexadecimal:"➿"},{name:"part-alternation-mark",hexadecimal:"〽"},{name:"eight-spoked-asterisk",hexadecimal:"✳"},{name:"eight-pointed-black-star",hexadecimal:"✴"},{name:"sparkle",hexadecimal:"❇"},{name:"double-exclamation-mark",hexadecimal:"‼"},{name:"exclamation-question-mark",hexadecimal:"⁉"},{name:"black-question-mark-ornament",hexadecimal:"❓"},{name:"white-question-mark-ornament",hexadecimal:"❔"},{name:"white-exclamation-mark-ornament",hexadecimal:"❕"},{name:"heavy-exclamation-mark-symbol",hexadecimal:"❗"},{name:"wavy-dash",hexadecimal:"〰"},{name:"copyright-sign",hexadecimal:"©"},{name:"registered-sign",hexadecimal:"®"},{name:"trade-mark-sign",hexadecimal:"™"},{name:"aries",hexadecimal:"♈"},{name:"taurus",hexadecimal:"♉"},{name:"gemini",hexadecimal:"♊"},{name:"cancer",hexadecimal:"♋"},{name:"leo",hexadecimal:"♌"},{name:"virgo",hexadecimal:"♍"},{name:"libra",hexadecimal:"♎"},{name:"scorpius",hexadecimal:"♏"},{name:"sagittarius",hexadecimal:"♐"},{name:"capricorn",hexadecimal:"♑"},{name:"aquarius",hexadecimal:"♒"},{name:"pisces",hexadecimal:"♓"},{name:"ophiuchus",hexadecimal:"⛎"},{name:"twisted-rightwards-arrows",hexadecimal:"🔀"},{name:"clockwise-rightwards-and-leftwards-open-circle-arrows",hexadecimal:"🔁"},{name:"clockwise-rightwards-and-leftwards-open-circle-arrows-with-circled-one-overlay",hexadecimal:"🔂"},{name:"black-right-pointing-triangle",hexadecimal:"▶"},{name:"black-right-pointing-double-triangle",hexadecimal:"⏩"},{name:"black-right-pointing-double-triangle-with-vertical-bar",hexadecimal:"⏭"},{name:"black-right-pointing-triangle-with-double-vertical-bar",hexadecimal:"⏯"},{name:"black-left-pointing-triangle",hexadecimal:"◀"},{name:"black-left-pointing-double-triangle",hexadecimal:"⏪"},{name:"black-left-pointing-double-triangle-with-vertical-bar",hexadecimal:"⏮"},{name:"up-pointing-small-red-triangle",hexadecimal:"🔼"},{name:"black-up-pointing-double-triangle",hexadecimal:"⏫"},{name:"down-pointing-small-red-triangle",hexadecimal:"🔽"},{name:"black-down-pointing-double-triangle",hexadecimal:"⏬"},{name:"double-vertical-bar",hexadecimal:"⏸"},{name:"black-square-for-stop",hexadecimal:"⏹"},{name:"black-circle-for-record",hexadecimal:"⏺"},{name:"eject-symbol",hexadecimal:"⏏"},{name:"cinema",hexadecimal:"🎦"},{name:"low-brightness-symbol",hexadecimal:"🔅"},{name:"high-brightness-symbol",hexadecimal:"🔆"},{name:"antenna-with-bars",hexadecimal:"📶"},{name:"vibration-mode",hexadecimal:"📳"},{name:"mobile-phone-off",hexadecimal:"📴"},{name:"keycap-#",hexadecimal:"#️⃣"},{name:"keycap-*",hexadecimal:"*️⃣"},{name:"keycap-0",hexadecimal:"0️⃣"},{name:"keycap-1",hexadecimal:"1️⃣"},{name:"keycap-2",hexadecimal:"2️⃣"},{name:"keycap-3",hexadecimal:"3️⃣"},{name:"keycap-4",hexadecimal:"4️⃣"},{name:"keycap-5",hexadecimal:"5️⃣"},{name:"keycap-6",hexadecimal:"6️⃣"},{name:"keycap-7",hexadecimal:"7️⃣"},{name:"keycap-8",hexadecimal:"8️⃣"},{name:"keycap-9",hexadecimal:"9️⃣"},{name:"keycap-ten",hexadecimal:"🔟"},{name:"hundred-points-symbol",hexadecimal:"💯"},{name:"input-symbol-for-latin-capital-letters",hexadecimal:"🔠"},{name:"input-symbol-for-latin-small-letters",hexadecimal:"🔡"},{name:"input-symbol-for-numbers",hexadecimal:"🔢"},{name:"input-symbol-for-symbols",hexadecimal:"🔣"},{name:"input-symbol-for-latin-letters",hexadecimal:"🔤"},{name:"negative-squared-latin-capital-letter-a",hexadecimal:"🅰"},{name:"negative-squared-ab",hexadecimal:"🆎"},{name:"negative-squared-latin-capital-letter-b",hexadecimal:"🅱"},{name:"squared-cl",hexadecimal:"🆑"},{name:"squared-cool",hexadecimal:"🆒"},{name:"squared-free",hexadecimal:"🆓"},{name:"information-source",hexadecimal:"ℹ"},{name:"squared-id",hexadecimal:"🆔"},{name:"circled-latin-capital-letter-m",hexadecimal:"Ⓜ"},{name:"squared-new",hexadecimal:"🆕"},{name:"squared-ng",hexadecimal:"🆖"},{name:"negative-squared-latin-capital-letter-o",hexadecimal:"🅾"},{name:"squared-ok",hexadecimal:"🆗"},{name:"negative-squared-latin-capital-letter-p",hexadecimal:"🅿"},{name:"squared-sos",hexadecimal:"🆘"},{name:"squared-up-with-exclamation-mark",hexadecimal:"🆙"},{name:"squared-vs",hexadecimal:"🆚"},{name:"squared-katakana-koko",hexadecimal:"🈁"},{name:"squared-katakana-sa",hexadecimal:"🈂"},{name:"squared-cjk-unified-ideograph-6708",hexadecimal:"🈷"},{name:"squared-cjk-unified-ideograph-6709",hexadecimal:"🈶"},{name:"squared-cjk-unified-ideograph-6307",hexadecimal:"🈯"},{name:"circled-ideograph-advantage",hexadecimal:"🉐"},{name:"squared-cjk-unified-ideograph-5272",hexadecimal:"🈹"},{name:"squared-cjk-unified-ideograph-7121",hexadecimal:"🈚"},{name:"squared-cjk-unified-ideograph-7981",hexadecimal:"🈲"},{name:"circled-ideograph-accept",hexadecimal:"🉑"},{name:"squared-cjk-unified-ideograph-7533",hexadecimal:"🈸"},{name:"squared-cjk-unified-ideograph-5408",hexadecimal:"🈴"},{name:"squared-cjk-unified-ideograph-7a7a",hexadecimal:"🈳"},{name:"circled-ideograph-congratulation",hexadecimal:"㊗"},{name:"circled-ideograph-secret",hexadecimal:"㊙"},{name:"squared-cjk-unified-ideograph-55b6",hexadecimal:"🈺"},{name:"squared-cjk-unified-ideograph-6e80",hexadecimal:"🈵"},{name:"black-small-square",hexadecimal:"▪"},{name:"white-small-square",hexadecimal:"▫"},{name:"white-medium-square",hexadecimal:"◻"},{name:"black-medium-square",hexadecimal:"◼"},{name:"white-medium-small-square",hexadecimal:"◽"},{name:"black-medium-small-square",hexadecimal:"◾"},{name:"black-large-square",hexadecimal:"⬛"},{name:"white-large-square",hexadecimal:"⬜"},{name:"large-orange-diamond",hexadecimal:"🔶"},{name:"large-blue-diamond",hexadecimal:"🔷"},{name:"small-orange-diamond",hexadecimal:"🔸"},{name:"small-blue-diamond",hexadecimal:"🔹"},{name:"up-pointing-red-triangle",hexadecimal:"🔺"},{name:"down-pointing-red-triangle",hexadecimal:"🔻"},{name:"diamond-shape-with-a-dot-inside",hexadecimal:"💠"},{name:"radio-button",hexadecimal:"🔘"},{name:"black-square-button",hexadecimal:"🔲"},{name:"white-square-button",hexadecimal:"🔳"},{name:"medium-white-circle",hexadecimal:"⚪"},{name:"medium-black-circle",hexadecimal:"⚫"},{name:"large-red-circle",hexadecimal:"🔴"},{name:"large-blue-circle",hexadecimal:"🔵"},{name:"chequered-flag",hexadecimal:"🏁"},{name:"triangular-flag-on-post",hexadecimal:"🚩"},{name:"crossed-flags",hexadecimal:"🎌"},{name:"waving-black-flag",hexadecimal:"🏴"},{name:"waving-white-flag",hexadecimal:"🏳"},{name:"ascension-island",hexadecimal:"🇦🇨"},{name:"andorra",hexadecimal:"🇦🇩"},{name:"united-arab-emirates",hexadecimal:"🇦🇪"},{name:"afghanistan",hexadecimal:"🇦🇫"},{name:"antigua-&-barbuda",hexadecimal:"🇦🇬"},{name:"anguilla",hexadecimal:"🇦🇮"},{name:"albania",hexadecimal:"🇦🇱"},{name:"armenia",hexadecimal:"🇦🇲"},{name:"angola",hexadecimal:"🇦🇴"},{name:"antarctica",hexadecimal:"🇦🇶"},{name:"argentina",hexadecimal:"🇦🇷"},{name:"american-samoa",hexadecimal:"🇦🇸"},{name:"austria",hexadecimal:"🇦🇹"},{name:"australia",hexadecimal:"🇦🇺"},{name:"aruba",hexadecimal:"🇦🇼"},{name:"ã…land-islands",hexadecimal:"🇦🇽"},{name:"azerbaijan",hexadecimal:"🇦🇿"},{name:"bosnia-&-herzegovina",hexadecimal:"🇧🇦"},{name:"barbados",hexadecimal:"🇧🇧"},{name:"bangladesh",hexadecimal:"🇧🇩"},{name:"belgium",hexadecimal:"🇧🇪"},{name:"burkina-faso",hexadecimal:"🇧🇫"},{name:"bulgaria",hexadecimal:"🇧🇬"},{name:"bahrain",hexadecimal:"🇧🇭"},{name:"burundi",hexadecimal:"🇧🇮"},{name:"benin",hexadecimal:"🇧🇯"},{name:"st.-barthã©lemy",hexadecimal:"🇧🇱"},{name:"bermuda",hexadecimal:"🇧🇲"},{name:"brunei",hexadecimal:"🇧🇳"},{name:"bolivia",hexadecimal:"🇧🇴"},{name:"caribbean-netherlands",hexadecimal:"🇧🇶"},{name:"brazil",hexadecimal:"🇧🇷"},{name:"bahamas",hexadecimal:"🇧🇸"},{name:"bhutan",hexadecimal:"🇧🇹"},{name:"bouvet-island",hexadecimal:"🇧🇻"},{name:"botswana",hexadecimal:"🇧🇼"},{name:"belarus",hexadecimal:"🇧🇾"},{name:"belize",hexadecimal:"🇧🇿"},{name:"canada",hexadecimal:"🇨🇦"},{name:"cocos-(keeling)-islands",hexadecimal:"🇨🇨"},{name:"congo-kinshasa",hexadecimal:"🇨🇩"},{name:"central-african-republic",hexadecimal:"🇨🇫"},{name:"congo-brazzaville",hexadecimal:"🇨🇬"},{name:"switzerland",hexadecimal:"🇨🇭"},{name:"cã´te-d’ivoire",hexadecimal:"🇨🇮"},{name:"cook-islands",hexadecimal:"🇨🇰"},{name:"chile",hexadecimal:"🇨🇱"},{name:"cameroon",hexadecimal:"🇨🇲"},{name:"china",hexadecimal:"🇨🇳"},{name:"colombia",hexadecimal:"🇨🇴"},{name:"clipperton-island",hexadecimal:"🇨🇵"},{name:"costa-rica",hexadecimal:"🇨🇷"},{name:"cuba",hexadecimal:"🇨🇺"},{name:"cape-verde",hexadecimal:"🇨🇻"},{name:"curaã§ao",hexadecimal:"🇨🇼"},{name:"christmas-island",hexadecimal:"🇨🇽"},{name:"cyprus",hexadecimal:"🇨🇾"},{name:"czech-republic",hexadecimal:"🇨🇿"},{name:"germany",hexadecimal:"🇩🇪"},{name:"diego-garcia",hexadecimal:"🇩🇬"},{name:"djibouti",hexadecimal:"🇩🇯"},{name:"denmark",hexadecimal:"🇩🇰"},{name:"dominica",hexadecimal:"🇩🇲"},{name:"dominican-republic",hexadecimal:"🇩🇴"},{name:"algeria",hexadecimal:"🇩🇿"},{name:"ceuta-&-melilla",hexadecimal:"🇪🇦"},{name:"ecuador",hexadecimal:"🇪🇨"},{name:"estonia",hexadecimal:"🇪🇪"},{name:"egypt",hexadecimal:"🇪🇬"},{name:"western-sahara",hexadecimal:"🇪🇭"},{name:"eritrea",hexadecimal:"🇪🇷"},{name:"spain",hexadecimal:"🇪🇸"},{name:"ethiopia",hexadecimal:"🇪🇹"},{name:"european-union",hexadecimal:"🇪🇺"},{name:"finland",hexadecimal:"🇫🇮"},{name:"fiji",hexadecimal:"🇫🇯"},{name:"falkland-islands",hexadecimal:"🇫🇰"},{name:"micronesia",hexadecimal:"🇫🇲"},{name:"faroe-islands",hexadecimal:"🇫🇴"},{name:"france",hexadecimal:"🇫🇷"},{name:"gabon",hexadecimal:"🇬🇦"},{name:"united-kingdom",hexadecimal:"🇬🇧"},{name:"grenada",hexadecimal:"🇬🇩"},{name:"georgia",hexadecimal:"🇬🇪"},{name:"french-guiana",hexadecimal:"🇬🇫"},{name:"guernsey",hexadecimal:"🇬🇬"},{name:"ghana",hexadecimal:"🇬🇭"},{name:"gibraltar",hexadecimal:"🇬🇮"},{name:"greenland",hexadecimal:"🇬🇱"},{name:"gambia",hexadecimal:"🇬🇲"},{name:"guinea",hexadecimal:"🇬🇳"},{name:"guadeloupe",hexadecimal:"🇬🇵"},{name:"equatorial-guinea",hexadecimal:"🇬🇶"},{name:"greece",hexadecimal:"🇬🇷"},{name:"south-georgia-&-south-sandwich-islands",hexadecimal:"🇬🇸"},{name:"guatemala",hexadecimal:"🇬🇹"},{name:"guam",hexadecimal:"🇬🇺"},{name:"guinea-bissau",hexadecimal:"🇬🇼"},{name:"guyana",hexadecimal:"🇬🇾"},{name:"hong-kong-sar-china",hexadecimal:"🇭🇰"},{name:"heard-&-mcdonald-islands",hexadecimal:"🇭🇲"},{name:"honduras",hexadecimal:"🇭🇳"},{name:"croatia",hexadecimal:"🇭🇷"},{name:"haiti",hexadecimal:"🇭🇹"},{name:"hungary",hexadecimal:"🇭🇺"},{name:"canary-islands",hexadecimal:"🇮🇨"},{name:"indonesia",hexadecimal:"🇮🇩"},{name:"ireland",hexadecimal:"🇮🇪"},{name:"israel",hexadecimal:"🇮🇱"},{name:"isle-of-man",hexadecimal:"🇮🇲"},{name:"india",hexadecimal:"🇮🇳"},{name:"british-indian-ocean-territory",hexadecimal:"🇮🇴"},{name:"iraq",hexadecimal:"🇮🇶"},{name:"iran",hexadecimal:"🇮🇷"},{name:"iceland",hexadecimal:"🇮🇸"},{name:"italy",hexadecimal:"🇮🇹"},{name:"jersey",hexadecimal:"🇯🇪"},{name:"jamaica",hexadecimal:"🇯🇲"},{name:"jordan",hexadecimal:"🇯🇴"},{name:"japan",hexadecimal:"🇯🇵"},{name:"kenya",hexadecimal:"🇰🇪"},{name:"kyrgyzstan",hexadecimal:"🇰🇬"},{name:"cambodia",hexadecimal:"🇰🇭"},{name:"kiribati",hexadecimal:"🇰🇮"},{name:"comoros",hexadecimal:"🇰🇲"},{name:"st.-kitts-&-nevis",hexadecimal:"🇰🇳"},{name:"north-korea",hexadecimal:"🇰🇵"},{name:"south-korea",hexadecimal:"🇰🇷"},{name:"kuwait",hexadecimal:"🇰🇼"},{name:"cayman-islands",hexadecimal:"🇰🇾"},{name:"kazakhstan",hexadecimal:"🇰🇿"},{name:"laos",hexadecimal:"🇱🇦"},{name:"lebanon",hexadecimal:"🇱🇧"},{name:"st.-lucia",hexadecimal:"🇱🇨"},{name:"liechtenstein",hexadecimal:"🇱🇮"},{name:"sri-lanka",hexadecimal:"🇱🇰"},{name:"liberia",hexadecimal:"🇱🇷"},{name:"lesotho",hexadecimal:"🇱🇸"},{name:"lithuania",hexadecimal:"🇱🇹"},{name:"luxembourg",hexadecimal:"🇱🇺"},{name:"latvia",hexadecimal:"🇱🇻"},{name:"libya",hexadecimal:"🇱🇾"},{name:"morocco",hexadecimal:"🇲🇦"},{name:"monaco",hexadecimal:"🇲🇨"},{name:"moldova",hexadecimal:"🇲🇩"},{name:"montenegro",hexadecimal:"🇲🇪"},{name:"st.-martin",hexadecimal:"🇲🇫"},{name:"madagascar",hexadecimal:"🇲🇬"},{name:"marshall-islands",hexadecimal:"🇲🇭"},{name:"macedonia",hexadecimal:"🇲🇰"},{name:"mali",hexadecimal:"🇲🇱"},{name:"myanmar-(burma)",hexadecimal:"🇲🇲"},{name:"mongolia",hexadecimal:"🇲🇳"},{name:"macau-sar-china",hexadecimal:"🇲🇴"},{name:"northern-mariana-islands",hexadecimal:"🇲🇵"},{name:"martinique",hexadecimal:"🇲🇶"},{name:"mauritania",hexadecimal:"🇲🇷"},{name:"montserrat",hexadecimal:"🇲🇸"},{name:"malta",hexadecimal:"🇲🇹"},{name:"mauritius",hexadecimal:"🇲🇺"},{name:"maldives",hexadecimal:"🇲🇻"},{name:"malawi",hexadecimal:"🇲🇼"},{name:"mexico",hexadecimal:"🇲🇽"},{name:"malaysia",hexadecimal:"🇲🇾"},{name:"mozambique",hexadecimal:"🇲🇿"},{name:"namibia",hexadecimal:"🇳🇦"},{name:"new-caledonia",hexadecimal:"🇳🇨"},{name:"niger",hexadecimal:"🇳🇪"},{name:"norfolk-island",hexadecimal:"🇳🇫"},{name:"nigeria",hexadecimal:"🇳🇬"},{name:"nicaragua",hexadecimal:"🇳🇮"},{name:"netherlands",hexadecimal:"🇳🇱"},{name:"norway",hexadecimal:"🇳🇴"},{name:"nepal",hexadecimal:"🇳🇵"},{name:"nauru",hexadecimal:"🇳🇷"},{name:"niue",hexadecimal:"🇳🇺"},{name:"new-zealand",hexadecimal:"🇳🇿"},{name:"oman",hexadecimal:"🇴🇲"},{name:"panama",hexadecimal:"🇵🇦"},{name:"peru",hexadecimal:"🇵🇪"},{name:"french-polynesia",hexadecimal:"🇵🇫"},{name:"papua-new-guinea",hexadecimal:"🇵🇬"},{name:"philippines",hexadecimal:"🇵🇭"},{name:"pakistan",hexadecimal:"🇵🇰"},{name:"poland",hexadecimal:"🇵🇱"},{name:"st.-pierre-&-miquelon",hexadecimal:"🇵🇲"},{name:"pitcairn-islands",hexadecimal:"🇵🇳"},{name:"puerto-rico",hexadecimal:"🇵🇷"},{name:"palestinian-territories",hexadecimal:"🇵🇸"},{name:"portugal",hexadecimal:"🇵🇹"},{name:"palau",hexadecimal:"🇵🇼"},{name:"paraguay",hexadecimal:"🇵🇾"},{name:"qatar",hexadecimal:"🇶🇦"},{name:"rã©union",hexadecimal:"🇷🇪"},{name:"romania",hexadecimal:"🇷🇴"},{name:"serbia",hexadecimal:"🇷🇸"},{name:"russia",hexadecimal:"🇷🇺"},{name:"rwanda",hexadecimal:"🇷🇼"},{name:"saudi-arabia",hexadecimal:"🇸🇦"},{name:"solomon-islands",hexadecimal:"🇸🇧"},{name:"seychelles",hexadecimal:"🇸🇨"},{name:"sudan",hexadecimal:"🇸🇩"},{name:"sweden",hexadecimal:"🇸🇪"},{name:"singapore",hexadecimal:"🇸🇬"},{name:"st.-helena",hexadecimal:"🇸🇭"},{name:"slovenia",hexadecimal:"🇸🇮"},{name:"svalbard-&-jan-mayen",hexadecimal:"🇸🇯"},{name:"slovakia",hexadecimal:"🇸🇰"},{name:"sierra-leone",hexadecimal:"🇸🇱"},{name:"san-marino",hexadecimal:"🇸🇲"},{name:"senegal",hexadecimal:"🇸🇳"},{name:"somalia",hexadecimal:"🇸🇴"},{name:"suriname",hexadecimal:"🇸🇷"},{name:"south-sudan",hexadecimal:"🇸🇸"},{name:"sã£o-tomã©-&-prãncipe",hexadecimal:"🇸🇹"},{name:"el-salvador",hexadecimal:"🇸🇻"},{name:"sint-maarten",hexadecimal:"🇸🇽"},{name:"syria",hexadecimal:"🇸🇾"},{name:"swaziland",hexadecimal:"🇸🇿"},{name:"tristan-da-cunha",hexadecimal:"🇹🇦"},{name:"turks-&-caicos-islands",hexadecimal:"🇹🇨"},{name:"chad",hexadecimal:"🇹🇩"},{name:"french-southern-territories",hexadecimal:"🇹🇫"},{name:"togo",hexadecimal:"🇹🇬"},{name:"thailand",hexadecimal:"🇹🇭"},{name:"tajikistan",hexadecimal:"🇹🇯"},{name:"tokelau",hexadecimal:"🇹🇰"},{name:"timor-leste",hexadecimal:"🇹🇱"},{name:"turkmenistan",hexadecimal:"🇹🇲"},{name:"tunisia",hexadecimal:"🇹🇳"},{name:"tonga",hexadecimal:"🇹🇴"},{name:"turkey",hexadecimal:"🇹🇷"},{name:"trinidad-&-tobago",hexadecimal:"🇹🇹"},{name:"tuvalu",hexadecimal:"🇹🇻"},{name:"taiwan",hexadecimal:"🇹🇼"},{name:"tanzania",hexadecimal:"🇹🇿"},{name:"ukraine",hexadecimal:"🇺🇦"},{name:"uganda",hexadecimal:"🇺🇬"},{name:"u.s.-outlying-islands",hexadecimal:"🇺🇲"},{name:"united-states",hexadecimal:"🇺🇸"},{name:"uruguay",hexadecimal:"🇺🇾"},{name:"uzbekistan",hexadecimal:"🇺🇿"},{name:"vatican-city",hexadecimal:"🇻🇦"},{name:"st.-vincent-&-grenadines",hexadecimal:"🇻🇨"},{name:"venezuela",hexadecimal:"🇻🇪"},{name:"british-virgin-islands",hexadecimal:"🇻🇬"},{name:"u.s.-virgin-islands",hexadecimal:"🇻🇮"},{name:"vietnam",hexadecimal:"🇻🇳"},{name:"vanuatu",hexadecimal:"🇻🇺"},{name:"wallis-&-futuna",hexadecimal:"🇼🇫"},{name:"samoa",hexadecimal:"🇼🇸"},{name:"kosovo",hexadecimal:"🇽🇰"},{name:"yemen",hexadecimal:"🇾🇪"},{name:"mayotte",hexadecimal:"🇾🇹"},{name:"south-africa",hexadecimal:"🇿🇦"},{name:"zambia",hexadecimal:"🇿🇲"},{name:"zimbabwe",hexadecimal:"🇿🇼"}],na=({emojis:a,onSelect:s,onClose:n})=>{const[r,l]=C.useState({start:0,end:80}),m=8,i=40,v=400,y=C.useCallback(o=>{const u=o.currentTarget.scrollTop,E=Math.floor(u/i),b=Math.min(E+Math.ceil(v/i)+2,Math.ceil(a.length/m));l({start:E*m,end:b*m})},[a.length,i,v,m]),p=C.useCallback(o=>{const u=o.match(/&#x([0-9A-Fa-f]+);/g);if(!u)return"";const E=u.map(b=>{const w=b.replace(/&#x|;/g,"");return parseInt(w,16)});return String.fromCodePoint(...E)},[]),j=Math.ceil(a.length/m)*i,V=a.slice(r.start,r.end);return e.jsx("div",{className:"rsp-h-[400px] rsp-overflow-y-auto rsp-relative",onScroll:y,children:e.jsx("div",{style:{height:j},className:"rsp-relative",children:e.jsx("div",{className:"rsp-absolute rsp-w-full rsp-grid rsp-grid-cols-8 rsp-gap-1",style:{top:Math.floor(r.start/m)*i,transform:"translateY(0px)"},children:V.map((o,u)=>{const E=r.start+u;return e.jsx("button",{onClick:()=>{s(p(o.hexadecimal))},className:"rsp-w-10 rsp-h-10 rsp-flex rsp-items-center rsp-justify-center rsp-text-xl hover:rsp-bg-gray-100 rsp-rounded rsp-transition-colors",title:o.name,style:{height:i},children:p(o.hexadecimal)},E)})})})})};function he({isOpen:a,onClose:s,onSelect:n}){const[r,l]=C.useState(""),m=C.useMemo(()=>r?ye.filter(i=>i.name.toLowerCase().includes(r.toLowerCase())):ye,[r]);return C.useEffect(()=>{a||l("")},[a]),e.jsx(ie,{isOpen:a,onClose:s,title:"Select Emoji",children:e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:"text",placeholder:"Search emojis...",value:r,onChange:i=>l(i.target.value),className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500"}),r&&e.jsx("button",{onClick:()=>l(""),className:"rsp-absolute rsp-right-2 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-gray-400 hover:rsp-text-gray-600",children:"×"})]}),e.jsx("div",{className:"rsp-flex rsp-gap-2 rsp-flex-wrap",children:["😀","🎉","❤️","👍","🔥","💯","✨","🎯"].map(i=>e.jsx("button",{onClick:()=>{n(i)},className:"rsp-w-8 rsp-h-8 rsp-flex rsp-items-center rsp-justify-center rsp-text-lg hover:rsp-bg-gray-100 rsp-rounded rsp-transition-colors",children:i},i))}),e.jsxs("div",{className:"rsp-text-sm rsp-text-gray-500",children:[m.length," emojis found"]}),e.jsx(na,{emojis:m,onSelect:n,onClose:s})]})})}function ia({template:a,setTemplate:s}){const[n,r]=C.useState(!1),[l,m]=C.useState(null),[i,v]=C.useState(null),[y,p]=C.useState(null),[j,V]=C.useState(!1),o=()=>{const t=(a.body||"").match(/{{\d+}}/g);if(!t)return 0;const d=t.map(g=>{const h=g.match(/{{(\d+)}}/);return h?parseInt(h[1],10):0});return d.length>0?Math.max(...d):0},u=()=>{const d=`{{${o()+1}}}`;if(i&&a.body.length+d.length<=1024){const g=i.selectionStart||a.body.length,h=a.body.substring(0,g),S=a.body.substring(g),B=h+d+S;s({...a,body:B}),setTimeout(()=>{if(i){const c=g+d.length;i.setSelectionRange(c,c),i.focus()}},0)}},E=()=>{m("body"),r(!0),setTimeout(()=>{i&&i.focus()},0)},b=w=>{if(l==="body"){if(!i)return;const t=i.selectionStart||a.body.length,d=1024,g=a.body;if(g.length+w.length<=d){const h=g.substring(0,t),S=g.substring(t),B=h+w+S;s({...a,body:B}),setTimeout(()=>{if(i){const c=t+w.length;i.setSelectionRange(c,c),i.focus()}},0)}}else if(l==="footer"){if(!y)return;const t=y.selectionStart||a.footer.length,d=60,g=a.footer;if(g.length+w.length<=d){const h=g.substring(0,t),S=g.substring(t),B=h+w+S;s({...a,footer:B}),setTimeout(()=>{if(y){const c=t+w.length;y.setSelectionRange(c,c),y.focus()}},0)}}};return e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Body"}),e.jsx("div",{className:"rsp-relative",children:e.jsx("textarea",{ref:v,value:a.body,onChange:w=>s({...a,body:w.target.value}),maxLength:1024,rows:6,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white rsp-resize-none rsp-shadow-sm",placeholder:"Enter the text for your message",onFocus:()=>m("body"),onBlur:()=>V(!0)})}),!a.body&&j&&e.jsx("p",{className:"rsp-text-xs rsp-text-red-600 rsp-mt-1",children:"Body is required."}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mt-2",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("button",{onClick:u,className:"rsp-p-1 rsp-text-gray-500 hover:rsp-text-gray-700 hover:rsp-bg-gray-100 rsp-rounded",title:"Add Variable",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"})})}),e.jsx("button",{onClick:E,className:"rsp-p-1 rsp-text-gray-500 hover:rsp-text-gray-700 hover:rsp-bg-gray-100 rsp-rounded",title:"Add emoji",children:e.jsx(pe,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsx("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-500",children:[a.body.length,"/1024 (1 WhatsAppAudience)"]})})]}),(()=>{const w=a.body.match(/\{\{(\d+)\}\}/g)||[],t=[...new Set(w.map(d=>d.replace(/[{}]/g,"")))];return t.length===0?null:e.jsxs("div",{className:"rsp-mt-3",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-2",children:"Sample Values"}),e.jsx("div",{className:"rsp-grid rsp-grid-cols-3 rsp-gap-2",children:t.map(d=>{var g,h;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-xs rsp-text-gray-500 rsp-whitespace-nowrap",children:["{{",d,"}}",":"]}),e.jsx("input",{type:"text",value:((h=(g=a.sampleContent)==null?void 0:g.bodyVariables)==null?void 0:h[d])||"",onChange:S=>{var c,N,U;const B={...a.sampleContent,bodyVariables:{...(c=a.sampleContent)==null?void 0:c.bodyVariables,[d]:S.target.value},headerVariables:((N=a.sampleContent)==null?void 0:N.headerVariables)||{},buttonVariables:((U=a.sampleContent)==null?void 0:U.buttonVariables)||{}};s({...a,sampleContent:B})},className:"rsp-flex-1 rsp-px-2 rsp-py-1 rsp-border rsp-border-gray-300 rsp-rounded rsp-text-xs focus:rsp-outline-none focus:rsp-border-blue-500",placeholder:"Sample"}),e.jsx("button",{type:"button",onClick:()=>{var N,U,O;const S=new RegExp(`\\{\\{${d}\\}\\}`,"g"),B=(a.body||"").replace(S,""),c=Object.fromEntries(Object.entries(((N=a.sampleContent)==null?void 0:N.bodyVariables)||{}).filter(([R])=>R!==d));s({...a,body:B,sampleContent:{...a.sampleContent,bodyVariables:c,headerVariables:((U=a.sampleContent)==null?void 0:U.headerVariables)||{},buttonVariables:((O=a.sampleContent)==null?void 0:O.buttonVariables)||{}}})},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`body-sample-${d}`)})})]})})()]}),e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Footer (optional)"}),e.jsx("div",{className:"rsp-relative",children:e.jsx("input",{ref:p,type:"text",value:a.footer,onChange:w=>s({...a,footer:w.target.value}),maxLength:60,className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent",placeholder:"Footer Text",onFocus:()=>m("footer")})}),e.jsxs("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-1",children:[a.footer.length,"/60 characters"]})]}),e.jsx(he,{isOpen:n,onClose:()=>r(!1),onSelect:b})]})}function la({template:a,setTemplate:s}){var w;const[n,r]=C.useState(null),[l,m]=C.useState(!1),[i,v]=C.useState({text:"",value:"",urlType:"static"}),p={quickReply:a.buttons.filter(t=>t.type==="QUICK_REPLY").length,url:a.buttons.filter(t=>t.type==="URL").length,call:a.buttons.filter(t=>t.type==="CALL").length,flow:a.buttons.filter(t=>t.type==="FLOW").length},j=()=>{v({text:"",value:"",urlType:"static"}),r(null),m(!1)},V=t=>{if(!i.text.trim())return;let d=t==="QUICK_REPLY"?i.text:i.value;t==="CALL"&&d&&!d.startsWith("+")&&(d="+"+d);const g={id:Math.random().toString(36).substr(2,9),type:t,text:i.text,value:d,urlType:t==="URL"?i.urlType:void 0};s({...a,buttons:[...a.buttons,g]}),j()},o=t=>{s({...a,buttons:a.buttons.filter(d=>d.id!==t)})},u=(t,d,g)=>{const h=a.buttons.find(c=>c.id===t),S=d==="text"?25:d==="value"&&(h==null?void 0:h.type)==="URL"?2e3:20;let B=g.slice(0,S);d==="value"&&(h==null?void 0:h.type)==="CALL"&&B&&!B.startsWith("+")&&(B="+"+B),s({...a,buttons:a.buttons.map(c=>c.id===t?{...c,[d]:B}:c)})},E=()=>{const d=[...a.buttons.filter(h=>h.type==="URL"&&h.urlType==="dynamic").map(h=>h.value||""),i.value].join(" ").match(/{{\d+}}/g);if(!d)return 0;const g=d.map(h=>{const S=h.match(/{{(\d+)}}/);return S?parseInt(S[1],10):0});return g.length>0?Math.max(...g):0},b=[{type:"QUICK_REPLY",icon:le,label:"Quick Reply",description:"Add quick response options",limit:10,current:p.quickReply,color:"blue"},{type:"URL",icon:Ae,label:"Web URL",description:"Link to websites or pages",limit:2,current:p.url,color:"green"},{type:"CALL",icon:je,label:"Call Button",description:"Add phone number to call",limit:1,current:p.call,color:"purple"}];return e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Interactive Buttons"}),e.jsx("p",{className:"rsp-text-sm rsp-text-gray-500 rsp-mt-1",children:"Add buttons to make your message interactive"})]}),e.jsx("div",{className:"rsp-text-sm rsp-text-gray-500"})]}),e.jsx("div",{className:"rsp-bg-blue-50 rsp-border-l-4 rsp-border-blue-500 rsp-p-4 rsp-rounded-r-md",children:e.jsxs("div",{className:"rsp-flex",children:[e.jsx("div",{className:"rsp-flex-shrink-0",children:e.jsx("svg",{className:"rsp-h-5 rsp-w-5 rsp-text-blue-400",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",clipRule:"evenodd"})})}),e.jsx("div",{className:"rsp-ml-3",children:e.jsx("p",{className:"rsp-text-sm rsp-text-blue-700",children:"We recommend adding the marketing opt-out button. This can help reduce blocks from customers and increase your quality rating."})})]})}),!n&&e.jsx("div",{className:"rsp-grid rsp-grid-cols-1 md:rsp-grid-cols-2 rsp-gap-4",children:b.map(t=>{const d=t.icon,g=t.current>=t.limit;return e.jsx("button",{onClick:()=>!g&&r(t.type),disabled:g,className:`rsp-p-4 rsp-border-2 rsp-rounded-xl rsp-text-left rsp-transition-all rsp-duration-200 ${g?"rsp-border-gray-200 rsp-bg-gray-50 rsp-text-gray-400 rsp-cursor-not-allowed rsp-opacity-60":"rsp-cursor-pointer rsp-transform rsp-shadow-sm hover:rsp-shadow-md"}`,children:e.jsxs("div",{className:"rsp-flex rsp-items-start rsp-justify-between",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-3",children:[e.jsx("div",{className:`rsp-p-2 rsp-rounded-lg ${g?"rsp-bg-gray-200":"rsp-bg-white rsp-shadow-sm"}`,children:e.jsx(d,{className:"rsp-w-5 rsp-h-5"})}),e.jsxs("div",{children:[e.jsx("h4",{className:"rsp-font-semibold rsp-text-sm",children:t.label}),e.jsx("p",{className:"rsp-text-xs rsp-opacity-80 rsp-mt-1",children:t.description})]})]}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("span",{className:"rsp-text-xs rsp-font-medium rsp-px-2 rsp-py-1 rsp-rounded-full rsp-bg-white rsp-bg-opacity-70",children:[t.current,"/",t.limit]}),!g&&e.jsx(ke,{className:"rsp-w-4 rsp-h-4"})]})]})},t.type)})}),n&&e.jsxs("div",{className:"rsp-bg-gradient-to-br rsp-from-gray-50 rsp-to-gray-100 rsp-border rsp-border-gray-200 rsp-rounded-xl rsp-p-6 rsp-shadow-sm",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mb-4",children:[e.jsxs("h4",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:["Add ",(w=b.find(t=>t.type===n))==null?void 0:w.label]}),e.jsx("button",{onClick:j,className:"rsp-p-2 rsp-text-gray-400 hover:rsp-text-gray-600 hover:rsp-bg-white rsp-rounded-lg rsp-transition-colors",children:e.jsx(ee,{className:"rsp-w-5 rsp-h-5"})})]}),e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Button Text"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:"text",value:i.text,onChange:t=>v({...i,text:t.target.value.slice(0,25)}),className:"rsp-w-full rsp-px-4 rsp-py-3 rsp-border rsp-border-gray-300 rsp-rounded-lg rsp-bg-white rsp-text-sm focus:rsp-outline-none focus:rsp-ring-2 focus:rsp-ring-blue-500 focus:rsp-border-transparent rsp-shadow-sm",placeholder:"Enter button text (max 25 characters)",maxLength:25}),e.jsxs("span",{className:"rsp-absolute rsp-right-3 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-xs rsp-text-gray-400",children:[i.text.length,"/25"]})]})]}),n!=="QUICK_REPLY"&&e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:n==="URL"?"Website URL":n==="CALL"?"Phone Number":"Flow ID"}),n==="URL"&&e.jsxs("div",{className:"rsp-mb-3",children:[e.jsxs("div",{className:"rsp-flex rsp-gap-4",children:[e.jsxs("label",{className:"rsp-flex rsp-items-center rsp-cursor-pointer",children:[e.jsx("input",{type:"radio",checked:i.urlType==="static",onChange:()=>v({...i,urlType:"static"}),className:"rsp-mr-2 rsp-text-blue-600"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Static URL"})]}),e.jsxs("label",{className:"rsp-flex rsp-items-center rsp-cursor-pointer",children:[e.jsx("input",{type:"radio",checked:i.urlType==="dynamic",onChange:()=>v({...i,urlType:"dynamic"}),className:"rsp-mr-2 rsp-text-blue-600"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Dynamic URL"})]})]}),i.urlType==="dynamic"&&e.jsxs("div",{className:"rsp-mt-3 rsp-p-3 rsp-bg-blue-50 rsp-rounded-lg rsp-border rsp-border-blue-200",children:[e.jsx("h4",{className:"rsp-text-sm rsp-font-medium rsp-text-blue-800 rsp-mb-2",children:"Dynamic URL Guidelines:"}),e.jsxs("ul",{className:"rsp-text-xs rsp-text-blue-700 rsp-space-y-1",children:[e.jsx("li",{children:"• Use placeholders like: https://example.com/order/{{1}}"}),e.jsx("li",{children:"• Maximum 3 placeholders per URL ({{1}}, {{2}}, {{3}})"}),e.jsx("li",{children:"• Only HTTPS URLs are allowed"}),e.jsx("li",{children:"• WhatsApp verifies only the domain"})]})]})]}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:n==="CALL"?"tel":n==="URL"?"url":"text",value:i.value,onChange:t=>{const d=n==="URL"?2e3:20;v({...i,value:t.target.value.slice(0,d)})},className:"rsp-w-full rsp-px-4 rsp-py-3 rsp-border rsp-border-gray-300 rsp-rounded-lg rsp-bg-white rsp-text-sm focus:rsp-outline-none focus:rsp-ring-2 focus:rsp-ring-blue-500 focus:rsp-border-transparent rsp-shadow-sm",placeholder:n==="URL"?i.urlType==="dynamic"?"https://example.com/order/{{1}}?user={{2}}":"https://example.com":n==="CALL"?"+1234567890":"Flow ID",maxLength:n==="URL"?2e3:20}),e.jsxs("span",{className:"rsp-absolute rsp-right-3 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-xs rsp-text-gray-400",children:[i.value.length,"/",n==="URL"?2e3:20]})]}),n==="URL"&&i.urlType==="dynamic"&&e.jsxs("div",{className:"rsp-mt-3",children:[e.jsx("div",{className:"rsp-flex rsp-items-center rsp-gap-2 rsp-mb-2",children:e.jsx("button",{type:"button",onClick:()=>{if((i.value.match(/\{\{(\d+)\}\}/g)||[]).length>=3)return;const g=E()+1,h=i.value+`{{${g}}}`;v({...i,value:h}),m(!0)},disabled:(i.value.match(/\{\{(\d+)\}\}/g)||[]).length>=3,className:"rsp-px-2 rsp-py-2 rsp-text-xs rsp-bg-gray-300 hover:rsp-bg-gray-200 rsp-rounded rsp-text-gray-700 disabled:rsp-bg-gray-200 disabled:rsp-text-gray-500",children:"+ Add Variable"})}),(i.value.match(/\{\{(\d+)\}\}/g)||[]).length>=3&&e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-1",children:"Maximum 3 variables allowed."}),l&&e.jsxs("div",{className:"rsp-mt-4 rsp-p-4 rsp-bg-gray-50 rsp-rounded-lg rsp-border",children:[e.jsx("h4",{className:"rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-3",children:"Sample Values for URL Variables"}),e.jsx("div",{className:"rsp-space-y-3",children:(()=>{const t=i.value.match(/\{\{(\d+)\}\}/g)||[];return[...new Set(t.map(g=>g.replace(/[{}]/g,"")))].map(g=>{var h,S;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-sm rsp-text-gray-600 rsp-whitespace-nowrap",children:["Variable {{",g,"}}"]}),e.jsx("input",{type:"text",value:((S=(h=a.sampleContent)==null?void 0:h.buttonVariables)==null?void 0:S[g])||"",onChange:B=>{var N,U,O;const c={...a.sampleContent,headerVariables:((N=a.sampleContent)==null?void 0:N.headerVariables)||{},bodyVariables:((U=a.sampleContent)==null?void 0:U.bodyVariables)||{},buttonVariables:{...(O=a.sampleContent)==null?void 0:O.buttonVariables,[g]:B.target.value}};s({...a,sampleContent:c})},className:"rsp-flex-1 rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-ring-1 focus:rsp-ring-blue-500 focus:rsp-border-blue-500",placeholder:`Sample value (e.g., ${g==="1"?"order123":"user456"})`}),e.jsx("button",{type:"button",onClick:()=>{var U,O,R;const B=new RegExp(`\\{\\{${g}\\}\\}`,"g"),c=(i.value||"").replace(B,"");v({...i,value:c});const N=Object.fromEntries(Object.entries(((U=a.sampleContent)==null?void 0:U.buttonVariables)||{}).filter(([D])=>D!==g));s({...a,sampleContent:{...a.sampleContent,headerVariables:((O=a.sampleContent)==null?void 0:O.headerVariables)||{},bodyVariables:((R=a.sampleContent)==null?void 0:R.bodyVariables)||{},buttonVariables:N}})},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`sample-${g}`)})})()}),e.jsxs("div",{className:"rsp-mt-4 rsp-p-3 rsp-bg-white rsp-rounded-lg rsp-border",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-700 rsp-mb-1",children:"Preview URL:"}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-600 rsp-font-mono rsp-break-all",children:i.value.replace(/\{\{(\d+)\}\}/g,(t,d)=>{var g,h;return((h=(g=a.sampleContent)==null?void 0:g.buttonVariables)==null?void 0:h[d])||`[${t}]`})})]}),e.jsx("div",{className:"rsp-mt-3 rsp-flex rsp-justify-end",children:e.jsx("button",{type:"button",onClick:()=>m(!1),className:"rsp-px-3 rsp-py-1 rsp-text-xs rsp-text-gray-500 hover:rsp-text-gray-700",children:"Close"})})]})]})]}),e.jsxs("div",{className:"rsp-flex rsp-gap-3 rsp-pt-2",children:[e.jsx("button",{onClick:()=>V(n),disabled:!i.text.trim()||n!=="QUICK_REPLY"&&!i.value.trim(),className:"rsp-flex-1 rsp-bg-blue-600 rsp-text-white rsp-py-3 rsp-px-4 rsp-rounded-lg rsp-font-medium rsp-text-sm rsp-transition-colors hover:rsp-bg-blue-700 disabled:rsp-opacity-50 disabled:rsp-cursor-not-allowed rsp-shadow-sm",children:"Add Button"}),e.jsx("button",{onClick:j,className:"rsp-px-4 rsp-py-3 rsp-text-gray-600 rsp-bg-white rsp-border rsp-border-gray-300 rsp-rounded-lg rsp-font-medium rsp-text-sm rsp-transition-colors hover:rsp-bg-gray-50 rsp-shadow-sm",children:"Cancel"})]})]})]}),a.buttons.length>0&&e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsx("h4",{className:"rsp-text-md rsp-font-semibold rsp-text-gray-900",children:"Added Buttons"}),e.jsx("div",{className:"rsp-space-y-3",children:a.buttons.map(t=>{const d=b.find(h=>h.type===t.type),g=(d==null?void 0:d.icon)||le;return e.jsx("div",{className:"rsp-bg-white rsp-border rsp-border-gray-200 rsp-rounded-lg rsp-p-4 rsp-shadow-sm",children:e.jsxs("div",{className:"rsp-flex rsp-items-start rsp-gap-3",children:[e.jsx("div",{className:"rsp-p-2 rsp-bg-gray-50 rsp-rounded-lg",children:e.jsx(g,{className:"rsp-w-4 rsp-h-4 rsp-text-gray-600"})}),e.jsxs("div",{className:"rsp-flex-1 rsp-space-y-3",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsx("span",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-500 rsp-uppercase rsp-tracking-wider",children:t.type.replace("_"," ")}),e.jsx("button",{onClick:()=>o(t.id),className:"rsp-p-1 rsp-text-red-400 hover:rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded rsp-transition-colors",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsxs("div",{className:"rsp-grid rsp-grid-cols-1 rsp-gap-3",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:"Button Text"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:"text",value:t.text,onChange:h=>u(t.id,"text",h.target.value),maxLength:25,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-ring-1 focus:rsp-ring-blue-500 focus:rsp-border-blue-500"}),e.jsxs("span",{className:"rsp-absolute rsp-right-2 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-xs rsp-text-gray-400",children:[t.text.length,"/25"]})]})]}),t.type!=="QUICK_REPLY"&&e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:t.type==="URL"?"Website URL":t.type==="CALL"?"Phone Number":"Flow ID"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:t.type==="CALL"?"tel":t.type==="URL"?"url":"text",value:t.value||"",onChange:h=>u(t.id,"value",h.target.value),maxLength:t.type==="URL"?2e3:20,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-ring-1 focus:rsp-ring-blue-500 focus:rsp-border-blue-500"}),e.jsxs("span",{className:"rsp-absolute rsp-right-2 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-xs rsp-text-gray-400",children:[(t.value||"").length,"/",t.type==="URL"?2e3:20]})]})]})]})]})]})},t.id)})})]}),a.buttons.length===0&&!n&&e.jsxs("div",{className:"rsp-text-center rsp-py-12 rsp-bg-gray-50 rsp-rounded-xl rsp-border-2 rsp-border-dashed rsp-border-gray-300",children:[e.jsx("div",{className:"rsp-w-16 rsp-h-16 rsp-bg-white rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-mx-auto rsp-mb-4 rsp-shadow-sm",children:e.jsx(le,{className:"rsp-w-8 rsp-h-8 rsp-text-gray-400"})}),e.jsx("h3",{className:"rsp-text-lg rsp-font-medium rsp-text-gray-900 rsp-mb-2",children:"No buttons added yet"}),e.jsx("p",{className:"rsp-text-gray-500 rsp-text-sm rsp-mb-4",children:"Add interactive buttons to make your message more engaging"}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-400",children:"Choose from Quick Reply, Web URL, Call, or Flow buttons above"})]})]})}const ta=async a=>{try{if(!a)throw new Error("No file provided");const s=100*1024*1024;if(a.size>s)throw new Error(`File size too large. Maximum allowed size is ${s/(1024*1024)}MB`);const n=new FormData;n.append("file",a),console.log("Uploading file:",a.name,"Size:",a.size,"Type:",a.type);const r=await fetch("https://wiz.resul.io/Communication/UploadDocuments",{method:"POST",body:n});console.log("Upload response status:",r.status),console.log("Upload response headers:",Object.fromEntries(r.headers.entries()));const l=await r.text();console.log("Raw upload response:",l);let m;try{m=JSON.parse(l)}catch(i){throw console.error("Failed to parse upload response:",i),new Error("Invalid response from upload server")}if(console.log("Parsed upload response:",m),console.log("Upload status:",m.status),console.log("Upload message:",m.message),console.log("Upload data:",m.data),!m.status)throw new Error(m.message||"Upload failed");if(m.data&&Array.isArray(m.data)&&m.data.length>0){const i=m.data[0];if(i.url)return console.log("File uploaded successfully:",{url:i.url,filename:i.filename,originalName:i.originalName,size:i.size}),i.url;throw new Error("No file URL in upload response data")}else throw new Error("No files in upload response data")}catch(s){throw console.error("File upload error:",s),s instanceof Error?s:new Error("Unknown error occurred during file upload")}},xa=(a,s)=>{const r=a.name.toLowerCase().split(".").pop();switch(s){case"IMAGE":return["jpg","jpeg","png","gif","bmp","tiff","svg"].includes(r||"");case"VIDEO":return["mp4","mov","avi","3gpp"].includes(r||"");case"DOCUMENT":return["pdf","doc","docx","xls","xlsx","ppt","pptx","txt"].includes(r||"");default:return!1}},ca=a=>{switch(a){case"IMAGE":return 5*1024*1024;case"VIDEO":return 16*1024*1024;case"DOCUMENT":return 100*1024*1024;default:return 10*1024*1024}};function ma({template:a,setTemplate:s,onFileUpload:n}){var N,U,O,R,D;const[r,l]=C.useState({}),[,m]=C.useState({}),[i,v]=C.useState({open:!1,message:""}),[y,p]=C.useState(!1),[j,V]=C.useState(null),o=C.useRef({}),u=()=>{var k;const x={id:Math.random().toString(36).substr(2,9),headerType:"MEDIA",mediaType:((k=a.carousel)==null?void 0:k.type)==="VIDEO"?"VIDEO":"IMAGE",body:"",buttons:[]};s(L=>{var A,I;return{...L,carousel:{type:((A=a.carousel)==null?void 0:A.type)||"IMAGE",cards:[...((I=a.carousel)==null?void 0:I.cards)||[],x]}}})},E=x=>{s(k=>({...k,carousel:{...k.carousel,cards:k.carousel.cards.filter(L=>L.id!==x)}}))},b=(x,k,L)=>{s(A=>({...A,carousel:{...A.carousel,cards:A.carousel.cards.map(I=>I.id===x?{...I,[k]:L}:I)}}))},w=x=>{s(k=>{const A=((k.carousel||{type:x,cards:[]}).cards||[]).map(I=>({...I,mediaType:x,mediaUrl:""}));return{...k,carousel:{type:x,cards:A}}})},t=(x,k)=>{var F;const L=(F=a.carousel)==null?void 0:F.cards.find(K=>K.id===x);if(!L)return;const f=`{{${g(x)+1}}}`,P=L[k]+f;b(x,k,P)},d=x=>{var P;if(!j)return;const k=o.current[j],L=(P=a.carousel)==null?void 0:P.cards.find(F=>F.id===j);if(!L)return;const A=k&&typeof k.selectionStart=="number"?k.selectionStart:L.body.length,I=L.body.substring(0,A),f=L.body.substring(A),T=I+x+f;b(j,"body",T),setTimeout(()=>{const F=o.current[j];if(F){const K=A+x.length;F.setSelectionRange(K,K),F.focus()}},0),p(!1)},g=x=>{var f;const k=(f=a.carousel)==null?void 0:f.cards.find(T=>T.id===x);if(!k)return 0;const A=(k.body||"").match(/\{\{(\d+)\}\}/g);if(!A)return 0;const I=A.map(T=>{const P=T.match(/{{(\d+)}}/);return P?parseInt(P[1],10):0});return I.length>0?Math.max(...I):0},h=(x,k)=>{var I;const L=(I=a.carousel)==null?void 0:I.cards.find(f=>f.id===x);if(!L||L.buttons.length>=2)return;const A={id:Math.random().toString(36).substr(2,9),type:k,text:"",value:"",urlType:"static"};b(x,"buttons",[...L.buttons,A])},S=(x,k,L,A)=>{var T;const I=(T=a.carousel)==null?void 0:T.cards.find(P=>P.id===x);if(!I)return;const f=I.buttons.map(P=>P.id===k?{...P,[L]:A}:P);b(x,"buttons",f)},B=(x,k)=>{var I;const L=(I=a.carousel)==null?void 0:I.cards.find(f=>f.id===x);if(!L)return;const A=L.buttons.filter(f=>f.id!==k);b(x,"buttons",A)},c=async(x,k)=>{var L;try{l(T=>({...T,[x]:!0})),m(T=>({...T,[x]:!1}));const A=((L=a.carousel)==null?void 0:L.type)==="VIDEO"?"VIDEO":"IMAGE";if(!xa(k,A))throw new Error(`Invalid file type. Expected ${A.toLowerCase()} file.`);const I=ca(A);if(k.size>I){const T=I/1048576;throw new Error(`File size too large. Maximum allowed size is ${T}MB.`)}const f=await n(k);b(x,"mediaUrl",f)}catch(A){console.error("File upload failed:",A),v({open:!0,message:A instanceof Error?A.message:"File upload failed"})}finally{l(A=>({...A,[x]:!1}))}};return e.jsxs("div",{className:"rsp-space-y-6",children:[i.open&&e.jsxs("div",{className:"rsp-fixed rsp-inset-0 rsp-z-50 rsp-flex rsp-items-center rsp-justify-center",children:[e.jsx("div",{className:"rsp-absolute rsp-inset-0 rsp-bg-black rsp-bg-opacity-40",onClick:()=>v({open:!1,message:""})}),e.jsxs("div",{className:"rsp-relative rsp-z-10 rsp-bg-white rsp-rounded-lg rsp-shadow-lg rsp-w-full rsp-max-w-md rsp-p-5",children:[e.jsx("div",{className:"rsp-mb-3 rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Upload Error"}),e.jsx("div",{className:"rsp-text-sm rsp-text-gray-700 rsp-break-words rsp-whitespace-pre-wrap",children:i.message}),e.jsx("div",{className:"rsp-flex rsp-justify-end rsp-mt-4",children:e.jsx("button",{onClick:()=>v({open:!1,message:""}),className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-white rsp-bg-blue-600 rsp-rounded-md hover:rsp-bg-blue-700",children:"OK"})})]})]}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsx("h3",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Carousel Cards"}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-4",children:[e.jsxs("span",{className:"rsp-text-sm rsp-text-gray-500",children:["Total Cards: ",((N=a.carousel)==null?void 0:N.cards.length)||0,"/10"]}),e.jsxs("button",{onClick:u,disabled:(((U=a.carousel)==null?void 0:U.cards.length)||0)>=10,className:"rsp-px-4 rsp-py-2 rsp-bg-blue-600 rsp-text-white rsp-rounded-md hover:rsp-bg-blue-700 disabled:rsp-bg-gray-400 disabled:rsp-cursor-not-allowed rsp-text-sm rsp-font-medium",children:[e.jsx(ke,{className:"rsp-w-4 rsp-h-4 rsp-inline rsp-mr-2"}),"Add Card"]})]})]}),e.jsxs("div",{className:"rsp-bg-white rsp-p-4 rsp-rounded-lg rsp-border rsp-border-gray-200",children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-3",children:"Carousel Type"}),e.jsxs("div",{className:"rsp-flex rsp-gap-4",children:[e.jsxs("label",{className:"rsp-flex rsp-items-center",children:[e.jsx("input",{type:"radio",name:"carouselType",value:"IMAGE",checked:((O=a.carousel)==null?void 0:O.type)==="IMAGE",onChange:x=>w(x.target.value),className:"rsp-mr-2"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Image"})]}),e.jsxs("label",{className:"rsp-flex rsp-items-center",children:[e.jsx("input",{type:"radio",name:"carouselType",value:"VIDEO",checked:((R=a.carousel)==null?void 0:R.type)==="VIDEO",onChange:x=>w(x.target.value),className:"rsp-mr-2"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Video"})]})]})]}),e.jsx("div",{className:"rsp-space-y-6",children:(D=a.carousel)==null?void 0:D.cards.map((x,k)=>{var L,A,I,f,T,P,F,K;return e.jsxs("div",{className:"rsp-bg-white rsp-rounded-xl rsp-border-2 rsp-border-gray-200 rsp-overflow-hidden rsp-shadow-lg rsp-transition-all hover:rsp-shadow-xl hover:rsp-border-blue-300",children:[e.jsxs("div",{className:"rsp-bg-gradient-to-r rsp-from-blue-50 rsp-to-blue-100 rsp-px-5 rsp-py-3 rsp-flex rsp-items-center rsp-justify-between rsp-border-b rsp-border-gray-200",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-3",children:[e.jsx("div",{className:"rsp-w-8 rsp-h-8 rsp-bg-blue-500 rsp-text-white rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-font-bold rsp-text-sm rsp-shadow-md",children:k+1}),e.jsxs("h4",{className:"rsp-text-base rsp-font-semibold rsp-text-gray-800",children:["Card ",k+1]})]}),e.jsx("button",{onClick:()=>E(x.id),className:"rsp-p-1.5 rsp-text-gray-500 hover:rsp-text-white hover:rsp-bg-red-500 rsp-rounded-full rsp-transition-colors",title:"Remove Card",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsx("div",{className:"rsp-p-6",children:e.jsxs("div",{className:"rsp-grid rsp-grid-cols-1 lg:rsp-grid-cols-2 rsp-gap-6",children:[e.jsxs("div",{children:[e.jsxs("label",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800 rsp-mb-3 rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:((L=a.carousel)==null?void 0:L.type)==="VIDEO"?e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"}):e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"})}),((A=a.carousel)==null?void 0:A.type)==="VIDEO"?"Video":"Image"," Upload"]}),e.jsxs("div",{className:"rsp-border-2 rsp-border-dashed rsp-border-blue-200 rsp-rounded-xl rsp-p-6 rsp-text-center rsp-bg-gradient-to-br rsp-from-blue-50 rsp-to-white rsp-transition-all hover:rsp-border-blue-400 hover:rsp-from-blue-100 rsp-relative",children:[x.mediaUrl?e.jsxs("div",{className:"rsp-relative rsp-group",children:[((I=a.carousel)==null?void 0:I.type)==="IMAGE"?e.jsx("img",{src:x.mediaUrl,alt:`Card ${k+1}`,className:"rsp-w-full rsp-h-48 rsp-object-cover rsp-rounded-lg rsp-shadow-md",onLoad:()=>m(M=>({...M,[x.id]:!0})),onError:()=>m(M=>({...M,[x.id]:!1}))}):e.jsx("video",{src:x.mediaUrl,className:"rsp-w-full rsp-h-48 rsp-object-cover rsp-rounded-lg rsp-shadow-md",controls:!0,onLoadedData:()=>m(M=>({...M,[x.id]:!0})),onError:()=>m(M=>({...M,[x.id]:!1}))}),e.jsx("button",{onClick:()=>b(x.id,"mediaUrl",""),className:"rsp-absolute rsp-top-2 rsp-right-2 rsp-p-2 rsp-bg-red-500 rsp-text-white rsp-rounded-full hover:rsp-bg-red-600 rsp-shadow-lg rsp-opacity-0 group-hover:rsp-opacity-100 rsp-transition-opacity",title:"Remove media",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})}),e.jsx("div",{className:"rsp-absolute rsp-bottom-2 rsp-left-2 rsp-bg-black rsp-bg-opacity-60 rsp-text-white rsp-text-xs rsp-px-2 rsp-py-1 rsp-rounded rsp-backdrop-blur-sm",children:((f=a.carousel)==null?void 0:f.type)==="VIDEO"?"📹 Video":"🖼️ Image"})]}):e.jsxs("div",{children:[e.jsx("div",{className:"rsp-w-20 rsp-h-20 rsp-mx-auto rsp-mb-4 rsp-bg-gradient-to-br rsp-from-blue-100 rsp-to-blue-200 rsp-rounded-xl rsp-flex rsp-items-center rsp-justify-center rsp-shadow-md",children:e.jsx("svg",{className:"rsp-w-10 rsp-h-10 rsp-text-blue-600",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:((T=a.carousel)==null?void 0:T.type)==="VIDEO"?e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"}):e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"})})}),e.jsx("input",{type:"file",accept:((P=a.carousel)==null?void 0:P.type)==="VIDEO"?"video/*":"image/*",onChange:M=>{var z;const J=(z=M.target.files)==null?void 0:z[0];J&&!r[x.id]&&c(x.id,J)},className:"rsp-hidden",id:`file-upload-${x.id}`,disabled:!!r[x.id]}),e.jsxs("label",{htmlFor:`file-upload-${x.id}`,className:`rsp-inline-flex rsp-items-center rsp-gap-2 rsp-px-5 rsp-py-2.5 rsp-border rsp-border-blue-300 rsp-rounded-lg rsp-shadow-sm rsp-text-sm rsp-font-semibold rsp-text-blue-600 rsp-bg-white rsp-transition-colors ${r[x.id]?"rsp-opacity-50 rsp-cursor-not-allowed":"hover:rsp-bg-blue-50 rsp-cursor-pointer"}`,"aria-disabled":!!r[x.id],children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"})}),"Upload ",((F=a.carousel)==null?void 0:F.type)==="VIDEO"?"Video":"Image"]}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-3 rsp-px-2",children:((K=a.carousel)==null?void 0:K.type)==="VIDEO"?"📹 MP4, MOV, AVI (Max 16MB)":"🖼️ PNG, JPG, GIF, TIFF, SVG, BMP (Max 5MB)"})]}),r[x.id]&&e.jsx("div",{className:"rsp-absolute rsp-inset-0 rsp-bg-black rsp-bg-opacity-30 rsp-flex rsp-items-center rsp-justify-center",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2 rsp-bg-white rsp-px-3 rsp-py-2 rsp-rounded-md rsp-shadow",children:[e.jsxs("svg",{className:"rsp-w-4 rsp-h-4 rsp-animate-spin",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:[e.jsx("circle",{cx:"12",cy:"12",r:"10",strokeOpacity:"0.25",strokeWidth:"4"}),e.jsx("path",{d:"M22 12a10 10 0 00-10-10",strokeWidth:"4"})]}),e.jsx("span",{className:"rsp-text-xs rsp-text-gray-700",children:"Uploading..."})]})})]})]}),e.jsxs("div",{className:"rsp-space-y-5",children:[e.jsxs("div",{children:[e.jsxs("label",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800 rsp-mb-3 rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"})}),"Body Text",e.jsx("span",{className:"rsp-text-xs rsp-text-gray-500 rsp-font-normal",children:"(Max 160 characters)"})]}),e.jsx("div",{className:"rsp-relative",children:e.jsx("textarea",{ref:M=>{o.current[x.id]=M},value:x.body,onChange:M=>b(x.id,"body",M.target.value),maxLength:160,rows:4,className:"rsp-w-full rsp-px-4 rsp-py-3 rsp-border-2 rsp-border-gray-200 rsp-rounded-lg rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-400 rsp-bg-white rsp-resize-none rsp-shadow-sm rsp-transition-colors",placeholder:"Enter Card Body Message"})}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mt-2",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-1",children:[e.jsx("button",{onClick:()=>t(x.id,"body"),className:"rsp-p-1.5 rsp-text-gray-500 hover:rsp-text-blue-600 hover:rsp-bg-blue-50 rsp-rounded rsp-transition-colors",title:"Add Variable",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"})})}),e.jsx("button",{onClick:()=>{V(x.id),p(!0)},className:"rsp-p-1.5 rsp-text-gray-500 hover:rsp-text-blue-600 hover:rsp-bg-blue-50 rsp-rounded rsp-transition-colors",title:"Add Emoji",children:e.jsx(pe,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsxs("span",{className:`rsp-text-xs rsp-font-medium ${x.body.length>140?"rsp-text-orange-500":"rsp-text-gray-500"}`,children:[x.body.length,"/160"]})]}),(()=>{const M=x.body.match(/\{\{(\d+)\}\}/g)||[],J=[...new Set(M.map(z=>z.replace(/[{}]/g,"")))];return J.length===0?null:e.jsxs("div",{className:"rsp-mt-3 rsp-p-3 rsp-bg-blue-50 rsp-rounded-lg rsp-border rsp-border-blue-200",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-semibold rsp-text-blue-800 rsp-mb-2",children:"Sample Values for This Card"}),e.jsx("div",{className:"rsp-grid rsp-grid-cols-1 rsp-gap-2",children:J.map(z=>{var re,$;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-xs rsp-text-gray-700 rsp-font-medium rsp-whitespace-nowrap",children:["{{",z,"}}",":"]}),e.jsx("input",{type:"text",value:(($=(re=x.sampleContent)==null?void 0:re.bodyVariables)==null?void 0:$[z])||"",onChange:ae=>{const Z=ae.target.value;s(W=>({...W,carousel:{...W.carousel,cards:W.carousel.cards.map(_=>{var q,G,Y;return _.id!==x.id?_:{..._,sampleContent:{headerVariables:((q=_.sampleContent)==null?void 0:q.headerVariables)||{},bodyVariables:{...((G=_.sampleContent)==null?void 0:G.bodyVariables)||{},[z]:Z},buttonVariables:((Y=_.sampleContent)==null?void 0:Y.buttonVariables)||{}}}})}}))},className:"rsp-flex-1 rsp-px-2 rsp-py-1 rsp-border rsp-border-gray-300 rsp-rounded rsp-text-xs focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white",placeholder:"Sample value"}),e.jsx("button",{type:"button",onClick:()=>{const ae=new RegExp(`\\{\\{${z}\\}\\}`,"g"),Z=(x.body||"").replace(ae,"");s(W=>({...W,carousel:{...W.carousel,cards:W.carousel.cards.map(_=>{var q,G,Y;if(_.id!==x.id)return _;const X=Object.fromEntries(Object.entries(((q=_.sampleContent)==null?void 0:q.bodyVariables)||{}).filter(([se])=>se!==z));return{..._,body:Z,sampleContent:{headerVariables:((G=_.sampleContent)==null?void 0:G.headerVariables)||{},bodyVariables:X,buttonVariables:((Y=_.sampleContent)==null?void 0:Y.buttonVariables)||{}}}})}}))},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`card-${x.id}-sample-${z}`)})})]})})()]}),x.buttons.length<2&&e.jsxs("div",{children:[e.jsxs("label",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800 rsp-mb-3 rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122"})}),"Add Action Button",e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-500 rsp-font-normal",children:["(",x.buttons.length,"/2)"]})]}),e.jsxs("div",{className:"rsp-grid rsp-grid-cols-3 rsp-gap-2",children:[e.jsxs("button",{onClick:()=>h(x.id,"QUICK_REPLY"),className:"rsp-flex rsp-flex-col rsp-items-center rsp-gap-2 rsp-px-3 rsp-py-4 rsp-border-2 rsp-border-gray-200 rsp-rounded-lg rsp-text-sm rsp-font-medium rsp-text-gray-700 hover:rsp-border-blue-400 hover:rsp-bg-blue-50 rsp-transition-all rsp-shadow-sm",children:[e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"})}),e.jsx("span",{className:"rsp-text-xs",children:"Quick Reply"})]}),e.jsxs("button",{onClick:()=>h(x.id,"URL"),className:"rsp-flex rsp-flex-col rsp-items-center rsp-gap-2 rsp-px-3 rsp-py-4 rsp-border-2 rsp-border-gray-200 rsp-rounded-lg rsp-text-sm rsp-font-medium rsp-text-gray-700 hover:rsp-border-blue-400 hover:rsp-bg-blue-50 rsp-transition-all rsp-shadow-sm",children:[e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"})}),e.jsx("span",{className:"rsp-text-xs",children:"Website"})]}),e.jsxs("button",{onClick:()=>h(x.id,"PHONE_NUMBER"),className:"rsp-flex rsp-flex-col rsp-items-center rsp-gap-2 rsp-px-3 rsp-py-4 rsp-border-2 rsp-border-gray-200 rsp-rounded-lg rsp-text-sm rsp-font-medium rsp-text-gray-700 hover:rsp-border-blue-400 hover:rsp-bg-blue-50 rsp-transition-all rsp-shadow-sm",children:[e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"})}),e.jsx("span",{className:"rsp-text-xs",children:"Phone"})]})]})]}),x.buttons.length>0&&e.jsxs("div",{className:"rsp-space-y-3",children:[e.jsxs("label",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800 rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-green-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"})}),"Configured Buttons"]}),x.buttons.map((M,J)=>e.jsxs("div",{className:"rsp-p-4 rsp-border-2 rsp-border-blue-200 rsp-rounded-lg rsp-bg-gradient-to-br rsp-from-blue-50 rsp-to-white rsp-shadow-sm",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mb-3",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("div",{className:"rsp-w-6 rsp-h-6 rsp-bg-blue-500 rsp-text-white rsp-rounded rsp-flex rsp-items-center rsp-justify-center rsp-text-xs rsp-font-bold",children:J+1}),e.jsx("span",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800",children:M.type==="QUICK_REPLY"?"Quick Reply":M.type==="URL"?"Website":"Phone"})]}),e.jsx("button",{onClick:()=>B(x.id,M.id),className:"rsp-p-1 rsp-text-gray-400 hover:rsp-text-red-500 hover:rsp-bg-red-50 rsp-rounded rsp-transition-colors",title:"Remove button",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsxs("div",{className:"rsp-space-y-3",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:"Button Text"}),e.jsx("input",{type:"text",value:M.text,onChange:z=>S(x.id,M.id,"text",z.target.value),placeholder:`Enter Button Text (Max ${M.type==="QUICK_REPLY"?"25":"20"} characters)`,maxLength:M.type==="QUICK_REPLY"?25:20,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white"})]}),M.type==="URL"&&e.jsxs("div",{className:"rsp-space-y-3",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-2",children:"URL Type"}),e.jsxs("div",{className:"rsp-flex rsp-gap-4",children:[e.jsxs("label",{className:"rsp-flex rsp-items-center rsp-cursor-pointer",children:[e.jsx("input",{type:"radio",checked:M.urlType!=="dynamic",onChange:()=>S(x.id,M.id,"urlType","static"),className:"rsp-mr-2 rsp-text-blue-600"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Static URL"})]}),e.jsxs("label",{className:"rsp-flex rsp-items-center rsp-cursor-pointer",children:[e.jsx("input",{type:"radio",checked:M.urlType==="dynamic",onChange:()=>S(x.id,M.id,"urlType","dynamic"),className:"rsp-mr-2 rsp-text-blue-600"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Dynamic URL"})]})]})]}),e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:"Website URL"}),e.jsx("input",{type:"text",value:M.value||"",onChange:z=>S(x.id,M.id,"value",z.target.value),placeholder:M.urlType==="dynamic"?"https://example.com/order/{{1}}":"https://example.com",className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white"})]}),M.urlType==="dynamic"&&e.jsxs("div",{className:"rsp-space-y-2",children:[e.jsx("div",{className:"rsp-p-2 rsp-bg-blue-50 rsp-rounded rsp-border rsp-border-blue-200",children:e.jsxs("p",{className:"rsp-text-xs rsp-text-blue-700",children:[e.jsx("strong",{children:"Tip:"})," Use ","{{"," and ","}}}"," to add variables (e.g., https://example.com/","{{"," 1","}}",")"]})}),e.jsxs("div",{children:[e.jsx("button",{type:"button",onClick:()=>{if(((M.value||"").match(/\{\{(\d+)\}\}/g)||[]).length>=3)return;const $=((M.value||"").match(/\{\{(\d+)\}\}/g)||[]).map(_=>{const X=_.match(/{{(\d+)}}/);return X?parseInt(X[1],10):0}),Z=($.length>0?Math.max(...$):0)+1,W=(M.value||"")+`{{${Z}}}`;S(x.id,M.id,"value",W)},disabled:((M.value||"").match(/\{\{(\d+)\}\}/g)||[]).length>=3,className:"rsp-px-3 rsp-py-1.5 rsp-text-xs rsp-bg-blue-500 hover:rsp-bg-blue-600 rsp-text-white rsp-rounded disabled:rsp-bg-gray-300 disabled:rsp-cursor-not-allowed rsp-transition-colors",children:"+ Add Variable"}),((M.value||"").match(/\{\{(\d+)\}\}/g)||[]).length>=3&&e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-1",children:"Maximum 3 variables allowed"})]}),(()=>{const z=(M.value||"").match(/\{\{(\d+)\}\}/g)||[],re=[...new Set(z.map($=>$.replace(/[{}]/g,"")))];return re.length===0?null:e.jsxs("div",{className:"rsp-p-3 rsp-bg-gray-50 rsp-rounded-lg rsp-border rsp-border-gray-200",children:[e.jsx("h4",{className:"rsp-text-xs rsp-font-semibold rsp-text-gray-700 rsp-mb-2",children:"Sample Values for URL Variables"}),e.jsx("div",{className:"rsp-space-y-2",children:re.map($=>{var ae,Z;return e.jsxs("div",{className:"rsp-space-y-1",children:[e.jsxs("label",{className:"rsp-block rsp-text-xs rsp-text-gray-600 rsp-mb-1",children:["Variable ","{{",$,"}}"]}),e.jsx("input",{type:"text",value:((Z=(ae=x.sampleContent)==null?void 0:ae.buttonVariables)==null?void 0:Z[$])||"",onChange:W=>{const _=W.target.value;s(X=>({...X,carousel:{...X.carousel,cards:X.carousel.cards.map(q=>{var G,Y,se;return q.id!==x.id?q:{...q,sampleContent:{headerVariables:((G=q.sampleContent)==null?void 0:G.headerVariables)||{},bodyVariables:((Y=q.sampleContent)==null?void 0:Y.bodyVariables)||{},buttonVariables:{...((se=q.sampleContent)==null?void 0:se.buttonVariables)||{},[$]:_}}}})}}))},className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-ring-1 focus:rsp-ring-blue-500 focus:rsp-border-blue-500 rsp-bg-white",placeholder:`Sample value (e.g., ${$==="1"?"order123":"user456"})`}),e.jsx("button",{type:"button",onClick:()=>{const W=M.value||"",_=new RegExp(`\\{\\{${$}\\}\\}`,"g"),X=W.replace(_,"");S(x.id,M.id,"value",X),s(q=>({...q,carousel:{...q.carousel,cards:q.carousel.cards.map(G=>{var se,ue,be;if(G.id!==x.id)return G;const Y=Object.fromEntries(Object.entries(((se=G.sampleContent)==null?void 0:se.buttonVariables)||{}).filter(([Me])=>Me!==$));return{...G,sampleContent:{headerVariables:((ue=G.sampleContent)==null?void 0:ue.headerVariables)||{},bodyVariables:((be=G.sampleContent)==null?void 0:be.bodyVariables)||{},buttonVariables:Y}}})}}))},className:"rsp-px-2 rsp-py-1 rsp-text- rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`button-${M.id}-sample-${$}`)})})]})})()]})]}),M.type==="PHONE_NUMBER"&&e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:"Phone Number"}),e.jsx("input",{type:"text",value:M.value||"",onChange:z=>S(x.id,M.id,"value",z.target.value),placeholder:"+1234567890",className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white"})]})]})]},M.id))]})]})]})})]},x.id)})}),e.jsx("div",{className:"rsp-bg-blue-50 rsp-border-l-4 rsp-border-blue-500 rsp-p-4 rsp-rounded-r-md",children:e.jsxs("div",{className:"rsp-flex",children:[e.jsx("div",{className:"rsp-flex-shrink-0",children:e.jsx("svg",{className:"rsp-h-5 rsp-w-5 rsp-text-blue-400",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",clipRule:"evenodd"})})}),e.jsxs("div",{className:"rsp-ml-3",children:[e.jsx("h3",{className:"rsp-text-sm rsp-font-medium rsp-text-blue-800",children:"Meta WhatsApp HSM Guidelines"}),e.jsx("div",{className:"rsp-mt-2 rsp-text-sm rsp-text-blue-700",children:e.jsxs("ul",{className:"rsp-list-disc rsp-list-inside rsp-space-y-1",children:[e.jsx("li",{children:"Maximum 10 carousel cards per template"}),e.jsx("li",{children:"Maximum 2 buttons per card"}),e.jsx("li",{children:"Card body text limited to 160 characters"}),e.jsx("li",{children:"Button text limited to 20-25 characters depending on type"}),e.jsx("li",{children:"Images: PNG, JPG, GIF, TIFF, SVG, BMP formats supported"}),e.jsx("li",{children:"Videos: MP4, MOV, AVI formats supported"})]})})]})]})}),e.jsx(he,{isOpen:y,onClose:()=>p(!1),onSelect:d})]})}const we=async a=>{try{console.log(`Starting file upload: ${a.name}`);const s=await ta(a);return console.log(`File uploaded successfully: ${s}`),s}catch(s){throw console.error("Upload failed in parent:",s),s}},da=a=>{const n=(a.body||"").match(/\{\{(\d+)\}\}/g);if(!n)return 0;const r=n.map(l=>{const m=l.match(/{{(\d+)}}/);return m?parseInt(m[1],10):0});return r.length>0?Math.max(...r):0};function pa({template:a,setTemplate:s}){const[n,r]=C.useState(!1),l=C.useRef(null),m=()=>{r(!0),setTimeout(()=>{l.current&&l.current.focus()},0)},i=v=>{const y=l.current,p=a.body,j=y&&typeof y.selectionStart=="number"?y.selectionStart:p.length,V=p.substring(0,j),o=p.substring(j),u=V+v+o;s({...a,body:u}),setTimeout(()=>{if(l.current){const E=j+v.length;l.current.setSelectionRange(E,E),l.current.focus()}},0),r(!1)};return e.jsxs("div",{className:"rsp-space-y-6",children:[a.type!=="CAROUSEL"&&e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsx("h2",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Message Content"}),e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsx(ra,{template:a,setTemplate:s,onFileUpload:we}),e.jsx(ia,{template:a,setTemplate:s})]})]}),a.type==="CAROUSEL"&&e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsx("h2",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Message Content"}),e.jsx("div",{className:"rsp-bg-white rsp-p-6 rsp-rounded-lg rsp-shadow-sm",children:e.jsxs("div",{children:[e.jsxs("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:["Body ",e.jsx("span",{className:"rsp-text-gray-500",children:"(Global message for carousel)"})]}),e.jsx("div",{className:"rsp-relative",children:e.jsx("textarea",{ref:l,value:a.body,onChange:v=>s({...a,body:v.target.value}),maxLength:1024,rows:4,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white rsp-resize-none",placeholder:"Enter Template Message"})}),!a.body&&e.jsx("p",{className:"rsp-text-xs rsp-text-red-600 rsp-mt-1",children:"Body is required."}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mt-1",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("button",{onClick:()=>{const p=`{{${da(a)+1}}}`;s({...a,body:a.body+p})},className:"rsp-p-1 rsp-text-gray-500 hover:rsp-text-gray-700 hover:rsp-bg-gray-100 rsp-rounded",title:"Add Variable",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"})})}),e.jsx("button",{onClick:m,className:"rsp-p-1 rsp-text-gray-500 hover:rsp-text-gray-700 hover:rsp-bg-gray-100 rsp-rounded",title:"Add emoji",children:e.jsx(pe,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-500",children:[a.body.length,"/1024"]})]}),(()=>{const v=a.body.match(/\{\{(\d+)\}\}/g)||[],y=[...new Set(v.map(p=>p.replace(/[{}]/g,"")))];return y.length===0?null:e.jsxs("div",{className:"rsp-mt-3",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-2",children:"Sample Values"}),e.jsx("div",{className:"rsp-grid rsp-grid-cols-3 rsp-gap-2",children:y.map(p=>{var j,V;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-xs rsp-text-gray-500 rsp-whitespace-nowrap",children:["{{",p,"}}",":"]}),e.jsx("input",{type:"text",value:((V=(j=a.sampleContent)==null?void 0:j.bodyVariables)==null?void 0:V[p])||"",onChange:o=>{var E,b,w;const u={...a.sampleContent,headerVariables:((E=a.sampleContent)==null?void 0:E.headerVariables)||{},bodyVariables:{...(b=a.sampleContent)==null?void 0:b.bodyVariables,[p]:o.target.value},buttonVariables:((w=a.sampleContent)==null?void 0:w.buttonVariables)||{}};s({...a,sampleContent:u})},className:"rsp-flex-1 rsp-px-2 rsp-py-1 rsp-border rsp-border-gray-300 rsp-rounded rsp-text-xs focus:rsp-outline-none focus:rsp-border-blue-500",placeholder:"Sample"}),e.jsx("button",{type:"button",onClick:()=>{var b,w,t;const o=new RegExp(`\\{\\{${p}\\}\\}`,"g"),u=(a.body||"").replace(o,""),E=Object.fromEntries(Object.entries(((b=a.sampleContent)==null?void 0:b.bodyVariables)||{}).filter(([d])=>d!==p));s({...a,body:u,sampleContent:{...a.sampleContent,bodyVariables:E,headerVariables:((w=a.sampleContent)==null?void 0:w.headerVariables)||{},buttonVariables:((t=a.sampleContent)==null?void 0:t.buttonVariables)||{}}})},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`global-body-sample-${p}`)})})]})})()]})})]}),a.type==="CAROUSEL"&&e.jsx("div",{className:"rsp-space-y-6",children:e.jsx(ma,{template:a,setTemplate:s,onFileUpload:we})}),a.type!=="CAROUSEL"&&e.jsx("div",{className:"rsp-space-y-6",children:e.jsx(la,{template:a,setTemplate:s})}),e.jsx(he,{isOpen:n,onClose:()=>r(!1),onSelect:i})]})}function oa({type:a}){switch(a){case"QUICK_REPLY":return e.jsx(Pe,{className:"w-4 h-4"});case"URL":return e.jsx(Be,{className:"w-4 h-4"});case"CALL":return e.jsx(je,{className:"w-4 h-4"});case"FLOW":return e.jsx(_e,{className:"w-4 h-4"});default:return null}}function fa({buttons:a,flowButtonText:s,onShowAllOptions:n}){const r=[...a];s&&r.push({id:"flow-button",type:"QUICK_REPLY",text:s});const l=r.slice(0,2);return e.jsxs("div",{className:"rsp-divide-y rsp-divide-gray-200",children:[l.map(m=>e.jsxs("button",{className:"rsp-w-full rsp-py-4 rsp-text-[#128C7E] rsp-text-[15px] rsp-font-medium rsp-bg-white hover:rsp-bg-gray-50 rsp-flex rsp-items-center rsp-gap-3 rsp-px-4 rsp-transition-colors",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:[e.jsx("div",{className:"rsp-text-[#128C7E]",children:e.jsx(oa,{type:m.type})}),e.jsx("span",{className:"rsp-flex-1 rsp-text-left rsp-break-words rsp-break-all rsp-whitespace-pre-wrap",children:m.text}),m.id==="flow-button"&&e.jsx(Ue,{className:"rsp-w-5 rsp-h-5 rsp-text-[#128C7E] rsp-ml-auto"})]},m.id)),r.length>2&&e.jsxs("button",{onClick:n,className:"rsp-w-full rsp-py-4 rsp-text-[#128C7E] rsp-text-[15px] rsp-font-medium rsp-bg-white hover:rsp-bg-gray-50 rsp-flex rsp-items-center rsp-justify-center rsp-transition-colors",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:[e.jsx("span",{className:"rsp-text-lg rsp-mr-2",children:"⋯"}),"See all options"]})]})}function ha({template:a}){var V,o,u,E;const[s,n]=C.useState(!1),[r,l]=C.useState(0),m=(V=a.carousel)!=null&&V.cards?a.carousel.cards.length:0;C.useEffect(()=>{a.type==="CAROUSEL"&&m>0?r>=m&&l(0):l(0)},[m,a.type]);const i=b=>b?b.replace(/\{\{(\d+)\}\}/g,(w,t)=>{var d,g;return((g=(d=a.sampleContent)==null?void 0:d.headerVariables)==null?void 0:g[t])||`[Variable ${t}]`}):"",v=b=>b?b.replace(/\{\{(\d+)\}\}/g,(w,t)=>{var d,g;return((g=(d=a.sampleContent)==null?void 0:d.bodyVariables)==null?void 0:g[t])||`[Variable ${t}]`}):"",y=b=>{var d;const w=(b==null?void 0:b.body)??"";if(!w)return"";const t=((d=b==null?void 0:b.sampleContent)==null?void 0:d.bodyVariables)??{};return w.replace(/\{\{(\d+)\}\}/g,(g,h)=>t[h]||`[Variable ${h}]`)},p=a.headerType!=="NONE"||a.body||a.footer||a.buttons.length>0||a.type==="CAROUSEL"&&((o=a.carousel)==null?void 0:o.cards.length),j=a.headerText||a.body||a.footer;return e.jsxs("div",{className:"rsp-bg-white rsp-rounded-lg rsp-shadow-sm rsp-border rsp-border-gray-200",children:[e.jsxs("div",{className:"rsp-p-4 rsp-border-b rsp-border-gray-200",children:[e.jsx("h3",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Preview"}),e.jsx("p",{className:"rsp-text-sm rsp-text-gray-500",children:"See how your template will look"})]}),e.jsx("div",{className:"rsp-p-6 rsp-flex rsp-justify-center",children:e.jsx("div",{className:"rsp-relative",children:e.jsxs("div",{className:"rsp-w-[280px] rsp-h-[580px] rsp-bg-gradient-to-b rsp-from-[#1a1a1a] rsp-via-[#2d2d2f] rsp-to-[#000000] rsp-rounded-[35px] rsp-p-[2px] rsp-relative rsp-shadow-[0_20px_40px_-10px_rgba(0,0,0,0.7)] rsp-border-[1px] rsp-border-[#404040]",children:[e.jsx("div",{className:"rsp-absolute rsp-right-[-2px] rsp-top-[120px] rsp-w-[2px] rsp-h-[50px] rsp-bg-gradient-to-b rsp-from-[#404040] rsp-to-[#1a1a1a] rsp-rounded-l-[1px] rsp-shadow-md"}),e.jsx("div",{className:"rsp-absolute rsp-left-[-2px] rsp-top-[100px] rsp-w-[2px] rsp-h-[25px] rsp-bg-gradient-to-b rsp-from-[#404040] rsp-to-[#1a1a1a] rsp-rounded-r-[1px] rsp-shadow-sm"}),e.jsx("div",{className:"rsp-absolute rsp-left-[-2px] rsp-top-[135px] rsp-w-[2px] rsp-h-[40px] rsp-bg-gradient-to-b rsp-from-[#404040] rsp-to-[#1a1a1a] rsp-rounded-r-[1px] rsp-shadow-sm"}),e.jsx("div",{className:"rsp-absolute rsp-left-[-2px] rsp-top-[70px] rsp-w-[2px] rsp-h-[20px] rsp-bg-gradient-to-b rsp-from-[#ff8c42] rsp-to-[#ff6b35] rsp-rounded-r-[1px] rsp-shadow-md"}),e.jsxs("div",{className:"rsp-w-full rsp-h-full rsp-bg-black rsp-rounded-[33px] rsp-overflow-hidden rsp-relative rsp-shadow-[inset_0_1px_3px_rgba(0,0,0,0.3)]",children:[e.jsx("div",{className:"rsp-absolute rsp-top-[14px] rsp-left-1/2 rsp-transform -rsp-translate-x-1/2 rsp-w-[70px] rsp-h-[18px] rsp-bg-gradient-to-b rsp-from-[#0a0a0a] rsp-to-[#000000] rsp-rounded-[9px] rsp-z-20 rsp-shadow-[0_1px_4px_rgba(0,0,0,0.6)] rsp-border rsp-border-[#1a1a1a] rsp-flex rsp-items-center rsp-justify-center",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-center rsp-gap-[8px]",children:[e.jsx("div",{className:"rsp-w-[3px] rsp-h-[3px] rsp-bg-gradient-to-br rsp-from-[#1a1a1a] rsp-to-[#000000] rsp-rounded-full rsp-shadow-inner"}),e.jsx("div",{className:"rsp-w-[2px] rsp-h-[2px] rsp-bg-gradient-to-br rsp-from-[#333] rsp-to-[#000] rsp-rounded-full"})]})}),e.jsxs("div",{className:"rsp-w-full rsp-h-full rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-rounded-[33px] rsp-relative rsp-overflow-hidden rsp-shadow-[inset_0_1px_2px_rgba(0,0,0,0.1)]",children:[e.jsxs("div",{className:"rsp-absolute rsp-top-0 rsp-left-0 rsp-right-0 rsp-h-[45px] rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-flex rsp-items-center rsp-justify-between rsp-px-[30px] rsp-z-10",children:[e.jsx("div",{className:"rsp-text-[13px] rsp-font-semibold rsp-text-black rsp-tracking-tight",children:"9:41"}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-[5px]",children:[e.jsxs("div",{className:"rsp-flex rsp-gap-[2px] rsp-items-end",children:[e.jsx("div",{className:"rsp-w-[1.5px] rsp-h-[2px] rsp-bg-gradient-to-t rsp-from-black rsp-to-[#333] rsp-rounded-[0.5px]"}),e.jsx("div",{className:"rsp-w-[1.5px] rsp-h-[3px] rsp-bg-gradient-to-t rsp-from-black rsp-to-[#333] rsp-rounded-[0.5px]"}),e.jsx("div",{className:"rsp-w-[1.5px] rsp-h-[4px] rsp-bg-gradient-to-t rsp-from-black rsp-to-[#333] rsp-rounded-[0.5px]"}),e.jsx("div",{className:"rsp-w-[1.5px] rsp-h-[5px] rsp-bg-gradient-to-t rsp-from-black rsp-to-[#333] rsp-rounded-[0.5px]"})]}),e.jsx("svg",{className:"rsp-w-[11px] rsp-h-[8px] rsp-text-black rsp-opacity-90",viewBox:"0 0 15 11",fill:"currentColor",children:e.jsx("path",{d:"M1.5 4.5C3.5 2.5 6 1.5 7.5 1.5S11.5 2.5 13.5 4.5M3 6.5C4.5 5 6 4.5 7.5 4.5S10.5 5 12 6.5M5 8.5C6 7.5 6.75 7.25 7.5 7.25S9 7.5 10 8.5M7.5 10.5C7.5 10.5 7.5 10.5 7.5 10.5"})}),e.jsxs("div",{className:"rsp-relative rsp-flex rsp-items-center",children:[e.jsx("div",{className:"rsp-w-[18px] rsp-h-[9px] rsp-border-[1px] rsp-border-black rsp-border-opacity-60 rsp-rounded-[2px] rsp-relative",children:e.jsx("div",{className:"rsp-absolute rsp-inset-[1px] rsp-bg-gradient-to-r rsp-from-[#34d399] rsp-to-[#10b981] rsp-rounded-[1px] rsp-w-[13px] rsp-shadow-inner"})}),e.jsx("div",{className:"rsp-absolute rsp-right-[-2px] rsp-top-[2px] rsp-w-[1px] rsp-h-[5px] rsp-bg-black rsp-bg-opacity-60 rsp-rounded-[0.5px]"})]})]})]}),e.jsxs("div",{className:"rsp-absolute rsp-top-[45px] rsp-left-0 rsp-right-0 rsp-h-[60px] rsp-bg-gradient-to-r rsp-from-[#075E54] rsp-via-[#0a6b5f] rsp-to-[#128C7E] rsp-flex rsp-items-center rsp-px-4 rsp-gap-3 rsp-z-10 rsp-shadow-[0_2px_8px_rgba(0,0,0,0.15)]",children:[e.jsx("svg",{className:"rsp-w-5 rsp-h-5 rsp-text-white rsp-opacity-95 rsp-drop-shadow-sm",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.42-1.41L7.83 13H20v-2z"})}),e.jsx("div",{className:"rsp-w-[36px] rsp-h-[36px] rsp-bg-gradient-to-br rsp-from-[#25D366] rsp-via-[#20c55e] rsp-to-[#128C7E] rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-shadow-[0_2px_6px_rgba(0,0,0,0.2)] rsp-border-[2px] rsp-border-white rsp-border-opacity-30",children:e.jsx("span",{className:"rsp-text-white rsp-text-[14px] rsp-font-bold rsp-drop-shadow-sm",children:"B"})}),e.jsxs("div",{className:"rsp-flex-1",children:[e.jsx("div",{className:"rsp-text-white rsp-text-[14px] rsp-font-semibold rsp-drop-shadow-sm rsp-tracking-tight",children:"Business"}),e.jsx("div",{className:"rsp-text-[#B8E6D1] rsp-text-[11px] rsp-opacity-85 rsp-font-medium",children:"WhatsApp Business"})]}),e.jsxs("div",{className:"rsp-flex rsp-gap-4",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-white rsp-opacity-90 rsp-drop-shadow-sm",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"})}),e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-white rsp-opacity-90 rsp-drop-shadow-sm",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"})})]})]}),e.jsxs("div",{className:"rsp-absolute rsp-top-[105px] rsp-left-0 rsp-right-0 rsp-bottom-[60px] rsp-bg-gradient-to-b rsp-from-[#E8E2DB] rsp-via-[#E5DDD5] rsp-to-[#DDD5CC] rsp-overflow-y-auto",children:[e.jsx("div",{className:"rsp-absolute rsp-inset-0 rsp-opacity-[0.03]",style:{backgroundImage:`url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23000000' fill-opacity='0.08'%3E%3Cpath d='M40 40c0-4.4-3.6-8-8-8s-8 3.6-8 8 3.6 8 8 8 8-3.6 8-8zm0-32c0-4.4-3.6-8-8-8s-8 3.6-8 8 3.6 8 8 8 8-3.6 8-8zm32 32c0-4.4-3.6-8-8-8s-8 3.6-8 8 3.6 8 8 8 8-3.6 8-8z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")`}}),e.jsx("div",{className:"rsp-relative rsp-px-4 rsp-py-4",children:p?e.jsxs("div",{className:"rsp-flex rsp-flex-col rsp-items-start",children:[a.headerType==="MEDIA"&&a.mediaUrl&&e.jsxs("div",{className:"rsp-max-w-[220px] rsp-w-auto rsp-rounded-xl rsp-overflow-hidden rsp-shadow-md rsp-mb-1.5 rsp-animate-slide-up rsp-border rsp-border-gray-200",children:[a.mediaType==="IMAGE"&&e.jsx("img",{src:a.mediaUrl,alt:"Header media",className:"rsp-w-full rsp-max-h-[150px] rsp-object-cover rsp-block",onError:b=>{b.currentTarget.style.display="none"}}),a.mediaType==="VIDEO"&&e.jsxs("div",{className:"rsp-relative rsp-min-w-[150px] rsp-w-full rsp-h-[150px] rsp-bg-gradient-to-br rsp-from-gray-800 rsp-to-gray-900 rsp-flex rsp-items-center rsp-justify-center",children:[e.jsx("div",{className:"rsp-w-12 rsp-h-12 rsp-bg-black rsp-bg-opacity-70 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-shadow-lg rsp-border rsp-border-white rsp-border-opacity-20",children:e.jsx("div",{className:"rsp-w-0 rsp-h-0 rsp-border-l-[8px] rsp-border-l-white rsp-border-t-[6px] rsp-border-t-transparent rsp-border-b-[6px] rsp-border-b-transparent rsp-ml-1"})}),e.jsx("div",{className:"rsp-absolute rsp-bottom-2 rsp-right-2 rsp-bg-black rsp-bg-opacity-75 rsp-text-white rsp-text-[10px] rsp-px-2 rsp-py-1 rsp-rounded-full rsp-shadow-md rsp-backdrop-blur-sm",children:"📹 Video"})]}),a.mediaType==="DOCUMENT"&&e.jsx("div",{className:"rsp-p-3 rsp-bg-gradient-to-r rsp-from-gray-50 rsp-to-gray-100",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("div",{className:"rsp-w-10 rsp-h-10 rsp-bg-gradient-to-br rsp-from-red-500 rsp-to-red-600 rsp-rounded-lg rsp-flex rsp-items-center rsp-justify-center rsp-shadow-md",children:e.jsx("span",{className:"rsp-text-white rsp-text-[9px] rsp-font-bold",children:"PDF"})}),e.jsxs("div",{children:[e.jsx("div",{className:"rsp-text-[12px] rsp-font-semibold rsp-text-gray-800",children:"Document"}),e.jsx("div",{className:"rsp-text-[10px] rsp-text-gray-600",children:"PDF • 1.2 MB"})]})]})})]}),j&&e.jsx("div",{className:"rsp-flex rsp-justify-start rsp-mb-1.5",children:e.jsxs("div",{className:"rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-rounded-[12px] rsp-max-w-[220px] rsp-shadow-[0_2px_8px_rgba(0,0,0,0.08)] rsp-relative rsp-border rsp-border-gray-100 rsp-animate-slide-up",children:[a.headerType==="TEXT"&&a.headerText&&e.jsx("div",{className:"rsp-px-4 rsp-pt-3 rsp-pb-2",children:e.jsx("div",{className:"rsp-text-[15px] rsp-font-semibold rsp-text-[#111b21] rsp-leading-[1.3] rsp-tracking-normal rsp-break-words",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:i(a.headerText)})}),a.body&&e.jsx("div",{className:"rsp-px-4 rsp-py-2",children:e.jsx("div",{className:"rsp-text-[14px] rsp-text-[#111b21] rsp-leading-[1.4] rsp-whitespace-pre-wrap rsp-tracking-normal rsp-break-words",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:v(a.body)})}),a.footer&&e.jsx("div",{className:"rsp-px-4 rsp-pb-2",children:e.jsx("div",{className:"rsp-text-[12px] rsp-text-[#667781] rsp-pt-2 rsp-border-t rsp-border-gray-100 rsp-break-words rsp-break-all rsp-whitespace-pre-wrap",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:a.footer})}),e.jsx("div",{className:"rsp-px-4 rsp-pb-2 rsp-text-right",children:e.jsxs("div",{className:"rsp-text-[11px] rsp-text-[#667781] rsp-flex rsp-items-center rsp-justify-end rsp-gap-1 rsp-opacity-80",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:["9:41 AM",e.jsx("svg",{className:"rsp-w-3 rsp-h-3 rsp-text-[#53bdeb]",viewBox:"0 0 16 15",fill:"currentColor",children:e.jsx("path",{d:"M15.01 3.316l-.478-.372a.365.365 0 0 0-.51.063L8.666 9.879a.32.32 0 0 1-.484.033l-.358-.325a.319.319 0 0 0-.484.032l-.378.483a.418.418 0 0 0 .036.541l1.32 1.266c.143.14.361.125.484-.033l6.272-8.048a.366.366 0 0 0-.064-.512zm-4.1 0l-.478-.372a.365.365 0 0 0-.51.063L4.566 9.879a.32.32 0 0 1-.484.033L1.891 7.769a.319.319 0 0 0-.484.032l-.378.483a.418.418 0 0 0 .036.541l3.61 3.463c.143.14.361.125.484-.033l6.272-8.048a.365.365 0 0 0-.064-.512z"})})]})})]})}),a.type==="CAROUSEL"&&(((E=(u=a.carousel)==null?void 0:u.cards)==null?void 0:E.length)||0)>0&&e.jsx("div",{className:"rsp-flex rsp-justify-start rsp-mb-1.5",children:e.jsx("div",{className:"rsp-w-[220px] rsp-animate-slide-up",children:e.jsx("div",{className:"rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-rounded-[12px] rsp-overflow-hidden rsp-shadow-[0_2px_8px_rgba(0,0,0,0.08)] rsp-border rsp-border-gray-100 rsp-relative rsp-min-h-[280px] rsp-flex rsp-flex-col",children:e.jsxs("div",{className:"rsp-relative rsp-flex-1 rsp-flex rsp-flex-col",children:[(()=>{var w,t;const b=a.carousel&&a.carousel.cards.length>0?a.carousel.cards[r]||a.carousel.cards[0]:void 0;return e.jsxs("div",{className:"rsp-flex rsp-flex-col rsp-h-full",children:[e.jsx("div",{className:"rsp-relative rsp-w-full rsp-h-[140px] rsp-bg-gray-100 rsp-group rsp-flex-shrink-0",children:b&&b.mediaUrl?e.jsxs(e.Fragment,{children:[((w=a.carousel)==null?void 0:w.type)==="IMAGE"?e.jsx("img",{src:b.mediaUrl,alt:"Carousel card",className:"rsp-w-full rsp-h-full rsp-object-cover",onError:d=>{d.currentTarget.style.display="none"}}):e.jsx("div",{className:"rsp-relative rsp-w-full rsp-h-full rsp-bg-gradient-to-br rsp-from-gray-800 rsp-to-gray-900 rsp-flex rsp-items-center rsp-justify-center",children:e.jsx("div",{className:"rsp-w-10 rsp-h-10 rsp-bg-black rsp-bg-opacity-70 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-shadow-lg",children:e.jsx("div",{className:"rsp-w-0 rsp-h-0 rsp-border-l-[6px] rsp-border-l-white rsp-border-t-[5px] rsp-border-t-transparent rsp-border-b-[5px] rsp-border-b-transparent rsp-ml-1"})})}),a.carousel&&a.carousel.cards.length>1&&e.jsxs(e.Fragment,{children:[e.jsx("button",{onClick:()=>l(d=>d>0?d-1:a.carousel.cards.length-1),className:"rsp-absolute rsp-left-1 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-z-20 rsp-w-6 rsp-h-6 rsp-bg-black rsp-bg-opacity-50 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-text-white hover:rsp-bg-opacity-80 rsp-transition-all rsp-opacity-0 group-hover:rsp-opacity-100",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 19l-7-7 7-7"})})}),e.jsx("button",{onClick:()=>l(d=>d<a.carousel.cards.length-1?d+1:0),className:"rsp-absolute rsp-right-1 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-z-20 rsp-w-6 rsp-h-6 rsp-bg-black rsp-bg-opacity-50 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-text-white hover:rsp-bg-opacity-80 rsp-transition-all rsp-opacity-0 group-hover:rsp-opacity-100",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})})})]}),e.jsxs("div",{className:"rsp-absolute rsp-top-2 rsp-right-2 rsp-bg-black rsp-bg-opacity-60 rsp-text-white rsp-text-[10px] rsp-px-2 rsp-py-0.5 rsp-rounded-full rsp-backdrop-blur-sm",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:[r+1,"/",a.carousel?a.carousel.cards.length:0]})]}):e.jsx("div",{className:"rsp-w-full rsp-h-full rsp-flex rsp-items-center rsp-justify-center",children:e.jsxs("div",{className:"rsp-text-center",children:[e.jsx("svg",{className:"rsp-w-12 rsp-h-12 rsp-mx-auto rsp-text-gray-400 rsp-mb-2",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:((t=a.carousel)==null?void 0:t.type)==="VIDEO"?e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"}):e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"})}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:"No media"})]})})}),e.jsx("div",{className:"rsp-px-4 rsp-py-3 rsp-flex-1 rsp-flex rsp-items-start",children:e.jsx("p",{className:"rsp-text-[13px] rsp-text-[#111b21] rsp-leading-[1.4] rsp-line-clamp-3",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:b?y(b):"Card body text..."})}),e.jsx("div",{className:"rsp-border-t rsp-border-gray-100 rsp-mt-auto",children:b&&b.buttons.length>0?e.jsx(e.Fragment,{children:b.buttons.map((d,g)=>e.jsx("div",{className:`rsp-px-4 rsp-py-3 rsp-text-center rsp-text-[14px] rsp-text-[#128C7E] rsp-font-medium rsp-break-words rsp-whitespace-pre-wrap ${g<b.buttons.length-1?"rsp-border-b rsp-border-gray-100":""}`,style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-center rsp-gap-2",children:[d.type==="URL"&&e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"})}),(d.type==="CALL"||d.type==="PHONE_NUMBER")&&e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"})}),e.jsx("span",{className:"rsp-inline-block rsp-max-w-[180px] rsp-break-words rsp-break-all rsp-whitespace-pre-wrap rsp-text-center",children:d.text})]})},d.id))}):e.jsx("div",{className:"rsp-px-4 rsp-py-3 rsp-text-center rsp-text-xs rsp-text-gray-400",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:"No buttons"})})]})})(),a.carousel&&a.carousel.cards.length>1&&e.jsx("div",{className:"rsp-flex rsp-items-center rsp-justify-center rsp-gap-1.5 rsp-py-3 rsp-bg-white rsp-border-t rsp-border-gray-100",children:a.carousel&&a.carousel.cards.map((b,w)=>e.jsx("button",{onClick:()=>l(w),className:`rsp-w-2 rsp-h-2 rsp-rounded-full rsp-transition-all ${w===r?"rsp-bg-[#128C7E] rsp-w-6":"rsp-bg-gray-300 hover:rsp-bg-gray-400"}`},w))})]})})})}),a.buttons.length>0&&e.jsx("div",{className:"rsp-flex rsp-justify-start",children:e.jsx("div",{className:"rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-rounded-[12px] rsp-overflow-hidden rsp-shadow-[0_2px_8px_rgba(0,0,0,0.08)] rsp-max-w-[220px] rsp-w-full rsp-border rsp-border-gray-100 rsp-animate-slide-up",children:e.jsx(fa,{buttons:a.buttons,onShowAllOptions:()=>n(!0)})})})]}):e.jsx("div",{className:"rsp-flex rsp-items-center rsp-justify-center rsp-h-[300px]",children:e.jsxs("div",{className:"rsp-text-center rsp-text-gray-500 rsp-animate-fade-in",children:[e.jsx("div",{className:"rsp-w-12 rsp-h-12 rsp-bg-gradient-to-br rsp-from-gray-50 rsp-to-gray-100 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-mx-auto rsp-mb-2 rsp-shadow-md rsp-border rsp-border-gray-200",children:e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-gray-400",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M20 2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h4l4 4 4-4h4c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z"})})}),e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-600",children:"Start building your template"}),e.jsx("p",{className:"rsp-text-xs rsp-mt-1 rsp-text-gray-500",children:"Add content to see a live preview"})]})})})]}),e.jsxs("div",{className:"rsp-absolute rsp-bottom-0 rsp-left-0 rsp-right-0 rsp-h-[60px] rsp-bg-gradient-to-r rsp-from-[#F0F2F5] rsp-via-[#EBEDF0] rsp-to-[#E8EAED] rsp-flex rsp-items-center rsp-px-4 rsp-gap-2 rsp-border-t rsp-border-gray-200 rsp-shadow-[0_-1px_4px_rgba(0,0,0,0.05)]",children:[e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-[#54656F] rsp-opacity-60",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M9 11H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2zm2-7h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11z"})}),e.jsx("div",{className:"rsp-flex-1 rsp-bg-gradient-to-r rsp-from-white rsp-to-[#fafafa] rsp-rounded-[24px] rsp-px-4 rsp-py-2 rsp-flex rsp-items-center rsp-min-h-[36px] rsp-shadow-[0_1px_2px_rgba(0,0,0,0.1)] rsp-border rsp-border-gray-200",children:e.jsx("span",{className:"rsp-text-[13px] rsp-text-[#667781] rsp-opacity-70 rsp-font-normal",children:"Type a message"})}),e.jsx("div",{className:"rsp-w-9 rsp-h-9 rsp-bg-gradient-to-br rsp-from-[#25D366] rsp-via-[#20c55e] rsp-to-[#00A884] rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-shadow-[0_2px_6px_rgba(37,211,102,0.3)] rsp-border rsp-border-[#20c55e] rsp-border-opacity-30",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-white rsp-drop-shadow-sm",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"})})})]}),s&&e.jsx("div",{className:"rsp-absolute rsp-inset-0 rsp-bg-black rsp-bg-opacity-40 rsp-z-30 rsp-flex rsp-items-end rsp-animate-fade-in",children:e.jsxs("div",{className:"rsp-w-full rsp-bg-[#F0F2F5] rsp-rounded-t-2xl rsp-shadow-lg rsp-animate-slide-up",children:[e.jsx("div",{className:"rsp-p-4 rsp-border-b rsp-border-gray-300",children:e.jsx("h4",{className:"rsp-font-bold rsp-text-center rsp-text-gray-800 rsp-text-md",children:a.body||"Options"})}),e.jsx("div",{className:"rsp-max-h-[250px] rsp-overflow-y-auto",children:a.buttons.map((b,w)=>e.jsx("div",{className:`rsp-p-4 rsp-text-center rsp-text-[15px] rsp-text-[#128C7E] rsp-font-medium ${w<a.buttons.length-1?"rsp-border-b rsp-border-gray-300":""}`,style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:b.text},b.id))}),e.jsx("div",{onClick:()=>n(!1),className:"rsp-mt-2 rsp-p-4 rsp-text-center rsp-font-bold rsp-text-[#128C7E] rsp-bg-white rsp-cursor-pointer rsp-shadow-inner",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:"Close"})]})})]})]})]})})})]})}const ve={name:"",category:"MARKETING",type:"BASIC",language:"en",enableClickTracking:!1,headerType:"NONE",headerText:"",body:"",footer:"",buttons:[]};function ua({onCancel:a}){var t,d,g;const s=typeof ne.useInRouterContext=="function"?ne.useInRouterContext():!1,n=ne.useNavigate(),[r,l]=C.useState(ve),[m,i]=C.useState(!0),[v,y]=C.useState(!1),[p,j]=C.useState(!1),[V,o]=C.useState(null),[u,E]=C.useState({isOpen:!1});C.useState({isOpen:!1}),C.useEffect(()=>{if(V){const h=setTimeout(()=>{o(null)},5e3);return()=>clearTimeout(h)}},[V]);const b=async()=>{var h,S,B;try{if(j(!0),o(null),!r.name||!r.body)throw new Error("Template name and body are required");const c=localStorage.getItem("account"),N=c?JSON.parse(c):{apiKey:""};if(!N.apiKey)throw new Error("Please set your API key in the dashboard first");const O=new URLSearchParams(window.location.search).get("edit");let R;if(O){const D=await Ke(N.apiKey,O,r);if(!D.success)throw new Error(D.message||"Update failed");R={status:"success",data:{details:[{template_name:r.name,template_id:O}]}}}else if(R=await We(N,r),R.status==="error")throw new Error(R.message);if(R.status==="error")throw new Error(R.message);E({isOpen:!0,templateName:(h=R.data)==null?void 0:h.details[0].template_name,templateId:(S=R.data)==null?void 0:S.details[0].template_id,template:(B=R.data)==null?void 0:B.template}),l(ve)}catch(c){o(c instanceof Error?c.message:"An error occurred while creating the template")}finally{j(!1)}};C.useEffect(()=>{const S=new URLSearchParams(window.location.search).get("edit");if(!S)return;(async()=>{try{const c=localStorage.getItem("account"),N=c?JSON.parse(c):{apiKey:""};if(!N.apiKey)throw new Error("Please set your API key in the dashboard first");const U=await Je(N.apiKey,S);l(O=>({...O,...U}))}catch(c){console.error("Failed to load template for edit",c),o(c instanceof Error?c.message:"Failed to load template")}finally{}})()},[]);const w=()=>{E({isOpen:!1}),a?a():s?n("/"):window.history.length>1&&window.history.back()};return e.jsxs("div",{className:"rsp-min-h-screen rsp-bg-[#f5f7fc] rsp-rounded-lg rsp-shadow-sm",children:[e.jsxs("div",{className:"rsp-max-w-[1200px] rsp-mx-auto rsp-px-6 rsp-h-full",children:[e.jsx("div",{className:"rsp-py-6 rsp-border-b rsp-border-gray-200",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsx("h1",{className:"rsp-text-2xl rsp-font-semibold rsp-text-[#0043ff]",children:"Add Template"}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-3",children:[e.jsx("button",{onClick:()=>{a?a():s?n("/"):window.history.length>1&&window.history.back()},className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-bg-white rsp-border rsp-border-gray-300 rsp-rounded-md hover:rsp-bg-gray-50 rsp-transition-colors",children:"Cancel"}),e.jsxs("button",{onClick:()=>i(!m),className:`rsp-flex rsp-items-center rsp-gap-2 rsp-px-4 rsp-py-2 rsp-rounded-md rsp-text-sm rsp-font-medium rsp-transition-colors
|
|
93
|
-
|
|
94
|
-
|
|
91
|
+
*/const _e=F("Workflow",[["rect",{width:"8",height:"8",x:"3",y:"3",rx:"2",key:"by2w9f"}],["path",{d:"M7 11v4a2 2 0 0 0 2 2h4",key:"xkn7yn"}],["rect",{width:"8",height:"8",x:"13",y:"13",rx:"2",key:"1cgmvn"}]]);/**
|
|
92
|
+
* @license lucide-react v0.344.0 - ISC
|
|
93
|
+
*
|
|
94
|
+
* This source code is licensed under the ISC license.
|
|
95
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
96
|
+
*/const ee=F("X",[["path",{d:"M18 6 6 18",key:"1bl5f8"}],["path",{d:"m6 6 12 12",key:"d8bk6v"}]]);function ne({isOpen:a,onClose:s,title:r,children:n}){const t=C.useRef(null);return C.useEffect(()=>{const p=i=>{t.current&&!t.current.contains(i.target)&&s()};return a&&document.addEventListener("mousedown",p),()=>{document.removeEventListener("mousedown",p)}},[a,s]),a?e.jsx("div",{className:"rsp-fixed rsp-inset-0 rsp-bg-black rsp-bg-opacity-50 rsp-flex rsp-items-center rsp-justify-center rsp-p-4 rsp-z-50",children:e.jsxs("div",{ref:t,className:"rsp-bg-white rsp-rounded-lg rsp-shadow-xl rsp-w-full rsp-max-w-[600px] rsp-animate-modal-appear",style:{backgroundColor:"#f5f7fc"},children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-px-6 rsp-py-4 rsp-border-b",children:[e.jsx("h2",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900 rsp-text-center rsp-w-full rsp-break-words rsp-break-all rsp-whitespace-pre-wrap",children:r}),e.jsx("button",{onClick:s,className:"rsp-p-1 hover:rsp-bg-gray-100 rsp-rounded-full",children:e.jsx(ee,{className:"rsp-w-5 rsp-h-5 rsp-text-gray-500"})})]}),e.jsx("div",{className:"rsp-px-6 rsp-py-4 rsp-overflow-y-auto rsp-max-h-[70vh] rsp-break-words rsp-whitespace-pre-wrap",children:n})]})}):null}function Fe({onCreateTemplate:a,onEditTemplate:s}){const[r,n]=C.useState([]),[t,p]=C.useState(!0),[i,w]=C.useState(null),[b,f]=C.useState(null),[v,S]=C.useState({isOpen:!1}),[c,j]=C.useState(()=>{const h=localStorage.getItem("account");return h?JSON.parse(h):{apiKey:""}}),[E,u]=C.useState(""),[g,l]=C.useState("all"),[m,d]=C.useState("all"),[y]=C.useState("all"),[U,R]=C.useState(1),o=20,[k,V]=C.useState({isOpen:!1});C.useEffect(()=>{(async()=>{try{if(w(null),p(!0),n([]),!c.apiKey){w("Please enter your TrustSignal API key"),p(!1);return}const L=await Me(c,{limit:1e3});if(L.status==="error")throw new Error(L.message);n(L.data)}catch(L){w(L instanceof Error?L.message:"Failed to fetch templates"),n([])}finally{p(!1)}})()},[c]);const B=h=>{const{name:L,value:z}=h.target,W={...c,[L]:z};j(W),localStorage.setItem("account",JSON.stringify(W))},O=(h,L)=>{V({isOpen:!0,url:h,templateName:L})},q=()=>{V({isOpen:!1})},x=async h=>{try{const L=localStorage.getItem("account"),z=L?JSON.parse(L):{apiKey:""};if(!z.apiKey){w("Please enter your TrustSignal API key");return}f(h);const{deleteTemplateById:W}=await Promise.resolve().then(()=>require("./delete-CZKt5rSC.cjs")),M=await W(z.apiKey,h);if(!M.success)throw new Error(M.message||"Delete failed");n(J=>J.filter(D=>D.id!==h)),S({isOpen:!1})}catch(L){w(L instanceof Error?L.message:"Failed to delete template")}finally{f(null)}},N=r.filter(h=>{const L=E.trim(),z=L.toLowerCase(),W=L===""||h.id.toString().includes(L)||h.name.toLowerCase().includes(z),M=g==="all"||h.status.toLowerCase()===g.toLowerCase(),J=m==="all"||h.category.toLowerCase()===m.toLowerCase(),D=y==="all"||h.language.toLowerCase().startsWith(y.toLowerCase());return W&&M&&J&&D}),T=Math.ceil(N.length/o),A=(U-1)*o,I=A+o,P=N.slice(A,I);return t?e.jsx("div",{className:"rsp-flex rsp-items-center rsp-justify-center rsp-min-h-screen",children:e.jsx("div",{className:"rsp-text-lg rsp-text-gray-600",children:"Loading templates..."})}):e.jsxs("div",{className:"rsp-container rsp-mx-auto rsp-px-4 rsp-py-8 rsp-bg-[#f5f7fc] rsp-rounded-lg rsp-shadow-sm",children:[e.jsxs("div",{className:"rsp-flex rsp-justify-between rsp-items-center rsp-mb-6",children:[e.jsx("h1",{className:"rsp-text-2xl rsp-font-bold",children:"Whatsapp HSM Templates"}),e.jsx("button",{onClick:()=>a==null?void 0:a(),className:"rsp-bg-blue-600 rsp-text-white rsp-p-1 rsp-rounded-full hover:rsp-bg-blue-700 rsp-flex rsp-items-center rsp-gap-2",children:e.jsx(de,{className:"rsp-w-6 rsp-h-6"})})]}),e.jsx("div",{className:" rsp-p-4 rsp-pl-0 rsp-rounded-lg rsp-shadow-sm rsp-mb-6",children:e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-1",children:"TrustSignal API Key"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:"password",name:"apiKey",value:c.apiKey,onChange:B,className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent",placeholder:"Enter your TrustSignal API key"}),e.jsx("div",{className:"rsp-absolute rsp-bottom-0 rsp-left-0 rsp-w-4 rsp-h-0.5 rsp-bg-red-500"})]})]})}),i&&e.jsx("div",{className:"rsp-bg-red-50 rsp-border-l-4 rsp-border-red-500 rsp-p-4 rsp-mb-6",children:e.jsxs("div",{className:"rsp-flex",children:[e.jsx("div",{className:"rsp-flex-shrink-0",children:e.jsx(me,{className:"rsp-h-5 rsp-w-5 rsp-text-red-400"})}),e.jsx("div",{className:"rsp-ml-3",children:e.jsx("p",{className:"rsp-text-sm rsp-text-red-700",children:i})})]})}),e.jsx("div",{className:"rsp-mb-6",children:e.jsx("div",{className:"rsp-relative",children:e.jsx("input",{type:"text",placeholder:"Search by name or ID...",value:E,onChange:h=>u(h.target.value),className:"rsp-w-full rsp-px-0 rsp-py-3 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent"})})}),e.jsx("div",{className:"rsp-bg-white rsp-rounded-lg rsp-shadow-sm rsp-border rsp-border-gray-200 rsp-overflow-hidden",children:e.jsx("div",{className:"rsp-overflow-x-auto",children:e.jsxs("table",{className:"rsp-min-w-full",children:[e.jsx("thead",{children:e.jsxs("tr",{className:"rsp-bg-blue-600 rsp-text-white",children:[e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:"ID"}),e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:"Name"}),e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsx("span",{children:"Category"}),e.jsx("div",{className:"rsp-flex rsp-items-center",children:e.jsxs("select",{value:m,onChange:h=>d(h.target.value),className:"rsp-cursor-pointer rsp-ml-2 rsp-bg-transparent rsp-text-white rsp-border-0 rsp-text-sm focus:rsp-outline-none ",onClick:h=>h.stopPropagation(),children:[e.jsx("option",{value:"all",className:"rsp-text-gray-900",children:"All"}),e.jsx("option",{value:"utility",className:"rsp-text-gray-900",children:"Utility"}),e.jsx("option",{value:"marketing",className:"rsp-text-gray-900",children:"Marketing"})]})})]})}),e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:e.jsx("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:e.jsx("span",{children:"Language"})})}),e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:"Type"}),e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsx("span",{children:"Status"}),e.jsx("div",{className:"rsp-flex rsp-items-center",children:e.jsxs("select",{value:g,onChange:h=>l(h.target.value),className:"rsp-cursor-pointer rsp-ml-2 rsp-bg-transparent rsp-text-white rsp-border-0 rsp-text-sm focus:rsp-outline-none",onClick:h=>h.stopPropagation(),children:[e.jsx("option",{value:"all",className:"rsp-text-gray-900",children:"All"}),e.jsx("option",{value:"pending",className:"rsp-text-gray-900",children:"Pending"}),e.jsx("option",{value:"approved",className:"rsp-text-gray-900",children:"Approved"}),e.jsx("option",{value:"rejected",className:"rsp-text-gray-900",children:"Rejected"})]})})]})}),e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:"Created"}),e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:"Updated"}),e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:"Media"}),e.jsx("th",{className:"rsp-px-6 rsp-py-3 rsp-text-left rsp-text-sm rsp-font-medium",children:"Actions"})]})}),e.jsx("tbody",{children:P.length>0?P.map((h,L)=>e.jsxs("tr",{className:`rsp-border-b rsp-border-gray-200 ${L%2===0?"rsp-bg-white":"rsp-bg-blue-50"} hover:rsp-bg-blue-100 rsp-transition-colors`,children:[e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-900",children:h.id}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-900 rsp-font-medium",children:h.name}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-700 rsp-capitalize",children:h.category}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-700",children:h.language}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-700",children:h.type}),e.jsx("td",{className:"rsp-px-6 rsp-py-4",children:e.jsx("span",{className:`rsp-inline-flex rsp-px-3 rsp-py-1 rsp-rounded-full rsp-text-xs rsp-font-medium
|
|
97
|
+
${h.status.toLowerCase()==="approved"?"rsp-bg-green-100 rsp-text-green-800":h.status.toLowerCase()==="rejected"?"rsp-bg-red-100 rsp-text-red-800":"rsp-bg-yellow-100 rsp-text-yellow-800"}`,children:h.status})}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-700",children:h.creation_time?new Date(h.creation_time).toLocaleDateString():"N/A"}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-700",children:h.updation_time?new Date(h.updation_time).toLocaleDateString():"N/A"}),e.jsx("td",{className:"rsp-px-6 rsp-py-4 rsp-text-sm rsp-text-gray-700",children:h.medialist&&typeof h.medialist=="object"&&"header"in h.medialist&&h.medialist.header?e.jsxs("button",{onClick:()=>O(String(h.medialist.header||""),h.name),className:"rsp-inline-flex rsp-items-center rsp-px-3 rsp-py-1 rsp-rounded rsp-text-xs rsp-font-medium rsp-bg-blue-100 rsp-text-blue-800 hover:rsp-bg-blue-200 rsp-transition-colors",children:[e.jsxs("svg",{className:"rsp-w-3 rsp-h-3 rsp-mr-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:[e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 12a3 3 0 11-6 0 3 3 0 016 0z"}),e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"})]}),e.jsx("span",{children:"View Media"})]}):e.jsx("span",{className:"rsp-inline-flex rsp-px-2 rsp-py-1 rsp-rounded-full rsp-text-xs rsp-font-medium rsp-bg-gray-100 rsp-text-gray-800",children:"No Media"})}),e.jsx("td",{className:"rsp-px-6 rsp-py-4",children:e.jsxs("div",{className:"rsp-flex rsp-gap-2",children:[e.jsx("button",{onClick:()=>s==null?void 0:s(String(h.id)),className:"rsp-inline-flex rsp-items-center rsp-justify-center rsp-w-8 rsp-h-8 rsp-rounded rsp-bg-blue-600 rsp-text-white hover:rsp-bg-blue-700 rsp-transition-colors",title:"Update",children:e.jsx(Oe,{className:"rsp-w-4 rsp-h-4"})}),e.jsx("button",{onClick:()=>S({isOpen:!0,templateId:String(h.id),templateName:h.name}),disabled:b===h.id,className:`rsp-inline-flex rsp-items-center rsp-justify-center rsp-w-8 rsp-h-8 rsp-rounded rsp-text-white rsp-transition-colors ${b===h.id?"rsp-bg-red-400":"rsp-bg-red-600 hover:rsp-bg-red-700"}`,title:b===h.id?"Deleting...":"Delete",children:e.jsx(ze,{className:"rsp-w-4 rsp-h-4"})})]})})]},h.id)):e.jsx("tr",{children:e.jsx("td",{colSpan:9,className:"rsp-px-6 rsp-py-8 rsp-text-center rsp-text-gray-500",children:"No templates found"})})})]})})}),P.length>0&&e.jsxs("div",{className:"rsp-flex rsp-justify-between rsp-items-center rsp-mt-6 rsp-px-6 rsp-py-4 rsp-bg-white rsp-rounded-lg rsp-shadow-sm rsp-border rsp-border-gray-200",children:[e.jsxs("div",{className:"rsp-text-sm rsp-text-gray-700",children:["Showing ",e.jsx("span",{className:"rsp-font-medium",children:A+1})," to ",e.jsx("span",{className:"rsp-font-medium",children:Math.min(I,N.length)})," of ",e.jsx("span",{className:"rsp-font-medium",children:N.length})," results"]}),e.jsxs("div",{className:"rsp-flex rsp-gap-2",children:[e.jsx("button",{onClick:()=>R(h=>Math.max(h-1,1)),disabled:U===1,className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-bg-white rsp-border rsp-border-gray-300 rsp-rounded-md hover:rsp-bg-gray-50 disabled:rsp-opacity-50 disabled:rsp-cursor-not-allowed rsp-transition-colors",children:"Previous"}),e.jsxs("span",{className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-gray-700",children:["Page ",U," of ",T]}),e.jsx("button",{onClick:()=>R(h=>Math.min(h+1,T)),disabled:U===T,className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-bg-white rsp-border rsp-border-gray-300 rsp-rounded-md hover:rsp-bg-gray-50 disabled:rsp-opacity-50 disabled:rsp-cursor-not-allowed rsp-transition-colors",children:"Next"})]})]}),e.jsx(ne,{isOpen:k.isOpen,onClose:q,title:`Media - ${k.templateName||"Template"}`,children:e.jsxs("div",{className:"rsp-space-y-4",children:[k.url&&e.jsxs("div",{className:"rsp-text-center",children:[e.jsxs("div",{className:"rsp-relative rsp-bg-gray-50 rsp-rounded-lg rsp-p-4 rsp-min-h-[200px] rsp-flex rsp-items-center rsp-justify-center",children:[e.jsx("img",{src:k.url,alt:"Template media",className:"rsp-max-w-full rsp-max-h-[400px] rsp-mx-auto rsp-rounded-lg rsp-shadow-md rsp-object-contain",onLoad:h=>{const L=h.currentTarget.parentElement,z=L==null?void 0:L.querySelector(".loading-placeholder");z&&(z.style.display="none")},onError:h=>{h.currentTarget.style.display="none";const L=h.currentTarget.parentElement,z=L==null?void 0:L.querySelector(".error-placeholder");z&&(z.style.display="block")}}),t&&e.jsx("div",{className:"loading-placeholder rsp-absolute rsp-inset-0 rsp-flex rsp-items-center rsp-justify-center",children:e.jsx("div",{className:"rsp-text-gray-500 rsp-text-sm",children:"Loading media..."})}),e.jsxs("div",{className:"error-placeholder rsp-absolute rsp-inset-0 rsp-flex rsp-flex-col rsp-items-center rsp-justify-center",style:{display:"none"},children:[e.jsx("svg",{className:"rsp-w-[100%] rsp-h-12 rsp-text-gray-400 rsp-m-2",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"})}),e.jsx("p",{className:"rsp-text-gray-500 rsp-text-sm rsp-mb-2",children:"Load media on new tab"})]})]}),e.jsxs("div",{className:"rsp-mt-4 rsp-p-3 rsp-bg-gray-50 rsp-rounded-lg",children:[e.jsx("p",{className:"rsp-text-xs rsp-text-gray-600 rsp-mb-1",children:"Media URL:"}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-800 rsp-break-all rsp-font-mono",children:k.url})]})]}),e.jsx("div",{className:"rsp-flex rsp-justify-end rsp-pt-4",children:e.jsxs("a",{href:k.url,target:"_blank",rel:"noopener noreferrer",className:"rsp-inline-flex rsp-items-center rsp-px-4 rsp-py-2 rsp-bg-blue-600 rsp-text-white rsp-text-sm rsp-font-medium rsp-rounded-md hover:rsp-bg-blue-700 rsp-transition-colors",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-mr-2",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"})}),"Open in New Tab"]})})]})}),e.jsx(ne,{isOpen:v.isOpen,onClose:()=>S({isOpen:!1}),title:"Delete Template",children:e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsxs("p",{className:"rsp-text-sm rsp-text-gray-700",children:["Are you sure you want to delete the template ",e.jsx("span",{className:"rsp-font-medium",children:v.templateName}),"?"]}),e.jsxs("div",{className:"rsp-flex rsp-justify-end rsp-gap-3",children:[e.jsx("button",{onClick:()=>S({isOpen:!1}),className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-bg-white rsp-border rsp-border-gray-300 rsp-rounded-md hover:rsp-bg-gray-50",children:"Cancel"}),e.jsx("button",{onClick:()=>v.templateId&&x(v.templateId),className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-white rsp-bg-red-600 rsp-rounded-md hover:rsp-bg-red-700",children:"Delete"})]})]})})]})}const qe=async(a,s)=>{var r,n,t,p,i,w,b;try{console.log("Creating template with data:",s);const f=s.language,v=s.headerType==="MEDIA"&&s.mediaType==="DOCUMENT",S=s.type==="CAROUSEL";let c="";v?c=ke(s,f):S?c=Ne(s,f):c=Ce(s,f),console.log("Raw JSON string being sent:",c);const j={method:"POST",headers:{"Content-Type":"application/json"},body:c,redirect:"follow"};console.log("Making request to:",`https://wpapi.trustsignal.io/api/v1/template?api_key=${a}`),console.log("Request options:",j);const E=await fetch(`https://wpapi.trustsignal.io/api/v1/template?api_key=${a}`,j);console.log("Response status:",E.status),console.log("Response headers:",Object.fromEntries(E.headers.entries()));const u=await E.text();console.log("Raw response:",u);const g=JSON.parse(u);if(console.log("Parsed response:",g),!g.success)throw new Error(g.message||"Template creation failed");return{status:"success",message:"Template created successfully",data:{template:g.template,details:[{template_name:((r=g.template)==null?void 0:r.name)||s.name,template_id:((n=g.template)==null?void 0:n.id)||"unknown",meta_tid:(t=g.template)==null?void 0:t.meta_tid,status:(p=g.template)==null?void 0:p.status,quality:(i=g.template)==null?void 0:i.quality,temp_route:(w=g.template)==null?void 0:w.temp_route,temptype:(b=g.template)==null?void 0:b.temptype}]}}}catch(f){return console.error("TrustSignal API Error:",f),{status:"error",message:f instanceof Error?f.message:"Failed to create template"}}};function He(a){const s=a.language,r=a.headerType==="MEDIA"&&a.mediaType==="DOCUMENT",n=a.type==="CAROUSEL";return r?ke(a,s):n?Ne(a,s):Ce(a,s)}const ke=(a,s)=>{var p,i;const r={name:a.name,lang:s,category:a.category,components:[]};a.headerType==="MEDIA"&&a.mediaUrl&&(r.media={header:a.mediaUrl},r.components.push({type:"HEADER",format:"DOCUMENT"}));const n=Q(a.body),t={type:"BODY",text:a.body};if(n.length>0&&((p=a.sampleContent)!=null&&p.bodyVariables)){const w=fe(a,n);t.example={body_text:[w]}}if(r.components.push(t),(i=a.footer)!=null&&i.trim()&&r.components.push({type:"FOOTER",text:a.footer}),a.buttons&&a.buttons.length>0){const w=a.buttons.map(b=>{var v;const f={type:b.type==="CALL"?"PHONE_NUMBER":b.type,text:b.text};if(b.type==="URL"&&b.value&&(f.url=b.value,b.urlType==="dynamic"&&b.value.includes("{{"))){const S=Q(b.value);if(S.length>0&&((v=a.sampleContent)!=null&&v.buttonVariables)){const c=S.map(({number:j})=>{var E,u;return((u=(E=a.sampleContent)==null?void 0:E.buttonVariables)==null?void 0:u[j])||`sample${j}`});f.example=c}}return(b.type==="CALL"||b.type==="PHONE_NUMBER")&&b.value&&(f.phone_number=oe(b.value)),f});r.components.push({type:"BUTTONS",buttons:w})}return JSON.stringify(r)},Ne=(a,s)=>{var i,w,b;const r={name:a.name,lang:s,category:a.category,shortlink:a.enableClickTracking?"1":"0",components:[]};(i=a.carousel)!=null&&i.cards.length&&(r.media={},a.carousel.cards.forEach((f,v)=>{f.mediaUrl&&(r.media[`card${v}header`]=f.mediaUrl)}));const n=[],t=Q(a.body),p={type:"BODY",text:a.body,...t.length>0&&((w=a.sampleContent)==null?void 0:w.bodyVariables)&&{example:{body_text:[fe(a,t)]}}};if(n.push(p),(b=a.carousel)!=null&&b.cards.length){const f={type:"CAROUSEL",cards:a.carousel.cards.map(v=>{var S;return{components:[{type:"HEADER",format:((S=a.carousel)==null?void 0:S.type)||"IMAGE"},{type:"BODY",text:v.body,...Q(v.body).length>0&&{example:{body_text:[$e(v)]}}},...v.buttons.length>0?[{type:"BUTTONS",buttons:v.buttons.map(c=>{var E;const j={type:c.type==="CALL"?"PHONE_NUMBER":c.type,text:c.text};if(c.type==="URL"&&c.value&&(j.url=c.value,c.urlType==="dynamic"&&c.value.includes("{{"))){const u=Q(c.value);if(u.length>0){const g=((E=v==null?void 0:v.sampleContent)==null?void 0:E.buttonVariables)||{},l=u.map(({number:m})=>g[m]||`sample${m}`);j.example=l}}return(c.type==="CALL"||c.type==="PHONE_NUMBER")&&c.value&&(j.phone_number=oe(c.value)),console.log("Carousel card button data:",j),j})}]:[]]}})};n.push(f)}return r.components=n,JSON.stringify(r)},$e=a=>{var n;const s=Q(a.body||""),r=((n=a==null?void 0:a.sampleContent)==null?void 0:n.bodyVariables)||{};return s.map(({number:t})=>r[t]||`Sample ${t}`)},Ce=(a,s)=>{var i,w;const r={name:a.name,lang:s,category:a.category,shortlink:a.enableClickTracking?"1":"0",components:[]};a.headerType==="MEDIA"&&a.mediaUrl&&a.mediaType!=="DOCUMENT"&&(r.media={header:a.mediaUrl});const n=[];if(a.type!=="CAROUSEL"){if(a.headerType==="TEXT"&&a.headerText){const b=Q(a.headerText),f={type:"HEADER",format:"TEXT",text:a.headerText,...b.length>0&&((i=a.sampleContent)==null?void 0:i.headerVariables)&&{example:{header_text:Ge(a,b)}}};n.push(f)}else if(a.headerType==="MEDIA"){const b={type:"HEADER",format:a.mediaType||"IMAGE"};n.push(b)}}const t=Q(a.body),p={type:"BODY",text:a.body,...t.length>0&&((w=a.sampleContent)==null?void 0:w.bodyVariables)&&{example:{body_text:[fe(a,t)]}}};if(n.push(p),a.footer&&a.type!=="CAROUSEL"&&n.push({type:"FOOTER",text:a.footer}),a.buttons.length>0){const b=a.buttons.map(f=>{var S;const v={type:f.type==="CALL"?"PHONE_NUMBER":f.type,text:f.text};if(f.type==="URL"&&f.value&&(v.url=f.value,f.urlType==="dynamic"&&f.value.includes("{{"))){const c=Q(f.value);if(c.length>0&&((S=a.sampleContent)!=null&&S.buttonVariables)){const j=c.map(({number:E})=>{var u,g;return((g=(u=a.sampleContent)==null?void 0:u.buttonVariables)==null?void 0:g[E])||`sample${E}`});v.example=j}}return(f.type==="CALL"||f.type==="PHONE_NUMBER")&&f.value&&(v.phone_number=oe(f.value)),v});n.push({type:"BUTTONS",buttons:b})}return r.components=n,JSON.stringify(r)},Q=a=>(a.match(/\{\{(\d+)\}\}/g)||[]).map(r=>({variable:r.replace(/[{}]/g,""),number:r.replace(/[{}]/g,"")})),oe=a=>a.startsWith("+")?a:`+${a}`,Ge=(a,s)=>s.map(({number:r})=>{var n,t;return((t=(n=a.sampleContent)==null?void 0:n.headerVariables)==null?void 0:t[r])||`Sample ${r}`}),fe=(a,s)=>s.map(({number:r})=>{var n,t;return((t=(n=a.sampleContent)==null?void 0:n.bodyVariables)==null?void 0:t[r])||`Sample ${r}`}),We=async(a,s)=>{try{if(!s.name||!s.body)throw new Error("Missing required template fields: name and body are required");if(!a.apiKey)throw new Error("Missing TrustSignal API key");return await qe(a.apiKey,s)}catch(r){return console.error("API Error:",r),{status:"error",message:r instanceof Error?r.message:"An unexpected error occurred while creating the template"}}};async function Ke(a,s,r){const n=He(r),p={method:"POST",headers:{"Content-Type":"application/json"},body:n,redirect:"follow"},i=`https://wpapi.trustsignal.io/v1/user-templates/update/${encodeURIComponent(s)}?api_key=${encodeURIComponent(a)}`,w=await fetch(i,p),b=await w.text();if(!w.ok)return{success:!1,message:`Update failed (${w.status}): ${b}`,raw:n};try{const f=JSON.parse(b);return{success:!!((f==null?void 0:f.success)??!0),message:f==null?void 0:f.message,raw:n}}catch{return{success:!0,raw:n}}}async function Je(a,s){var w;const r=`https://wpapi.trustsignal.io/api/v1/template/${encodeURIComponent(s)}?api_key=${encodeURIComponent(a)}`,n=await fetch(r,{method:"GET",redirect:"follow"});if(!n.ok)throw new Error(`Failed to fetch template ${s}: ${n.status}`);const t=await n.text(),p=JSON.parse(t),i=p.template||((w=p.data)==null?void 0:w.template)||p;if(!i)throw new Error("Invalid template details response");return Xe(i)}function Xe(a){var v,S;const s={headerVariables:{},bodyVariables:{},buttonVariables:{}};let r="NONE",n="",t,p,i="",w="";const b=[];if(a.jsonstruct)try{const c=JSON.parse(a.jsonstruct);if(c!=null&&c.header){const j=c.header.format;j&&j!=="TEXT"?(r="MEDIA",t=j,p=c.header.url||((v=a.medialist)==null?void 0:v.header)):j==="TEXT"&&(r="TEXT",n=c.header.text||"")}if(c!=null&&c.body&&(i=c.body.text||""),(S=c==null?void 0:c.buttons)!=null&&S.buttons&&Array.isArray(c.buttons.buttons))for(const j of c.buttons.buttons){if(!j||!j.type||!j.text)continue;const E={id:le(),type:j.type==="PHONE_NUMBER"?"PHONE_NUMBER":j.type,text:j.text};j.type==="URL"&&(E.value=j.url,typeof j.url=="string"&&j.url.includes("{{")&&Array.isArray(j.example)?(ge(j.url).forEach((g,l)=>{s.buttonVariables[g]=j.example[l]??""}),E.urlType="dynamic"):E.urlType="static"),(j.type==="CALL"||j.type==="PHONE_NUMBER")&&(E.value=j.phone_number||""),b.push(E)}if(c!=null&&c.carousel){const j=Object.keys(c.carousel).filter(m=>/^card\d+$/.test(m));j.sort((m,d)=>{const y=parseInt(m.replace("card",""),10),U=parseInt(d.replace("card",""),10);return y-U});const E=j.map(m=>{const d=c.carousel[m]||{},y=d.header||{},U=d.body||{},R=d.buttons&&Array.isArray(d.buttons.buttons)?d.buttons.buttons:[],o=y.format,k=o==="IMAGE"||o==="VIDEO"||o==="DOCUMENT"?o:void 0,B=`card${m.replace("card","")}header`,O=y.url||(a.medialist?a.medialist[B]:void 0),q=U.text||"",x=[];for(const N of R){if(!N||!N.type||!N.text)continue;const T={id:le(),type:N.type==="PHONE_NUMBER"?"PHONE_NUMBER":N.type,text:N.text};N.type==="URL"&&(T.value=N.url,typeof N.url=="string"&&N.url.includes("{{")&&Array.isArray(N.example)?(ge(N.url).forEach((I,P)=>{}),T.urlType="dynamic"):T.urlType="static"),(N.type==="CALL"||N.type==="PHONE_NUMBER")&&(T.value=N.phone_number||""),x.push(T)}return{id:le(),headerType:k?"MEDIA":"NONE",mediaType:k,mediaUrl:O,body:q,buttons:x,sampleContent:{headerVariables:{},bodyVariables:{},buttonVariables:{}}}});let u="IMAGE";const g=E[0];(g==null?void 0:g.mediaType)==="VIDEO"&&(u="VIDEO");const l={type:u,cards:E};return{name:a.name,category:a.category==="MARKETING"||a.category==="UTILITY"?a.category:"MARKETING",type:"CAROUSEL",language:a.lang||"en",enableClickTracking:!1,headerType:"NONE",headerText:"",body:i,footer:w,buttons:[],sampleContent:s,carousel:l}}}catch(c){console.warn("Failed to parse jsonstruct; falling back",c)}return{name:a.name,category:a.category==="MARKETING"||a.category==="UTILITY"?a.category:"MARKETING",type:"BASIC",language:a.lang||"en",enableClickTracking:!1,headerType:r,headerText:n,mediaType:t,mediaUrl:p,body:i,footer:w,buttons:b,sampleContent:s}}function ge(a){if(!a)return[];const s=a.match(/\{\{(\d+)\}\}/g)||[];return[...new Set(s.map(r=>r.replace(/[{}]/g,"")))]}function le(){return typeof crypto<"u"&&"randomUUID"in crypto?crypto.randomUUID():"id-"+Math.random().toString(36).slice(2)}const Ye=[{value:"af",label:"Afrikaans"},{value:"sq",label:"Albanian"},{value:"ar",label:"Arabic"},{value:"az",label:"Azerbaijani"},{value:"bn",label:"Bengali"},{value:"bg",label:"Bulgarian"},{value:"ca",label:"Catalan"},{value:"zh_CN",label:"Chinese (CHN)"},{value:"zh_HK",label:"Chinese (HKG)"},{value:"zh_TW",label:"Chinese (TAI)"},{value:"hr",label:"Croatian"},{value:"cs",label:"Czech"},{value:"da",label:"Danish"},{value:"nl",label:"Dutch"},{value:"en_GB",label:"English (UK)"},{value:"en_US",label:"English (US)"},{value:"en",label:"English"},{value:"et",label:"Estonian"},{value:"fil",label:"Filipino"},{value:"fi",label:"Finnish"},{value:"fr",label:"French"},{value:"de",label:"German"},{value:"el",label:"Greek"},{value:"gu",label:"Gujarati"},{value:"he",label:"Hebrew"},{value:"hi",label:"Hindi"},{value:"hu",label:"Hungarian"},{value:"id",label:"Indonesian"},{value:"ga",label:"Irish"},{value:"it",label:"Italian"},{value:"ja",label:"Japanese"},{value:"kn",label:"Kannada"},{value:"kk",label:"Kazakh"},{value:"ko",label:"Korean"},{value:"lo",label:"Lao"},{value:"lv",label:"Latvian"},{value:"lt",label:"Lithuanian"},{value:"mk",label:"Macedonian"},{value:"ms",label:"Malay"},{value:"mr",label:"Marathi"},{value:"nb",label:"Norwegian"},{value:"fa",label:"Persian"},{value:"pl",label:"Polish"},{value:"pt_BR",label:"Portuguese (BR)"},{value:"pt_PT",label:"Portuguese (POR)"},{value:"pa",label:"Punjabi"},{value:"ro",label:"Romanian"},{value:"ru",label:"Russian"},{value:"sr",label:"Serbian"},{value:"sk",label:"Slovak"},{value:"sl",label:"Slovenian"},{value:"es",label:"Spanish"},{value:"es_AR",label:"Spanish (ARG)"},{value:"es_ES",label:"Spanish (SPA)"},{value:"es_MX",label:"Spanish (MEX)"},{value:"sw",label:"Swahili"},{value:"sv",label:"Swedish"},{value:"ta",label:"Tamil"},{value:"te",label:"Telugu"},{value:"th",label:"Thai"},{value:"tr",label:"Turkish"},{value:"uk",label:"Ukrainian"},{value:"ur",label:"Urdu"},{value:"uz",label:"Uzbek"},{value:"vi",label:"Vietnamese"}],Qe=[{value:"NONE",label:"None"},{value:"TEXT",label:"Text"},{value:"MEDIA",label:"Media"}],Ze=[{value:"IMAGE",label:"Image"},{value:"VIDEO",label:"Video"},{value:"DOCUMENT",label:"Document"}],ea=5*1024*1024,aa=16*1024*1024,sa=100*1024*1024,te=["jpg","jpeg","png"],xe=["mp4","3gpp"],ce=["pdf","docx","xlsx","pptx","txt"];function ra({template:a,setTemplate:s,onFileUpload:r}){var U,R;const[n,t]=C.useState(null),[p,i]=C.useState(!1),[w,b]=C.useState(null),[f,v]=C.useState(null),S=()=>{const k=(a.headerText||"").match(/{{\d+}}/g);if(!k)return 0;const V=k.map(B=>{const O=B.match(/{{(\d+)}}/);return O?parseInt(O[1],10):0});return V.length>0?Math.max(...V):0},c=()=>{const V=`{{${S()+1}}}`;if(w&&a.headerText.length+V.length<=60){const B=w.selectionStart||a.headerText.length,O=a.headerText.substring(0,B),q=a.headerText.substring(B),x=O+V+q;s({...a,headerText:x}),setTimeout(()=>{if(w){const N=B+V.length;w.setSelectionRange(N,N),w.focus()}},0)}},j=o=>{s(k=>({...k,headerType:o,headerText:o==="TEXT"?k.headerText:"",mediaType:o==="MEDIA"?k.mediaType||"IMAGE":void 0,mediaUrl:o==="MEDIA"?k.mediaUrl:void 0})),o!=="MEDIA"&&(t(null),v(null))},E=o=>{var k;return((k=o.split("?")[0].split(".").pop())==null?void 0:k.toLowerCase())||""},u=(o,k)=>{const V=E(o.name);switch(k){case"IMAGE":if(!te.includes(V))return"Invalid format. Only JPG, JPEG, PNG are allowed.";if(o.size>ea)return"File is too large. Max size is 5 MB.";break;case"VIDEO":if(!xe.includes(V))return"Invalid format. Only MP4, 3GPP are allowed.";if(o.size>aa)return"File is too large. Max size is 16 MB.";break;case"DOCUMENT":if(!ce.includes(V))return"Invalid format. Allowed types: PDF, DOCX, XLSX, PPTX, TXT.";if(o.size>sa)return"File is too large. Max size is 100 MB.";break;default:return"Invalid media type."}return null},g=(o,k)=>{if(!o)return null;const V=E(o);switch(k){case"IMAGE":if(!te.includes(V))return"URL does not point to a valid image (JPG, JPEG, PNG).";break;case"VIDEO":if(!xe.includes(V))return"URL does not point to a valid video (MP4, 3GPP).";break;case"DOCUMENT":if(!ce.includes(V))return"URL does not point to a valid document.";break}return null},l=()=>{t(null),s({...a,mediaUrl:""}),v(null)},m=async o=>{var B;const k=(B=o.target.files)==null?void 0:B[0];if(!k||!a.mediaType)return;v(null);const V=u(k,a.mediaType);if(V){v(V);return}i(!0),t(k);try{const O=await r(k);s({...a,mediaUrl:O})}catch(O){console.error("File upload failed:",O),l();const q=O instanceof Error?O.message:"File upload failed. Please try again.";v(q)}finally{i(!1)}},d=o=>{const k=o.target.value;if(t(null),s({...a,mediaUrl:k}),a.mediaType){const V=g(k,a.mediaType);v(V)}},y=()=>{switch(a.mediaType){case"IMAGE":return te.map(o=>`.${o}`).join(",");case"VIDEO":return xe.map(o=>`.${o}`).join(",");case"DOCUMENT":return ce.map(o=>`.${o}`).join(",");default:return"*/*"}};return e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Header Type"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("select",{value:a.headerType,onChange:o=>j(o.target.value),className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent rsp-appearance-none",children:Qe.map(o=>e.jsx("option",{value:o.value,children:o.label},o.value))}),e.jsx("div",{className:"rsp-absolute rsp-inset-y-0 rsp-right-0 rsp-flex rsp-items-center rsp-px-2 rsp-pointer-events-none",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-gray-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})}),e.jsx("div",{className:"rsp-absolute rsp-bottom-0 rsp-left-0 rsp-w-4 rsp-h-0.5 rsp-bg-red-500"})]})]}),a.headerType==="TEXT"&&e.jsxs("div",{className:"rsp-animate-fade-in",children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Header Text"}),e.jsx("div",{className:"rsp-relative",children:e.jsx("input",{ref:b,type:"text",value:a.headerText,onChange:o=>s({...a,headerText:o.target.value}),maxLength:60,className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent",placeholder:"Add a 60 character title to your message"})}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mt-2",children:[e.jsx("button",{onClick:c,className:"rsp-px-2 rsp-py-1 rsp-text-xs hover:rsp-bg-gray-100 rsp-rounded rsp-text-gray-500 rsp-flex rsp-items-center rsp-gap-1",title:"Add variable to header",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"})})}),e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-500",children:[a.headerText.length,"/60"]})]}),(()=>{const o=[...new Set((a.headerText.match(/\{\{(\d+)\}\}/g)||[]).map(k=>k.replace(/[{}]/g,"")))];return o.length===0?null:e.jsxs("div",{className:"rsp-mt-3",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-2",children:"Sample Values"}),e.jsx("div",{className:"rsp-grid rsp-grid-cols-3 rsp-gap-2",children:o.map(k=>{var V,B;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-xs rsp-text-gray-500 rsp-whitespace-nowrap",children:[`{{${k}}}`,":"]}),e.jsx("input",{type:"text",value:((B=(V=a.sampleContent)==null?void 0:V.headerVariables)==null?void 0:B[k])||"",onChange:O=>{var x,N,T;const q={...a.sampleContent,headerVariables:{...(x=a.sampleContent)==null?void 0:x.headerVariables,[k]:O.target.value},bodyVariables:((N=a.sampleContent)==null?void 0:N.bodyVariables)||{},buttonVariables:((T=a.sampleContent)==null?void 0:T.buttonVariables)||{}};s({...a,sampleContent:q})},className:"rsp-flex-1 rsp-px-2 rsp-py-1 rsp-border rsp-border-gray-300 rsp-rounded rsp-text-xs focus:rsp-outline-none focus:rsp-border-blue-500",placeholder:"Sample"}),e.jsx("button",{type:"button",onClick:()=>{var N,T,A;const O=new RegExp(`\\{\\{${k}\\}\\}`,"g"),q=(a.headerText||"").replace(O,""),x=Object.fromEntries(Object.entries(((N=a.sampleContent)==null?void 0:N.headerVariables)||{}).filter(([I])=>I!==k));s({...a,headerText:q,sampleContent:{...a.sampleContent,headerVariables:x,bodyVariables:((T=a.sampleContent)==null?void 0:T.bodyVariables)||{},buttonVariables:((A=a.sampleContent)==null?void 0:A.buttonVariables)||{}}})},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`header-sample-${k}`)})})]})})()]}),a.headerType==="MEDIA"&&e.jsxs("div",{className:"rsp-space-y-6 rsp-animate-fade-in",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Media Type"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("select",{value:a.mediaType||"IMAGE",onChange:o=>{s(k=>({...k,mediaType:o.target.value,mediaUrl:""})),t(null),v(null)},className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent rsp-appearance-none",children:Ze.map(o=>e.jsx("option",{value:o.value,children:o.label},o.value))}),e.jsx("div",{className:"rsp-absolute rsp-inset-y-0 rsp-right-0 rsp-flex rsp-items-center rsp-px-2 rsp-pointer-events-none",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-gray-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})})]})]}),e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700",children:"Media"}),a.mediaUrl?e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-p-3 rsp-bg-gray-50 rsp-border rsp-border-gray-200 rsp-rounded-md",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-space-x-3 overflow-hidden",children:[a.mediaType==="IMAGE"&&e.jsx("img",{src:a.mediaUrl,alt:"Preview",className:"rsp-w-12 rsp-h-12 rsp-object-cover rsp-rounded",onError:o=>{o.currentTarget.style.display="none",f||v("Could not load image preview from URL.")},onLoad:()=>{f!=null&&f.includes("Could not load")&&v(null)}}),a.mediaType==="VIDEO"&&e.jsx("div",{className:"rsp-w-12 rsp-h-12 rsp-bg-gray-200 rsp-rounded rsp-flex rsp-items-center rsp-justify-center flex-shrink-0",children:e.jsx(Ie,{className:"rsp-w-6 rsp-h-6 rsp-text-gray-500"})}),a.mediaType==="DOCUMENT"&&e.jsx("div",{className:"rsp-w-12 rsp-h-12 rsp-bg-gray-200 rsp-rounded rsp-flex rsp-items-center rsp-justify-center flex-shrink-0",children:e.jsx(Re,{className:"rsp-w-6 rsp-h-6 rsp-text-gray-500"})}),e.jsxs("div",{className:"overflow-hidden",children:[e.jsx("p",{className:"rsp-text-sm rsp-font-medium rsp-text-gray-900 rsp-truncate",children:n?n.name:a.mediaUrl}),n&&e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500",children:`${(n.size/1024/1024).toFixed(2)} MB`})]})]}),e.jsx("button",{onClick:l,className:"rsp-p-1 rsp-text-gray-400 hover:rsp-text-red-500 rsp-transition-colors flex-shrink-0",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})})]}):e.jsxs("div",{children:[e.jsx("input",{type:"file",accept:y(),onChange:m,className:"rsp-hidden",id:"media-upload",disabled:p}),e.jsxs("label",{htmlFor:"media-upload",className:`rsp-w-full rsp-px-4 rsp-py-3 rsp-border-2 rsp-border-dashed rsp-border-gray-300 rsp-rounded-md rsp-flex rsp-flex-col rsp-items-center rsp-justify-center rsp-cursor-pointer rsp-transition-colors hover:rsp-border-gray-400 hover:rsp-bg-gray-50 ${p?"rsp-opacity-50 rsp-cursor-not-allowed":""}`,children:[e.jsx(De,{className:"rsp-w-6 rsp-h-6 rsp-text-gray-400 rsp-mb-2"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-600",children:p?"Uploading...":`Upload ${((U=a.mediaType)==null?void 0:U.toLowerCase())||"file"}`}),e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-400 rsp-mt-1",children:[a.mediaType==="IMAGE"&&"JPG, PNG up to 5MB",a.mediaType==="VIDEO"&&"MP4, 3GPP up to 16MB",a.mediaType==="DOCUMENT"&&"PDF, DOCX, etc. up to 100MB"]})]})]}),f&&e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2 rsp-text-xs rsp-text-red-600",children:[e.jsx(me,{className:"rsp-w-4 rsp-h-4"}),e.jsx("span",{children:f})]}),e.jsxs("div",{className:"rsp-flex rsp-items-center",children:[e.jsx("div",{className:"rsp-flex-1 rsp-border-t rsp-border-gray-300"}),e.jsx("span",{className:"rsp-px-3 rsp-text-sm rsp-text-gray-500",children:"OR"}),e.jsx("div",{className:"rsp-flex-1 rsp-border-t rsp-border-gray-300"})]}),e.jsx("div",{className:"rsp-relative",children:e.jsx("input",{type:"url",value:a.mediaUrl||"",onChange:d,className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent",placeholder:`Enter ${(R=a.mediaType)==null?void 0:R.toLowerCase()} URL`})})]})]})]})}const ye=[{name:"grinning-face",hexadecimal:"😀"},{name:"grinning-face-with-smiling-eyes",hexadecimal:"😁"},{name:"face-with-tears-of-joy",hexadecimal:"😂"},{name:"rolling-on-the-floor-laughing",hexadecimal:"🤣"},{name:"smiling-face-with-open-mouth",hexadecimal:"😃"},{name:"smiling-face-with-open-mouth-and-smiling-eyes",hexadecimal:"😄"},{name:"smiling-face-with-open-mouth-and-cold-sweat",hexadecimal:"😅"},{name:"smiling-face-with-open-mouth-and-tightly-closed-eyes",hexadecimal:"😆"},{name:"winking-face",hexadecimal:"😉"},{name:"smiling-face-with-smiling-eyes",hexadecimal:"😊"},{name:"face-savouring-delicious-food",hexadecimal:"😋"},{name:"smiling-face-with-sunglasses",hexadecimal:"😎"},{name:"smiling-face-with-heart-shaped-eyes",hexadecimal:"😍"},{name:"face-throwing-a-kiss",hexadecimal:"😘"},{name:"kissing-face",hexadecimal:"😗"},{name:"kissing-face-with-smiling-eyes",hexadecimal:"😙"},{name:"kissing-face-with-closed-eyes",hexadecimal:"😚"},{name:"slightly-smiling-face",hexadecimal:"🙂"},{name:"hugging-face",hexadecimal:"🤗"},{name:"thinking-face",hexadecimal:"🤔"},{name:"neutral-face",hexadecimal:"😐"},{name:"expressionless-face",hexadecimal:"😑"},{name:"face-without-mouth",hexadecimal:"😶"},{name:"face-with-rolling-eyes",hexadecimal:"🙄"},{name:"smirking-face",hexadecimal:"😏"},{name:"persevering-face",hexadecimal:"😣"},{name:"disappointed-but-relieved-face",hexadecimal:"😥"},{name:"face-with-open-mouth",hexadecimal:"😮"},{name:"zipper-mouth-face",hexadecimal:"🤐"},{name:"hushed-face",hexadecimal:"😯"},{name:"sleepy-face",hexadecimal:"😪"},{name:"tired-face",hexadecimal:"😫"},{name:"sleeping-face",hexadecimal:"😴"},{name:"relieved-face",hexadecimal:"😌"},{name:"nerd-face",hexadecimal:"🤓"},{name:"face-with-stuck-out-tongue",hexadecimal:"😛"},{name:"face-with-stuck-out-tongue-and-winking-eye",hexadecimal:"😜"},{name:"face-with-stuck-out-tongue-and-tightly-closed-eyes",hexadecimal:"😝"},{name:"drooling-face",hexadecimal:"🤤"},{name:"unamused-face",hexadecimal:"😒"},{name:"face-with-cold-sweat",hexadecimal:"😓"},{name:"pensive-face",hexadecimal:"😔"},{name:"confused-face",hexadecimal:"😕"},{name:"upside-down-face",hexadecimal:"🙃"},{name:"money-mouth-face",hexadecimal:"🤑"},{name:"astonished-face",hexadecimal:"😲"},{name:"slightly-frowning-face",hexadecimal:"🙁"},{name:"confounded-face",hexadecimal:"😖"},{name:"disappointed-face",hexadecimal:"😞"},{name:"worried-face",hexadecimal:"😟"},{name:"face-with-look-of-triumph",hexadecimal:"😤"},{name:"crying-face",hexadecimal:"😢"},{name:"loudly-crying-face",hexadecimal:"😭"},{name:"frowning-face-with-open-mouth",hexadecimal:"😦"},{name:"anguished-face",hexadecimal:"😧"},{name:"fearful-face",hexadecimal:"😨"},{name:"weary-face",hexadecimal:"😩"},{name:"grimacing-face",hexadecimal:"😬"},{name:"face-with-open-mouth-and-cold-sweat",hexadecimal:"😰"},{name:"face-screaming-in-fear",hexadecimal:"😱"},{name:"flushed-face",hexadecimal:"😳"},{name:"dizzy-face",hexadecimal:"😵"},{name:"pouting-face",hexadecimal:"😡"},{name:"angry-face",hexadecimal:"😠"},{name:"smiling-face-with-halo",hexadecimal:"😇"},{name:"face-with-cowboy-hat",hexadecimal:"🤠"},{name:"clown-face",hexadecimal:"🤡"},{name:"lying-face",hexadecimal:"🤥"},{name:"face-with-medical-mask",hexadecimal:"😷"},{name:"face-with-thermometer",hexadecimal:"🤒"},{name:"face-with-head-bandage",hexadecimal:"🤕"},{name:"nauseated-face",hexadecimal:"🤢"},{name:"sneezing-face",hexadecimal:"🤧"},{name:"smiling-face-with-horns",hexadecimal:"😈"},{name:"imp",hexadecimal:"👿"},{name:"japanese-ogre",hexadecimal:"👹"},{name:"japanese-goblin",hexadecimal:"👺"},{name:"skull",hexadecimal:"💀"},{name:"skull-and-crossbones",hexadecimal:"☠"},{name:"ghost",hexadecimal:"👻"},{name:"extraterrestrial-alien",hexadecimal:"👽"},{name:"alien-monster",hexadecimal:"👾"},{name:"robot-face",hexadecimal:"🤖"},{name:"pile-of-poo",hexadecimal:"💩"},{name:"smiling-cat-face-with-open-mouth",hexadecimal:"😺"},{name:"grinning-cat-face-with-smiling-eyes",hexadecimal:"😸"},{name:"cat-face-with-tears-of-joy",hexadecimal:"😹"},{name:"smiling-cat-face-with-heart-shaped-eyes",hexadecimal:"😻"},{name:"cat-face-with-wry-smile",hexadecimal:"😼"},{name:"kissing-cat-face-with-closed-eyes",hexadecimal:"😽"},{name:"weary-cat-face",hexadecimal:"🙀"},{name:"crying-cat-face",hexadecimal:"😿"},{name:"pouting-cat-face",hexadecimal:"😾"},{name:"see-no-evil-monkey",hexadecimal:"🙈"},{name:"hear-no-evil-monkey",hexadecimal:"🙉"},{name:"speak-no-evil-monkey",hexadecimal:"🙊"},{name:"boy",hexadecimal:"👦"},{name:"boy-type-1-2",hexadecimal:"👦🏻"},{name:"boy-type-3",hexadecimal:"👦🏼"},{name:"boy-type-4",hexadecimal:"👦🏽"},{name:"boy-type-5",hexadecimal:"👦🏾"},{name:"boy-type-6",hexadecimal:"👦🏿"},{name:"girl",hexadecimal:"👧"},{name:"girl-type-1-2",hexadecimal:"👧🏻"},{name:"girl-type-3",hexadecimal:"👧🏼"},{name:"girl-type-4",hexadecimal:"👧🏽"},{name:"girl-type-5",hexadecimal:"👧🏾"},{name:"girl-type-6",hexadecimal:"👧🏿"},{name:"man",hexadecimal:"👨"},{name:"man-type-1-2",hexadecimal:"👨🏻"},{name:"man-type-3",hexadecimal:"👨🏼"},{name:"man-type-4",hexadecimal:"👨🏽"},{name:"man-type-5",hexadecimal:"👨🏾"},{name:"man-type-6",hexadecimal:"👨🏿"},{name:"woman",hexadecimal:"👩"},{name:"woman-type-1-2",hexadecimal:"👩🏻"},{name:"woman-type-3",hexadecimal:"👩🏼"},{name:"woman-type-4",hexadecimal:"👩🏽"},{name:"woman-type-5",hexadecimal:"👩🏾"},{name:"woman-type-6",hexadecimal:"👩🏿"},{name:"older-man",hexadecimal:"👴"},{name:"old-man-type-1-2",hexadecimal:"👴🏻"},{name:"old-man-type-3",hexadecimal:"👴🏼"},{name:"old-man-type-4",hexadecimal:"👴🏽"},{name:"old-man-type-5",hexadecimal:"👴🏾"},{name:"old-man-type-6",hexadecimal:"👴🏿"},{name:"older-woman",hexadecimal:"👵"},{name:"old-woman-type-1-2",hexadecimal:"👵🏻"},{name:"old-woman-type-3",hexadecimal:"👵🏼"},{name:"old-woman-type-4",hexadecimal:"👵🏽"},{name:"old-woman-type-5",hexadecimal:"👵🏾"},{name:"old-woman-type-6",hexadecimal:"👵🏿"},{name:"baby",hexadecimal:"👶"},{name:"baby-type-1-2",hexadecimal:"👶🏻"},{name:"baby-type-3",hexadecimal:"👶🏼"},{name:"baby-type-4",hexadecimal:"👶🏽"},{name:"baby-type-5",hexadecimal:"👶🏾"},{name:"baby-type-6",hexadecimal:"👶🏿"},{name:"baby-angel",hexadecimal:"👼"},{name:"baby-angel-type-1-2",hexadecimal:"👼🏻"},{name:"baby-angel-type-3",hexadecimal:"👼🏼"},{name:"baby-angel-type-4",hexadecimal:"👼🏽"},{name:"baby-angel-type-5",hexadecimal:"👼🏾"},{name:"baby-angel-type-6",hexadecimal:"👼🏿"},{name:"police-officer",hexadecimal:"👮"},{name:"police-officer-type-1-2",hexadecimal:"👮🏻"},{name:"police-officer-type-3",hexadecimal:"👮🏼"},{name:"police-officer-type-4",hexadecimal:"👮🏽"},{name:"police-officer-type-5",hexadecimal:"👮🏾"},{name:"police-officer-type-6",hexadecimal:"👮🏿"},{name:"sleuth-or-spy",hexadecimal:"🕵"},{name:"detective-type-1-2",hexadecimal:"🕵🏻"},{name:"detective-type-3",hexadecimal:"🕵🏼"},{name:"detective-type-4",hexadecimal:"🕵🏽"},{name:"detective-type-5",hexadecimal:"🕵🏾"},{name:"detective-type-6",hexadecimal:"🕵🏿"},{name:"guardsman",hexadecimal:"💂"},{name:"guardsman-type-1-2",hexadecimal:"💂🏻"},{name:"guardsman-type-3",hexadecimal:"💂🏼"},{name:"guardsman-type-4",hexadecimal:"💂🏽"},{name:"guardsman-type-5",hexadecimal:"💂🏾"},{name:"guardsman-type-6",hexadecimal:"💂🏿"},{name:"construction-worker",hexadecimal:"👷"},{name:"construction-worker-type-1-2",hexadecimal:"👷🏻"},{name:"construction-worker-type-3",hexadecimal:"👷🏼"},{name:"construction-worker-type-4",hexadecimal:"👷🏽"},{name:"construction-worker-type-5",hexadecimal:"👷🏾"},{name:"construction-worker-type-6",hexadecimal:"👷🏿"},{name:"man-with-turban",hexadecimal:"👳"},{name:"person-with-turban-type-1-2",hexadecimal:"👳🏻"},{name:"person-with-turban-type-3",hexadecimal:"👳🏼"},{name:"person-with-turban-type-4",hexadecimal:"👳🏽"},{name:"person-with-turban-type-5",hexadecimal:"👳🏾"},{name:"person-with-turban-type-6",hexadecimal:"👳🏿"},{name:"person-with-blond-hair",hexadecimal:"👱"},{name:"blond-person-type-1-2",hexadecimal:"👱🏻"},{name:"blond-person-type-3",hexadecimal:"👱🏼"},{name:"blond-person-type-4",hexadecimal:"👱🏽"},{name:"blond-person-type-5",hexadecimal:"👱🏾"},{name:"blond-person-type-6",hexadecimal:"👱🏿"},{name:"father-christmas",hexadecimal:"🎅"},{name:"santa-claus-type-1-2",hexadecimal:"🎅🏻"},{name:"santa-claus-type-3",hexadecimal:"🎅🏼"},{name:"santa-claus-type-4",hexadecimal:"🎅🏽"},{name:"santa-claus-type-5",hexadecimal:"🎅🏾"},{name:"santa-claus-type-6",hexadecimal:"🎅🏿"},{name:"mother-christmas",hexadecimal:"🤶"},{name:"mother-christmas-type-1-2",hexadecimal:"🤶🏻"},{name:"mother-christmas-type-3",hexadecimal:"🤶🏼"},{name:"mother-christmas-type-4",hexadecimal:"🤶🏽"},{name:"mother-christmas-type-5",hexadecimal:"🤶🏾"},{name:"mother-christmas-type-6",hexadecimal:"🤶🏿"},{name:"princess",hexadecimal:"👸"},{name:"princess-type-1-2",hexadecimal:"👸🏻"},{name:"princess-type-3",hexadecimal:"👸🏼"},{name:"princess-type-4",hexadecimal:"👸🏽"},{name:"princess-type-5",hexadecimal:"👸🏾"},{name:"princess-type-6",hexadecimal:"👸🏿"},{name:"prince",hexadecimal:"🤴"},{name:"prince-type-1-2",hexadecimal:"🤴🏻"},{name:"prince-type-3",hexadecimal:"🤴🏼"},{name:"prince-type-4",hexadecimal:"🤴🏽"},{name:"prince-type-5",hexadecimal:"🤴🏾"},{name:"prince-type-6",hexadecimal:"🤴🏿"},{name:"bride-with-veil",hexadecimal:"👰"},{name:"bride-with-veil-type-1-2",hexadecimal:"👰🏻"},{name:"bride-with-veil-type-3",hexadecimal:"👰🏼"},{name:"bride-with-veil-type-4",hexadecimal:"👰🏽"},{name:"bride-with-veil-type-5",hexadecimal:"👰🏾"},{name:"bride-with-veil-type-6",hexadecimal:"👰🏿"},{name:"man-in-tuxedo",hexadecimal:"🤵"},{name:"man-in-tuxedo-type-1-2",hexadecimal:"🤵🏻"},{name:"man-in-tuxedo-type-3",hexadecimal:"🤵🏼"},{name:"man-in-tuxedo-type-4",hexadecimal:"🤵🏽"},{name:"man-in-tuxedo-type-5",hexadecimal:"🤵🏾"},{name:"man-in-tuxedo-type-6",hexadecimal:"🤵🏿"},{name:"pregnant-woman",hexadecimal:"🤰"},{name:"pregnant-woman-type-1-2",hexadecimal:"🤰🏻"},{name:"pregnant-woman-type-3",hexadecimal:"🤰🏼"},{name:"pregnant-woman-type-4",hexadecimal:"🤰🏽"},{name:"pregnant-woman-type-5",hexadecimal:"🤰🏾"},{name:"pregnant-woman-type-6",hexadecimal:"🤰🏿"},{name:"man-with-gua-pi-mao",hexadecimal:"👲"},{name:"man-with-chinese-cap-type-1-2",hexadecimal:"👲🏻"},{name:"man-with-chinese-cap-type-3",hexadecimal:"👲🏼"},{name:"man-with-chinese-cap-type-4",hexadecimal:"👲🏽"},{name:"man-with-chinese-cap-type-5",hexadecimal:"👲🏾"},{name:"man-with-chinese-cap-type-6",hexadecimal:"👲🏿"},{name:"person-frowning",hexadecimal:"🙍"},{name:"person-frowning-type-1-2",hexadecimal:"🙍🏻"},{name:"person-frowning-type-3",hexadecimal:"🙍🏼"},{name:"person-frowning-type-4",hexadecimal:"🙍🏽"},{name:"person-frowning-type-5",hexadecimal:"🙍🏾"},{name:"person-frowning-type-6",hexadecimal:"🙍🏿"},{name:"person-with-pouting-face",hexadecimal:"🙎"},{name:"person-pouting-type-1-2",hexadecimal:"🙎🏻"},{name:"person-pouting-type-3",hexadecimal:"🙎🏼"},{name:"person-pouting-type-4",hexadecimal:"🙎🏽"},{name:"person-pouting-type-5",hexadecimal:"🙎🏾"},{name:"person-pouting-type-6",hexadecimal:"🙎🏿"},{name:"face-with-no-good-gesture",hexadecimal:"🙅"},{name:"person-gesturing-not-ok-type-1-2",hexadecimal:"🙅🏻"},{name:"person-gesturing-not-ok-type-3",hexadecimal:"🙅🏼"},{name:"person-gesturing-not-ok-type-4",hexadecimal:"🙅🏽"},{name:"person-gesturing-not-ok-type-5",hexadecimal:"🙅🏾"},{name:"person-gesturing-not-ok-type-6",hexadecimal:"🙅🏿"},{name:"face-with-ok-gesture",hexadecimal:"🙆"},{name:"person-gesturing-ok-type-1-2",hexadecimal:"🙆🏻"},{name:"person-gesturing-ok-type-3",hexadecimal:"🙆🏼"},{name:"person-gesturing-ok-type-4",hexadecimal:"🙆🏽"},{name:"person-gesturing-ok-type-5",hexadecimal:"🙆🏾"},{name:"person-gesturing-ok-type-6",hexadecimal:"🙆🏿"},{name:"information-desk-person",hexadecimal:"💁"},{name:"person-tipping-hand-type-1-2",hexadecimal:"💁🏻"},{name:"person-tipping-hand-type-3",hexadecimal:"💁🏼"},{name:"person-tipping-hand-type-4",hexadecimal:"💁🏽"},{name:"person-tipping-hand-type-5",hexadecimal:"💁🏾"},{name:"person-tipping-hand-type-6",hexadecimal:"💁🏿"},{name:"happy-person-raising-one-hand",hexadecimal:"🙋"},{name:"person-raising-hand-type-1-2",hexadecimal:"🙋🏻"},{name:"person-raising-hand-type-3",hexadecimal:"🙋🏼"},{name:"person-raising-hand-type-4",hexadecimal:"🙋🏽"},{name:"person-raising-hand-type-5",hexadecimal:"🙋🏾"},{name:"person-raising-hand-type-6",hexadecimal:"🙋🏿"},{name:"person-bowing-deeply",hexadecimal:"🙇"},{name:"person-bowing-type-1-2",hexadecimal:"🙇🏻"},{name:"person-bowing-type-3",hexadecimal:"🙇🏼"},{name:"person-bowing-type-4",hexadecimal:"🙇🏽"},{name:"person-bowing-type-5",hexadecimal:"🙇🏾"},{name:"person-bowing-type-6",hexadecimal:"🙇🏿"},{name:"face-palm",hexadecimal:"🤦"},{name:"person-facepalming-type-1-2",hexadecimal:"🤦🏻"},{name:"person-facepalming-type-3",hexadecimal:"🤦🏼"},{name:"person-facepalming-type-4",hexadecimal:"🤦🏽"},{name:"person-facepalming-type-5",hexadecimal:"🤦🏾"},{name:"person-facepalming-type-6",hexadecimal:"🤦🏿"},{name:"shrug",hexadecimal:"🤷"},{name:"person-shrugging-type-1-2",hexadecimal:"🤷🏻"},{name:"person-shrugging-type-3",hexadecimal:"🤷🏼"},{name:"person-shrugging-type-4",hexadecimal:"🤷🏽"},{name:"person-shrugging-type-5",hexadecimal:"🤷🏾"},{name:"person-shrugging-type-6",hexadecimal:"🤷🏿"},{name:"face-massage",hexadecimal:"💆"},{name:"person-getting-massage-type-1-2",hexadecimal:"💆🏻"},{name:"person-getting-massage-type-3",hexadecimal:"💆🏼"},{name:"person-getting-massage-type-4",hexadecimal:"💆🏽"},{name:"person-getting-massage-type-5",hexadecimal:"💆🏾"},{name:"person-getting-massage-type-6",hexadecimal:"💆🏿"},{name:"haircut",hexadecimal:"💇"},{name:"person-getting-haircut-type-1-2",hexadecimal:"💇🏻"},{name:"person-getting-haircut-type-3",hexadecimal:"💇🏼"},{name:"person-getting-haircut-type-4",hexadecimal:"💇🏽"},{name:"person-getting-haircut-type-5",hexadecimal:"💇🏾"},{name:"person-getting-haircut-type-6",hexadecimal:"💇🏿"},{name:"pedestrian",hexadecimal:"🚶"},{name:"person-walking-type-1-2",hexadecimal:"🚶🏻"},{name:"person-walking-type-3",hexadecimal:"🚶🏼"},{name:"person-walking-type-4",hexadecimal:"🚶🏽"},{name:"person-walking-type-5",hexadecimal:"🚶🏾"},{name:"person-walking-type-6",hexadecimal:"🚶🏿"},{name:"runner",hexadecimal:"🏃"},{name:"person-running-type-1-2",hexadecimal:"🏃🏻"},{name:"person-running-type-3",hexadecimal:"🏃🏼"},{name:"person-running-type-4",hexadecimal:"🏃🏽"},{name:"person-running-type-5",hexadecimal:"🏃🏾"},{name:"person-running-type-6",hexadecimal:"🏃🏿"},{name:"dancer",hexadecimal:"💃"},{name:"woman-dancing-type-1-2",hexadecimal:"💃🏻"},{name:"woman-dancing-type-3",hexadecimal:"💃🏼"},{name:"woman-dancing-type-4",hexadecimal:"💃🏽"},{name:"woman-dancing-type-5",hexadecimal:"💃🏾"},{name:"woman-dancing-type-6",hexadecimal:"💃🏿"},{name:"man-dancing",hexadecimal:"🕺"},{name:"man-dancing-type-1-2",hexadecimal:"🕺🏻"},{name:"man-dancing-type-3",hexadecimal:"🕺🏼"},{name:"man-dancing-type-4",hexadecimal:"🕺🏽"},{name:"man-dancing-type-5",hexadecimal:"🕺🏾"},{name:"man-dancing-type-6",hexadecimal:"🕺🏿"},{name:"woman-with-bunny-ears",hexadecimal:"👯"},{name:"man-in-business-suit-levitating",hexadecimal:"🕴"},{name:"speaking-head-in-silhouette",hexadecimal:"🗣"},{name:"bust-in-silhouette",hexadecimal:"👤"},{name:"busts-in-silhouette",hexadecimal:"👥"},{name:"man-and-woman-holding-hands",hexadecimal:"👫"},{name:"two-men-holding-hands",hexadecimal:"👬"},{name:"two-women-holding-hands",hexadecimal:"👭"},{name:"kiss",hexadecimal:"💏"},{name:"kiss-woman-man",hexadecimal:"👩‍❤️‍💋‍👨"},{name:"kiss-man-man",hexadecimal:"👨‍❤️‍💋‍👨"},{name:"kiss-woman-woman",hexadecimal:"👩‍❤️‍💋‍👩"},{name:"couple-with-heart",hexadecimal:"💑"},{name:"couple-with-heart-woman-man",hexadecimal:"👩‍❤️‍👨"},{name:"couple-with-heart-man-man",hexadecimal:"👨‍❤️‍👨"},{name:"couple-with-heart-woman-woman",hexadecimal:"👩‍❤️‍👩"},{name:"family",hexadecimal:"👪"},{name:"family-man-woman-boy",hexadecimal:"👨‍👩‍👦"},{name:"family-man-woman-girl",hexadecimal:"👨‍👩‍👧"},{name:"family-man-woman-girl-boy",hexadecimal:"👨‍👩‍👧‍👦"},{name:"family-man-woman-boy-boy",hexadecimal:"👨‍👩‍👦‍👦"},{name:"family-man-woman-girl-girl",hexadecimal:"👨‍👩‍👧‍👧"},{name:"family-man-man-boy",hexadecimal:"👨‍👨‍👦"},{name:"family-man-man-girl",hexadecimal:"👨‍👨‍👧"},{name:"family-man-man-girl-boy",hexadecimal:"👨‍👨‍👧‍👦"},{name:"family-man-man-boy-boy",hexadecimal:"👨‍👨‍👦‍👦"},{name:"family-man-man-girl-girl",hexadecimal:"👨‍👨‍👧‍👧"},{name:"family-woman-woman-boy",hexadecimal:"👩‍👩‍👦"},{name:"family-woman-woman-girl",hexadecimal:"👩‍👩‍👧"},{name:"family-woman-woman-girl-boy",hexadecimal:"👩‍👩‍👧‍👦"},{name:"family-woman-woman-boy-boy",hexadecimal:"👩‍👩‍👦‍👦"},{name:"family-woman-woman-girl-girl",hexadecimal:"👩‍👩‍👧‍👧"},{name:"emoji-modifier-fitzpatrick-type-1-2",hexadecimal:"🏻"},{name:"emoji-modifier-fitzpatrick-type-3",hexadecimal:"🏼"},{name:"emoji-modifier-fitzpatrick-type-4",hexadecimal:"🏽"},{name:"emoji-modifier-fitzpatrick-type-5",hexadecimal:"🏾"},{name:"emoji-modifier-fitzpatrick-type-6",hexadecimal:"🏿"},{name:"flexed-biceps",hexadecimal:"💪"},{name:"flexed-biceps-type-1-2",hexadecimal:"💪🏻"},{name:"flexed-biceps-type-3",hexadecimal:"💪🏼"},{name:"flexed-biceps-type-4",hexadecimal:"💪🏽"},{name:"flexed-biceps-type-5",hexadecimal:"💪🏾"},{name:"flexed-biceps-type-6",hexadecimal:"💪🏿"},{name:"selfie",hexadecimal:"🤳"},{name:"selfie-type-1-2",hexadecimal:"🤳🏻"},{name:"selfie-type-3",hexadecimal:"🤳🏼"},{name:"selfie-type-4",hexadecimal:"🤳🏽"},{name:"selfie-type-5",hexadecimal:"🤳🏾"},{name:"selfie-type-6",hexadecimal:"🤳🏿"},{name:"white-left-pointing-backhand-index",hexadecimal:"👈"},{name:"backhand-index-pointing-left-type-1-2",hexadecimal:"👈🏻"},{name:"backhand-index-pointing-left-type-3",hexadecimal:"👈🏼"},{name:"backhand-index-pointing-left-type-4",hexadecimal:"👈🏽"},{name:"backhand-index-pointing-left-type-5",hexadecimal:"👈🏾"},{name:"backhand-index-pointing-left-type-6",hexadecimal:"👈🏿"},{name:"white-right-pointing-backhand-index",hexadecimal:"👉"},{name:"backhand-index-pointing-right-type-1-2",hexadecimal:"👉🏻"},{name:"backhand-index-pointing-right-type-3",hexadecimal:"👉🏼"},{name:"backhand-index-pointing-right-type-4",hexadecimal:"👉🏽"},{name:"backhand-index-pointing-right-type-5",hexadecimal:"👉🏾"},{name:"backhand-index-pointing-right-type-6",hexadecimal:"👉🏿"},{name:"white-up-pointing-index",hexadecimal:"☝"},{name:"index-pointing-up-type-1-2",hexadecimal:"☝🏻"},{name:"index-pointing-up-type-3",hexadecimal:"☝🏼"},{name:"index-pointing-up-type-4",hexadecimal:"☝🏽"},{name:"index-pointing-up-type-5",hexadecimal:"☝🏾"},{name:"index-pointing-up-type-6",hexadecimal:"☝🏿"},{name:"white-up-pointing-backhand-index",hexadecimal:"👆"},{name:"backhand-index-pointing-up-type-1-2",hexadecimal:"👆🏻"},{name:"backhand-index-pointing-up-type-3",hexadecimal:"👆🏼"},{name:"backhand-index-pointing-up-type-4",hexadecimal:"👆🏽"},{name:"backhand-index-pointing-up-type-5",hexadecimal:"👆🏾"},{name:"backhand-index-pointing-up-type-6",hexadecimal:"👆🏿"},{name:"reversed-hand-with-middle-finger-extended",hexadecimal:"🖕"},{name:"middle-finger-type-1-2",hexadecimal:"🖕🏻"},{name:"middle-finger-type-3",hexadecimal:"🖕🏼"},{name:"middle-finger-type-4",hexadecimal:"🖕🏽"},{name:"middle-finger-type-5",hexadecimal:"🖕🏾"},{name:"middle-finger-type-6",hexadecimal:"🖕🏿"},{name:"white-down-pointing-backhand-index",hexadecimal:"👇"},{name:"backhand-index-pointing-down-type-1-2",hexadecimal:"👇🏻"},{name:"backhand-index-pointing-down-type-3",hexadecimal:"👇🏼"},{name:"backhand-index-pointing-down-type-4",hexadecimal:"👇🏽"},{name:"backhand-index-pointing-down-type-5",hexadecimal:"👇🏾"},{name:"backhand-index-pointing-down-type-6",hexadecimal:"👇🏿"},{name:"victory-hand",hexadecimal:"✌"},{name:"victory-hand-type-1-2",hexadecimal:"✌🏻"},{name:"victory-hand-type-3",hexadecimal:"✌🏼"},{name:"victory-hand-type-4",hexadecimal:"✌🏽"},{name:"victory-hand-type-5",hexadecimal:"✌🏾"},{name:"victory-hand-type-6",hexadecimal:"✌🏿"},{name:"hand-with-index-and-middle-fingers-crossed",hexadecimal:"🤞"},{name:"crossed-fingers-type-1-2",hexadecimal:"🤞🏻"},{name:"crossed-fingers-type-3",hexadecimal:"🤞🏼"},{name:"crossed-fingers-type-4",hexadecimal:"🤞🏽"},{name:"crossed-fingers-type-5",hexadecimal:"🤞🏾"},{name:"crossed-fingers-type-6",hexadecimal:"🤞🏿"},{name:"raised-hand-with-part-between-middle-and-ring-fingers",hexadecimal:"🖖"},{name:"vulcan-salute-type-1-2",hexadecimal:"🖖🏻"},{name:"vulcan-salute-type-3",hexadecimal:"🖖🏼"},{name:"vulcan-salute-type-4",hexadecimal:"🖖🏽"},{name:"vulcan-salute-type-5",hexadecimal:"🖖🏾"},{name:"vulcan-salute-type-6",hexadecimal:"🖖🏿"},{name:"sign-of-the-horns",hexadecimal:"🤘"},{name:"sign-of-the-horns-type-1-2",hexadecimal:"🤘🏻"},{name:"sign-of-the-horns-type-3",hexadecimal:"🤘🏼"},{name:"sign-of-the-horns-type-4",hexadecimal:"🤘🏽"},{name:"sign-of-the-horns-type-5",hexadecimal:"🤘🏾"},{name:"sign-of-the-horns-type-6",hexadecimal:"🤘🏿"},{name:"call-me-hand",hexadecimal:"🤙"},{name:"call-me-hand-type-1-2",hexadecimal:"🤙🏻"},{name:"call-me-hand-type-3",hexadecimal:"🤙🏼"},{name:"call-me-hand-type-4",hexadecimal:"🤙🏽"},{name:"call-me-hand-type-5",hexadecimal:"🤙🏾"},{name:"call-me-hand-type-6",hexadecimal:"🤙🏿"},{name:"raised-hand-with-fingers-splayed",hexadecimal:"🖐"},{name:"raised-hand-with-fingers-splayed-type-1-2",hexadecimal:"🖐🏻"},{name:"raised-hand-with-fingers-splayed-type-3",hexadecimal:"🖐🏼"},{name:"raised-hand-with-fingers-splayed-type-4",hexadecimal:"🖐🏽"},{name:"raised-hand-with-fingers-splayed-type-5",hexadecimal:"🖐🏾"},{name:"raised-hand-with-fingers-splayed-type-6",hexadecimal:"🖐🏿"},{name:"raised-hand",hexadecimal:"✋"},{name:"raised-hand-type-1-2",hexadecimal:"✋🏻"},{name:"raised-hand-type-3",hexadecimal:"✋🏼"},{name:"raised-hand-type-4",hexadecimal:"✋🏽"},{name:"raised-hand-type-5",hexadecimal:"✋🏾"},{name:"raised-hand-type-6",hexadecimal:"✋🏿"},{name:"ok-hand-sign",hexadecimal:"👌"},{name:"ok-hand-type-1-2",hexadecimal:"👌🏻"},{name:"ok-hand-type-3",hexadecimal:"👌🏼"},{name:"ok-hand-type-4",hexadecimal:"👌🏽"},{name:"ok-hand-type-5",hexadecimal:"👌🏾"},{name:"ok-hand-type-6",hexadecimal:"👌🏿"},{name:"thumbs-up-sign",hexadecimal:"👍"},{name:"thumbs-up-type-1-2",hexadecimal:"👍🏻"},{name:"thumbs-up-type-3",hexadecimal:"👍🏼"},{name:"thumbs-up-type-4",hexadecimal:"👍🏽"},{name:"thumbs-up-type-5",hexadecimal:"👍🏾"},{name:"thumbs-up-type-6",hexadecimal:"👍🏿"},{name:"thumbs-down-sign",hexadecimal:"👎"},{name:"thumbs-down-type-1-2",hexadecimal:"👎🏻"},{name:"thumbs-down-type-3",hexadecimal:"👎🏼"},{name:"thumbs-down-type-4",hexadecimal:"👎🏽"},{name:"thumbs-down-type-5",hexadecimal:"👎🏾"},{name:"thumbs-down-type-6",hexadecimal:"👎🏿"},{name:"raised-fist",hexadecimal:"✊"},{name:"raised-fist-type-1-2",hexadecimal:"✊🏻"},{name:"raised-fist-type-3",hexadecimal:"✊🏼"},{name:"raised-fist-type-4",hexadecimal:"✊🏽"},{name:"raised-fist-type-5",hexadecimal:"✊🏾"},{name:"raised-fist-type-6",hexadecimal:"✊🏿"},{name:"fisted-hand-sign",hexadecimal:"👊"},{name:"oncoming-fist-type-1-2",hexadecimal:"👊🏻"},{name:"oncoming-fist-type-3",hexadecimal:"👊🏼"},{name:"oncoming-fist-type-4",hexadecimal:"👊🏽"},{name:"oncoming-fist-type-5",hexadecimal:"👊🏾"},{name:"oncoming-fist-type-6",hexadecimal:"👊🏿"},{name:"left-facing-fist",hexadecimal:"🤛"},{name:"left-facing-fist-type-1-2",hexadecimal:"🤛🏻"},{name:"left-facing-fist-type-3",hexadecimal:"🤛🏼"},{name:"left-facing-fist-type-4",hexadecimal:"🤛🏽"},{name:"left-facing-fist-type-5",hexadecimal:"🤛🏾"},{name:"left-facing-fist-type-6",hexadecimal:"🤛🏿"},{name:"right-facing-fist",hexadecimal:"🤜"},{name:"right-facing-fist-type-1-2",hexadecimal:"🤜🏻"},{name:"right-facing-fist-type-3",hexadecimal:"🤜🏼"},{name:"right-facing-fist-type-4",hexadecimal:"🤜🏽"},{name:"right-facing-fist-type-5",hexadecimal:"🤜🏾"},{name:"right-facing-fist-type-6",hexadecimal:"🤜🏿"},{name:"raised-back-of-hand",hexadecimal:"🤚"},{name:"raised-back-of-hand-type-1-2",hexadecimal:"🤚🏻"},{name:"raised-back-of-hand-type-3",hexadecimal:"🤚🏼"},{name:"raised-back-of-hand-type-4",hexadecimal:"🤚🏽"},{name:"raised-back-of-hand-type-5",hexadecimal:"🤚🏾"},{name:"raised-back-of-hand-type-6",hexadecimal:"🤚🏿"},{name:"waving-hand-sign",hexadecimal:"👋"},{name:"waving-hand-type-1-2",hexadecimal:"👋🏻"},{name:"waving-hand-type-3",hexadecimal:"👋🏼"},{name:"waving-hand-type-4",hexadecimal:"👋🏽"},{name:"waving-hand-type-5",hexadecimal:"👋🏾"},{name:"waving-hand-type-6",hexadecimal:"👋🏿"},{name:"clapping-hands-sign",hexadecimal:"👏"},{name:"clapping-hands-type-1-2",hexadecimal:"👏🏻"},{name:"clapping-hands-type-3",hexadecimal:"👏🏼"},{name:"clapping-hands-type-4",hexadecimal:"👏🏽"},{name:"clapping-hands-type-5",hexadecimal:"👏🏾"},{name:"clapping-hands-type-6",hexadecimal:"👏🏿"},{name:"writing-hand",hexadecimal:"✍"},{name:"writing-hand-type-1-2",hexadecimal:"✍🏻"},{name:"writing-hand-type-3",hexadecimal:"✍🏼"},{name:"writing-hand-type-4",hexadecimal:"✍🏽"},{name:"writing-hand-type-5",hexadecimal:"✍🏾"},{name:"writing-hand-type-6",hexadecimal:"✍🏿"},{name:"open-hands-sign",hexadecimal:"👐"},{name:"open-hands-type-1-2",hexadecimal:"👐🏻"},{name:"open-hands-type-3",hexadecimal:"👐🏼"},{name:"open-hands-type-4",hexadecimal:"👐🏽"},{name:"open-hands-type-5",hexadecimal:"👐🏾"},{name:"open-hands-type-6",hexadecimal:"👐🏿"},{name:"person-raising-both-hands-in-celebration",hexadecimal:"🙌"},{name:"person-raising-hands-type-1-2",hexadecimal:"🙌🏻"},{name:"person-raising-hands-type-3",hexadecimal:"🙌🏼"},{name:"person-raising-hands-type-4",hexadecimal:"🙌🏽"},{name:"person-raising-hands-type-5",hexadecimal:"🙌🏾"},{name:"person-raising-hands-type-6",hexadecimal:"🙌🏿"},{name:"person-with-folded-hands",hexadecimal:"🙏"},{name:"folded-hands-type-1-2",hexadecimal:"🙏🏻"},{name:"folded-hands-type-3",hexadecimal:"🙏🏼"},{name:"folded-hands-type-4",hexadecimal:"🙏🏽"},{name:"folded-hands-type-5",hexadecimal:"🙏🏾"},{name:"folded-hands-type-6",hexadecimal:"🙏🏿"},{name:"handshake",hexadecimal:"🤝"},{name:"handshake-type-1-2",hexadecimal:"🤝🏻"},{name:"handshake-type-3",hexadecimal:"🤝🏼"},{name:"handshake-type-4",hexadecimal:"🤝🏽"},{name:"handshake-type-5",hexadecimal:"🤝🏾"},{name:"handshake-type-6",hexadecimal:"🤝🏿"},{name:"nail-polish",hexadecimal:"💅"},{name:"nail-polish-type-1-2",hexadecimal:"💅🏻"},{name:"nail-polish-type-3",hexadecimal:"💅🏼"},{name:"nail-polish-type-4",hexadecimal:"💅🏽"},{name:"nail-polish-type-5",hexadecimal:"💅🏾"},{name:"nail-polish-type-6",hexadecimal:"💅🏿"},{name:"ear",hexadecimal:"👂"},{name:"ear-type-1-2",hexadecimal:"👂🏻"},{name:"ear-type-3",hexadecimal:"👂🏼"},{name:"ear-type-4",hexadecimal:"👂🏽"},{name:"ear-type-5",hexadecimal:"👂🏾"},{name:"ear-type-6",hexadecimal:"👂🏿"},{name:"nose",hexadecimal:"👃"},{name:"nose-type-1-2",hexadecimal:"👃🏻"},{name:"nose-type-3",hexadecimal:"👃🏼"},{name:"nose-type-4",hexadecimal:"👃🏽"},{name:"nose-type-5",hexadecimal:"👃🏾"},{name:"nose-type-6",hexadecimal:"👃🏿"},{name:"footprints",hexadecimal:"👣"},{name:"eyes",hexadecimal:"👀"},{name:"eye",hexadecimal:"👁"},{name:"eye-left-speech-bubble",hexadecimal:"👁‍🗨"},{name:"tongue",hexadecimal:"👅"},{name:"mouth",hexadecimal:"👄"},{name:"kiss-mark",hexadecimal:"💋"},{name:"heart-with-arrow",hexadecimal:"💘"},{name:"heavy-black-heart",hexadecimal:"❤"},{name:"beating-heart",hexadecimal:"💓"},{name:"broken-heart",hexadecimal:"💔"},{name:"two-hearts",hexadecimal:"💕"},{name:"sparkling-heart",hexadecimal:"💖"},{name:"growing-heart",hexadecimal:"💗"},{name:"blue-heart",hexadecimal:"💙"},{name:"green-heart",hexadecimal:"💚"},{name:"yellow-heart",hexadecimal:"💛"},{name:"purple-heart",hexadecimal:"💜"},{name:"black-heart",hexadecimal:"🖤"},{name:"heart-with-ribbon",hexadecimal:"💝"},{name:"revolving-hearts",hexadecimal:"💞"},{name:"heart-decoration",hexadecimal:"💟"},{name:"heavy-heart-exclamation-mark-ornament",hexadecimal:"❣"},{name:"love-letter",hexadecimal:"💌"},{name:"sleeping-symbol",hexadecimal:"💤"},{name:"anger-symbol",hexadecimal:"💢"},{name:"bomb",hexadecimal:"💣"},{name:"collision-symbol",hexadecimal:"💥"},{name:"splashing-sweat-symbol",hexadecimal:"💦"},{name:"dash-symbol",hexadecimal:"💨"},{name:"dizzy-symbol",hexadecimal:"💫"},{name:"speech-balloon",hexadecimal:"💬"},{name:"left-speech-bubble",hexadecimal:"🗨"},{name:"right-anger-bubble",hexadecimal:"🗯"},{name:"thought-balloon",hexadecimal:"💭"},{name:"hole",hexadecimal:"🕳"},{name:"eyeglasses",hexadecimal:"👓"},{name:"dark-sunglasses",hexadecimal:"🕶"},{name:"necktie",hexadecimal:"👔"},{name:"t-shirt",hexadecimal:"👕"},{name:"jeans",hexadecimal:"👖"},{name:"dress",hexadecimal:"👗"},{name:"kimono",hexadecimal:"👘"},{name:"bikini",hexadecimal:"👙"},{name:"womans-clothes",hexadecimal:"👚"},{name:"purse",hexadecimal:"👛"},{name:"handbag",hexadecimal:"👜"},{name:"pouch",hexadecimal:"👝"},{name:"shopping-bags",hexadecimal:"🛍"},{name:"school-satchel",hexadecimal:"🎒"},{name:"mans-shoe",hexadecimal:"👞"},{name:"athletic-shoe",hexadecimal:"👟"},{name:"high-heeled-shoe",hexadecimal:"👠"},{name:"womans-sandal",hexadecimal:"👡"},{name:"womans-boots",hexadecimal:"👢"},{name:"crown",hexadecimal:"👑"},{name:"womans-hat",hexadecimal:"👒"},{name:"top-hat",hexadecimal:"🎩"},{name:"graduation-cap",hexadecimal:"🎓"},{name:"helmet-with-white-cross",hexadecimal:"⛑"},{name:"prayer-beads",hexadecimal:"📿"},{name:"lipstick",hexadecimal:"💄"},{name:"ring",hexadecimal:"💍"},{name:"gem-stone",hexadecimal:"💎"},{name:"monkey-face",hexadecimal:"🐵"},{name:"monkey",hexadecimal:"🐒"},{name:"gorilla",hexadecimal:"🦍"},{name:"dog-face",hexadecimal:"🐶"},{name:"dog",hexadecimal:"🐕"},{name:"poodle",hexadecimal:"🐩"},{name:"wolf-face",hexadecimal:"🐺"},{name:"fox-face",hexadecimal:"🦊"},{name:"cat-face",hexadecimal:"🐱"},{name:"cat",hexadecimal:"🐈"},{name:"lion-face",hexadecimal:"🦁"},{name:"tiger-face",hexadecimal:"🐯"},{name:"tiger",hexadecimal:"🐅"},{name:"leopard",hexadecimal:"🐆"},{name:"horse-face",hexadecimal:"🐴"},{name:"horse",hexadecimal:"🐎"},{name:"deer",hexadecimal:"🦌"},{name:"unicorn-face",hexadecimal:"🦄"},{name:"cow-face",hexadecimal:"🐮"},{name:"ox",hexadecimal:"🐂"},{name:"water-buffalo",hexadecimal:"🐃"},{name:"cow",hexadecimal:"🐄"},{name:"pig-face",hexadecimal:"🐷"},{name:"pig",hexadecimal:"🐖"},{name:"boar",hexadecimal:"🐗"},{name:"pig-nose",hexadecimal:"🐽"},{name:"ram",hexadecimal:"🐏"},{name:"sheep",hexadecimal:"🐑"},{name:"goat",hexadecimal:"🐐"},{name:"dromedary-camel",hexadecimal:"🐪"},{name:"bactrian-camel",hexadecimal:"🐫"},{name:"elephant",hexadecimal:"🐘"},{name:"rhinoceros",hexadecimal:"🦏"},{name:"mouse-face",hexadecimal:"🐭"},{name:"mouse",hexadecimal:"🐁"},{name:"rat",hexadecimal:"🐀"},{name:"hamster-face",hexadecimal:"🐹"},{name:"rabbit-face",hexadecimal:"🐰"},{name:"rabbit",hexadecimal:"🐇"},{name:"chipmunk",hexadecimal:"🐿"},{name:"bat",hexadecimal:"🦇"},{name:"bear-face",hexadecimal:"🐻"},{name:"koala",hexadecimal:"🐨"},{name:"panda-face",hexadecimal:"🐼"},{name:"paw-prints",hexadecimal:"🐾"},{name:"turkey",hexadecimal:"🦃"},{name:"chicken",hexadecimal:"🐔"},{name:"rooster",hexadecimal:"🐓"},{name:"hatching-chick",hexadecimal:"🐣"},{name:"baby-chick",hexadecimal:"🐤"},{name:"front-facing-baby-chick",hexadecimal:"🐥"},{name:"bird",hexadecimal:"🐦"},{name:"penguin",hexadecimal:"🐧"},{name:"dove-of-peace",hexadecimal:"🕊"},{name:"eagle",hexadecimal:"🦅"},{name:"duck",hexadecimal:"🦆"},{name:"owl",hexadecimal:"🦉"},{name:"frog-face",hexadecimal:"🐸"},{name:"crocodile",hexadecimal:"🐊"},{name:"turtle",hexadecimal:"🐢"},{name:"lizard",hexadecimal:"🦎"},{name:"snake",hexadecimal:"🐍"},{name:"dragon-face",hexadecimal:"🐲"},{name:"dragon",hexadecimal:"🐉"},{name:"spouting-whale",hexadecimal:"🐳"},{name:"whale",hexadecimal:"🐋"},{name:"dolphin",hexadecimal:"🐬"},{name:"fish",hexadecimal:"🐟"},{name:"tropical-fish",hexadecimal:"🐠"},{name:"blowfish",hexadecimal:"🐡"},{name:"shark",hexadecimal:"🦈"},{name:"octopus",hexadecimal:"🐙"},{name:"spiral-shell",hexadecimal:"🐚"},{name:"crab",hexadecimal:"🦀"},{name:"shrimp",hexadecimal:"🦐"},{name:"squid",hexadecimal:"🦑"},{name:"butterfly",hexadecimal:"🦋"},{name:"snail",hexadecimal:"🐌"},{name:"bug",hexadecimal:"🐛"},{name:"ant",hexadecimal:"🐜"},{name:"honeybee",hexadecimal:"🐝"},{name:"lady-beetle",hexadecimal:"🐞"},{name:"spider",hexadecimal:"🕷"},{name:"spider-web",hexadecimal:"🕸"},{name:"scorpion",hexadecimal:"🦂"},{name:"bouquet",hexadecimal:"💐"},{name:"cherry-blossom",hexadecimal:"🌸"},{name:"white-flower",hexadecimal:"💮"},{name:"rosette",hexadecimal:"🏵"},{name:"rose",hexadecimal:"🌹"},{name:"wilted-flower",hexadecimal:"🥀"},{name:"hibiscus",hexadecimal:"🌺"},{name:"sunflower",hexadecimal:"🌻"},{name:"blossom",hexadecimal:"🌼"},{name:"tulip",hexadecimal:"🌷"},{name:"seedling",hexadecimal:"🌱"},{name:"evergreen-tree",hexadecimal:"🌲"},{name:"deciduous-tree",hexadecimal:"🌳"},{name:"palm-tree",hexadecimal:"🌴"},{name:"cactus",hexadecimal:"🌵"},{name:"ear-of-rice",hexadecimal:"🌾"},{name:"herb",hexadecimal:"🌿"},{name:"shamrock",hexadecimal:"☘"},{name:"four-leaf-clover",hexadecimal:"🍀"},{name:"maple-leaf",hexadecimal:"🍁"},{name:"fallen-leaf",hexadecimal:"🍂"},{name:"leaf-fluttering-in-wind",hexadecimal:"🍃"},{name:"grapes",hexadecimal:"🍇"},{name:"melon",hexadecimal:"🍈"},{name:"watermelon",hexadecimal:"🍉"},{name:"tangerine",hexadecimal:"🍊"},{name:"lemon",hexadecimal:"🍋"},{name:"banana",hexadecimal:"🍌"},{name:"pineapple",hexadecimal:"🍍"},{name:"red-apple",hexadecimal:"🍎"},{name:"green-apple",hexadecimal:"🍏"},{name:"pear",hexadecimal:"🍐"},{name:"peach",hexadecimal:"🍑"},{name:"cherries",hexadecimal:"🍒"},{name:"strawberry",hexadecimal:"🍓"},{name:"kiwifruit",hexadecimal:"🥝"},{name:"tomato",hexadecimal:"🍅"},{name:"avocado",hexadecimal:"🥑"},{name:"aubergine",hexadecimal:"🍆"},{name:"potato",hexadecimal:"🥔"},{name:"carrot",hexadecimal:"🥕"},{name:"ear-of-maize",hexadecimal:"🌽"},{name:"hot-pepper",hexadecimal:"🌶"},{name:"cucumber",hexadecimal:"🥒"},{name:"mushroom",hexadecimal:"🍄"},{name:"peanuts",hexadecimal:"🥜"},{name:"chestnut",hexadecimal:"🌰"},{name:"bread",hexadecimal:"🍞"},{name:"croissant",hexadecimal:"🥐"},{name:"baguette-bread",hexadecimal:"🥖"},{name:"pancakes",hexadecimal:"🥞"},{name:"cheese-wedge",hexadecimal:"🧀"},{name:"meat-on-bone",hexadecimal:"🍖"},{name:"poultry-leg",hexadecimal:"🍗"},{name:"bacon",hexadecimal:"🥓"},{name:"hamburger",hexadecimal:"🍔"},{name:"french-fries",hexadecimal:"🍟"},{name:"slice-of-pizza",hexadecimal:"🍕"},{name:"hot-dog",hexadecimal:"🌭"},{name:"taco",hexadecimal:"🌮"},{name:"burrito",hexadecimal:"🌯"},{name:"stuffed-flatbread",hexadecimal:"🥙"},{name:"egg",hexadecimal:"🥚"},{name:"cooking",hexadecimal:"🍳"},{name:"shallow-pan-of-food",hexadecimal:"🥘"},{name:"pot-of-food",hexadecimal:"🍲"},{name:"green-salad",hexadecimal:"🥗"},{name:"popcorn",hexadecimal:"🍿"},{name:"bento-box",hexadecimal:"🍱"},{name:"rice-cracker",hexadecimal:"🍘"},{name:"rice-ball",hexadecimal:"🍙"},{name:"cooked-rice",hexadecimal:"🍚"},{name:"curry-and-rice",hexadecimal:"🍛"},{name:"steaming-bowl",hexadecimal:"🍜"},{name:"spaghetti",hexadecimal:"🍝"},{name:"roasted-sweet-potato",hexadecimal:"🍠"},{name:"oden",hexadecimal:"🍢"},{name:"sushi",hexadecimal:"🍣"},{name:"fried-shrimp",hexadecimal:"🍤"},{name:"fish-cake-with-swirl-design",hexadecimal:"🍥"},{name:"dango",hexadecimal:"🍡"},{name:"soft-ice-cream",hexadecimal:"🍦"},{name:"shaved-ice",hexadecimal:"🍧"},{name:"ice-cream",hexadecimal:"🍨"},{name:"doughnut",hexadecimal:"🍩"},{name:"cookie",hexadecimal:"🍪"},{name:"birthday-cake",hexadecimal:"🎂"},{name:"shortcake",hexadecimal:"🍰"},{name:"chocolate-bar",hexadecimal:"🍫"},{name:"candy",hexadecimal:"🍬"},{name:"lollipop",hexadecimal:"🍭"},{name:"custard",hexadecimal:"🍮"},{name:"honey-pot",hexadecimal:"🍯"},{name:"baby-bottle",hexadecimal:"🍼"},{name:"glass-of-milk",hexadecimal:"🥛"},{name:"hot-beverage",hexadecimal:"☕"},{name:"teacup-without-handle",hexadecimal:"🍵"},{name:"sake-bottle-and-cup",hexadecimal:"🍶"},{name:"bottle-with-popping-cork",hexadecimal:"🍾"},{name:"wine-glass",hexadecimal:"🍷"},{name:"cocktail-glass",hexadecimal:"🍸"},{name:"tropical-drink",hexadecimal:"🍹"},{name:"beer-mug",hexadecimal:"🍺"},{name:"clinking-beer-mugs",hexadecimal:"🍻"},{name:"clinking-glasses",hexadecimal:"🥂"},{name:"tumbler-glass",hexadecimal:"🥃"},{name:"fork-and-knife-with-plate",hexadecimal:"🍽"},{name:"fork-and-knife",hexadecimal:"🍴"},{name:"spoon",hexadecimal:"🥄"},{name:"hocho",hexadecimal:"🔪"},{name:"amphora",hexadecimal:"🏺"},{name:"earth-globe-europe-africa",hexadecimal:"🌍"},{name:"earth-globe-americas",hexadecimal:"🌎"},{name:"earth-globe-asia-australia",hexadecimal:"🌏"},{name:"globe-with-meridians",hexadecimal:"🌐"},{name:"world-map",hexadecimal:"🗺"},{name:"silhouette-of-japan",hexadecimal:"🗾"},{name:"snow-capped-mountain",hexadecimal:"🏔"},{name:"mountain",hexadecimal:"⛰"},{name:"volcano",hexadecimal:"🌋"},{name:"mount-fuji",hexadecimal:"🗻"},{name:"camping",hexadecimal:"🏕"},{name:"beach-with-umbrella",hexadecimal:"🏖"},{name:"desert",hexadecimal:"🏜"},{name:"desert-island",hexadecimal:"🏝"},{name:"national-park",hexadecimal:"🏞"},{name:"stadium",hexadecimal:"🏟"},{name:"classical-building",hexadecimal:"🏛"},{name:"building-construction",hexadecimal:"🏗"},{name:"house-buildings",hexadecimal:"🏘"},{name:"cityscape",hexadecimal:"🏙"},{name:"derelict-house-building",hexadecimal:"🏚"},{name:"house-building",hexadecimal:"🏠"},{name:"house-with-garden",hexadecimal:"🏡"},{name:"office-building",hexadecimal:"🏢"},{name:"japanese-post-office",hexadecimal:"🏣"},{name:"european-post-office",hexadecimal:"🏤"},{name:"hospital",hexadecimal:"🏥"},{name:"bank",hexadecimal:"🏦"},{name:"hotel",hexadecimal:"🏨"},{name:"love-hotel",hexadecimal:"🏩"},{name:"convenience-store",hexadecimal:"🏪"},{name:"school",hexadecimal:"🏫"},{name:"department-store",hexadecimal:"🏬"},{name:"factory",hexadecimal:"🏭"},{name:"japanese-castle",hexadecimal:"🏯"},{name:"european-castle",hexadecimal:"🏰"},{name:"wedding",hexadecimal:"💒"},{name:"tokyo-tower",hexadecimal:"🗼"},{name:"statue-of-liberty",hexadecimal:"🗽"},{name:"church",hexadecimal:"⛪"},{name:"mosque",hexadecimal:"🕌"},{name:"synagogue",hexadecimal:"🕍"},{name:"shinto-shrine",hexadecimal:"⛩"},{name:"kaaba",hexadecimal:"🕋"},{name:"fountain",hexadecimal:"⛲"},{name:"tent",hexadecimal:"⛺"},{name:"foggy",hexadecimal:"🌁"},{name:"night-with-stars",hexadecimal:"🌃"},{name:"sunrise-over-mountains",hexadecimal:"🌄"},{name:"sunrise",hexadecimal:"🌅"},{name:"cityscape-at-dusk",hexadecimal:"🌆"},{name:"sunset-over-buildings",hexadecimal:"🌇"},{name:"bridge-at-night",hexadecimal:"🌉"},{name:"hot-springs",hexadecimal:"♨"},{name:"milky-way",hexadecimal:"🌌"},{name:"carousel-horse",hexadecimal:"🎠"},{name:"ferris-wheel",hexadecimal:"🎡"},{name:"roller-coaster",hexadecimal:"🎢"},{name:"barber-pole",hexadecimal:"💈"},{name:"circus-tent",hexadecimal:"🎪"},{name:"performing-arts",hexadecimal:"🎭"},{name:"frame-with-picture",hexadecimal:"🖼"},{name:"artist-palette",hexadecimal:"🎨"},{name:"slot-machine",hexadecimal:"🎰"},{name:"steam-locomotive",hexadecimal:"🚂"},{name:"railway-car",hexadecimal:"🚃"},{name:"high-speed-train",hexadecimal:"🚄"},{name:"high-speed-train-with-bullet-nose",hexadecimal:"🚅"},{name:"train",hexadecimal:"🚆"},{name:"metro",hexadecimal:"🚇"},{name:"light-rail",hexadecimal:"🚈"},{name:"station",hexadecimal:"🚉"},{name:"tram",hexadecimal:"🚊"},{name:"monorail",hexadecimal:"🚝"},{name:"mountain-railway",hexadecimal:"🚞"},{name:"tram-car",hexadecimal:"🚋"},{name:"bus",hexadecimal:"🚌"},{name:"oncoming-bus",hexadecimal:"🚍"},{name:"trolleybus",hexadecimal:"🚎"},{name:"minibus",hexadecimal:"🚐"},{name:"ambulance",hexadecimal:"🚑"},{name:"fire-engine",hexadecimal:"🚒"},{name:"police-car",hexadecimal:"🚓"},{name:"oncoming-police-car",hexadecimal:"🚔"},{name:"taxi",hexadecimal:"🚕"},{name:"oncoming-taxi",hexadecimal:"🚖"},{name:"automobile",hexadecimal:"🚗"},{name:"oncoming-automobile",hexadecimal:"🚘"},{name:"recreational-vehicle",hexadecimal:"🚙"},{name:"delivery-truck",hexadecimal:"🚚"},{name:"articulated-lorry",hexadecimal:"🚛"},{name:"tractor",hexadecimal:"🚜"},{name:"bicycle",hexadecimal:"🚲"},{name:"scooter",hexadecimal:"🛴"},{name:"motor-scooter",hexadecimal:"🛵"},{name:"racing-car",hexadecimal:"🏎"},{name:"racing-motorcycle",hexadecimal:"🏍"},{name:"bus-stop",hexadecimal:"🚏"},{name:"motorway",hexadecimal:"🛣"},{name:"railway-track",hexadecimal:"🛤"},{name:"fuel-pump",hexadecimal:"⛽"},{name:"police-cars-revolving-light",hexadecimal:"🚨"},{name:"horizontal-traffic-light",hexadecimal:"🚥"},{name:"vertical-traffic-light",hexadecimal:"🚦"},{name:"construction-sign",hexadecimal:"🚧"},{name:"octagonal-sign",hexadecimal:"🛑"},{name:"anchor",hexadecimal:"⚓"},{name:"sailboat",hexadecimal:"⛵"},{name:"canoe",hexadecimal:"🛶"},{name:"speedboat",hexadecimal:"🚤"},{name:"passenger-ship",hexadecimal:"🛳"},{name:"ferry",hexadecimal:"⛴"},{name:"motor-boat",hexadecimal:"🛥"},{name:"ship",hexadecimal:"🚢"},{name:"airplane",hexadecimal:"✈"},{name:"small-airplane",hexadecimal:"🛩"},{name:"airplane-departure",hexadecimal:"🛫"},{name:"airplane-arriving",hexadecimal:"🛬"},{name:"seat",hexadecimal:"💺"},{name:"helicopter",hexadecimal:"🚁"},{name:"suspension-railway",hexadecimal:"🚟"},{name:"mountain-cableway",hexadecimal:"🚠"},{name:"aerial-tramway",hexadecimal:"🚡"},{name:"rocket",hexadecimal:"🚀"},{name:"satellite",hexadecimal:"🛰"},{name:"bellhop-bell",hexadecimal:"🛎"},{name:"door",hexadecimal:"🚪"},{name:"sleeping-accommodation",hexadecimal:"🛌"},{name:"bed",hexadecimal:"🛏"},{name:"couch-and-lamp",hexadecimal:"🛋"},{name:"toilet",hexadecimal:"🚽"},{name:"shower",hexadecimal:"🚿"},{name:"bath",hexadecimal:"🛀"},{name:"person-taking-bath-type-1-2",hexadecimal:"🛀🏻"},{name:"person-taking-bath-type-3",hexadecimal:"🛀🏼"},{name:"person-taking-bath-type-4",hexadecimal:"🛀🏽"},{name:"person-taking-bath-type-5",hexadecimal:"🛀🏾"},{name:"person-taking-bath-type-6",hexadecimal:"🛀🏿"},{name:"bathtub",hexadecimal:"🛁"},{name:"hourglass",hexadecimal:"⌛"},{name:"hourglass-with-flowing-sand",hexadecimal:"⏳"},{name:"watch",hexadecimal:"⌚"},{name:"alarm-clock",hexadecimal:"⏰"},{name:"stopwatch",hexadecimal:"⏱"},{name:"timer-clock",hexadecimal:"⏲"},{name:"mantelpiece-clock",hexadecimal:"🕰"},{name:"clock-face-twelve-oclock",hexadecimal:"🕛"},{name:"clock-face-twelve-thirty",hexadecimal:"🕧"},{name:"clock-face-one-oclock",hexadecimal:"🕐"},{name:"clock-face-one-thirty",hexadecimal:"🕜"},{name:"clock-face-two-oclock",hexadecimal:"🕑"},{name:"clock-face-two-thirty",hexadecimal:"🕝"},{name:"clock-face-three-oclock",hexadecimal:"🕒"},{name:"clock-face-three-thirty",hexadecimal:"🕞"},{name:"clock-face-four-oclock",hexadecimal:"🕓"},{name:"clock-face-four-thirty",hexadecimal:"🕟"},{name:"clock-face-five-oclock",hexadecimal:"🕔"},{name:"clock-face-five-thirty",hexadecimal:"🕠"},{name:"clock-face-six-oclock",hexadecimal:"🕕"},{name:"clock-face-six-thirty",hexadecimal:"🕡"},{name:"clock-face-seven-oclock",hexadecimal:"🕖"},{name:"clock-face-seven-thirty",hexadecimal:"🕢"},{name:"clock-face-eight-oclock",hexadecimal:"🕗"},{name:"clock-face-eight-thirty",hexadecimal:"🕣"},{name:"clock-face-nine-oclock",hexadecimal:"🕘"},{name:"clock-face-nine-thirty",hexadecimal:"🕤"},{name:"clock-face-ten-oclock",hexadecimal:"🕙"},{name:"clock-face-ten-thirty",hexadecimal:"🕥"},{name:"clock-face-eleven-oclock",hexadecimal:"🕚"},{name:"clock-face-eleven-thirty",hexadecimal:"🕦"},{name:"new-moon-symbol",hexadecimal:"🌑"},{name:"waxing-crescent-moon-symbol",hexadecimal:"🌒"},{name:"first-quarter-moon-symbol",hexadecimal:"🌓"},{name:"waxing-gibbous-moon-symbol",hexadecimal:"🌔"},{name:"full-moon-symbol",hexadecimal:"🌕"},{name:"waning-gibbous-moon-symbol",hexadecimal:"🌖"},{name:"last-quarter-moon-symbol",hexadecimal:"🌗"},{name:"waning-crescent-moon-symbol",hexadecimal:"🌘"},{name:"crescent-moon",hexadecimal:"🌙"},{name:"new-moon-with-face",hexadecimal:"🌚"},{name:"first-quarter-moon-with-face",hexadecimal:"🌛"},{name:"last-quarter-moon-with-face",hexadecimal:"🌜"},{name:"thermometer",hexadecimal:"🌡"},{name:"black-sun-with-rays",hexadecimal:"☀"},{name:"full-moon-with-face",hexadecimal:"🌝"},{name:"sun-with-face",hexadecimal:"🌞"},{name:"white-medium-star",hexadecimal:"⭐"},{name:"glowing-star",hexadecimal:"🌟"},{name:"shooting-star",hexadecimal:"🌠"},{name:"cloud",hexadecimal:"☁"},{name:"sun-behind-cloud",hexadecimal:"⛅"},{name:"thunder-cloud-and-rain",hexadecimal:"⛈"},{name:"white-sun-with-small-cloud",hexadecimal:"🌤"},{name:"white-sun-behind-cloud",hexadecimal:"🌥"},{name:"white-sun-behind-cloud-with-rain",hexadecimal:"🌦"},{name:"cloud-with-rain",hexadecimal:"🌧"},{name:"cloud-with-snow",hexadecimal:"🌨"},{name:"cloud-with-lightning",hexadecimal:"🌩"},{name:"cloud-with-tornado",hexadecimal:"🌪"},{name:"fog",hexadecimal:"🌫"},{name:"wind-blowing-face",hexadecimal:"🌬"},{name:"cyclone",hexadecimal:"🌀"},{name:"rainbow",hexadecimal:"🌈"},{name:"closed-umbrella",hexadecimal:"🌂"},{name:"umbrella",hexadecimal:"☂"},{name:"umbrella-with-rain-drops",hexadecimal:"☔"},{name:"umbrella-on-ground",hexadecimal:"⛱"},{name:"high-voltage-sign",hexadecimal:"⚡"},{name:"snowflake",hexadecimal:"❄"},{name:"snowman",hexadecimal:"☃"},{name:"snowman-without-snow",hexadecimal:"⛄"},{name:"comet",hexadecimal:"☄"},{name:"fire",hexadecimal:"🔥"},{name:"droplet",hexadecimal:"💧"},{name:"water-wave",hexadecimal:"🌊"},{name:"jack-o-lantern",hexadecimal:"🎃"},{name:"christmas-tree",hexadecimal:"🎄"},{name:"fireworks",hexadecimal:"🎆"},{name:"firework-sparkler",hexadecimal:"🎇"},{name:"sparkles",hexadecimal:"✨"},{name:"balloon",hexadecimal:"🎈"},{name:"party-popper",hexadecimal:"🎉"},{name:"confetti-ball",hexadecimal:"🎊"},{name:"tanabata-tree",hexadecimal:"🎋"},{name:"pine-decoration",hexadecimal:"🎍"},{name:"japanese-dolls",hexadecimal:"🎎"},{name:"carp-streamer",hexadecimal:"🎏"},{name:"wind-chime",hexadecimal:"🎐"},{name:"moon-viewing-ceremony",hexadecimal:"🎑"},{name:"ribbon",hexadecimal:"🎀"},{name:"wrapped-present",hexadecimal:"🎁"},{name:"reminder-ribbon",hexadecimal:"🎗"},{name:"admission-tickets",hexadecimal:"🎟"},{name:"ticket",hexadecimal:"🎫"},{name:"military-medal",hexadecimal:"🎖"},{name:"trophy",hexadecimal:"🏆"},{name:"sports-medal",hexadecimal:"🏅"},{name:"first-place-medal",hexadecimal:"🥇"},{name:"second-place-medal",hexadecimal:"🥈"},{name:"third-place-medal",hexadecimal:"🥉"},{name:"soccer-ball",hexadecimal:"⚽"},{name:"baseball",hexadecimal:"⚾"},{name:"basketball-and-hoop",hexadecimal:"🏀"},{name:"volleyball",hexadecimal:"🏐"},{name:"american-football",hexadecimal:"🏈"},{name:"rugby-football",hexadecimal:"🏉"},{name:"tennis-racquet-and-ball",hexadecimal:"🎾"},{name:"billiards",hexadecimal:"🎱"},{name:"bowling",hexadecimal:"🎳"},{name:"cricket-bat-and-ball",hexadecimal:"🏏"},{name:"field-hockey-stick-and-ball",hexadecimal:"🏑"},{name:"ice-hockey-stick-and-puck",hexadecimal:"🏒"},{name:"table-tennis-paddle-and-ball",hexadecimal:"🏓"},{name:"badminton-racquet-and-shuttlecock",hexadecimal:"🏸"},{name:"boxing-glove",hexadecimal:"🥊"},{name:"martial-arts-uniform",hexadecimal:"🥋"},{name:"goal-net",hexadecimal:"🥅"},{name:"direct-hit",hexadecimal:"🎯"},{name:"flag-in-hole",hexadecimal:"⛳"},{name:"ice-skate",hexadecimal:"⛸"},{name:"fishing-pole-and-fish",hexadecimal:"🎣"},{name:"running-shirt-with-sash",hexadecimal:"🎽"},{name:"ski-and-ski-boot",hexadecimal:"🎿"},{name:"fencer",hexadecimal:"🤺"},{name:"horse-racing",hexadecimal:"🏇"},{name:"skier",hexadecimal:"⛷"},{name:"snowboarder",hexadecimal:"🏂"},{name:"golfer",hexadecimal:"🏌"},{name:"surfer",hexadecimal:"🏄"},{name:"person-surfing-type-1-2",hexadecimal:"🏄🏻"},{name:"person-surfing-type-3",hexadecimal:"🏄🏼"},{name:"person-surfing-type-4",hexadecimal:"🏄🏽"},{name:"person-surfing-type-5",hexadecimal:"🏄🏾"},{name:"person-surfing-type-6",hexadecimal:"🏄🏿"},{name:"rowboat",hexadecimal:"🚣"},{name:"person-rowing-boat-type-1-2",hexadecimal:"🚣🏻"},{name:"person-rowing-boat-type-3",hexadecimal:"🚣🏼"},{name:"person-rowing-boat-type-4",hexadecimal:"🚣🏽"},{name:"person-rowing-boat-type-5",hexadecimal:"🚣🏾"},{name:"person-rowing-boat-type-6",hexadecimal:"🚣🏿"},{name:"swimmer",hexadecimal:"🏊"},{name:"person-swimming-type-1-2",hexadecimal:"🏊🏻"},{name:"person-swimming-type-3",hexadecimal:"🏊🏼"},{name:"person-swimming-type-4",hexadecimal:"🏊🏽"},{name:"person-swimming-type-5",hexadecimal:"🏊🏾"},{name:"person-swimming-type-6",hexadecimal:"🏊🏿"},{name:"person-with-ball",hexadecimal:"⛹"},{name:"person-with-ball-type-1-2",hexadecimal:"⛹🏻"},{name:"person-with-ball-type-3",hexadecimal:"⛹🏼"},{name:"person-with-ball-type-4",hexadecimal:"⛹🏽"},{name:"person-with-ball-type-5",hexadecimal:"⛹🏾"},{name:"person-with-ball-type-6",hexadecimal:"⛹🏿"},{name:"weight-lifter",hexadecimal:"🏋"},{name:"person-weight-lifting-type-1-2",hexadecimal:"🏋🏻"},{name:"person-weight-lifting-type-3",hexadecimal:"🏋🏼"},{name:"person-weight-lifting-type-4",hexadecimal:"🏋🏽"},{name:"person-weight-lifting-type-5",hexadecimal:"🏋🏾"},{name:"person-weight-lifting-type-6",hexadecimal:"🏋🏿"},{name:"bicyclist",hexadecimal:"🚴"},{name:"person-biking-type-1-2",hexadecimal:"🚴🏻"},{name:"person-biking-type-3",hexadecimal:"🚴🏼"},{name:"person-biking-type-4",hexadecimal:"🚴🏽"},{name:"person-biking-type-5",hexadecimal:"🚴🏾"},{name:"person-biking-type-6",hexadecimal:"🚴🏿"},{name:"mountain-bicyclist",hexadecimal:"🚵"},{name:"person-mountain-biking-type-1-2",hexadecimal:"🚵🏻"},{name:"person-mountain-biking-type-3",hexadecimal:"🚵🏼"},{name:"person-mountain-biking-type-4",hexadecimal:"🚵🏽"},{name:"person-mountain-biking-type-5",hexadecimal:"🚵🏾"},{name:"person-mountain-biking-type-6",hexadecimal:"🚵🏿"},{name:"person-doing-cartwheel",hexadecimal:"🤸"},{name:"person-doing-cartwheel-type-1-2",hexadecimal:"🤸🏻"},{name:"person-doing-cartwheel-type-3",hexadecimal:"🤸🏼"},{name:"person-doing-cartwheel-type-4",hexadecimal:"🤸🏽"},{name:"person-doing-cartwheel-type-5",hexadecimal:"🤸🏾"},{name:"person-doing-cartwheel-type-6",hexadecimal:"🤸🏿"},{name:"wrestlers",hexadecimal:"🤼"},{name:"people-wrestling-type-1-2",hexadecimal:"🤼🏻"},{name:"people-wrestling-type-3",hexadecimal:"🤼🏼"},{name:"people-wrestling-type-4",hexadecimal:"🤼🏽"},{name:"people-wrestling-type-5",hexadecimal:"🤼🏾"},{name:"people-wrestling-type-6",hexadecimal:"🤼🏿"},{name:"water-polo",hexadecimal:"🤽"},{name:"person-playing-water-polo-type-1-2",hexadecimal:"🤽🏻"},{name:"person-playing-water-polo-type-3",hexadecimal:"🤽🏼"},{name:"person-playing-water-polo-type-4",hexadecimal:"🤽🏽"},{name:"person-playing-water-polo-type-5",hexadecimal:"🤽🏾"},{name:"person-playing-water-polo-type-6",hexadecimal:"🤽🏿"},{name:"handball",hexadecimal:"🤾"},{name:"person-playing-handball-type-1-2",hexadecimal:"🤾🏻"},{name:"person-playing-handball-type-3",hexadecimal:"🤾🏼"},{name:"person-playing-handball-type-4",hexadecimal:"🤾🏽"},{name:"person-playing-handball-type-5",hexadecimal:"🤾🏾"},{name:"person-playing-handball-type-6",hexadecimal:"🤾🏿"},{name:"juggling",hexadecimal:"🤹"},{name:"person-juggling-type-1-2",hexadecimal:"🤹🏻"},{name:"person-juggling-type-3",hexadecimal:"🤹🏼"},{name:"person-juggling-type-4",hexadecimal:"🤹🏽"},{name:"person-juggling-type-5",hexadecimal:"🤹🏾"},{name:"person-juggling-type-6",hexadecimal:"🤹🏿"},{name:"video-game",hexadecimal:"🎮"},{name:"joystick",hexadecimal:"🕹"},{name:"game-die",hexadecimal:"🎲"},{name:"black-spade-suit",hexadecimal:"♠"},{name:"black-heart-suit",hexadecimal:"♥"},{name:"black-diamond-suit",hexadecimal:"♦"},{name:"black-club-suit",hexadecimal:"♣"},{name:"playing-card-black-joker",hexadecimal:"🃏"},{name:"mahjong-tile-red-dragon",hexadecimal:"🀄"},{name:"flower-playing-cards",hexadecimal:"🎴"},{name:"speaker-with-cancellation-stroke",hexadecimal:"🔇"},{name:"speaker",hexadecimal:"🔈"},{name:"speaker-with-one-sound-wave",hexadecimal:"🔉"},{name:"speaker-with-three-sound-waves",hexadecimal:"🔊"},{name:"public-address-loudspeaker",hexadecimal:"📢"},{name:"cheering-megaphone",hexadecimal:"📣"},{name:"postal-horn",hexadecimal:"📯"},{name:"bell",hexadecimal:"🔔"},{name:"bell-with-cancellation-stroke",hexadecimal:"🔕"},{name:"musical-score",hexadecimal:"🎼"},{name:"musical-note",hexadecimal:"🎵"},{name:"multiple-musical-notes",hexadecimal:"🎶"},{name:"studio-microphone",hexadecimal:"🎙"},{name:"level-slider",hexadecimal:"🎚"},{name:"control-knobs",hexadecimal:"🎛"},{name:"microphone",hexadecimal:"🎤"},{name:"headphone",hexadecimal:"🎧"},{name:"radio",hexadecimal:"📻"},{name:"saxophone",hexadecimal:"🎷"},{name:"guitar",hexadecimal:"🎸"},{name:"musical-keyboard",hexadecimal:"🎹"},{name:"trumpet",hexadecimal:"🎺"},{name:"violin",hexadecimal:"🎻"},{name:"drum-with-drumsticks",hexadecimal:"🥁"},{name:"mobile-phone",hexadecimal:"📱"},{name:"mobile-phone-with-rightwards-arrow-at-left",hexadecimal:"📲"},{name:"black-telephone",hexadecimal:"☎"},{name:"telephone-receiver",hexadecimal:"📞"},{name:"pager",hexadecimal:"📟"},{name:"fax-machine",hexadecimal:"📠"},{name:"battery",hexadecimal:"🔋"},{name:"electric-plug",hexadecimal:"🔌"},{name:"personal-computer",hexadecimal:"💻"},{name:"desktop-computer",hexadecimal:"🖥"},{name:"printer",hexadecimal:"🖨"},{name:"keyboard",hexadecimal:"⌨"},{name:"three-button-mouse",hexadecimal:"🖱"},{name:"trackball",hexadecimal:"🖲"},{name:"minidisc",hexadecimal:"💽"},{name:"floppy-disk",hexadecimal:"💾"},{name:"optical-disc",hexadecimal:"💿"},{name:"dvd",hexadecimal:"📀"},{name:"movie-camera",hexadecimal:"🎥"},{name:"film-frames",hexadecimal:"🎞"},{name:"film-projector",hexadecimal:"📽"},{name:"clapper-board",hexadecimal:"🎬"},{name:"television",hexadecimal:"📺"},{name:"camera",hexadecimal:"📷"},{name:"camera-with-flash",hexadecimal:"📸"},{name:"video-camera",hexadecimal:"📹"},{name:"videocassette",hexadecimal:"📼"},{name:"left-pointing-magnifying-glass",hexadecimal:"🔍"},{name:"right-pointing-magnifying-glass",hexadecimal:"🔎"},{name:"microscope",hexadecimal:"🔬"},{name:"telescope",hexadecimal:"🔭"},{name:"satellite-antenna",hexadecimal:"📡"},{name:"candle",hexadecimal:"🕯"},{name:"electric-light-bulb",hexadecimal:"💡"},{name:"electric-torch",hexadecimal:"🔦"},{name:"izakaya-lantern",hexadecimal:"🏮"},{name:"notebook-with-decorative-cover",hexadecimal:"📔"},{name:"closed-book",hexadecimal:"📕"},{name:"open-book",hexadecimal:"📖"},{name:"green-book",hexadecimal:"📗"},{name:"blue-book",hexadecimal:"📘"},{name:"orange-book",hexadecimal:"📙"},{name:"books",hexadecimal:"📚"},{name:"notebook",hexadecimal:"📓"},{name:"ledger",hexadecimal:"📒"},{name:"page-with-curl",hexadecimal:"📃"},{name:"scroll",hexadecimal:"📜"},{name:"page-facing-up",hexadecimal:"📄"},{name:"newspaper",hexadecimal:"📰"},{name:"rolled-up-newspaper",hexadecimal:"🗞"},{name:"bookmark-tabs",hexadecimal:"📑"},{name:"bookmark",hexadecimal:"🔖"},{name:"label",hexadecimal:"🏷"},{name:"money-bag",hexadecimal:"💰"},{name:"banknote-with-yen-sign",hexadecimal:"💴"},{name:"banknote-with-dollar-sign",hexadecimal:"💵"},{name:"banknote-with-euro-sign",hexadecimal:"💶"},{name:"banknote-with-pound-sign",hexadecimal:"💷"},{name:"money-with-wings",hexadecimal:"💸"},{name:"credit-card",hexadecimal:"💳"},{name:"chart-with-upwards-trend-and-yen-sign",hexadecimal:"💹"},{name:"currency-exchange",hexadecimal:"💱"},{name:"heavy-dollar-sign",hexadecimal:"💲"},{name:"envelope",hexadecimal:"✉"},{name:"e-mail-symbol",hexadecimal:"📧"},{name:"incoming-envelope",hexadecimal:"📨"},{name:"envelope-with-downwards-arrow-above",hexadecimal:"📩"},{name:"outbox-tray",hexadecimal:"📤"},{name:"inbox-tray",hexadecimal:"📥"},{name:"package",hexadecimal:"📦"},{name:"closed-mailbox-with-raised-flag",hexadecimal:"📫"},{name:"closed-mailbox-with-lowered-flag",hexadecimal:"📪"},{name:"open-mailbox-with-raised-flag",hexadecimal:"📬"},{name:"open-mailbox-with-lowered-flag",hexadecimal:"📭"},{name:"postbox",hexadecimal:"📮"},{name:"ballot-box-with-ballot",hexadecimal:"🗳"},{name:"pencil",hexadecimal:"✏"},{name:"black-nib",hexadecimal:"✒"},{name:"lower-left-fountain-pen",hexadecimal:"🖋"},{name:"lower-left-ballpoint-pen",hexadecimal:"🖊"},{name:"lower-left-paintbrush",hexadecimal:"🖌"},{name:"lower-left-crayon",hexadecimal:"🖍"},{name:"memo",hexadecimal:"📝"},{name:"briefcase",hexadecimal:"💼"},{name:"file-folder",hexadecimal:"📁"},{name:"open-file-folder",hexadecimal:"📂"},{name:"card-index-dividers",hexadecimal:"🗂"},{name:"calendar",hexadecimal:"📅"},{name:"tear-off-calendar",hexadecimal:"📆"},{name:"spiral-note-pad",hexadecimal:"🗒"},{name:"spiral-calendar-pad",hexadecimal:"🗓"},{name:"card-index",hexadecimal:"📇"},{name:"chart-with-upwards-trend",hexadecimal:"📈"},{name:"chart-with-downwards-trend",hexadecimal:"📉"},{name:"bar-chart",hexadecimal:"📊"},{name:"clipboard",hexadecimal:"📋"},{name:"pushpin",hexadecimal:"📌"},{name:"round-pushpin",hexadecimal:"📍"},{name:"paperclip",hexadecimal:"📎"},{name:"linked-paperclips",hexadecimal:"🖇"},{name:"straight-ruler",hexadecimal:"📏"},{name:"triangular-ruler",hexadecimal:"📐"},{name:"black-scissors",hexadecimal:"✂"},{name:"card-file-box",hexadecimal:"🗃"},{name:"file-cabinet",hexadecimal:"🗄"},{name:"wastebasket",hexadecimal:"🗑"},{name:"lock",hexadecimal:"🔒"},{name:"open-lock",hexadecimal:"🔓"},{name:"lock-with-ink-pen",hexadecimal:"🔏"},{name:"closed-lock-with-key",hexadecimal:"🔐"},{name:"key",hexadecimal:"🔑"},{name:"old-key",hexadecimal:"🗝"},{name:"hammer",hexadecimal:"🔨"},{name:"pick",hexadecimal:"⛏"},{name:"hammer-and-pick",hexadecimal:"⚒"},{name:"hammer-and-wrench",hexadecimal:"🛠"},{name:"dagger-knife",hexadecimal:"🗡"},{name:"crossed-swords",hexadecimal:"⚔"},{name:"pistol",hexadecimal:"🔫"},{name:"bow-and-arrow",hexadecimal:"🏹"},{name:"shield",hexadecimal:"🛡"},{name:"wrench",hexadecimal:"🔧"},{name:"nut-and-bolt",hexadecimal:"🔩"},{name:"gear",hexadecimal:"⚙"},{name:"compression",hexadecimal:"🗜"},{name:"alembic",hexadecimal:"⚗"},{name:"scales",hexadecimal:"⚖"},{name:"link-symbol",hexadecimal:"🔗"},{name:"chains",hexadecimal:"⛓"},{name:"syringe",hexadecimal:"💉"},{name:"pill",hexadecimal:"💊"},{name:"smoking-symbol",hexadecimal:"🚬"},{name:"coffin",hexadecimal:"⚰"},{name:"funeral-urn",hexadecimal:"⚱"},{name:"moyai",hexadecimal:"🗿"},{name:"oil-drum",hexadecimal:"🛢"},{name:"crystal-ball",hexadecimal:"🔮"},{name:"shopping-trolley",hexadecimal:"🛒"},{name:"automated-teller-machine",hexadecimal:"🏧"},{name:"put-litter-in-its-place-symbol",hexadecimal:"🚮"},{name:"potable-water-symbol",hexadecimal:"🚰"},{name:"wheelchair-symbol",hexadecimal:"♿"},{name:"mens-symbol",hexadecimal:"🚹"},{name:"womens-symbol",hexadecimal:"🚺"},{name:"restroom",hexadecimal:"🚻"},{name:"baby-symbol",hexadecimal:"🚼"},{name:"water-closet",hexadecimal:"🚾"},{name:"passport-control",hexadecimal:"🛂"},{name:"customs",hexadecimal:"🛃"},{name:"baggage-claim",hexadecimal:"🛄"},{name:"left-luggage",hexadecimal:"🛅"},{name:"warning-sign",hexadecimal:"⚠"},{name:"children-crossing",hexadecimal:"🚸"},{name:"no-entry",hexadecimal:"⛔"},{name:"no-entry-sign",hexadecimal:"🚫"},{name:"no-bicycles",hexadecimal:"🚳"},{name:"no-smoking-symbol",hexadecimal:"🚭"},{name:"do-not-litter-symbol",hexadecimal:"🚯"},{name:"non-potable-water-symbol",hexadecimal:"🚱"},{name:"no-pedestrians",hexadecimal:"🚷"},{name:"no-mobile-phones",hexadecimal:"📵"},{name:"no-one-under-eighteen-symbol",hexadecimal:"🔞"},{name:"radioactive-sign",hexadecimal:"☢"},{name:"biohazard-sign",hexadecimal:"☣"},{name:"upwards-black-arrow",hexadecimal:"⬆"},{name:"north-east-arrow",hexadecimal:"↗"},{name:"black-rightwards-arrow",hexadecimal:"➡"},{name:"south-east-arrow",hexadecimal:"↘"},{name:"downwards-black-arrow",hexadecimal:"⬇"},{name:"south-west-arrow",hexadecimal:"↙"},{name:"leftwards-black-arrow",hexadecimal:"⬅"},{name:"north-west-arrow",hexadecimal:"↖"},{name:"up-down-arrow",hexadecimal:"↕"},{name:"left-right-arrow",hexadecimal:"↔"},{name:"leftwards-arrow-with-hook",hexadecimal:"↩"},{name:"rightwards-arrow-with-hook",hexadecimal:"↪"},{name:"arrow-pointing-rightwards-then-curving-upwards",hexadecimal:"⤴"},{name:"arrow-pointing-rightwards-then-curving-downwards",hexadecimal:"⤵"},{name:"clockwise-downwards-and-upwards-open-circle-arrows",hexadecimal:"🔃"},{name:"anticlockwise-downwards-and-upwards-open-circle-arrows",hexadecimal:"🔄"},{name:"back-with-leftwards-arrow-above",hexadecimal:"🔙"},{name:"end-with-leftwards-arrow-above",hexadecimal:"🔚"},{name:"on-with-exclamation-mark-with-left-right-arrow-above",hexadecimal:"🔛"},{name:"soon-with-rightwards-arrow-above",hexadecimal:"🔜"},{name:"top-with-upwards-arrow-above",hexadecimal:"🔝"},{name:"place-of-worship",hexadecimal:"🛐"},{name:"atom-symbol",hexadecimal:"⚛"},{name:"om-symbol",hexadecimal:"🕉"},{name:"star-of-david",hexadecimal:"✡"},{name:"wheel-of-dharma",hexadecimal:"☸"},{name:"yin-yang",hexadecimal:"☯"},{name:"latin-cross",hexadecimal:"✝"},{name:"orthodox-cross",hexadecimal:"☦"},{name:"star-and-crescent",hexadecimal:"☪"},{name:"peace-symbol",hexadecimal:"☮"},{name:"menorah-with-nine-branches",hexadecimal:"🕎"},{name:"six-pointed-star-with-middle-dot",hexadecimal:"🔯"},{name:"black-universal-recycling-symbol",hexadecimal:"♻"},{name:"name-badge",hexadecimal:"📛"},{name:"fleur-de-lis",hexadecimal:"⚜"},{name:"japanese-symbol-for-beginner",hexadecimal:"🔰"},{name:"trident-emblem",hexadecimal:"🔱"},{name:"heavy-large-circle",hexadecimal:"⭕"},{name:"white-heavy-check-mark",hexadecimal:"✅"},{name:"ballot-box-with-check",hexadecimal:"☑"},{name:"heavy-check-mark",hexadecimal:"✔"},{name:"heavy-multiplication-x",hexadecimal:"✖"},{name:"cross-mark",hexadecimal:"❌"},{name:"negative-squared-cross-mark",hexadecimal:"❎"},{name:"heavy-plus-sign",hexadecimal:"➕"},{name:"heavy-minus-sign",hexadecimal:"➖"},{name:"heavy-division-sign",hexadecimal:"➗"},{name:"curly-loop",hexadecimal:"➰"},{name:"double-curly-loop",hexadecimal:"➿"},{name:"part-alternation-mark",hexadecimal:"〽"},{name:"eight-spoked-asterisk",hexadecimal:"✳"},{name:"eight-pointed-black-star",hexadecimal:"✴"},{name:"sparkle",hexadecimal:"❇"},{name:"double-exclamation-mark",hexadecimal:"‼"},{name:"exclamation-question-mark",hexadecimal:"⁉"},{name:"black-question-mark-ornament",hexadecimal:"❓"},{name:"white-question-mark-ornament",hexadecimal:"❔"},{name:"white-exclamation-mark-ornament",hexadecimal:"❕"},{name:"heavy-exclamation-mark-symbol",hexadecimal:"❗"},{name:"wavy-dash",hexadecimal:"〰"},{name:"copyright-sign",hexadecimal:"©"},{name:"registered-sign",hexadecimal:"®"},{name:"trade-mark-sign",hexadecimal:"™"},{name:"aries",hexadecimal:"♈"},{name:"taurus",hexadecimal:"♉"},{name:"gemini",hexadecimal:"♊"},{name:"cancer",hexadecimal:"♋"},{name:"leo",hexadecimal:"♌"},{name:"virgo",hexadecimal:"♍"},{name:"libra",hexadecimal:"♎"},{name:"scorpius",hexadecimal:"♏"},{name:"sagittarius",hexadecimal:"♐"},{name:"capricorn",hexadecimal:"♑"},{name:"aquarius",hexadecimal:"♒"},{name:"pisces",hexadecimal:"♓"},{name:"ophiuchus",hexadecimal:"⛎"},{name:"twisted-rightwards-arrows",hexadecimal:"🔀"},{name:"clockwise-rightwards-and-leftwards-open-circle-arrows",hexadecimal:"🔁"},{name:"clockwise-rightwards-and-leftwards-open-circle-arrows-with-circled-one-overlay",hexadecimal:"🔂"},{name:"black-right-pointing-triangle",hexadecimal:"▶"},{name:"black-right-pointing-double-triangle",hexadecimal:"⏩"},{name:"black-right-pointing-double-triangle-with-vertical-bar",hexadecimal:"⏭"},{name:"black-right-pointing-triangle-with-double-vertical-bar",hexadecimal:"⏯"},{name:"black-left-pointing-triangle",hexadecimal:"◀"},{name:"black-left-pointing-double-triangle",hexadecimal:"⏪"},{name:"black-left-pointing-double-triangle-with-vertical-bar",hexadecimal:"⏮"},{name:"up-pointing-small-red-triangle",hexadecimal:"🔼"},{name:"black-up-pointing-double-triangle",hexadecimal:"⏫"},{name:"down-pointing-small-red-triangle",hexadecimal:"🔽"},{name:"black-down-pointing-double-triangle",hexadecimal:"⏬"},{name:"double-vertical-bar",hexadecimal:"⏸"},{name:"black-square-for-stop",hexadecimal:"⏹"},{name:"black-circle-for-record",hexadecimal:"⏺"},{name:"eject-symbol",hexadecimal:"⏏"},{name:"cinema",hexadecimal:"🎦"},{name:"low-brightness-symbol",hexadecimal:"🔅"},{name:"high-brightness-symbol",hexadecimal:"🔆"},{name:"antenna-with-bars",hexadecimal:"📶"},{name:"vibration-mode",hexadecimal:"📳"},{name:"mobile-phone-off",hexadecimal:"📴"},{name:"keycap-#",hexadecimal:"#️⃣"},{name:"keycap-*",hexadecimal:"*️⃣"},{name:"keycap-0",hexadecimal:"0️⃣"},{name:"keycap-1",hexadecimal:"1️⃣"},{name:"keycap-2",hexadecimal:"2️⃣"},{name:"keycap-3",hexadecimal:"3️⃣"},{name:"keycap-4",hexadecimal:"4️⃣"},{name:"keycap-5",hexadecimal:"5️⃣"},{name:"keycap-6",hexadecimal:"6️⃣"},{name:"keycap-7",hexadecimal:"7️⃣"},{name:"keycap-8",hexadecimal:"8️⃣"},{name:"keycap-9",hexadecimal:"9️⃣"},{name:"keycap-ten",hexadecimal:"🔟"},{name:"hundred-points-symbol",hexadecimal:"💯"},{name:"input-symbol-for-latin-capital-letters",hexadecimal:"🔠"},{name:"input-symbol-for-latin-small-letters",hexadecimal:"🔡"},{name:"input-symbol-for-numbers",hexadecimal:"🔢"},{name:"input-symbol-for-symbols",hexadecimal:"🔣"},{name:"input-symbol-for-latin-letters",hexadecimal:"🔤"},{name:"negative-squared-latin-capital-letter-a",hexadecimal:"🅰"},{name:"negative-squared-ab",hexadecimal:"🆎"},{name:"negative-squared-latin-capital-letter-b",hexadecimal:"🅱"},{name:"squared-cl",hexadecimal:"🆑"},{name:"squared-cool",hexadecimal:"🆒"},{name:"squared-free",hexadecimal:"🆓"},{name:"information-source",hexadecimal:"ℹ"},{name:"squared-id",hexadecimal:"🆔"},{name:"circled-latin-capital-letter-m",hexadecimal:"Ⓜ"},{name:"squared-new",hexadecimal:"🆕"},{name:"squared-ng",hexadecimal:"🆖"},{name:"negative-squared-latin-capital-letter-o",hexadecimal:"🅾"},{name:"squared-ok",hexadecimal:"🆗"},{name:"negative-squared-latin-capital-letter-p",hexadecimal:"🅿"},{name:"squared-sos",hexadecimal:"🆘"},{name:"squared-up-with-exclamation-mark",hexadecimal:"🆙"},{name:"squared-vs",hexadecimal:"🆚"},{name:"squared-katakana-koko",hexadecimal:"🈁"},{name:"squared-katakana-sa",hexadecimal:"🈂"},{name:"squared-cjk-unified-ideograph-6708",hexadecimal:"🈷"},{name:"squared-cjk-unified-ideograph-6709",hexadecimal:"🈶"},{name:"squared-cjk-unified-ideograph-6307",hexadecimal:"🈯"},{name:"circled-ideograph-advantage",hexadecimal:"🉐"},{name:"squared-cjk-unified-ideograph-5272",hexadecimal:"🈹"},{name:"squared-cjk-unified-ideograph-7121",hexadecimal:"🈚"},{name:"squared-cjk-unified-ideograph-7981",hexadecimal:"🈲"},{name:"circled-ideograph-accept",hexadecimal:"🉑"},{name:"squared-cjk-unified-ideograph-7533",hexadecimal:"🈸"},{name:"squared-cjk-unified-ideograph-5408",hexadecimal:"🈴"},{name:"squared-cjk-unified-ideograph-7a7a",hexadecimal:"🈳"},{name:"circled-ideograph-congratulation",hexadecimal:"㊗"},{name:"circled-ideograph-secret",hexadecimal:"㊙"},{name:"squared-cjk-unified-ideograph-55b6",hexadecimal:"🈺"},{name:"squared-cjk-unified-ideograph-6e80",hexadecimal:"🈵"},{name:"black-small-square",hexadecimal:"▪"},{name:"white-small-square",hexadecimal:"▫"},{name:"white-medium-square",hexadecimal:"◻"},{name:"black-medium-square",hexadecimal:"◼"},{name:"white-medium-small-square",hexadecimal:"◽"},{name:"black-medium-small-square",hexadecimal:"◾"},{name:"black-large-square",hexadecimal:"⬛"},{name:"white-large-square",hexadecimal:"⬜"},{name:"large-orange-diamond",hexadecimal:"🔶"},{name:"large-blue-diamond",hexadecimal:"🔷"},{name:"small-orange-diamond",hexadecimal:"🔸"},{name:"small-blue-diamond",hexadecimal:"🔹"},{name:"up-pointing-red-triangle",hexadecimal:"🔺"},{name:"down-pointing-red-triangle",hexadecimal:"🔻"},{name:"diamond-shape-with-a-dot-inside",hexadecimal:"💠"},{name:"radio-button",hexadecimal:"🔘"},{name:"black-square-button",hexadecimal:"🔲"},{name:"white-square-button",hexadecimal:"🔳"},{name:"medium-white-circle",hexadecimal:"⚪"},{name:"medium-black-circle",hexadecimal:"⚫"},{name:"large-red-circle",hexadecimal:"🔴"},{name:"large-blue-circle",hexadecimal:"🔵"},{name:"chequered-flag",hexadecimal:"🏁"},{name:"triangular-flag-on-post",hexadecimal:"🚩"},{name:"crossed-flags",hexadecimal:"🎌"},{name:"waving-black-flag",hexadecimal:"🏴"},{name:"waving-white-flag",hexadecimal:"🏳"},{name:"ascension-island",hexadecimal:"🇦🇨"},{name:"andorra",hexadecimal:"🇦🇩"},{name:"united-arab-emirates",hexadecimal:"🇦🇪"},{name:"afghanistan",hexadecimal:"🇦🇫"},{name:"antigua-&-barbuda",hexadecimal:"🇦🇬"},{name:"anguilla",hexadecimal:"🇦🇮"},{name:"albania",hexadecimal:"🇦🇱"},{name:"armenia",hexadecimal:"🇦🇲"},{name:"angola",hexadecimal:"🇦🇴"},{name:"antarctica",hexadecimal:"🇦🇶"},{name:"argentina",hexadecimal:"🇦🇷"},{name:"american-samoa",hexadecimal:"🇦🇸"},{name:"austria",hexadecimal:"🇦🇹"},{name:"australia",hexadecimal:"🇦🇺"},{name:"aruba",hexadecimal:"🇦🇼"},{name:"ã…land-islands",hexadecimal:"🇦🇽"},{name:"azerbaijan",hexadecimal:"🇦🇿"},{name:"bosnia-&-herzegovina",hexadecimal:"🇧🇦"},{name:"barbados",hexadecimal:"🇧🇧"},{name:"bangladesh",hexadecimal:"🇧🇩"},{name:"belgium",hexadecimal:"🇧🇪"},{name:"burkina-faso",hexadecimal:"🇧🇫"},{name:"bulgaria",hexadecimal:"🇧🇬"},{name:"bahrain",hexadecimal:"🇧🇭"},{name:"burundi",hexadecimal:"🇧🇮"},{name:"benin",hexadecimal:"🇧🇯"},{name:"st.-barthã©lemy",hexadecimal:"🇧🇱"},{name:"bermuda",hexadecimal:"🇧🇲"},{name:"brunei",hexadecimal:"🇧🇳"},{name:"bolivia",hexadecimal:"🇧🇴"},{name:"caribbean-netherlands",hexadecimal:"🇧🇶"},{name:"brazil",hexadecimal:"🇧🇷"},{name:"bahamas",hexadecimal:"🇧🇸"},{name:"bhutan",hexadecimal:"🇧🇹"},{name:"bouvet-island",hexadecimal:"🇧🇻"},{name:"botswana",hexadecimal:"🇧🇼"},{name:"belarus",hexadecimal:"🇧🇾"},{name:"belize",hexadecimal:"🇧🇿"},{name:"canada",hexadecimal:"🇨🇦"},{name:"cocos-(keeling)-islands",hexadecimal:"🇨🇨"},{name:"congo-kinshasa",hexadecimal:"🇨🇩"},{name:"central-african-republic",hexadecimal:"🇨🇫"},{name:"congo-brazzaville",hexadecimal:"🇨🇬"},{name:"switzerland",hexadecimal:"🇨🇭"},{name:"cã´te-d’ivoire",hexadecimal:"🇨🇮"},{name:"cook-islands",hexadecimal:"🇨🇰"},{name:"chile",hexadecimal:"🇨🇱"},{name:"cameroon",hexadecimal:"🇨🇲"},{name:"china",hexadecimal:"🇨🇳"},{name:"colombia",hexadecimal:"🇨🇴"},{name:"clipperton-island",hexadecimal:"🇨🇵"},{name:"costa-rica",hexadecimal:"🇨🇷"},{name:"cuba",hexadecimal:"🇨🇺"},{name:"cape-verde",hexadecimal:"🇨🇻"},{name:"curaã§ao",hexadecimal:"🇨🇼"},{name:"christmas-island",hexadecimal:"🇨🇽"},{name:"cyprus",hexadecimal:"🇨🇾"},{name:"czech-republic",hexadecimal:"🇨🇿"},{name:"germany",hexadecimal:"🇩🇪"},{name:"diego-garcia",hexadecimal:"🇩🇬"},{name:"djibouti",hexadecimal:"🇩🇯"},{name:"denmark",hexadecimal:"🇩🇰"},{name:"dominica",hexadecimal:"🇩🇲"},{name:"dominican-republic",hexadecimal:"🇩🇴"},{name:"algeria",hexadecimal:"🇩🇿"},{name:"ceuta-&-melilla",hexadecimal:"🇪🇦"},{name:"ecuador",hexadecimal:"🇪🇨"},{name:"estonia",hexadecimal:"🇪🇪"},{name:"egypt",hexadecimal:"🇪🇬"},{name:"western-sahara",hexadecimal:"🇪🇭"},{name:"eritrea",hexadecimal:"🇪🇷"},{name:"spain",hexadecimal:"🇪🇸"},{name:"ethiopia",hexadecimal:"🇪🇹"},{name:"european-union",hexadecimal:"🇪🇺"},{name:"finland",hexadecimal:"🇫🇮"},{name:"fiji",hexadecimal:"🇫🇯"},{name:"falkland-islands",hexadecimal:"🇫🇰"},{name:"micronesia",hexadecimal:"🇫🇲"},{name:"faroe-islands",hexadecimal:"🇫🇴"},{name:"france",hexadecimal:"🇫🇷"},{name:"gabon",hexadecimal:"🇬🇦"},{name:"united-kingdom",hexadecimal:"🇬🇧"},{name:"grenada",hexadecimal:"🇬🇩"},{name:"georgia",hexadecimal:"🇬🇪"},{name:"french-guiana",hexadecimal:"🇬🇫"},{name:"guernsey",hexadecimal:"🇬🇬"},{name:"ghana",hexadecimal:"🇬🇭"},{name:"gibraltar",hexadecimal:"🇬🇮"},{name:"greenland",hexadecimal:"🇬🇱"},{name:"gambia",hexadecimal:"🇬🇲"},{name:"guinea",hexadecimal:"🇬🇳"},{name:"guadeloupe",hexadecimal:"🇬🇵"},{name:"equatorial-guinea",hexadecimal:"🇬🇶"},{name:"greece",hexadecimal:"🇬🇷"},{name:"south-georgia-&-south-sandwich-islands",hexadecimal:"🇬🇸"},{name:"guatemala",hexadecimal:"🇬🇹"},{name:"guam",hexadecimal:"🇬🇺"},{name:"guinea-bissau",hexadecimal:"🇬🇼"},{name:"guyana",hexadecimal:"🇬🇾"},{name:"hong-kong-sar-china",hexadecimal:"🇭🇰"},{name:"heard-&-mcdonald-islands",hexadecimal:"🇭🇲"},{name:"honduras",hexadecimal:"🇭🇳"},{name:"croatia",hexadecimal:"🇭🇷"},{name:"haiti",hexadecimal:"🇭🇹"},{name:"hungary",hexadecimal:"🇭🇺"},{name:"canary-islands",hexadecimal:"🇮🇨"},{name:"indonesia",hexadecimal:"🇮🇩"},{name:"ireland",hexadecimal:"🇮🇪"},{name:"israel",hexadecimal:"🇮🇱"},{name:"isle-of-man",hexadecimal:"🇮🇲"},{name:"india",hexadecimal:"🇮🇳"},{name:"british-indian-ocean-territory",hexadecimal:"🇮🇴"},{name:"iraq",hexadecimal:"🇮🇶"},{name:"iran",hexadecimal:"🇮🇷"},{name:"iceland",hexadecimal:"🇮🇸"},{name:"italy",hexadecimal:"🇮🇹"},{name:"jersey",hexadecimal:"🇯🇪"},{name:"jamaica",hexadecimal:"🇯🇲"},{name:"jordan",hexadecimal:"🇯🇴"},{name:"japan",hexadecimal:"🇯🇵"},{name:"kenya",hexadecimal:"🇰🇪"},{name:"kyrgyzstan",hexadecimal:"🇰🇬"},{name:"cambodia",hexadecimal:"🇰🇭"},{name:"kiribati",hexadecimal:"🇰🇮"},{name:"comoros",hexadecimal:"🇰🇲"},{name:"st.-kitts-&-nevis",hexadecimal:"🇰🇳"},{name:"north-korea",hexadecimal:"🇰🇵"},{name:"south-korea",hexadecimal:"🇰🇷"},{name:"kuwait",hexadecimal:"🇰🇼"},{name:"cayman-islands",hexadecimal:"🇰🇾"},{name:"kazakhstan",hexadecimal:"🇰🇿"},{name:"laos",hexadecimal:"🇱🇦"},{name:"lebanon",hexadecimal:"🇱🇧"},{name:"st.-lucia",hexadecimal:"🇱🇨"},{name:"liechtenstein",hexadecimal:"🇱🇮"},{name:"sri-lanka",hexadecimal:"🇱🇰"},{name:"liberia",hexadecimal:"🇱🇷"},{name:"lesotho",hexadecimal:"🇱🇸"},{name:"lithuania",hexadecimal:"🇱🇹"},{name:"luxembourg",hexadecimal:"🇱🇺"},{name:"latvia",hexadecimal:"🇱🇻"},{name:"libya",hexadecimal:"🇱🇾"},{name:"morocco",hexadecimal:"🇲🇦"},{name:"monaco",hexadecimal:"🇲🇨"},{name:"moldova",hexadecimal:"🇲🇩"},{name:"montenegro",hexadecimal:"🇲🇪"},{name:"st.-martin",hexadecimal:"🇲🇫"},{name:"madagascar",hexadecimal:"🇲🇬"},{name:"marshall-islands",hexadecimal:"🇲🇭"},{name:"macedonia",hexadecimal:"🇲🇰"},{name:"mali",hexadecimal:"🇲🇱"},{name:"myanmar-(burma)",hexadecimal:"🇲🇲"},{name:"mongolia",hexadecimal:"🇲🇳"},{name:"macau-sar-china",hexadecimal:"🇲🇴"},{name:"northern-mariana-islands",hexadecimal:"🇲🇵"},{name:"martinique",hexadecimal:"🇲🇶"},{name:"mauritania",hexadecimal:"🇲🇷"},{name:"montserrat",hexadecimal:"🇲🇸"},{name:"malta",hexadecimal:"🇲🇹"},{name:"mauritius",hexadecimal:"🇲🇺"},{name:"maldives",hexadecimal:"🇲🇻"},{name:"malawi",hexadecimal:"🇲🇼"},{name:"mexico",hexadecimal:"🇲🇽"},{name:"malaysia",hexadecimal:"🇲🇾"},{name:"mozambique",hexadecimal:"🇲🇿"},{name:"namibia",hexadecimal:"🇳🇦"},{name:"new-caledonia",hexadecimal:"🇳🇨"},{name:"niger",hexadecimal:"🇳🇪"},{name:"norfolk-island",hexadecimal:"🇳🇫"},{name:"nigeria",hexadecimal:"🇳🇬"},{name:"nicaragua",hexadecimal:"🇳🇮"},{name:"netherlands",hexadecimal:"🇳🇱"},{name:"norway",hexadecimal:"🇳🇴"},{name:"nepal",hexadecimal:"🇳🇵"},{name:"nauru",hexadecimal:"🇳🇷"},{name:"niue",hexadecimal:"🇳🇺"},{name:"new-zealand",hexadecimal:"🇳🇿"},{name:"oman",hexadecimal:"🇴🇲"},{name:"panama",hexadecimal:"🇵🇦"},{name:"peru",hexadecimal:"🇵🇪"},{name:"french-polynesia",hexadecimal:"🇵🇫"},{name:"papua-new-guinea",hexadecimal:"🇵🇬"},{name:"philippines",hexadecimal:"🇵🇭"},{name:"pakistan",hexadecimal:"🇵🇰"},{name:"poland",hexadecimal:"🇵🇱"},{name:"st.-pierre-&-miquelon",hexadecimal:"🇵🇲"},{name:"pitcairn-islands",hexadecimal:"🇵🇳"},{name:"puerto-rico",hexadecimal:"🇵🇷"},{name:"palestinian-territories",hexadecimal:"🇵🇸"},{name:"portugal",hexadecimal:"🇵🇹"},{name:"palau",hexadecimal:"🇵🇼"},{name:"paraguay",hexadecimal:"🇵🇾"},{name:"qatar",hexadecimal:"🇶🇦"},{name:"rã©union",hexadecimal:"🇷🇪"},{name:"romania",hexadecimal:"🇷🇴"},{name:"serbia",hexadecimal:"🇷🇸"},{name:"russia",hexadecimal:"🇷🇺"},{name:"rwanda",hexadecimal:"🇷🇼"},{name:"saudi-arabia",hexadecimal:"🇸🇦"},{name:"solomon-islands",hexadecimal:"🇸🇧"},{name:"seychelles",hexadecimal:"🇸🇨"},{name:"sudan",hexadecimal:"🇸🇩"},{name:"sweden",hexadecimal:"🇸🇪"},{name:"singapore",hexadecimal:"🇸🇬"},{name:"st.-helena",hexadecimal:"🇸🇭"},{name:"slovenia",hexadecimal:"🇸🇮"},{name:"svalbard-&-jan-mayen",hexadecimal:"🇸🇯"},{name:"slovakia",hexadecimal:"🇸🇰"},{name:"sierra-leone",hexadecimal:"🇸🇱"},{name:"san-marino",hexadecimal:"🇸🇲"},{name:"senegal",hexadecimal:"🇸🇳"},{name:"somalia",hexadecimal:"🇸🇴"},{name:"suriname",hexadecimal:"🇸🇷"},{name:"south-sudan",hexadecimal:"🇸🇸"},{name:"sã£o-tomã©-&-prãncipe",hexadecimal:"🇸🇹"},{name:"el-salvador",hexadecimal:"🇸🇻"},{name:"sint-maarten",hexadecimal:"🇸🇽"},{name:"syria",hexadecimal:"🇸🇾"},{name:"swaziland",hexadecimal:"🇸🇿"},{name:"tristan-da-cunha",hexadecimal:"🇹🇦"},{name:"turks-&-caicos-islands",hexadecimal:"🇹🇨"},{name:"chad",hexadecimal:"🇹🇩"},{name:"french-southern-territories",hexadecimal:"🇹🇫"},{name:"togo",hexadecimal:"🇹🇬"},{name:"thailand",hexadecimal:"🇹🇭"},{name:"tajikistan",hexadecimal:"🇹🇯"},{name:"tokelau",hexadecimal:"🇹🇰"},{name:"timor-leste",hexadecimal:"🇹🇱"},{name:"turkmenistan",hexadecimal:"🇹🇲"},{name:"tunisia",hexadecimal:"🇹🇳"},{name:"tonga",hexadecimal:"🇹🇴"},{name:"turkey",hexadecimal:"🇹🇷"},{name:"trinidad-&-tobago",hexadecimal:"🇹🇹"},{name:"tuvalu",hexadecimal:"🇹🇻"},{name:"taiwan",hexadecimal:"🇹🇼"},{name:"tanzania",hexadecimal:"🇹🇿"},{name:"ukraine",hexadecimal:"🇺🇦"},{name:"uganda",hexadecimal:"🇺🇬"},{name:"u.s.-outlying-islands",hexadecimal:"🇺🇲"},{name:"united-states",hexadecimal:"🇺🇸"},{name:"uruguay",hexadecimal:"🇺🇾"},{name:"uzbekistan",hexadecimal:"🇺🇿"},{name:"vatican-city",hexadecimal:"🇻🇦"},{name:"st.-vincent-&-grenadines",hexadecimal:"🇻🇨"},{name:"venezuela",hexadecimal:"🇻🇪"},{name:"british-virgin-islands",hexadecimal:"🇻🇬"},{name:"u.s.-virgin-islands",hexadecimal:"🇻🇮"},{name:"vietnam",hexadecimal:"🇻🇳"},{name:"vanuatu",hexadecimal:"🇻🇺"},{name:"wallis-&-futuna",hexadecimal:"🇼🇫"},{name:"samoa",hexadecimal:"🇼🇸"},{name:"kosovo",hexadecimal:"🇽🇰"},{name:"yemen",hexadecimal:"🇾🇪"},{name:"mayotte",hexadecimal:"🇾🇹"},{name:"south-africa",hexadecimal:"🇿🇦"},{name:"zambia",hexadecimal:"🇿🇲"},{name:"zimbabwe",hexadecimal:"🇿🇼"}],na=({emojis:a,onSelect:s,onClose:r})=>{const[n,t]=C.useState({start:0,end:80}),p=8,i=40,w=400,b=C.useCallback(c=>{const j=c.currentTarget.scrollTop,E=Math.floor(j/i),u=Math.min(E+Math.ceil(w/i)+2,Math.ceil(a.length/p));t({start:E*p,end:u*p})},[a.length,i,w,p]),f=C.useCallback(c=>{const j=c.match(/&#x([0-9A-Fa-f]+);/g);if(!j)return"";const E=j.map(u=>{const g=u.replace(/&#x|;/g,"");return parseInt(g,16)});return String.fromCodePoint(...E)},[]),v=Math.ceil(a.length/p)*i,S=a.slice(n.start,n.end);return e.jsx("div",{className:"rsp-h-[400px] rsp-overflow-y-auto rsp-relative",onScroll:b,children:e.jsx("div",{style:{height:v},className:"rsp-relative",children:e.jsx("div",{className:"rsp-absolute rsp-w-full rsp-grid rsp-grid-cols-8 rsp-gap-1",style:{top:Math.floor(n.start/p)*i,transform:"translateY(0px)"},children:S.map((c,j)=>{const E=n.start+j;return e.jsx("button",{onClick:()=>{s(f(c.hexadecimal))},className:"rsp-w-10 rsp-h-10 rsp-flex rsp-items-center rsp-justify-center rsp-text-xl hover:rsp-bg-gray-100 rsp-rounded rsp-transition-colors",title:c.name,style:{height:i},children:f(c.hexadecimal)},E)})})})})};function he({isOpen:a,onClose:s,onSelect:r}){const[n,t]=C.useState(""),p=C.useMemo(()=>n?ye.filter(i=>i.name.toLowerCase().includes(n.toLowerCase())):ye,[n]);return C.useEffect(()=>{a||t("")},[a]),e.jsx(ne,{isOpen:a,onClose:s,title:"Select Emoji",children:e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:"text",placeholder:"Search emojis...",value:n,onChange:i=>t(i.target.value),className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500"}),n&&e.jsx("button",{onClick:()=>t(""),className:"rsp-absolute rsp-right-2 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-gray-400 hover:rsp-text-gray-600",children:"×"})]}),e.jsx("div",{className:"rsp-flex rsp-gap-2 rsp-flex-wrap",children:["😀","🎉","❤️","👍","🔥","💯","✨","🎯"].map(i=>e.jsx("button",{onClick:()=>{r(i)},className:"rsp-w-8 rsp-h-8 rsp-flex rsp-items-center rsp-justify-center rsp-text-lg hover:rsp-bg-gray-100 rsp-rounded rsp-transition-colors",children:i},i))}),e.jsxs("div",{className:"rsp-text-sm rsp-text-gray-500",children:[p.length," emojis found"]}),e.jsx(na,{emojis:p,onSelect:r,onClose:s})]})})}function ia({template:a,setTemplate:s}){const[r,n]=C.useState(!1),[t,p]=C.useState(null),[i,w]=C.useState(null),[b,f]=C.useState(null),[v,S]=C.useState(!1),c=()=>{const l=(a.body||"").match(/{{\d+}}/g);if(!l)return 0;const m=l.map(d=>{const y=d.match(/{{(\d+)}}/);return y?parseInt(y[1],10):0});return m.length>0?Math.max(...m):0},j=()=>{const m=`{{${c()+1}}}`;if(i&&a.body.length+m.length<=1024){const d=i.selectionStart||a.body.length,y=a.body.substring(0,d),U=a.body.substring(d),R=y+m+U;s({...a,body:R}),setTimeout(()=>{if(i){const o=d+m.length;i.setSelectionRange(o,o),i.focus()}},0)}},E=()=>{p("body"),n(!0),setTimeout(()=>{i&&i.focus()},0)},u=g=>{if(t==="body"){if(!i)return;const l=i.selectionStart||a.body.length,m=1024,d=a.body;if(d.length+g.length<=m){const y=d.substring(0,l),U=d.substring(l),R=y+g+U;s({...a,body:R}),setTimeout(()=>{if(i){const o=l+g.length;i.setSelectionRange(o,o),i.focus()}},0)}}else if(t==="footer"){if(!b)return;const l=b.selectionStart||a.footer.length,m=60,d=a.footer;if(d.length+g.length<=m){const y=d.substring(0,l),U=d.substring(l),R=y+g+U;s({...a,footer:R}),setTimeout(()=>{if(b){const o=l+g.length;b.setSelectionRange(o,o),b.focus()}},0)}}};return e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Body"}),e.jsx("div",{className:"rsp-relative",children:e.jsx("textarea",{ref:w,value:a.body,onChange:g=>s({...a,body:g.target.value}),maxLength:1024,rows:6,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white rsp-resize-none rsp-shadow-sm",placeholder:"Enter the text for your message",onFocus:()=>p("body"),onBlur:()=>S(!0)})}),!a.body&&v&&e.jsx("p",{className:"rsp-text-xs rsp-text-red-600 rsp-mt-1",children:"Body is required."}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mt-2",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("button",{onClick:j,className:"rsp-p-1 rsp-text-gray-500 hover:rsp-text-gray-700 hover:rsp-bg-gray-100 rsp-rounded",title:"Add Variable",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"})})}),e.jsx("button",{onClick:E,className:"rsp-p-1 rsp-text-gray-500 hover:rsp-text-gray-700 hover:rsp-bg-gray-100 rsp-rounded",title:"Add emoji",children:e.jsx(pe,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsx("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-500",children:[a.body.length,"/1024 (1 WhatsAppAudience)"]})})]}),(()=>{const g=a.body.match(/\{\{(\d+)\}\}/g)||[],l=[...new Set(g.map(m=>m.replace(/[{}]/g,"")))];return l.length===0?null:e.jsxs("div",{className:"rsp-mt-3",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-2",children:"Sample Values"}),e.jsx("div",{className:"rsp-grid rsp-grid-cols-3 rsp-gap-2",children:l.map(m=>{var d,y;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-xs rsp-text-gray-500 rsp-whitespace-nowrap",children:["{{",m,"}}",":"]}),e.jsx("input",{type:"text",value:((y=(d=a.sampleContent)==null?void 0:d.bodyVariables)==null?void 0:y[m])||"",onChange:U=>{var o,k,V;const R={...a.sampleContent,bodyVariables:{...(o=a.sampleContent)==null?void 0:o.bodyVariables,[m]:U.target.value},headerVariables:((k=a.sampleContent)==null?void 0:k.headerVariables)||{},buttonVariables:((V=a.sampleContent)==null?void 0:V.buttonVariables)||{}};s({...a,sampleContent:R})},className:"rsp-flex-1 rsp-px-2 rsp-py-1 rsp-border rsp-border-gray-300 rsp-rounded rsp-text-xs focus:rsp-outline-none focus:rsp-border-blue-500",placeholder:"Sample"}),e.jsx("button",{type:"button",onClick:()=>{var k,V,B;const U=new RegExp(`\\{\\{${m}\\}\\}`,"g"),R=(a.body||"").replace(U,""),o=Object.fromEntries(Object.entries(((k=a.sampleContent)==null?void 0:k.bodyVariables)||{}).filter(([O])=>O!==m));s({...a,body:R,sampleContent:{...a.sampleContent,bodyVariables:o,headerVariables:((V=a.sampleContent)==null?void 0:V.headerVariables)||{},buttonVariables:((B=a.sampleContent)==null?void 0:B.buttonVariables)||{}}})},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`body-sample-${m}`)})})]})})()]}),e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Footer (optional)"}),e.jsx("div",{className:"rsp-relative",children:e.jsx("input",{ref:f,type:"text",value:a.footer,onChange:g=>s({...a,footer:g.target.value}),maxLength:60,className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent",placeholder:"Footer Text",onFocus:()=>p("footer")})}),e.jsxs("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-1",children:[a.footer.length,"/60 characters"]})]}),e.jsx(he,{isOpen:r,onClose:()=>n(!1),onSelect:u})]})}function la({template:a,setTemplate:s}){var g;const[r,n]=C.useState(null),[t,p]=C.useState(!1),[i,w]=C.useState({text:"",value:"",urlType:"static"}),f={quickReply:a.buttons.filter(l=>l.type==="QUICK_REPLY").length,url:a.buttons.filter(l=>l.type==="URL").length,call:a.buttons.filter(l=>l.type==="CALL").length,flow:a.buttons.filter(l=>l.type==="FLOW").length},v=()=>{w({text:"",value:"",urlType:"static"}),n(null),p(!1)},S=l=>{if(!i.text.trim())return;let m=l==="QUICK_REPLY"?i.text:i.value;l==="CALL"&&m&&!m.startsWith("+")&&(m="+"+m);const d={id:Math.random().toString(36).substr(2,9),type:l,text:i.text,value:m,urlType:l==="URL"?i.urlType:void 0};s({...a,buttons:[...a.buttons,d]}),v()},c=l=>{s({...a,buttons:a.buttons.filter(m=>m.id!==l)})},j=(l,m,d)=>{const y=a.buttons.find(o=>o.id===l),U=m==="text"?25:m==="value"&&(y==null?void 0:y.type)==="URL"?2e3:20;let R=d.slice(0,U);m==="value"&&(y==null?void 0:y.type)==="CALL"&&R&&!R.startsWith("+")&&(R="+"+R),s({...a,buttons:a.buttons.map(o=>o.id===l?{...o,[m]:R}:o)})},E=()=>{const m=[...a.buttons.filter(y=>y.type==="URL"&&y.urlType==="dynamic").map(y=>y.value||""),i.value].join(" ").match(/{{\d+}}/g);if(!m)return 0;const d=m.map(y=>{const U=y.match(/{{(\d+)}}/);return U?parseInt(U[1],10):0});return d.length>0?Math.max(...d):0},u=[{type:"QUICK_REPLY",icon:ie,label:"Quick Reply",description:"Add quick response options",limit:10,current:f.quickReply,color:"blue"},{type:"URL",icon:Ae,label:"Web URL",description:"Link to websites or pages",limit:2,current:f.url,color:"green"},{type:"CALL",icon:je,label:"Call Button",description:"Add phone number to call",limit:1,current:f.call,color:"purple"}];return e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Interactive Buttons"}),e.jsx("p",{className:"rsp-text-sm rsp-text-gray-500 rsp-mt-1",children:"Add buttons to make your message interactive"})]}),e.jsx("div",{className:"rsp-text-sm rsp-text-gray-500"})]}),e.jsx("div",{className:"rsp-bg-blue-50 rsp-border-l-4 rsp-border-blue-500 rsp-p-4 rsp-rounded-r-md",children:e.jsxs("div",{className:"rsp-flex",children:[e.jsx("div",{className:"rsp-flex-shrink-0",children:e.jsx("svg",{className:"rsp-h-5 rsp-w-5 rsp-text-blue-400",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",clipRule:"evenodd"})})}),e.jsx("div",{className:"rsp-ml-3",children:e.jsx("p",{className:"rsp-text-sm rsp-text-blue-700",children:"We recommend adding the marketing opt-out button. This can help reduce blocks from customers and increase your quality rating."})})]})}),!r&&e.jsx("div",{className:"rsp-grid rsp-grid-cols-1 md:rsp-grid-cols-2 rsp-gap-4",children:u.map(l=>{const m=l.icon,d=l.current>=l.limit;return e.jsx("button",{onClick:()=>!d&&n(l.type),disabled:d,className:`rsp-p-4 rsp-border-2 rsp-rounded-xl rsp-text-left rsp-transition-all rsp-duration-200 ${d?"rsp-border-gray-200 rsp-bg-gray-50 rsp-text-gray-400 rsp-cursor-not-allowed rsp-opacity-60":"rsp-cursor-pointer rsp-transform rsp-shadow-sm hover:rsp-shadow-md"}`,children:e.jsxs("div",{className:"rsp-flex rsp-items-start rsp-justify-between",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-3",children:[e.jsx("div",{className:`rsp-p-2 rsp-rounded-lg ${d?"rsp-bg-gray-200":"rsp-bg-white rsp-shadow-sm"}`,children:e.jsx(m,{className:"rsp-w-5 rsp-h-5"})}),e.jsxs("div",{children:[e.jsx("h4",{className:"rsp-font-semibold rsp-text-sm",children:l.label}),e.jsx("p",{className:"rsp-text-xs rsp-opacity-80 rsp-mt-1",children:l.description})]})]}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("span",{className:"rsp-text-xs rsp-font-medium rsp-px-2 rsp-py-1 rsp-rounded-full rsp-bg-white rsp-bg-opacity-70",children:[l.current,"/",l.limit]}),!d&&e.jsx(de,{className:"rsp-w-4 rsp-h-4"})]})]})},l.type)})}),r&&e.jsxs("div",{className:"rsp-bg-gradient-to-br rsp-from-gray-50 rsp-to-gray-100 rsp-border rsp-border-gray-200 rsp-rounded-xl rsp-p-6 rsp-shadow-sm",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mb-4",children:[e.jsxs("h4",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:["Add ",(g=u.find(l=>l.type===r))==null?void 0:g.label]}),e.jsx("button",{onClick:v,className:"rsp-p-2 rsp-text-gray-400 hover:rsp-text-gray-600 hover:rsp-bg-white rsp-rounded-lg rsp-transition-colors",children:e.jsx(ee,{className:"rsp-w-5 rsp-h-5"})})]}),e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Button Text"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:"text",value:i.text,onChange:l=>w({...i,text:l.target.value.slice(0,25)}),className:"rsp-w-full rsp-px-4 rsp-py-3 rsp-border rsp-border-gray-300 rsp-rounded-lg rsp-bg-white rsp-text-sm focus:rsp-outline-none focus:rsp-ring-2 focus:rsp-ring-blue-500 focus:rsp-border-transparent rsp-shadow-sm",placeholder:"Enter button text (max 25 characters)",maxLength:25}),e.jsxs("span",{className:"rsp-absolute rsp-right-3 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-xs rsp-text-gray-400",children:[i.text.length,"/25"]})]})]}),r!=="QUICK_REPLY"&&e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:r==="URL"?"Website URL":r==="CALL"?"Phone Number":"Flow ID"}),r==="URL"&&e.jsxs("div",{className:"rsp-mb-3",children:[e.jsxs("div",{className:"rsp-flex rsp-gap-4",children:[e.jsxs("label",{className:"rsp-flex rsp-items-center rsp-cursor-pointer",children:[e.jsx("input",{type:"radio",checked:i.urlType==="static",onChange:()=>w({...i,urlType:"static"}),className:"rsp-mr-2 rsp-text-blue-600"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Static URL"})]}),e.jsxs("label",{className:"rsp-flex rsp-items-center rsp-cursor-pointer",children:[e.jsx("input",{type:"radio",checked:i.urlType==="dynamic",onChange:()=>w({...i,urlType:"dynamic"}),className:"rsp-mr-2 rsp-text-blue-600"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Dynamic URL"})]})]}),i.urlType==="dynamic"&&e.jsxs("div",{className:"rsp-mt-3 rsp-p-3 rsp-bg-blue-50 rsp-rounded-lg rsp-border rsp-border-blue-200",children:[e.jsx("h4",{className:"rsp-text-sm rsp-font-medium rsp-text-blue-800 rsp-mb-2",children:"Dynamic URL Guidelines:"}),e.jsxs("ul",{className:"rsp-text-xs rsp-text-blue-700 rsp-space-y-1",children:[e.jsx("li",{children:"• Use placeholders like: https://example.com/order/{{1}}"}),e.jsx("li",{children:"• Maximum 3 placeholders per URL ({{1}}, {{2}}, {{3}})"}),e.jsx("li",{children:"• Only HTTPS URLs are allowed"}),e.jsx("li",{children:"• WhatsApp verifies only the domain"})]})]})]}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:r==="CALL"?"tel":r==="URL"?"url":"text",value:i.value,onChange:l=>{const m=r==="URL"?2e3:20;w({...i,value:l.target.value.slice(0,m)})},className:"rsp-w-full rsp-px-4 rsp-py-3 rsp-border rsp-border-gray-300 rsp-rounded-lg rsp-bg-white rsp-text-sm focus:rsp-outline-none focus:rsp-ring-2 focus:rsp-ring-blue-500 focus:rsp-border-transparent rsp-shadow-sm",placeholder:r==="URL"?i.urlType==="dynamic"?"https://example.com/order/{{1}}?user={{2}}":"https://example.com":r==="CALL"?"+1234567890":"Flow ID",maxLength:r==="URL"?2e3:20}),e.jsxs("span",{className:"rsp-absolute rsp-right-3 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-xs rsp-text-gray-400",children:[i.value.length,"/",r==="URL"?2e3:20]})]}),r==="URL"&&i.urlType==="dynamic"&&e.jsxs("div",{className:"rsp-mt-3",children:[e.jsx("div",{className:"rsp-flex rsp-items-center rsp-gap-2 rsp-mb-2",children:e.jsx("button",{type:"button",onClick:()=>{if((i.value.match(/\{\{(\d+)\}\}/g)||[]).length>=3)return;const d=E()+1,y=i.value+`{{${d}}}`;w({...i,value:y}),p(!0)},disabled:(i.value.match(/\{\{(\d+)\}\}/g)||[]).length>=3,className:"rsp-px-2 rsp-py-2 rsp-text-xs rsp-bg-gray-300 hover:rsp-bg-gray-200 rsp-rounded rsp-text-gray-700 disabled:rsp-bg-gray-200 disabled:rsp-text-gray-500",children:"+ Add Variable"})}),(i.value.match(/\{\{(\d+)\}\}/g)||[]).length>=3&&e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-1",children:"Maximum 3 variables allowed."}),t&&e.jsxs("div",{className:"rsp-mt-4 rsp-p-4 rsp-bg-gray-50 rsp-rounded-lg rsp-border",children:[e.jsx("h4",{className:"rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-3",children:"Sample Values for URL Variables"}),e.jsx("div",{className:"rsp-space-y-3",children:(()=>{const l=i.value.match(/\{\{(\d+)\}\}/g)||[];return[...new Set(l.map(d=>d.replace(/[{}]/g,"")))].map(d=>{var y,U;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-sm rsp-text-gray-600 rsp-whitespace-nowrap",children:["Variable {{",d,"}}"]}),e.jsx("input",{type:"text",value:((U=(y=a.sampleContent)==null?void 0:y.buttonVariables)==null?void 0:U[d])||"",onChange:R=>{var k,V,B;const o={...a.sampleContent,headerVariables:((k=a.sampleContent)==null?void 0:k.headerVariables)||{},bodyVariables:((V=a.sampleContent)==null?void 0:V.bodyVariables)||{},buttonVariables:{...(B=a.sampleContent)==null?void 0:B.buttonVariables,[d]:R.target.value}};s({...a,sampleContent:o})},className:"rsp-flex-1 rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-ring-1 focus:rsp-ring-blue-500 focus:rsp-border-blue-500",placeholder:`Sample value (e.g., ${d==="1"?"order123":"user456"})`}),e.jsx("button",{type:"button",onClick:()=>{var V,B,O;const R=new RegExp(`\\{\\{${d}\\}\\}`,"g"),o=(i.value||"").replace(R,"");w({...i,value:o});const k=Object.fromEntries(Object.entries(((V=a.sampleContent)==null?void 0:V.buttonVariables)||{}).filter(([q])=>q!==d));s({...a,sampleContent:{...a.sampleContent,headerVariables:((B=a.sampleContent)==null?void 0:B.headerVariables)||{},bodyVariables:((O=a.sampleContent)==null?void 0:O.bodyVariables)||{},buttonVariables:k}})},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`sample-${d}`)})})()}),e.jsxs("div",{className:"rsp-mt-4 rsp-p-3 rsp-bg-white rsp-rounded-lg rsp-border",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-700 rsp-mb-1",children:"Preview URL:"}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-600 rsp-font-mono rsp-break-all",children:i.value.replace(/\{\{(\d+)\}\}/g,(l,m)=>{var d,y;return((y=(d=a.sampleContent)==null?void 0:d.buttonVariables)==null?void 0:y[m])||`[${l}]`})})]}),e.jsx("div",{className:"rsp-mt-3 rsp-flex rsp-justify-end",children:e.jsx("button",{type:"button",onClick:()=>p(!1),className:"rsp-px-3 rsp-py-1 rsp-text-xs rsp-text-gray-500 hover:rsp-text-gray-700",children:"Close"})})]})]})]}),e.jsxs("div",{className:"rsp-flex rsp-gap-3 rsp-pt-2",children:[e.jsx("button",{onClick:()=>S(r),disabled:!i.text.trim()||r!=="QUICK_REPLY"&&!i.value.trim(),className:"rsp-flex-1 rsp-bg-blue-600 rsp-text-white rsp-py-3 rsp-px-4 rsp-rounded-lg rsp-font-medium rsp-text-sm rsp-transition-colors hover:rsp-bg-blue-700 disabled:rsp-opacity-50 disabled:rsp-cursor-not-allowed rsp-shadow-sm",children:"Add Button"}),e.jsx("button",{onClick:v,className:"rsp-px-4 rsp-py-3 rsp-text-gray-600 rsp-bg-white rsp-border rsp-border-gray-300 rsp-rounded-lg rsp-font-medium rsp-text-sm rsp-transition-colors hover:rsp-bg-gray-50 rsp-shadow-sm",children:"Cancel"})]})]})]}),a.buttons.length>0&&e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsx("h4",{className:"rsp-text-md rsp-font-semibold rsp-text-gray-900",children:"Added Buttons"}),e.jsx("div",{className:"rsp-space-y-3",children:a.buttons.map(l=>{const m=u.find(y=>y.type===l.type),d=(m==null?void 0:m.icon)||ie;return e.jsx("div",{className:"rsp-bg-white rsp-border rsp-border-gray-200 rsp-rounded-lg rsp-p-4 rsp-shadow-sm",children:e.jsxs("div",{className:"rsp-flex rsp-items-start rsp-gap-3",children:[e.jsx("div",{className:"rsp-p-2 rsp-bg-gray-50 rsp-rounded-lg",children:e.jsx(d,{className:"rsp-w-4 rsp-h-4 rsp-text-gray-600"})}),e.jsxs("div",{className:"rsp-flex-1 rsp-space-y-3",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsx("span",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-500 rsp-uppercase rsp-tracking-wider",children:l.type.replace("_"," ")}),e.jsx("button",{onClick:()=>c(l.id),className:"rsp-p-1 rsp-text-red-400 hover:rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded rsp-transition-colors",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsxs("div",{className:"rsp-grid rsp-grid-cols-1 rsp-gap-3",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:"Button Text"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:"text",value:l.text,onChange:y=>j(l.id,"text",y.target.value),maxLength:25,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-ring-1 focus:rsp-ring-blue-500 focus:rsp-border-blue-500"}),e.jsxs("span",{className:"rsp-absolute rsp-right-2 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-xs rsp-text-gray-400",children:[l.text.length,"/25"]})]})]}),l.type!=="QUICK_REPLY"&&e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:l.type==="URL"?"Website URL":l.type==="CALL"?"Phone Number":"Flow ID"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:l.type==="CALL"?"tel":l.type==="URL"?"url":"text",value:l.value||"",onChange:y=>j(l.id,"value",y.target.value),maxLength:l.type==="URL"?2e3:20,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-ring-1 focus:rsp-ring-blue-500 focus:rsp-border-blue-500"}),e.jsxs("span",{className:"rsp-absolute rsp-right-2 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-text-xs rsp-text-gray-400",children:[(l.value||"").length,"/",l.type==="URL"?2e3:20]})]})]})]})]})]})},l.id)})})]}),a.buttons.length===0&&!r&&e.jsxs("div",{className:"rsp-text-center rsp-py-12 rsp-bg-gray-50 rsp-rounded-xl rsp-border-2 rsp-border-dashed rsp-border-gray-300",children:[e.jsx("div",{className:"rsp-w-16 rsp-h-16 rsp-bg-white rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-mx-auto rsp-mb-4 rsp-shadow-sm",children:e.jsx(ie,{className:"rsp-w-8 rsp-h-8 rsp-text-gray-400"})}),e.jsx("h3",{className:"rsp-text-lg rsp-font-medium rsp-text-gray-900 rsp-mb-2",children:"No buttons added yet"}),e.jsx("p",{className:"rsp-text-gray-500 rsp-text-sm rsp-mb-4",children:"Add interactive buttons to make your message more engaging"}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-400",children:"Choose from Quick Reply, Web URL, Call, or Flow buttons above"})]})]})}const ta=async a=>{try{if(!a)throw new Error("No file provided");const s=100*1024*1024;if(a.size>s)throw new Error(`File size too large. Maximum allowed size is ${s/(1024*1024)}MB`);const r=new FormData;r.append("file",a),console.log("Uploading file:",a.name,"Size:",a.size,"Type:",a.type);const n=await fetch("https://wiz.resul.io/Communication/UploadDocuments",{method:"POST",body:r});console.log("Upload response status:",n.status),console.log("Upload response headers:",Object.fromEntries(n.headers.entries()));const t=await n.text();console.log("Raw upload response:",t);let p;try{p=JSON.parse(t)}catch(i){throw console.error("Failed to parse upload response:",i),new Error("Invalid response from upload server")}if(console.log("Parsed upload response:",p),console.log("Upload status:",p.status),console.log("Upload message:",p.message),console.log("Upload data:",p.data),!p.status)throw new Error(p.message||"Upload failed");if(p.data&&Array.isArray(p.data)&&p.data.length>0){const i=p.data[0];if(i.url)return console.log("File uploaded successfully:",{url:i.url,filename:i.filename,originalName:i.originalName,size:i.size}),i.url;throw new Error("No file URL in upload response data")}else throw new Error("No files in upload response data")}catch(s){throw console.error("File upload error:",s),s instanceof Error?s:new Error("Unknown error occurred during file upload")}},xa=(a,s)=>{const n=a.name.toLowerCase().split(".").pop();switch(s){case"IMAGE":return["jpg","jpeg","png","gif","bmp","tiff","svg"].includes(n||"");case"VIDEO":return["mp4","mov","avi","3gpp"].includes(n||"");case"DOCUMENT":return["pdf","doc","docx","xls","xlsx","ppt","pptx","txt"].includes(n||"");default:return!1}},ca=a=>{switch(a){case"IMAGE":return 5*1024*1024;case"VIDEO":return 16*1024*1024;case"DOCUMENT":return 100*1024*1024;default:return 10*1024*1024}};function ma({template:a,setTemplate:s,onFileUpload:r}){var k,V,B,O,q;const[n,t]=C.useState({}),[,p]=C.useState({}),[i,w]=C.useState({open:!1,message:""}),[b,f]=C.useState(!1),[v,S]=C.useState(null),c=C.useRef({}),j=()=>{var N;const x={id:Math.random().toString(36).substr(2,9),headerType:"MEDIA",mediaType:((N=a.carousel)==null?void 0:N.type)==="VIDEO"?"VIDEO":"IMAGE",body:"",buttons:[]};s(T=>{var A,I;return{...T,carousel:{type:((A=a.carousel)==null?void 0:A.type)||"IMAGE",cards:[...((I=a.carousel)==null?void 0:I.cards)||[],x]}}})},E=x=>{s(N=>({...N,carousel:{...N.carousel,cards:N.carousel.cards.filter(T=>T.id!==x)}}))},u=(x,N,T)=>{s(A=>({...A,carousel:{...A.carousel,cards:A.carousel.cards.map(I=>I.id===x?{...I,[N]:T}:I)}}))},g=x=>{s(N=>{const A=((N.carousel||{type:x,cards:[]}).cards||[]).map(I=>({...I,mediaType:x,mediaUrl:""}));return{...N,carousel:{type:x,cards:A}}})},l=(x,N)=>{var z;const T=(z=a.carousel)==null?void 0:z.cards.find(W=>W.id===x);if(!T)return;const P=`{{${d(x)+1}}}`,L=T[N]+P;u(x,N,L)},m=x=>{var L;if(!v)return;const N=c.current[v],T=(L=a.carousel)==null?void 0:L.cards.find(z=>z.id===v);if(!T)return;const A=N&&typeof N.selectionStart=="number"?N.selectionStart:T.body.length,I=T.body.substring(0,A),P=T.body.substring(A),h=I+x+P;u(v,"body",h),setTimeout(()=>{const z=c.current[v];if(z){const W=A+x.length;z.setSelectionRange(W,W),z.focus()}},0),f(!1)},d=x=>{var P;const N=(P=a.carousel)==null?void 0:P.cards.find(h=>h.id===x);if(!N)return 0;const A=(N.body||"").match(/\{\{(\d+)\}\}/g);if(!A)return 0;const I=A.map(h=>{const L=h.match(/{{(\d+)}}/);return L?parseInt(L[1],10):0});return I.length>0?Math.max(...I):0},y=(x,N)=>{var I;const T=(I=a.carousel)==null?void 0:I.cards.find(P=>P.id===x);if(!T||T.buttons.length>=2)return;const A={id:Math.random().toString(36).substr(2,9),type:N,text:"",value:"",urlType:"static"};u(x,"buttons",[...T.buttons,A])},U=(x,N,T,A)=>{var h;const I=(h=a.carousel)==null?void 0:h.cards.find(L=>L.id===x);if(!I)return;const P=I.buttons.map(L=>L.id===N?{...L,[T]:A}:L);u(x,"buttons",P)},R=(x,N)=>{var I;const T=(I=a.carousel)==null?void 0:I.cards.find(P=>P.id===x);if(!T)return;const A=T.buttons.filter(P=>P.id!==N);u(x,"buttons",A)},o=async(x,N)=>{var T;try{t(h=>({...h,[x]:!0})),p(h=>({...h,[x]:!1}));const A=((T=a.carousel)==null?void 0:T.type)==="VIDEO"?"VIDEO":"IMAGE";if(!xa(N,A))throw new Error(`Invalid file type. Expected ${A.toLowerCase()} file.`);const I=ca(A);if(N.size>I){const h=I/1048576;throw new Error(`File size too large. Maximum allowed size is ${h}MB.`)}const P=await r(N);u(x,"mediaUrl",P)}catch(A){console.error("File upload failed:",A),w({open:!0,message:A instanceof Error?A.message:"File upload failed"})}finally{t(A=>({...A,[x]:!1}))}};return e.jsxs("div",{className:"rsp-space-y-6",children:[i.open&&e.jsxs("div",{className:"rsp-fixed rsp-inset-0 rsp-z-50 rsp-flex rsp-items-center rsp-justify-center",children:[e.jsx("div",{className:"rsp-absolute rsp-inset-0 rsp-bg-black rsp-bg-opacity-40",onClick:()=>w({open:!1,message:""})}),e.jsxs("div",{className:"rsp-relative rsp-z-10 rsp-bg-white rsp-rounded-lg rsp-shadow-lg rsp-w-full rsp-max-w-md rsp-p-5",children:[e.jsx("div",{className:"rsp-mb-3 rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Upload Error"}),e.jsx("div",{className:"rsp-text-sm rsp-text-gray-700 rsp-break-words rsp-whitespace-pre-wrap",children:i.message}),e.jsx("div",{className:"rsp-flex rsp-justify-end rsp-mt-4",children:e.jsx("button",{onClick:()=>w({open:!1,message:""}),className:"rsp-px-4 rsp-py-2 rsp-text-sm rsp-font-medium rsp-text-white rsp-bg-blue-600 rsp-rounded-md hover:rsp-bg-blue-700",children:"OK"})})]})]}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsx("h3",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Carousel Cards"}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-4",children:[e.jsxs("span",{className:"rsp-text-sm rsp-text-gray-500",children:["Total Cards: ",((k=a.carousel)==null?void 0:k.cards.length)||0,"/10"]}),e.jsxs("button",{onClick:j,disabled:(((V=a.carousel)==null?void 0:V.cards.length)||0)>=10,className:"rsp-px-4 rsp-py-2 rsp-bg-blue-600 rsp-text-white rsp-rounded-md hover:rsp-bg-blue-700 disabled:rsp-bg-gray-400 disabled:rsp-cursor-not-allowed rsp-text-sm rsp-font-medium",children:[e.jsx(de,{className:"rsp-w-4 rsp-h-4 rsp-inline rsp-mr-2"}),"Add Card"]})]})]}),e.jsxs("div",{className:"rsp-bg-white rsp-p-4 rsp-rounded-lg rsp-border rsp-border-gray-200",children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-3",children:"Carousel Type"}),e.jsxs("div",{className:"rsp-flex rsp-gap-4",children:[e.jsxs("label",{className:"rsp-flex rsp-items-center",children:[e.jsx("input",{type:"radio",name:"carouselType",value:"IMAGE",checked:((B=a.carousel)==null?void 0:B.type)==="IMAGE",onChange:x=>g(x.target.value),className:"rsp-mr-2"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Image"})]}),e.jsxs("label",{className:"rsp-flex rsp-items-center",children:[e.jsx("input",{type:"radio",name:"carouselType",value:"VIDEO",checked:((O=a.carousel)==null?void 0:O.type)==="VIDEO",onChange:x=>g(x.target.value),className:"rsp-mr-2"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Video"})]})]})]}),e.jsx("div",{className:"rsp-space-y-6",children:(q=a.carousel)==null?void 0:q.cards.map((x,N)=>{var T,A,I,P,h,L,z,W;return e.jsxs("div",{className:"rsp-bg-white rsp-rounded-xl rsp-border-2 rsp-border-gray-200 rsp-overflow-hidden rsp-shadow-lg rsp-transition-all hover:rsp-shadow-xl hover:rsp-border-blue-300",children:[e.jsxs("div",{className:"rsp-bg-gradient-to-r rsp-from-blue-50 rsp-to-blue-100 rsp-px-5 rsp-py-3 rsp-flex rsp-items-center rsp-justify-between rsp-border-b rsp-border-gray-200",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-3",children:[e.jsx("div",{className:"rsp-w-8 rsp-h-8 rsp-bg-blue-500 rsp-text-white rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-font-bold rsp-text-sm rsp-shadow-md",children:N+1}),e.jsxs("h4",{className:"rsp-text-base rsp-font-semibold rsp-text-gray-800",children:["Card ",N+1]})]}),e.jsx("button",{onClick:()=>E(x.id),className:"rsp-p-1.5 rsp-text-gray-500 hover:rsp-text-white hover:rsp-bg-red-500 rsp-rounded-full rsp-transition-colors",title:"Remove Card",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsx("div",{className:"rsp-p-6",children:e.jsxs("div",{className:"rsp-grid rsp-grid-cols-1 lg:rsp-grid-cols-2 rsp-gap-6",children:[e.jsxs("div",{children:[e.jsxs("label",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800 rsp-mb-3 rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:((T=a.carousel)==null?void 0:T.type)==="VIDEO"?e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"}):e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"})}),((A=a.carousel)==null?void 0:A.type)==="VIDEO"?"Video":"Image"," Upload"]}),e.jsxs("div",{className:"rsp-border-2 rsp-border-dashed rsp-border-blue-200 rsp-rounded-xl rsp-p-6 rsp-text-center rsp-bg-gradient-to-br rsp-from-blue-50 rsp-to-white rsp-transition-all hover:rsp-border-blue-400 hover:rsp-from-blue-100 rsp-relative",children:[x.mediaUrl?e.jsxs("div",{className:"rsp-relative rsp-group",children:[((I=a.carousel)==null?void 0:I.type)==="IMAGE"?e.jsx("img",{src:x.mediaUrl,alt:`Card ${N+1}`,className:"rsp-w-full rsp-h-48 rsp-object-cover rsp-rounded-lg rsp-shadow-md",onLoad:()=>p(M=>({...M,[x.id]:!0})),onError:()=>p(M=>({...M,[x.id]:!1}))}):e.jsx("video",{src:x.mediaUrl,className:"rsp-w-full rsp-h-48 rsp-object-cover rsp-rounded-lg rsp-shadow-md",controls:!0,onLoadedData:()=>p(M=>({...M,[x.id]:!0})),onError:()=>p(M=>({...M,[x.id]:!1}))}),e.jsx("button",{onClick:()=>u(x.id,"mediaUrl",""),className:"rsp-absolute rsp-top-2 rsp-right-2 rsp-p-2 rsp-bg-red-500 rsp-text-white rsp-rounded-full hover:rsp-bg-red-600 rsp-shadow-lg rsp-opacity-0 group-hover:rsp-opacity-100 rsp-transition-opacity",title:"Remove media",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})}),e.jsx("div",{className:"rsp-absolute rsp-bottom-2 rsp-left-2 rsp-bg-black rsp-bg-opacity-60 rsp-text-white rsp-text-xs rsp-px-2 rsp-py-1 rsp-rounded rsp-backdrop-blur-sm",children:((P=a.carousel)==null?void 0:P.type)==="VIDEO"?"📹 Video":"🖼️ Image"})]}):e.jsxs("div",{children:[e.jsx("div",{className:"rsp-w-20 rsp-h-20 rsp-mx-auto rsp-mb-4 rsp-bg-gradient-to-br rsp-from-blue-100 rsp-to-blue-200 rsp-rounded-xl rsp-flex rsp-items-center rsp-justify-center rsp-shadow-md",children:e.jsx("svg",{className:"rsp-w-10 rsp-h-10 rsp-text-blue-600",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:((h=a.carousel)==null?void 0:h.type)==="VIDEO"?e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"}):e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"})})}),e.jsx("input",{type:"file",accept:((L=a.carousel)==null?void 0:L.type)==="VIDEO"?"video/*":"image/*",onChange:M=>{var D;const J=(D=M.target.files)==null?void 0:D[0];J&&!n[x.id]&&o(x.id,J)},className:"rsp-hidden",id:`file-upload-${x.id}`,disabled:!!n[x.id]}),e.jsxs("label",{htmlFor:`file-upload-${x.id}`,className:`rsp-inline-flex rsp-items-center rsp-gap-2 rsp-px-5 rsp-py-2.5 rsp-border rsp-border-blue-300 rsp-rounded-lg rsp-shadow-sm rsp-text-sm rsp-font-semibold rsp-text-blue-600 rsp-bg-white rsp-transition-colors ${n[x.id]?"rsp-opacity-50 rsp-cursor-not-allowed":"hover:rsp-bg-blue-50 rsp-cursor-pointer"}`,"aria-disabled":!!n[x.id],children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"})}),"Upload ",((z=a.carousel)==null?void 0:z.type)==="VIDEO"?"Video":"Image"]}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-3 rsp-px-2",children:((W=a.carousel)==null?void 0:W.type)==="VIDEO"?"📹 MP4, MOV, AVI (Max 16MB)":"🖼️ PNG, JPG, GIF, TIFF, SVG, BMP (Max 5MB)"})]}),n[x.id]&&e.jsx("div",{className:"rsp-absolute rsp-inset-0 rsp-bg-black rsp-bg-opacity-30 rsp-flex rsp-items-center rsp-justify-center",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2 rsp-bg-white rsp-px-3 rsp-py-2 rsp-rounded-md rsp-shadow",children:[e.jsxs("svg",{className:"rsp-w-4 rsp-h-4 rsp-animate-spin",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:[e.jsx("circle",{cx:"12",cy:"12",r:"10",strokeOpacity:"0.25",strokeWidth:"4"}),e.jsx("path",{d:"M22 12a10 10 0 00-10-10",strokeWidth:"4"})]}),e.jsx("span",{className:"rsp-text-xs rsp-text-gray-700",children:"Uploading..."})]})})]})]}),e.jsxs("div",{className:"rsp-space-y-5",children:[e.jsxs("div",{children:[e.jsxs("label",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800 rsp-mb-3 rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"})}),"Body Text",e.jsx("span",{className:"rsp-text-xs rsp-text-gray-500 rsp-font-normal",children:"(Max 160 characters)"})]}),e.jsx("div",{className:"rsp-relative",children:e.jsx("textarea",{ref:M=>{c.current[x.id]=M},value:x.body,onChange:M=>u(x.id,"body",M.target.value),maxLength:160,rows:4,className:"rsp-w-full rsp-px-4 rsp-py-3 rsp-border-2 rsp-border-gray-200 rsp-rounded-lg rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-400 rsp-bg-white rsp-resize-none rsp-shadow-sm rsp-transition-colors",placeholder:"Enter Card Body Message"})}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mt-2",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-1",children:[e.jsx("button",{onClick:()=>l(x.id,"body"),className:"rsp-p-1.5 rsp-text-gray-500 hover:rsp-text-blue-600 hover:rsp-bg-blue-50 rsp-rounded rsp-transition-colors",title:"Add Variable",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"})})}),e.jsx("button",{onClick:()=>{S(x.id),f(!0)},className:"rsp-p-1.5 rsp-text-gray-500 hover:rsp-text-blue-600 hover:rsp-bg-blue-50 rsp-rounded rsp-transition-colors",title:"Add Emoji",children:e.jsx(pe,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsxs("span",{className:`rsp-text-xs rsp-font-medium ${x.body.length>140?"rsp-text-orange-500":"rsp-text-gray-500"}`,children:[x.body.length,"/160"]})]}),(()=>{const M=x.body.match(/\{\{(\d+)\}\}/g)||[],J=[...new Set(M.map(D=>D.replace(/[{}]/g,"")))];return J.length===0?null:e.jsxs("div",{className:"rsp-mt-3 rsp-p-3 rsp-bg-blue-50 rsp-rounded-lg rsp-border rsp-border-blue-200",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-semibold rsp-text-blue-800 rsp-mb-2",children:"Sample Values for This Card"}),e.jsx("div",{className:"rsp-grid rsp-grid-cols-1 rsp-gap-2",children:J.map(D=>{var re,$;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-xs rsp-text-gray-700 rsp-font-medium rsp-whitespace-nowrap",children:["{{",D,"}}",":"]}),e.jsx("input",{type:"text",value:(($=(re=x.sampleContent)==null?void 0:re.bodyVariables)==null?void 0:$[D])||"",onChange:ae=>{const Z=ae.target.value;s(K=>({...K,carousel:{...K.carousel,cards:K.carousel.cards.map(_=>{var H,G,Y;return _.id!==x.id?_:{..._,sampleContent:{headerVariables:((H=_.sampleContent)==null?void 0:H.headerVariables)||{},bodyVariables:{...((G=_.sampleContent)==null?void 0:G.bodyVariables)||{},[D]:Z},buttonVariables:((Y=_.sampleContent)==null?void 0:Y.buttonVariables)||{}}}})}}))},className:"rsp-flex-1 rsp-px-2 rsp-py-1 rsp-border rsp-border-gray-300 rsp-rounded rsp-text-xs focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white",placeholder:"Sample value"}),e.jsx("button",{type:"button",onClick:()=>{const ae=new RegExp(`\\{\\{${D}\\}\\}`,"g"),Z=(x.body||"").replace(ae,"");s(K=>({...K,carousel:{...K.carousel,cards:K.carousel.cards.map(_=>{var H,G,Y;if(_.id!==x.id)return _;const X=Object.fromEntries(Object.entries(((H=_.sampleContent)==null?void 0:H.bodyVariables)||{}).filter(([se])=>se!==D));return{..._,body:Z,sampleContent:{headerVariables:((G=_.sampleContent)==null?void 0:G.headerVariables)||{},bodyVariables:X,buttonVariables:((Y=_.sampleContent)==null?void 0:Y.buttonVariables)||{}}}})}}))},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`card-${x.id}-sample-${D}`)})})]})})()]}),x.buttons.length<2&&e.jsxs("div",{children:[e.jsxs("label",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800 rsp-mb-3 rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122"})}),"Add Action Button",e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-500 rsp-font-normal",children:["(",x.buttons.length,"/2)"]})]}),e.jsxs("div",{className:"rsp-grid rsp-grid-cols-3 rsp-gap-2",children:[e.jsxs("button",{onClick:()=>y(x.id,"QUICK_REPLY"),className:"rsp-flex rsp-flex-col rsp-items-center rsp-gap-2 rsp-px-3 rsp-py-4 rsp-border-2 rsp-border-gray-200 rsp-rounded-lg rsp-text-sm rsp-font-medium rsp-text-gray-700 hover:rsp-border-blue-400 hover:rsp-bg-blue-50 rsp-transition-all rsp-shadow-sm",children:[e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"})}),e.jsx("span",{className:"rsp-text-xs",children:"Quick Reply"})]}),e.jsxs("button",{onClick:()=>y(x.id,"URL"),className:"rsp-flex rsp-flex-col rsp-items-center rsp-gap-2 rsp-px-3 rsp-py-4 rsp-border-2 rsp-border-gray-200 rsp-rounded-lg rsp-text-sm rsp-font-medium rsp-text-gray-700 hover:rsp-border-blue-400 hover:rsp-bg-blue-50 rsp-transition-all rsp-shadow-sm",children:[e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"})}),e.jsx("span",{className:"rsp-text-xs",children:"Website"})]}),e.jsxs("button",{onClick:()=>y(x.id,"PHONE_NUMBER"),className:"rsp-flex rsp-flex-col rsp-items-center rsp-gap-2 rsp-px-3 rsp-py-4 rsp-border-2 rsp-border-gray-200 rsp-rounded-lg rsp-text-sm rsp-font-medium rsp-text-gray-700 hover:rsp-border-blue-400 hover:rsp-bg-blue-50 rsp-transition-all rsp-shadow-sm",children:[e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-blue-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"})}),e.jsx("span",{className:"rsp-text-xs",children:"Phone"})]})]})]}),x.buttons.length>0&&e.jsxs("div",{className:"rsp-space-y-3",children:[e.jsxs("label",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800 rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-green-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"})}),"Configured Buttons"]}),x.buttons.map((M,J)=>e.jsxs("div",{className:"rsp-p-4 rsp-border-2 rsp-border-blue-200 rsp-rounded-lg rsp-bg-gradient-to-br rsp-from-blue-50 rsp-to-white rsp-shadow-sm",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mb-3",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("div",{className:"rsp-w-6 rsp-h-6 rsp-bg-blue-500 rsp-text-white rsp-rounded rsp-flex rsp-items-center rsp-justify-center rsp-text-xs rsp-font-bold",children:J+1}),e.jsx("span",{className:"rsp-text-sm rsp-font-semibold rsp-text-gray-800",children:M.type==="QUICK_REPLY"?"Quick Reply":M.type==="URL"?"Website":"Phone"})]}),e.jsx("button",{onClick:()=>R(x.id,M.id),className:"rsp-p-1 rsp-text-gray-400 hover:rsp-text-red-500 hover:rsp-bg-red-50 rsp-rounded rsp-transition-colors",title:"Remove button",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsxs("div",{className:"rsp-space-y-3",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:"Button Text"}),e.jsx("input",{type:"text",value:M.text,onChange:D=>U(x.id,M.id,"text",D.target.value),placeholder:`Enter Button Text (Max ${M.type==="QUICK_REPLY"?"25":"20"} characters)`,maxLength:M.type==="QUICK_REPLY"?25:20,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white"})]}),M.type==="URL"&&e.jsxs("div",{className:"rsp-space-y-3",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-2",children:"URL Type"}),e.jsxs("div",{className:"rsp-flex rsp-gap-4",children:[e.jsxs("label",{className:"rsp-flex rsp-items-center rsp-cursor-pointer",children:[e.jsx("input",{type:"radio",checked:M.urlType!=="dynamic",onChange:()=>U(x.id,M.id,"urlType","static"),className:"rsp-mr-2 rsp-text-blue-600"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Static URL"})]}),e.jsxs("label",{className:"rsp-flex rsp-items-center rsp-cursor-pointer",children:[e.jsx("input",{type:"radio",checked:M.urlType==="dynamic",onChange:()=>U(x.id,M.id,"urlType","dynamic"),className:"rsp-mr-2 rsp-text-blue-600"}),e.jsx("span",{className:"rsp-text-sm rsp-text-gray-700",children:"Dynamic URL"})]})]})]}),e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:"Website URL"}),e.jsx("input",{type:"text",value:M.value||"",onChange:D=>U(x.id,M.id,"value",D.target.value),placeholder:M.urlType==="dynamic"?"https://example.com/order/{{1}}":"https://example.com",className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white"})]}),M.urlType==="dynamic"&&e.jsxs("div",{className:"rsp-space-y-2",children:[e.jsx("div",{className:"rsp-p-2 rsp-bg-blue-50 rsp-rounded rsp-border rsp-border-blue-200",children:e.jsxs("p",{className:"rsp-text-xs rsp-text-blue-700",children:[e.jsx("strong",{children:"Tip:"})," Use ","{{"," and ","}}}"," to add variables (e.g., https://example.com/","{{"," 1","}}",")"]})}),e.jsxs("div",{children:[e.jsx("button",{type:"button",onClick:()=>{if(((M.value||"").match(/\{\{(\d+)\}\}/g)||[]).length>=3)return;const $=((M.value||"").match(/\{\{(\d+)\}\}/g)||[]).map(_=>{const X=_.match(/{{(\d+)}}/);return X?parseInt(X[1],10):0}),Z=($.length>0?Math.max(...$):0)+1,K=(M.value||"")+`{{${Z}}}`;U(x.id,M.id,"value",K)},disabled:((M.value||"").match(/\{\{(\d+)\}\}/g)||[]).length>=3,className:"rsp-px-3 rsp-py-1.5 rsp-text-xs rsp-bg-blue-500 hover:rsp-bg-blue-600 rsp-text-white rsp-rounded disabled:rsp-bg-gray-300 disabled:rsp-cursor-not-allowed rsp-transition-colors",children:"+ Add Variable"}),((M.value||"").match(/\{\{(\d+)\}\}/g)||[]).length>=3&&e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-1",children:"Maximum 3 variables allowed"})]}),(()=>{const D=(M.value||"").match(/\{\{(\d+)\}\}/g)||[],re=[...new Set(D.map($=>$.replace(/[{}]/g,"")))];return re.length===0?null:e.jsxs("div",{className:"rsp-p-3 rsp-bg-gray-50 rsp-rounded-lg rsp-border rsp-border-gray-200",children:[e.jsx("h4",{className:"rsp-text-xs rsp-font-semibold rsp-text-gray-700 rsp-mb-2",children:"Sample Values for URL Variables"}),e.jsx("div",{className:"rsp-space-y-2",children:re.map($=>{var ae,Z;return e.jsxs("div",{className:"rsp-space-y-1",children:[e.jsxs("label",{className:"rsp-block rsp-text-xs rsp-text-gray-600 rsp-mb-1",children:["Variable ","{{",$,"}}"]}),e.jsx("input",{type:"text",value:((Z=(ae=x.sampleContent)==null?void 0:ae.buttonVariables)==null?void 0:Z[$])||"",onChange:K=>{const _=K.target.value;s(X=>({...X,carousel:{...X.carousel,cards:X.carousel.cards.map(H=>{var G,Y,se;return H.id!==x.id?H:{...H,sampleContent:{headerVariables:((G=H.sampleContent)==null?void 0:G.headerVariables)||{},bodyVariables:((Y=H.sampleContent)==null?void 0:Y.bodyVariables)||{},buttonVariables:{...((se=H.sampleContent)==null?void 0:se.buttonVariables)||{},[$]:_}}}})}}))},className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-ring-1 focus:rsp-ring-blue-500 focus:rsp-border-blue-500 rsp-bg-white",placeholder:`Sample value (e.g., ${$==="1"?"order123":"user456"})`}),e.jsx("button",{type:"button",onClick:()=>{const K=M.value||"",_=new RegExp(`\\{\\{${$}\\}\\}`,"g"),X=K.replace(_,"");U(x.id,M.id,"value",X),s(H=>({...H,carousel:{...H.carousel,cards:H.carousel.cards.map(G=>{var se,ue,be;if(G.id!==x.id)return G;const Y=Object.fromEntries(Object.entries(((se=G.sampleContent)==null?void 0:se.buttonVariables)||{}).filter(([Ee])=>Ee!==$));return{...G,sampleContent:{headerVariables:((ue=G.sampleContent)==null?void 0:ue.headerVariables)||{},bodyVariables:((be=G.sampleContent)==null?void 0:be.bodyVariables)||{},buttonVariables:Y}}})}}))},className:"rsp-px-2 rsp-py-1 rsp-text- rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`button-${M.id}-sample-${$}`)})})]})})()]})]}),M.type==="PHONE_NUMBER"&&e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-1",children:"Phone Number"}),e.jsx("input",{type:"text",value:M.value||"",onChange:D=>U(x.id,M.id,"value",D.target.value),placeholder:"+1234567890",className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white"})]})]})]},M.id))]})]})]})})]},x.id)})}),e.jsx("div",{className:"rsp-bg-blue-50 rsp-border-l-4 rsp-border-blue-500 rsp-p-4 rsp-rounded-r-md",children:e.jsxs("div",{className:"rsp-flex",children:[e.jsx("div",{className:"rsp-flex-shrink-0",children:e.jsx("svg",{className:"rsp-h-5 rsp-w-5 rsp-text-blue-400",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",clipRule:"evenodd"})})}),e.jsxs("div",{className:"rsp-ml-3",children:[e.jsx("h3",{className:"rsp-text-sm rsp-font-medium rsp-text-blue-800",children:"Meta WhatsApp HSM Guidelines"}),e.jsx("div",{className:"rsp-mt-2 rsp-text-sm rsp-text-blue-700",children:e.jsxs("ul",{className:"rsp-list-disc rsp-list-inside rsp-space-y-1",children:[e.jsx("li",{children:"Maximum 10 carousel cards per template"}),e.jsx("li",{children:"Maximum 2 buttons per card"}),e.jsx("li",{children:"Card body text limited to 160 characters"}),e.jsx("li",{children:"Button text limited to 20-25 characters depending on type"}),e.jsx("li",{children:"Images: PNG, JPG, GIF, TIFF, SVG, BMP formats supported"}),e.jsx("li",{children:"Videos: MP4, MOV, AVI formats supported"})]})})]})]})}),e.jsx(he,{isOpen:b,onClose:()=>f(!1),onSelect:m})]})}const we=async a=>{try{console.log(`Starting file upload: ${a.name}`);const s=await ta(a);return console.log(`File uploaded successfully: ${s}`),s}catch(s){throw console.error("Upload failed in parent:",s),s}},da=a=>{const r=(a.body||"").match(/\{\{(\d+)\}\}/g);if(!r)return 0;const n=r.map(t=>{const p=t.match(/{{(\d+)}}/);return p?parseInt(p[1],10):0});return n.length>0?Math.max(...n):0};function pa({template:a,setTemplate:s}){const[r,n]=C.useState(!1),t=C.useRef(null),p=()=>{n(!0),setTimeout(()=>{t.current&&t.current.focus()},0)},i=w=>{const b=t.current,f=a.body,v=b&&typeof b.selectionStart=="number"?b.selectionStart:f.length,S=f.substring(0,v),c=f.substring(v),j=S+w+c;s({...a,body:j}),setTimeout(()=>{if(t.current){const E=v+w.length;t.current.setSelectionRange(E,E),t.current.focus()}},0),n(!1)};return e.jsxs("div",{className:"rsp-space-y-6",children:[a.type!=="CAROUSEL"&&e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsx("h2",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Message Content"}),e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsx(ra,{template:a,setTemplate:s,onFileUpload:we}),e.jsx(ia,{template:a,setTemplate:s})]})]}),a.type==="CAROUSEL"&&e.jsxs("div",{className:"rsp-space-y-6",children:[e.jsx("h2",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Message Content"}),e.jsx("div",{className:"rsp-bg-white rsp-p-6 rsp-rounded-lg rsp-shadow-sm",children:e.jsxs("div",{children:[e.jsxs("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:["Body ",e.jsx("span",{className:"rsp-text-gray-500",children:"(Global message for carousel)"})]}),e.jsx("div",{className:"rsp-relative",children:e.jsx("textarea",{ref:t,value:a.body,onChange:w=>s({...a,body:w.target.value}),maxLength:1024,rows:4,className:"rsp-w-full rsp-px-3 rsp-py-2 rsp-border rsp-border-gray-300 rsp-rounded-md rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-white rsp-resize-none",placeholder:"Enter Template Message"})}),!a.body&&e.jsx("p",{className:"rsp-text-xs rsp-text-red-600 rsp-mt-1",children:"Body is required."}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between rsp-mt-1",children:[e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("button",{onClick:()=>{const f=`{{${da(a)+1}}}`;s({...a,body:a.body+f})},className:"rsp-p-1 rsp-text-gray-500 hover:rsp-text-gray-700 hover:rsp-bg-gray-100 rsp-rounded",title:"Add Variable",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"})})}),e.jsx("button",{onClick:p,className:"rsp-p-1 rsp-text-gray-500 hover:rsp-text-gray-700 hover:rsp-bg-gray-100 rsp-rounded",title:"Add emoji",children:e.jsx(pe,{className:"rsp-w-4 rsp-h-4"})})]}),e.jsxs("span",{className:"rsp-text-xs rsp-text-gray-500",children:[a.body.length,"/1024"]})]}),(()=>{const w=a.body.match(/\{\{(\d+)\}\}/g)||[],b=[...new Set(w.map(f=>f.replace(/[{}]/g,"")))];return b.length===0?null:e.jsxs("div",{className:"rsp-mt-3",children:[e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-600 rsp-mb-2",children:"Sample Values"}),e.jsx("div",{className:"rsp-grid rsp-grid-cols-3 rsp-gap-2",children:b.map(f=>{var v,S;return e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsxs("label",{className:"rsp-text-xs rsp-text-gray-500 rsp-whitespace-nowrap",children:["{{",f,"}}",":"]}),e.jsx("input",{type:"text",value:((S=(v=a.sampleContent)==null?void 0:v.bodyVariables)==null?void 0:S[f])||"",onChange:c=>{var E,u,g;const j={...a.sampleContent,headerVariables:((E=a.sampleContent)==null?void 0:E.headerVariables)||{},bodyVariables:{...(u=a.sampleContent)==null?void 0:u.bodyVariables,[f]:c.target.value},buttonVariables:((g=a.sampleContent)==null?void 0:g.buttonVariables)||{}};s({...a,sampleContent:j})},className:"rsp-flex-1 rsp-px-2 rsp-py-1 rsp-border rsp-border-gray-300 rsp-rounded rsp-text-xs focus:rsp-outline-none focus:rsp-border-blue-500",placeholder:"Sample"}),e.jsx("button",{type:"button",onClick:()=>{var u,g,l;const c=new RegExp(`\\{\\{${f}\\}\\}`,"g"),j=(a.body||"").replace(c,""),E=Object.fromEntries(Object.entries(((u=a.sampleContent)==null?void 0:u.bodyVariables)||{}).filter(([m])=>m!==f));s({...a,body:j,sampleContent:{...a.sampleContent,bodyVariables:E,headerVariables:((g=a.sampleContent)==null?void 0:g.headerVariables)||{},buttonVariables:((l=a.sampleContent)==null?void 0:l.buttonVariables)||{}}})},className:"rsp-px-2 rsp-py-1 rsp-text-xs rsp-text-red-600 hover:rsp-bg-red-50 rsp-rounded",title:"Remove this variable",children:"×"})]},`global-body-sample-${f}`)})})]})})()]})})]}),a.type==="CAROUSEL"&&e.jsx("div",{className:"rsp-space-y-6",children:e.jsx(ma,{template:a,setTemplate:s,onFileUpload:we})}),a.type!=="CAROUSEL"&&e.jsx("div",{className:"rsp-space-y-6",children:e.jsx(la,{template:a,setTemplate:s})}),e.jsx(he,{isOpen:r,onClose:()=>n(!1),onSelect:i})]})}function oa({type:a}){switch(a){case"QUICK_REPLY":return e.jsx(Pe,{className:"w-4 h-4"});case"URL":return e.jsx(Be,{className:"w-4 h-4"});case"CALL":return e.jsx(je,{className:"w-4 h-4"});case"FLOW":return e.jsx(_e,{className:"w-4 h-4"});default:return null}}function fa({buttons:a,flowButtonText:s,onShowAllOptions:r}){const n=[...a];s&&n.push({id:"flow-button",type:"QUICK_REPLY",text:s});const t=n.slice(0,2);return e.jsxs("div",{className:"rsp-divide-y rsp-divide-gray-200",children:[t.map(p=>e.jsxs("button",{className:"rsp-w-full rsp-py-4 rsp-text-[#128C7E] rsp-text-[15px] rsp-font-medium rsp-bg-white hover:rsp-bg-gray-50 rsp-flex rsp-items-center rsp-gap-3 rsp-px-4 rsp-transition-colors",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:[e.jsx("div",{className:"rsp-text-[#128C7E]",children:e.jsx(oa,{type:p.type})}),e.jsx("span",{className:"rsp-flex-1 rsp-text-left rsp-break-words rsp-break-all rsp-whitespace-pre-wrap",children:p.text}),p.id==="flow-button"&&e.jsx(Ve,{className:"rsp-w-5 rsp-h-5 rsp-text-[#128C7E] rsp-ml-auto"})]},p.id)),n.length>2&&e.jsxs("button",{onClick:r,className:"rsp-w-full rsp-py-4 rsp-text-[#128C7E] rsp-text-[15px] rsp-font-medium rsp-bg-white hover:rsp-bg-gray-50 rsp-flex rsp-items-center rsp-justify-center rsp-transition-colors",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:[e.jsx("span",{className:"rsp-text-lg rsp-mr-2",children:"⋯"}),"See all options"]})]})}function ha({template:a}){var S,c,j,E;const[s,r]=C.useState(!1),[n,t]=C.useState(0),p=(S=a.carousel)!=null&&S.cards?a.carousel.cards.length:0;C.useEffect(()=>{a.type==="CAROUSEL"&&p>0?n>=p&&t(0):t(0)},[p,a.type]);const i=u=>u?u.replace(/\{\{(\d+)\}\}/g,(g,l)=>{var m,d;return((d=(m=a.sampleContent)==null?void 0:m.headerVariables)==null?void 0:d[l])||`[Variable ${l}]`}):"",w=u=>u?u.replace(/\{\{(\d+)\}\}/g,(g,l)=>{var m,d;return((d=(m=a.sampleContent)==null?void 0:m.bodyVariables)==null?void 0:d[l])||`[Variable ${l}]`}):"",b=u=>{var m;const g=(u==null?void 0:u.body)??"";if(!g)return"";const l=((m=u==null?void 0:u.sampleContent)==null?void 0:m.bodyVariables)??{};return g.replace(/\{\{(\d+)\}\}/g,(d,y)=>l[y]||`[Variable ${y}]`)},f=a.headerType!=="NONE"||a.body||a.footer||a.buttons.length>0||a.type==="CAROUSEL"&&((c=a.carousel)==null?void 0:c.cards.length),v=a.headerText||a.body||a.footer;return e.jsxs("div",{className:"rsp-bg-white rsp-rounded-lg rsp-shadow-sm rsp-border rsp-border-gray-200",children:[e.jsxs("div",{className:"rsp-p-4 rsp-border-b rsp-border-gray-200",children:[e.jsx("h3",{className:"rsp-text-lg rsp-font-semibold rsp-text-gray-900",children:"Preview"}),e.jsx("p",{className:"rsp-text-sm rsp-text-gray-500",children:"See how your template will look"})]}),e.jsx("div",{className:"rsp-p-6 rsp-flex rsp-justify-center",children:e.jsx("div",{className:"rsp-relative",children:e.jsxs("div",{className:"rsp-w-[280px] rsp-h-[580px] rsp-bg-gradient-to-b rsp-from-[#1a1a1a] rsp-via-[#2d2d2f] rsp-to-[#000000] rsp-rounded-[35px] rsp-p-[2px] rsp-relative rsp-shadow-[0_20px_40px_-10px_rgba(0,0,0,0.7)] rsp-border-[1px] rsp-border-[#404040]",children:[e.jsx("div",{className:"rsp-absolute rsp-right-[-2px] rsp-top-[120px] rsp-w-[2px] rsp-h-[50px] rsp-bg-gradient-to-b rsp-from-[#404040] rsp-to-[#1a1a1a] rsp-rounded-l-[1px] rsp-shadow-md"}),e.jsx("div",{className:"rsp-absolute rsp-left-[-2px] rsp-top-[100px] rsp-w-[2px] rsp-h-[25px] rsp-bg-gradient-to-b rsp-from-[#404040] rsp-to-[#1a1a1a] rsp-rounded-r-[1px] rsp-shadow-sm"}),e.jsx("div",{className:"rsp-absolute rsp-left-[-2px] rsp-top-[135px] rsp-w-[2px] rsp-h-[40px] rsp-bg-gradient-to-b rsp-from-[#404040] rsp-to-[#1a1a1a] rsp-rounded-r-[1px] rsp-shadow-sm"}),e.jsx("div",{className:"rsp-absolute rsp-left-[-2px] rsp-top-[70px] rsp-w-[2px] rsp-h-[20px] rsp-bg-gradient-to-b rsp-from-[#ff8c42] rsp-to-[#ff6b35] rsp-rounded-r-[1px] rsp-shadow-md"}),e.jsxs("div",{className:"rsp-w-full rsp-h-full rsp-bg-black rsp-rounded-[33px] rsp-overflow-hidden rsp-relative rsp-shadow-[inset_0_1px_3px_rgba(0,0,0,0.3)]",children:[e.jsx("div",{className:"rsp-absolute rsp-top-[14px] rsp-left-1/2 rsp-transform -rsp-translate-x-1/2 rsp-w-[70px] rsp-h-[18px] rsp-bg-gradient-to-b rsp-from-[#0a0a0a] rsp-to-[#000000] rsp-rounded-[9px] rsp-z-20 rsp-shadow-[0_1px_4px_rgba(0,0,0,0.6)] rsp-border rsp-border-[#1a1a1a] rsp-flex rsp-items-center rsp-justify-center",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-center rsp-gap-[8px]",children:[e.jsx("div",{className:"rsp-w-[3px] rsp-h-[3px] rsp-bg-gradient-to-br rsp-from-[#1a1a1a] rsp-to-[#000000] rsp-rounded-full rsp-shadow-inner"}),e.jsx("div",{className:"rsp-w-[2px] rsp-h-[2px] rsp-bg-gradient-to-br rsp-from-[#333] rsp-to-[#000] rsp-rounded-full"})]})}),e.jsxs("div",{className:"rsp-w-full rsp-h-full rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-rounded-[33px] rsp-relative rsp-overflow-hidden rsp-shadow-[inset_0_1px_2px_rgba(0,0,0,0.1)]",children:[e.jsxs("div",{className:"rsp-absolute rsp-top-0 rsp-left-0 rsp-right-0 rsp-h-[45px] rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-flex rsp-items-center rsp-justify-between rsp-px-[30px] rsp-z-10",children:[e.jsx("div",{className:"rsp-text-[13px] rsp-font-semibold rsp-text-black rsp-tracking-tight",children:"9:41"}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-[5px]",children:[e.jsxs("div",{className:"rsp-flex rsp-gap-[2px] rsp-items-end",children:[e.jsx("div",{className:"rsp-w-[1.5px] rsp-h-[2px] rsp-bg-gradient-to-t rsp-from-black rsp-to-[#333] rsp-rounded-[0.5px]"}),e.jsx("div",{className:"rsp-w-[1.5px] rsp-h-[3px] rsp-bg-gradient-to-t rsp-from-black rsp-to-[#333] rsp-rounded-[0.5px]"}),e.jsx("div",{className:"rsp-w-[1.5px] rsp-h-[4px] rsp-bg-gradient-to-t rsp-from-black rsp-to-[#333] rsp-rounded-[0.5px]"}),e.jsx("div",{className:"rsp-w-[1.5px] rsp-h-[5px] rsp-bg-gradient-to-t rsp-from-black rsp-to-[#333] rsp-rounded-[0.5px]"})]}),e.jsx("svg",{className:"rsp-w-[11px] rsp-h-[8px] rsp-text-black rsp-opacity-90",viewBox:"0 0 15 11",fill:"currentColor",children:e.jsx("path",{d:"M1.5 4.5C3.5 2.5 6 1.5 7.5 1.5S11.5 2.5 13.5 4.5M3 6.5C4.5 5 6 4.5 7.5 4.5S10.5 5 12 6.5M5 8.5C6 7.5 6.75 7.25 7.5 7.25S9 7.5 10 8.5M7.5 10.5C7.5 10.5 7.5 10.5 7.5 10.5"})}),e.jsxs("div",{className:"rsp-relative rsp-flex rsp-items-center",children:[e.jsx("div",{className:"rsp-w-[18px] rsp-h-[9px] rsp-border-[1px] rsp-border-black rsp-border-opacity-60 rsp-rounded-[2px] rsp-relative",children:e.jsx("div",{className:"rsp-absolute rsp-inset-[1px] rsp-bg-gradient-to-r rsp-from-[#34d399] rsp-to-[#10b981] rsp-rounded-[1px] rsp-w-[13px] rsp-shadow-inner"})}),e.jsx("div",{className:"rsp-absolute rsp-right-[-2px] rsp-top-[2px] rsp-w-[1px] rsp-h-[5px] rsp-bg-black rsp-bg-opacity-60 rsp-rounded-[0.5px]"})]})]})]}),e.jsxs("div",{className:"rsp-absolute rsp-top-[45px] rsp-left-0 rsp-right-0 rsp-h-[60px] rsp-bg-gradient-to-r rsp-from-[#075E54] rsp-via-[#0a6b5f] rsp-to-[#128C7E] rsp-flex rsp-items-center rsp-px-4 rsp-gap-3 rsp-z-10 rsp-shadow-[0_2px_8px_rgba(0,0,0,0.15)]",children:[e.jsx("svg",{className:"rsp-w-5 rsp-h-5 rsp-text-white rsp-opacity-95 rsp-drop-shadow-sm",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.42-1.41L7.83 13H20v-2z"})}),e.jsx("div",{className:"rsp-w-[36px] rsp-h-[36px] rsp-bg-gradient-to-br rsp-from-[#25D366] rsp-via-[#20c55e] rsp-to-[#128C7E] rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-shadow-[0_2px_6px_rgba(0,0,0,0.2)] rsp-border-[2px] rsp-border-white rsp-border-opacity-30",children:e.jsx("span",{className:"rsp-text-white rsp-text-[14px] rsp-font-bold rsp-drop-shadow-sm",children:"B"})}),e.jsxs("div",{className:"rsp-flex-1",children:[e.jsx("div",{className:"rsp-text-white rsp-text-[14px] rsp-font-semibold rsp-drop-shadow-sm rsp-tracking-tight",children:"Business"}),e.jsx("div",{className:"rsp-text-[#B8E6D1] rsp-text-[11px] rsp-opacity-85 rsp-font-medium",children:"WhatsApp Business"})]}),e.jsxs("div",{className:"rsp-flex rsp-gap-4",children:[e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-white rsp-opacity-90 rsp-drop-shadow-sm",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"})}),e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-white rsp-opacity-90 rsp-drop-shadow-sm",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"})})]})]}),e.jsxs("div",{className:"rsp-absolute rsp-top-[105px] rsp-left-0 rsp-right-0 rsp-bottom-[60px] rsp-bg-gradient-to-b rsp-from-[#E8E2DB] rsp-via-[#E5DDD5] rsp-to-[#DDD5CC] rsp-overflow-y-auto",children:[e.jsx("div",{className:"rsp-absolute rsp-inset-0 rsp-opacity-[0.03]",style:{backgroundImage:`url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23000000' fill-opacity='0.08'%3E%3Cpath d='M40 40c0-4.4-3.6-8-8-8s-8 3.6-8 8 3.6 8 8 8 8-3.6 8-8zm0-32c0-4.4-3.6-8-8-8s-8 3.6-8 8 3.6 8 8 8 8-3.6 8-8zm32 32c0-4.4-3.6-8-8-8s-8 3.6-8 8 3.6 8 8 8 8-3.6 8-8z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")`}}),e.jsx("div",{className:"rsp-relative rsp-px-4 rsp-py-4",children:f?e.jsxs("div",{className:"rsp-flex rsp-flex-col rsp-items-start",children:[a.headerType==="MEDIA"&&a.mediaUrl&&e.jsxs("div",{className:"rsp-max-w-[220px] rsp-w-auto rsp-rounded-xl rsp-overflow-hidden rsp-shadow-md rsp-mb-1.5 rsp-animate-slide-up rsp-border rsp-border-gray-200",children:[a.mediaType==="IMAGE"&&e.jsx("img",{src:a.mediaUrl,alt:"Header media",className:"rsp-w-full rsp-max-h-[150px] rsp-object-cover rsp-block",onError:u=>{u.currentTarget.style.display="none"}}),a.mediaType==="VIDEO"&&e.jsxs("div",{className:"rsp-relative rsp-min-w-[150px] rsp-w-full rsp-h-[150px] rsp-bg-gradient-to-br rsp-from-gray-800 rsp-to-gray-900 rsp-flex rsp-items-center rsp-justify-center",children:[e.jsx("div",{className:"rsp-w-12 rsp-h-12 rsp-bg-black rsp-bg-opacity-70 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-shadow-lg rsp-border rsp-border-white rsp-border-opacity-20",children:e.jsx("div",{className:"rsp-w-0 rsp-h-0 rsp-border-l-[8px] rsp-border-l-white rsp-border-t-[6px] rsp-border-t-transparent rsp-border-b-[6px] rsp-border-b-transparent rsp-ml-1"})}),e.jsx("div",{className:"rsp-absolute rsp-bottom-2 rsp-right-2 rsp-bg-black rsp-bg-opacity-75 rsp-text-white rsp-text-[10px] rsp-px-2 rsp-py-1 rsp-rounded-full rsp-shadow-md rsp-backdrop-blur-sm",children:"📹 Video"})]}),a.mediaType==="DOCUMENT"&&e.jsx("div",{className:"rsp-p-3 rsp-bg-gradient-to-r rsp-from-gray-50 rsp-to-gray-100",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-2",children:[e.jsx("div",{className:"rsp-w-10 rsp-h-10 rsp-bg-gradient-to-br rsp-from-red-500 rsp-to-red-600 rsp-rounded-lg rsp-flex rsp-items-center rsp-justify-center rsp-shadow-md",children:e.jsx("span",{className:"rsp-text-white rsp-text-[9px] rsp-font-bold",children:"PDF"})}),e.jsxs("div",{children:[e.jsx("div",{className:"rsp-text-[12px] rsp-font-semibold rsp-text-gray-800",children:"Document"}),e.jsx("div",{className:"rsp-text-[10px] rsp-text-gray-600",children:"PDF • 1.2 MB"})]})]})})]}),v&&e.jsx("div",{className:"rsp-flex rsp-justify-start rsp-mb-1.5",children:e.jsxs("div",{className:"rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-rounded-[12px] rsp-max-w-[220px] rsp-shadow-[0_2px_8px_rgba(0,0,0,0.08)] rsp-relative rsp-border rsp-border-gray-100 rsp-animate-slide-up",children:[a.headerType==="TEXT"&&a.headerText&&e.jsx("div",{className:"rsp-px-4 rsp-pt-3 rsp-pb-2",children:e.jsx("div",{className:"rsp-text-[15px] rsp-font-semibold rsp-text-[#111b21] rsp-leading-[1.3] rsp-tracking-normal rsp-break-words",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:i(a.headerText)})}),a.body&&e.jsx("div",{className:"rsp-px-4 rsp-py-2",children:e.jsx("div",{className:"rsp-text-[14px] rsp-text-[#111b21] rsp-leading-[1.4] rsp-whitespace-pre-wrap rsp-tracking-normal rsp-break-words",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:w(a.body)})}),a.footer&&e.jsx("div",{className:"rsp-px-4 rsp-pb-2",children:e.jsx("div",{className:"rsp-text-[12px] rsp-text-[#667781] rsp-pt-2 rsp-border-t rsp-border-gray-100 rsp-break-words rsp-break-all rsp-whitespace-pre-wrap",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:a.footer})}),e.jsx("div",{className:"rsp-px-4 rsp-pb-2 rsp-text-right",children:e.jsxs("div",{className:"rsp-text-[11px] rsp-text-[#667781] rsp-flex rsp-items-center rsp-justify-end rsp-gap-1 rsp-opacity-80",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:["9:41 AM",e.jsx("svg",{className:"rsp-w-3 rsp-h-3 rsp-text-[#53bdeb]",viewBox:"0 0 16 15",fill:"currentColor",children:e.jsx("path",{d:"M15.01 3.316l-.478-.372a.365.365 0 0 0-.51.063L8.666 9.879a.32.32 0 0 1-.484.033l-.358-.325a.319.319 0 0 0-.484.032l-.378.483a.418.418 0 0 0 .036.541l1.32 1.266c.143.14.361.125.484-.033l6.272-8.048a.366.366 0 0 0-.064-.512zm-4.1 0l-.478-.372a.365.365 0 0 0-.51.063L4.566 9.879a.32.32 0 0 1-.484.033L1.891 7.769a.319.319 0 0 0-.484.032l-.378.483a.418.418 0 0 0 .036.541l3.61 3.463c.143.14.361.125.484-.033l6.272-8.048a.365.365 0 0 0-.064-.512z"})})]})})]})}),a.type==="CAROUSEL"&&(((E=(j=a.carousel)==null?void 0:j.cards)==null?void 0:E.length)||0)>0&&e.jsx("div",{className:"rsp-flex rsp-justify-start rsp-mb-1.5",children:e.jsx("div",{className:"rsp-w-[220px] rsp-animate-slide-up",children:e.jsx("div",{className:"rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-rounded-[12px] rsp-overflow-hidden rsp-shadow-[0_2px_8px_rgba(0,0,0,0.08)] rsp-border rsp-border-gray-100 rsp-relative rsp-min-h-[280px] rsp-flex rsp-flex-col",children:e.jsxs("div",{className:"rsp-relative rsp-flex-1 rsp-flex rsp-flex-col",children:[(()=>{var g,l;const u=a.carousel&&a.carousel.cards.length>0?a.carousel.cards[n]||a.carousel.cards[0]:void 0;return e.jsxs("div",{className:"rsp-flex rsp-flex-col rsp-h-full",children:[e.jsx("div",{className:"rsp-relative rsp-w-full rsp-h-[140px] rsp-bg-gray-100 rsp-group rsp-flex-shrink-0",children:u&&u.mediaUrl?e.jsxs(e.Fragment,{children:[((g=a.carousel)==null?void 0:g.type)==="IMAGE"?e.jsx("img",{src:u.mediaUrl,alt:"Carousel card",className:"rsp-w-full rsp-h-full rsp-object-cover",onError:m=>{m.currentTarget.style.display="none"}}):e.jsx("div",{className:"rsp-relative rsp-w-full rsp-h-full rsp-bg-gradient-to-br rsp-from-gray-800 rsp-to-gray-900 rsp-flex rsp-items-center rsp-justify-center",children:e.jsx("div",{className:"rsp-w-10 rsp-h-10 rsp-bg-black rsp-bg-opacity-70 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-shadow-lg",children:e.jsx("div",{className:"rsp-w-0 rsp-h-0 rsp-border-l-[6px] rsp-border-l-white rsp-border-t-[5px] rsp-border-t-transparent rsp-border-b-[5px] rsp-border-b-transparent rsp-ml-1"})})}),a.carousel&&a.carousel.cards.length>1&&e.jsxs(e.Fragment,{children:[e.jsx("button",{onClick:()=>t(m=>m>0?m-1:a.carousel.cards.length-1),className:"rsp-absolute rsp-left-1 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-z-20 rsp-w-6 rsp-h-6 rsp-bg-black rsp-bg-opacity-50 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-text-white hover:rsp-bg-opacity-80 rsp-transition-all rsp-opacity-0 group-hover:rsp-opacity-100",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 19l-7-7 7-7"})})}),e.jsx("button",{onClick:()=>t(m=>m<a.carousel.cards.length-1?m+1:0),className:"rsp-absolute rsp-right-1 rsp-top-1/2 rsp-transform -rsp-translate-y-1/2 rsp-z-20 rsp-w-6 rsp-h-6 rsp-bg-black rsp-bg-opacity-50 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-text-white hover:rsp-bg-opacity-80 rsp-transition-all rsp-opacity-0 group-hover:rsp-opacity-100",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})})})]}),e.jsxs("div",{className:"rsp-absolute rsp-top-2 rsp-right-2 rsp-bg-black rsp-bg-opacity-60 rsp-text-white rsp-text-[10px] rsp-px-2 rsp-py-0.5 rsp-rounded-full rsp-backdrop-blur-sm",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:[n+1,"/",a.carousel?a.carousel.cards.length:0]})]}):e.jsx("div",{className:"rsp-w-full rsp-h-full rsp-flex rsp-items-center rsp-justify-center",children:e.jsxs("div",{className:"rsp-text-center",children:[e.jsx("svg",{className:"rsp-w-12 rsp-h-12 rsp-mx-auto rsp-text-gray-400 rsp-mb-2",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:((l=a.carousel)==null?void 0:l.type)==="VIDEO"?e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"}):e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"})}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:"No media"})]})})}),e.jsx("div",{className:"rsp-px-4 rsp-py-3 rsp-flex-1 rsp-flex rsp-items-start",children:e.jsx("p",{className:"rsp-text-[13px] rsp-text-[#111b21] rsp-leading-[1.4] rsp-line-clamp-3",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:u?b(u):"Card body text..."})}),e.jsx("div",{className:"rsp-border-t rsp-border-gray-100 rsp-mt-auto",children:u&&u.buttons.length>0?e.jsx(e.Fragment,{children:u.buttons.map((m,d)=>e.jsx("div",{className:`rsp-px-4 rsp-py-3 rsp-text-center rsp-text-[14px] rsp-text-[#128C7E] rsp-font-medium rsp-break-words rsp-whitespace-pre-wrap ${d<u.buttons.length-1?"rsp-border-b rsp-border-gray-100":""}`,style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-center rsp-gap-2",children:[m.type==="URL"&&e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"})}),(m.type==="CALL"||m.type==="PHONE_NUMBER")&&e.jsx("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"})}),e.jsx("span",{className:"rsp-inline-block rsp-max-w-[180px] rsp-break-words rsp-break-all rsp-whitespace-pre-wrap rsp-text-center",children:m.text})]})},m.id))}):e.jsx("div",{className:"rsp-px-4 rsp-py-3 rsp-text-center rsp-text-xs rsp-text-gray-400",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:"No buttons"})})]})})(),a.carousel&&a.carousel.cards.length>1&&e.jsx("div",{className:"rsp-flex rsp-items-center rsp-justify-center rsp-gap-1.5 rsp-py-3 rsp-bg-white rsp-border-t rsp-border-gray-100",children:a.carousel&&a.carousel.cards.map((u,g)=>e.jsx("button",{onClick:()=>t(g),className:`rsp-w-2 rsp-h-2 rsp-rounded-full rsp-transition-all ${g===n?"rsp-bg-[#128C7E] rsp-w-6":"rsp-bg-gray-300 hover:rsp-bg-gray-400"}`},g))})]})})})}),a.buttons.length>0&&e.jsx("div",{className:"rsp-flex rsp-justify-start",children:e.jsx("div",{className:"rsp-bg-gradient-to-b rsp-from-white rsp-to-[#fafafa] rsp-rounded-[12px] rsp-overflow-hidden rsp-shadow-[0_2px_8px_rgba(0,0,0,0.08)] rsp-max-w-[220px] rsp-w-full rsp-border rsp-border-gray-100 rsp-animate-slide-up",children:e.jsx(fa,{buttons:a.buttons,onShowAllOptions:()=>r(!0)})})})]}):e.jsx("div",{className:"rsp-flex rsp-items-center rsp-justify-center rsp-h-[300px]",children:e.jsxs("div",{className:"rsp-text-center rsp-text-gray-500 rsp-animate-fade-in",children:[e.jsx("div",{className:"rsp-w-12 rsp-h-12 rsp-bg-gradient-to-br rsp-from-gray-50 rsp-to-gray-100 rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-mx-auto rsp-mb-2 rsp-shadow-md rsp-border rsp-border-gray-200",children:e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-gray-400",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M20 2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h4l4 4 4-4h4c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z"})})}),e.jsx("p",{className:"rsp-text-xs rsp-font-medium rsp-text-gray-600",children:"Start building your template"}),e.jsx("p",{className:"rsp-text-xs rsp-mt-1 rsp-text-gray-500",children:"Add content to see a live preview"})]})})})]}),e.jsxs("div",{className:"rsp-absolute rsp-bottom-0 rsp-left-0 rsp-right-0 rsp-h-[60px] rsp-bg-gradient-to-r rsp-from-[#F0F2F5] rsp-via-[#EBEDF0] rsp-to-[#E8EAED] rsp-flex rsp-items-center rsp-px-4 rsp-gap-2 rsp-border-t rsp-border-gray-200 rsp-shadow-[0_-1px_4px_rgba(0,0,0,0.05)]",children:[e.jsx("svg",{className:"rsp-w-6 rsp-h-6 rsp-text-[#54656F] rsp-opacity-60",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M9 11H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2zm2-7h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11z"})}),e.jsx("div",{className:"rsp-flex-1 rsp-bg-gradient-to-r rsp-from-white rsp-to-[#fafafa] rsp-rounded-[24px] rsp-px-4 rsp-py-2 rsp-flex rsp-items-center rsp-min-h-[36px] rsp-shadow-[0_1px_2px_rgba(0,0,0,0.1)] rsp-border rsp-border-gray-200",children:e.jsx("span",{className:"rsp-text-[13px] rsp-text-[#667781] rsp-opacity-70 rsp-font-normal",children:"Type a message"})}),e.jsx("div",{className:"rsp-w-9 rsp-h-9 rsp-bg-gradient-to-br rsp-from-[#25D366] rsp-via-[#20c55e] rsp-to-[#00A884] rsp-rounded-full rsp-flex rsp-items-center rsp-justify-center rsp-shadow-[0_2px_6px_rgba(37,211,102,0.3)] rsp-border rsp-border-[#20c55e] rsp-border-opacity-30",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-white rsp-drop-shadow-sm",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"})})})]}),s&&e.jsx("div",{className:"rsp-absolute rsp-inset-0 rsp-bg-black rsp-bg-opacity-40 rsp-z-30 rsp-flex rsp-items-end rsp-animate-fade-in",children:e.jsxs("div",{className:"rsp-w-full rsp-bg-[#F0F2F5] rsp-rounded-t-2xl rsp-shadow-lg rsp-animate-slide-up",children:[e.jsx("div",{className:"rsp-p-4 rsp-border-b rsp-border-gray-300",children:e.jsx("h4",{className:"rsp-font-bold rsp-text-center rsp-text-gray-800 rsp-text-md",children:a.body||"Options"})}),e.jsx("div",{className:"rsp-max-h-[250px] rsp-overflow-y-auto",children:a.buttons.map((u,g)=>e.jsx("div",{className:`rsp-p-4 rsp-text-center rsp-text-[15px] rsp-text-[#128C7E] rsp-font-medium ${g<a.buttons.length-1?"rsp-border-b rsp-border-gray-300":""}`,style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:u.text},u.id))}),e.jsx("div",{onClick:()=>r(!1),className:"rsp-mt-2 rsp-p-4 rsp-text-center rsp-font-bold rsp-text-[#128C7E] rsp-bg-white rsp-cursor-pointer rsp-shadow-inner",style:{fontFamily:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'},children:"Close"})]})})]})]})]})})})]})}const ve={name:"",category:"MARKETING",type:"BASIC",language:"en",enableClickTracking:!1,headerType:"NONE",headerText:"",body:"",footer:"",buttons:[]};function ua({editId:a,onCancel:s}){var g,l,m;const[r,n]=C.useState(ve),[t,p]=C.useState(!0),[i,w]=C.useState(!1),[b,f]=C.useState(!1),[v,S]=C.useState(null),[c,j]=C.useState({isOpen:!1});C.useState({isOpen:!1}),C.useEffect(()=>{if(v){const d=setTimeout(()=>{S(null)},5e3);return()=>clearTimeout(d)}},[v]);const E=async()=>{var d,y,U;try{if(f(!0),S(null),!r.name||!r.body)throw new Error("Template name and body are required");const R=localStorage.getItem("account"),o=R?JSON.parse(R):{apiKey:""};if(!o.apiKey)throw new Error("Please set your API key in the dashboard first");let k;if(a){const V=await Ke(o.apiKey,a,r);if(!V.success)throw new Error(V.message||"Update failed");k={status:"success",data:{details:[{template_name:r.name,template_id:a}]}}}else if(k=await We(o,r),k.status==="error")throw new Error(k.message);if(k.status==="error")throw new Error(k.message);j({isOpen:!0,templateName:(d=k.data)==null?void 0:d.details[0].template_name,templateId:(y=k.data)==null?void 0:y.details[0].template_id,template:(U=k.data)==null?void 0:U.template}),n(ve)}catch(R){S(R instanceof Error?R.message:"An error occurred while creating the template")}finally{f(!1)}};C.useEffect(()=>{if(!a)return;(async()=>{try{const y=localStorage.getItem("account"),U=y?JSON.parse(y):{apiKey:""};if(!U.apiKey)throw new Error("Please set your API key in the dashboard first");const R=await Je(U.apiKey,a);n(o=>({...o,...R}))}catch(y){console.error("Failed to load template for edit",y),S(y instanceof Error?y.message:"Failed to load template")}})()},[a]);const u=()=>{j({isOpen:!1}),s&&s()};return e.jsxs("div",{className:"rsp-min-h-screen rsp-bg-[#f5f7fc] rsp-rounded-lg rsp-shadow-sm",children:[e.jsxs("div",{className:"rsp-max-w-[1200px] rsp-mx-auto rsp-px-6 rsp-h-full",children:[e.jsx("div",{className:"rsp-py-6 rsp-border-b rsp-border-gray-200",children:e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-justify-between",children:[e.jsx("h1",{className:"rsp-text-2xl rsp-font-semibold rsp-text-[#0043ff]",children:a?"Edit Template":"Add Template"}),e.jsxs("div",{className:"rsp-flex rsp-items-center rsp-gap-3",children:[e.jsxs("button",{onClick:()=>p(!t),className:`rsp-flex rsp-items-center rsp-gap-2 rsp-px-4 rsp-py-2 rsp-rounded-md rsp-text-sm rsp-font-medium rsp-transition-colors
|
|
98
|
+
${t?"rsp-bg-blue-100 rsp-text-blue-700 rsp-border rsp-border-blue-200":"rsp-bg-gray-100 rsp-text-gray-700 rsp-border rsp-border-gray-200"}`,children:[e.jsxs("svg",{className:"rsp-w-4 rsp-h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:[e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 12a3 3 0 11-6 0 3 3 0 016 0z"}),e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"})]}),t?"Hide Preview":"Show Preview"]}),e.jsxs("button",{onClick:()=>s==null?void 0:s(),className:"rsp-flex rsp-items-center rsp-gap-1 rsp-text-sm rsp-font-medium rsp-text-[#0043ff] hover:rsp-text-[#0033cc] rsp-transition-colors rsp-bg-transparent rsp-border-0 rsp-cursor-pointer",children:[e.jsx(Ue,{className:"rsp-w-5 rsp-h-5 rsp-relative rsp-left-[6px]"}),"Back"]})]})]})}),e.jsxs("div",{className:`rsp-py-8 ${t?"rsp-grid xl:rsp-grid-cols-[1fr,400px] rsp-gap-8":""}`,children:[e.jsxs("div",{className:`rsp-space-y-8 ${t?"":"rsp-max-w-4xl rsp-mx-auto"}`,children:[e.jsxs("div",{className:"rsp-bg-white rsp-p-6 rsp-rounded-lg rsp-shadow-sm rsp-space-y-6",children:[e.jsxs("div",{children:[e.jsxs("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:["Template Name ",e.jsx("span",{className:"rsp-text-red-500",children:"*"})]}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("input",{type:"text",value:r.name,onChange:d=>n({...r,name:d.target.value.replace(/\s/g,"_").replace(/[^a-zA-Z0-9_]/g,"").replace(/_+/g,"_")}),onBlur:()=>w(!0),className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent",placeholder:"Template name cannot Have capital letters and space"}),e.jsx("div",{className:"rsp-absolute rsp-bottom-0 rsp-left-0 rsp-w-4 rsp-h-0.5 rsp-bg-red-500"})]}),!r.name&&i&&e.jsx("p",{className:"rsp-text-xs rsp-text-red-600 rsp-mt-1",children:"Template name is required."}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-1",children:"Template name cannot Have capital letters and space"})]}),e.jsxs("div",{className:"rsp-grid rsp-grid-cols-2 rsp-gap-6",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Category"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsxs("select",{value:r.category,onChange:d=>n({...r,category:d.target.value}),className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent rsp-appearance-none",children:[e.jsx("option",{value:"MARKETING",children:"Marketing"}),e.jsx("option",{value:"UTILITY",children:"Utility"})]}),e.jsx("div",{className:"rsp-absolute rsp-inset-y-0 rsp-right-0 rsp-flex rsp-items-center rsp-px-2 rsp-pointer-events-none",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-gray-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})}),e.jsx("div",{className:"rsp-absolute rsp-bottom-0 rsp-left-0 rsp-w-4 rsp-h-0.5 rsp-bg-red-500"})]}),e.jsx("p",{className:"rsp-text-xs rsp-text-gray-500 rsp-mt-1",children:"Choose Marketing for promotional communication and Utility for informational messages."})]}),e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Language"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsx("select",{value:r.language,onChange:d=>n({...r,language:d.target.value}),className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent rsp-appearance-none",children:Ye.map(d=>e.jsx("option",{value:d.value,children:d.label},d.value))}),e.jsx("div",{className:"rsp-absolute rsp-inset-y-0 rsp-right-0 rsp-flex rsp-items-center rsp-px-2 rsp-pointer-events-none",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-gray-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})}),e.jsx("div",{className:"rsp-absolute rsp-bottom-0 rsp-left-0 rsp-w-8 rsp-h-0.5 rsp-bg-red-500"})]})]})]}),e.jsxs("div",{className:"rsp-grid rsp-grid-cols-2 rsp-gap-6",children:[e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Template Type"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsxs("select",{value:r.type,onChange:d=>{const y=d.target.value;y==="CAROUSEL"&&!r.carousel?n({...r,type:y,carousel:{type:"IMAGE",cards:[{id:Math.random().toString(36).substr(2,9),headerType:"MEDIA",mediaType:"IMAGE",mediaUrl:"",body:"",buttons:[]}]}}):n({...r,type:y})},className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent rsp-appearance-none",children:[e.jsx("option",{value:"BASIC",children:"Basic"}),e.jsx("option",{value:"CAROUSEL",children:"Carousel"})]}),e.jsx("div",{className:"rsp-absolute rsp-inset-y-0 rsp-right-0 rsp-flex rsp-items-center rsp-px-2 rsp-pointer-events-none",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-gray-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})}),e.jsx("div",{className:"rsp-absolute rsp-bottom-0 rsp-left-0 rsp-w-4 rsp-h-0.5 rsp-bg-red-500"})]})]}),e.jsxs("div",{children:[e.jsx("label",{className:"rsp-block rsp-text-sm rsp-font-medium rsp-text-gray-700 rsp-mb-2",children:"Enable click tracking"}),e.jsxs("div",{className:"rsp-relative",children:[e.jsxs("select",{value:r.enableClickTracking.toString(),onChange:d=>n({...r,enableClickTracking:d.target.value==="true"}),className:"rsp-w-full rsp-px-0 rsp-py-2 rsp-border-0 rsp-border-b rsp-border-gray-300 rsp-text-sm focus:rsp-outline-none focus:rsp-border-blue-500 rsp-bg-transparent rsp-appearance-none",children:[e.jsx("option",{value:"false",children:"False"}),e.jsx("option",{value:"true",children:"True"})]}),e.jsx("div",{className:"rsp-absolute rsp-inset-y-0 rsp-right-0 rsp-flex rsp-items-center rsp-px-2 rsp-pointer-events-none",children:e.jsx("svg",{className:"rsp-w-4 rsp-h-4 rsp-text-gray-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})})]})]})]})]}),e.jsx("div",{className:"rsp-bg-white rsp-p-6 rsp-rounded-lg rsp-shadow-sm",children:e.jsx(pa,{template:r,setTemplate:n})}),e.jsxs("div",{className:"rsp-bg-white rsp-p-6 rsp-rounded-lg rsp-shadow-sm rsp-pt-6 rsp-border-t rsp-border-gray-200",children:[v&&e.jsxs("div",{className:"rsp-mb-4 rsp-flex rsp-items-start rsp-gap-3 rsp-p-4 rsp-rounded-lg rsp-bg-red-50 rsp-border-l-4 rsp-border-l-red-500 rsp-relative rsp-animate-fade-in",children:[e.jsx(me,{className:"rsp-w-5 rsp-h-5 rsp-text-red-500 rsp-flex-shrink-0 rsp-mt-0.5"}),e.jsxs("div",{children:[e.jsx("h3",{className:"rsp-text-sm rsp-font-medium rsp-text-red-800",children:"Error"}),e.jsx("p",{className:"rsp-mt-1 rsp-text-sm rsp-text-red-700",children:v})]}),e.jsx("button",{onClick:()=>S(null),className:"rsp-absolute rsp-top-2 rsp-right-2 rsp-p-1 hover:rsp-bg-red-100 rsp-rounded-full",children:e.jsx(ee,{className:"rsp-w-4 rsp-h-4 rsp-text-red-500"})})]}),e.jsx("div",{className:"rsp-flex rsp-gap-4",children:e.jsx("button",{onClick:E,disabled:b,className:`rsp-flex-1 rsp-py-3 rsp-px-6 rsp-rounded-md rsp-transition-colors rsp-text-white rsp-font-medium rsp-text-sm
|
|
99
|
+
${b?"rsp-bg-blue-600 rsp-cursor-not-allowed":"rsp-bg-blue-600 hover:rsp-bg-blue-700 active:rsp-bg-blue-800"}`,children:b?a?"Resubmitting for Approval...":"Submitting for Approval...":a?"Resubmit for Approval":"Submit for Approval"})})]})]}),t&&e.jsx("div",{children:e.jsx("div",{className:"rsp-sticky rsp-top-4",children:e.jsx(ha,{template:r})})})]})]}),e.jsx(ne,{isOpen:c.isOpen,onClose:u,title:"Success",children:e.jsxs("div",{className:"rsp-space-y-4",children:[e.jsx("div",{className:"rsp-text-center",children:e.jsx("p",{className:"rsp-text-green-600 rsp-font-medium rsp-mb-4",children:"Template created successfully!"})}),c.templateId&&e.jsxs("div",{className:"rsp-bg-gray-50 rsp-p-4 rsp-rounded-lg rsp-space-y-2",children:[e.jsxs("div",{className:"rsp-flex rsp-justify-between",children:[e.jsx("span",{className:"rsp-text-sm rsp-text-gray-600",children:"Template Name:"}),e.jsx("span",{className:"rsp-text-sm rsp-font-medium",children:c.templateName})]}),e.jsxs("div",{className:"rsp-flex rsp-justify-between",children:[e.jsx("span",{className:"rsp-text-sm rsp-text-gray-600",children:"Template ID:"}),e.jsx("span",{className:"rsp-text-sm rsp-font-medium rsp-font-mono",children:c.templateId})]}),((g=c.template)==null?void 0:g.meta_tid)&&e.jsxs("div",{className:"rsp-flex rsp-justify-between",children:[e.jsx("span",{className:"rsp-text-sm rsp-text-gray-600",children:"Meta TID:"}),e.jsx("span",{className:"rsp-text-sm rsp-font-medium rsp-font-mono",children:c.template.meta_tid})]}),((l=c.template)==null?void 0:l.status)&&e.jsxs("div",{className:"rsp-flex rsp-justify-between",children:[e.jsx("span",{className:"rsp-text-sm rsp-text-gray-600",children:"Status:"}),e.jsx("span",{className:`rsp-text-sm rsp-font-medium rsp-capitalize ${c.template.status==="pending"?"rsp-text-yellow-600":c.template.status==="approved"?"rsp-text-green-600":"rsp-text-red-600"}`,children:c.template.status})]}),((m=c.template)==null?void 0:m.quality)&&e.jsxs("div",{className:"rsp-flex rsp-justify-between",children:[e.jsx("span",{className:"rsp-text-sm rsp-text-gray-600",children:"Quality:"}),e.jsx("span",{className:"rsp-text-sm rsp-font-medium rsp-capitalize",children:c.template.quality})]})]})]})})]})}const ba=C.createContext({});function ga({apiKey:a,pConfig:s,children:r}){const n=C.useMemo(()=>({apiKey:a,resulMeta:s}),[a,s]),t=C.useRef(null);return C.useEffect(()=>{if(typeof window>"u"||a===void 0&&!s)return;let p={};try{const b=localStorage.getItem("account");b&&(p=JSON.parse(b))}catch(b){console.error("TrustSignalProvider: Failed to read account from storage",b)}const i={...p,...a!==void 0?{apiKey:a}:{},...s?{resulMeta:s}:{}},w=JSON.stringify(i);if(w!==t.current)try{localStorage.setItem("account",w),t.current=w}catch(b){console.error("TrustSignalProvider: Failed to persist account to storage",b)}},[a,s]),e.jsx(ba.Provider,{value:n,children:r})}exports.CreateTemplate=ua;exports.Dashboard=Fe;exports.TrustSignalProvider=ga;
|