https://boombam.app/assets/whatsapp-business-mockup-Bh0DAhVC.js

1import{K as re,r as z,j as e,bk as ie,dD as U,dE as Q,dF as Y,b$ as J,cq as A,x as oe,C as v,b as w,d as C,cV as K,e as k,ab as c,$ as X,a0 as Z,a1 as G,a2 as ee,a3 as o,ap as m,aF as p,bJ as de,b7 as se,s as me,D as xe,B as he,a4 as pe,S as ge}from"./index-CuSEeJFb.js";import{V as ue}from"./video-AMZtj4XD.js";import{E as je}from"./ellipsis-vertical-04pZ3iRl.js";import{C as Ne}from"./check-check-BVDNI4mA.js";import{M as te}from"./map-pin-DOxfmRxb.js";import{S as j}from"./shopping-bag-C66pVB-F.js";import{V as ae}from"./volume-2-bzvEFd58.js";import{M as ye}from"./mic-BSL7EuWM.js";import{G as fe}from"./grid-3x3-CB6J-yDX.js";/**
2 * @license lucide-react v0.453.0 - ISC
3 *
4 * This source code is licensed under the ISC license.
5 * See the LICENSE file in the root directory of this source tree.
6 */const be=re("Paperclip",[["path",{d:"m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48",key:"1u3ebp"}]]);function $e({register:n,setValue:F,watch:l,control:ve,creativeFormat:we,temperature:Ce,awarenessLevel:ke,businessProfile:x,isGeneratingField:h,onGenerateField:L,getValidationStatus:O}){const g=l("platformContent.messageText")||"",N=l("platformContent.welcomeMessage")||"";l("platformContent.businessHours");const y=l("platformContent.autoReplyMessage")||"",$=l("platformContent.contactButtonText")||"",d=l("platformContent.messageFormat")||"text",M=l("platformContent.quickReplyOptions")||["","",""],I=l("platformContent.catalogItemName")||"",le=l("platformContent.catalogItemPrice")||"",D=l("platformContent.catalogItemDescription")||"",B=l("platformContent.locationName")||"",T=l("platformContent.locationAddress")||"",q=l("platformContent.businessDescription")||"",ce=l("platformContent.businessCategory")||"",E=l("platformContent.autoReplyEnabled")||!1,H=l("platformContent.awayMessage")||"",P=l("platformContent.catalogEnabled")||!0,t={messageText:4096,businessName:25,welcomeMessage:160,autoReplyMessage:160,contactButtonText:20,quickReplyOption:20,catalogItemName:60,catalogItemDescription:300,locationName:256,locationAddress:1e3,businessDescription:512,awayMessage:160},a=(s,r,R)=>{if(O){const S=O(s,R);return{colorClass:S.status==="error"?"text-red-500":S.status==="warning"?"text-orange-500":"text-gray-500 dark:text-gray-400",message:S.message}}const _=r/R;return{colorClass:_>.9?"text-red-500":_>.7?"text-orange-500":"text-gray-500 dark:text-gray-400",message:`${r}/${R}`}},u=(x==null?void 0:x.businessName)||"Your Business",f=(x==null?void 0:x.logo)||"",V=u.split(" ").map(s=>s[0]).join("").toUpperCase().slice(0,2),ne={text:{name:"Text Message",icon:e.jsx(K,{className:"w-4 h-4"}),color:"text-gray-600"},rich_media:{name:"Rich Media (Image/Video)",icon:e.jsx(A,{className:"w-4 h-4"}),color:"text-blue-600"},location:{name:"Location",icon:e.jsx(te,{className:"w-4 h-4"}),color:"text-green-600"},contact_card:{name:"Contact Card",icon:e.jsx(J,{className:"w-4 h-4"}),color:"text-purple-600"},catalog_browser:{name:"Catalog Browser",icon:e.jsx(j,{className:"w-4 h-4"}),color:"text-orange-600"},quick_reply:{name:"Quick Reply Buttons",icon:e.jsx(fe,{className:"w-4 h-4"}),color:"text-indigo-600"}};z.useState(0),z.useState(!1);const W=[{id:1,name:I||"Product Name",price:le||"$29.99",description:D||"Product description here",image:"/api/placeholder/150/150?text=Product+1",inStock:!0},{id:2,name:"Featured Service",price:"$49.99",description:"Premium service offering",image:"/api/placeholder/150/150?text=Service",inStock:!0},{id:3,name:"Special Offer",price:"$19.99",description:"Limited time special deal",image:"/api/placeholder/150/150?text=Offer",inStock:!1},{id:4,name:"New Arrival",price:"$39.99",description:"Latest addition to our collection",image:"/api/placeholder/150/150?text=New",inStock:!0}],b=()=>new Date().toLocaleTimeString("en-US",{hour:"numeric",minute:"2-digit",hour12:!0}),i=(s,r)=>L?e.jsx(he,{type:"button",variant:"outline",size:"sm",onClick:()=>L(s),disabled:h==null?void 0:h(s),className:"ml-2 flex-shrink-0","data-testid":`button-generate-${s.replace(/\./g,"-")}`,children:h!=null&&h(s)?e.jsxs(e.Fragment,{children:[e.jsx(pe,{className:"w-3 h-3 animate-spin mr-1"}),"Generating..."]}):e.jsxs(e.Fragment,{children:[e.jsx(ge,{className:"w-3 h-3 mr-1"}),"Generate ",r]})}):null;return e.jsx("div",{className:"max-w-7xl mx-auto",children:e.jsx("div",{className:"max-w-sm mx-auto lg:max-w-4xl lg:mx-0",children:e.jsxs("div",{className:"lg:flex lg:space-x-6",children:[e.jsxs("div",{className:"bg-gray-100 dark:bg-gray-800 rounded-xl overflow-hidden shadow-xl lg:w-1/2",children:[e.jsxs("div",{className:"bg-[#25D366] text-white text-xs p-2 flex justify-between items-center","data-testid":"mobile-status-bar",children:[e.jsx("span",{children:"9:41"}),e.jsxs("div",{className:"flex space-x-1",children:[e.jsx("div",{className:"w-4 h-2 bg-white rounded-sm opacity-75"}),e.jsx("div",{className:"w-1 h-2 bg-white rounded-sm opacity-75"}),e.jsx("div",{className:"w-6 h-2 bg-white rounded-sm"})]})]}),e.jsxs("div",{className:"bg-[#25D366] text-white p-4 flex items-center justify-between","data-testid":"whatsapp-header",children:[e.jsxs("div",{className:"flex items-center space-x-3",children:[e.jsx(ie,{className:"w-5 h-5","data-testid":"button-back"}),e.jsx(U,{className:"w-10 h-10",children:f?e.jsx(Q,{src:f,alt:u}):e.jsx(Y,{className:"bg-white text-[#25D366] text-sm font-bold",children:V})}),e.jsxs("div",{children:[e.jsx("h3",{className:"font-semibold text-sm","data-testid":"text-business-name",children:u}),e.jsx("p",{className:"text-xs opacity-90","data-testid":"text-business-status",children:"Business Account"})]})]}),e.jsxs("div",{className:"flex space-x-4",children:[e.jsx(ue,{className:"w-5 h-5","data-testid":"button-video-call"}),e.jsx(J,{className:"w-5 h-5","data-testid":"button-voice-call"}),e.jsx(je,{className:"w-5 h-5","data-testid":"button-more-options"})]})]}),e.jsxs("div",{className:"bg-gray-50 dark:bg-gray-700 min-h-[400px] p-4 space-y-3",style:{backgroundImage:`url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 18" fill="%23f0f0f0"><text x="10" y="15" font-size="12" fill="%23d0d0d0">WhatsApp</text></svg>')`,backgroundRepeat:"repeat",backgroundSize:"200px 40px",backgroundOpacity:"0.1"},"data-testid":"chat-messages-area",children:[N&&e.jsx("div",{className:"flex justify-start mb-3",children:e.jsxs("div",{className:"max-w-xs bg-white dark:bg-gray-600 rounded-lg p-3 shadow-sm","data-testid":"message-welcome",children:[e.jsx("p",{className:"text-sm text-gray-800 dark:text-white",children:N}),e.jsx("div",{className:"flex justify-end mt-1",children:e.jsx("span",{className:"text-xs text-gray-500",children:b()})})]})}),e.jsx("div",{className:"flex justify-end mb-3",children:e.jsxs("div",{className:"max-w-xs bg-[#DCF8C6] rounded-lg p-3 shadow-sm","data-testid":"message-customer",children:[e.jsx("p",{className:"text-sm text-gray-800",children:"Hi! I'm interested in your products."}),e.jsxs("div",{className:"flex justify-end items-center mt-1",children:[e.jsx("span",{className:"text-xs text-gray-500 mr-1",children:b()}),e.jsx(Ne,{className:"w-3 h-3 text-blue-500"})]})]})}),e.jsx("div",{className:"flex justify-start mb-3",children:e.jsxs("div",{className:"max-w-xs bg-white dark:bg-gray-600 rounded-lg overflow-hidden shadow-sm","data-testid":"message-business-reply",children:[d==="text"&&e.jsx("div",{className:"p-3",children:e.jsx("p",{className:"text-sm text-gray-800 dark:text-white",children:g||"Thank you for your interest! How can we help you today?"})}),d==="rich_media"&&e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"bg-gray-200 h-32 flex items-center justify-center",children:[e.jsx(A,{className:"w-8 h-8 text-gray-400"}),e.jsx("span",{className:"ml-2 text-gray-500",children:"Image/Video"})]}),e.jsx("div",{className:"p-3",children:e.jsx("p",{className:"text-sm text-gray-800 dark:text-white",children:g||"Check out our latest collection!"})})]}),d==="location"&&e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"bg-green-100 p-4 flex items-center justify-center",children:[e.jsx(te,{className:"w-8 h-8 text-green-600"}),e.jsxs("div",{className:"ml-3",children:[e.jsx("p",{className:"font-semibold text-sm",children:B||"Our Location"}),e.jsx("p",{className:"text-xs text-gray-600",children:T||"123 Business St, City"})]})]}),e.jsx("div",{className:"p-3",children:e.jsx("p",{className:"text-sm text-gray-800 dark:text-white",children:"Visit us at our store!"})})]}),d==="contact_card"&&e.jsxs("div",{className:"p-3",children:[e.jsxs("div",{className:"flex items-center border-b pb-2 mb-2",children:[e.jsx(U,{className:"w-8 h-8 mr-3",children:f?e.jsx(Q,{src:f,alt:u}):e.jsx(Y,{className:"bg-[#25D366] text-white text-xs",children:V})}),e.jsxs("div",{children:[e.jsx("p",{className:"font-semibold text-sm",children:u}),e.jsx("p",{className:"text-xs text-gray-500",children:"Business Contact"})]})]}),e.jsx("p",{className:"text-sm text-gray-800 dark:text-white",children:"Here are our contact details!"})]}

6),d==="catalog_browser"&&P&&e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"p-3 border-b",children:[e.jsxs("div",{className:"flex items-center",children:[e.jsx(j,{className:"w-5 h-5 text-[#25D366] mr-2"}),e.jsx("p",{className:"font-semibold text-sm",children:"Our Catalog"})]}),e.jsx("p",{className:"text-xs text-gray-500 mt-1",children:"Browse our products"})]}),e.jsx("div",{className:"grid grid-cols-2 gap-2 p-3",children:W.slice(0,4).map((s,r)=>e.jsxs("div",{className:"border rounded-lg overflow-hidden","data-testid":`catalog-item-${r}`,children:[e.jsx("div",{className:"bg-gray-100 h-16 flex items-center justify-center",children:e.jsx(j,{className:"w-4 h-4 text-gray-400"})}),e.jsxs("div",{className:"p-2",children:[e.jsx("p",{className:"text-xs font-semibold truncate",children:s.name}),e.jsx("p",{className:"text-xs text-green-600 font-bold",children:s.price})]})]},s.id))})]}),d==="quick_reply"&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"p-3",children:e.jsx("p",{className:"text-sm text-gray-800 dark:text-white",children:g||"How would you like to proceed?"})}),e.jsx("div",{className:"p-3 pt-0 space-y-2",children:M.filter(s=>s.trim()).map((s,r)=>e.jsx("button",{className:"w-full text-left p-2 border border-[#25D366] text-[#25D366] rounded-lg text-sm hover:bg-green-50","data-testid":`quick-reply-${r}`,children:s||`Option ${r+1}`},r))})]}),e.jsx("div",{className:"flex justify-end items-center px-3 pb-2",children:e.jsx("span",{className:"text-xs text-gray-500",children:b()})})]})}),E&&y&&e.jsx("div",{className:"flex justify-start",children:e.jsxs("div",{className:"max-w-xs bg-gray-200 dark:bg-gray-600 rounded-lg p-3 shadow-sm","data-testid":"message-auto-reply",children:[e.jsxs("div",{className:"flex items-center mb-1",children:[e.jsx(ae,{className:"w-3 h-3 text-gray-500 mr-1"}),e.jsx("span",{className:"text-xs text-gray-500",children:"Auto-reply"})]}),e.jsx("p",{className:"text-sm text-gray-800 dark:text-white",children:y}),e.jsx("div",{className:"flex justify-end mt-1",children:e.jsx("span",{className:"text-xs text-gray-500",children:b()})})]})})]}),e.jsxs("div",{className:"bg-gray-100 dark:bg-gray-800 p-3 flex items-center space-x-2","data-testid":"message-input-area",children:[e.jsxs("div",{className:"flex space-x-2",children:[e.jsx(be,{className:"w-5 h-5 text-gray-500","data-testid":"button-attach"}),e.jsx(A,{className:"w-5 h-5 text-gray-500","data-testid":"button-camera"})]}),e.jsx("div",{className:"flex-1 bg-white dark:bg-gray-700 rounded-full px-4 py-2 flex items-center",children:e.jsx("span",{className:"text-sm text-gray-500 flex-1","data-testid":"text-message-placeholder",children:"Type a message..."})}),e.jsxs("div",{className:"flex items-center",children:[e.jsx(ye,{className:"w-5 h-5 text-gray-500 mr-2","data-testid":"button-voice-message"}),e.jsx(oe,{className:"w-5 h-5 text-[#25D366]","data-testid":"button-send"})]})]})]}),e.jsxs("div",{className:"mt-6 lg:mt-0 lg:w-1/2 space-y-6",children:[e.jsxs(v,{children:[e.jsx(w,{children:e.jsxs(C,{className:"flex items-center gap-2",children:[e.jsx(K,{className:"w-5 h-5"}),"Message Configuration"]})}),e.jsxs(k,{className:"space-y-4",children:[e.jsxs("div",{children:[e.jsx(c,{htmlFor:"messageFormat",children:"Message Format"}),e.jsxs(X,{value:d,onValueChange:s=>F("platformContent.messageFormat",s),"data-testid":"select-message-format",children:[e.jsx(Z,{"data-testid":"select-trigger-message-format",children:e.jsx(G,{placeholder:"Select message format"})}),e.jsx(ee,{children:Object.entries(ne).map(([s,r])=>e.jsx(o,{value:s,children:e.jsxs("div",{className:"flex items-center",children:[r.icon,e.jsx("span",{className:"ml-2",children:r.name})]})},s))})]})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx(c,{htmlFor:"messageText",children:"Message Text"}),i("platformContent.messageText","Message")]}),e.jsx(m,{...n("platformContent.messageText",{maxLength:t.messageText}),placeholder:"Enter your WhatsApp Business message...",className:"min-h-[100px]","data-testid":"input-message-text"}),e.jsxs("div",{className:"flex justify-between mt-1",children:[e.jsx("span",{className:a("messageText",g.length,t.messageText).colorClass+" text-xs",children:a("messageText",g.length,t.messageText).message}),e.jsxs("span",{className:"text-xs text-gray-500",children:["Max ",t.messageText," characters"]})]})]}),d==="quick_reply"&&e.jsxs("div",{className:"space-y-3",children:[e.jsx(c,{children:"Qu

6ick Reply Options"}),[0,1,2].map(s=>e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(p,{...n(`platformContent.quickReplyOptions.${s}`,{maxLength:t.quickReplyOption}),placeholder:`Option ${s+1}`,"data-testid":`input-quick-reply-${s}`}),i(`platformContent.quickReplyOptions.${s}`,`Option ${s+1}`)]}),e.jsx("span",{className:a(`quickReplyOptions.${s}`,(M[s]||"").length,t.quickReplyOption).colorClass+" text-xs",children:a(`quickReplyOptions.${s}`,(M[s]||"").length,t.quickReplyOption).message})]},s))]}),d==="location"&&e.jsxs("div",{className:"space-y-3",children:[e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center gap-2 mb-2",children:[e.jsx(c,{htmlFor:"locationName",children:"Location Name"}),i("platformContent.locationName","Location Name")]}),e.jsx(p,{...n("platformContent.locationName",{maxLength:t.locationName}),placeholder:"Your Business Location","data-testid":"input-location-name"}),e.jsx("span",{className:a("locationName",B.length,t.locationName).colorClass+" text-xs",children:a("locationName",B.length,t.locationName).message})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center gap-2 mb-2",children:[e.jsx(c,{htmlFor:"locationAddress",children:"Address"}),i("platformContent.locationAddress","Address")]}),e.jsx(m,{...n("platformContent.locationAddress",{maxLength:t.locationAddress}),placeholder:"Full business address","data-testid":"input-location-address"}),e.jsx("span",{className:a("locationAddress",T.length,t.locationAddress).colorClass+" text-xs",children:a("locationAddress",T.length,t.locationAddress).message})]})]})]})]}),e.jsxs(v,{children:[e.jsx(w,{children:e.jsxs(C,{className:"flex items-center gap-2",children:[e.jsx(de,{className:"w-5 h-5"}),"Business Profile"]})}),e.jsxs(k,{className:"space-y-4",children:[e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx(c,{htmlFor:"welcomeMessage",children:"Welcome Message"}),i("platformContent.welcomeMessage","Welcome Message")]}),e.jsx(m,{...n("platformContent.welcomeMessage",{maxLength:t.welcomeMessage}),placeholder:"Welcome to our business! How can we help you?","data-testid":"input-welcome-message"}),e.jsxs("div",{className:"flex justify-between mt-1",children:[e.jsx("span",{className:a("welcomeMessage",N.length,t.welcomeMessage).colorClass+" text-xs",children:a("welcomeMessage",N.length,t.welcomeMessage).message}),e.jsxs("span",{className:"text-xs text-gray-500",children:["Max ",t.welcomeMessage," characters"]})]})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx(c,{htmlFor:"businessHours",children:"Business Hours"}),i("platformContent.businessHours","Business Hours")]}),e.jsx(p,{...n("platformContent.businessHours"),placeholder:"Mon-Fri 9AM-6PM, Sat 10AM-4PM","data-testid":"input-business-hours"})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx(c,{htmlFor:"businessDescription",children:"Business Description"}),i("platformContent.businessDescription","Description")]}),e.jsx(m,{...n("platformContent.businessDescription",{maxLength:t.businessDescription}),placeholder:"Brief description of your business and services","data-testid":"input-business-description"}),e.jsx("span",{className:a("businessDescription",q.length,t.businessDescription).colorClass+" text-xs",children:a("businessDescription",q.length,t.businessDescription).message})]}),e.jsxs("div",{children:[e.jsx(c,{htmlFor:"businessCategory",children:"Business Category"}),e.jsxs(X,{value:ce,onValueChange:s=>F("platformContent.businessCategory",s),"data-testid":"select-business-category",children:[e.jsx(Z,{"data-testid":"select-trigger-business-category",children:e.jsx(G,{placeholder:"Select business category"})}),e.jsxs(ee,{children:[e.jsx(o,{value:"retail",children:"Retail & Shopping"}),e.jsx(o,{value:"restaurant",children:"Restaurant & Food"}),e.jsx(o,{value:"professional",children:"Professional Services"}),e.jsx(o,{value:"health",children:"Health & Wellness"}),e.jsx(o,{value:"education",children:"Education"}),e.jsx(o,{value:"automotive",children:"Automotive"}),e.jsx(o,{value:"real_estate",children:"Real Estate"}),e.jsx(o,{value:"beauty",children:"Beauty & Spa"}),e.jsx(o,{value:"travel",children:"Travel & Tourism"}),e.jsx(o,{value:"technology",children:"Technology"}),e.jsx(o,{value:"other",children:"Other"})]})]})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx(c,{htmlFor:"contactButtonText",children:"Contact Button Text"}),i("platformContent.contactButtonText","Button Text")]}),e.jsx(p,{...n("platformContent.contactButtonText",{maxLength:t.contactButtonText}),placeholder:"Contact Us","data-testid":"input-contact-button-text"}),e.jsx("span",{className:a("contactButtonText",$.length,t.contactButtonText).colorClass+" text-xs",children:a("contactButtonText",$.length,t.contactButtonText).message})]})]})]}),e.jsxs(v,{children:[e.jsx(w,{children:e.jsxs(C,{className:"flex items-center gap-2",children:[e.jsx(ae,{className:"w-5 h-5"}),"Auto-Reply Settings"]})}),e.jsxs(k,{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx("input",{type:"checkbox",...n("platformContent.autoReplyEnabled"),"data-testid":"checkbox-auto-reply-enabled",className:"rounded border-gray-300"}),e.jsx(c,{children:"Enable Auto-Reply"})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx(c,{htmlFor:"autoReplyMessage",children:"Auto-Reply Message"}),i("platformContent.autoReplyMessage","Auto-Reply")]}),e.jsx(m,{...n("platformContent.autoReplyMessage",{maxLength:t.autoReplyMessage}),placeholder:"Thanks for your message! We'll get back to you soon.",disabled:!E,"data-testid":"input-auto-reply-message"}),e.jsxs("div",{className:"flex justify-between mt-1",children:[e.jsx("span",{className:a("autoReplyMessage",y.length,t.autoReplyMessage).colorClass+" text-xs",children:a("autoReplyMessage",y.length,t.autoReplyMessage).message}),e.jsxs("span",{className:"text-xs text-gray-500",children:["Max ",t.autoReplyMessage," characters"]})]})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx(c,{htmlFor:"awayMessage",children:"Away Message"}),i("platformContent.awayMessage","Away Message")]}),e.jsx(m,{...n("platformContent.awayMessage",{maxLength:t.awayMessage}),placeholder:"We're currently away. We'll respond during business hours.","data-testid":"input-away-message"}),e.jsx("span",{className:a("awayMessage",H.length,t.awayMessage).colorClass+" text-xs",children:a("awayMessage",H.length,t.awayMessage).message})]})]})]}),e.jsxs(v,{children:[e.jsx(w,{children:e.jsxs(C,{className:"flex items-center gap-2",children:[e.jsx(j,{className:"w-5 h-5"}),"Business Catalog"]})}),e.jsxs(k,{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx("input",{type:"checkbox",...n("platformContent.catalogEnabled"),"data-testid":"checkbox-catalog-enabled",className:"rounded border-gray-300"}),e.jsx(c,{children:"Enable Product Catalog"})]}),P&&e.jsxs(e.Fragment,{children:[e.jsx(se,{}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("h4",{className:"font-semibold",children:"Featured Catalog Item"}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx(c,{htmlFor:"catalogItemName",children:"Item Name"}),i("platformContent.catalogItemName","Item Name")]}),e.jsx(p,{...n("platformContent.catalogItemName",{maxLength:t.catalogItemName}),placeholder:"Product or Service Name","data-testid":"input-catalog-item-name"}),e.jsx("span",{className:a("catalogItemName",I.length,t.catalogItemName).colorClass+" text-xs",children:a("catalogItemName",I.length,t.catalogItemName).message})]}),e.jsxs("div",{children:[e.jsx(c,{htmlFor:"catalogItemPrice",children:"Price"}),e.jsx(p,{...n("platformContent.catalogItemPrice"),placeholder:"$29.99","data-testid":"input-catalog-item-price"})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx(c,{htmlFor:"catalogItemDescription",children:"Description"}),i("platformContent.catalogItemDescription","Description")]}),e.jsx(m,{...n("platformContent.catalogItemDescription",{maxLength:t.catalogItemDescription}),placeholder:"Brief description of your product or service","data-testid":"input-catalog-item-description"}),e.jsx("span",{className:a("catalogItemDescription",D.length,t.catalogItemDescription).colorClass+" text-xs",children:a("catalogItemDescription",D.length,t.catalogItemDescription).message})]})]}),e.jsx(se,{}),e.jsxs("div",{children:[e.jsx("h4",{className:"font-semibold mb-3",children:"Catalog Preview"}),e.jsx("div",{className:"bg-gray-50 dark:bg-gray-700 rounded-lg p-4","data-testid":"catalog-preview",children:e.jsx("div",{className:"grid grid-cols-2 gap-3",children:W.map((s,r)=>e.jsxs("div",{className:"bg-white dark:bg-gray-600 rounded-lg overflow-hidden shadow-sm","data-testid":`catalog-preview-item-${r}`,children:[e.jsx("div",{className:"bg-gray-200 dark:bg-gray-500 h-20 flex items-center justify-center",children:e.jsx(j,{className:"w-6 h-6 text-gray-400"})}),e.jsxs("div",{className:"p-3",children:[e.jsx("h5",{className:"font-semibold text-sm truncate",children:s.name}),e.jsx("p",{className:"text-green-600 font-bold text-sm",children:s.price}),e.jsx("p",{className:"text-xs text-gray-500 line-clamp-2 mt-1",children:s.description}),e.jsxs("div",{className:"flex items-center justify-between mt-2",children:[e.jsx(me,{variant:s.inStock?"default":"secondary",className:"text-xs",children:s.inStock?"In Stock":"Out of Stock"}),e.jsx(xe,{className:"w-3 h-3 text-yellow-500 fill-current"})]})]})]},s.id))})})]})]})]})]})]})]})})})}export{$e as WhatsAppBusinessMockup};