@chaibuilder/sdk 1.2.82 → 1.2.84

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.
@@ -58,7 +58,7 @@
58
58
  outline: 1px solid ${a.length===1?"#42a1fc":"orange"} !important; outline-offset: -1px;
59
59
  }`)},[a,m]),React.useEffect(()=>{g.textContent=c?`[data-block-id="${c._id}"], [data-block-id="${c._id}"] > * { pointer-events: none !important; opacity: 0.6 !important}`:""},[c,g]),React.useEffect(()=>{f&&(f.textContent=i?`[data-style-id="${i}"]{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}`:"")},[i,a,f]),React.useEffect(()=>{h&&(h.textContent=`${lodashEs.map(l,({id:v})=>`[data-style-id="${v}"]`).join(",")}{
60
60
  outline: 1px solid #42a1fc !important; outline-offset: -1px;
61
- }`)},[l,h]),React.useEffect(()=>{d.querySelector("#drop-target-block").innerHTML=u?`[data-block-id="${u}"]{ outline: 1px dashed orange !important; outline-offset: -1px;}`:""},[u]),jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:(y||b)&&jsxRuntime.jsxRuntimeExports.jsx("link",{rel:"stylesheet",href:`https://fonts.googleapis.com/css2?family=${y?`${y.replace(/ /g,"+")}:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900`:""}${y&&b&&y!==b?"&":""}${b&&b!==y?`family=${b.replace(/ /g,"+")}:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900`:""}&display=swap`})})},useChaiExternalData=()=>jotai.useAtom(chaiExternalDataAtom),useCanvasSettings=()=>jotai.useAtom(canvasSettingsAtom),isVisibleAtBreakpoint=(r,n)=>{const a=["xs","sm","md","lg","xl","2xl"],o=a.indexOf(n),i=r.split(" ");let l=new Array(a.length).fill(!1);for(const c of i){let[u,d]=c.split(":");d||(d=u,u="xs");const p=a.indexOf(u);if(p<=o){const f=["block","flex","inline","inline-block","inline-flex","grid","table"],m=["hidden"];if(f.includes(d))for(let h=p;h<a.length;h++)l[h]=!0;else if(m.includes(d))for(let h=p;h<a.length;h++)l[h]=!1}}return l[o]},getSlots=r=>{const n={};return Object.keys(r).forEach(a=>{lodashEs.isString(r[a])&&r[a].startsWith(STRINGS.SLOT_KEY)&&(n[a]=r[a].replace(STRINGS.SLOT_KEY,"").split(","))}),n},generateClassNames=lodashEs.memoize(r=>{const n=r.replace(STRINGS.STYLES_KEY,"").split(",");return tailwindMerge.twMerge(n[0],n[1])});function getElementAttrs(r,n){return lodashEs.get(r,`${n}_attrs`,{})}function getStyleAttrs(r,n){const a={};return Object.keys(r).forEach(o=>{if(lodashEs.isString(r[o])&&r[o].startsWith(STRINGS.STYLES_KEY)){const i=generateClassNames(r[o]),l=getElementAttrs(r,o);a[o]={className:i,"data-style-prop":o,"data-block-parent":r._id,"data-style-id":`${o}-${r._id}`,...l};const c=lodashEs.has(l,"x-show")||lodashEs.has(l,"x-if");c&&(a.__isHidden=c&&!isVisibleAtBreakpoint(i,n))}}),a}function applyBindings(r,n){const a=lodashEs.get(r,"_bindings",{});return lodashEs.isEmpty(a)?{...r}:(lodashEs.each(a,(o,i)=>{lodashEs.isString(o)&&lodashEs.get(n,o,null)&&(r[i]=lodashEs.get(n,o,null))}),r)}function isDescendant(r,n,a){if(!lodashEs.find(a,{_id:r}))return!1;const i=lodashEs.filter(a,{_parent:r});return i.some(l=>l._id===n)?!0:i.some(l=>isDescendant(l._id,n,a))}function BlocksRendererStatic({blocks:r}){const[n]=useBlocksStore(),[a]=jotai.useAtom(xShowBlocksAtom),[o]=useCutBlockIds(),[i]=jotai.useAtom(draggedBlockAtom),[l]=jotai.useAtom(dropTargetBlockIdAtom),[,c]=useCanvasWidth(),[u]=useCanvasSettings(),d=React.useCallback(h=>getStyleAttrs(h,c),[c]),[p]=useChaiExternalData(),[f]=jotai.useAtom(inlineEditingActiveAtom),m=React.useCallback(h=>h.reduce((g,y)=>{const b=lodashEs.get(u,y,{});return{...g,...b}},{}),[u,n]);return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:React.Children.toArray(r.map((h,g)=>{if(f===h._id)return null;const y=getSlots(h),b={};lodashEs.isEmpty(y)||Object.keys(y).forEach(C=>{b[C]=React.Children.toArray(y[C].map(I=>jsxRuntime.jsxRuntimeExports.jsx(BlocksRendererStatic,{blocks:[lodashEs.find(n,{_id:I})]})))});const v=lodashEs.filter(n,{_parent:h._id});b.children=v.length?jsxRuntime.jsxRuntimeExports.jsx(BlocksRendererStatic,{blocks:v}):null;const x=runtime.getBlockComponent(h._type),E=lodashEs.get(x,"builderComponent",lodashEs.get(x,"component",null));if(lodashEs.isNull(E))return jsxRuntime.jsxRuntimeExports.jsx("noscript",{children:`<!-- ${h==null?void 0:h._type} not registered -->`});const R=lodashEs.has(x,"getBlockStateFrom")?x==null?void 0:x.getBlockStateFrom(h,n):[],A=m(R),S=d(h);if(lodashEs.get(S,"__isHidden",!1)&&!lodashEs.includes(a,h._id))return null;const w=i&&isDescendant(i._id,h._id,n);return jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{children:React.createElement(E,{blockProps:{...lodashEs.includes(a,h._id)?{"force-show":""}:{},"data-block-id":h._id,"data-block-type":h._type,...i?{"data-dnd":canAcceptChildBlock(h._type,i==null?void 0:i._type)?"yes":"no","data-dnd-dragged":i._id===h._id||w?"yes":"no"}:{},...l===h._id&&!w?{"data-drop":"yes"}:{},...lodashEs.includes(o,h._id)?{"data-cut-block":"yes"}:{}},index:g,...applyBindings(h,p),...lodashEs.omit(S,["__isHidden"]),...b,inBuilder:!0,blockState:A})})}))})}const useAllDataProviders=()=>React.useMemo(()=>runtime.getChaiDataProviders(),[]),BlocksExternalDataProvider=({children:r})=>{const[,n]=useChaiExternalData(),[a]=usePageDataProviders(),o=useAllDataProviders();return React.useEffect(()=>(n({}),lodashEs.each(a,i=>{const l=lodashEs.find(o,{providerKey:i.providerKey});if(l){const c=(l==null?void 0:l.mockFn)||(l==null?void 0:l.dataFn);c&&c(i.args).then(u=>n(d=>({...d,[i.providerKey]:u})))}}),()=>{lodashEs.each(a,i=>{n(l=>(delete l[i.providerKey],l))})}),[o,a,n]),jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:r})},StaticBlocksRenderer=()=>{const[r]=useBlocksStore(),n=lodashEs.isEmpty(r)?null:jsxRuntime.jsxRuntimeExports.jsx(BlocksExternalDataProvider,{children:jsxRuntime.jsxRuntimeExports.jsx(BlocksRendererStatic,{blocks:lodashEs.filter(r,a=>lodashEs.isEmpty(a._parent))})});return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:n})},AddBlockAtBottom=()=>{const{t:r}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsxs("button",{onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK}),className:"mt-1 block w-full rounded-md bg-gray-100 p-2 text-black hover:bg-gray-200 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-700",children:["+ ",r("add_block")]})},ResizableCanvasWrapper=({children:r,onMount:n,onResize:a})=>{const o=React.useRef(null),i=web.useDebouncedCallback(()=>{const{clientWidth:l}=o.current;a(l)},[o.current],100);return web.useResizeObserver(o.current,i,o.current!==null),React.useEffect(()=>{const{clientWidth:l}=o.current;n(l)},[]),jsxRuntime.jsxRuntimeExports.jsx("div",{id:"main-content",className:"h-full w-full p-10 pb-0",ref:o,children:r})},getElementByStyleId=(r,n)=>r.querySelector(`[data-style-id="${n}"]`),StaticCanvas=()=>{const[r]=jotai.useAtom(networkModeAtom),[n]=useCanvasWidth(),[,a]=useSelectedBlockIds(),o=useSelectedBlock(),[,i]=useHighlightBlockId(),l=React.useRef(null),c=React.useRef(null),[u,d]=React.useState({width:0,height:0}),p=useCanvasScale(u),[f,m]=React.useState([]),[,h]=React.useState([]),[,g]=jotai.useAtom(canvasIframeAtom),[y,b]=useSelectedStylingBlocks(),v=useBuilderProp("loading",!1),x=useBuilderProp("htmlDir","ltr"),E=S=>{d(w=>({...w,width:S}))};React.useEffect(()=>{if(!c.current)return;const{clientWidth:S,clientHeight:w}=c.current;d({width:S,height:w})},[c,n]);const R=(S,w=0)=>{const{top:C}=S.getBoundingClientRect();return C+w>=0&&C-w<=window.innerHeight};React.useEffect(()=>{var S,w;if(o&&o.type!=="Multiple"&&l.current){const C=getElementByDataBlockId(l.current.contentDocument,o._id);C&&(R(C)||(w=(S=l.current)==null?void 0:S.contentWindow)==null||w.scrollTo({top:C.offsetTop,behavior:"smooth"}),m([C]))}},[o]),React.useEffect(()=>{if(!lodashEs.isEmpty(y)&&l.current){const S=getElementByStyleId(l.current.contentDocument,lodashEs.first(y).id);h(S?[S]:[null])}else h([null])},[y]);const A=React.useMemo(()=>{let S=IframeInitialContent;return S=S.replace("__HTML_DIR__",x),r==="offline"&&(S=S.replace("https://old.chaibuilder.com/offline/tailwind.cdn.js","/offline/tailwind.cdn.js"),S=S.replace("https://unpkg.com/aos@next/dist/aos.css","/offline/aos.css"),S=S.replace("https://unpkg.com/aos@next/dist/aos.js","/offline/aos.js")),S},[r]);return jsxRuntime.jsxRuntimeExports.jsx(ResizableCanvasWrapper,{onMount:E,onResize:E,children:jsxRuntime.jsxRuntimeExports.jsx("div",{onClick:()=>{a([]),b([])},onMouseLeave:()=>setTimeout(()=>i(""),300),className:"relative mx-auto h-full w-full overflow-hidden",ref:c,children:jsxRuntime.jsxRuntimeExports.jsxs(ChaiFrame,{contentDidMount:()=>g(l.current),ref:l,id:"canvas-iframe",style:{...p,...lodashEs.isEmpty(p)?{width:`${n}px`}:{}},className:"relative mx-auto box-content h-full w-full max-w-full shadow-lg transition-all duration-300 ease-linear",initialContent:A,children:[jsxRuntime.jsxRuntimeExports.jsx(KeyboardHandler,{}),jsxRuntime.jsxRuntimeExports.jsx(BlockActionsStatic,{block:o,selectedBlockElement:lodashEs.first(f)}),jsxRuntime.jsxRuntimeExports.jsx(HeadTags,{model:"page"}),jsxRuntime.jsxRuntimeExports.jsx(reactWrapBalancer.Provider,{children:jsxRuntime.jsxRuntimeExports.jsxs(Canvas,{children:[v?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-full p-4",children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"h-full"})}):jsxRuntime.jsxRuntimeExports.jsx(StaticBlocksRenderer,{}),jsxRuntime.jsxRuntimeExports.jsx(AddBlockAtBottom,{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{})]})}),jsxRuntime.jsxRuntimeExports.jsx("div",{id:"placeholder",className:"pointer-events-none absolute z-[99999] max-w-full bg-green-500 transition-transform"})]})})})},StaticCanvas$1=StaticCanvas,FallbackError=()=>jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-full w-full rounded-md bg-red-200 p-4 text-red-500",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full w-full flex-col items-center justify-center",children:[jsxRuntime.jsxRuntimeExports.jsx("p",{className:"font-semibold",children:"Oops! Something went wrong."}),jsxRuntime.jsxRuntimeExports.jsx("p",{children:"Please try again."})]})}),CodeEditor$1=React.lazy(()=>Promise.resolve().then(()=>require("./CodeEditor--pV1ZdgM.cjs"))),CanvasArea=()=>{const[r]=useCodeEditor(),n=useBuilderProp("onError",lodashEs.noop);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex h-full max-h-full w-full flex-1 flex-col",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex h-full max-h-full flex-col overflow-hidden bg-gray-100/40 px-2",children:[jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"h-full"}),children:jsxRuntime.jsxRuntimeExports.jsx(reactErrorBoundary.ErrorBoundary,{fallback:jsxRuntime.jsxRuntimeExports.jsx(FallbackError,{}),onError:n,children:jsxRuntime.jsxRuntimeExports.jsx(StaticCanvas$1,{})})}),r?jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"h-full"}),children:jsxRuntime.jsxRuntimeExports.jsx(reResizable.Resizable,{enable:{top:!0,bottom:!1},className:"max-h-[400px] min-h-[200px]",children:jsxRuntime.jsxRuntimeExports.jsx(CodeEditor$1,{})})}):null]})})},CanvasArea$1=CanvasArea,ColorField=({value:r,onChange:n,id:a,onBlur:o})=>{const i=lodashEs.debounce(n,200),l=c=>i(c.target.value);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-1.5 flex items-center gap-x-3",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-3/5 flex-col",children:jsxRuntime.jsxRuntimeExports.jsx("input",{type:"color",className:"text-xs p-0",value:r,onBlur:({target:{value:c}})=>o(a,c),onChange:l})})})},FONTS=[{title:"Roboto",value:"Roboto"},{title:"Open Sans",value:"Open Sans"},{title:"Montserrat",value:"Montserrat"},{title:"Lato",value:"Lato"},{title:"Poppins",value:"Poppins"},{title:"Oswald",value:"Oswald"},{title:"Raleway",value:"Raleway"},{title:"Ubuntu",value:"Ubuntu"},{title:"Nunito",value:"Nunito"},{title:"Merriweather",value:"Merriweather"},{title:"Nunito Sans",value:"Nunito Sans"},{title:"Playfair Display",value:"Playfair Display"},{title:"Rubik",value:"Rubik"},{title:"Inter",value:"Inter"},{title:"Lora",value:"Lora"},{title:"Kanit",value:"Kanit"},{title:"Fira Sans",value:"Fira Sans"},{title:"Hind",value:"Hind"},{title:"Quicksand",value:"Quicksand"},{title:"Mulish",value:"Mulish"},{title:"Barlow",value:"Barlow"},{title:"Inconsolata",value:"Inconsolata"},{title:"Titillium Web",value:"Titillium Web"},{title:"Heebo",value:"Heebo"},{title:"IBM Plex Sans",value:"IBM Plex Sans"},{title:"DM Sans",value:"DM Sans"},{title:"Nanum Gothic",value:"Nanum Gothic"},{title:"Karla",value:"Karla"},{title:"Arimo",value:"Arimo"},{title:"Cabin",value:"Cabin"},{title:"Oxygen",value:"Oxygen"},{title:"Overpass",value:"Overpass"},{title:"Assistant",value:"Assistant"},{title:"Tajawal",value:"Tajawal"},{title:"Play",value:"Play"},{title:"Exo",value:"Exo"},{title:"Cinzel",value:"Cinzel"},{title:"Faustina",value:"Faustina"},{title:"Philosopher",value:"Philosopher"},{title:"Gelasio",value:"Gelasio"},{title:"Sofia Sans Condensed",value:"Sofia Sans Condensed"},{title:"Noto Sans Devanagari",value:"Noto Sans Devanagari"},{title:"Actor",value:"Actor"},{title:"Epilogue",value:"Epilogue"},{title:"Glegoo",value:"Glegoo"},{title:"Overlock",value:"Overlock"},{title:"Lustria",value:"Lustria"},{title:"Ovo",value:"Ovo"},{title:"Suranna",value:"Suranna"},{title:"Bebas Neue",value:"Bebas Neue"},{title:"Manrope",value:"Manrope"}],ThemeConfigPanel=({showHeading:r=!0,className:n=""})=>{const a=useBuilderProp("onSaveBrandingOptions",lodashEs.noop),[o,i]=useBrandingOptions(),[l]=useBlocksContainer(),c=React__namespace.useRef(o),{t:u}=reactI18next.useTranslation();React__namespace.useEffect(()=>()=>{lodashEs.isEqual(o,c.current)||a(c.current)},[]);const d=({formData:S},w)=>{w&&(i(S),c.current=S)},{bodyFont:p,headingFont:f,primaryColor:m,bodyTextDarkColor:h,bodyTextLightColor:g,bodyBgDarkColor:y,secondaryColor:b,bodyBgLightColor:v,roundedCorners:x}=o;let E={headingFont:iconBase.f({title:u("theme_config.heading_font"),default:f,options:FONTS}),bodyFont:iconBase.f({title:u("theme_config.body_font"),default:p,options:FONTS}),roundedCorners:iconBase.y({title:u("theme_config.rounded_corner"),default:parseInt(x||5,10)}),primaryColor:iconBase.s({title:u("theme_config.primary"),default:m}),secondaryColor:iconBase.s({title:u("theme_config.secondary"),default:b})};l||(E={...E,bodyBgLightColor:iconBase.s({title:u("theme_config.background"),default:v}),bodyTextLightColor:iconBase.s({title:u("theme_config.text_color"),default:h}),bodyBgDarkColor:iconBase.s({title:u("theme_config.background_dark_mode"),default:y}),bodyTextDarkColor:iconBase.s({title:u("theme_config.text_color_dark_mode"),default:g})});const R={type:"object",properties:{}},A={};return Object.keys(E).forEach(S=>{const w=E[S];return R.properties||(R.properties={}),R.properties[S]=w.schema,A[S]=w.uiSchema,!0}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:iconBase.cn("flex h-full w-full select-none flex-col",n),children:[r?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"rounded-md bg-background/30 p-1",children:jsxRuntime.jsxRuntimeExports.jsx("h1",{className:"px-1 font-semibold",children:u("Theme Configuration")})}):null,jsxRuntime.jsxRuntimeExports.jsx(Form,{widgets:{color:ColorField},idSeparator:".",autoComplete:"off",omitExtraData:!0,liveOmit:!0,liveValidate:!0,uiSchema:A,schema:R,formData:o,validator,onChange:d})]})},ThemeOptions=ThemeConfigPanel,TypeIcon=r=>{switch(r.type){case"Image":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ImageIcon,{});case"Heading":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.HeadingIcon,{});case"Text":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TextIcon,{});case"Link":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.Link1Icon,{});case"Video":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.VideoIcon,{});case"RichText":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CursorTextIcon,{});case"Button":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ButtonIcon,{});case"CustomHTML":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CodeIcon,{});case"Divider":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DividerHorizontalIcon,{});case"Icon":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.SketchLogoIcon,{});case"List":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.RowsIcon,{});case"Paragraph":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TextIcon,{});case"Row":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.RowsIcon,{});case"ListItem":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ColumnsIcon,{});case"LineBreak":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.SpaceBetweenVerticallyIcon,{});case"Form":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.GroupIcon,{});case"Checkbox":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CheckboxIcon,{});case"FormButton":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ButtonIcon,{});case"Input":case"TextArea":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.InputIcon,{});case"Radio":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.RadiobuttonIcon,{});case"Select":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DropdownMenuIcon,{});case"Table":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TableIcon,{});case"TableHead":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.BorderTopIcon,{});case"TableBody":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.BorderAllIcon,{});case"TableRow":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ViewHorizontalIcon,{});case"TableCell":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DragHandleHorizontalIcon,{});case"DataProvider":return jsxRuntime.jsxRuntimeExports.jsx(lucideReact.DatabaseIcon,{size:16});case"Box":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.BoxIcon,{});default:return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.BoxModelIcon,{})}},placeholderStyle={display:"flex",alignItems:"center",zIndex:1},DefaultCursor=React.memo(function({top:n,left:a}){const o={position:"absolute",pointerEvents:"none",top:n+"px",left:a+"px",right:0};return jsxRuntime.jsxRuntimeExports.jsx("div",{style:{...placeholderStyle,...o},children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-0.5 flex-1 rounded-[1px] bg-green-500"})})}),Overlay$1=React.memo(function({children:n,isDragging:a}){return a?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"pointer-events-none fixed left-0 top-0 z-[100] h-full w-full",children:n}):null}),DefaultDragPreview=React.memo(({id:r,isDragging:n,mouse:a})=>{const[o]=useBlocksStore(),i=React.useMemo(()=>o.find(c=>c._id===r),[o,r]),l=React.useMemo(()=>({transform:`translate(${(a==null?void 0:a.x)-10}px, ${(a==null?void 0:a.y)-10}px)`}),[a]);return a?jsxRuntime.jsxRuntimeExports.jsx("div",{children:jsxRuntime.jsxRuntimeExports.jsx(Overlay$1,{isDragging:n,children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"pointer-events-none absolute z-50 rounded border border-gray-200 bg-gray-100/80 font-semibold text-blue-600 shadow-md dark:border-gray-700 dark:bg-gray-800",style:l,children:jsxRuntime.jsxRuntimeExports.jsxs("button",{type:"button",className:"flex !cursor-grab items-center p-0.5","aria-label":`Type: ${i==null?void 0:i._type}`,children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"-mt-0.5 h-3 w-3",children:jsxRuntime.jsxRuntimeExports.jsx(TypeIcon,{type:i==null?void 0:i._type})}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"ml-2 truncate text-[11px]",children:(i==null?void 0:i._name)||(i==null?void 0:i._type)})]})})})}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:"hidden"})}),CopyPasteBlocks=()=>{const[r]=useSelectedBlockIds(),{canPaste:n,pasteBlocks:a}=usePasteBlocks(),[,o]=useCopyBlockIds(),{t:i}=reactI18next.useTranslation(),l=useSelectedBlock();return jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{disabled:!canDuplicateBlock(l==null?void 0:l._type),onClick:()=>o(r),className:"flex items-center gap-x-4 text-xs",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CopyIcon,{})," Copy"]}),n(r[0])&&jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{className:"flex items-center gap-x-4 text-xs",onClick:()=>{a(r)},children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CardStackIcon,{})," ",i("Paste")]})]})},CutBlocks=()=>{const[r]=useSelectedBlockIds(),[,n]=useCutBlockIds(),{t:a}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{className:"flex items-center gap-x-4 text-xs",onClick:()=>n(r),children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ScissorsIcon,{})," ",a("Cut")]})},RemoveBlocks=()=>{const[r]=useSelectedBlockIds(),n=useRemoveBlocks(),a=useSelectedBlock(),{t:o}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{disabled:!canDeleteBlock(a==null?void 0:a._type),className:"flex items-center gap-x-4 text-xs",onClick:()=>n(r),children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TrashIcon,{})," ",o("Remove")]})},BlockContextMenuContent=()=>{const{t:r}=reactI18next.useTranslation(),[n]=useSelectedBlockIds(),a=useDuplicateBlocks(),o=useSelectedBlock(),i=React.useCallback(()=>{a(n)},[n,a]);return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuContent,{className:"text-xs",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{disabled:!canAddChildBlock(o==null?void 0:o._type),className:"flex items-center gap-x-4 text-xs",onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK,data:o}),children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.PlusIcon,{size:"14"})," ",r("Add block")]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{disabled:!canDuplicateBlock(o==null?void 0:o._type),className:"flex items-center gap-x-4 text-xs",onClick:i,children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CardStackPlusIcon,{})," ",r("Duplicate")]}),jsxRuntime.jsxRuntimeExports.jsx(CutBlocks,{}),jsxRuntime.jsxRuntimeExports.jsx(CopyPasteBlocks,{}),jsxRuntime.jsxRuntimeExports.jsx(RemoveBlocks,{})]})},BlockContextMenu=({children:r})=>jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenu,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.ContextMenuTrigger,{asChild:!0,children:r}),jsxRuntime.jsxRuntimeExports.jsx(BlockContextMenuContent,{})]})}),defaultShortcuts=[{key:"ArrowDown",command:"selectNext"},{key:"ArrowUp",command:"selectPrev"},{key:"ArrowLeft",command:"selectParent",when:"isLeaf || isClosed"},{key:"ArrowLeft",command:"close",when:"isOpen"},{key:"ArrowRight",command:"open",when:"isClosed"},{key:"ArrowRight",command:"selectNext",when:"isOpen"},{key:"Home",command:"selectFirst"},{key:"End",command:"selectLast"}];function selectFirst(r){r.firstNode&&r.select(r.firstNode.id)}function selectLast(r){r.lastNode&&r.select(r.lastNode.id)}function selectNext(r){const n=r.selectedNodes[0].next||r.firstNode;r.select(n.id)}function selectPrev(r){const n=r.selectedNodes[0].prev||r.lastNode;r.select(n.id)}const selectParent=(r,n)=>{var o;const a=((o=r.selectedIds[0])==null?void 0:o.parent)||null;a&&n&&r.select(a.id)},open=(r,n)=>{const a=r.selectedNodes[0];a.isInternal&&n&&a.open()},close=(r,n)=>{const a=r.selectedNodes[0];a.isInternal&&n&&a.close()};function VscJson(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 16 16",fill:"currentColor"},child:[{tag:"path",attr:{fillRule:"evenodd",clipRule:"evenodd",d:"M6 2.984V2h-.09c-.313 0-.616.062-.909.185a2.33 2.33 0 0 0-.775.53 2.23 2.23 0 0 0-.493.753v.001a3.542 3.542 0 0 0-.198.83v.002a6.08 6.08 0 0 0-.024.863c.012.29.018.58.018.869 0 .203-.04.393-.117.572v.001a1.504 1.504 0 0 1-.765.787 1.376 1.376 0 0 1-.558.115H2v.984h.09c.195 0 .38.04.556.121l.001.001c.178.078.329.184.455.318l.002.002c.13.13.233.285.307.465l.001.002c.078.18.117.368.117.566 0 .29-.006.58-.018.869-.012.296-.004.585.024.87v.001c.033.283.099.558.197.824v.001c.106.273.271.524.494.753.223.23.482.407.775.53.293.123.596.185.91.185H6v-.984h-.09c-.2 0-.387-.038-.563-.115a1.613 1.613 0 0 1-.457-.32 1.659 1.659 0 0 1-.309-.467c-.074-.18-.11-.37-.11-.573 0-.228.003-.453.011-.672.008-.228.008-.45 0-.665a4.639 4.639 0 0 0-.055-.64 2.682 2.682 0 0 0-.168-.609A2.284 2.284 0 0 0 3.522 8a2.284 2.284 0 0 0 .738-.955c.08-.192.135-.393.168-.602.033-.21.051-.423.055-.64.008-.22.008-.442 0-.666-.008-.224-.012-.45-.012-.678a1.47 1.47 0 0 1 .877-1.354 1.33 1.33 0 0 1 .563-.121H6zm4 10.032V14h.09c.313 0 .616-.062.909-.185.293-.123.552-.3.775-.53.223-.23.388-.48.493-.753v-.001c.1-.266.165-.543.198-.83v-.002c.028-.28.036-.567.024-.863-.012-.29-.018-.58-.018-.869 0-.203.04-.393.117-.572v-.001a1.502 1.502 0 0 1 .765-.787 1.38 1.38 0 0 1 .558-.115H14v-.984h-.09c-.196 0-.381-.04-.557-.121l-.001-.001a1.376 1.376 0 0 1-.455-.318l-.002-.002a1.415 1.415 0 0 1-.307-.465v-.002a1.405 1.405 0 0 1-.118-.566c0-.29.006-.58.018-.869a6.174 6.174 0 0 0-.024-.87v-.001a3.537 3.537 0 0 0-.197-.824v-.001a2.23 2.23 0 0 0-.494-.753 2.331 2.331 0 0 0-.775-.53 2.325 2.325 0 0 0-.91-.185H10v.984h.09c.2 0 .387.038.562.115.174.082.326.188.457.32.127.134.23.29.309.467.074.18.11.37.11.573 0 .228-.003.452-.011.672-.008.228-.008.45 0 .665.004.222.022.435.055.64.033.214.089.416.168.609a2.285 2.285 0 0 0 .738.955 2.285 2.285 0 0 0-.738.955 2.689 2.689 0 0 0-.168.602c-.033.21-.051.423-.055.64a9.15 9.15 0 0 0 0 .666c.008.224.012.45.012.678a1.471 1.471 0 0 1-.877 1.354 1.33 1.33 0 0 1-.563.121H10z"},child:[]}]})(r)}function BsLightningFill(r){return iconBase.GenIcon({tag:"svg",attr:{fill:"currentColor",viewBox:"0 0 16 16"},child:[{tag:"path",attr:{d:"M5.52.359A.5.5 0 0 1 6 0h4a.5.5 0 0 1 .474.658L8.694 6H12.5a.5.5 0 0 1 .395.807l-7 9a.5.5 0 0 1-.873-.454L6.823 9.5H3.5a.5.5 0 0 1-.48-.641z"},child:[]}]})(r)}function TbEyeDown(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"path",attr:{d:"M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0"},child:[]},{tag:"path",attr:{d:"M12 18c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6"},child:[]},{tag:"path",attr:{d:"M19 16v6"},child:[]},{tag:"path",attr:{d:"M22 19l-3 3l-3 -3"},child:[]}]})(r)}const Node=React.memo(({node:r,style:n,dragHandle:a})=>{const o=useBuilderProp("outlineMenuItems",[]),{t:i}=reactI18next.useTranslation(),[l]=jotai.useAtom(canvasIframeAtom);let c=null;const u=r.children.length>0,{id:d,data:p,isSelected:f,willReceiveDrop:m,isDragging:h,isEditing:g,handleClick:y}=r,b=S=>{S.stopPropagation(),r.toggle()},v=S=>{S.isInternal&&(c=S.isOpen,S.isOpen&&S.close())},x=S=>{S.isInternal&&c!==null&&(c?S.open():S.close(),c=null)},E=S=>{S.stopPropagation(),r.isOpen||r.toggle(),y(S)};React.useEffect(()=>{const S=setTimeout(()=>{m&&!r.isOpen&&!h&&r.toggle()},500);return()=>clearTimeout(S)},[m,r,h]);const R=React.useMemo(()=>{const S=Object.keys(p),w=[];for(let C=0;C<S.length;C++)if(S[C].endsWith("_attrs")){const I=p[S[C]],j=Object.keys(I).join("|");j.match(/x-data/)&&w.push("data"),j.match(/x-on/)&&w.push("event"),j.match(/x-show|x-if/)&&w.push("show")}return w},[p]),A=(S,w)=>{const C=l.contentDocument||l.contentWindow.document,I=C.querySelector(`[data-block-id=${S}]`);I&&I.setAttribute("data-drop",w);const j=I.getBoundingClientRect(),k=l.getBoundingClientRect();j.top>=k.top&&j.left>=k.left&&j.bottom<=k.bottom&&j.right<=k.right||(C.documentElement.scrollTop=I.offsetTop-k.top)};return d===STRINGS.ROOT_TEMP_KEY?jsxRuntime.jsxRuntimeExports.jsxs("button",{onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK}),className:"mb-10 mt-5 w-full rounded bg-gray-100 p-1 hover:bg-gray-200",children:["+ ",i("add_block")]}):jsxRuntime.jsxRuntimeExports.jsx(BlockContextMenu,{id:d,children:jsxRuntime.jsxRuntimeExports.jsxs("div",{onClick:E,style:n,"data-node-id":d,ref:a,onDragStart:()=>v(r),onDragEnd:()=>x(r),onDragOver:S=>{S.preventDefault(),A(d,"yes")},onDragLeave:S=>{S.preventDefault(),A(d,"no")},onDrop:S=>{S.preventDefault(),A(d,"no")},className:iconBase.cn("group flex !h-full w-full items-center justify-between space-x-px !rounded py-px outline-none",f?"bg-blue-500 text-white":"text-gray-600 hover:bg-gray-200 dark:hover:bg-gray-800",m&&canAcceptChildBlock(p._type,"Icon")?"bg-green-200":"",h&&"opacity-20"),children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:`flex h-4 w-4 rotate-0 transform cursor-pointer items-center justify-center text-xs transition-transform duration-100 ${r.isOpen?"rotate-90":""}`,children:u&&jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:b,type:"button",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TriangleRightIcon,{})})}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"-mt-0.5 h-3 w-3",children:jsxRuntime.jsxRuntimeExports.jsx(TypeIcon,{type:p==null?void 0:p._type})}),g?jsxRuntime.jsxRuntimeExports.jsx(Input$1,{node:r}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"ml-2 flex items-center gap-x-1 truncate text-[11px]",onDoubleClick:S=>{S.stopPropagation(),r.edit(),r.deselect()},children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:(p==null?void 0:p._name)||(p==null?void 0:p._type.split("/").pop())}),R.includes("data")&&jsxRuntime.jsxRuntimeExports.jsx(VscJson,{className:"h-3 w-3 text-orange-600"}),R.includes("event")&&jsxRuntime.jsxRuntimeExports.jsx(BsLightningFill,{className:"h-3 w-3 text-yellow-500"}),R.includes("show")&&jsxRuntime.jsxRuntimeExports.jsx(TbEyeDown,{className:"h-3 w-3 text-orange-600"})]})]})]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"invisible flex items-center space-x-1 pr-2 group-hover:visible",children:[canAddChildBlock(p==null?void 0:p._type)?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK,data:{_id:d}}),className:"cursor-pointer rounded bg-transparent hover:bg-white hover:text-black",asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.PlusIcon,{size:"18"})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{className:"isolate z-[9999]",children:i("Add block")})]}):null,o.map(S=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{className:"cursor-pointer rounded bg-transparent hover:bg-white hover:text-blue-500",asChild:!0,children:React.createElement(S.item,{blockId:d})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{className:"isolate z-10",children:S.tooltip})]}))]})]})})}),Input$1=({node:r})=>{var n,a;return jsxRuntime.jsxRuntimeExports.jsx("input",{autoFocus:!0,className:"ml-2 w-full rounded-sm border border-black/30 bg-transparent px-1 text-[11px] outline-none",type:"text",defaultValue:((n=r.data)==null?void 0:n._name)||((a=r.data)==null?void 0:a._type),onFocus:o=>o.currentTarget.select(),onBlur:o=>r.submit(o.currentTarget.value),onKeyDown:o=>{o.key==="Enter"&&r.submit(o.currentTarget.value)}})},useCanMove=()=>{const[r]=useBlocksStore();return(n,a)=>{var l;const o=(l=lodashEs.find(r,{_id:a}))==null?void 0:l._type,i=lodashEs.first(n.map(c=>{var u;return(u=lodashEs.find(r,{_id:c}))==null?void 0:u._type}));return canAcceptChildBlock(o,i)}},ListTree=()=>{const[treeData]=jotai.useAtom(treeDSBlocks),[ids,setIds]=useSelectedBlockIds(),[cutBlocksIds]=useCutBlockIds(),updateBlockProps=useUpdateBlocksProps(),[,setStyleBlocks]=useSelectedStylingBlocks(),{moveBlocks}=useBlocksStoreUndoableActions(),canMove=useCanMove(),treeRef=React.useRef(null),[,setTreeRef]=jotai.useAtom(treeRefAtom),{t}=reactI18next.useTranslation(),clearSelection=()=>{setIds([]),setStyleBlocks([])},filteredTreeData=React.useMemo(()=>{const r=(a,o)=>a.filter(i=>!o.includes(i._id)).map(i=>({...i,children:i.children?r(i.children,o):[]}));return[...r(treeData,cutBlocksIds),{_type:STRINGS.ROOT_TEMP_KEY,_id:STRINGS.ROOT_TEMP_KEY,children:[]}]},[treeData,cutBlocksIds]);React.useEffect(()=>{setTreeRef(treeRef.current)},[treeRef.current]);const onRename=({id:r,name:n,node:a})=>{updateBlockProps([r],{_name:n},a.data._name)},onMove=({dragIds:r,parentId:n,index:a})=>{canMove(r,n)&&moveBlocks(r,n,a)},onSelect=r=>{if(r.length===0)return;const n=r[0]?r[0].id:"";setStyleBlocks([]),setIds([n])},onContextMenu=r=>{var o;r.preventDefault();const n=r.target,a=n.getAttribute("data-node-id")||((o=n.closest("[data-node-id]"))==null?void 0:o.getAttribute("data-node-id"));a&&(setStyleBlocks([]),setIds([a]))},debouncedDisableDrop=web.useDebouncedCallback(({parentNode:r,dragNodes:n})=>{var a;return(r==null?void 0:r.data._type)===STRINGS.ROOT_TEMP_KEY||!canAcceptChildBlock(r==null?void 0:r.data._type,(a=n[0])==null?void 0:a.data._type)},[],300),handleKeyDown=e=>{if(!treeRef.current)return;const tree=treeRef.current,selectedNode=tree.selectedNodes[0];if(!selectedNode)return;setIds[selectedNode.id],setStyleBlocks([]);const isLeaf=!selectedNode.isInternal,isClosed=!selectedNode.isOpen,isOpen=selectedNode.isOpen,shortcut=defaultShortcuts.find(s=>s.key===e.key&&(!s.when||eval(s.when)));if(shortcut)switch(e.preventDefault(),shortcut.command){case"selectNext":selectNext(tree);break;case"selectPrev":selectPrev(tree);break;case"selectParent":selectParent(tree,isLeaf||isClosed);break;case"close":close(tree,isOpen);break;case"open":open(tree,isClosed);break;case"selectFirst":selectFirst(tree);break;case"selectLast":selectLast(tree);break}};return lodashEs.isEmpty(treeData)?jsxRuntime.jsxRuntimeExports.jsx("div",{children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex h-full w-full items-center justify-center p-8 text-center",children:jsxRuntime.jsxRuntimeExports.jsxs("p",{className:"mb-1.5 text-sm text-gray-400",children:[t("page_is_empty"),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK}),variant:"default",size:"sm",children:["+ ",t("add_block")]})]})})}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:iconBase.cn("flex h-full select-none flex-col space-y-1"),onClick:()=>clearSelection(),children:jsxRuntime.jsxRuntimeExports.jsx("div",{id:"outline-view",className:"no-scrollbar h-full overflow-y-auto text-xs",onKeyDown:r=>{treeRef.current.isEditing||handleKeyDown(r)},children:jsxRuntime.jsxRuntimeExports.jsx(reactArborist.Tree,{ref:treeRef,height:window.innerHeight-160,className:"no-scrollbar !h-full max-w-full !overflow-y-auto !overflow-x-hidden",selection:ids[0]||"",onRename,openByDefault:!1,onMove,rowHeight:25,data:[...filteredTreeData],renderCursor:DefaultCursor,onSelect,childrenAccessor:r=>r.children,width:"100%",renderDragPreview:DefaultDragPreview,indent:10,onContextMenu,disableDrop:debouncedDisableDrop,idAccessor:"_id",children:Node})})})},Outline$1=ListTree,hasVideoEmbed=r=>{const n=/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^\/\n\s]+\/\S+\/|(?:v|e(?:mbed)?)\/|\S*?[?&]v=)|youtu\.be\/)([a-zA-Z0-9_-]{11})/,a=/(?:https?:\/\/)?(?:www\.)?(player)?.vimeo\.com/;return n.test(r)||a.test(r)},getVideoURLFromHTML=r=>{if(lodashEs.isEmpty(r))return r;const n=/<video[^>]+src=['"]([^'">]+)['"]/,a=/<iframe[^>]+src=['"]([^'">]+)['"]/,o=r.match(n),i=r.match(a),l=o?o[1]:i?i[1]:null,c=/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^\/\n\s]+\/\S+\/|(?:v|e(?:mbed)?)\/|\S*?[?&]v=)|youtu\.be\/)([a-zA-Z0-9_-]{11})/,u=/(?:https?:\/\/)?(?:www\.)?player.vimeo\.com/;return l&&(c.test(l)||u.test(l))?l:r},NAME_ATTRIBUTE="$name",ATTRIBUTE_MAP={img:{alt:"alt",width:"width",height:"height",src:"image"},video:{src:"url",autoplay:"controls.autoPlay",muted:"controls.muted",loop:"controls.loop",controls:"controls.widgets"},a:{href:"link.href",target:"link.target",type:""},input:{placeholder:"placeholder",required:"required",type:"inputType",name:"fieldName"},textarea:{placeholder:"placeholder",required:"required",type:"inputType",name:"fieldName"},select:{placeholder:"placeholder",required:"required",multiple:"multiple",name:"fieldName"}},shouldAddText=(r,n)=>r.children.length===1&&lodashEs.includes(["Heading","Paragraph","Span","ListItem","Button","Label","TableCell","Link"],n._type),getTextContent=r=>r.map(n=>n.type==="text"?lodashEs.get(n,"content",""):lodashEs.isEmpty(n.children)?"":getTextContent(n.children)).join(""),getSanitizedValue=r=>r===null?"":r,getAttrs=r=>{if(r.tagName==="svg")return{};const n={},a=ATTRIBUTE_MAP[r.tagName]||{},o=r.attributes;return lodashEs.forEach(o,({key:i,value:l})=>{if(i!==NAME_ATTRIBUTE)if(a[i]){if(r.tagName==="img"&&i==="src"&&!l.startsWith("http")){const c=lodashEs.find(r.attributes,{key:"width"}),u=lodashEs.find(r.attributes,{key:"height"});c&&u?l=`https://via.placeholder.com/${c==null?void 0:c.value}x${u==null?void 0:u.value}`:l="https://via.placeholder.com/150x150"}lodashEs.set(n,a[i],getSanitizedValue(l))}else lodashEs.includes(["style","class","srcset"],i)||(lodashEs.has(n,"styles_attrs")||(n.styles_attrs={}),lodashEs.startsWith(i,"@")&&(i=i.replace("@","x-on:")),n.styles_attrs[`${i}`]=getSanitizedValue(l))}),delete n.class,n},getStyles$1=(r,n="styles")=>{if(!r.attributes)return{[n]:`${STRINGS.STYLES_KEY},`};const a=lodashEs.find(r.attributes,{key:"class"});if(a){const o=a.value;return{[n]:`${STRINGS.STYLES_KEY},${o}`}}return{[n]:`${STRINGS.STYLES_KEY},`}},getBlockProps=r=>{switch(r.tagName){case"img":return{_type:"Image"};case"input":return{_type:"Input",showLabel:!1};case"hr":return{_type:"Divider"};case"br":return{_type:"LineBreak"};case"textarea":return{_type:"TextArea",showLabel:!1};case"audio":return{_type:"Audio"};case"canvas":return{_type:"Canvas"};case"video":case"iframe":return{_type:"CustomHTML"};case"svg":return{_type:"Icon"};case"select":return{_type:"Select",options:[]};case"option":return{_type:"Option"};case"ul":case"ol":case"dl":return{_type:"List",tag:r.tagName,_listType:r.tagName==="ol"?"list-decimal":"list-none"};case"li":case"dt":return{_type:"ListItem",tag:r.tagName};case"span":case"figcaption":case"legend":return{_type:"Span",tag:r.tagName};case"p":return{_type:"Paragraph",content:""};case"a":return{_type:"Link"};case"form":return{_type:"Form"};case"label":return{_type:"Label"};case"button":return{_type:"Button"};case"code":return{_type:"Code"};case"h1":case"h2":case"h3":case"h4":case"h5":case"h6":return{_type:"Heading",tag:r.tagName};case"table":return{_type:"Table"};case"tr":return{_type:"TableRow"};case"td":case"th":return{_type:"TableCell",tag:r.tagName};case"thead":return{_type:"TableHead"};case"tbody":return{_type:"TableBody"};case"tfoot":return{_type:"TableFooter"};default:const n=lodashEs.get(r,"children",[]).length>0?"Box":"EmptyBox";return{_type:n,tag:r.tagName,_name:n=="EmptyBox"||r.tagName==="div"?n:lodashEs.capitalize(r.tagName)}}},traverseNodes=(r,n=null)=>lodashEs.flatMapDeep(r,a=>{var l;if(a.type==="comment")return[];let o={_id:iconBase.generateUUID()};if(n&&(o._parent=n.block._id),a.type==="text")return lodashEs.isEmpty(lodashEs.get(a,"content",""))?[]:n&&shouldAddText(n.node,n.block)?(lodashEs.set(n,"block.content",lodashEs.get(a,"content","")),[]):{...o,_type:"Text",content:lodashEs.get(a,"content","")};if(o={...o,...getBlockProps(a),...getAttrs(a),...getStyles$1(a)},a.attributes){const c=a.attributes.find(u=>u.key===NAME_ATTRIBUTE);c&&(o._name=c.value)}if(o._type==="Input"){const c=o.inputType||"text";c==="checkbox"?lodashEs.set(o,"_type","Checkbox"):c==="radio"&&lodashEs.set(o,"_type","Radio")}else if(a.tagName==="video"||a.tagName==="iframe"){const c=himalaya.stringify([a]);return hasVideoEmbed(c)&&(lodashEs.set(o,"_type","Video"),lodashEs.set(o,"url",getVideoURLFromHTML(c)),lodashEs.set(o,"styles",`${STRINGS.STYLES_KEY},absolute top-0 left-0 w-full h-full`),lodashEs.set(o,"controls",{autoPlay:!1,muted:!0,loop:!1,controls:!1})),o.content=c,[o]}else if(a.tagName==="svg"){const c=lodashEs.find(a.attributes,{key:"height"}),u=lodashEs.find(a.attributes,{key:"width"}),d=lodashEs.get(c,"value")?`[${lodashEs.get(c,"value")}px]`:"24px",p=lodashEs.get(u,"value")?`[${lodashEs.get(u,"value")}px]`:"24px",f=lodashEs.get(lodashEs.find(a.attributes,{key:"class"}),"value","w-full h-full");return o.styles=`${STRINGS.STYLES_KEY}, ${iconBase.cn(`w-${p} h-${d}`,f)}`.trim(),a.attributes=lodashEs.filter(a.attributes,m=>!lodashEs.includes(["style","width","height","class"],m.key)),o.icon=himalaya.stringify([a]),[o]}else if(a.tagName=="option"&&n&&((l=n.block)==null?void 0:l._type)==="Select")return n.block.options.push({label:getTextContent(a.children),...getAttrs(a)}),[];const i=traverseNodes(a.children,{block:o,node:a});return[o,...i]}),getSanitizedHTML=r=>{const n=r.match(/<body[^>]*>[\s\S]*?<\/body>/);return(n&&n.length>0?n[0].replace(/<body/,"<div").replace(/<\/body>/,"</div>"):r).replace(/\s+/g," ").replaceAll("> <","><").replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi,"").trim()},getBlocksFromHTML=r=>{const n=himalaya.parse(getSanitizedHTML(r));return lodashEs.isEmpty(r)?[]:lodashEs.flatten(traverseNodes(n))},ImportHTML=({parentId:r})=>{const{t:n}=reactI18next.useTranslation(),[a,o]=React.useState(""),{addPredefinedBlock:i}=useAddBlock(),l=()=>{const c=getBlocksFromHTML(a);i([...c],r),o(""),emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK})};return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Card,{className:"border-border/0 p-0 shadow-none",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CardHeader,{className:"p-3",children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CardDescription,{children:n("html_snippet_description")})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CardContent,{className:"space-y-2 px-3 py-0",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-1",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Label,{htmlFor:"current",className:"text-sm",children:n("tailwind_html_snippet")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{autoFocus:!0,tabIndex:1,ref:c=>c&&c.focus(),onChange:c=>o(c.target.value),rows:12,value:a,placeholder:n("enter_code_snippet"),className:"resize-none overflow-x-auto whitespace-pre bg-gray-100 font-mono text-xs font-normal"})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CardFooter,{className:"flex flex-col justify-end p-3",children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:a.trim()==="",onClick:()=>l(),size:"sm",className:"w-full",children:n("import_html")})})]})},ImportHTML$1=ImportHTML,isBoolean=r=>typeof r=="boolean"||r instanceof Boolean,isNumber=r=>typeof r=="number"||r instanceof Number,isBigInt=r=>typeof r=="bigint"||r instanceof BigInt,isDate=r=>!!r&&r instanceof Date,isString=r=>typeof r=="string"||r instanceof String,isArray$4=r=>Array.isArray(r),isObject$1=r=>r instanceof Object&&r!==null;function useBool(r){const[n,a]=React.useState(r());return[n,()=>a(i=>!i),a]}let componentId=1;const generateNextId=()=>componentId++;function useComponentId(){const r=React.useRef();return r.current===void 0&&(r.current=`:jsnvw:${generateNextId()}:`),r.current}function ExpandableObject(r){let{field:n,value:a,data:o,lastElement:i,openBracket:l,closeBracket:c,level:u,style:d,shouldExpandNode:p,clickToExpandNode:f}=r;const m=React.useRef(!1),[h,g,y]=useBool(()=>p(u,a,n));React.useEffect(()=>{m.current?y(p(u,a,n)):m.current=!0},[p]);const b=h?d.collapseIcon:d.expandIcon,v=h?"collapse JSON":"expand JSON",x=useComponentId(),E=u+1,R=o.length-1,A=S=>{S.key===" "&&(S.preventDefault(),g())};return React.createElement("div",{className:d.basicChildStyle,role:"list"},React.createElement("span",{className:b,onClick:g,onKeyDown:A,role:"button",tabIndex:0,"aria-label":v,"aria-expanded":h,"aria-controls":h?x:void 0}),n&&(f?React.createElement("span",{className:d.clickableLabel,onClick:g,onKeyDown:A,role:"button",tabIndex:-1},n,":"):React.createElement("span",{className:d.label},n,":")),React.createElement("span",{className:d.punctuation},l),h?React.createElement("div",{id:x},o.map((S,w)=>React.createElement(DataRender,{key:S[0]||w,field:S[0],value:S[1],style:d,lastElement:w===R,level:E,shouldExpandNode:p,clickToExpandNode:f}))):React.createElement("span",{className:d.collapsedContent,onClick:g,onKeyDown:A,role:"button",tabIndex:-1,"aria-hidden":!0,"aria-label":v,"aria-expanded":h}),React.createElement("span",{className:d.punctuation},c),!i&&React.createElement("span",{className:d.punctuation},","))}function JsonObject(r){let{field:n,value:a,style:o,lastElement:i,shouldExpandNode:l,clickToExpandNode:c,level:u}=r;return ExpandableObject({field:n,value:a,lastElement:i||!1,level:u,openBracket:"{",closeBracket:"}",style:o,shouldExpandNode:l,clickToExpandNode:c,data:Object.keys(a).map(d=>[d,a[d]])})}function JsonArray(r){let{field:n,value:a,style:o,lastElement:i,level:l,shouldExpandNode:c,clickToExpandNode:u}=r;return ExpandableObject({field:n,value:a,lastElement:i||!1,level:l,openBracket:"[",closeBracket:"]",style:o,shouldExpandNode:c,clickToExpandNode:u,data:a.map(d=>[void 0,d])})}function JsonPrimitiveValue(r){let{field:n,value:a,style:o,lastElement:i}=r,l=a,c=o.otherValue;return a===null?(l="null",c=o.nullValue):a===void 0?(l="undefined",c=o.undefinedValue):isString(a)?(l=o.noQuotesForStringValues?a:`"${a}"`,c=o.stringValue):isBoolean(a)?(l=a?"true":"false",c=o.booleanValue):isNumber(a)?(l=a.toString(),c=o.numberValue):isBigInt(a)?(l=`${a.toString()}n`,c=o.numberValue):isDate(a)?l=a.toISOString():l=a.toString(),n===""&&(n='""'),React.createElement("div",{className:o.basicChildStyle,role:"listitem"},n&&React.createElement("span",{className:o.label},n,":"),React.createElement("span",{className:c},l),!i&&React.createElement("span",{className:o.punctuation},","))}function DataRender(r){const n=r.value;return isArray$4(n)?React.createElement(JsonArray,Object.assign({},r)):isObject$1(n)&&!isDate(n)?React.createElement(JsonObject,Object.assign({},r)):React.createElement(JsonPrimitiveValue,Object.assign({},r))}var styles$2={"container-base":"_GzYRV","punctuation-base":"_3eOF8",pointer:"_1MFti","expander-base":"_f10Tu _1MFti","expand-icon":"_1UmXx","collapse-icon":"_1LId0","collapsed-content-base":"_1pNG9 _1MFti","container-light":"_2IvMF _GzYRV","basic-element-style":"_2bkNM","label-light":"_1MGIk","clickable-label-light":"_2YKJg _1MGIk _1MFti","punctuation-light":"_3uHL6 _3eOF8","value-null-light":"_2T6PJ","value-undefined-light":"_1Gho6","value-string-light":"_vGjyY","value-number-light":"_1bQdo","value-boolean-light":"_3zQKs","value-other-light":"_1xvuR","collapse-icon-light":"_oLqym _f10Tu _1MFti _1LId0","expand-icon-light":"_2AXVT _f10Tu _1MFti _1UmXx","collapsed-content-light":"_2KJWg _1pNG9 _1MFti","container-dark":"_11RoI _GzYRV","expand-icon-dark":"_17H2C _f10Tu _1MFti _1UmXx","collapse-icon-dark":"_3QHg2 _f10Tu _1MFti _1LId0","collapsed-content-dark":"_3fDAz _1pNG9 _1MFti","label-dark":"_2bSDX","clickable-label-dark":"_1RQEj _2bSDX _1MFti","punctuation-dark":"_gsbQL _3eOF8","value-null-dark":"_LaAZe","value-undefined-dark":"_GTKgm","value-string-dark":"_Chy1W","value-number-dark":"_2bveF","value-boolean-dark":"_2vRm-","value-other-dark":"_1prJR"};const defaultStyles={container:styles$2["container-light"],basicChildStyle:styles$2["basic-element-style"],label:styles$2["label-light"],clickableLabel:styles$2["clickable-label-light"],nullValue:styles$2["value-null-light"],undefinedValue:styles$2["value-undefined-light"],stringValue:styles$2["value-string-light"],booleanValue:styles$2["value-boolean-light"],numberValue:styles$2["value-number-light"],otherValue:styles$2["value-other-light"],punctuation:styles$2["punctuation-light"],collapseIcon:styles$2["collapse-icon-light"],expandIcon:styles$2["expand-icon-light"],collapsedContent:styles$2["collapsed-content-light"],noQuotesForStringValues:!1},allExpanded=()=>!0,JsonView=r=>{let{data:n,style:a=defaultStyles,shouldExpandNode:o=allExpanded,clickToExpandNode:i=!1}=r;return React.createElement("div",{className:a.container},React.createElement(DataRender,{value:n,style:a,lastElement:!0,level:0,shouldExpandNode:o,clickToExpandNode:i}))};function getPathAndTypes(r){const n=[],a={};function o(i,l){lodashEs.forEach(l,(c,u)=>{const d=i?`${i}.${u}`:u,p=lodashEs.isArray(c)?"list":typeof c;n.push(d),a[d]=p==="string"?"text":p==="object"?"model":p,p==="object"&&!lodashEs.isArray(c)&&o(d,c)})}return o("",lodashEs.omit(r,["styles","_type","_id","_name","_bindings"])),{paths:n,pathsType:a}}const ViewData=({data:r,fullView:n})=>{const a=useBuilderProp("onError",lodashEs.noop);if(!r)return null;const o=typeof r;return n?typeof r=="object"?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-3"}),jsxRuntime.jsxRuntimeExports.jsx(reactErrorBoundary.ErrorBoundary,{fallback:jsxRuntime.jsxRuntimeExports.jsx(FallbackError,{}),onError:a,children:jsxRuntime.jsxRuntimeExports.jsx(JsonView,{data:r,shouldExpandNode:allExpanded,style:{...defaultStyles,container:"max-h-[40vh] overflow-y-auto text-[12px] leading-[1.5] tracking-wide font-mono",stringValue:"text-orange-600",label:"text-green-900 font-semibold pr-1 tracking-wider"}})})]}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"max-h-36 w-full overflow-y-auto overflow-x-hidden text-[12px] leading-4 text-gray-800/50",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:"font-medium text-gray-800/80",children:"Content: "}),r]}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-full overflow-hidden whitespace-nowrap text-[10px] leading-3 text-gray-800/50",children:lodashEs.truncate(o==="object"?JSON.stringify(r):r,{length:40})})},DataProvidersSuggester=({type:r,value:n="",setValue:a,data:o,onChange:i,dataType:l,appliedBindings:c})=>{const{paths:u,pathsType:d}=getPathAndTypes(o),p=r==="PROP"?runtime.getBlockComponent(o==null?void 0:o._type):{},f=r==="PROP",[m,h]=React.useState(!1),g=React.useMemo(()=>r==="PROP"?u.filter(y=>!lodashEs.includes(c,y)&&lodashEs.get(p,`props.${lodashEs.first(lodashEs.split(y,"."))}.binding`)):u.filter(y=>l===lodashEs.get(d,y,"")),[r,u,c,l,p]);return React.useEffect(()=>{n&&i(n)},[n,r]),jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center space-x-4",children:[jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-sm text-muted-foreground",children:lodashEs.startCase(lodashEs.toLower(r))}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Popover,{open:m,onOpenChange:h,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.PopoverTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{variant:"outline",size:"sm",className:` ${lodashEs.isEmpty(n)?"w-44 justify-center bg-blue-500 text-gray-100 hover:bg-blue-400 hover:text-white":"min-w-[350px] items-center justify-between"}`,children:n?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs("span",{className:"pr-8 text-sm",children:[f&&jsxRuntime.jsxRuntimeExports.jsx("span",{className:"mr-2 rounded-full bg-purple-100 px-2 py-0.5 text-[10px] text-purple-500",children:lodashEs.startCase(l)}),n]}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"cursor-pointer text-[9px] text-blue-400 underline hover:text-blue-700",children:"Change"})]}):jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:["+ Set ",lodashEs.startCase(lodashEs.toLower(r))]})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.PopoverContent,{className:"z-[999] min-w-[300px] p-0",side:"right",align:"start",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Command,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CommandInput,{placeholder:`Choose ${lodashEs.toLower(r)}...`}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.CommandList,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CommandEmpty,{children:"No results found."}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CommandGroup,{children:lodashEs.map(g,y=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.CommandItem,{value:y,className:`cursor-pointer ${f?"flex items-center justify-between":"flex flex-col items-start justify-start"}`,onSelect:b=>{a(lodashEs.find(g,v=>v===b)||null),h(!1)},children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Check,{className:`h-4 w-4 text-green-500 ${n===y?"":"opacity-0"}`}),y]}),f?jsxRuntime.jsxRuntimeExports.jsx("div",{children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"rounded-full bg-purple-100 px-2 py-0.5 text-[10px] text-purple-500",children:lodashEs.startCase(lodashEs.get(d,y,""))})}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:"pl-6",children:jsxRuntime.jsxRuntimeExports.jsx(ViewData,{data:lodashEs.get(o,y)})})]},y))})]})]})})]})]}),!f&&!lodashEs.isEmpty(n)&&jsxRuntime.jsxRuntimeExports.jsx("div",{className:"pt-2",children:jsxRuntime.jsxRuntimeExports.jsx(ViewData,{data:lodashEs.get(o,n,""),fullView:!0})})]})},AddBindingModalContent=({appliedBindings:r=[],onAddBinding:n,editMode:a,item:o})=>{const[i,l]=React.useState(a?o.key:""),[c,u]=React.useState(a?o.value:""),d=useSelectedBlock(),[p]=useChaiExternalData(),f=React.useCallback((g,y)=>{if(lodashEs.isEmpty(g))return"";{const b=lodashEs.get(y==="PROP"?d:p,g,"");if(lodashEs.isArray(b))return"list";const v=typeof b;return v==="string"?"text":v==="object"?"model":v}},[d,p]),[m,h]=React.useState(a?f(o.key,"PROP"):"");return jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DialogHeader,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogTitle,{children:"Add Data Binding"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogDescription,{className:"text-xs",children:"Add prop and path of binding. Click save when you're done."})]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex flex-col gap-1",children:[jsxRuntime.jsxRuntimeExports.jsx(DataProvidersSuggester,{type:"PROP",isDisabled:!1,placeholder:"Enter prop key",value:i,setValue:l,onChange:g=>{const y=f(g,"PROP");l(g),m!==y&&u(""),h(y)},data:d,dataType:m,appliedBindings:r}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-2"}),jsxRuntime.jsxRuntimeExports.jsx(DataProvidersSuggester,{type:"PATH",isDisabled:lodashEs.isEmpty(i),placeholder:"Enter data path",value:c,setValue:u,onChange:g=>{const y=f(g,"PATH");u(m===y?g:"")},data:p,dataType:m,appliedBindings:r})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogFooter,{children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{type:"submit",className:"mt-4",disabled:lodashEs.isEmpty(i)&&lodashEs.isEmpty(c),onClick:()=>n({key:i,value:c}),children:"Save"})})]})},AddBindingModal=({disabled:r,children:n,onAddBinding:a,appliedBindings:o,editMode:i=!0,item:l={}})=>{const[c,u]=React.useState(!1);return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Dialog,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogTrigger,{disabled:r,asChild:!0,onClick:()=>u(!0),children:n}),c&&jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogContent,{children:jsxRuntime.jsxRuntimeExports.jsx(AddBindingModalContent,{item:l,editMode:i,appliedBindings:o,onAddBinding:d=>{a(d),u(!1)}})})]})},NewDataBindingPair=({item:r,onAddBinding:n,onRemove:a,selectedBlock:o,dataProvider:i,appliedBindings:l})=>{const[c,u]=React.useState("string"),d=(p,f)=>{if(lodashEs.isEmpty(p))return"";{const m=lodashEs.get(f==="PROP"?o:i,p,"");if(lodashEs.isArray(m))return"list";const h=typeof m;return h==="string"?"text":h==="object"?"model":h}};return React.useEffect(()=>u(()=>d(r.key,"PROP")),[r.key]),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex flex-col rounded-md border border-gray-200 p-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"text-sm font-normal text-gray-500",children:r.key}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"font-medium leading-5",children:r.value}),jsxRuntime.jsxRuntimeExports.jsx(ViewData,{data:lodashEs.get(i,r.value,"")}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-end gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx(AddBindingModal,{editMode:!0,onAddBinding:n,appliedBindings:l,item:r,children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.EditIcon,{className:"mt-1 h-6 w-6 cursor-pointer rounded border border-blue-400 p-1 text-blue-400 duration-200 hover:scale-105 hover:bg-blue-400 hover:text-white"})}),jsxRuntime.jsxRuntimeExports.jsx(lucideReact.TrashIcon,{onClick:()=>a(),className:"mt-1 h-6 w-6 cursor-pointer rounded border border-red-400 p-1 text-red-400 duration-200 hover:scale-105 hover:bg-red-400 hover:text-white"})]}),!lodashEs.isEmpty(c)&&!lodashEs.isEmpty(r.key)&&jsxRuntime.jsxRuntimeExports.jsx("div",{className:"absolute right-0 top-1 mt-px flex h-4 items-center rounded-full px-2 text-[10px] font-medium text-purple-600",children:lodashEs.startCase(c)})]})},DataBindingSetting=({bindingData:r,onChange:n})=>{const a=useSelectedBlock(),[o]=useChaiExternalData(),i=runtime.getChaiDataProviders(),[l,c]=React.useState(lodashEs.map(r,(m,h)=>({key:h,value:m})));React.useEffect(()=>{c(lodashEs.map(r,(m,h)=>({key:h,value:m})))},[a==null?void 0:a._id,r]);const u=React.useMemo(()=>{if(lodashEs.isEmpty(o))return!0;if(lodashEs.isEmpty(l))return!1;const m=lodashEs.last(l);return lodashEs.isEmpty(m==null?void 0:m.key)||lodashEs.isEmpty(m==null?void 0:m.value)},[o,l]),d=m=>{const h=lodashEs.filter(l,g=>g.key!==m.key);c([...h,m]),f([...h,m])},p=m=>{const h=lodashEs.filter(l,(g,y)=>m!==y);f([...h])},f=React.useCallback((m=[])=>{if(c(m),lodashEs.isEmpty(m)){n({});return}const h={};lodashEs.forEach(m,g=>{!lodashEs.isEmpty(g==null?void 0:g.key)&&!lodashEs.isEmpty(g==null?void 0:g.value)&&lodashEs.set(h,g.key,g.value)}),n(h)},[n]);return lodashEs.isEmpty(i)?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-full items-center justify-center",children:jsxRuntime.jsxRuntimeExports.jsxs("p",{className:"mb-1.5 text-xs text-gray-500",children:["You have no data providers registered. Please add a data provider to your project. ",jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("a",{className:"text-blue-500",href:"https://chaibuilder.com/docs/registering-data-providers",target:"_blank",children:"Learn more"})]})}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-2",children:[lodashEs.map(l,(m,h)=>jsxRuntime.jsxRuntimeExports.jsx(NewDataBindingPair,{item:m,onAddBinding:d,onRemove:()=>p(h),selectedBlock:a,dataProvider:o,appliedBindings:lodashEs.map(l,"key")},m.key)),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{delayDuration:200,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{disabled:lodashEs.isEmpty(o),className:"w-full",children:jsxRuntime.jsxRuntimeExports.jsx(AddBindingModal,{disabled:u,appliedBindings:lodashEs.map(l,"key"),onAddBinding:d,children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:`w-full rounded-md px-5 py-1.5 text-xs font-medium duration-200 ${u?"cursor-not-allowed bg-gray-200 text-gray-400":"bg-blue-700/20 text-blue-800 hover:bg-blue-700/30"}`,children:lodashEs.isEmpty(o)?jsxRuntime.jsxRuntimeExports.jsx("small",{className:"text-[9.5px] text-gray-500",children:"No data provider has been set up for this page"}):"+ Add Data Binding"})})}),u&&jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{sideOffset:-55,className:"text-[11px]",children:lodashEs.isEmpty(o)?"No data provider has been set up for this page.":"Complete last added data binding to add more"})]})]})},DataBindingSetting$1=DataBindingSetting,BindingWidget=()=>jsxRuntime.jsxRuntimeExports.jsx("div",{className:"text-xs border rounded-sm p-1 mt-1 border-orange-500 text-orange-500 bg-orange-100",children:"Data binding is set for this field"}),getSvgMarkup=r=>{try{const n=document.getElementById("icon-picker-field"),a=document.createElement("div");ReactDOM.render(jsxRuntime.jsxRuntimeExports.jsx(IconPicker.IconPickerItem,{value:r}),a),n.appendChild(a),a.hidden=!0;let o=a.innerHTML;setTimeout(()=>n.removeChild(a),100);const l=new DOMParser().parseFromString(o,"image/svg+xml"),c=l.querySelector("svg");return c&&(c.removeAttribute("width"),c.removeAttribute("height")),new XMLSerializer().serializeToString(l)}catch(n){return console.error(n),""}},IconPickerField=({value:r,onChange:n})=>{const{t:a}=reactI18next.useTranslation(),o=i=>{n("<svg />");const l=getSvgMarkup(i);n(l)};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-1 flex h-20 items-center gap-x-2",id:"icon-picker-field",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"group relative h-12 w-12",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{dangerouslySetInnerHTML:{__html:r?r.replace("<svg",'<svg class="h-5 w-5"'):"<svg class='h-5 w-5' />"},className:"absolute left-1/2 top-1/2 z-0 -translate-x-1/2 -translate-y-1/2 transform cursor-pointer bg-white"}),jsxRuntime.jsxRuntimeExports.jsx(IconPicker,{value:r?"BiSolidGrid":null,onChange:o,pickButtonStyle:{position:"relative",height:"48px",width:"48px",border:"1px solid #BBBBBB",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"6px",backgroundColor:"transparent",zIndex:1},searchInputStyle:{backgroundColor:"transparent",width:"100%",border:"1px solid #BBBBBB",margin:"0px 10px",padding:"10px"}})]}),jsxRuntime.jsxRuntimeExports.jsx("textarea",{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",value:r,onChange:i=>n(i.target.value),className:"h-full w-full rounded-sm border border-foreground/20 px-2 py-1 text-xs shadow-sm focus:border-gray-500/80 focus:outline-none focus:ring-0",placeholder:a("choose_icon_or_enter_svg")})]})},UnsplashImages=React.lazy(()=>Promise.resolve().then(()=>require("./UnsplashImages-XI_yvkHW.cjs"))),UploadImages=React.lazy(()=>Promise.resolve().then(()=>require("./UploadImages-OLJkwBec.cjs"))),ImagesPanel=({isModalView:r=!1,onSelect:n=()=>{}})=>{const a=useBuilderProp("uploadMediaCallback"),o=useBuilderProp("unsplashAccessKey"),i=a===void 0,l=o===void 0,[c,u]=React.useState(l?"upload":i?"unsplash":"upload");return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-between rounded-md bg-background/30 p-1",children:jsxRuntime.jsxRuntimeExports.jsx("h1",{className:"px-1 font-semibold",children:r&&i?"Unsplash images":r?"Select or upload images":"Images"})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tabs,{value:c,onValueChange:d=>u(d),className:"flex h-full w-full flex-col py-2",children:[!(i||l)&&jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.TabsList,{className:"w-full",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"upload",className:"w-full",children:"Upload"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"unsplash",className:"w-full",children:"Unsplash"})]}),c==="unsplash"?jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsContent,{value:"unsplash",className:"flex h-full flex-col overflow-hidden",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-64 w-full animate-pulse bg-gray-100"}),children:jsxRuntime.jsxRuntimeExports.jsx(UnsplashImages,{isModalView:r,onSelect:n})})}):jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsContent,{value:"upload",className:"flex h-full flex-col overflow-hidden",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-64 w-full animate-pulse bg-gray-100"}),children:jsxRuntime.jsxRuntimeExports.jsx(UploadImages,{isModalView:r,onSelect:n})})})]})]})},ImagesPanel$1=ImagesPanel,ImagePickerModal=({children:r,onSelect:n})=>{const[a,o]=React.useState(!1),i=(...l)=>{n.call(void 0,...l),o(!1)};return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Dialog,{open:a,onOpenChange:l=>o(l),children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogTrigger,{asChild:!0,children:r}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogContent,{className:"flex h-3/4 max-w-5xl",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-full w-full",children:jsxRuntime.jsxRuntimeExports.jsx(ImagesPanel$1,{isModalView:!0,onSelect:i})})})]})},ImagePickerModal$1=ImagePickerModal,ImagePickerField=({value:r,onChange:n,id:a,onBlur:o})=>{const i=useBuilderProp("uploadMediaCallback"),l=useBuilderProp("unsplashAccessKey"),{t:c}=reactI18next.useTranslation(),u=i===void 0,d=l===void 0;return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-1.5 flex items-center gap-x-3",children:[r?jsxRuntime.jsxRuntimeExports.jsx("img",{src:r,className:"h-20 w-20 overflow-hidden rounded-md border object-cover",alt:""}):jsxRuntime.jsxRuntimeExports.jsx(ImagePickerModal$1,{onSelect:n,children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-20 w-20 cursor-pointer rounded-md border bg-[radial-gradient(#AAA,transparent_1px)] duration-300 [background-size:10px_10px] hover:border-gray-400"})}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex w-3/5 flex-col",children:[!(u&&d)&&jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(ImagePickerModal$1,{onSelect:n,children:jsxRuntime.jsxRuntimeExports.jsx("small",{className:"h-6 cursor-pointer rounded-md bg-primary px-2 py-1 text-center text-xs text-white hover:bg-gray-500 dark:bg-gray-700",children:r||!lodashEs.isEmpty(r)?c("replace_image"):c("choose_image")})}),jsxRuntime.jsxRuntimeExports.jsx("small",{className:"-pl-4 pt-2 text-center text-xs text-gray-600",children:"OR"})]}),jsxRuntime.jsxRuntimeExports.jsx("input",{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",type:"url",className:"text-xs",placeholder:c("enter_image_url"),value:r,onBlur:({target:{value:p}})=>o(a,p),onChange:p=>n(p.target.value)})]})]})},RichTextEditorField=({id:r,placeholder:n,value:a,onChange:o,onBlur:i})=>{const l={toolbar:[["bold","italic","underline","strike","blockquote"],[{list:"ordered"},{list:"bullet"}],[{color:[]},{background:[]},{align:[]}],["link","clean"]]},c=["header","font","list","bold","italic","underline","strike","blockquote","color","background","align","link","image"];return typeof window>"u"?null:jsxRuntime.jsxRuntimeExports.jsx(ReactQuill,{id:r,value:a,onBlur:u=>i(r,u),onChange:u=>o(u),modules:l,formats:c,placeholder:n,className:"mt-1 rounded-md"})},LinkField=({schema:r,formData:n,onChange:a})=>{const[o,i]=React.useState([]),l=useBuilderProp("getPages",()=>[]),{type:c="page",href:u="",target:d="self"}=n;return React.useEffect(()=>{(async()=>{const p=await l();i(p||[])})()},[]),jsxRuntime.jsxRuntimeExports.jsxs("div",{children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:"text-xs font-medium",children:(r==null?void 0:r.title)??"Link"}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col gap-y-1.5",children:[jsxRuntime.jsxRuntimeExports.jsx("select",{name:"type",value:c,onChange:p=>a({...n,type:p.target.value}),children:[{const:"page",title:"Open Page"},{const:"url",title:"Open URL"},{const:"email",title:"Compose Email"},{const:"telephone",title:"Call Phone"},{const:"scroll",title:"Scroll to element"}].map(p=>jsxRuntime.jsxRuntimeExports.jsx("option",{value:p.const,children:p.title},p.const))}),c==="page"?jsxRuntime.jsxRuntimeExports.jsxs("select",{name:"href",value:u,onChange:p=>a({...n,href:p.target.value||"#"}),children:[jsxRuntime.jsxRuntimeExports.jsx("option",{value:"",children:"Choose page"}),lodashEs.map(o,p=>jsxRuntime.jsxRuntimeExports.jsx("option",{value:p.slug,children:p.name},p.uuid))]}):jsxRuntime.jsxRuntimeExports.jsx("input",{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",name:"href",type:"text",value:u,onChange:p=>a({...n,href:p.target.value||"#"}),placeholder:c==="page"||c==="url"?"Enter URL":c==="scroll"?"#ElementID":"Enter detail"}),(c==="page"||c==="url")&&jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx("input",{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",type:"checkbox",defaultChecked:d==="_blank",className:"cursor-pointer rounded-md border border-border",onChange:()=>a({...n,target:d==="_blank"?"_self":"_blank"})}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"pt-1 text-xs",children:"Open in new tab"})]})]})]})},CodeEditor=({id:r,placeholder:n})=>{const{t:a}=reactI18next.useTranslation(),[,o]=useCodeEditor(),i=useSelectedBlock();if(typeof window>"u")return null;const l=r.replace("root.",""),c=lodashEs.get(i,l,""),u=()=>{const d=i==null?void 0:i._id;o({blockId:d,blockProp:l,placeholder:n,initialCode:lodashEs.get(i,l,c)})};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2 flex flex-col gap-y-1",children:[jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:u,className:"text-pretty w-[90%] max-w-full cursor-default truncate rounded border bg-white p-2 text-left text-[10px]",children:c.trim().length>0?c.substring(0,46):n||"Eg: <script>console.log('Hello, world!');<\/script>"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{onClick:u,size:"sm",variant:"outline",className:"w-fit",children:a("Open code editor")})]})},JSONForm=React.memo(({id:r,properties:n,formData:a,onChange:o})=>{const[i,l]=React.useState(a),c={type:"object",properties:{}},u={},{t:d}=reactI18next.useTranslation();Object.keys(n).forEach(f=>{const m=n[f];if(lodashEs.includes(["slot","styles"],m.type))return;const h=f;c.properties[h]=getBlockJSONFromSchemas(m,d),u[h]=getBlockJSONFromUISchemas(m)}),React.useEffect(()=>{l(a)},[r]);const p=web.useThrottledCallback(async({formData:f},m)=>{o({formData:f},m)},[o],1e3);return jsxRuntime.jsxRuntimeExports.jsx(Form,{widgets:{binding:BindingWidget,richtext:RichTextEditorField,icon:IconPickerField,image:ImagePickerField,code:CodeEditor},fields:{link:LinkField},idSeparator:".",autoComplete:"off",omitExtraData:!1,liveOmit:!1,liveValidate:!1,validator,uiSchema:u,schema:c,formData:i,onChange:({formData:f},m)=>{m&&(l(f),p({formData:f},m))}})}),CanvasSettings=()=>{const[r,n]=jotai.useAtom(xShowBlocksAtom),a=useSelectedBlock(),[,o]=useSelectedBlockIds(),{t:i}=reactI18next.useTranslation(),l=React.useMemo(()=>(a?JSON.stringify(a):"").includes('"x-show"'),[a]);if(!a||!l)return null;const c=r.includes(a._id);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"py-2 text-xs hover:no-underline",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2 border-b border-border bg-gray-200 px-4 py-2 font-normal",children:[a._name||a._type,"  ",i("visibility settings")]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center space-x-2 px-2 pt-2",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Switch,{id:"show-on-canvas",checked:c,onCheckedChange:u=>{u?(n(d=>[...d,a._id]),o([a._id])):n(d=>d.filter(p=>p!==a._id))}}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Label,{htmlFor:"show-on-canvas",children:i("Show on canvas")})]})]})};function BlockSettings(){const r=useSelectedBlock(),n=useUpdateBlocksPropsRealtime(),a=useUpdateBlocksProps(),o=runtime.getBlockComponent(r==null?void 0:r._type),i={...r},[l,c]=React.useState(i),u=useBuilderProp("dataBindingSupport",!1),d=({formData:g},y,b)=>{if(y&&(l==null?void 0:l._id)===r._id){const v=y.replace("root.","");a([r._id],{[v]:lodashEs.get(g,v)},b)}},p=React.useCallback(lodashEs.debounce(({formData:g},y,b)=>{d({formData:g},y,b),c(g)},1500),[r==null?void 0:r._id]),f=({formData:g},y)=>{if(y){const b=y.replace("root.","");n([r._id],convertDotNotationToObject(b,lodashEs.get(g,b.split(".")))),p({formData:g},y,{[b]:lodashEs.get(l,b)})}},m=lodashEs.keys(lodashEs.get(i,"_bindings",{})),h=React.useMemo(()=>{const g=lodashEs.cloneDeep(lodashEs.get(o,"props",{}));return u&&lodashEs.each(m,y=>delete g[y]),g},[o,m,u]);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"overflow-x-hidden",children:[u?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Accordion,{type:"multiple",defaultValue:["STATIC","BINDING"],className:"h-full w-full",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:"BINDING",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{className:"bg-gray-100 px-3 py-2 text-xs hover:no-underline",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:`h-[8px] w-[8px] rounded-full ${lodashEs.isEmpty(lodashEs.get(r,"_bindings",{}))?"bg-gray-300":"bg-blue-500"}`}),"Data Binding"]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionContent,{className:"px-4 pt-4",children:jsxRuntime.jsxRuntimeExports.jsx(DataBindingSetting$1,{bindingData:lodashEs.get(r,"_bindings",{}),onChange:g=>{d({formData:{_bindings:g}},"root._bindings")}})})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:"STATIC",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{className:"bg-gray-100 px-3 py-2 text-xs hover:no-underline",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-[8px] w-[8px] rounded-full bg-blue-500"}),"Static Content"]})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionContent,{className:"pt-4",children:[lodashEs.isEmpty(m)?null:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mx-4 mb-1 mt-0 rounded-sm border border-orange-500 bg-orange-100 p-1 text-xs text-orange-500",children:["Data binding is set for ",jsxRuntime.jsxRuntimeExports.jsx("b",{children:lodashEs.map(m,lodashEs.capitalize).join(", ")})," ",m.length===1?"property":"properties",". Remove data binding to edit static content."]}),jsxRuntime.jsxRuntimeExports.jsx(JSONForm,{id:r==null?void 0:r._id,onChange:f,formData:i,properties:h})]})]})]}):jsxRuntime.jsxRuntimeExports.jsx(JSONForm,{id:r==null?void 0:r._id,onChange:f,formData:i,properties:h}),jsxRuntime.jsxRuntimeExports.jsx(CanvasSettings,{})]})}function getChildBlocks(r,n,a){a.push(lodashEs.find(r,{_id:n}));const o=lodashEs.filter(r,{_parent:n});for(const i of o)a.push(...getBlockWithChildren(i._id,r));return a}const getBlockWithChildren=(r,n)=>{let a=[];return a=lodashEs.flattenDeep([...a,...getChildBlocks(n,r,a)]),a},askAiProcessingAtom=jotai.atom(!1),useAskAi=()=>{const[r,n]=jotai.useAtom(askAiProcessingAtom),[a,o]=React.useState(null),i=useBuilderProp("askAiCallBack",null),l=useStreamMultipleBlocksProps(),c=useUpdateMultipleBlocksProps(),[u]=useBlocksStore();return{askAi:React.useCallback(async(d,p,f,m)=>{if(i){n(!0),o(null);try{const h=d==="content"?lodashEs.cloneDeep(getBlockWithChildren(p,u)):[lodashEs.cloneDeep(u.find(v=>v._id===p))];lodashEs.set(h,"0._parent",null);const g=await i(d,f,h),{blocks:y,error:b}=g;if(b){o(b);return}d==="styles"?c(y):l(y),m&&m(g)}catch(h){o(h)}finally{n(!1),m&&m()}}},[i,n,u,c,l]),loading:r,error:a}};function FaMoon(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 512 512"},child:[{tag:"path",attr:{d:"M283.211 512c78.962 0 151.079-35.925 198.857-94.792 7.068-8.708-.639-21.43-11.562-19.35-124.203 23.654-238.262-71.576-238.262-196.954 0-72.222 38.662-138.635 101.498-174.394 9.686-5.512 7.25-20.197-3.756-22.23A258.156 258.156 0 0 0 283.211 0c-141.309 0-256 114.511-256 256 0 141.309 114.511 256 256 256z"},child:[]}]})(r)}function FaRecycle(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 512 512"},child:[{tag:"path",attr:{d:"M184.561 261.903c3.232 13.997-12.123 24.635-24.068 17.168l-40.736-25.455-50.867 81.402C55.606 356.273 70.96 384 96.012 384H148c6.627 0 12 5.373 12 12v40c0 6.627-5.373 12-12 12H96.115c-75.334 0-121.302-83.048-81.408-146.88l50.822-81.388-40.725-25.448c-12.081-7.547-8.966-25.961 4.879-29.158l110.237-25.45c8.611-1.988 17.201 3.381 19.189 11.99l25.452 110.237zm98.561-182.915l41.289 66.076-40.74 25.457c-12.051 7.528-9 25.953 4.879 29.158l110.237 25.45c8.672 1.999 17.215-3.438 19.189-11.99l25.45-110.237c3.197-13.844-11.99-24.719-24.068-17.168l-40.687 25.424-41.263-66.082c-37.521-60.033-125.209-60.171-162.816 0l-17.963 28.766c-3.51 5.62-1.8 13.021 3.82 16.533l33.919 21.195c5.62 3.512 13.024 1.803 16.536-3.817l17.961-28.743c12.712-20.341 41.973-19.676 54.257-.022zM497.288 301.12l-27.515-44.065c-3.511-5.623-10.916-7.334-16.538-3.821l-33.861 21.159c-5.62 3.512-7.33 10.915-3.818 16.536l27.564 44.112c13.257 21.211-2.057 48.96-27.136 48.96H320V336.02c0-14.213-17.242-21.383-27.313-11.313l-80 79.981c-6.249 6.248-6.249 16.379 0 22.627l80 79.989C302.689 517.308 320 510.3 320 495.989V448h95.88c75.274 0 121.335-82.997 81.408-146.88z"},child:[]}]})(r)}function FaSpinner(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 512 512"},child:[{tag:"path",attr:{d:"M304 48c0 26.51-21.49 48-48 48s-48-21.49-48-48 21.49-48 48-48 48 21.49 48 48zm-48 368c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zm208-208c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zM96 256c0-26.51-21.49-48-48-48S0 229.49 0 256s21.49 48 48 48 48-21.49 48-48zm12.922 99.078c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.491-48-48-48zm294.156 0c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.49-48-48-48zM108.922 60.922c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.491-48-48-48z"},child:[]}]})(r)}const SECONDS=10;function Countdown(){const[r,n]=React.useState(SECONDS),[a,o]=React.useState(!1);React.useEffect(()=>{if(a&&r>0){const d=setTimeout(()=>{n(r-.1)},100);return()=>clearTimeout(d)}else r<=0&&(o(!1),n(SECONDS))},[a,r]);const i=()=>{o(!0),n(SECONDS)};React.useEffect(()=>{r===SECONDS&&i()},[r]);const l=18,c=2*Math.PI*l,u=c*(1-(SECONDS-r)/SECONDS);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative h-4 w-4",children:[jsxRuntime.jsxRuntimeExports.jsxs("svg",{className:"h-full w-full",viewBox:"0 0 40 40",children:[jsxRuntime.jsxRuntimeExports.jsx("circle",{className:"text-gray-300",strokeWidth:"4",stroke:"currentColor",fill:"transparent",r:l,cx:"20",cy:"20"}),jsxRuntime.jsxRuntimeExports.jsx("circle",{className:"text-blue-600",strokeWidth:"4",strokeDasharray:c,strokeDashoffset:u,strokeLinecap:"round",stroke:"currentColor",fill:"transparent",r:l,cx:"20",cy:"20"})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"text-xs font-semibold",children:" "})})]})}const AskAIStyles=({blockId:r})=>{const{t:n}=reactI18next.useTranslation(),{askAi:a,loading:o,error:i}=useAskAi(),[l,c]=React.useState(""),u=React.useRef(null),d=React.useRef(null),[p,f]=React.useState();React.useEffect(()=>{var h;(h=u.current)==null||h.focus()},[]);const m=h=>{const{usage:g}=h||{};!i&&g&&f(g),d.current=setTimeout(()=>f(void 0),1e4),i||c("")};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"",children:[jsxRuntime.jsxRuntimeExports.jsx("h2",{className:"mb-1 text-sm font-semibold leading-none tracking-tight",children:n("ask_ai")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{ref:u,value:l,onChange:h=>c(h.target.value),placeholder:n("ask_ai_to_edit_styles"),className:"w-full border border-gray-400 focus:border-0",rows:3,onKeyDown:h=>{h.key==="Enter"&&(h.preventDefault(),d.current&&clearTimeout(d.current),f(void 0),a("styles",r,l,m))}}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"my-2 flex items-center gap-2",children:[o?null:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:l.trim().length<5||o,onClick:()=>{d.current&&clearTimeout(d.current),f(void 0),a("styles",r,l,m)},variant:"default",className:"w-fit",size:"sm",children:o?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"h-5 w-5 animate-spin"}),n("generating_please_wait")]}):n("edit_with_ai")}),o?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col gap-2",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Skeleton,{className:"flex w-full items-center space-x-1 px-4 py-1 pl-2",children:[jsxRuntime.jsxRuntimeExports.jsx(FaSpinner,{className:"h-4 w-4 animate-spin text-gray-500"}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs",children:n("generating_please_wait")})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{variant:"destructive",onClick:()=>stop(),className:"hidden w-fit",size:"sm",children:n("stop")})]}):null]}),p?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"max-w-full",children:jsxRuntime.jsxRuntimeExports.jsxs("p",{className:"mb-1 flex justify-between break-words rounded border border-blue-500 bg-blue-100 p-1 text-xs text-blue-500",children:[jsxRuntime.jsxRuntimeExports.jsxs("span",{children:[n("Total tokens used"),": ",p.totalTokens]}),jsxRuntime.jsxRuntimeExports.jsx(Countdown,{})]})}):null,jsxRuntime.jsxRuntimeExports.jsx("div",{className:"max-w-full",children:i&&jsxRuntime.jsxRuntimeExports.jsx("p",{className:"break-words rounded border border-red-500 bg-red-100 p-1 text-xs text-red-500",children:i.message})})]})},fuse=new Fuse(ALL_TW_CLASSES,{isCaseSensitive:!1,threshold:.2,minMatchCharLength:2,keys:["name"]});function ManualClasses(){var S;const{t:r}=reactI18next.useTranslation(),[n]=useSelectedStylingBlocks(),a=useSelectedBlock(),o=useAddClassesToBlocks(),i=useRemoveClassesFromBlocks(),[l]=useSelectedBlockIds(),c=useBuilderProp("askAiCallBack",null),[u,d]=React.useState(""),{toast:p}=contextMenu.useToast(),f=(S=lodashEs.first(n))==null?void 0:S.prop,m=lodashEs.reject((lodashEs.get(a,f,"").replace(STRINGS.STYLES_KEY,"").split(",").pop()||"").split(" "),lodashEs.isEmpty),h=()=>{const w=u.trim().toLowerCase().replace(/ +(?= )/g,"").split(" ");o(l,w,!0),d("")},[g,y]=React.useState([]),b=({value:w})=>{const C=w.trim().toLowerCase(),I=C.match(/.+:/g);let j=[];if(I&&I.length>0){const[k]=I,P=C.replace(k,"");j=fuse.search(P).map(B=>({...B,item:{...B.item,name:k+B.item.name}}))}else j=fuse.search(C);return y(lodashEs.map(j,"item"))},v=()=>{y([])},x=w=>w.name,E=w=>jsxRuntime.jsxRuntimeExports.jsx("div",{className:"rounded-md p-1",children:w.name}),R={autoComplete:"off",autoCorrect:"off",autoCapitalize:"off",spellCheck:!1,placeholder:r("enter_classes_separated_by_space"),value:u,onKeyDown:w=>{w.key==="Enter"&&u.trim()!==""&&h()},onChange:(w,{newValue:C})=>d(C),className:"w-full rounded-md text-xs px-2 hover:outline-0 bg-background border-border py-1"},A=()=>{if(navigator.clipboard===void 0){p({title:r("clipboard_not_supported"),description:r("please_use_chrome_firefox_or_safari"),variant:"destructive"});return}navigator.clipboard.writeText(m.join(" ")),p({title:r("copied"),description:r("classes_copied_to_clipboard")})};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:`flex ${g.length>0?"min-h-[300px]":"min-h-max"} w-full flex-col gap-y-1.5 overflow-y-auto pb-4`,children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-between gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:r("classes")}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CopyIcon,{onClick:A,className:"cursor-pointer"})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:r("copy_classes_to_clipboard")})})]})]}),c?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Popover,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.PopoverTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{variant:"default",className:"h-6 w-fit",size:"sm",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.SparklesIcon,{className:"h-4 w-4"}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"ml-2",children:r("ask_ai")})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.PopoverContent,{side:"left",className:"p-2",children:jsxRuntime.jsxRuntimeExports.jsx(AskAIStyles,{blockId:a==null?void 0:a._id})})]}):null]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex items-center gap-x-3",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"relative flex w-full items-center gap-x-3",children:jsxRuntime.jsxRuntimeExports.jsx(Autosuggest,{suggestions:g,onSuggestionsFetchRequested:b,onSuggestionsClearRequested:v,getSuggestionValue:x,renderSuggestion:E,inputProps:R,containerProps:{className:"relative h-8 w-full gap-y-1 py-1 border-gray-600"},theme:{suggestion:"bg-transparent",suggestionHighlighted:"!bg-gray-300 ",suggestionsContainerOpen:"absolute bg-gray-100 z-50 max-h-[230px] overflow-y-auto w-full border border-gray-600 rounded-md"}})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{variant:"outline",className:"h-6 border-gray-700",onClick:h,disabled:u.trim()==="",size:"sm",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.PlusIcon,{})})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-full flex-wrap gap-2 overflow-x-hidden",children:React__namespace.Children.toArray(m.map(w=>jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"group relative flex max-w-[260px] cursor-default items-center gap-x-1 truncate rounded border border-gray-300 bg-gray-200 p-px px-1.5 text-[11px] text-gray-600 hover:border-gray-300",children:[w,jsxRuntime.jsxRuntimeExports.jsx(reactIcons.Cross2Icon,{onClick:()=>i(l,[w]),className:"invisible absolute right-1 rounded-full bg-red-400 hover:text-white group-hover:visible group-hover:cursor-pointer"})]},w)))})]})}const BASIC_UNITS=["px","%","em","rem","ch","vh","vw"],FLEX_CHILD_SECTION={heading:"flex.heading",items:[{type:"arbitrary",label:"flex.basis",units:BASIC_UNITS,property:"flexBasis"},{type:"range",label:"flex.order",property:"order"},{type:"dropdown",label:"flex.flex",property:"flexGrowShrink"},{type:"dropdown",label:"flex.grow",property:"flexGrow"},{type:"dropdown",label:"flex.shrink",property:"flexShrink"}]},GRID_CHILD_SECTION={heading:"grid.heading",items:[{type:"range",label:"grid.col_span",property:"gridColSpan"},{type:"range",label:"grid.col_start",property:"gridColStart"},{type:"range",label:"grid.col_end",property:"gridColEnd"},{type:"range",label:"grid.row_span",property:"gridRowSpan"},{type:"range",label:"grid.row_start",property:"gridRowStart"},{type:"range",label:"grid.row_end",property:"gridRowEnd"},{type:"range",label:"grid.order",property:"order"}]},SETTINGS_SECTIONS=[{heading:"Styles",items:[{component:ManualClasses},{type:"arbitrary",label:"layout.width",units:BASIC_UNITS.concat("auto"),property:"width"},{type:"arbitrary",label:"layout.height",units:BASIC_UNITS.concat("auto"),property:"height"},{styleType:"multiple",label:"layout.margin",negative:!0,units:[...BASIC_UNITS,"auto"],options:[{key:"margin",label:"layout.margin_all"},{key:"marginX",label:"layout.margin_lr"},{key:"marginY",label:"layout.margin_tb"},{key:"marginTop",label:"layout.margin_top"},{key:"marginRight",label:"layout.margin_right"},{key:"marginBottom",label:"layout.margin_bottom"},{key:"marginLeft",label:"layout.margin_left"}]},{styleType:"multiple",label:"layout.padding",options:[{key:"padding",label:"layout.padding_all"},{key:"paddingX",label:"layout.padding_lr"},{key:"paddingY",label:"layout.padding_tb"},{key:"paddingTop",label:"layout.padding_top"},{key:"paddingRight",label:"layout.padding_right"},{key:"paddingBottom",label:"layout.padding_bottom"},{key:"paddingLeft",label:"layout.padding_left"}]},{styleType:"accordion",heading:"Typography",items:[{type:"dropdown",property:"textAlign",label:"typography.align"},{type:"dropdown",property:"fontFamily",label:"typography.font"},{type:"arbitrary",property:"fontSize",label:"typography.size",units:BASIC_UNITS},{type:"arbitrary",property:"lineHeight",label:"typography.height",units:BASIC_UNITS.concat("-")},{type:"range",property:"fontWeight",label:"typography.weight"},{type:"color",property:"textColor",label:"typography.color"}]},{styleType:"accordion",heading:"Background",items:[{type:"color",label:"background.bgcolor",property:"backgroundColor"},{type:"dropdown",label:"background.attachment",property:"backgroundAttachment"},{type:"dropdown",label:"background.clipping",property:"backgroundClip"},{type:"dropdown",label:"background.origin",property:"backgroundOrigin"},{type:"dropdown",label:"background.position",property:"backgroundPosition"},{type:"dropdown",label:"background.repeat",property:"backgroundRepeat"},{type:"dropdown",label:"background.size",property:"backgroundSize"}]}]}];BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("auto"),[...BASIC_UNITS],BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("-");const EDITOR_ICONS={"not-italic":()=>jsxRuntime.jsxRuntimeExports.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9 3H11V5H9V11H11V13H5V11H7V5H5V3H9Z",fill:"white"})}),visible:reactIcons.EyeOpenIcon,invisible:reactIcons.EyeClosedIcon,hidden:reactIcons.EyeClosedIcon,gap:reactIcons.BorderAllIcon,gapX:reactIcons.WidthIcon,gapY:reactIcons.HeightIcon,spaceX:reactIcons.WidthIcon,spaceY:reactIcons.HeightIcon,overscroll:reactIcons.BorderAllIcon,overscrollX:reactIcons.WidthIcon,overscrollY:reactIcons.HeightIcon,overflow:reactIcons.BorderAllIcon,overflowX:reactIcons.WidthIcon,overflowY:reactIcons.HeightIcon,top:reactIcons.ArrowUpIcon,right:reactIcons.ArrowRightIcon,bottom:reactIcons.ArrowDownIcon,left:reactIcons.ArrowLeftIcon,inset:reactIcons.BorderAllIcon,insetX:reactIcons.WidthIcon,insetY:reactIcons.HeightIcon,border:reactIcons.BorderAllIcon,borderX:reactIcons.WidthIcon,borderY:reactIcons.HeightIcon,borderTop:reactIcons.ArrowUpIcon,borderRight:reactIcons.ArrowRightIcon,borderBottom:reactIcons.ArrowDownIcon,borderLeft:reactIcons.ArrowLeftIcon,borderRadius:reactIcons.BorderAllIcon,borderRadiusX:reactIcons.WidthIcon,borderRadiusY:reactIcons.HeightIcon,borderRadiusTop:reactIcons.ArrowUpIcon,borderRadiusRight:reactIcons.ArrowRightIcon,borderRadiusBottom:reactIcons.ArrowDownIcon,borderRadiusLeft:reactIcons.ArrowLeftIcon,borderRadiusTopLeft:reactIcons.ArrowTopLeftIcon,borderRadiusTopRight:reactIcons.ArrowTopRightIcon,borderRadiusBottomRight:reactIcons.ArrowBottomRightIcon,borderRadiusBottomLeft:reactIcons.ArrowBottomLeftIcon,divideXWidth:reactIcons.WidthIcon,divideYWidth:reactIcons.HeightIcon,scale:reactIcons.BorderAllIcon,scaleX:reactIcons.WidthIcon,scaleY:reactIcons.HeightIcon,skewX:reactIcons.WidthIcon,skewY:reactIcons.HeightIcon,translateX:reactIcons.WidthIcon,translateY:reactIcons.HeightIcon,padding:reactIcons.BorderAllIcon,paddingX:reactIcons.WidthIcon,paddingY:reactIcons.HeightIcon,paddingTop:reactIcons.ArrowUpIcon,paddingRight:reactIcons.ArrowRightIcon,paddingBottom:reactIcons.ArrowDownIcon,paddingLeft:reactIcons.ArrowLeftIcon,margin:reactIcons.BorderAllIcon,marginX:reactIcons.WidthIcon,marginY:reactIcons.HeightIcon,marginTop:reactIcons.ArrowUpIcon,marginRight:reactIcons.ArrowRightIcon,marginBottom:reactIcons.ArrowDownIcon,marginLeft:reactIcons.ArrowLeftIcon,textLeft:reactIcons.AlignLeftIcon,textCenter:reactIcons.AlignCenterHorizontallyIcon,textRight:reactIcons.AlignRightIcon,textJustify:reactIcons.StretchHorizontallyIcon,italic:reactIcons.FontItalicIcon,underline:reactIcons.UnderlineIcon,overline:reactIcons.OverlineIcon,uppercase:reactIcons.LetterCaseUppercaseIcon,block:()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M2 2H14V14H2V2ZM1 1H15V15H1V1Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M7 4H4V12H7V4ZM9 4H12V12H9V4Z",fill:"currentColor"})]}),"float-right":()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{d:"M8 4H16V12H8V4Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M0 4H6V6H0V4ZM0 7H6V9H0V7ZM4 10H0V12H4V10Z",fill:"currentColor"})]}),"float-left":()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{d:"M0 4H8V12H0V4Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M10 4H16V6H10V4ZM10 7H16V9H10V7ZM14 10H10V12H14V10Z",fill:"currentColor"})]}),"float-none":reactIcons.Cross2Icon,fixed:()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M15 2H14V4H13V5H14V6H15V2ZM10 5V4H9V2H1V8H2V5H10ZM7 4V3H5V4H7ZM4 4V3H2V4H4ZM1 13H7V14H1V13Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11 2H10V3H11V6H12V3H13V2H11ZM2 9H1V12H2V11H7V10H2V9ZM15 7H8V14H15V7Z",fill:"currentColor"})]}),absolute:()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M14 2H15V6H14V2ZM9 3V2H1V8H2V3H9ZM7 13H1V14H7V13Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11 2H10V3H11V6H12V3H13V2H11ZM2 9H1V12H2V11H7V10H2V9ZM15 7H8V14H15V7Z",fill:"currentColor"})]}),relative:()=>jsxRuntime.jsxRuntimeExports.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11 2H9V3H11V6H12V3H14V2H11ZM2 8H1V13H2V11H7V10H2V8ZM15 7H8V14H15V7Z",fill:"currentColor"})}),sticky:()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{d:"M12.9998 7C13.6558 7 14.2937 6.78498 14.8158 6.38787C15.338 5.99076 15.7156 5.43345 15.8908 4.80128C16.066 4.16912 16.0292 3.49694 15.7859 2.8877C15.5427 2.27846 15.1065 1.76573 14.5441 1.42804C13.9817 1.09034 13.3241 0.946293 12.672 1.01795C12.02 1.08961 11.4094 1.37303 10.9337 1.8248C10.4581 2.27658 10.1436 2.8718 10.0385 3.51932C9.93341 4.16685 10.0434 4.83097 10.3518 5.41L6.88176 8.88C6.80034 8.96122 6.73572 9.05769 6.69158 9.16388C6.64744 9.27008 6.62465 9.38393 6.62451 9.49894C6.62437 9.61395 6.64689 9.72785 6.69077 9.83416C6.73465 9.94046 6.79904 10.0371 6.88026 10.1185C6.96149 10.1999 7.05795 10.2645 7.16415 10.3087C7.27035 10.3528 7.3842 10.3756 7.4992 10.3758C7.61421 10.3759 7.72812 10.3534 7.83442 10.3095C7.94072 10.2656 8.03734 10.2012 8.11876 10.12L11.5888 6.648C12.0088 6.873 12.4888 7 12.9988 7H12.9998Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M9.535 2H1V14H15V7.465C14.69 7.645 14.355 7.783 14 7.875V13H2V5H9.126C8.86504 3.98486 9.01223 2.90789 9.536 2H9.535ZM7 3V4H5V3H7ZM4 3V4H2V3H4Z",fill:"currentColor"})]}),static:reactIcons.Cross1Icon},StyleContext=React.createContext({canReset:!1,canChange:!0}),BlockStyleProvider=({children:r,canReset:n=!1,canChange:a=!0})=>jsxRuntime.jsxRuntimeExports.jsx(StyleContext.Provider,{value:{canReset:n,canChange:a},children:r}),DropDownChoices=({label:r,property:n,onChange:a})=>{const o=React.useMemo(()=>lodashEs.get(CLASSES_LIST,`${n}.classes`,[""]),[n]),i=useCurrentClassByProperty(n),l=React.useMemo(()=>lodashEs.get(i,"cls",""),[i]),{canChange:c}=React.useContext(StyleContext),u=/\[.*\]/g.test(l);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:r?"w-full rounded":"grow",children:u?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Input,{className:"w-[70%] rounded py-1",readOnly:!0,value:l}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{delayDuration:100,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"invisible ml-3 mt-1 text-blue-600 group-hover:visible",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.InfoCircledIcon,{})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:"Current value is using a Tailwind arbitrary value."})]})]}):jsxRuntime.jsxRuntimeExports.jsx(DropDown,{rounded:r,onChange:d=>a(d,n),selected:l,options:o,disabled:!c})})};function DropDown({selected:r,onChange:n,rounded:a=!1,options:o,disabled:i=!1}){const l=r.replace(/.*:/g,"").trim(),{undo:c,redo:u}=useUndoManager();return jsxRuntime.jsxRuntimeExports.jsxs("select",{disabled:!o.length||i,className:`${a?"rounded-md border border-border":"border-0"} disable:bg-gray-500 h-full w-full truncate rounded bg-background px-2 py-1 text-xs outline-none disabled:cursor-not-allowed`,onChange:d=>n(d.target.value),onKeyDown:d=>{d.ctrlKey&&(d.key==="z"&&c(),d.key==="y"&&u())},value:l,children:[jsxRuntime.jsxRuntimeExports.jsx("option",{className:"bg-transparent",value:""}),React.Children.toArray(o.map(d=>jsxRuntime.jsxRuntimeExports.jsx("option",{className:"bg-transparent",value:d,children:d})))]})}const RangeChoices=({property:r,onChange:n})=>{const{canReset:a,canChange:o}=React.useContext(StyleContext),i=useCurrentClassByProperty(r),l=React.useMemo(()=>lodashEs.get(i,"cls",""),[i]),c=React.useMemo(()=>lodashEs.get(CLASSES_LIST,`${r}.classes`,[""]),[r]),u=c.indexOf(l)>-1?c.indexOf(l):0,d=/\[.*\]/g.test(l);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-row divide-x divide-solid divide-border rounded border border-border text-xs",children:d?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"py-[5px] px-2",children:l}):jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"box-border w-2/12 rounded-tl rounded-bl bg-background px-1 text-center hover:bg-bg-gray-700 disabled:cursor-not-allowed disabled:bg-gray-600",disabled:!o&&(!a||u-1<0),onClick:()=>n(lodashEs.nth(c,u-1),r),children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"flex items-center justify-center",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.MinusIcon,{className:!o&&(!a||u-1<0)?"text-gray-500":"text-black/60 dark:text-white/60"})})}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-8/12 text-center",children:jsxRuntime.jsxRuntimeExports.jsx(DropDownChoices,{label:!1,property:r,onChange:n})}),jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"w-2/12 rounded-tr rounded-br bg-background px-1 text-center hover:bg-bg-gray-700 disabled:cursor-not-allowed disabled:bg-gray-600",disabled:!o&&(!a||u+1>=c.length),onClick:()=>n(lodashEs.nth(c,u+1),r),children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"flex items-center justify-center",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.PlusIcon,{className:!o&&(!a||u+1>=c.length)?"text-gray-500":"text-black/60 dark:text-white/60"})})})]})})},IconChoices=({property:r,onChange:n})=>{const a=React.useMemo(()=>lodashEs.get(CLASSES_LIST,`${r}.classes`,[""]),[r]),{canChange:o}=React.useContext(StyleContext),i=useCurrentClassByProperty(r),l=React.useMemo(()=>lodashEs.get(i,"cls",""),[i]);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex grow flex-wrap gap-1",children:lodashEs.map(a,c=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",disabled:!o,onClick:()=>n(c,r),className:`cursor-pointer rounded border border-gray-600 p-1 disabled:cursor-not-allowed ${l===c?" bg-blue-500 text-white":"disabled:bg-gray-600 disabled:text-gray-400"}`,children:React.createElement(lodashEs.get(EDITOR_ICONS,c,reactIcons.BoxIcon))})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:lodashEs.startCase(lodashEs.toLower(c))})]}))})},COLOR_PROP={backgroundColor:"bg",textColor:"text",borderColor:"border",boxShadowColor:"shadow",outlineColor:"outline",divideColor:"divide",fromColor:"from",viaColor:"via",toColor:"to",ringColor:"ring",ringOffsetColor:"ring-offset"},ColorChoice=({property:r,onChange:n})=>{const a=useCurrentClassByProperty(r),o=React.useMemo(()=>lodashEs.get(a,"cls",""),[a]),{canChange:i}=React.useContext(StyleContext),[l,c]=React.useState([]),[u,d]=React.useState({color:"",shade:""}),p=o.split("-"),f=lodashEs.get(p,"1",""),m=lodashEs.get(p,"2",""),h=React.useCallback(y=>{["current","inherit","transparent","black","white"].includes(y)?(c([]),d({color:y})):(c(["50","100","200","300","400","500","600","700","800","900"]),d(b=>({...b,color:y,shade:b.shade?b.shade:"500"})))},[c,d]);React.useEffect(()=>{if(["current","inherit","transparent","black","white"].includes(f))return c([]);c(["50","100","200","300","400","500","600","700","800","900"])},[f]);const g=React.useCallback(y=>{d({color:f,shade:y})},[f]);return React.useEffect(()=>{d({color:"",shade:""})},[a]),React.useEffect(()=>{const b=`${lodashEs.get(COLOR_PROP,r,"")}-${u.color}${u.shade?`-${u.shade}`:""}`;b.match(new RegExp(lodashEs.get(CLASSES_LIST,`${r}.regExp`,"")))&&n(b,r)},[u,n,r]),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-row divide-x divide-solid divide-border rounded-lg border border-border text-xs",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"grow text-center",children:jsxRuntime.jsxRuntimeExports.jsx(DropDown,{disabled:!i,rounded:!0,selected:f,onChange:h,options:["current","transparent","primary","secondary","black","white","slate","gray","zinc","neutral","stone","red","orange","amber","yellow","lime","green","emerald","teal","cyan","sky","blue","indigo","violet","purple","fuchsia","pink","rose"]})}),jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"grow text-center",children:jsxRuntime.jsxRuntimeExports.jsx(DropDown,{rounded:!0,selected:m,disabled:!f||!i,onChange:g,options:l})})]})},getUserInputValues=(r,n)=>{r=r.toLowerCase();let a=r.trim().replace(/ |\+/g,"");if((a==="auto"||a==="none")&&n.includes(a))return{value:"",unit:a};const o=n.length?new RegExp(n.join("|"),"g"):/XXXXXX/g;a=a.replace(o,"");const i=r.match(o),l=i&&i.length>1,c=!lodashEs.isEmpty(a)&&Number.isNaN(Number(a));return l||c?{error:"Invalid value"}:i&&(i[0]==="auto"||i[0]==="none")?{value:i[0],unit:""}:{value:a,unit:i?i[0]:""}},getTwClassValue=r=>{const n=r.startsWith("-")?"-":"",a=r.split("-").pop();if(["auto","none"].includes(a))return{value:"",unit:a};if(a==="px")return{value:"1",unit:"px"};if(a==="screen")return{value:"100",unit:r.indexOf("w-")!==-1?"vw":"vh"};if(a==="full")return{value:"100",unit:"%"};if(lodashEs.includes(r,"skew-"))return{value:`${n}${a}`,unit:"deg"};if(lodashEs.includes(r,"rotate-"))return{value:`${n}${a}`,unit:"deg"};if(lodashEs.includes(r,"opacity-"))return{value:`${a/100}`,unit:"-"};if(lodashEs.includes(r,"duration-")||lodashEs.includes(r,"delay-"))return{value:`${a}`,unit:"ms"};if(lodashEs.includes(r,"translate-")&&!a.includes("/"))return{value:`${n}${`${a/4}`}`,unit:"rem"};if(lodashEs.includes(r,"scale-"))return{value:`${n}${`${a/100}`}`,unit:"-"};if(lodashEs.startsWith(r,"border")){const o=r.match(/border-?(x|y|t|r|b|l)?\d+/g);if(o)return{value:o[0].split("-").pop(),unit:"px"};if(r.match(/border-?(x|y|t|r|b|l)?/g))return{value:"1",unit:"px"}}if(lodashEs.startsWith(r,"max-w-")){if(r==="max-w-screen-sm")return{value:"640",unit:"px"};if(r==="max-w-screen-md")return{value:"768",unit:"px"};if(r==="max-w-screen-lg")return{value:"1024",unit:"px"};if(r==="max-w-screen-xl")return{value:"1280",unit:"px"};if(r==="max-w-screen-2xl")return{value:"1536",unit:"px"};if(a==="xs")return{value:"320",unit:"px"};if(a==="sm")return{value:"384",unit:"px"};if(a==="md")return{value:"448",unit:"px"};if(a==="lg")return{value:"512",unit:"px"};if(a==="xl")return{value:"576",unit:"px"};if(a==="2xl")return{value:"672",unit:"px"};if(a==="3xl")return{value:"768",unit:"px"};if(a==="4xl")return{value:"896",unit:"px"};if(a==="5xl")return{value:"1024",unit:"px"};if(a==="6xl")return{value:"1152",unit:"px"};if(a==="7xl")return{value:"1280",unit:"px"};if(a==="prose")return{value:"65",unit:"ch"}}if(lodashEs.startsWith(r,"text-")){if(a==="xs")return{value:"12",unit:"px"};if(a==="sm")return{value:"14",unit:"px"};if(a==="base")return{value:"16",unit:"px"};if(a==="lg")return{value:"18",unit:"px"};if(a==="xl")return{value:"20",unit:"px"};if(a==="2xl")return{value:"24",unit:"px"};if(a==="3xl")return{value:"30",unit:"px"};if(a==="4xl")return{value:"36",unit:"px"};if(a==="5xl")return{value:"48",unit:"px"};if(a==="6xl")return{value:"60",unit:"px"};if(a==="7xl")return{value:"72",unit:"px"};if(a==="8xl")return{value:"96",unit:"px"};if(a==="9xl")return{value:"128",unit:"px"}}if(lodashEs.startsWith(r,"leading-")){if(a==="none")return{value:"1",unit:"-"};if(a==="tight")return{value:"1.25",unit:"-"};if(a==="snug")return{value:"1.375",unit:"-"};if(a==="normal")return{value:"1.5",unit:"-"};if(a==="relaxed")return{value:"1.625",unit:"-"};if(a==="loose")return{value:"2",unit:"-"}}if(lodashEs.startsWith(r,"tracking-")){if(a==="tighter")return{value:"-0.05",unit:"em"};if(a==="tight")return{value:"-0.025",unit:"em"};if(a==="normal")return{value:"0",unit:"em"};if(a==="wide")return{value:"0.025",unit:"em"};if(a==="wider")return{value:"0.05",unit:"em"};if(a==="widest")return{value:"0.1",unit:"em"}}if(["max","min","fit"].includes(a))return{value:r,unit:"class"};if(a.includes("/")){const[o,i]=lodashEs.map(a.split("/"),l=>parseInt(l,10));return{value:n+(o/i*100).toFixed(2).replace(".00",""),unit:"%"}}return lodashEs.isNumber(parseFloat(a))?{value:`${n+parseFloat(a)*4}`,unit:"px"}:{value:a,unit:"class"}},getClassValueAndUnit=r=>{if(lodashEs.isEmpty(r))return{value:"",unit:""};const n=r.match(/\[.*\]/g);if(n===null)return getValueAndUnitForTWClass(r);const a=lodashEs.get(n,"0","").replace(/\[|\]/g,""),o=r.startsWith("-")?"-":"",i=lodashEs.first(a.match(/\d+.\d+|\d+/g));return{value:`${o}${i}`,unit:a.replace(i,"")}},getValueAndUnitForTWClass=r=>lodashEs.isEmpty(r)?{value:"",unit:""}:getTwClassValue(r),BlockSettingsContext=React.createContext({setDragData:()=>{}}),DragStyleButton=({unit:r,currentValue:n,onDrag:a,onDragEnd:o,onDragStart:i,negative:l,cssProperty:c})=>{const{setDragData:u}=React.useContext(BlockSettingsContext);return jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",onMouseDown:d=>{const p={onDrag:a,onDragEnd:o,dragging:!0,dragStartY:d.pageY,dragStartValue:`${n}`,dragUnit:r,negative:l,cssProperty:c};i(p),u(p)},color:void 0,className:"relative z-50 ml-1 hidden h-6 cursor-row-resize rounded bg-background/70 px-2 group-hover:inline",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.RowSpacingIcon,{})})},UnitSelection=({onSelect:r,current:n,units:a})=>jsxRuntime.jsxRuntimeExports.jsx("div",{"data-theme":"light",className:"-m-[7px] -mx-[13px] flex w-9 flex-col",children:a.map(o=>jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{className:"h-max rounded-none px-1 py-1 text-right text-[11px] hover:bg-blue-400",color:n===o?"primary":void 0,size:"sm",onClick:i=>{i.stopPropagation(),r(o)},children:o},o))}),THROTTLE_TIME=50,AdvanceChoices=r=>{const[n,a]=React.useState(!1),[o,i]=React.useState(""),{currentClass:l,onChange:c,classPrefix:u,cssProperty:d,units:p,negative:f}=r,[m,h]=React.useState(d!=null&&d.toLowerCase().includes("width")?"%":p[0]),[g,y]=React.useState(!1),[b,v]=React.useState(""),[x,E]=React.useState(!1),[R,A]=React.useState(!1);React.useEffect(()=>{const{value:j,unit:k}=getClassValueAndUnit(l);if(k===""){i(j),h(d!=null&&d.toLowerCase().includes("width")?"%":lodashEs.first(p));return}h(k),i(k==="class"||lodashEs.isEmpty(j)?"":j)},[l,d,p]);const S=web.useThrottledCallback(j=>c(j),[c],THROTTLE_TIME),w=web.useThrottledCallback(j=>c(j,!1),[c],THROTTLE_TIME),C=React.useCallback((j=!1)=>{const k=getUserInputValues(`${o}`,p);if(lodashEs.get(k,"error",!1)){y(!0);return}const P=lodashEs.get(k,"unit")!==""?lodashEs.get(k,"unit"):m;if(P==="auto"||P==="none"){S(`${u}${P}`);return}if(lodashEs.get(k,"value")==="")return;const B=`${lodashEs.get(k,"value","").startsWith("-")?"-":""}${u}[${lodashEs.get(k,"value","").replace("-","")}${P==="-"?"":P}]`;j?w(B):S(B)},[S,w,o,m,u,p]),I=React.useCallback(j=>{const k=getUserInputValues(`${o}`,p);if(lodashEs.get(k,"error",!1)){y(!0);return}if(j==="auto"||j==="none"){S(`${u}${j}`);return}if(lodashEs.get(k,"value")==="")return;const P=lodashEs.get(k,"unit")!==""?lodashEs.get(k,"unit"):j,B=`${lodashEs.get(k,"value","").startsWith("-")?"-":""}${u}[${lodashEs.get(k,"value","").replace("-","")}${P==="-"?"":P}]`;S(B)},[S,o,u,p]);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-full flex-col",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-start",children:m==="class"?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx("input",{className:"w-20 rounded py-1",readOnly:!0,value:l}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"invisible ml-3 mt-1 text-blue-600 group-hover:visible",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.InfoCircledIcon,{})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:"Current value is using a Tailwind preset class."})]})]}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:`group relative flex items-center ${x?"z-auto":""}`,children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center rounded-md border border-border",children:[["none","auto"].indexOf(m)!==-1?null:jsxRuntime.jsxRuntimeExports.jsx("input",{readOnly:m==="class",onKeyPress:j=>{j.key==="Enter"&&C()},onKeyDown:j=>{if(j.keyCode!==38&&j.keyCode!==40)return;j.preventDefault(),A(!0);const k=lodashEs.parseInt(j.target.value);let P=lodashEs.isNaN(k)?0:k;j.keyCode===38&&(P+=1),j.keyCode===40&&(P-=1);const T=`${P}`,M=`${T.startsWith("-")?"-":""}${u}[${T.replace("-","")}${m==="-"?"":m}]`;w(M)},onKeyUp:j=>{R&&(j.preventDefault(),A(!1))},onBlur:()=>C(),onChange:j=>{y(!1),i(j.target.value)},onClick:j=>{var k;(k=j==null?void 0:j.target)==null||k.select(),a(!1)},value:x?b:o,className:"h-6 w-14 rounded rounded-r-none bg-background pl-2 text-sm focus-visible:outline-0 ".concat(" ",g?"border-red-500 text-red-500":"border-foreground/20")}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{open:n,delayDuration:100,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("button",{type:"button",onClick:()=>a(!n),className:"flex h-6 cursor-pointer items-center gap-x-1 rounded rounded-l-none bg-background p-px px-1 text-[11px] uppercase",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:`inline-block ${p.length===1?"px-2 font-semibold":""}`,children:m}),p.length>1?jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TriangleDownIcon,{}):null]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipPortal,{children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{className:"bg-background",children:jsxRuntime.jsxRuntimeExports.jsx(UnitSelection,{units:p,current:m,onSelect:j=>{a(!1),h(j),I(j)}})})})]})]}),["none","auto"].indexOf(m)!==-1||x?null:jsxRuntime.jsxRuntimeExports.jsx(DragStyleButton,{onDragStart:()=>E(!0),onDragEnd:j=>{if(v(()=>""),E(!1),lodashEs.isEmpty(j))return;const k=`${j}`,T=`${k.startsWith("-")?"-":""}${u}[${k.replace("-","")}${m==="-"?"":m}]`;S(T)},onDrag:j=>{if(lodashEs.isEmpty(j))return;v(j);const k=`${j}`,T=`${k.startsWith("-")?"-":""}${u}[${k.replace("-","")}${m==="-"?"":m}]`;w(T)},currentValue:o,unit:m,negative:f,cssProperty:d})]})})})},useCurrentClassByProperty=r=>{const n=useSelectedBlockCurrentClasses();return lodashEs.findLast(n,{property:r})},canChangeClass=(r,n)=>{const a={xs:0,sm:1,md:2,lg:3,xl:4,"2xl":5};return a[lodashEs.get(r,"mq","xs")]<=a[n]},CLASS_PREFIXES={width:"w-",height:"h-",minWidth:"min-w-",minHeight:"min-h-",maxWidth:"max-w-",maxHeight:"max-h-",zIndex:"z-",gap:"gap-",gapX:"gap-x-",gapY:"gap-y-",margin:"m-",marginX:"mx-",marginY:"my-",marginTop:"mt-",marginBottom:"mb-",marginLeft:"ml-",marginRight:"mr-",padding:"p-",paddingX:"px-",paddingY:"py-",paddingTop:"pt-",paddingBottom:"pb-",paddingLeft:"pl-",paddingRight:"pr-",spaceX:"space-x-",spaceY:"space-y-",border:"border-",borderTop:"border-t-",borderBottom:"border-b-",borderLeft:"border-l-",borderRight:"border-r-",borderX:"border-x-",borderY:"border-y-",borderRadius:"rounded-",borderRadiusTop:"rounded-t-",borderRadiusRight:"rounded-r-",borderRadiusBottom:"rounded-b-",borderRadiusLeft:"rounded-l-",borderRadiusTopLeft:"rounded-tl-",borderRadiusTopRight:"rounded-tr-",borderRadiusBottomRight:"rounded-br-",borderRadiusBottomLeft:"rounded-bl-",fontSize:"text-",lineHeight:"leading-",letterSpacing:"tracking-",textIndent:"indent-",rotate:"rotate-",duration:"duration-",transitionDelay:"delay-",scale:"scale-",scaleX:"scale-x-",scaleY:"scale-y-",translateX:"translate-x-",translateY:"translate-y-",skewX:"skew-x-",skewY:"skew-y-",top:"top-",bottom:"bottom-",left:"left-",right:"right-",inset:"inset-",insetX:"inset-x-",insetY:"inset-y-",opacity:"opacity-",flexBasis:"basis-"},BREAKPOINTS={xs:"",sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},getBreakpoint=r=>`${r.toUpperCase()} ${BREAKPOINTS[r]?`(${BREAKPOINTS[r]} & up)`:""}`,BlockStyle=r=>{const{t:n}=reactI18next.useTranslation(),{type:a="icons",label:o,property:i,onEmitChange:l=()=>{},units:c,negative:u=!1}=r,[d]=useDarkMode(),[p]=useStylingState(),[,f]=useCanvasWidth(),m=useCurrentClassByProperty(i),h=useAddClassesToBlocks(),g=useRemoveClassesFromBlocks(),[y]=useSelectedBlockIds(),b=React.useMemo(()=>lodashEs.get(m,"fullCls",""),[m]),v=React.useCallback((w,C=!0)=>{const I={dark:d,mq:f,mod:p,cls:w,property:i,fullCls:""};(d||p!=="")&&(I.mq="xs");const j=generateFullClsName(I);h(y,[j],C)},[y,d,f,p,i,h]),x=React.useCallback(()=>{g(y,[b])},[y,b,g]),E=React.useMemo(()=>canChangeClass(m,f),[m,f]);React.useEffect(()=>{l(E,m)},[E,l,m]);const[,,R]=useCanvasWidth(),A=React.useCallback(w=>{R({xs:400,sm:640,md:800,lg:1024,xl:1420,"2xl":1920}[w])},[R]),S=lodashEs.get(m,"dark",null)===d&&lodashEs.get(m,"mod",null)===p&&lodashEs.get(m,"mq",null)===f;return jsxRuntime.jsxRuntimeExports.jsx(BlockStyleProvider,{canChange:E,canReset:m&&S,children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"group flex flex-row items-center py-2 first:pt-0 last:pb-0",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"relative w-[70px] truncate text-xs text-foreground",children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:`text-[11px] ${m&&!S?"text-foreground":""}`,children:n(o)})}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-row items-center",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"w-[150px]",children:[a==="arbitrary"?jsxRuntime.jsxRuntimeExports.jsx(AdvanceChoices,{currentClass:lodashEs.get(m,"cls",""),classPrefix:lodashEs.get(CLASS_PREFIXES,i,""),units:c||[],onChange:v,negative:u,cssProperty:i}):null,a==="icons"&&jsxRuntime.jsxRuntimeExports.jsx(IconChoices,{property:i,onChange:v}),a==="range"&&jsxRuntime.jsxRuntimeExports.jsx(RangeChoices,{property:i,onChange:v}),a==="color"&&jsxRuntime.jsxRuntimeExports.jsx(ColorChoice,{property:i,onChange:v}),a==="dropdown"&&jsxRuntime.jsxRuntimeExports.jsx(DropDownChoices,{label:o,property:i,onChange:v})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:`w-[30px] cursor-pointer ${b?"visible":"invisible"}`,children:S?jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",onClick:()=>x(),title:"Reset",className:"flex px-1.5 text-xs",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CrossCircledIcon,{className:"h-5 w-5 text-blue-500 hover:opacity-80"})}):E&&m?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{delayDuration:100,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"invisible ml-3 mt-1 rounded-full bg-blue-500 text-white group-hover:visible",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.InfoCircledIcon,{})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"text-right",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{children:["Current style is set at  ",jsxRuntime.jsxRuntimeExports.jsxs("span",{className:"font-bold",children:[getBreakpoint(lodashEs.get(m,"mq")),d&&!m.dark?"(Light mode)":""]}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsxs("button",{type:"button",onClick:()=>A(lodashEs.get(m,"mq")),className:"block w-full cursor-default text-right font-semibold text-blue-500",children:["Switch to ",lodashEs.get(m,"mq").toUpperCase()]})]})})})]}):null})]})]})})},basicUnits=["px","%","em","rem","ch","vh","vw"],MultipleChoices=({label:r,options:n,borderB:a=!1,borderT:o=!1,type:i="arbitrary",units:l=basicUnits,negative:c=!1})=>{const{t:u}=reactI18next.useTranslation(),[d,p]=React.useState(n[0].key),f=useSelectedBlockCurrentClasses(),m=React.useCallback(h=>lodashEs.map(f,"property").includes(h),[f]);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:`mb-2 border-gray-800 py-2 first:pt-0 last:pb-0 ${a?"border-b":""} ${o?"border-t":""}`,children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-row text-xs",children:[r&&jsxRuntime.jsxRuntimeExports.jsx("span",{className:"relative w-[70px] flex-none text-xs text-foreground",children:u(r)}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mb-3 flex grow flex-row flex-wrap gap-x-px",children:React.Children.toArray(n.map(({label:h,key:g})=>jsxRuntime.jsxRuntimeExports.jsx("div",{className:"first:rounded-l last:rounded-r",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("button",{type:"button",onClick:()=>p(g),className:`relative cursor-pointer rounded-full p-1 text-[8px] ${g===d?" bg-[#3E57F0] text-white":"text-gray-600 dark:text-gray-300"}`,children:[React.createElement("div",{className:m(g)?"-bottom-1.5 absolute bg-[#3E57F0] h-[2px] left-0 w-full":""}),React.createElement(lodashEs.get(EDITOR_ICONS,g,reactIcons.BoxIcon),{className:"text-inherit w-3 h-3"})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:lodashEs.startCase(lodashEs.toLower(h))})]})})))})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-0 flex items-center",children:jsxRuntime.jsxRuntimeExports.jsx(BlockStyle,{type:i,units:[...l],label:"",property:d,negative:c})})]})},NestedOptions=({heading:r,items:n})=>{const{t:a}=reactI18next.useTranslation(),o=useSelectedBlockCurrentClasses(),i=React.useMemo(()=>{const l=d=>lodashEs.flatten(d.map(p=>p.styleType==="multiple"?lodashEs.map(p.options,"key"):p.property)),c=lodashEs.flatten(n.map(d=>d.styleType==="accordion"?l(d.items):d.styleType==="multiple"?lodashEs.map(d.options,"key"):d.property)),u=lodashEs.map(o,"property");return lodashEs.intersection(c,u).length>0},[o,n]);return jsxRuntime.jsxRuntimeExports.jsxs("details",{children:[jsxRuntime.jsxRuntimeExports.jsx("summary",{className:"my-px cursor-default rounded-md bg-gray-50 p-px px-2 text-[11px] text-foreground",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"inline",children:[a(r.toLowerCase()),i?jsxRuntime.jsxRuntimeExports.jsx("span",{className:`ml-1 mr-2 inline-block h-[8px] w-[8px] rounded-full ${i?"bg-blue-500":"bg-gray-300"}`}):null]})}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"p-2",children:n.map(l=>l.styleType==="multiple"?jsxRuntime.jsxRuntimeExports.jsx(MultipleChoices,{...l},l.label):jsxRuntime.jsxRuntimeExports.jsx(BlockStyle,{...l},l.label))})]})},SectionContext=React.createContext({}),StylingGroup=({section:r})=>{const{t:n}=reactI18next.useTranslation(),a=useSelectedBlockCurrentClasses(),o=React.useCallback((l=[])=>{const c={};for(let d=0;d<a.length;d++)c[a[d].property]=a[d].cls;let u=!0;for(const d in l)if(!lodashEs.has(c,d)||c[d]!==l[d]){u=!1;break}return u},[a]),i=React.useMemo(()=>({}),[]);return jsxRuntime.jsxRuntimeExports.jsx(SectionContext.Provider,{value:i,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:r.heading,className:"border-none",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{className:"border-b border-gray-300 py-2 text-xs hover:no-underline",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center gap-x-2 text-sm font-bold",children:n(r.heading)})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionContent,{className:"py-2",children:React.Children.toArray(r.items.map(l=>lodashEs.has(l,"component")?React.createElement(l.component,{key:l.label}):lodashEs.has(l,"styleType")?l.styleType==="multiple"?jsxRuntime.jsxRuntimeExports.jsx(MultipleChoices,{...l},l.label):l.styleType==="accordion"&&o(l==null?void 0:l.conditions)?jsxRuntime.jsxRuntimeExports.jsx(NestedOptions,{...l},l.label):null:jsxRuntime.jsxRuntimeExports.jsx(BlockStyle,{...l},l.label)))})]})})},StylingHelpers=()=>{const r=useSelectedBlock(),[n]=useSelectedStylingBlocks(),{t:a}=reactI18next.useTranslation(),o=runtime.useGlobalStylingPresets(),i=useAddClassesToBlocks(),l=runtime.getBlockComponent(r._type),c=lodashEs.get(lodashEs.first(n),"prop"),u=lodashEs.get(l.props,`${c}.presets`,{});if(lodashEs.isEmpty(o)&&(!lodashEs.has(l,"props")||lodashEs.isEmpty(u)))return null;const d=p=>{const f=p.trim().toLowerCase().replace(/ +(?= )/g,"").split(" ");i([r._id],f,!0)};return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-10",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenu,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"px-4",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{variant:"default",className:"w-full",size:"sm",children:[a("Apply Presets"),jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CaretDownIcon,{})]})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuContent,{className:"max-h-80 w-56",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ScrollArea,{className:"no-scrollbar h-full",children:[lodashEs.isEmpty(u)?null:jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuLabel,{children:[l.type," ",a("presets")]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuSeparator,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuGroup,{children:lodashEs.keys(u).map(p=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuItem,{className:"group text-xs",onClick:()=>d(u[p]),children:[lodashEs.capitalize(lodashEs.startCase(a(p))),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuShortcut,{className:"invisible hover:font-bold hover:text-blue-600 group-hover:visible",children:a("apply")})]}))})]}),lodashEs.isEmpty(o)?null:jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuLabel,{children:a("Global presets")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuSeparator,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuGroup,{children:lodashEs.keys(o).map(p=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuItem,{className:"group text-xs",onClick:()=>d(o[p]),children:[lodashEs.capitalize(lodashEs.startCase(a(p))),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuShortcut,{className:"invisible hover:font-bold hover:text-blue-600 group-hover:visible",children:a("apply")})]}))})]})]})})]})})},MAPPER={px:1,"%":1,em:100,rem:100,ch:1,vw:1,vh:1,"-":1,deg:1,ms:.1};function BlockStyling(){const{flexChild:r,gridChild:n}=useSelectedBlocksDisplayChild(),[a]=useSelectedStylingBlocks(),[o,i]=React.useState(""),[l,c]=React.useState({onDrag:p=>p,onDragEnd:p=>p,dragStartY:0,dragging:!1,dragStartValue:0,dragUnit:"",negative:!1,cssProperty:""}),u=web.useThrottledCallback(p=>{const f=!lodashEs.get(l,"negative",!1),m=lodashEs.get(l,"cssProperty","");let h=parseFloat(l.dragStartValue);h=isNaN(h)?0:h;let g=MAPPER[l.dragUnit];(lodashEs.startsWith(m,"scale")||m==="opacity")&&(g=10);let b=(l.dragStartY-p.pageY)/g+h;f&&b<0&&(b=0),m==="opacity"&&b>1&&(b=1),l.onDrag(`${b}`),i(`${b}`)},[l],50),d=React.useCallback(()=>{setTimeout(()=>l.onDragEnd(`${o}`),100),c({onDrag:p=>p,onDragEnd:p=>p,dragStartY:0,dragging:!1,dragStartValue:0,dragUnit:"",negative:!1,cssProperty:""})},[l,o,c]);return lodashEs.isEmpty(a)?null:jsxRuntime.jsxRuntimeExports.jsxs(BlockSettingsContext.Provider,{value:{setDragData:c},children:[l.dragging?jsxRuntime.jsxRuntimeExports.jsx("div",{onMouseMove:u,onMouseUp:()=>d(),className:"absolute inset-0 z-30 cursor-row-resize bg-gray-300/10"}):null,jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx(StylingHelpers,{}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Accordion,{defaultValue:["Styles"],type:"multiple",className:"w-full",children:[r&&jsxRuntime.jsxRuntimeExports.jsx(StylingGroup,{section:FLEX_CHILD_SECTION}),n?jsxRuntime.jsxRuntimeExports.jsx(StylingGroup,{section:GRID_CHILD_SECTION}):null,SETTINGS_SECTIONS.map(p=>jsxRuntime.jsxRuntimeExports.jsx(StylingGroup,{section:p},p.heading))]})]})]})}const ChaiSelect=({defaultValue:r="",onValueChange:n,options:a,placeholder:o="Select",className:i=""})=>{const[l,c]=React.useState(r),u=d=>{const p=d.target.value;c(p),n(p)};return jsxRuntime.jsxRuntimeExports.jsx("div",{className:iconBase.cn("relative inline-block w-full",i),children:jsxRuntime.jsxRuntimeExports.jsxs("select",{className:"focus:shadow-outline w-full appearance-none rounded border border-gray-300 bg-white px-4 py-1 pr-8 text-sm leading-tight shadow hover:border-gray-400 focus:outline-none",value:l,onChange:u,children:[jsxRuntime.jsxRuntimeExports.jsx("option",{value:"",disabled:!0,children:o}),a.map(d=>jsxRuntime.jsxRuntimeExports.jsx("option",{value:d.value,children:d.label},d.value))]})})},ChaiSelect$1=ChaiSelect;function UILibrariesSelect({uiLibraries:r,library:n,setLibrary:a}){const{t:o}=reactI18next.useTranslation();return n?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"h-12",children:[jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs font-bold text-gray-500",children:o("choose_library")}),jsxRuntime.jsxRuntimeExports.jsx(ChaiSelect$1,{className:"mt-1",options:r.map(i=>({value:i.uuid,label:i.name})),defaultValue:n,onValueChange:i=>a(i)})]}):null}const BlockCard=({block:r,library:n,parentId:a=void 0})=>{const[o,i]=React.useState(!1),l=useBuilderProp("getUILibraryBlock",lodashEs.noop),{addCoreBlock:c,addPredefinedBlock:u}=useAddBlock(),[,d]=useSelectedBlockIds(),[,p]=useHighlightBlockId(),f=lodashEs.get(r,"name",lodashEs.get(r,"label")),m=flagged.useFeature("dnd"),[,h]=jotai.useAtom(draggedBlockAtom),g=v=>{const x=lodashEs.has(v,"styles_attrs.data-page-section");return v._type==="Box"&&x},y=React.useCallback(async v=>{if(v.stopPropagation(),lodashEs.has(r,"component")){c(r,a),emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK});return}i(!0);const x=await l(n,r);lodashEs.isEmpty(x)||u(runtime.syncBlocksWithDefaults(x),a),emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK})},[r]),b=async v=>{const x=await l(n,r);let E=a;if(g(lodashEs.first(x))&&(E=null),!lodashEs.isEmpty(x)){const R={blocks:x,uiLibrary:!0,parent:E};if(v.dataTransfer.setData("text/plain",JSON.stringify(R)),r.preview){const A=new Image;A.src=r.preview,A.onload=()=>{v.dataTransfer.setDragImage(A,0,0)}}else v.dataTransfer.setDragImage(new Image,0,0);h(R),setTimeout(()=>{d([]),p(null),emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK})},200)}};return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("div",{onClick:o?()=>{}:y,draggable:m?"true":"false",onDragStart:b,className:clsx("relative mt-2 cursor-pointer overflow-hidden rounded-md border border-gray-300 bg-white duration-200 hover:border-blue-500 hover:shadow-xl"),children:[o&&jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"absolute flex h-full w-full items-center justify-center bg-black/70",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"animate-spin",size:15,color:"white"}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"pl-2 text-sm text-white",children:"Adding..."})]}),r.preview?jsxRuntime.jsxRuntimeExports.jsx("img",{src:r.preview,className:"min-h-[45px] w-full rounded-md",alt:f}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex h-20 items-center justify-center rounded-md border border-border border-gray-300 bg-gray-200",children:jsxRuntime.jsxRuntimeExports.jsx("p",{className:"max-w-xs text-center text-sm text-gray-700",children:f})})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:f})})]})},libraryBlocksAtom=jotai.atom({}),useLibraryBlocks=r=>{const[n,a]=jotai.useAtom(libraryBlocksAtom),o=useBuilderProp("getUILibraryBlocks",lodashEs.noop),i=lodashEs.get(n,`${r==null?void 0:r.uuid}.blocks`,null),l=lodashEs.get(n,`${r==null?void 0:r.uuid}.loading`,"idle"),c=React.useRef("idle");return React.useEffect(()=>{(async()=>{if(l==="complete"||c.current==="loading")return;c.current="loading",a(d=>({...d,[r==null?void 0:r.uuid]:{loading:"loading",blocks:[]}}));const u=await o(r);c.current="idle",a(d=>({...d,[r==null?void 0:r.uuid]:{loading:"complete",blocks:u||[]}}))})()},[r,i,l,c]),{data:i||[],isLoading:l==="loading"}},UILibrarySection=({parentId:r})=>{const[n,a]=jotai.useAtom(selectedLibraryAtom),o=useBuilderProp("uiLibraries",[]),i=runtime.useChaiBlocks(),l=lodashEs.values(i).filter(E=>E.category==="custom"),c=o.find(E=>E.uuid===n)||lodashEs.first(o),{data:u,isLoading:d}=useLibraryBlocks(c),p=lodashEs.groupBy([...u,...l],"group"),[f,m]=React.useState("Hero"),h=lodashEs.get(p,f,[]),g=React.useRef(null),{t:y}=reactI18next.useTranslation(),b=E=>{g.current&&(clearTimeout(g.current),g.current=null),g.current=setTimeout(()=>{g.current&&m(E)},300)};if(d)return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-4 grid h-full w-full grid-cols-12 gap-2",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"col-span-3 h-full"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"col-span-9 h-full"})]});const v=lodashEs.filter(h,(E,R)=>R%2===0),x=lodashEs.filter(h,(E,R)=>R%2===1);return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"relative mt-2 flex h-full max-h-full overflow-hidden bg-background",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full pt-2",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full max-h-full w-60 flex-col gap-1 px-1 pr-2",children:[jsxRuntime.jsxRuntimeExports.jsx(UILibrariesSelect,{library:c==null?void 0:c.uuid,setLibrary:a,uiLibraries:o}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2 flex h-full max-h-full w-full flex-1 flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:"text-xs font-bold text-gray-500",children:y("groups")}),jsxRuntime.jsxRuntimeExports.jsx("hr",{className:"mt-1"}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar mt-2 h-full max-h-full flex-1 overflow-y-auto pb-20",children:React.Children.toArray(lodashEs.map(p,(E,R)=>jsxRuntime.jsxRuntimeExports.jsxs("div",{onMouseEnter:()=>b(R),onMouseLeave:()=>clearTimeout(g.current),onClick:()=>m(R),className:iconBase.cn("flex w-full cursor-pointer items-center justify-between rounded-md p-2 text-sm transition-all ease-in-out hover:bg-gray-200",R===f?"bg-blue-500 text-white hover:bg-blue-600":""),children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:lodashEs.capitalize(y(R.toLowerCase()))}),jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CaretRightIcon,{className:"ml-2 h-5 w-5"})]},R)))})]})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ScrollArea,{onMouseEnter:()=>g.current?clearTimeout(g.current):null,className:"z-10 -mt-2 flex h-full max-h-full w-full flex-col gap-2 border-l border-border transition-all ease-linear",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"grid grid-cols-2 gap-2 px-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col gap-1",children:React.Children.toArray(v.map(E=>jsxRuntime.jsxRuntimeExports.jsx(BlockCard,{parentId:r,block:E,library:c})))}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col gap-1",children:React.Children.toArray(x.map(E=>jsxRuntime.jsxRuntimeExports.jsx(BlockCard,{parentId:r,block:E,library:c})))})]}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{})]})]})})})},UILibrariesPanel=({parentId:r})=>jsxRuntime.jsxRuntimeExports.jsx(UILibrarySection,{parentId:r}),UILibraries=UILibrariesPanel,add_block="Add block",enter_paste_tailwind_html="(Enter or paste TailwindCSS HTML snippet)",click_to_add_block="(Click to add block to page)",core="Core",custom_blocks="Custom Blocks",ui_library="UI Library",html_snippet_description="Use HTML snippets from Tailwind CSS component libraries etc. or just copy paste your own HTML code.",tailwind_html_snippet="Tailwind HTML snippet:",enter_code_snippet="Enter your code snippet here...",import_html="Import HTML",note_imported_html="NOTE: Imported html will be added to the currently selected block. If no block is selected, the html will be added to the page.",dark_mode="Dark mode",tree_view_no_blocks="This page has no blocks. Add a block by clicking the + button",canvas_empty="This page is empty",no_block_selected_for_styling="Please select a block to edit settings or styles",no_block_selected_for_ask_ai="Please select a block to ask AI",no_styling_block_selected="Please select a styling block",drop_here_message="Drop your block here",use_setting="Use setting",mobile_xs_title="Mobile (XS)",mobile_xs_content="Styles set here are applied to all screen unless edited at higher breakpoint",mobile_sm_title="Mobile landscape (SM)",mobile_sm_content="Styles set here are applied at 640px and up unless edited at higher breakpoint",tablet_md_title="Tablet (MD)",tablet_md_content="Styles set here are applied at 768px and up",tablet_lg_title="Tablet Landscape (LG)",tablet_lg_content="Styles set here are applied at 1024px and up unless edited at higher breakpoint",desktop_xl_title="Desktop (XL)",desktop_xl_content="Styles set here are applied at 1280px and up unless edited at higher breakpoint",large_desktop_2xl_title="Large Desktop (2XL)",large_desktop_2xl_content="Styles set here are applied at 1536px and up",Breakpoints$1="Breakpoints",clear="Clear",clear_canvas_title="Clear whole canvas?",clear_canvas_description="Are you sure you want to clear the whole canvas?",cancel="Cancel",yes="Yes",preview="Preview",settings="Settings",styling="Styling",data_provider="Data Provider",remove_provider_confirmation="Are you sure you want to remove <span class='text-blue-500'>{name}</span> provider?",remove_provider_warning="Your data provider will be removed from this page and all added data binding will be not visible on blocks.",remove="Remove",no_data_providers="You have no data providers registered. Please add a data provider to your project.",learn_more="Learn more",add_data_providers="Add data providers:",select_provider="Select a provider",choose="Choose",page_data_providers="Page data providers:",view_data="View Data",mark_as_global="Mark as Global",global_block_note="Note: Global blocks are single instances. Editing global blocks will be reflected on all pages using these blocks.",global_block_indicator="Global blocks are indicated with",global_block_category="Global blocks are available under 'Global' category",enter_global_block_name="Enter global block name",eg_header_footer="Eg: Header, Footer",blocks_selected="{{length}} blocks selected.",cut="Cut",copy$1="Copy",clear_selection="Clear Selection",dev_mode_message="This is dev mode. Visit",to_see_page_preview="to see page preview",theme_config={heading_font:"Heading Font",body_font:"Body Font",rounded_corner:"Rounded Corners",primary:"Primary",secondary:"Secondary",background:"Background",text_color:"Text Color",background_dark_mode:"Background (Dark Mode)",text_color_dark_mode:"Text Color (Dark Mode)"},web_blocks={box:"box",tag:"Tag",div:"div",level:"Level",header:"header",footer:"footer",section:"section",article:"article",aside:"aside",main:"main",nav:"navigation",figure:"figure",details:"details",summary:"summary",dialog:"dialog",strike:"strike",caption:"caption",legend:"legend",figcaption:"figure caption",mark:"mark",background_image:"Background Image",label:"Label",default:"default",icon_size:"Icon Size",icon_position:"Icon Position",start:"Start",end:"End",button:"Button",custom_html:"Custom HTML",html_code:"HTML Code",default_snippet:"The HTML snippet goes here...",placeholder:"Enter custom HTML code here",custom_script:"Custom Script",dark_mode:"Dark Mode",divider:"Divider",empty_box:"Empty Box",heading:"Heading",image:"Image",alt:"Alt",width:"Width",height:"Height",video:"Video",span:"Span",content:"Content",icon:"Icon",richtext:"Rich Text",list:"List",list_type:"List Type",listitem:"List Item",link:"Link",list_item:"List Item",none:"None",disc:"Disc",number:"Number",paragraph:"Paragraph",lightbox_link:"Lightbox Link",href:"Link",type:"Type",iframe:"iframe",inline:"inline",ajax:"ajax",autoplay:"Video autoplay",max_width:"Max Width",backdrop_color:"Background Color",gallery_name:"Gallery Name",slot:"Slot",empty_slot:"Empty Slot",text:"Text",video_url:"Video URL",controls:"Show Controls",loop:"Loop",muted:"Muted",checkbox:"Checkbox",required:"Required",checked:"Checked",submit_button:"Submit Button",form:"Form",submit_url:"Submit URL",error_message:"Error Message",success_message:"Success Message",input:"Input",value:"Value",show_label:"Show Label",field_name:"Field Name",radio:"Radio",multiple:"Multiple",options:"Options",select:"Select",multiple_choice:"Multiple Choice",textarea:"Textarea",rows:"Rows"},ai_assistant="AI Assistant",close_preview="Close Preview",saved="Saved",unsaved="Unsaved",saving="Saving...",page_is_empty="This page is empty.",Theme="Theme",Outline="Outline",clipboard_not_supported="Not supported",please_use_chrome_firefox_or_safari="Please use Chrome, Firefox or Safari",classes_copied_to_clipboard="Classes copied to clipboard",download_complete="Download complete",copied="Copied",enter_classes_separated_by_space="Enter classes separated by space",copy_classes_to_clipboard="Copy classes to clipboard",classes="Classes",ask_ai="Ask AI",edit_with_ai="Edit with AI",generating_please_wait="Generating... Please wait",stop$1="Stop",eg_this_page_is_about_an_ai_assistant_app_called_chai_studio_it_allows_users_to_create_beautiful_webpages_and_edit_content_with_ai="E.g.: This page is about an AI assistant app called Chai Studio. It allows users to create beautiful webpages and edit content with AI.",ask_ai_to_edit_styles="Ask AI to edit styles",ask_ai_to_edit_content="Ask AI to edit content",ai_context="AI Context",please_select_a_block_to_ask_ai="Select a block to edit with AI",please_select_a_block_to_edit="Please select a block to edit",edit="Edit",tell_about_this_page_eg_this_page_is_about="Describe this page. E.g.: This page is about...",tag="Tag",value="Value",background_image="Background Image",enter_image_url="Enter image URL",replace_image="Replace image",choose_image="Choose image",images="Images",typography="Typography",background="Background",library="Library",blocks="Blocks",basic="Basic",media="Media",advanced="Advanced",form="Form",choose_icon_or_enter_svg="Choose an icon or enter SVG",groups="Groups",ui_libraries="UI Libraries",accordions="Accordions",buttons="Buttons",layouts="Layouts",choose_library="Choose library",no_library_found="No library found.",faq="FAQ",hero="Hero",features="Features",footer="Footer",navbar="Navbar",icons="Icons",testimonials="Testimonials",blog="Blog",ai_quick_prompts={improve_writing:"Improve writing",replace_placeholder_content:"Replace placeholder content",fix_grammar:"Fix grammar",make_longer:"Make longer",make_shorter:"Make shorter",add_emojis:"Add emojis",randomize:"Randomize"},sidebar={outline:"Outline",edit_block:"Edit Block",ai_assistant:"AI Assistant",theme:"Theme"},remove_context="Remove context",yes_delete="Yes, Delete",ai_context_updated="AI Context Updated",you_can_now_ask_ai_to_edit_your_content="You can now ask AI to edit your content.",lngEn={add_block,enter_paste_tailwind_html,click_to_add_block,core,custom_blocks,ui_library,import:"Import",html_snippet_description,tailwind_html_snippet,enter_code_snippet,import_html,note_imported_html,dark_mode,tree_view_no_blocks,canvas_empty,no_block_selected_for_styling,no_block_selected_for_ask_ai,no_styling_block_selected,drop_here_message,use_setting,mobile_xs_title,mobile_xs_content,mobile_sm_title,mobile_sm_content,tablet_md_title,tablet_md_content,tablet_lg_title,tablet_lg_content,desktop_xl_title,desktop_xl_content,large_desktop_2xl_title,large_desktop_2xl_content,Breakpoints:Breakpoints$1,clear,clear_canvas_title,clear_canvas_description,cancel,yes,preview,settings,styling,data_provider,remove_provider_confirmation,remove_provider_warning,remove,no_data_providers,learn_more,add_data_providers,select_provider,choose,page_data_providers,view_data,mark_as_global,global_block_note,global_block_indicator,global_block_category,enter_global_block_name,eg_header_footer,blocks_selected,cut,copy:copy$1,delete:"Delete",clear_selection,dev_mode_message,to_see_page_preview,"flex.heading":"Flex Child","flex.basis":"Basis","flex.order":"Order","flex.flex":"Flex","flex.grow":"Grow","flex.shrink":"Shrink","grid.heading":"Grid Child","grid.col_span":"Col Span","grid.col_start":"Col Start","grid.col_end":"Col End","grid.row_span":"Row Span","grid.row_start":"Row Start","grid.row_end":"Row End","grid.order":"Order","layout.heading":"Layout","layout.width":"Width","layout.height":"Height","layout.margin":"Margin","layout.margin_all":"All","layout.margin_lr":"Left-Right","layout.margin_tb":"Top-Bottom","layout.margin_top":"Top","layout.margin_right":"Right","layout.margin_bottom":"Bottom","layout.margin_left":"Left","layout.padding":"Padding","layout.padding_all":"All","layout.padding_lr":"Left-Right","layout.padding_tb":"Top-Bottom","layout.padding_top":"Top","layout.padding_right":"Right","layout.padding_bottom":"Bottom","layout.padding_left":"Left","layout.space_bt":"Space Bt.","layout.space_lr":"Left-Right","layout.space_tb":"Top-Bottom","size.heading":"Size","size.min_width_height":"Min width & height","size.min_width":"Min Width","size.min_height":"Min Height","size.max_width_height":"Max width & height","size.max_width":"Max Width","size.max_height":"Max Height","size.object_options_aspect_ratio":"Object options & aspect ratio","size.aspect":"Aspect","size.fit":"Fit","size.position":"Position","display.heading":"Display","display.display":"Display","display.flex_options":"Flex options","display.flex_direction":"Direction","display.flex_wrap":"Wrap","display.justify_content":"Justify","display.align_content":"Content","display.align_items":"Items","display.gap":"Gap","display.gap_all":"All","display.gap_lr":"Left-Right","display.gap_tb":"Top-Bottom","display.grid_options":"Grid options","display.grid_columns":"Columns","display.grid_rows":"Rows","display.grid_auto_flow":"Auto Flow","display.grid_auto_cols":"Auto Cols","display.grid_auto_rows":"Auto Rows","display.visibility_opacity":"Visibility & Opacity","display.visibility":"Visibility","display.opacity":"Opacity","position.heading":"Position","position.position":"Position","position.options":"Position options","position.direction":"Direction","position.top":"Top","position.right":"Right","position.bottom":"Bottom","position.left":"Left","position.inset":"Inset","position.all":"All","position.lr":"Left Right","position.tb":"Top Bottom","position.z_index":"Z-Index","position.float_clear":"Float & Clear","position.float":"Float","position.clear":"Clear","position.overflow_overscroll":"Overflow & Overscroll","position.overflow":"Overflow","position.overscroll":"Overscroll","typography.heading":"Typography","typography.font":"Font","typography.size":"Size","typography.height":"Height","typography.weight":"Weight","typography.color":"Color","typography.alignments":"Alignments","typography.align":"Align","typography.valign":"V. Align","typography.spacing_decoration_more":"Spacing, decoration & more","typography.spacing":"Spacing","typography.decoration":"Decoration","typography.thickness":"Thickness","typography.transform":"Transform","typography.whitespace_breaks":"White space & breaks","typography.whitespace":"Whitespace","typography.wordbreak":"Wordbreak","background.heading":"Background","background.bgcolor":"Bg. Color","background.position_size_more":"Position, Size & more","background.attachment":"Attachment","background.clipping":"Clipping","background.origin":"Origin","background.position":"Position","background.repeat":"Repeat","background.size":"Size","background.gradient":"Gradient","background.gradient_colors":"Gradient colors","background.from_color":"From","background.via_color":"Via","background.to_color":"To","border.heading":"Border & Outline","border.width":"Width","border.all":"All","border.lr":"Left Right","border.tb":"Top bottom","border.top":"Top","border.right":"Right","border.bottom":"Bottom","border.left":"Left","border.corners":"Corners","border.top_left":"Top Left","border.top_right":"Top right","border.bottom_right":"Bottom right","border.bottom_left":"Bottom left","border.color":"Color","border.style":"Style","border.divide_options":"Divide options","border.divide_color":"Color","border.divide_style":"Style","border.outline_styling":"Outline styling","border.outline_width":"Width","border.outline_offset":"Offset","border.outline_style":"Style","border.ring_options":"Ring options","border.ring_width":"Width","border.ring_color":"Color","border.ring_offset_width":"Offset","border.ring_offset_color":"Off. color","effect.heading":"Effect & Animation","effect.shadow":"Shadow","effect.color":"Color","effect.cursor":"Cursor","effect.blend_cursor":"Blend & Cursor","effect.mix_blend":"Mix Blend","effect.bg_blend":"Bg. Blend","effect.transform":"Transform","effect.origin":"Origin","effect.scale":"Scale","effect.all":"All","effect.lr":"Left-Right","effect.tb":"Top-Bottom","effect.skew":"Skew","effect.translate":"Translate","effect.rotate":"Rotate","effect.animation":"Animation","effect.transition":"Transition","effect.easing":"Easing","effect.duration":"Duration","effect.delay":"Delay","classes.heading":"Classes",theme_config,web_blocks,ai_assistant,close_preview,saved,unsaved,saving,page_is_empty,Theme,Outline,clipboard_not_supported,please_use_chrome_firefox_or_safari,classes_copied_to_clipboard,download_complete,copied,enter_classes_separated_by_space,copy_classes_to_clipboard,classes,ask_ai,edit_with_ai,generating_please_wait,stop:stop$1,eg_this_page_is_about_an_ai_assistant_app_called_chai_studio_it_allows_users_to_create_beautiful_webpages_and_edit_content_with_ai,ask_ai_to_edit_styles,ask_ai_to_edit_content,ai_context,please_select_a_block_to_ask_ai,please_select_a_block_to_edit,edit,tell_about_this_page_eg_this_page_is_about,tag,value,background_image,enter_image_url,replace_image,choose_image,images,typography,background,library,blocks,basic,media,advanced,form,choose_icon_or_enter_svg,groups,ui_libraries,accordions,buttons,layouts,choose_library,no_library_found,faq,hero,features,footer,navbar,icons,testimonials,blog,ai_quick_prompts,sidebar,remove_context,yes_delete,ai_context_updated,you_can_now_ask_ai_to_edit_your_content};i18n.use(reactI18next.initReactI18next).init({resources:{en:{translation:lngEn}},lng:"en",fallbackLng:"en",interpolation:{escapeValue:!1}});const CoreBlock=({block:r,disabled:n,parentId:a})=>{const[,o]=jotai.useAtom(draggedBlockAtom),{type:i,icon:l,label:c}=r,{addCoreBlock:u,addPredefinedBlock:d}=useAddBlock(),[,p]=useSelectedBlockIds(),[,f]=useHighlightBlockId(),m=()=>{if(console.log("addBlockToPage",r,a),lodashEs.has(r,"blocks")){const y=lodashEs.isFunction(r.blocks)?r.blocks():r.blocks;d(runtime.syncBlocksWithDefaults(y),a||null)}else u(r,a||null);emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK})},h=flagged.useFeature("dnd"),{t:g}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("button",{disabled:n,onClick:m,type:"button",onDragStart:y=>{y.dataTransfer.setData("text/plain",JSON.stringify(lodashEs.omit(r,["component","icon"]))),y.dataTransfer.setDragImage(new Image,0,0),o(lodashEs.omit(r,["component","icon"])),setTimeout(()=>{p([]),f(null)},200)},draggable:h?"true":"false",className:"cursor-pointer space-y-2 rounded-lg border border-border p-3 text-center hover:bg-slate-300/50 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:text-gray-400",children:[React.createElement(l||reactIcons.BoxIcon,{className:"w-4 h-4 mx-auto"}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"truncate text-xs",children:lodashEs.capitalize(g(c||i))})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:g(c||i)})})]})})},DefaultChaiBlocks=({parentId:r,gridCols:n="grid-cols-2"})=>{const a=runtime.useChaiBlocks(),o=useBuilderProp("filterChaiBlock",()=>!0),i=lodashEs.filter(a,o),l=lodashEs.groupBy(i,"category"),c=lodashEs.uniq(lodashEs.map(l.core,"group"));return jsxRuntime.jsxRuntimeExports.jsx(ChaiBuilderBlocks,{gridCols:n,parentId:r,groups:c,blocks:l.core})},CORE_GROUPS=["basic","typography","media","layout","form","advanced","other"],ChaiBuilderBlocks=({groups:r,blocks:n,parentId:a,gridCols:o="grid-cols-4"})=>{var u;const{t:i}=reactI18next.useTranslation(),[l]=useBlocksStore(),c=(u=lodashEs.find(l,d=>d._id===a))==null?void 0:u._type;return React.Children.toArray(lodashEs.map(lodashEs.sortBy(r,d=>CORE_GROUPS.indexOf(d)===-1?99:CORE_GROUPS.indexOf(d)),d=>lodashEs.reject(lodashEs.filter(lodashEs.values(n),{group:d}),{hidden:!0}).length?jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Accordion,{type:"single",value:d,collapsible:!0,className:"w-full",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:d,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{className:"rounded-md bg-gray-100 px-4 py-2 capitalize hover:no-underline",children:lodashEs.capitalize(i(d.toLowerCase()))}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionContent,{className:"mx-auto max-w-xl p-3",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"grid gap-2 "+o,children:React.Children.toArray(lodashEs.reject(lodashEs.filter(lodashEs.values(n),{group:d}),{hidden:!0}).map(p=>jsxRuntime.jsxRuntimeExports.jsx(CoreBlock,{parentId:a,block:p,disabled:!canAcceptChildBlock(c,p.type)||!canBeNestedInside(c,p.type)})))})})]})}):null))},AddBlocksPanel=({className:r,showHeading:n=!0,parentId:a=void 0})=>{const{t:o}=reactI18next.useTranslation(),[i,l]=React.useState("library"),[,c]=jotai.useAtom(showPredefinedBlockCategoryAtom),u=useBuilderProp("importHTMLSupport",!0);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:iconBase.cn("flex h-full w-full flex-col overflow-hidden",r),children:[n?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mb-2 flex flex-col justify-between rounded-md bg-background/30 p-1",children:[jsxRuntime.jsxRuntimeExports.jsx("h1",{className:"flex flex-col items-baseline px-1 text-xl font-semibold xl:flex-col",children:o("add_block")}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"p-0 text-xs font-light leading-3 opacity-80 xl:pl-1",children:o(i==="html"?"enter_paste_tailwind_html":"click_to_add_block")})]}):null,jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Tabs,{onValueChange:d=>{c(""),l(d)},value:i,className:iconBase.cn("h-max",u?"":"hidden"),children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.TabsList,{className:"grid w-full "+(u?"grid-cols-3":"grid-cols-1"),children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"library",children:o("library")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"core",children:o("blocks")}),u?jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"html",children:o("import")}):null]})}),i==="core"&&jsxRuntime.jsxRuntimeExports.jsx(contextMenu.ScrollArea,{className:"-mx-1.5 h-[calc(100vh-156px)] overflow-y-auto",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-2 w-full",children:jsxRuntime.jsxRuntimeExports.jsx(DefaultChaiBlocks,{gridCols:"grid-cols-4",parentId:a})})}),i==="library"&&jsxRuntime.jsxRuntimeExports.jsx(UILibraries,{parentId:a}),i==="html"&&u?jsxRuntime.jsxRuntimeExports.jsx(ImportHTML$1,{parentId:a}):null]})},AddBlocksPanel$1=AddBlocksPanel;function FaCheck(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 448 512"},child:[{tag:"path",attr:{d:"M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"},child:[]}]})(r)}function FaFilePen(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 576 512"},child:[{tag:"path",attr:{d:"M0 64C0 28.7 28.7 0 64 0H224V128c0 17.7 14.3 32 32 32H384V299.6l-94.7 94.7c-8.2 8.2-14 18.5-16.8 29.7l-15 60.1c-2.3 9.4-1.8 19 1.4 27.8H64c-35.3 0-64-28.7-64-64V64zm384 64H256V0L384 128zM549.8 235.7l14.4 14.4c15.6 15.6 15.6 40.9 0 56.6l-29.4 29.4-71-71 29.4-29.4c15.6-15.6 40.9-15.6 56.6 0zM311.9 417L441.1 287.8l71 71L382.9 487.9c-4.1 4.1-9.2 7-14.9 8.4l-60.1 15c-5.5 1.4-11.2-.2-15.2-4.2s-5.6-9.7-4.2-15.2l15-60.1c1.4-5.6 4.3-10.8 8.4-14.9z"},child:[]}]})(r)}const QUICK_PROMPTS=[{name:"ai_quick_prompts.improve_writing",icon:FaFilePen,prompt:"Improving writing in all text elements. Replacing placeholder content with meaningful relevant content."},{name:"ai_quick_prompts.replace_placeholder_content",icon:FaRecycle,prompt:"Discard current placeholder content and replace with meaningful relevant content."},{name:"ai_quick_prompts.fix_grammar",icon:reactIcons.CheckIcon,prompt:"Fix grammar in all text elements. Ensuring the text is grammatically correct and free of errors."},{name:"ai_quick_prompts.make_longer",icon:reactIcons.ArrowUpIcon,prompt:"Make all text elements longer."},{name:"ai_quick_prompts.make_shorter",icon:reactIcons.ArrowDownIcon,prompt:"Make all text elements shorter."},{name:"ai_quick_prompts.add_emojis",icon:lucideReact.SmileIcon,prompt:"Add emojis to text elements if relevant."},{name:"ai_quick_prompts.randomize",icon:lucideReact.ShuffleIcon,prompt:"Randomize all text elements."}];function QuickPrompts({onClick:r}){const{loading:n}=useAskAi(),{t:a}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsx("div",{className:n?"pointer-events-none opacity-50":"",children:jsxRuntime.jsxRuntimeExports.jsx("ul",{className:"space-y-2",children:QUICK_PROMPTS.map(({name:o,icon:i,subMenus:l,prompt:c})=>l?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenu,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("li",{className:"flex cursor-pointer items-center space-x-2 hover:bg-gray-100",children:[jsxRuntime.jsxRuntimeExports.jsx(i,{className:"h-4 w-4"}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:o})]},o)}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuContent,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuLabel,{children:"My Account"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuSeparator,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuItem,{children:"Profile"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuItem,{children:"Billing"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuItem,{children:"Team"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuItem,{children:"Subscription"})]})]}):jsxRuntime.jsxRuntimeExports.jsxs("li",{onClick:()=>r(c),className:"flex cursor-pointer items-center space-x-2 rounded p-1 pl-2 text-sm hover:bg-gray-100",children:[jsxRuntime.jsxRuntimeExports.jsx(i,{className:"h-4 w-4"}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:a(o)})]},o))})})}const AIUserPrompt=({blockId:r})=>{const{t:n}=reactI18next.useTranslation(),{askAi:a,loading:o,error:i}=useAskAi(),[l,c]=React.useState(""),[u,d]=React.useState(!0),[p,f]=React.useState(),m=React.useRef(null),h=React.useRef(null);React.useEffect(()=>{var y;(y=m.current)==null||y.focus()},[]);const g=y=>{const{usage:b}=y||{};!i&&b&&f(b),h.current=setTimeout(()=>f(void 0),1e4),i||c("")};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{onClick:()=>d(!u),className:"flex cursor-default items-center justify-between border-b border-gray-300 py-2 text-sm font-bold text-gray-600 hover:bg-gray-50",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:n("ask_ai")}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.ChevronDown,{className:"h-4 w-4 text-gray-500 "+(u?"rotate-180":"")})})]}),u&&r?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{ref:m,value:l,onChange:y=>c(y.target.value),placeholder:n("ask_ai_to_edit_content"),className:"w-full border border-gray-400 focus:border-0",rows:3,onKeyDown:y=>{y.key==="Enter"&&(y.preventDefault(),h.current&&clearTimeout(h.current),f(void 0),a("content",r,l,g))}}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"my-2 flex items-center gap-2",children:[o?null:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:l.trim().length<5||o,onClick:()=>{h.current&&clearTimeout(h.current),f(void 0),a("content",r,l,g)},variant:"default",className:"w-fit",size:"sm",children:o?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"h-5 w-5 animate-spin"}),n("generating_please_wait")]}):n("edit_with_ai")}),o?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col gap-2",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Skeleton,{className:"flex w-full items-center space-x-1 px-4 py-1 pl-2",children:[jsxRuntime.jsxRuntimeExports.jsx(FaSpinner,{className:"h-4 w-4 animate-spin text-gray-500"}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs",children:n("generating_please_wait")})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{variant:"destructive",onClick:()=>stop(),className:"hidden w-fit",size:"sm",children:n("Stop")})]}):null]}),p?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"max-w-full",children:jsxRuntime.jsxRuntimeExports.jsxs("p",{className:"mb-1 flex justify-between break-words rounded border border-blue-500 bg-blue-100 p-1 text-xs text-blue-500",children:[jsxRuntime.jsxRuntimeExports.jsxs("span",{children:[n("Total tokens used"),": ",p.totalTokens]}),jsxRuntime.jsxRuntimeExports.jsx(Countdown,{})]})}):null,jsxRuntime.jsxRuntimeExports.jsx("div",{className:"max-w-full",children:i&&jsxRuntime.jsxRuntimeExports.jsx("p",{className:"break-words rounded border border-red-500 bg-red-100 p-1 text-xs text-red-500",children:i.message})}),jsxRuntime.jsxRuntimeExports.jsx(QuickPrompts,{onClick:y=>{h.current&&clearTimeout(h.current),f(void 0),a("content",r,y,g)}})]}):u?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"p-4 text-center",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-4 rounded-xl p-4",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.SparklesIcon,{className:"mx-auto text-3xl"}),jsxRuntime.jsxRuntimeExports.jsx("h1",{children:n("please_select_a_block_to_ask_ai")})]})}):null]})},AISetContext=()=>{const{t:r}=reactI18next.useTranslation(),n=useBuilderProp("aiContext",""),[a,o]=React.useState(n),i=React.useRef(null),l=useBuilderProp("saveAiContextCallback",lodashEs.noop),[c,u]=React.useState(!1),[d,p]=React.useState(null),[,f]=React.useState(!1),{toast:m}=contextMenu.useToast(),h=React.useRef(null);React.useEffect(()=>{n&&o(n)},[n]);const g=async()=>{try{u(!0),p(null),await l(a),m({title:r("ai_context_updated"),description:r("you_can_now_ask_ai_to_edit_your_content"),variant:"default"}),h.current.click()}catch(y){p(y)}finally{u(!1)}};return jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Accordion,{onValueChange:y=>{f(y!=="")},type:"single",collapsible:!0,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:"set-context",className:"border-none",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{ref:h,className:"border-b py-2 text-gray-600 hover:no-underline",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-full items-center justify-between",children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"font-bold",children:r("ai_context")})})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionContent,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{ref:i,value:a,onChange:y=>o(y.target.value),placeholder:r("tell_about_this_page_eg_this_page_is_about"),className:"w-full border border-gray-400 bg-background focus:border",rows:10,onKeyDown:y=>{y.key==="Enter"&&(y.preventDefault(),g())}}),n.trim().length===0?jsxRuntime.jsxRuntimeExports.jsx("p",{className:"mt-2 text-xs text-gray-500",children:r("eg_this_page_is_about_an_ai_assistant_app_called_chai_studio_it_allows_users_to_create_beautiful_webpages_and_edit_content_with_ai")}):null,jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2 flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:a.trim().length<5,onClick:()=>g(),variant:"default",className:"w-fit",size:"sm",children:c?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"h-5 w-5 animate-spin"}),r("generating_please_wait")]}):r("save")}),n.trim().length>0?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialog,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:n.trim().length===0,variant:"ghost",className:"w-fit",size:"sm",children:c?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"h-5 w-5 animate-spin"}),r("generating_please_wait")]}):r("delete")})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogContent,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogHeader,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogTitle,{children:[r("remove_context")," ?"]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogDescription,{})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogFooter,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogCancel,{children:r("cancel")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogAction,{onClick:()=>{o(""),g()},children:r("yes_delete")})]})]})]}):null]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-2 max-w-full",children:d&&jsxRuntime.jsxRuntimeExports.jsx("p",{className:"break-words rounded border border-red-500 bg-red-100 p-1 text-xs text-red-500",children:d.message})})]})]})})},AskAI=()=>{const[r]=useSelectedBlockIds();return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2",children:[jsxRuntime.jsxRuntimeExports.jsx(AISetContext,{}),jsxRuntime.jsxRuntimeExports.jsx(AIUserPrompt,{blockId:lodashEs.first(r)})]})},AttrsEditor=React.memo(function r({preloadedAttributes:n=[],onAttributesChange:a}){const[o,i]=React.useState([]),[l,c]=React.useState(""),[u,d]=React.useState(""),[p,f]=React.useState(null),[m,h]=React.useState(""),g=React.useRef(null),y=React.useRef(null);React.useEffect(()=>{i(n)},[n]);const b=()=>{if(l.startsWith("@")){h("Attribute keys cannot start with '@'");return}if(l){const A=[...o,{key:l,value:u}];a(A),i(o),c(""),d(""),h("")}},v=A=>{const S=o.filter((w,C)=>C!==A);a(S),i(S)},x=A=>{f(A),c(o[A].key),d(o[A].value)},E=()=>{if(l.startsWith("@")){h("Attribute keys cannot start with '@'");return}if(p!==null&&l){const A=[...o];A[p]={key:l,value:u},a(A),i(A),f(null),c(""),d(""),h("")}},R=A=>{A.key==="Enter"&&!A.shiftKey&&(A.preventDefault(),p!==null?E():b())};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"max-w-full",children:[jsxRuntime.jsxRuntimeExports.jsxs("form",{onSubmit:A=>{A.preventDefault(),p!==null?E():b()},className:"space-y-3",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"w-full",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Label,{htmlFor:"attrKey",className:"text-xs",children:"Key"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Input,{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",id:"attrKey",ref:g,value:l,onChange:A=>c(A.target.value),placeholder:"Key",className:"h-8 text-sm"})]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"w-full",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Label,{htmlFor:"attrValue",className:"text-xs",children:"Value"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",id:"attrValue",rows:2,ref:y,value:u,onChange:A=>d(A.target.value),onKeyDown:R,placeholder:"Value",className:"bg-background text-sm"})]})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{type:"submit",variant:"secondary",className:"h-8 w-fit text-sm",children:p!==null?"Save":"Add"}),m&&jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs text-red-500",children:m})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-4 space-y-1 overflow-y-auto",children:o.map((A,S)=>jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-between rounded bg-muted p-1.5 text-sm",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mr-2 flex flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:"truncate font-semibold",children:A.key}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"text-wrap max-w-[200px] text-muted-foreground",children:A.value.toString()})]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex-shrink-0",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{variant:"ghost",size:"icon",className:"h-6 w-6",onClick:()=>x(S),children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Edit2,{className:"h-3 w-3"}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"sr-only",children:"Edit attribute"})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{variant:"ghost",size:"icon",className:"h-6 w-6",onClick:()=>v(S),children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.X,{className:"h-3 w-3"}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"sr-only",children:"Remove attribute"})]})]})]},S))})]})}),BlockAttributesEditor=React__namespace.memo(()=>{const r=useSelectedBlock(),[n,a]=React.useState([]),[o]=useSelectedStylingBlocks(),i=useUpdateBlocksProps(),l=`${lodashEs.get(o,"0.prop")}_attrs`;React__namespace.useEffect(()=>{const u=lodashEs.map(lodashEs.get(r,l),(d,p)=>({key:p,value:d}));lodashEs.isEmpty(u)?a([]):a(u)},[lodashEs.get(r,l)]);const c=React__namespace.useCallback((u=[])=>{const d={};lodashEs.forEach(u,p=>{lodashEs.isEmpty(p.key)||lodashEs.set(d,p.key,p.value)}),i([lodashEs.get(r,"_id")],{[l]:d})},[r,i,l]);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex-col gap-y-2",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col",children:jsxRuntime.jsxRuntimeExports.jsx("div",{children:jsxRuntime.jsxRuntimeExports.jsx(AttrsEditor,{preloadedAttributes:n,onAttributesChange:c})})})})});var __create=Object.create,__defProp$1v=Object.defineProperty,__getOwnPropDesc=Object.getOwnPropertyDescriptor,__getOwnPropNames=Object.getOwnPropertyNames,__getProtoOf=Object.getPrototypeOf,__hasOwnProp$1x=Object.prototype.hasOwnProperty,__esm=(r,n)=>function(){return r&&(n=(0,r[__getOwnPropNames(r)[0]])(r=0)),n},__commonJS=(r,n)=>function(){return n||(0,r[__getOwnPropNames(r)[0]])((n={exports:{}}).exports,n),n.exports},__copyProps=(r,n,a,o)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of __getOwnPropNames(n))!__hasOwnProp$1x.call(r,i)&&i!==a&&__defProp$1v(r,i,{get:()=>n[i],enumerable:!(o=__getOwnPropDesc(n,i))||o.enumerable});return r},__toESM=(r,n,a)=>(a=r!=null?__create(__getProtoOf(r)):{},__copyProps(n||!r||!r.__esModule?__defProp$1v(a,"default",{value:r,enumerable:!0}):a,r)),init_react_shim=__esm({"react-shim.js"(){}});init_react_shim();init_react_shim();var isEqualAtomsValues=(r,n)=>r.size===n.size&&Array.from(r).every(([a,o])=>Object.is(n.get(a),o)),isEqualAtomsDependents=(r,n)=>r.size===n.size&&Array.from(r).every(([a,o])=>{const i=n.get(a);return i&&o.size===i.size&&Array.from(o).every(l=>i.has(l))});function useAtomsSnapshot({shouldShowPrivateAtoms:r=!1,...n}={}){const a=useStore(n),[o,i]=React.useState(()=>({values:new Map,dependents:new Map})),l=React.useRef(!0);return l.current=!0,React.useLayoutEffect(()=>{l.current=!1}),React.useEffect(()=>{const c=(a==null?void 0:a.dev_subscribe_store)||(a==null?void 0:a.dev_subscribe_state);if(!c)return;let u=new Map,d=new Map;"dev_subscribe_store"in a||console.warn("[DEPRECATION-WARNING]: Your Jotai version is out-of-date and contains deprecated properties that will be removed soon. Please update to the latest version of Jotai.");const p=m=>{var b,v,x;typeof m!="object"&&console.warn("[DEPRECATION-WARNING]: Your Jotai version is out-of-date and contains deprecated properties that will be removed soon. Please update to the latest version of Jotai.");const h=new Map,g=new Map;for(const E of((b=a.dev_get_mounted_atoms)==null?void 0:b.call(a))||[]){if(!r&&E.debugPrivate)continue;const R=(v=a.dev_get_atom_state)==null?void 0:v.call(a,E);R&&"v"in R&&h.set(E,R.v);const A=(x=a.dev_get_mounted)==null?void 0:x.call(a,E);if(A){let S=A.t;r||(S=new Set(Array.from(S.values()).filter(w=>!w.debugPrivate))),g.set(E,S)}}if(isEqualAtomsValues(u,h)&&isEqualAtomsDependents(d,g))return;u=h,d=g;const y=()=>i({values:h,dependents:g});l.current?Promise.resolve().then(y):y()},f=c==null?void 0:c(p,2);return p({}),f},[a,r]),o}init_react_shim();function useGotoAtomsSnapshot(r){const n=useStore(r);return React.useCallback(a=>{n.dev_restore_atoms&&n.dev_restore_atoms(a.values)},[n])}init_react_shim();init_react_shim();init_react_shim();init_react_shim();init_react_shim();function sheetForTag(r){if(r.sheet)return r.sheet;for(var n=0;n<document.styleSheets.length;n++)if(document.styleSheets[n].ownerNode===r)return document.styleSheets[n]}function createStyleElement(r){var n=document.createElement("style");return n.setAttribute("data-emotion",r.key),r.nonce!==void 0&&n.setAttribute("nonce",r.nonce),n.appendChild(document.createTextNode("")),n.setAttribute("data-s",""),n}var StyleSheet=function(){function r(a){var o=this;this._insertTag=function(i){var l;o.tags.length===0?o.insertionPoint?l=o.insertionPoint.nextSibling:o.prepend?l=o.container.firstChild:l=o.before:l=o.tags[o.tags.length-1].nextSibling,o.container.insertBefore(i,l),o.tags.push(i)},this.isSpeedy=a.speedy===void 0?process.env.NODE_ENV==="production":a.speedy,this.tags=[],this.ctr=0,this.nonce=a.nonce,this.key=a.key,this.container=a.container,this.prepend=a.prepend,this.insertionPoint=a.insertionPoint,this.before=null}var n=r.prototype;return n.hydrate=function(o){o.forEach(this._insertTag)},n.insert=function(o){this.ctr%(this.isSpeedy?65e3:1)===0&&this._insertTag(createStyleElement(this));var i=this.tags[this.tags.length-1];if(process.env.NODE_ENV!=="production"){var l=o.charCodeAt(0)===64&&o.charCodeAt(1)===105;l&&this._alreadyInsertedOrderInsensitiveRule&&console.error(`You're attempting to insert the following rule:
61
+ }`)},[l,h]),React.useEffect(()=>{d.querySelector("#drop-target-block").innerHTML=u?`[data-block-id="${u}"]{ outline: 1px dashed orange !important; outline-offset: -1px;}`:""},[u]),jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:(y||b)&&jsxRuntime.jsxRuntimeExports.jsx("link",{rel:"stylesheet",href:`https://fonts.googleapis.com/css2?family=${y?`${y.replace(/ /g,"+")}:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900`:""}${y&&b&&y!==b?"&":""}${b&&b!==y?`family=${b.replace(/ /g,"+")}:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900`:""}&display=swap`})})},useChaiExternalData=()=>jotai.useAtom(chaiExternalDataAtom),useCanvasSettings=()=>jotai.useAtom(canvasSettingsAtom),isVisibleAtBreakpoint=(r,n)=>{const a=["xs","sm","md","lg","xl","2xl"],o=a.indexOf(n),i=r.split(" ");let l=new Array(a.length).fill(!1);for(const c of i){let[u,d]=c.split(":");d||(d=u,u="xs");const p=a.indexOf(u);if(p<=o){const f=["block","flex","inline","inline-block","inline-flex","grid","table"],m=["hidden"];if(f.includes(d))for(let h=p;h<a.length;h++)l[h]=!0;else if(m.includes(d))for(let h=p;h<a.length;h++)l[h]=!1}}return l[o]},getSlots=r=>{const n={};return Object.keys(r).forEach(a=>{lodashEs.isString(r[a])&&r[a].startsWith(STRINGS.SLOT_KEY)&&(n[a]=r[a].replace(STRINGS.SLOT_KEY,"").split(","))}),n},generateClassNames=lodashEs.memoize(r=>{const n=r.replace(STRINGS.STYLES_KEY,"").split(",");return tailwindMerge.twMerge(n[0],n[1])});function getElementAttrs(r,n){return lodashEs.get(r,`${n}_attrs`,{})}function getStyleAttrs(r,n){const a={};return Object.keys(r).forEach(o=>{if(lodashEs.isString(r[o])&&r[o].startsWith(STRINGS.STYLES_KEY)){const i=generateClassNames(r[o]),l=getElementAttrs(r,o);a[o]={className:i,"data-style-prop":o,"data-block-parent":r._id,"data-style-id":`${o}-${r._id}`,...l};const c=lodashEs.has(l,"x-show")||lodashEs.has(l,"x-if");c&&(a.__isHidden=c&&!isVisibleAtBreakpoint(i,n))}}),a}function applyBindings(r,n){const a=lodashEs.get(r,"_bindings",{});return lodashEs.isEmpty(a)?{...r}:(lodashEs.each(a,(o,i)=>{lodashEs.isString(o)&&lodashEs.get(n,o,null)&&(r[i]=lodashEs.get(n,o,null))}),r)}function isDescendant(r,n,a){if(!lodashEs.find(a,{_id:r}))return!1;const i=lodashEs.filter(a,{_parent:r});return i.some(l=>l._id===n)?!0:i.some(l=>isDescendant(l._id,n,a))}function BlocksRendererStatic({blocks:r}){const[n]=useBlocksStore(),[a]=jotai.useAtom(xShowBlocksAtom),[o]=useCutBlockIds(),[i]=jotai.useAtom(draggedBlockAtom),[l]=jotai.useAtom(dropTargetBlockIdAtom),[,c]=useCanvasWidth(),[u]=useCanvasSettings(),d=React.useCallback(h=>getStyleAttrs(h,c),[c]),[p]=useChaiExternalData(),[f]=jotai.useAtom(inlineEditingActiveAtom),m=React.useCallback(h=>h.reduce((g,y)=>{const b=lodashEs.get(u,y,{});return{...g,...b}},{}),[u,n]);return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:React.Children.toArray(r.map((h,g)=>{if(f===h._id)return null;const y=getSlots(h),b={};lodashEs.isEmpty(y)||Object.keys(y).forEach(C=>{b[C]=React.Children.toArray(y[C].map(I=>jsxRuntime.jsxRuntimeExports.jsx(BlocksRendererStatic,{blocks:[lodashEs.find(n,{_id:I})]})))});const v=lodashEs.filter(n,{_parent:h._id});b.children=v.length?jsxRuntime.jsxRuntimeExports.jsx(BlocksRendererStatic,{blocks:v}):null;const x=runtime.getBlockComponent(h._type),E=lodashEs.get(x,"builderComponent",lodashEs.get(x,"component",null));if(lodashEs.isNull(E))return jsxRuntime.jsxRuntimeExports.jsx("noscript",{children:`<!-- ${h==null?void 0:h._type} not registered -->`});const R=lodashEs.has(x,"getBlockStateFrom")?x==null?void 0:x.getBlockStateFrom(h,n):[],A=m(R),S=d(h);if(lodashEs.get(S,"__isHidden",!1)&&!lodashEs.includes(a,h._id))return null;const w=i&&isDescendant(i._id,h._id,n);return jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{children:React.createElement(E,{blockProps:{...lodashEs.includes(a,h._id)?{"force-show":""}:{},"data-block-id":h._id,"data-block-type":h._type,...i?{"data-dnd":canAcceptChildBlock(h._type,i==null?void 0:i._type)?"yes":"no","data-dnd-dragged":i._id===h._id||w?"yes":"no"}:{},...l===h._id&&!w?{"data-drop":"yes"}:{},...lodashEs.includes(o,h._id)?{"data-cut-block":"yes"}:{}},index:g,...applyBindings(h,p),...lodashEs.omit(S,["__isHidden"]),...b,inBuilder:!0,blockState:A})})}))})}const useAllDataProviders=()=>React.useMemo(()=>runtime.getChaiDataProviders(),[]),BlocksExternalDataProvider=({children:r})=>{const[,n]=useChaiExternalData(),[a]=usePageDataProviders(),o=useAllDataProviders();return React.useEffect(()=>(n({}),lodashEs.each(a,i=>{const l=lodashEs.find(o,{providerKey:i.providerKey});if(l){const c=(l==null?void 0:l.mockFn)||(l==null?void 0:l.dataFn);c&&c(i.args).then(u=>n(d=>({...d,[i.providerKey]:u})))}}),()=>{lodashEs.each(a,i=>{n(l=>(delete l[i.providerKey],l))})}),[o,a,n]),jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:r})},StaticBlocksRenderer=()=>{const[r]=useBlocksStore(),n=lodashEs.isEmpty(r)?null:jsxRuntime.jsxRuntimeExports.jsx(BlocksExternalDataProvider,{children:jsxRuntime.jsxRuntimeExports.jsx(BlocksRendererStatic,{blocks:lodashEs.filter(r,a=>lodashEs.isEmpty(a._parent))})});return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:n})},AddBlockAtBottom=()=>{const{t:r}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsxs("button",{onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK}),className:"mt-1 block w-full rounded-md bg-gray-100 p-2 text-black hover:bg-gray-200 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-700",children:["+ ",r("add_block")]})},ResizableCanvasWrapper=({children:r,onMount:n,onResize:a})=>{const o=React.useRef(null),i=web.useDebouncedCallback(()=>{const{clientWidth:l}=o.current;a(l)},[o.current],100);return web.useResizeObserver(o.current,i,o.current!==null),React.useEffect(()=>{const{clientWidth:l}=o.current;n(l)},[]),jsxRuntime.jsxRuntimeExports.jsx("div",{id:"main-content",className:"h-full w-full p-10 pb-0",ref:o,children:r})},getElementByStyleId=(r,n)=>r.querySelector(`[data-style-id="${n}"]`),StaticCanvas=()=>{const[r]=jotai.useAtom(networkModeAtom),[n]=useCanvasWidth(),[,a]=useSelectedBlockIds(),o=useSelectedBlock(),[,i]=useHighlightBlockId(),l=React.useRef(null),c=React.useRef(null),[u,d]=React.useState({width:0,height:0}),p=useCanvasScale(u),[f,m]=React.useState([]),[,h]=React.useState([]),[,g]=jotai.useAtom(canvasIframeAtom),[y,b]=useSelectedStylingBlocks(),v=useBuilderProp("loading",!1),x=useBuilderProp("htmlDir","ltr"),E=S=>{d(w=>({...w,width:S}))};React.useEffect(()=>{if(!c.current)return;const{clientWidth:S,clientHeight:w}=c.current;d({width:S,height:w})},[c,n]);const R=(S,w=0)=>{const{top:C}=S.getBoundingClientRect();return C+w>=0&&C-w<=window.innerHeight};React.useEffect(()=>{var S,w;if(o&&o.type!=="Multiple"&&l.current){const C=getElementByDataBlockId(l.current.contentDocument,o._id);C&&(R(C)||(w=(S=l.current)==null?void 0:S.contentWindow)==null||w.scrollTo({top:C.offsetTop,behavior:"smooth"}),m([C]))}},[o]),React.useEffect(()=>{if(!lodashEs.isEmpty(y)&&l.current){const S=getElementByStyleId(l.current.contentDocument,lodashEs.first(y).id);h(S?[S]:[null])}else h([null])},[y]);const A=React.useMemo(()=>{let S=IframeInitialContent;return S=S.replace("__HTML_DIR__",x),r==="offline"&&(S=S.replace("https://old.chaibuilder.com/offline/tailwind.cdn.js","/offline/tailwind.cdn.js"),S=S.replace("https://unpkg.com/aos@next/dist/aos.css","/offline/aos.css"),S=S.replace("https://unpkg.com/aos@next/dist/aos.js","/offline/aos.js")),S},[r]);return jsxRuntime.jsxRuntimeExports.jsx(ResizableCanvasWrapper,{onMount:E,onResize:E,children:jsxRuntime.jsxRuntimeExports.jsx("div",{onClick:()=>{a([]),b([])},onMouseLeave:()=>setTimeout(()=>i(""),300),className:"relative mx-auto h-full w-full overflow-hidden",ref:c,children:jsxRuntime.jsxRuntimeExports.jsxs(ChaiFrame,{contentDidMount:()=>g(l.current),ref:l,id:"canvas-iframe",style:{...p,...lodashEs.isEmpty(p)?{width:`${n}px`}:{}},className:"relative mx-auto box-content h-full w-full max-w-full shadow-lg transition-all duration-300 ease-linear",initialContent:A,children:[jsxRuntime.jsxRuntimeExports.jsx(KeyboardHandler,{}),jsxRuntime.jsxRuntimeExports.jsx(BlockActionsStatic,{block:o,selectedBlockElement:lodashEs.first(f)}),jsxRuntime.jsxRuntimeExports.jsx(HeadTags,{model:"page"}),jsxRuntime.jsxRuntimeExports.jsx(reactWrapBalancer.Provider,{children:jsxRuntime.jsxRuntimeExports.jsxs(Canvas,{children:[v?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-full p-4",children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"h-full"})}):jsxRuntime.jsxRuntimeExports.jsx(StaticBlocksRenderer,{}),jsxRuntime.jsxRuntimeExports.jsx(AddBlockAtBottom,{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{})]})}),jsxRuntime.jsxRuntimeExports.jsx("div",{id:"placeholder",className:"pointer-events-none absolute z-[99999] max-w-full bg-green-500 transition-transform"})]})})})},StaticCanvas$1=StaticCanvas,FallbackError=()=>jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-full w-full rounded-md bg-red-200 p-4 text-red-500",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full w-full flex-col items-center justify-center",children:[jsxRuntime.jsxRuntimeExports.jsx("p",{className:"font-semibold",children:"Oops! Something went wrong."}),jsxRuntime.jsxRuntimeExports.jsx("p",{children:"Please try again."})]})}),CodeEditor$1=React.lazy(()=>Promise.resolve().then(()=>require("./CodeEditor-cWD1nrFR.cjs"))),CanvasArea=()=>{const[r]=useCodeEditor(),n=useBuilderProp("onError",lodashEs.noop);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex h-full max-h-full w-full flex-1 flex-col",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex h-full max-h-full flex-col overflow-hidden bg-gray-100/40 px-2",children:[jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"h-full"}),children:jsxRuntime.jsxRuntimeExports.jsx(reactErrorBoundary.ErrorBoundary,{fallback:jsxRuntime.jsxRuntimeExports.jsx(FallbackError,{}),onError:n,children:jsxRuntime.jsxRuntimeExports.jsx(StaticCanvas$1,{})})}),r?jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"h-full"}),children:jsxRuntime.jsxRuntimeExports.jsx(reResizable.Resizable,{enable:{top:!0,bottom:!1},className:"max-h-[400px] min-h-[200px]",children:jsxRuntime.jsxRuntimeExports.jsx(CodeEditor$1,{})})}):null]})})},CanvasArea$1=CanvasArea,ColorField=({value:r,onChange:n,id:a,onBlur:o})=>{const i=lodashEs.debounce(n,200),l=c=>i(c.target.value);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-1.5 flex items-center gap-x-3",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-3/5 flex-col",children:jsxRuntime.jsxRuntimeExports.jsx("input",{type:"color",className:"text-xs p-0",value:r,onBlur:({target:{value:c}})=>o(a,c),onChange:l})})})},FONTS=[{title:"Roboto",value:"Roboto"},{title:"Open Sans",value:"Open Sans"},{title:"Montserrat",value:"Montserrat"},{title:"Lato",value:"Lato"},{title:"Poppins",value:"Poppins"},{title:"Oswald",value:"Oswald"},{title:"Raleway",value:"Raleway"},{title:"Ubuntu",value:"Ubuntu"},{title:"Nunito",value:"Nunito"},{title:"Merriweather",value:"Merriweather"},{title:"Nunito Sans",value:"Nunito Sans"},{title:"Playfair Display",value:"Playfair Display"},{title:"Rubik",value:"Rubik"},{title:"Inter",value:"Inter"},{title:"Lora",value:"Lora"},{title:"Kanit",value:"Kanit"},{title:"Fira Sans",value:"Fira Sans"},{title:"Hind",value:"Hind"},{title:"Quicksand",value:"Quicksand"},{title:"Mulish",value:"Mulish"},{title:"Barlow",value:"Barlow"},{title:"Inconsolata",value:"Inconsolata"},{title:"Titillium Web",value:"Titillium Web"},{title:"Heebo",value:"Heebo"},{title:"IBM Plex Sans",value:"IBM Plex Sans"},{title:"DM Sans",value:"DM Sans"},{title:"Nanum Gothic",value:"Nanum Gothic"},{title:"Karla",value:"Karla"},{title:"Arimo",value:"Arimo"},{title:"Cabin",value:"Cabin"},{title:"Oxygen",value:"Oxygen"},{title:"Overpass",value:"Overpass"},{title:"Assistant",value:"Assistant"},{title:"Tajawal",value:"Tajawal"},{title:"Play",value:"Play"},{title:"Exo",value:"Exo"},{title:"Cinzel",value:"Cinzel"},{title:"Faustina",value:"Faustina"},{title:"Philosopher",value:"Philosopher"},{title:"Gelasio",value:"Gelasio"},{title:"Sofia Sans Condensed",value:"Sofia Sans Condensed"},{title:"Noto Sans Devanagari",value:"Noto Sans Devanagari"},{title:"Actor",value:"Actor"},{title:"Epilogue",value:"Epilogue"},{title:"Glegoo",value:"Glegoo"},{title:"Overlock",value:"Overlock"},{title:"Lustria",value:"Lustria"},{title:"Ovo",value:"Ovo"},{title:"Suranna",value:"Suranna"},{title:"Bebas Neue",value:"Bebas Neue"},{title:"Manrope",value:"Manrope"}],ThemeConfigPanel=({showHeading:r=!0,className:n=""})=>{const a=useBuilderProp("onSaveBrandingOptions",lodashEs.noop),[o,i]=useBrandingOptions(),[l]=useBlocksContainer(),c=React__namespace.useRef(o),{t:u}=reactI18next.useTranslation();React__namespace.useEffect(()=>()=>{lodashEs.isEqual(o,c.current)||a(c.current)},[]);const d=({formData:S},w)=>{w&&(i(S),c.current=S)},{bodyFont:p,headingFont:f,primaryColor:m,bodyTextDarkColor:h,bodyTextLightColor:g,bodyBgDarkColor:y,secondaryColor:b,bodyBgLightColor:v,roundedCorners:x}=o;let E={headingFont:iconBase.f({title:u("theme_config.heading_font"),default:f,options:FONTS}),bodyFont:iconBase.f({title:u("theme_config.body_font"),default:p,options:FONTS}),roundedCorners:iconBase.y({title:u("theme_config.rounded_corner"),default:parseInt(x||5,10)}),primaryColor:iconBase.s({title:u("theme_config.primary"),default:m}),secondaryColor:iconBase.s({title:u("theme_config.secondary"),default:b})};l||(E={...E,bodyBgLightColor:iconBase.s({title:u("theme_config.background"),default:v}),bodyTextLightColor:iconBase.s({title:u("theme_config.text_color"),default:h}),bodyBgDarkColor:iconBase.s({title:u("theme_config.background_dark_mode"),default:y}),bodyTextDarkColor:iconBase.s({title:u("theme_config.text_color_dark_mode"),default:g})});const R={type:"object",properties:{}},A={};return Object.keys(E).forEach(S=>{const w=E[S];return R.properties||(R.properties={}),R.properties[S]=w.schema,A[S]=w.uiSchema,!0}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:iconBase.cn("flex h-full w-full select-none flex-col",n),children:[r?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"rounded-md bg-background/30 p-1",children:jsxRuntime.jsxRuntimeExports.jsx("h1",{className:"px-1 font-semibold",children:u("Theme Configuration")})}):null,jsxRuntime.jsxRuntimeExports.jsx(Form,{widgets:{color:ColorField},idSeparator:".",autoComplete:"off",omitExtraData:!0,liveOmit:!0,liveValidate:!0,uiSchema:A,schema:R,formData:o,validator,onChange:d})]})},ThemeOptions=ThemeConfigPanel,TypeIcon=r=>{switch(r.type){case"Image":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ImageIcon,{});case"Heading":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.HeadingIcon,{});case"Text":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TextIcon,{});case"Link":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.Link1Icon,{});case"Video":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.VideoIcon,{});case"RichText":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CursorTextIcon,{});case"Button":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ButtonIcon,{});case"CustomHTML":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CodeIcon,{});case"Divider":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DividerHorizontalIcon,{});case"Icon":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.SketchLogoIcon,{});case"List":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.RowsIcon,{});case"Paragraph":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TextIcon,{});case"Row":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.RowsIcon,{});case"ListItem":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ColumnsIcon,{});case"LineBreak":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.SpaceBetweenVerticallyIcon,{});case"Form":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.GroupIcon,{});case"Checkbox":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CheckboxIcon,{});case"FormButton":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ButtonIcon,{});case"Input":case"TextArea":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.InputIcon,{});case"Radio":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.RadiobuttonIcon,{});case"Select":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DropdownMenuIcon,{});case"Table":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TableIcon,{});case"TableHead":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.BorderTopIcon,{});case"TableBody":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.BorderAllIcon,{});case"TableRow":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ViewHorizontalIcon,{});case"TableCell":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DragHandleHorizontalIcon,{});case"DataProvider":return jsxRuntime.jsxRuntimeExports.jsx(lucideReact.DatabaseIcon,{size:16});case"Box":return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.BoxIcon,{});default:return jsxRuntime.jsxRuntimeExports.jsx(reactIcons.BoxModelIcon,{})}},placeholderStyle={display:"flex",alignItems:"center",zIndex:1},DefaultCursor=React.memo(function({top:n,left:a}){const o={position:"absolute",pointerEvents:"none",top:n+"px",left:a+"px",right:0};return jsxRuntime.jsxRuntimeExports.jsx("div",{style:{...placeholderStyle,...o},children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-0.5 flex-1 rounded-[1px] bg-green-500"})})}),Overlay$1=React.memo(function({children:n,isDragging:a}){return a?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"pointer-events-none fixed left-0 top-0 z-[100] h-full w-full",children:n}):null}),DefaultDragPreview=React.memo(({id:r,isDragging:n,mouse:a})=>{const[o]=useBlocksStore(),i=React.useMemo(()=>o.find(c=>c._id===r),[o,r]),l=React.useMemo(()=>({transform:`translate(${(a==null?void 0:a.x)-10}px, ${(a==null?void 0:a.y)-10}px)`}),[a]);return a?jsxRuntime.jsxRuntimeExports.jsx("div",{children:jsxRuntime.jsxRuntimeExports.jsx(Overlay$1,{isDragging:n,children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"pointer-events-none absolute z-50 rounded border border-gray-200 bg-gray-100/80 font-semibold text-blue-600 shadow-md dark:border-gray-700 dark:bg-gray-800",style:l,children:jsxRuntime.jsxRuntimeExports.jsxs("button",{type:"button",className:"flex !cursor-grab items-center p-0.5","aria-label":`Type: ${i==null?void 0:i._type}`,children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"-mt-0.5 h-3 w-3",children:jsxRuntime.jsxRuntimeExports.jsx(TypeIcon,{type:i==null?void 0:i._type})}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"ml-2 truncate text-[11px]",children:(i==null?void 0:i._name)||(i==null?void 0:i._type)})]})})})}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:"hidden"})}),CopyPasteBlocks=()=>{const[r]=useSelectedBlockIds(),{canPaste:n,pasteBlocks:a}=usePasteBlocks(),[,o]=useCopyBlockIds(),{t:i}=reactI18next.useTranslation(),l=useSelectedBlock();return jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{disabled:!canDuplicateBlock(l==null?void 0:l._type),onClick:()=>o(r),className:"flex items-center gap-x-4 text-xs",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CopyIcon,{})," Copy"]}),n(r[0])&&jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{className:"flex items-center gap-x-4 text-xs",onClick:()=>{a(r)},children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CardStackIcon,{})," ",i("Paste")]})]})},CutBlocks=()=>{const[r]=useSelectedBlockIds(),[,n]=useCutBlockIds(),{t:a}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{className:"flex items-center gap-x-4 text-xs",onClick:()=>n(r),children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ScissorsIcon,{})," ",a("Cut")]})},RemoveBlocks=()=>{const[r]=useSelectedBlockIds(),n=useRemoveBlocks(),a=useSelectedBlock(),{t:o}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{disabled:!canDeleteBlock(a==null?void 0:a._type),className:"flex items-center gap-x-4 text-xs",onClick:()=>n(r),children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TrashIcon,{})," ",o("Remove")]})},BlockContextMenuContent=()=>{const{t:r}=reactI18next.useTranslation(),[n]=useSelectedBlockIds(),a=useDuplicateBlocks(),o=useSelectedBlock(),i=React.useCallback(()=>{a(n)},[n,a]);return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuContent,{className:"text-xs",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{disabled:!canAddChildBlock(o==null?void 0:o._type),className:"flex items-center gap-x-4 text-xs",onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK,data:o}),children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.PlusIcon,{size:"14"})," ",r("Add block")]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenuItem,{disabled:!canDuplicateBlock(o==null?void 0:o._type),className:"flex items-center gap-x-4 text-xs",onClick:i,children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CardStackPlusIcon,{})," ",r("Duplicate")]}),jsxRuntime.jsxRuntimeExports.jsx(CutBlocks,{}),jsxRuntime.jsxRuntimeExports.jsx(CopyPasteBlocks,{}),jsxRuntime.jsxRuntimeExports.jsx(RemoveBlocks,{})]})},BlockContextMenu=({children:r})=>jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ContextMenu,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.ContextMenuTrigger,{asChild:!0,children:r}),jsxRuntime.jsxRuntimeExports.jsx(BlockContextMenuContent,{})]})}),defaultShortcuts=[{key:"ArrowDown",command:"selectNext"},{key:"ArrowUp",command:"selectPrev"},{key:"ArrowLeft",command:"selectParent",when:"isLeaf || isClosed"},{key:"ArrowLeft",command:"close",when:"isOpen"},{key:"ArrowRight",command:"open",when:"isClosed"},{key:"ArrowRight",command:"selectNext",when:"isOpen"},{key:"Home",command:"selectFirst"},{key:"End",command:"selectLast"}];function selectFirst(r){r.firstNode&&r.select(r.firstNode.id)}function selectLast(r){r.lastNode&&r.select(r.lastNode.id)}function selectNext(r){const n=r.selectedNodes[0].next||r.firstNode;r.select(n.id)}function selectPrev(r){const n=r.selectedNodes[0].prev||r.lastNode;r.select(n.id)}const selectParent=(r,n)=>{var o;const a=((o=r.selectedIds[0])==null?void 0:o.parent)||null;a&&n&&r.select(a.id)},open=(r,n)=>{const a=r.selectedNodes[0];a.isInternal&&n&&a.open()},close=(r,n)=>{const a=r.selectedNodes[0];a.isInternal&&n&&a.close()};function VscJson(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 16 16",fill:"currentColor"},child:[{tag:"path",attr:{fillRule:"evenodd",clipRule:"evenodd",d:"M6 2.984V2h-.09c-.313 0-.616.062-.909.185a2.33 2.33 0 0 0-.775.53 2.23 2.23 0 0 0-.493.753v.001a3.542 3.542 0 0 0-.198.83v.002a6.08 6.08 0 0 0-.024.863c.012.29.018.58.018.869 0 .203-.04.393-.117.572v.001a1.504 1.504 0 0 1-.765.787 1.376 1.376 0 0 1-.558.115H2v.984h.09c.195 0 .38.04.556.121l.001.001c.178.078.329.184.455.318l.002.002c.13.13.233.285.307.465l.001.002c.078.18.117.368.117.566 0 .29-.006.58-.018.869-.012.296-.004.585.024.87v.001c.033.283.099.558.197.824v.001c.106.273.271.524.494.753.223.23.482.407.775.53.293.123.596.185.91.185H6v-.984h-.09c-.2 0-.387-.038-.563-.115a1.613 1.613 0 0 1-.457-.32 1.659 1.659 0 0 1-.309-.467c-.074-.18-.11-.37-.11-.573 0-.228.003-.453.011-.672.008-.228.008-.45 0-.665a4.639 4.639 0 0 0-.055-.64 2.682 2.682 0 0 0-.168-.609A2.284 2.284 0 0 0 3.522 8a2.284 2.284 0 0 0 .738-.955c.08-.192.135-.393.168-.602.033-.21.051-.423.055-.64.008-.22.008-.442 0-.666-.008-.224-.012-.45-.012-.678a1.47 1.47 0 0 1 .877-1.354 1.33 1.33 0 0 1 .563-.121H6zm4 10.032V14h.09c.313 0 .616-.062.909-.185.293-.123.552-.3.775-.53.223-.23.388-.48.493-.753v-.001c.1-.266.165-.543.198-.83v-.002c.028-.28.036-.567.024-.863-.012-.29-.018-.58-.018-.869 0-.203.04-.393.117-.572v-.001a1.502 1.502 0 0 1 .765-.787 1.38 1.38 0 0 1 .558-.115H14v-.984h-.09c-.196 0-.381-.04-.557-.121l-.001-.001a1.376 1.376 0 0 1-.455-.318l-.002-.002a1.415 1.415 0 0 1-.307-.465v-.002a1.405 1.405 0 0 1-.118-.566c0-.29.006-.58.018-.869a6.174 6.174 0 0 0-.024-.87v-.001a3.537 3.537 0 0 0-.197-.824v-.001a2.23 2.23 0 0 0-.494-.753 2.331 2.331 0 0 0-.775-.53 2.325 2.325 0 0 0-.91-.185H10v.984h.09c.2 0 .387.038.562.115.174.082.326.188.457.32.127.134.23.29.309.467.074.18.11.37.11.573 0 .228-.003.452-.011.672-.008.228-.008.45 0 .665.004.222.022.435.055.64.033.214.089.416.168.609a2.285 2.285 0 0 0 .738.955 2.285 2.285 0 0 0-.738.955 2.689 2.689 0 0 0-.168.602c-.033.21-.051.423-.055.64a9.15 9.15 0 0 0 0 .666c.008.224.012.45.012.678a1.471 1.471 0 0 1-.877 1.354 1.33 1.33 0 0 1-.563.121H10z"},child:[]}]})(r)}function BsLightningFill(r){return iconBase.GenIcon({tag:"svg",attr:{fill:"currentColor",viewBox:"0 0 16 16"},child:[{tag:"path",attr:{d:"M5.52.359A.5.5 0 0 1 6 0h4a.5.5 0 0 1 .474.658L8.694 6H12.5a.5.5 0 0 1 .395.807l-7 9a.5.5 0 0 1-.873-.454L6.823 9.5H3.5a.5.5 0 0 1-.48-.641z"},child:[]}]})(r)}function TbEyeDown(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"path",attr:{d:"M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0"},child:[]},{tag:"path",attr:{d:"M12 18c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6"},child:[]},{tag:"path",attr:{d:"M19 16v6"},child:[]},{tag:"path",attr:{d:"M22 19l-3 3l-3 -3"},child:[]}]})(r)}const Node=React.memo(({node:r,style:n,dragHandle:a})=>{const o=useBuilderProp("outlineMenuItems",[]),{t:i}=reactI18next.useTranslation(),[l]=jotai.useAtom(canvasIframeAtom);let c=null;const u=r.children.length>0,{id:d,data:p,isSelected:f,willReceiveDrop:m,isDragging:h,isEditing:g,handleClick:y}=r,b=S=>{S.stopPropagation(),r.toggle()},v=S=>{S.isInternal&&(c=S.isOpen,S.isOpen&&S.close())},x=S=>{S.isInternal&&c!==null&&(c?S.open():S.close(),c=null)},E=S=>{S.stopPropagation(),r.isOpen||r.toggle(),y(S)};React.useEffect(()=>{const S=setTimeout(()=>{m&&!r.isOpen&&!h&&r.toggle()},500);return()=>clearTimeout(S)},[m,r,h]);const R=React.useMemo(()=>{const S=Object.keys(p),w=[];for(let C=0;C<S.length;C++)if(S[C].endsWith("_attrs")){const I=p[S[C]],j=Object.keys(I).join("|");j.match(/x-data/)&&w.push("data"),j.match(/x-on/)&&w.push("event"),j.match(/x-show|x-if/)&&w.push("show")}return w},[p]),A=(S,w)=>{const C=l.contentDocument||l.contentWindow.document,I=C.querySelector(`[data-block-id=${S}]`);I&&I.setAttribute("data-drop",w);const j=I.getBoundingClientRect(),k=l.getBoundingClientRect();j.top>=k.top&&j.left>=k.left&&j.bottom<=k.bottom&&j.right<=k.right||(C.documentElement.scrollTop=I.offsetTop-k.top)};return d===STRINGS.ROOT_TEMP_KEY?jsxRuntime.jsxRuntimeExports.jsxs("button",{onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK}),className:"mb-10 mt-5 w-full rounded bg-gray-100 p-1 hover:bg-gray-200",children:["+ ",i("add_block")]}):jsxRuntime.jsxRuntimeExports.jsx(BlockContextMenu,{id:d,children:jsxRuntime.jsxRuntimeExports.jsxs("div",{onClick:E,style:n,"data-node-id":d,ref:a,onDragStart:()=>v(r),onDragEnd:()=>x(r),onDragOver:S=>{S.preventDefault(),A(d,"yes")},onDragLeave:S=>{S.preventDefault(),A(d,"no")},onDrop:S=>{S.preventDefault(),A(d,"no")},className:iconBase.cn("group flex !h-full w-full items-center justify-between space-x-px !rounded py-px outline-none",f?"bg-blue-500 text-white":"text-gray-600 hover:bg-gray-200 dark:hover:bg-gray-800",m&&canAcceptChildBlock(p._type,"Icon")?"bg-green-200":"",h&&"opacity-20"),children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:`flex h-4 w-4 rotate-0 transform cursor-pointer items-center justify-center text-xs transition-transform duration-100 ${r.isOpen?"rotate-90":""}`,children:u&&jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:b,type:"button",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TriangleRightIcon,{})})}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"-mt-0.5 h-3 w-3",children:jsxRuntime.jsxRuntimeExports.jsx(TypeIcon,{type:p==null?void 0:p._type})}),g?jsxRuntime.jsxRuntimeExports.jsx(Input$1,{node:r}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"ml-2 flex items-center gap-x-1 truncate text-[11px]",onDoubleClick:S=>{S.stopPropagation(),r.edit(),r.deselect()},children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:(p==null?void 0:p._name)||(p==null?void 0:p._type.split("/").pop())}),R.includes("data")&&jsxRuntime.jsxRuntimeExports.jsx(VscJson,{className:"h-3 w-3 text-orange-600"}),R.includes("event")&&jsxRuntime.jsxRuntimeExports.jsx(BsLightningFill,{className:"h-3 w-3 text-yellow-500"}),R.includes("show")&&jsxRuntime.jsxRuntimeExports.jsx(TbEyeDown,{className:"h-3 w-3 text-orange-600"})]})]})]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"invisible flex items-center space-x-1 pr-2 group-hover:visible",children:[canAddChildBlock(p==null?void 0:p._type)?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK,data:{_id:d}}),className:"cursor-pointer rounded bg-transparent hover:bg-white hover:text-black",asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.PlusIcon,{size:"18"})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{className:"isolate z-[9999]",children:i("Add block")})]}):null,o.map(S=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{className:"cursor-pointer rounded bg-transparent hover:bg-white hover:text-blue-500",asChild:!0,children:React.createElement(S.item,{blockId:d})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{className:"isolate z-10",children:S.tooltip})]}))]})]})})}),Input$1=({node:r})=>{var n,a;return jsxRuntime.jsxRuntimeExports.jsx("input",{autoFocus:!0,className:"ml-2 w-full rounded-sm border border-black/30 bg-transparent px-1 text-[11px] outline-none",type:"text",defaultValue:((n=r.data)==null?void 0:n._name)||((a=r.data)==null?void 0:a._type),onFocus:o=>o.currentTarget.select(),onBlur:o=>r.submit(o.currentTarget.value),onKeyDown:o=>{o.key==="Enter"&&r.submit(o.currentTarget.value)}})},useCanMove=()=>{const[r]=useBlocksStore();return(n,a)=>{var l;const o=(l=lodashEs.find(r,{_id:a}))==null?void 0:l._type,i=lodashEs.first(n.map(c=>{var u;return(u=lodashEs.find(r,{_id:c}))==null?void 0:u._type}));return canAcceptChildBlock(o,i)}},ListTree=()=>{const[treeData]=jotai.useAtom(treeDSBlocks),[ids,setIds]=useSelectedBlockIds(),[cutBlocksIds]=useCutBlockIds(),updateBlockProps=useUpdateBlocksProps(),[,setStyleBlocks]=useSelectedStylingBlocks(),{moveBlocks}=useBlocksStoreUndoableActions(),canMove=useCanMove(),treeRef=React.useRef(null),[,setTreeRef]=jotai.useAtom(treeRefAtom),{t}=reactI18next.useTranslation(),clearSelection=()=>{setIds([]),setStyleBlocks([])},filteredTreeData=React.useMemo(()=>{const r=(a,o)=>a.filter(i=>!o.includes(i._id)).map(i=>({...i,children:i.children?r(i.children,o):[]}));return[...r(treeData,cutBlocksIds),{_type:STRINGS.ROOT_TEMP_KEY,_id:STRINGS.ROOT_TEMP_KEY,children:[]}]},[treeData,cutBlocksIds]);React.useEffect(()=>{setTreeRef(treeRef.current)},[treeRef.current]);const onRename=({id:r,name:n,node:a})=>{updateBlockProps([r],{_name:n},a.data._name)},onMove=({dragIds:r,parentId:n,index:a})=>{canMove(r,n)&&moveBlocks(r,n,a)},onSelect=r=>{if(r.length===0)return;const n=r[0]?r[0].id:"";setStyleBlocks([]),setIds([n])},onContextMenu=r=>{var o;r.preventDefault();const n=r.target,a=n.getAttribute("data-node-id")||((o=n.closest("[data-node-id]"))==null?void 0:o.getAttribute("data-node-id"));a&&(setStyleBlocks([]),setIds([a]))},debouncedDisableDrop=web.useDebouncedCallback(({parentNode:r,dragNodes:n})=>{var a;return(r==null?void 0:r.data._type)===STRINGS.ROOT_TEMP_KEY||!canAcceptChildBlock(r==null?void 0:r.data._type,(a=n[0])==null?void 0:a.data._type)},[],300),handleKeyDown=e=>{if(!treeRef.current)return;const tree=treeRef.current,selectedNode=tree.selectedNodes[0];if(!selectedNode)return;setIds[selectedNode.id],setStyleBlocks([]);const isLeaf=!selectedNode.isInternal,isClosed=!selectedNode.isOpen,isOpen=selectedNode.isOpen,shortcut=defaultShortcuts.find(s=>s.key===e.key&&(!s.when||eval(s.when)));if(shortcut)switch(e.preventDefault(),shortcut.command){case"selectNext":selectNext(tree);break;case"selectPrev":selectPrev(tree);break;case"selectParent":selectParent(tree,isLeaf||isClosed);break;case"close":close(tree,isOpen);break;case"open":open(tree,isClosed);break;case"selectFirst":selectFirst(tree);break;case"selectLast":selectLast(tree);break}};return lodashEs.isEmpty(treeData)?jsxRuntime.jsxRuntimeExports.jsx("div",{children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex h-full w-full items-center justify-center p-8 text-center",children:jsxRuntime.jsxRuntimeExports.jsxs("p",{className:"mb-1.5 text-sm text-gray-400",children:[t("page_is_empty"),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{onClick:()=>emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK}),variant:"default",size:"sm",children:["+ ",t("add_block")]})]})})}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:iconBase.cn("flex h-full select-none flex-col space-y-1"),onClick:()=>clearSelection(),children:jsxRuntime.jsxRuntimeExports.jsx("div",{id:"outline-view",className:"no-scrollbar h-full overflow-y-auto text-xs",onKeyDown:r=>{treeRef.current.isEditing||handleKeyDown(r)},children:jsxRuntime.jsxRuntimeExports.jsx(reactArborist.Tree,{ref:treeRef,height:window.innerHeight-160,className:"no-scrollbar !h-full max-w-full !overflow-y-auto !overflow-x-hidden",selection:ids[0]||"",onRename,openByDefault:!1,onMove,rowHeight:25,data:[...filteredTreeData],renderCursor:DefaultCursor,onSelect,childrenAccessor:r=>r.children,width:"100%",renderDragPreview:DefaultDragPreview,indent:10,onContextMenu,disableDrop:debouncedDisableDrop,idAccessor:"_id",children:Node})})})},Outline$1=ListTree,hasVideoEmbed=r=>{const n=/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^\/\n\s]+\/\S+\/|(?:v|e(?:mbed)?)\/|\S*?[?&]v=)|youtu\.be\/)([a-zA-Z0-9_-]{11})/,a=/(?:https?:\/\/)?(?:www\.)?(player)?.vimeo\.com/;return n.test(r)||a.test(r)},getVideoURLFromHTML=r=>{if(lodashEs.isEmpty(r))return r;const n=/<video[^>]+src=['"]([^'">]+)['"]/,a=/<iframe[^>]+src=['"]([^'">]+)['"]/,o=r.match(n),i=r.match(a),l=o?o[1]:i?i[1]:null,c=/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^\/\n\s]+\/\S+\/|(?:v|e(?:mbed)?)\/|\S*?[?&]v=)|youtu\.be\/)([a-zA-Z0-9_-]{11})/,u=/(?:https?:\/\/)?(?:www\.)?player.vimeo\.com/;return l&&(c.test(l)||u.test(l))?l:r},NAME_ATTRIBUTE="$name",ATTRIBUTE_MAP={img:{alt:"alt",width:"width",height:"height",src:"image"},video:{src:"url",autoplay:"controls.autoPlay",muted:"controls.muted",loop:"controls.loop",controls:"controls.widgets"},a:{href:"link.href",target:"link.target",type:""},input:{placeholder:"placeholder",required:"required",type:"inputType",name:"fieldName"},textarea:{placeholder:"placeholder",required:"required",type:"inputType",name:"fieldName"},select:{placeholder:"placeholder",required:"required",multiple:"multiple",name:"fieldName"}},shouldAddText=(r,n)=>r.children.length===1&&lodashEs.includes(["Heading","Paragraph","Span","ListItem","Button","Label","TableCell","Link"],n._type),getTextContent=r=>r.map(n=>n.type==="text"?lodashEs.get(n,"content",""):lodashEs.isEmpty(n.children)?"":getTextContent(n.children)).join(""),getSanitizedValue=r=>r===null?"":r,getAttrs=r=>{if(r.tagName==="svg")return{};const n={},a=ATTRIBUTE_MAP[r.tagName]||{},o=r.attributes;return lodashEs.forEach(o,({key:i,value:l})=>{if(i!==NAME_ATTRIBUTE)if(a[i]){if(r.tagName==="img"&&i==="src"&&!l.startsWith("http")){const c=lodashEs.find(r.attributes,{key:"width"}),u=lodashEs.find(r.attributes,{key:"height"});c&&u?l=`https://via.placeholder.com/${c==null?void 0:c.value}x${u==null?void 0:u.value}`:l="https://via.placeholder.com/150x150"}lodashEs.set(n,a[i],getSanitizedValue(l))}else lodashEs.includes(["style","class","srcset"],i)||(lodashEs.has(n,"styles_attrs")||(n.styles_attrs={}),lodashEs.startsWith(i,"@")&&(i=i.replace("@","x-on:")),n.styles_attrs[`${i}`]=getSanitizedValue(l))}),delete n.class,n},getStyles$1=(r,n="styles")=>{if(!r.attributes)return{[n]:`${STRINGS.STYLES_KEY},`};const a=lodashEs.find(r.attributes,{key:"class"});if(a){const o=a.value;return{[n]:`${STRINGS.STYLES_KEY},${o}`}}return{[n]:`${STRINGS.STYLES_KEY},`}},getBlockProps=r=>{switch(r.tagName){case"img":return{_type:"Image"};case"input":return{_type:"Input",showLabel:!1};case"hr":return{_type:"Divider"};case"br":return{_type:"LineBreak"};case"textarea":return{_type:"TextArea",showLabel:!1};case"audio":return{_type:"Audio"};case"canvas":return{_type:"Canvas"};case"video":case"iframe":return{_type:"CustomHTML"};case"svg":return{_type:"Icon"};case"select":return{_type:"Select",options:[]};case"option":return{_type:"Option"};case"ul":case"ol":case"dl":return{_type:"List",tag:r.tagName,_listType:r.tagName==="ol"?"list-decimal":"list-none"};case"li":case"dt":return{_type:"ListItem",tag:r.tagName};case"span":case"figcaption":case"legend":return{_type:"Span",tag:r.tagName};case"p":return{_type:"Paragraph",content:""};case"a":return{_type:"Link"};case"form":return{_type:"Form"};case"label":return{_type:"Label"};case"button":return{_type:"Button"};case"code":return{_type:"Code"};case"h1":case"h2":case"h3":case"h4":case"h5":case"h6":return{_type:"Heading",tag:r.tagName};case"table":return{_type:"Table"};case"tr":return{_type:"TableRow"};case"td":case"th":return{_type:"TableCell",tag:r.tagName};case"thead":return{_type:"TableHead"};case"tbody":return{_type:"TableBody"};case"tfoot":return{_type:"TableFooter"};default:const n=lodashEs.get(r,"children",[]).length>0?"Box":"EmptyBox";return{_type:n,tag:r.tagName,_name:n=="EmptyBox"||r.tagName==="div"?n:lodashEs.capitalize(r.tagName)}}},traverseNodes=(r,n=null)=>lodashEs.flatMapDeep(r,a=>{var l;if(a.type==="comment")return[];let o={_id:iconBase.generateUUID()};if(n&&(o._parent=n.block._id),a.type==="text")return lodashEs.isEmpty(lodashEs.get(a,"content",""))?[]:n&&shouldAddText(n.node,n.block)?(lodashEs.set(n,"block.content",lodashEs.get(a,"content","")),[]):{...o,_type:"Text",content:lodashEs.get(a,"content","")};if(o={...o,...getBlockProps(a),...getAttrs(a),...getStyles$1(a)},a.attributes){const c=a.attributes.find(u=>u.key===NAME_ATTRIBUTE);c&&(o._name=c.value)}if(o._type==="Input"){const c=o.inputType||"text";c==="checkbox"?lodashEs.set(o,"_type","Checkbox"):c==="radio"&&lodashEs.set(o,"_type","Radio")}else if(a.tagName==="video"||a.tagName==="iframe"){const c=himalaya.stringify([a]);return hasVideoEmbed(c)&&(lodashEs.set(o,"_type","Video"),lodashEs.set(o,"url",getVideoURLFromHTML(c)),lodashEs.set(o,"styles",`${STRINGS.STYLES_KEY},absolute top-0 left-0 w-full h-full`),lodashEs.set(o,"controls",{autoPlay:!1,muted:!0,loop:!1,controls:!1})),o.content=c,[o]}else if(a.tagName==="svg"){const c=lodashEs.find(a.attributes,{key:"height"}),u=lodashEs.find(a.attributes,{key:"width"}),d=lodashEs.get(c,"value")?`[${lodashEs.get(c,"value")}px]`:"24px",p=lodashEs.get(u,"value")?`[${lodashEs.get(u,"value")}px]`:"24px",f=lodashEs.get(lodashEs.find(a.attributes,{key:"class"}),"value","w-full h-full");return o.styles=`${STRINGS.STYLES_KEY}, ${iconBase.cn(`w-${p} h-${d}`,f)}`.trim(),a.attributes=lodashEs.filter(a.attributes,m=>!lodashEs.includes(["style","width","height","class"],m.key)),o.icon=himalaya.stringify([a]),[o]}else if(a.tagName=="option"&&n&&((l=n.block)==null?void 0:l._type)==="Select")return n.block.options.push({label:getTextContent(a.children),...getAttrs(a)}),[];const i=traverseNodes(a.children,{block:o,node:a});return[o,...i]}),getSanitizedHTML=r=>{const n=r.match(/<body[^>]*>[\s\S]*?<\/body>/);return(n&&n.length>0?n[0].replace(/<body/,"<div").replace(/<\/body>/,"</div>"):r).replace(/\s+/g," ").replaceAll("> <","><").replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi,"").trim()},getBlocksFromHTML=r=>{const n=himalaya.parse(getSanitizedHTML(r));return lodashEs.isEmpty(r)?[]:lodashEs.flatten(traverseNodes(n))},ImportHTML=({parentId:r})=>{const{t:n}=reactI18next.useTranslation(),[a,o]=React.useState(""),{addPredefinedBlock:i}=useAddBlock(),l=()=>{const c=getBlocksFromHTML(a);i([...c],r),o(""),emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK})};return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Card,{className:"border-border/0 p-0 shadow-none",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CardHeader,{className:"p-3",children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CardDescription,{children:n("html_snippet_description")})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CardContent,{className:"space-y-2 px-3 py-0",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-1",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Label,{htmlFor:"current",className:"text-sm",children:n("tailwind_html_snippet")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{autoFocus:!0,tabIndex:1,ref:c=>c&&c.focus(),onChange:c=>o(c.target.value),rows:12,value:a,placeholder:n("enter_code_snippet"),className:"resize-none overflow-x-auto whitespace-pre bg-gray-100 font-mono text-xs font-normal"})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CardFooter,{className:"flex flex-col justify-end p-3",children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:a.trim()==="",onClick:()=>l(),size:"sm",className:"w-full",children:n("import_html")})})]})},ImportHTML$1=ImportHTML,isBoolean=r=>typeof r=="boolean"||r instanceof Boolean,isNumber=r=>typeof r=="number"||r instanceof Number,isBigInt=r=>typeof r=="bigint"||r instanceof BigInt,isDate=r=>!!r&&r instanceof Date,isString=r=>typeof r=="string"||r instanceof String,isArray$4=r=>Array.isArray(r),isObject$1=r=>r instanceof Object&&r!==null;function useBool(r){const[n,a]=React.useState(r());return[n,()=>a(i=>!i),a]}let componentId=1;const generateNextId=()=>componentId++;function useComponentId(){const r=React.useRef();return r.current===void 0&&(r.current=`:jsnvw:${generateNextId()}:`),r.current}function ExpandableObject(r){let{field:n,value:a,data:o,lastElement:i,openBracket:l,closeBracket:c,level:u,style:d,shouldExpandNode:p,clickToExpandNode:f}=r;const m=React.useRef(!1),[h,g,y]=useBool(()=>p(u,a,n));React.useEffect(()=>{m.current?y(p(u,a,n)):m.current=!0},[p]);const b=h?d.collapseIcon:d.expandIcon,v=h?"collapse JSON":"expand JSON",x=useComponentId(),E=u+1,R=o.length-1,A=S=>{S.key===" "&&(S.preventDefault(),g())};return React.createElement("div",{className:d.basicChildStyle,role:"list"},React.createElement("span",{className:b,onClick:g,onKeyDown:A,role:"button",tabIndex:0,"aria-label":v,"aria-expanded":h,"aria-controls":h?x:void 0}),n&&(f?React.createElement("span",{className:d.clickableLabel,onClick:g,onKeyDown:A,role:"button",tabIndex:-1},n,":"):React.createElement("span",{className:d.label},n,":")),React.createElement("span",{className:d.punctuation},l),h?React.createElement("div",{id:x},o.map((S,w)=>React.createElement(DataRender,{key:S[0]||w,field:S[0],value:S[1],style:d,lastElement:w===R,level:E,shouldExpandNode:p,clickToExpandNode:f}))):React.createElement("span",{className:d.collapsedContent,onClick:g,onKeyDown:A,role:"button",tabIndex:-1,"aria-hidden":!0,"aria-label":v,"aria-expanded":h}),React.createElement("span",{className:d.punctuation},c),!i&&React.createElement("span",{className:d.punctuation},","))}function JsonObject(r){let{field:n,value:a,style:o,lastElement:i,shouldExpandNode:l,clickToExpandNode:c,level:u}=r;return ExpandableObject({field:n,value:a,lastElement:i||!1,level:u,openBracket:"{",closeBracket:"}",style:o,shouldExpandNode:l,clickToExpandNode:c,data:Object.keys(a).map(d=>[d,a[d]])})}function JsonArray(r){let{field:n,value:a,style:o,lastElement:i,level:l,shouldExpandNode:c,clickToExpandNode:u}=r;return ExpandableObject({field:n,value:a,lastElement:i||!1,level:l,openBracket:"[",closeBracket:"]",style:o,shouldExpandNode:c,clickToExpandNode:u,data:a.map(d=>[void 0,d])})}function JsonPrimitiveValue(r){let{field:n,value:a,style:o,lastElement:i}=r,l=a,c=o.otherValue;return a===null?(l="null",c=o.nullValue):a===void 0?(l="undefined",c=o.undefinedValue):isString(a)?(l=o.noQuotesForStringValues?a:`"${a}"`,c=o.stringValue):isBoolean(a)?(l=a?"true":"false",c=o.booleanValue):isNumber(a)?(l=a.toString(),c=o.numberValue):isBigInt(a)?(l=`${a.toString()}n`,c=o.numberValue):isDate(a)?l=a.toISOString():l=a.toString(),n===""&&(n='""'),React.createElement("div",{className:o.basicChildStyle,role:"listitem"},n&&React.createElement("span",{className:o.label},n,":"),React.createElement("span",{className:c},l),!i&&React.createElement("span",{className:o.punctuation},","))}function DataRender(r){const n=r.value;return isArray$4(n)?React.createElement(JsonArray,Object.assign({},r)):isObject$1(n)&&!isDate(n)?React.createElement(JsonObject,Object.assign({},r)):React.createElement(JsonPrimitiveValue,Object.assign({},r))}var styles$2={"container-base":"_GzYRV","punctuation-base":"_3eOF8",pointer:"_1MFti","expander-base":"_f10Tu _1MFti","expand-icon":"_1UmXx","collapse-icon":"_1LId0","collapsed-content-base":"_1pNG9 _1MFti","container-light":"_2IvMF _GzYRV","basic-element-style":"_2bkNM","label-light":"_1MGIk","clickable-label-light":"_2YKJg _1MGIk _1MFti","punctuation-light":"_3uHL6 _3eOF8","value-null-light":"_2T6PJ","value-undefined-light":"_1Gho6","value-string-light":"_vGjyY","value-number-light":"_1bQdo","value-boolean-light":"_3zQKs","value-other-light":"_1xvuR","collapse-icon-light":"_oLqym _f10Tu _1MFti _1LId0","expand-icon-light":"_2AXVT _f10Tu _1MFti _1UmXx","collapsed-content-light":"_2KJWg _1pNG9 _1MFti","container-dark":"_11RoI _GzYRV","expand-icon-dark":"_17H2C _f10Tu _1MFti _1UmXx","collapse-icon-dark":"_3QHg2 _f10Tu _1MFti _1LId0","collapsed-content-dark":"_3fDAz _1pNG9 _1MFti","label-dark":"_2bSDX","clickable-label-dark":"_1RQEj _2bSDX _1MFti","punctuation-dark":"_gsbQL _3eOF8","value-null-dark":"_LaAZe","value-undefined-dark":"_GTKgm","value-string-dark":"_Chy1W","value-number-dark":"_2bveF","value-boolean-dark":"_2vRm-","value-other-dark":"_1prJR"};const defaultStyles={container:styles$2["container-light"],basicChildStyle:styles$2["basic-element-style"],label:styles$2["label-light"],clickableLabel:styles$2["clickable-label-light"],nullValue:styles$2["value-null-light"],undefinedValue:styles$2["value-undefined-light"],stringValue:styles$2["value-string-light"],booleanValue:styles$2["value-boolean-light"],numberValue:styles$2["value-number-light"],otherValue:styles$2["value-other-light"],punctuation:styles$2["punctuation-light"],collapseIcon:styles$2["collapse-icon-light"],expandIcon:styles$2["expand-icon-light"],collapsedContent:styles$2["collapsed-content-light"],noQuotesForStringValues:!1},allExpanded=()=>!0,JsonView=r=>{let{data:n,style:a=defaultStyles,shouldExpandNode:o=allExpanded,clickToExpandNode:i=!1}=r;return React.createElement("div",{className:a.container},React.createElement(DataRender,{value:n,style:a,lastElement:!0,level:0,shouldExpandNode:o,clickToExpandNode:i}))};function getPathAndTypes(r){const n=[],a={};function o(i,l){lodashEs.forEach(l,(c,u)=>{const d=i?`${i}.${u}`:u,p=lodashEs.isArray(c)?"list":typeof c;n.push(d),a[d]=p==="string"?"text":p==="object"?"model":p,p==="object"&&!lodashEs.isArray(c)&&o(d,c)})}return o("",lodashEs.omit(r,["styles","_type","_id","_name","_bindings"])),{paths:n,pathsType:a}}const ViewData=({data:r,fullView:n})=>{const a=useBuilderProp("onError",lodashEs.noop);if(!r)return null;const o=typeof r;return n?typeof r=="object"?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-3"}),jsxRuntime.jsxRuntimeExports.jsx(reactErrorBoundary.ErrorBoundary,{fallback:jsxRuntime.jsxRuntimeExports.jsx(FallbackError,{}),onError:a,children:jsxRuntime.jsxRuntimeExports.jsx(JsonView,{data:r,shouldExpandNode:allExpanded,style:{...defaultStyles,container:"max-h-[40vh] overflow-y-auto text-[12px] leading-[1.5] tracking-wide font-mono",stringValue:"text-orange-600",label:"text-green-900 font-semibold pr-1 tracking-wider"}})})]}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"max-h-36 w-full overflow-y-auto overflow-x-hidden text-[12px] leading-4 text-gray-800/50",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:"font-medium text-gray-800/80",children:"Content: "}),r]}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-full overflow-hidden whitespace-nowrap text-[10px] leading-3 text-gray-800/50",children:lodashEs.truncate(o==="object"?JSON.stringify(r):r,{length:40})})},DataProvidersSuggester=({type:r,value:n="",setValue:a,data:o,onChange:i,dataType:l,appliedBindings:c})=>{const{paths:u,pathsType:d}=getPathAndTypes(o),p=r==="PROP"?runtime.getBlockComponent(o==null?void 0:o._type):{},f=r==="PROP",[m,h]=React.useState(!1),g=React.useMemo(()=>r==="PROP"?u.filter(y=>!lodashEs.includes(c,y)&&lodashEs.get(p,`props.${lodashEs.first(lodashEs.split(y,"."))}.binding`)):u.filter(y=>l===lodashEs.get(d,y,"")),[r,u,c,l,p]);return React.useEffect(()=>{n&&i(n)},[n,r]),jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center space-x-4",children:[jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-sm text-muted-foreground",children:lodashEs.startCase(lodashEs.toLower(r))}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Popover,{open:m,onOpenChange:h,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.PopoverTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{variant:"outline",size:"sm",className:` ${lodashEs.isEmpty(n)?"w-44 justify-center bg-blue-500 text-gray-100 hover:bg-blue-400 hover:text-white":"min-w-[350px] items-center justify-between"}`,children:n?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs("span",{className:"pr-8 text-sm",children:[f&&jsxRuntime.jsxRuntimeExports.jsx("span",{className:"mr-2 rounded-full bg-purple-100 px-2 py-0.5 text-[10px] text-purple-500",children:lodashEs.startCase(l)}),n]}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"cursor-pointer text-[9px] text-blue-400 underline hover:text-blue-700",children:"Change"})]}):jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:["+ Set ",lodashEs.startCase(lodashEs.toLower(r))]})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.PopoverContent,{className:"z-[999] min-w-[300px] p-0",side:"right",align:"start",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Command,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CommandInput,{placeholder:`Choose ${lodashEs.toLower(r)}...`}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.CommandList,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CommandEmpty,{children:"No results found."}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.CommandGroup,{children:lodashEs.map(g,y=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.CommandItem,{value:y,className:`cursor-pointer ${f?"flex items-center justify-between":"flex flex-col items-start justify-start"}`,onSelect:b=>{a(lodashEs.find(g,v=>v===b)||null),h(!1)},children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Check,{className:`h-4 w-4 text-green-500 ${n===y?"":"opacity-0"}`}),y]}),f?jsxRuntime.jsxRuntimeExports.jsx("div",{children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"rounded-full bg-purple-100 px-2 py-0.5 text-[10px] text-purple-500",children:lodashEs.startCase(lodashEs.get(d,y,""))})}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:"pl-6",children:jsxRuntime.jsxRuntimeExports.jsx(ViewData,{data:lodashEs.get(o,y)})})]},y))})]})]})})]})]}),!f&&!lodashEs.isEmpty(n)&&jsxRuntime.jsxRuntimeExports.jsx("div",{className:"pt-2",children:jsxRuntime.jsxRuntimeExports.jsx(ViewData,{data:lodashEs.get(o,n,""),fullView:!0})})]})},AddBindingModalContent=({appliedBindings:r=[],onAddBinding:n,editMode:a,item:o})=>{const[i,l]=React.useState(a?o.key:""),[c,u]=React.useState(a?o.value:""),d=useSelectedBlock(),[p]=useChaiExternalData(),f=React.useCallback((g,y)=>{if(lodashEs.isEmpty(g))return"";{const b=lodashEs.get(y==="PROP"?d:p,g,"");if(lodashEs.isArray(b))return"list";const v=typeof b;return v==="string"?"text":v==="object"?"model":v}},[d,p]),[m,h]=React.useState(a?f(o.key,"PROP"):"");return jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DialogHeader,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogTitle,{children:"Add Data Binding"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogDescription,{className:"text-xs",children:"Add prop and path of binding. Click save when you're done."})]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex flex-col gap-1",children:[jsxRuntime.jsxRuntimeExports.jsx(DataProvidersSuggester,{type:"PROP",isDisabled:!1,placeholder:"Enter prop key",value:i,setValue:l,onChange:g=>{const y=f(g,"PROP");l(g),m!==y&&u(""),h(y)},data:d,dataType:m,appliedBindings:r}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-2"}),jsxRuntime.jsxRuntimeExports.jsx(DataProvidersSuggester,{type:"PATH",isDisabled:lodashEs.isEmpty(i),placeholder:"Enter data path",value:c,setValue:u,onChange:g=>{const y=f(g,"PATH");u(m===y?g:"")},data:p,dataType:m,appliedBindings:r})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogFooter,{children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{type:"submit",className:"mt-4",disabled:lodashEs.isEmpty(i)&&lodashEs.isEmpty(c),onClick:()=>n({key:i,value:c}),children:"Save"})})]})},AddBindingModal=({disabled:r,children:n,onAddBinding:a,appliedBindings:o,editMode:i=!0,item:l={}})=>{const[c,u]=React.useState(!1);return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Dialog,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogTrigger,{disabled:r,asChild:!0,onClick:()=>u(!0),children:n}),c&&jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogContent,{children:jsxRuntime.jsxRuntimeExports.jsx(AddBindingModalContent,{item:l,editMode:i,appliedBindings:o,onAddBinding:d=>{a(d),u(!1)}})})]})},NewDataBindingPair=({item:r,onAddBinding:n,onRemove:a,selectedBlock:o,dataProvider:i,appliedBindings:l})=>{const[c,u]=React.useState("string"),d=(p,f)=>{if(lodashEs.isEmpty(p))return"";{const m=lodashEs.get(f==="PROP"?o:i,p,"");if(lodashEs.isArray(m))return"list";const h=typeof m;return h==="string"?"text":h==="object"?"model":h}};return React.useEffect(()=>u(()=>d(r.key,"PROP")),[r.key]),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex flex-col rounded-md border border-gray-200 p-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"text-sm font-normal text-gray-500",children:r.key}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"font-medium leading-5",children:r.value}),jsxRuntime.jsxRuntimeExports.jsx(ViewData,{data:lodashEs.get(i,r.value,"")}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-end gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx(AddBindingModal,{editMode:!0,onAddBinding:n,appliedBindings:l,item:r,children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.EditIcon,{className:"mt-1 h-6 w-6 cursor-pointer rounded border border-blue-400 p-1 text-blue-400 duration-200 hover:scale-105 hover:bg-blue-400 hover:text-white"})}),jsxRuntime.jsxRuntimeExports.jsx(lucideReact.TrashIcon,{onClick:()=>a(),className:"mt-1 h-6 w-6 cursor-pointer rounded border border-red-400 p-1 text-red-400 duration-200 hover:scale-105 hover:bg-red-400 hover:text-white"})]}),!lodashEs.isEmpty(c)&&!lodashEs.isEmpty(r.key)&&jsxRuntime.jsxRuntimeExports.jsx("div",{className:"absolute right-0 top-1 mt-px flex h-4 items-center rounded-full px-2 text-[10px] font-medium text-purple-600",children:lodashEs.startCase(c)})]})},DataBindingSetting=({bindingData:r,onChange:n})=>{const a=useSelectedBlock(),[o]=useChaiExternalData(),i=runtime.getChaiDataProviders(),[l,c]=React.useState(lodashEs.map(r,(m,h)=>({key:h,value:m})));React.useEffect(()=>{c(lodashEs.map(r,(m,h)=>({key:h,value:m})))},[a==null?void 0:a._id,r]);const u=React.useMemo(()=>{if(lodashEs.isEmpty(o))return!0;if(lodashEs.isEmpty(l))return!1;const m=lodashEs.last(l);return lodashEs.isEmpty(m==null?void 0:m.key)||lodashEs.isEmpty(m==null?void 0:m.value)},[o,l]),d=m=>{const h=lodashEs.filter(l,g=>g.key!==m.key);c([...h,m]),f([...h,m])},p=m=>{const h=lodashEs.filter(l,(g,y)=>m!==y);f([...h])},f=React.useCallback((m=[])=>{if(c(m),lodashEs.isEmpty(m)){n({});return}const h={};lodashEs.forEach(m,g=>{!lodashEs.isEmpty(g==null?void 0:g.key)&&!lodashEs.isEmpty(g==null?void 0:g.value)&&lodashEs.set(h,g.key,g.value)}),n(h)},[n]);return lodashEs.isEmpty(i)?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-full items-center justify-center",children:jsxRuntime.jsxRuntimeExports.jsxs("p",{className:"mb-1.5 text-xs text-gray-500",children:["You have no data providers registered. Please add a data provider to your project. ",jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("a",{className:"text-blue-500",href:"https://chaibuilder.com/docs/registering-data-providers",target:"_blank",children:"Learn more"})]})}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-2",children:[lodashEs.map(l,(m,h)=>jsxRuntime.jsxRuntimeExports.jsx(NewDataBindingPair,{item:m,onAddBinding:d,onRemove:()=>p(h),selectedBlock:a,dataProvider:o,appliedBindings:lodashEs.map(l,"key")},m.key)),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{delayDuration:200,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{disabled:lodashEs.isEmpty(o),className:"w-full",children:jsxRuntime.jsxRuntimeExports.jsx(AddBindingModal,{disabled:u,appliedBindings:lodashEs.map(l,"key"),onAddBinding:d,children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:`w-full rounded-md px-5 py-1.5 text-xs font-medium duration-200 ${u?"cursor-not-allowed bg-gray-200 text-gray-400":"bg-blue-700/20 text-blue-800 hover:bg-blue-700/30"}`,children:lodashEs.isEmpty(o)?jsxRuntime.jsxRuntimeExports.jsx("small",{className:"text-[9.5px] text-gray-500",children:"No data provider has been set up for this page"}):"+ Add Data Binding"})})}),u&&jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{sideOffset:-55,className:"text-[11px]",children:lodashEs.isEmpty(o)?"No data provider has been set up for this page.":"Complete last added data binding to add more"})]})]})},DataBindingSetting$1=DataBindingSetting,BindingWidget=()=>jsxRuntime.jsxRuntimeExports.jsx("div",{className:"text-xs border rounded-sm p-1 mt-1 border-orange-500 text-orange-500 bg-orange-100",children:"Data binding is set for this field"}),getSvgMarkup=r=>{try{const n=document.getElementById("icon-picker-field"),a=document.createElement("div");ReactDOM.render(jsxRuntime.jsxRuntimeExports.jsx(IconPicker.IconPickerItem,{value:r}),a),n.appendChild(a),a.hidden=!0;let o=a.innerHTML;setTimeout(()=>n.removeChild(a),100);const l=new DOMParser().parseFromString(o,"image/svg+xml"),c=l.querySelector("svg");return c&&(c.removeAttribute("width"),c.removeAttribute("height")),new XMLSerializer().serializeToString(l)}catch(n){return console.error(n),""}},IconPickerField=({value:r,onChange:n})=>{const{t:a}=reactI18next.useTranslation(),o=i=>{n("<svg />");const l=getSvgMarkup(i);n(l)};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-1 flex h-20 items-center gap-x-2",id:"icon-picker-field",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"group relative h-12 w-12",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{dangerouslySetInnerHTML:{__html:r?r.replace("<svg",'<svg class="h-5 w-5"'):"<svg class='h-5 w-5' />"},className:"absolute left-1/2 top-1/2 z-0 -translate-x-1/2 -translate-y-1/2 transform cursor-pointer bg-white"}),jsxRuntime.jsxRuntimeExports.jsx(IconPicker,{value:r?"BiSolidGrid":null,onChange:o,pickButtonStyle:{position:"relative",height:"48px",width:"48px",border:"1px solid #BBBBBB",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"6px",backgroundColor:"transparent",zIndex:1},searchInputStyle:{backgroundColor:"transparent",width:"100%",border:"1px solid #BBBBBB",margin:"0px 10px",padding:"10px"}})]}),jsxRuntime.jsxRuntimeExports.jsx("textarea",{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",value:r,onChange:i=>n(i.target.value),className:"h-full w-full rounded-sm border border-foreground/20 px-2 py-1 text-xs shadow-sm focus:border-gray-500/80 focus:outline-none focus:ring-0",placeholder:a("choose_icon_or_enter_svg")})]})},UnsplashImages=React.lazy(()=>Promise.resolve().then(()=>require("./UnsplashImages-CoGuPmgH.cjs"))),UploadImages=React.lazy(()=>Promise.resolve().then(()=>require("./UploadImages-TnivpGXd.cjs"))),ImagesPanel=({isModalView:r=!1,onSelect:n=()=>{}})=>{const a=useBuilderProp("uploadMediaCallback"),o=useBuilderProp("unsplashAccessKey"),i=a===void 0,l=o===void 0,[c,u]=React.useState(l?"upload":i?"unsplash":"upload");return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-between rounded-md bg-background/30 p-1",children:jsxRuntime.jsxRuntimeExports.jsx("h1",{className:"px-1 font-semibold",children:r&&i?"Unsplash images":r?"Select or upload images":"Images"})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tabs,{value:c,onValueChange:d=>u(d),className:"flex h-full w-full flex-col py-2",children:[!(i||l)&&jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.TabsList,{className:"w-full",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"upload",className:"w-full",children:"Upload"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"unsplash",className:"w-full",children:"Unsplash"})]}),c==="unsplash"?jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsContent,{value:"unsplash",className:"flex h-full flex-col overflow-hidden",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-64 w-full animate-pulse bg-gray-100"}),children:jsxRuntime.jsxRuntimeExports.jsx(UnsplashImages,{isModalView:r,onSelect:n})})}):jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsContent,{value:"upload",className:"flex h-full flex-col overflow-hidden",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-64 w-full animate-pulse bg-gray-100"}),children:jsxRuntime.jsxRuntimeExports.jsx(UploadImages,{isModalView:r,onSelect:n})})})]})]})},ImagesPanel$1=ImagesPanel,ImagePickerModal=({children:r,onSelect:n})=>{const[a,o]=React.useState(!1),i=(...l)=>{n.call(void 0,...l),o(!1)};return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Dialog,{open:a,onOpenChange:l=>o(l),children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogTrigger,{asChild:!0,children:r}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DialogContent,{className:"flex h-3/4 max-w-5xl",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-full w-full",children:jsxRuntime.jsxRuntimeExports.jsx(ImagesPanel$1,{isModalView:!0,onSelect:i})})})]})},ImagePickerModal$1=ImagePickerModal,ImagePickerField=({value:r,onChange:n,id:a,onBlur:o})=>{const i=useBuilderProp("uploadMediaCallback"),l=useBuilderProp("unsplashAccessKey"),{t:c}=reactI18next.useTranslation(),u=i===void 0,d=l===void 0;return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-1.5 flex items-center gap-x-3",children:[r?jsxRuntime.jsxRuntimeExports.jsx("img",{src:r,className:"h-20 w-20 overflow-hidden rounded-md border object-cover",alt:""}):jsxRuntime.jsxRuntimeExports.jsx(ImagePickerModal$1,{onSelect:n,children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-20 w-20 cursor-pointer rounded-md border bg-[radial-gradient(#AAA,transparent_1px)] duration-300 [background-size:10px_10px] hover:border-gray-400"})}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex w-3/5 flex-col",children:[!(u&&d)&&jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(ImagePickerModal$1,{onSelect:n,children:jsxRuntime.jsxRuntimeExports.jsx("small",{className:"h-6 cursor-pointer rounded-md bg-primary px-2 py-1 text-center text-xs text-white hover:bg-gray-500 dark:bg-gray-700",children:r||!lodashEs.isEmpty(r)?c("replace_image"):c("choose_image")})}),jsxRuntime.jsxRuntimeExports.jsx("small",{className:"-pl-4 pt-2 text-center text-xs text-gray-600",children:"OR"})]}),jsxRuntime.jsxRuntimeExports.jsx("input",{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",type:"url",className:"text-xs",placeholder:c("enter_image_url"),value:r,onBlur:({target:{value:p}})=>o(a,p),onChange:p=>n(p.target.value)})]})]})},RichTextEditorField=({id:r,placeholder:n,value:a,onChange:o,onBlur:i})=>{const l={toolbar:[["bold","italic","underline","strike","blockquote"],[{list:"ordered"},{list:"bullet"}],[{color:[]},{background:[]},{align:[]}],["link","clean"]]},c=["header","font","list","bold","italic","underline","strike","blockquote","color","background","align","link","image"];return typeof window>"u"?null:jsxRuntime.jsxRuntimeExports.jsx(ReactQuill,{id:r,value:a,onBlur:u=>i(r,u),onChange:u=>o(u),modules:l,formats:c,placeholder:n,className:"mt-1 rounded-md"})},LinkField=({schema:r,formData:n,onChange:a})=>{const[o,i]=React.useState([]),l=useBuilderProp("getPages",()=>[]),{type:c="page",href:u="",target:d="self"}=n;return React.useEffect(()=>{(async()=>{const p=await l();i(p||[])})()},[]),jsxRuntime.jsxRuntimeExports.jsxs("div",{children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:"text-xs font-medium",children:(r==null?void 0:r.title)??"Link"}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col gap-y-1.5",children:[jsxRuntime.jsxRuntimeExports.jsx("select",{name:"type",value:c,onChange:p=>a({...n,type:p.target.value}),children:[{const:"page",title:"Open Page"},{const:"url",title:"Open URL"},{const:"email",title:"Compose Email"},{const:"telephone",title:"Call Phone"},{const:"scroll",title:"Scroll to element"}].map(p=>jsxRuntime.jsxRuntimeExports.jsx("option",{value:p.const,children:p.title},p.const))}),c==="page"?jsxRuntime.jsxRuntimeExports.jsxs("select",{name:"href",value:u,onChange:p=>a({...n,href:p.target.value||"#"}),children:[jsxRuntime.jsxRuntimeExports.jsx("option",{value:"",children:"Choose page"}),lodashEs.map(o,p=>jsxRuntime.jsxRuntimeExports.jsx("option",{value:p.slug,children:p.name},p.uuid))]}):jsxRuntime.jsxRuntimeExports.jsx("input",{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",name:"href",type:"text",value:u,onChange:p=>a({...n,href:p.target.value||"#"}),placeholder:c==="page"||c==="url"?"Enter URL":c==="scroll"?"#ElementID":"Enter detail"}),(c==="page"||c==="url")&&jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx("input",{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",type:"checkbox",defaultChecked:d==="_blank",className:"cursor-pointer rounded-md border border-border",onChange:()=>a({...n,target:d==="_blank"?"_self":"_blank"})}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"pt-1 text-xs",children:"Open in new tab"})]})]})]})},CodeEditor=({id:r,placeholder:n})=>{const{t:a}=reactI18next.useTranslation(),[,o]=useCodeEditor(),i=useSelectedBlock();if(typeof window>"u")return null;const l=r.replace("root.",""),c=lodashEs.get(i,l,""),u=()=>{const d=i==null?void 0:i._id;o({blockId:d,blockProp:l,placeholder:n,initialCode:lodashEs.get(i,l,c)})};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2 flex flex-col gap-y-1",children:[jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:u,className:"text-pretty w-[90%] max-w-full cursor-default truncate rounded border bg-white p-2 text-left text-[10px]",children:c.trim().length>0?c.substring(0,46):n||"Eg: <script>console.log('Hello, world!');<\/script>"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{onClick:u,size:"sm",variant:"outline",className:"w-fit",children:a("Open code editor")})]})},JSONForm=React.memo(({id:r,properties:n,formData:a,onChange:o})=>{const[i,l]=React.useState(a),c={type:"object",properties:{}},u={},{t:d}=reactI18next.useTranslation();Object.keys(n).forEach(f=>{const m=n[f];if(lodashEs.includes(["slot","styles"],m.type))return;const h=f;c.properties[h]=getBlockJSONFromSchemas(m,d),u[h]=getBlockJSONFromUISchemas(m)}),React.useEffect(()=>{l(a)},[r]);const p=web.useThrottledCallback(async({formData:f},m)=>{o({formData:f},m)},[o],1e3);return jsxRuntime.jsxRuntimeExports.jsx(Form,{widgets:{binding:BindingWidget,richtext:RichTextEditorField,icon:IconPickerField,image:ImagePickerField,code:CodeEditor},fields:{link:LinkField},idSeparator:".",autoComplete:"off",omitExtraData:!1,liveOmit:!1,liveValidate:!1,validator,uiSchema:u,schema:c,formData:i,onChange:({formData:f},m)=>{m&&(l(f),p({formData:f},m))}})}),CanvasSettings=()=>{const[r,n]=jotai.useAtom(xShowBlocksAtom),a=useSelectedBlock(),[,o]=useSelectedBlockIds(),{t:i}=reactI18next.useTranslation(),l=React.useMemo(()=>(a?JSON.stringify(a):"").includes('"x-show"'),[a]);if(!a||!l)return null;const c=r.includes(a._id);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"py-2 text-xs hover:no-underline",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2 border-b border-border bg-gray-200 px-4 py-2 font-normal",children:[a._name||a._type,"  ",i("visibility settings")]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center space-x-2 px-2 pt-2",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Switch,{id:"show-on-canvas",checked:c,onCheckedChange:u=>{u?(n(d=>[...d,a._id]),o([a._id])):n(d=>d.filter(p=>p!==a._id))}}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Label,{htmlFor:"show-on-canvas",children:i("Show on canvas")})]})]})};function BlockSettings(){const r=useSelectedBlock(),n=useUpdateBlocksPropsRealtime(),a=useUpdateBlocksProps(),o=runtime.getBlockComponent(r==null?void 0:r._type),i={...r},[l,c]=React.useState(i),u=useBuilderProp("dataBindingSupport",!1),d=({formData:g},y,b)=>{if(y&&(l==null?void 0:l._id)===r._id){const v=y.replace("root.","");a([r._id],{[v]:lodashEs.get(g,v)},b)}},p=React.useCallback(lodashEs.debounce(({formData:g},y,b)=>{d({formData:g},y,b),c(g)},1500),[r==null?void 0:r._id]),f=({formData:g},y)=>{if(y){const b=y.replace("root.","");n([r._id],convertDotNotationToObject(b,lodashEs.get(g,b.split(".")))),p({formData:g},y,{[b]:lodashEs.get(l,b)})}},m=lodashEs.keys(lodashEs.get(i,"_bindings",{})),h=React.useMemo(()=>{const g=lodashEs.cloneDeep(lodashEs.get(o,"props",{}));return u&&lodashEs.each(m,y=>delete g[y]),g},[o,m,u]);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"overflow-x-hidden",children:[u?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Accordion,{type:"multiple",defaultValue:["STATIC","BINDING"],className:"h-full w-full",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:"BINDING",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{className:"bg-gray-100 px-3 py-2 text-xs hover:no-underline",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:`h-[8px] w-[8px] rounded-full ${lodashEs.isEmpty(lodashEs.get(r,"_bindings",{}))?"bg-gray-300":"bg-blue-500"}`}),"Data Binding"]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionContent,{className:"px-4 pt-4",children:jsxRuntime.jsxRuntimeExports.jsx(DataBindingSetting$1,{bindingData:lodashEs.get(r,"_bindings",{}),onChange:g=>{d({formData:{_bindings:g}},"root._bindings")}})})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:"STATIC",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{className:"bg-gray-100 px-3 py-2 text-xs hover:no-underline",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-[8px] w-[8px] rounded-full bg-blue-500"}),"Static Content"]})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionContent,{className:"pt-4",children:[lodashEs.isEmpty(m)?null:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mx-4 mb-1 mt-0 rounded-sm border border-orange-500 bg-orange-100 p-1 text-xs text-orange-500",children:["Data binding is set for ",jsxRuntime.jsxRuntimeExports.jsx("b",{children:lodashEs.map(m,lodashEs.capitalize).join(", ")})," ",m.length===1?"property":"properties",". Remove data binding to edit static content."]}),jsxRuntime.jsxRuntimeExports.jsx(JSONForm,{id:r==null?void 0:r._id,onChange:f,formData:i,properties:h})]})]})]}):jsxRuntime.jsxRuntimeExports.jsx(JSONForm,{id:r==null?void 0:r._id,onChange:f,formData:i,properties:h}),jsxRuntime.jsxRuntimeExports.jsx(CanvasSettings,{})]})}function getChildBlocks(r,n,a){a.push(lodashEs.find(r,{_id:n}));const o=lodashEs.filter(r,{_parent:n});for(const i of o)a.push(...getBlockWithChildren(i._id,r));return a}const getBlockWithChildren=(r,n)=>{let a=[];return a=lodashEs.flattenDeep([...a,...getChildBlocks(n,r,a)]),a},askAiProcessingAtom=jotai.atom(!1),useAskAi=()=>{const[r,n]=jotai.useAtom(askAiProcessingAtom),[a,o]=React.useState(null),i=useBuilderProp("askAiCallBack",null),l=useStreamMultipleBlocksProps(),c=useUpdateMultipleBlocksProps(),[u]=useBlocksStore();return{askAi:React.useCallback(async(d,p,f,m)=>{if(i){n(!0),o(null);try{const h=d==="content"?lodashEs.cloneDeep(getBlockWithChildren(p,u)):[lodashEs.cloneDeep(u.find(v=>v._id===p))];lodashEs.set(h,"0._parent",null);const g=await i(d,f,h),{blocks:y,error:b}=g;if(b){o(b);return}d==="styles"?c(y):l(y),m&&m(g)}catch(h){o(h)}finally{n(!1),m&&m()}}},[i,n,u,c,l]),loading:r,error:a}};function FaMoon(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 512 512"},child:[{tag:"path",attr:{d:"M283.211 512c78.962 0 151.079-35.925 198.857-94.792 7.068-8.708-.639-21.43-11.562-19.35-124.203 23.654-238.262-71.576-238.262-196.954 0-72.222 38.662-138.635 101.498-174.394 9.686-5.512 7.25-20.197-3.756-22.23A258.156 258.156 0 0 0 283.211 0c-141.309 0-256 114.511-256 256 0 141.309 114.511 256 256 256z"},child:[]}]})(r)}function FaRecycle(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 512 512"},child:[{tag:"path",attr:{d:"M184.561 261.903c3.232 13.997-12.123 24.635-24.068 17.168l-40.736-25.455-50.867 81.402C55.606 356.273 70.96 384 96.012 384H148c6.627 0 12 5.373 12 12v40c0 6.627-5.373 12-12 12H96.115c-75.334 0-121.302-83.048-81.408-146.88l50.822-81.388-40.725-25.448c-12.081-7.547-8.966-25.961 4.879-29.158l110.237-25.45c8.611-1.988 17.201 3.381 19.189 11.99l25.452 110.237zm98.561-182.915l41.289 66.076-40.74 25.457c-12.051 7.528-9 25.953 4.879 29.158l110.237 25.45c8.672 1.999 17.215-3.438 19.189-11.99l25.45-110.237c3.197-13.844-11.99-24.719-24.068-17.168l-40.687 25.424-41.263-66.082c-37.521-60.033-125.209-60.171-162.816 0l-17.963 28.766c-3.51 5.62-1.8 13.021 3.82 16.533l33.919 21.195c5.62 3.512 13.024 1.803 16.536-3.817l17.961-28.743c12.712-20.341 41.973-19.676 54.257-.022zM497.288 301.12l-27.515-44.065c-3.511-5.623-10.916-7.334-16.538-3.821l-33.861 21.159c-5.62 3.512-7.33 10.915-3.818 16.536l27.564 44.112c13.257 21.211-2.057 48.96-27.136 48.96H320V336.02c0-14.213-17.242-21.383-27.313-11.313l-80 79.981c-6.249 6.248-6.249 16.379 0 22.627l80 79.989C302.689 517.308 320 510.3 320 495.989V448h95.88c75.274 0 121.335-82.997 81.408-146.88z"},child:[]}]})(r)}function FaSpinner(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 512 512"},child:[{tag:"path",attr:{d:"M304 48c0 26.51-21.49 48-48 48s-48-21.49-48-48 21.49-48 48-48 48 21.49 48 48zm-48 368c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zm208-208c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zM96 256c0-26.51-21.49-48-48-48S0 229.49 0 256s21.49 48 48 48 48-21.49 48-48zm12.922 99.078c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.491-48-48-48zm294.156 0c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.49-48-48-48zM108.922 60.922c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.491-48-48-48z"},child:[]}]})(r)}const SECONDS=10;function Countdown(){const[r,n]=React.useState(SECONDS),[a,o]=React.useState(!1);React.useEffect(()=>{if(a&&r>0){const d=setTimeout(()=>{n(r-.1)},100);return()=>clearTimeout(d)}else r<=0&&(o(!1),n(SECONDS))},[a,r]);const i=()=>{o(!0),n(SECONDS)};React.useEffect(()=>{r===SECONDS&&i()},[r]);const l=18,c=2*Math.PI*l,u=c*(1-(SECONDS-r)/SECONDS);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative h-4 w-4",children:[jsxRuntime.jsxRuntimeExports.jsxs("svg",{className:"h-full w-full",viewBox:"0 0 40 40",children:[jsxRuntime.jsxRuntimeExports.jsx("circle",{className:"text-gray-300",strokeWidth:"4",stroke:"currentColor",fill:"transparent",r:l,cx:"20",cy:"20"}),jsxRuntime.jsxRuntimeExports.jsx("circle",{className:"text-blue-600",strokeWidth:"4",strokeDasharray:c,strokeDashoffset:u,strokeLinecap:"round",stroke:"currentColor",fill:"transparent",r:l,cx:"20",cy:"20"})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"text-xs font-semibold",children:" "})})]})}const AskAIStyles=({blockId:r})=>{const{t:n}=reactI18next.useTranslation(),{askAi:a,loading:o,error:i}=useAskAi(),[l,c]=React.useState(""),u=React.useRef(null),d=React.useRef(null),[p,f]=React.useState();React.useEffect(()=>{var h;(h=u.current)==null||h.focus()},[]);const m=h=>{const{usage:g}=h||{};!i&&g&&f(g),d.current=setTimeout(()=>f(void 0),1e4),i||c("")};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"",children:[jsxRuntime.jsxRuntimeExports.jsx("h2",{className:"mb-1 text-sm font-semibold leading-none tracking-tight",children:n("ask_ai")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{ref:u,value:l,onChange:h=>c(h.target.value),placeholder:n("ask_ai_to_edit_styles"),className:"w-full border border-gray-400 focus:border-0",rows:3,onKeyDown:h=>{h.key==="Enter"&&(h.preventDefault(),d.current&&clearTimeout(d.current),f(void 0),a("styles",r,l,m))}}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"my-2 flex items-center gap-2",children:[o?null:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:l.trim().length<5||o,onClick:()=>{d.current&&clearTimeout(d.current),f(void 0),a("styles",r,l,m)},variant:"default",className:"w-fit",size:"sm",children:o?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"h-5 w-5 animate-spin"}),n("generating_please_wait")]}):n("edit_with_ai")}),o?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col gap-2",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Skeleton,{className:"flex w-full items-center space-x-1 px-4 py-1 pl-2",children:[jsxRuntime.jsxRuntimeExports.jsx(FaSpinner,{className:"h-4 w-4 animate-spin text-gray-500"}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs",children:n("generating_please_wait")})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{variant:"destructive",onClick:()=>stop(),className:"hidden w-fit",size:"sm",children:n("stop")})]}):null]}),p?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"max-w-full",children:jsxRuntime.jsxRuntimeExports.jsxs("p",{className:"mb-1 flex justify-between break-words rounded border border-blue-500 bg-blue-100 p-1 text-xs text-blue-500",children:[jsxRuntime.jsxRuntimeExports.jsxs("span",{children:[n("Total tokens used"),": ",p.totalTokens]}),jsxRuntime.jsxRuntimeExports.jsx(Countdown,{})]})}):null,jsxRuntime.jsxRuntimeExports.jsx("div",{className:"max-w-full",children:i&&jsxRuntime.jsxRuntimeExports.jsx("p",{className:"break-words rounded border border-red-500 bg-red-100 p-1 text-xs text-red-500",children:i.message})})]})},fuse=new Fuse(ALL_TW_CLASSES,{isCaseSensitive:!1,threshold:.2,minMatchCharLength:2,keys:["name"]});function ManualClasses(){var S;const{t:r}=reactI18next.useTranslation(),[n]=useSelectedStylingBlocks(),a=useSelectedBlock(),o=useAddClassesToBlocks(),i=useRemoveClassesFromBlocks(),[l]=useSelectedBlockIds(),c=useBuilderProp("askAiCallBack",null),[u,d]=React.useState(""),{toast:p}=contextMenu.useToast(),f=(S=lodashEs.first(n))==null?void 0:S.prop,m=lodashEs.reject((lodashEs.get(a,f,"").replace(STRINGS.STYLES_KEY,"").split(",").pop()||"").split(" "),lodashEs.isEmpty),h=()=>{const w=u.trim().toLowerCase().replace(/ +(?= )/g,"").split(" ");o(l,w,!0),d("")},[g,y]=React.useState([]),b=({value:w})=>{const C=w.trim().toLowerCase(),I=C.match(/.+:/g);let j=[];if(I&&I.length>0){const[k]=I,P=C.replace(k,"");j=fuse.search(P).map(B=>({...B,item:{...B.item,name:k+B.item.name}}))}else j=fuse.search(C);return y(lodashEs.map(j,"item"))},v=()=>{y([])},x=w=>w.name,E=w=>jsxRuntime.jsxRuntimeExports.jsx("div",{className:"rounded-md p-1",children:w.name}),R={autoComplete:"off",autoCorrect:"off",autoCapitalize:"off",spellCheck:!1,placeholder:r("enter_classes_separated_by_space"),value:u,onKeyDown:w=>{w.key==="Enter"&&u.trim()!==""&&h()},onChange:(w,{newValue:C})=>d(C),className:"w-full rounded-md text-xs px-2 hover:outline-0 bg-background border-border py-1"},A=()=>{if(navigator.clipboard===void 0){p({title:r("clipboard_not_supported"),description:r("please_use_chrome_firefox_or_safari"),variant:"destructive"});return}navigator.clipboard.writeText(m.join(" ")),p({title:r("copied"),description:r("classes_copied_to_clipboard")})};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:`flex ${g.length>0?"min-h-[300px]":"min-h-max"} w-full flex-col gap-y-1.5 overflow-y-auto pb-4`,children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-between gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:r("classes")}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CopyIcon,{onClick:A,className:"cursor-pointer"})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:r("copy_classes_to_clipboard")})})]})]}),c?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Popover,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.PopoverTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{variant:"default",className:"h-6 w-fit",size:"sm",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.SparklesIcon,{className:"h-4 w-4"}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"ml-2",children:r("ask_ai")})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.PopoverContent,{side:"left",className:"p-2",children:jsxRuntime.jsxRuntimeExports.jsx(AskAIStyles,{blockId:a==null?void 0:a._id})})]}):null]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex items-center gap-x-3",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"relative flex w-full items-center gap-x-3",children:jsxRuntime.jsxRuntimeExports.jsx(Autosuggest,{suggestions:g,onSuggestionsFetchRequested:b,onSuggestionsClearRequested:v,getSuggestionValue:x,renderSuggestion:E,inputProps:R,containerProps:{className:"relative h-8 w-full gap-y-1 py-1 border-gray-600"},theme:{suggestion:"bg-transparent",suggestionHighlighted:"!bg-gray-300 ",suggestionsContainerOpen:"absolute bg-gray-100 z-50 max-h-[230px] overflow-y-auto w-full border border-gray-600 rounded-md"}})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{variant:"outline",className:"h-6 border-gray-700",onClick:h,disabled:u.trim()==="",size:"sm",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.PlusIcon,{})})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-full flex-wrap gap-2 overflow-x-hidden",children:React__namespace.Children.toArray(m.map(w=>jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"group relative flex max-w-[260px] cursor-default items-center gap-x-1 truncate rounded border border-gray-300 bg-gray-200 p-px px-1.5 text-[11px] text-gray-600 hover:border-gray-300",children:[w,jsxRuntime.jsxRuntimeExports.jsx(reactIcons.Cross2Icon,{onClick:()=>i(l,[w]),className:"invisible absolute right-1 rounded-full bg-red-400 hover:text-white group-hover:visible group-hover:cursor-pointer"})]},w)))})]})}const BASIC_UNITS=["px","%","em","rem","ch","vh","vw"],FLEX_CHILD_SECTION={heading:"flex.heading",items:[{type:"arbitrary",label:"flex.basis",units:BASIC_UNITS,property:"flexBasis"},{type:"range",label:"flex.order",property:"order"},{type:"dropdown",label:"flex.flex",property:"flexGrowShrink"},{type:"dropdown",label:"flex.grow",property:"flexGrow"},{type:"dropdown",label:"flex.shrink",property:"flexShrink"}]},GRID_CHILD_SECTION={heading:"grid.heading",items:[{type:"range",label:"grid.col_span",property:"gridColSpan"},{type:"range",label:"grid.col_start",property:"gridColStart"},{type:"range",label:"grid.col_end",property:"gridColEnd"},{type:"range",label:"grid.row_span",property:"gridRowSpan"},{type:"range",label:"grid.row_start",property:"gridRowStart"},{type:"range",label:"grid.row_end",property:"gridRowEnd"},{type:"range",label:"grid.order",property:"order"}]},SETTINGS_SECTIONS=[{heading:"Styles",items:[{component:ManualClasses},{type:"arbitrary",label:"layout.width",units:BASIC_UNITS.concat("auto"),property:"width"},{type:"arbitrary",label:"layout.height",units:BASIC_UNITS.concat("auto"),property:"height"},{styleType:"multiple",label:"layout.margin",negative:!0,units:[...BASIC_UNITS,"auto"],options:[{key:"margin",label:"layout.margin_all"},{key:"marginX",label:"layout.margin_lr"},{key:"marginY",label:"layout.margin_tb"},{key:"marginTop",label:"layout.margin_top"},{key:"marginRight",label:"layout.margin_right"},{key:"marginBottom",label:"layout.margin_bottom"},{key:"marginLeft",label:"layout.margin_left"}]},{styleType:"multiple",label:"layout.padding",options:[{key:"padding",label:"layout.padding_all"},{key:"paddingX",label:"layout.padding_lr"},{key:"paddingY",label:"layout.padding_tb"},{key:"paddingTop",label:"layout.padding_top"},{key:"paddingRight",label:"layout.padding_right"},{key:"paddingBottom",label:"layout.padding_bottom"},{key:"paddingLeft",label:"layout.padding_left"}]},{styleType:"accordion",heading:"Typography",items:[{type:"dropdown",property:"textAlign",label:"typography.align"},{type:"dropdown",property:"fontFamily",label:"typography.font"},{type:"arbitrary",property:"fontSize",label:"typography.size",units:BASIC_UNITS},{type:"arbitrary",property:"lineHeight",label:"typography.height",units:BASIC_UNITS.concat("-")},{type:"range",property:"fontWeight",label:"typography.weight"},{type:"color",property:"textColor",label:"typography.color"}]},{styleType:"accordion",heading:"Background",items:[{type:"color",label:"background.bgcolor",property:"backgroundColor"},{type:"dropdown",label:"background.attachment",property:"backgroundAttachment"},{type:"dropdown",label:"background.clipping",property:"backgroundClip"},{type:"dropdown",label:"background.origin",property:"backgroundOrigin"},{type:"dropdown",label:"background.position",property:"backgroundPosition"},{type:"dropdown",label:"background.repeat",property:"backgroundRepeat"},{type:"dropdown",label:"background.size",property:"backgroundSize"}]}]}];BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("auto"),[...BASIC_UNITS],BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("auto"),BASIC_UNITS.concat("-");const EDITOR_ICONS={"not-italic":()=>jsxRuntime.jsxRuntimeExports.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9 3H11V5H9V11H11V13H5V11H7V5H5V3H9Z",fill:"white"})}),visible:reactIcons.EyeOpenIcon,invisible:reactIcons.EyeClosedIcon,hidden:reactIcons.EyeClosedIcon,gap:reactIcons.BorderAllIcon,gapX:reactIcons.WidthIcon,gapY:reactIcons.HeightIcon,spaceX:reactIcons.WidthIcon,spaceY:reactIcons.HeightIcon,overscroll:reactIcons.BorderAllIcon,overscrollX:reactIcons.WidthIcon,overscrollY:reactIcons.HeightIcon,overflow:reactIcons.BorderAllIcon,overflowX:reactIcons.WidthIcon,overflowY:reactIcons.HeightIcon,top:reactIcons.ArrowUpIcon,right:reactIcons.ArrowRightIcon,bottom:reactIcons.ArrowDownIcon,left:reactIcons.ArrowLeftIcon,inset:reactIcons.BorderAllIcon,insetX:reactIcons.WidthIcon,insetY:reactIcons.HeightIcon,border:reactIcons.BorderAllIcon,borderX:reactIcons.WidthIcon,borderY:reactIcons.HeightIcon,borderTop:reactIcons.ArrowUpIcon,borderRight:reactIcons.ArrowRightIcon,borderBottom:reactIcons.ArrowDownIcon,borderLeft:reactIcons.ArrowLeftIcon,borderRadius:reactIcons.BorderAllIcon,borderRadiusX:reactIcons.WidthIcon,borderRadiusY:reactIcons.HeightIcon,borderRadiusTop:reactIcons.ArrowUpIcon,borderRadiusRight:reactIcons.ArrowRightIcon,borderRadiusBottom:reactIcons.ArrowDownIcon,borderRadiusLeft:reactIcons.ArrowLeftIcon,borderRadiusTopLeft:reactIcons.ArrowTopLeftIcon,borderRadiusTopRight:reactIcons.ArrowTopRightIcon,borderRadiusBottomRight:reactIcons.ArrowBottomRightIcon,borderRadiusBottomLeft:reactIcons.ArrowBottomLeftIcon,divideXWidth:reactIcons.WidthIcon,divideYWidth:reactIcons.HeightIcon,scale:reactIcons.BorderAllIcon,scaleX:reactIcons.WidthIcon,scaleY:reactIcons.HeightIcon,skewX:reactIcons.WidthIcon,skewY:reactIcons.HeightIcon,translateX:reactIcons.WidthIcon,translateY:reactIcons.HeightIcon,padding:reactIcons.BorderAllIcon,paddingX:reactIcons.WidthIcon,paddingY:reactIcons.HeightIcon,paddingTop:reactIcons.ArrowUpIcon,paddingRight:reactIcons.ArrowRightIcon,paddingBottom:reactIcons.ArrowDownIcon,paddingLeft:reactIcons.ArrowLeftIcon,margin:reactIcons.BorderAllIcon,marginX:reactIcons.WidthIcon,marginY:reactIcons.HeightIcon,marginTop:reactIcons.ArrowUpIcon,marginRight:reactIcons.ArrowRightIcon,marginBottom:reactIcons.ArrowDownIcon,marginLeft:reactIcons.ArrowLeftIcon,textLeft:reactIcons.AlignLeftIcon,textCenter:reactIcons.AlignCenterHorizontallyIcon,textRight:reactIcons.AlignRightIcon,textJustify:reactIcons.StretchHorizontallyIcon,italic:reactIcons.FontItalicIcon,underline:reactIcons.UnderlineIcon,overline:reactIcons.OverlineIcon,uppercase:reactIcons.LetterCaseUppercaseIcon,block:()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M2 2H14V14H2V2ZM1 1H15V15H1V1Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M7 4H4V12H7V4ZM9 4H12V12H9V4Z",fill:"currentColor"})]}),"float-right":()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{d:"M8 4H16V12H8V4Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M0 4H6V6H0V4ZM0 7H6V9H0V7ZM4 10H0V12H4V10Z",fill:"currentColor"})]}),"float-left":()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{d:"M0 4H8V12H0V4Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M10 4H16V6H10V4ZM10 7H16V9H10V7ZM14 10H10V12H14V10Z",fill:"currentColor"})]}),"float-none":reactIcons.Cross2Icon,fixed:()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M15 2H14V4H13V5H14V6H15V2ZM10 5V4H9V2H1V8H2V5H10ZM7 4V3H5V4H7ZM4 4V3H2V4H4ZM1 13H7V14H1V13Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11 2H10V3H11V6H12V3H13V2H11ZM2 9H1V12H2V11H7V10H2V9ZM15 7H8V14H15V7Z",fill:"currentColor"})]}),absolute:()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M14 2H15V6H14V2ZM9 3V2H1V8H2V3H9ZM7 13H1V14H7V13Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11 2H10V3H11V6H12V3H13V2H11ZM2 9H1V12H2V11H7V10H2V9ZM15 7H8V14H15V7Z",fill:"currentColor"})]}),relative:()=>jsxRuntime.jsxRuntimeExports.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:jsxRuntime.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11 2H9V3H11V6H12V3H14V2H11ZM2 8H1V13H2V11H7V10H2V8ZM15 7H8V14H15V7Z",fill:"currentColor"})}),sticky:()=>jsxRuntime.jsxRuntimeExports.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsxRuntimeExports.jsx("path",{d:"M12.9998 7C13.6558 7 14.2937 6.78498 14.8158 6.38787C15.338 5.99076 15.7156 5.43345 15.8908 4.80128C16.066 4.16912 16.0292 3.49694 15.7859 2.8877C15.5427 2.27846 15.1065 1.76573 14.5441 1.42804C13.9817 1.09034 13.3241 0.946293 12.672 1.01795C12.02 1.08961 11.4094 1.37303 10.9337 1.8248C10.4581 2.27658 10.1436 2.8718 10.0385 3.51932C9.93341 4.16685 10.0434 4.83097 10.3518 5.41L6.88176 8.88C6.80034 8.96122 6.73572 9.05769 6.69158 9.16388C6.64744 9.27008 6.62465 9.38393 6.62451 9.49894C6.62437 9.61395 6.64689 9.72785 6.69077 9.83416C6.73465 9.94046 6.79904 10.0371 6.88026 10.1185C6.96149 10.1999 7.05795 10.2645 7.16415 10.3087C7.27035 10.3528 7.3842 10.3756 7.4992 10.3758C7.61421 10.3759 7.72812 10.3534 7.83442 10.3095C7.94072 10.2656 8.03734 10.2012 8.11876 10.12L11.5888 6.648C12.0088 6.873 12.4888 7 12.9988 7H12.9998Z",fill:"currentColor"}),jsxRuntime.jsxRuntimeExports.jsx("path",{opacity:"0.6",fillRule:"evenodd",clipRule:"evenodd",d:"M9.535 2H1V14H15V7.465C14.69 7.645 14.355 7.783 14 7.875V13H2V5H9.126C8.86504 3.98486 9.01223 2.90789 9.536 2H9.535ZM7 3V4H5V3H7ZM4 3V4H2V3H4Z",fill:"currentColor"})]}),static:reactIcons.Cross1Icon},StyleContext=React.createContext({canReset:!1,canChange:!0}),BlockStyleProvider=({children:r,canReset:n=!1,canChange:a=!0})=>jsxRuntime.jsxRuntimeExports.jsx(StyleContext.Provider,{value:{canReset:n,canChange:a},children:r}),DropDownChoices=({label:r,property:n,onChange:a})=>{const o=React.useMemo(()=>lodashEs.get(CLASSES_LIST,`${n}.classes`,[""]),[n]),i=useCurrentClassByProperty(n),l=React.useMemo(()=>lodashEs.get(i,"cls",""),[i]),{canChange:c}=React.useContext(StyleContext),u=/\[.*\]/g.test(l);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:r?"w-full rounded":"grow",children:u?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Input,{className:"w-[70%] rounded py-1",readOnly:!0,value:l}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{delayDuration:100,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"invisible ml-3 mt-1 text-blue-600 group-hover:visible",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.InfoCircledIcon,{})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:"Current value is using a Tailwind arbitrary value."})]})]}):jsxRuntime.jsxRuntimeExports.jsx(DropDown,{rounded:r,onChange:d=>a(d,n),selected:l,options:o,disabled:!c})})};function DropDown({selected:r,onChange:n,rounded:a=!1,options:o,disabled:i=!1}){const l=r.replace(/.*:/g,"").trim(),{undo:c,redo:u}=useUndoManager();return jsxRuntime.jsxRuntimeExports.jsxs("select",{disabled:!o.length||i,className:`${a?"rounded-md border border-border":"border-0"} disable:bg-gray-500 h-full w-full truncate rounded bg-background px-2 py-1 text-xs outline-none disabled:cursor-not-allowed`,onChange:d=>n(d.target.value),onKeyDown:d=>{d.ctrlKey&&(d.key==="z"&&c(),d.key==="y"&&u())},value:l,children:[jsxRuntime.jsxRuntimeExports.jsx("option",{className:"bg-transparent",value:""}),React.Children.toArray(o.map(d=>jsxRuntime.jsxRuntimeExports.jsx("option",{className:"bg-transparent",value:d,children:d})))]})}const RangeChoices=({property:r,onChange:n})=>{const{canReset:a,canChange:o}=React.useContext(StyleContext),i=useCurrentClassByProperty(r),l=React.useMemo(()=>lodashEs.get(i,"cls",""),[i]),c=React.useMemo(()=>lodashEs.get(CLASSES_LIST,`${r}.classes`,[""]),[r]),u=c.indexOf(l)>-1?c.indexOf(l):0,d=/\[.*\]/g.test(l);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-row divide-x divide-solid divide-border rounded border border-border text-xs",children:d?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"py-[5px] px-2",children:l}):jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"box-border w-2/12 rounded-tl rounded-bl bg-background px-1 text-center hover:bg-bg-gray-700 disabled:cursor-not-allowed disabled:bg-gray-600",disabled:!o&&(!a||u-1<0),onClick:()=>n(lodashEs.nth(c,u-1),r),children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"flex items-center justify-center",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.MinusIcon,{className:!o&&(!a||u-1<0)?"text-gray-500":"text-black/60 dark:text-white/60"})})}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-8/12 text-center",children:jsxRuntime.jsxRuntimeExports.jsx(DropDownChoices,{label:!1,property:r,onChange:n})}),jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"w-2/12 rounded-tr rounded-br bg-background px-1 text-center hover:bg-bg-gray-700 disabled:cursor-not-allowed disabled:bg-gray-600",disabled:!o&&(!a||u+1>=c.length),onClick:()=>n(lodashEs.nth(c,u+1),r),children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"flex items-center justify-center",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.PlusIcon,{className:!o&&(!a||u+1>=c.length)?"text-gray-500":"text-black/60 dark:text-white/60"})})})]})})},IconChoices=({property:r,onChange:n})=>{const a=React.useMemo(()=>lodashEs.get(CLASSES_LIST,`${r}.classes`,[""]),[r]),{canChange:o}=React.useContext(StyleContext),i=useCurrentClassByProperty(r),l=React.useMemo(()=>lodashEs.get(i,"cls",""),[i]);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex grow flex-wrap gap-1",children:lodashEs.map(a,c=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",disabled:!o,onClick:()=>n(c,r),className:`cursor-pointer rounded border border-gray-600 p-1 disabled:cursor-not-allowed ${l===c?" bg-blue-500 text-white":"disabled:bg-gray-600 disabled:text-gray-400"}`,children:React.createElement(lodashEs.get(EDITOR_ICONS,c,reactIcons.BoxIcon))})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:lodashEs.startCase(lodashEs.toLower(c))})]}))})},COLOR_PROP={backgroundColor:"bg",textColor:"text",borderColor:"border",boxShadowColor:"shadow",outlineColor:"outline",divideColor:"divide",fromColor:"from",viaColor:"via",toColor:"to",ringColor:"ring",ringOffsetColor:"ring-offset"},ColorChoice=({property:r,onChange:n})=>{const a=useCurrentClassByProperty(r),o=React.useMemo(()=>lodashEs.get(a,"cls",""),[a]),{canChange:i}=React.useContext(StyleContext),[l,c]=React.useState([]),[u,d]=React.useState({color:"",shade:""}),p=o.split("-"),f=lodashEs.get(p,"1",""),m=lodashEs.get(p,"2",""),h=React.useCallback(y=>{["current","inherit","transparent","black","white"].includes(y)?(c([]),d({color:y})):(c(["50","100","200","300","400","500","600","700","800","900"]),d(b=>({...b,color:y,shade:b.shade?b.shade:"500"})))},[c,d]);React.useEffect(()=>{if(["current","inherit","transparent","black","white"].includes(f))return c([]);c(["50","100","200","300","400","500","600","700","800","900"])},[f]);const g=React.useCallback(y=>{d({color:f,shade:y})},[f]);return React.useEffect(()=>{d({color:"",shade:""})},[a]),React.useEffect(()=>{const b=`${lodashEs.get(COLOR_PROP,r,"")}-${u.color}${u.shade?`-${u.shade}`:""}`;b.match(new RegExp(lodashEs.get(CLASSES_LIST,`${r}.regExp`,"")))&&n(b,r)},[u,n,r]),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-row divide-x divide-solid divide-border rounded-lg border border-border text-xs",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"grow text-center",children:jsxRuntime.jsxRuntimeExports.jsx(DropDown,{disabled:!i,rounded:!0,selected:f,onChange:h,options:["current","transparent","primary","secondary","black","white","slate","gray","zinc","neutral","stone","red","orange","amber","yellow","lime","green","emerald","teal","cyan","sky","blue","indigo","violet","purple","fuchsia","pink","rose"]})}),jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"grow text-center",children:jsxRuntime.jsxRuntimeExports.jsx(DropDown,{rounded:!0,selected:m,disabled:!f||!i,onChange:g,options:l})})]})},getUserInputValues=(r,n)=>{r=r.toLowerCase();let a=r.trim().replace(/ |\+/g,"");if((a==="auto"||a==="none")&&n.includes(a))return{value:"",unit:a};const o=n.length?new RegExp(n.join("|"),"g"):/XXXXXX/g;a=a.replace(o,"");const i=r.match(o),l=i&&i.length>1,c=!lodashEs.isEmpty(a)&&Number.isNaN(Number(a));return l||c?{error:"Invalid value"}:i&&(i[0]==="auto"||i[0]==="none")?{value:i[0],unit:""}:{value:a,unit:i?i[0]:""}},getTwClassValue=r=>{const n=r.startsWith("-")?"-":"",a=r.split("-").pop();if(["auto","none"].includes(a))return{value:"",unit:a};if(a==="px")return{value:"1",unit:"px"};if(a==="screen")return{value:"100",unit:r.indexOf("w-")!==-1?"vw":"vh"};if(a==="full")return{value:"100",unit:"%"};if(lodashEs.includes(r,"skew-"))return{value:`${n}${a}`,unit:"deg"};if(lodashEs.includes(r,"rotate-"))return{value:`${n}${a}`,unit:"deg"};if(lodashEs.includes(r,"opacity-"))return{value:`${a/100}`,unit:"-"};if(lodashEs.includes(r,"duration-")||lodashEs.includes(r,"delay-"))return{value:`${a}`,unit:"ms"};if(lodashEs.includes(r,"translate-")&&!a.includes("/"))return{value:`${n}${`${a/4}`}`,unit:"rem"};if(lodashEs.includes(r,"scale-"))return{value:`${n}${`${a/100}`}`,unit:"-"};if(lodashEs.startsWith(r,"border")){const o=r.match(/border-?(x|y|t|r|b|l)?\d+/g);if(o)return{value:o[0].split("-").pop(),unit:"px"};if(r.match(/border-?(x|y|t|r|b|l)?/g))return{value:"1",unit:"px"}}if(lodashEs.startsWith(r,"max-w-")){if(r==="max-w-screen-sm")return{value:"640",unit:"px"};if(r==="max-w-screen-md")return{value:"768",unit:"px"};if(r==="max-w-screen-lg")return{value:"1024",unit:"px"};if(r==="max-w-screen-xl")return{value:"1280",unit:"px"};if(r==="max-w-screen-2xl")return{value:"1536",unit:"px"};if(a==="xs")return{value:"320",unit:"px"};if(a==="sm")return{value:"384",unit:"px"};if(a==="md")return{value:"448",unit:"px"};if(a==="lg")return{value:"512",unit:"px"};if(a==="xl")return{value:"576",unit:"px"};if(a==="2xl")return{value:"672",unit:"px"};if(a==="3xl")return{value:"768",unit:"px"};if(a==="4xl")return{value:"896",unit:"px"};if(a==="5xl")return{value:"1024",unit:"px"};if(a==="6xl")return{value:"1152",unit:"px"};if(a==="7xl")return{value:"1280",unit:"px"};if(a==="prose")return{value:"65",unit:"ch"}}if(lodashEs.startsWith(r,"text-")){if(a==="xs")return{value:"12",unit:"px"};if(a==="sm")return{value:"14",unit:"px"};if(a==="base")return{value:"16",unit:"px"};if(a==="lg")return{value:"18",unit:"px"};if(a==="xl")return{value:"20",unit:"px"};if(a==="2xl")return{value:"24",unit:"px"};if(a==="3xl")return{value:"30",unit:"px"};if(a==="4xl")return{value:"36",unit:"px"};if(a==="5xl")return{value:"48",unit:"px"};if(a==="6xl")return{value:"60",unit:"px"};if(a==="7xl")return{value:"72",unit:"px"};if(a==="8xl")return{value:"96",unit:"px"};if(a==="9xl")return{value:"128",unit:"px"}}if(lodashEs.startsWith(r,"leading-")){if(a==="none")return{value:"1",unit:"-"};if(a==="tight")return{value:"1.25",unit:"-"};if(a==="snug")return{value:"1.375",unit:"-"};if(a==="normal")return{value:"1.5",unit:"-"};if(a==="relaxed")return{value:"1.625",unit:"-"};if(a==="loose")return{value:"2",unit:"-"}}if(lodashEs.startsWith(r,"tracking-")){if(a==="tighter")return{value:"-0.05",unit:"em"};if(a==="tight")return{value:"-0.025",unit:"em"};if(a==="normal")return{value:"0",unit:"em"};if(a==="wide")return{value:"0.025",unit:"em"};if(a==="wider")return{value:"0.05",unit:"em"};if(a==="widest")return{value:"0.1",unit:"em"}}if(["max","min","fit"].includes(a))return{value:r,unit:"class"};if(a.includes("/")){const[o,i]=lodashEs.map(a.split("/"),l=>parseInt(l,10));return{value:n+(o/i*100).toFixed(2).replace(".00",""),unit:"%"}}return lodashEs.isNumber(parseFloat(a))?{value:`${n+parseFloat(a)*4}`,unit:"px"}:{value:a,unit:"class"}},getClassValueAndUnit=r=>{if(lodashEs.isEmpty(r))return{value:"",unit:""};const n=r.match(/\[.*\]/g);if(n===null)return getValueAndUnitForTWClass(r);const a=lodashEs.get(n,"0","").replace(/\[|\]/g,""),o=r.startsWith("-")?"-":"",i=lodashEs.first(a.match(/\d+.\d+|\d+/g));return{value:`${o}${i}`,unit:a.replace(i,"")}},getValueAndUnitForTWClass=r=>lodashEs.isEmpty(r)?{value:"",unit:""}:getTwClassValue(r),BlockSettingsContext=React.createContext({setDragData:()=>{}}),DragStyleButton=({unit:r,currentValue:n,onDrag:a,onDragEnd:o,onDragStart:i,negative:l,cssProperty:c})=>{const{setDragData:u}=React.useContext(BlockSettingsContext);return jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",onMouseDown:d=>{const p={onDrag:a,onDragEnd:o,dragging:!0,dragStartY:d.pageY,dragStartValue:`${n}`,dragUnit:r,negative:l,cssProperty:c};i(p),u(p)},color:void 0,className:"relative z-50 ml-1 hidden h-6 cursor-row-resize rounded bg-background/70 px-2 group-hover:inline",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.RowSpacingIcon,{})})},UnitSelection=({onSelect:r,current:n,units:a})=>jsxRuntime.jsxRuntimeExports.jsx("div",{"data-theme":"light",className:"-m-[7px] -mx-[13px] flex w-9 flex-col",children:a.map(o=>jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{className:"h-max rounded-none px-1 py-1 text-right text-[11px] hover:bg-blue-400",color:n===o?"primary":void 0,size:"sm",onClick:i=>{i.stopPropagation(),r(o)},children:o},o))}),THROTTLE_TIME=50,AdvanceChoices=r=>{const[n,a]=React.useState(!1),[o,i]=React.useState(""),{currentClass:l,onChange:c,classPrefix:u,cssProperty:d,units:p,negative:f}=r,[m,h]=React.useState(d!=null&&d.toLowerCase().includes("width")?"%":p[0]),[g,y]=React.useState(!1),[b,v]=React.useState(""),[x,E]=React.useState(!1),[R,A]=React.useState(!1);React.useEffect(()=>{const{value:j,unit:k}=getClassValueAndUnit(l);if(k===""){i(j),h(d!=null&&d.toLowerCase().includes("width")?"%":lodashEs.first(p));return}h(k),i(k==="class"||lodashEs.isEmpty(j)?"":j)},[l,d,p]);const S=web.useThrottledCallback(j=>c(j),[c],THROTTLE_TIME),w=web.useThrottledCallback(j=>c(j,!1),[c],THROTTLE_TIME),C=React.useCallback((j=!1)=>{const k=getUserInputValues(`${o}`,p);if(lodashEs.get(k,"error",!1)){y(!0);return}const P=lodashEs.get(k,"unit")!==""?lodashEs.get(k,"unit"):m;if(P==="auto"||P==="none"){S(`${u}${P}`);return}if(lodashEs.get(k,"value")==="")return;const B=`${lodashEs.get(k,"value","").startsWith("-")?"-":""}${u}[${lodashEs.get(k,"value","").replace("-","")}${P==="-"?"":P}]`;j?w(B):S(B)},[S,w,o,m,u,p]),I=React.useCallback(j=>{const k=getUserInputValues(`${o}`,p);if(lodashEs.get(k,"error",!1)){y(!0);return}if(j==="auto"||j==="none"){S(`${u}${j}`);return}if(lodashEs.get(k,"value")==="")return;const P=lodashEs.get(k,"unit")!==""?lodashEs.get(k,"unit"):j,B=`${lodashEs.get(k,"value","").startsWith("-")?"-":""}${u}[${lodashEs.get(k,"value","").replace("-","")}${P==="-"?"":P}]`;S(B)},[S,o,u,p]);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-full flex-col",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-start",children:m==="class"?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx("input",{className:"w-20 rounded py-1",readOnly:!0,value:l}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"invisible ml-3 mt-1 text-blue-600 group-hover:visible",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.InfoCircledIcon,{})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:"Current value is using a Tailwind preset class."})]})]}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:`group relative flex items-center ${x?"z-auto":""}`,children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center rounded-md border border-border",children:[["none","auto"].indexOf(m)!==-1?null:jsxRuntime.jsxRuntimeExports.jsx("input",{readOnly:m==="class",onKeyPress:j=>{j.key==="Enter"&&C()},onKeyDown:j=>{if(j.keyCode!==38&&j.keyCode!==40)return;j.preventDefault(),A(!0);const k=lodashEs.parseInt(j.target.value);let P=lodashEs.isNaN(k)?0:k;j.keyCode===38&&(P+=1),j.keyCode===40&&(P-=1);const T=`${P}`,M=`${T.startsWith("-")?"-":""}${u}[${T.replace("-","")}${m==="-"?"":m}]`;w(M)},onKeyUp:j=>{R&&(j.preventDefault(),A(!1))},onBlur:()=>C(),onChange:j=>{y(!1),i(j.target.value)},onClick:j=>{var k;(k=j==null?void 0:j.target)==null||k.select(),a(!1)},value:x?b:o,className:"h-6 w-14 rounded rounded-r-none bg-background pl-2 text-sm focus-visible:outline-0 ".concat(" ",g?"border-red-500 text-red-500":"border-foreground/20")}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{open:n,delayDuration:100,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("button",{type:"button",onClick:()=>a(!n),className:"flex h-6 cursor-pointer items-center gap-x-1 rounded rounded-l-none bg-background p-px px-1 text-[11px] uppercase",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:`inline-block ${p.length===1?"px-2 font-semibold":""}`,children:m}),p.length>1?jsxRuntime.jsxRuntimeExports.jsx(reactIcons.TriangleDownIcon,{}):null]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipPortal,{children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{className:"bg-background",children:jsxRuntime.jsxRuntimeExports.jsx(UnitSelection,{units:p,current:m,onSelect:j=>{a(!1),h(j),I(j)}})})})]})]}),["none","auto"].indexOf(m)!==-1||x?null:jsxRuntime.jsxRuntimeExports.jsx(DragStyleButton,{onDragStart:()=>E(!0),onDragEnd:j=>{if(v(()=>""),E(!1),lodashEs.isEmpty(j))return;const k=`${j}`,T=`${k.startsWith("-")?"-":""}${u}[${k.replace("-","")}${m==="-"?"":m}]`;S(T)},onDrag:j=>{if(lodashEs.isEmpty(j))return;v(j);const k=`${j}`,T=`${k.startsWith("-")?"-":""}${u}[${k.replace("-","")}${m==="-"?"":m}]`;w(T)},currentValue:o,unit:m,negative:f,cssProperty:d})]})})})},useCurrentClassByProperty=r=>{const n=useSelectedBlockCurrentClasses();return lodashEs.findLast(n,{property:r})},canChangeClass=(r,n)=>{const a={xs:0,sm:1,md:2,lg:3,xl:4,"2xl":5};return a[lodashEs.get(r,"mq","xs")]<=a[n]},CLASS_PREFIXES={width:"w-",height:"h-",minWidth:"min-w-",minHeight:"min-h-",maxWidth:"max-w-",maxHeight:"max-h-",zIndex:"z-",gap:"gap-",gapX:"gap-x-",gapY:"gap-y-",margin:"m-",marginX:"mx-",marginY:"my-",marginTop:"mt-",marginBottom:"mb-",marginLeft:"ml-",marginRight:"mr-",padding:"p-",paddingX:"px-",paddingY:"py-",paddingTop:"pt-",paddingBottom:"pb-",paddingLeft:"pl-",paddingRight:"pr-",spaceX:"space-x-",spaceY:"space-y-",border:"border-",borderTop:"border-t-",borderBottom:"border-b-",borderLeft:"border-l-",borderRight:"border-r-",borderX:"border-x-",borderY:"border-y-",borderRadius:"rounded-",borderRadiusTop:"rounded-t-",borderRadiusRight:"rounded-r-",borderRadiusBottom:"rounded-b-",borderRadiusLeft:"rounded-l-",borderRadiusTopLeft:"rounded-tl-",borderRadiusTopRight:"rounded-tr-",borderRadiusBottomRight:"rounded-br-",borderRadiusBottomLeft:"rounded-bl-",fontSize:"text-",lineHeight:"leading-",letterSpacing:"tracking-",textIndent:"indent-",rotate:"rotate-",duration:"duration-",transitionDelay:"delay-",scale:"scale-",scaleX:"scale-x-",scaleY:"scale-y-",translateX:"translate-x-",translateY:"translate-y-",skewX:"skew-x-",skewY:"skew-y-",top:"top-",bottom:"bottom-",left:"left-",right:"right-",inset:"inset-",insetX:"inset-x-",insetY:"inset-y-",opacity:"opacity-",flexBasis:"basis-"},BREAKPOINTS={xs:"",sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},getBreakpoint=r=>`${r.toUpperCase()} ${BREAKPOINTS[r]?`(${BREAKPOINTS[r]} & up)`:""}`,BlockStyle=r=>{const{t:n}=reactI18next.useTranslation(),{type:a="icons",label:o,property:i,onEmitChange:l=()=>{},units:c,negative:u=!1}=r,[d]=useDarkMode(),[p]=useStylingState(),[,f]=useCanvasWidth(),m=useCurrentClassByProperty(i),h=useAddClassesToBlocks(),g=useRemoveClassesFromBlocks(),[y]=useSelectedBlockIds(),b=React.useMemo(()=>lodashEs.get(m,"fullCls",""),[m]),v=React.useCallback((w,C=!0)=>{const I={dark:d,mq:f,mod:p,cls:w,property:i,fullCls:""};(d||p!=="")&&(I.mq="xs");const j=generateFullClsName(I);h(y,[j],C)},[y,d,f,p,i,h]),x=React.useCallback(()=>{g(y,[b])},[y,b,g]),E=React.useMemo(()=>canChangeClass(m,f),[m,f]);React.useEffect(()=>{l(E,m)},[E,l,m]);const[,,R]=useCanvasWidth(),A=React.useCallback(w=>{R({xs:400,sm:640,md:800,lg:1024,xl:1420,"2xl":1920}[w])},[R]),S=lodashEs.get(m,"dark",null)===d&&lodashEs.get(m,"mod",null)===p&&lodashEs.get(m,"mq",null)===f;return jsxRuntime.jsxRuntimeExports.jsx(BlockStyleProvider,{canChange:E,canReset:m&&S,children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"group flex flex-row items-center py-2 first:pt-0 last:pb-0",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"relative w-[70px] truncate text-xs text-foreground",children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:`text-[11px] ${m&&!S?"text-foreground":""}`,children:n(o)})}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-row items-center",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"w-[150px]",children:[a==="arbitrary"?jsxRuntime.jsxRuntimeExports.jsx(AdvanceChoices,{currentClass:lodashEs.get(m,"cls",""),classPrefix:lodashEs.get(CLASS_PREFIXES,i,""),units:c||[],onChange:v,negative:u,cssProperty:i}):null,a==="icons"&&jsxRuntime.jsxRuntimeExports.jsx(IconChoices,{property:i,onChange:v}),a==="range"&&jsxRuntime.jsxRuntimeExports.jsx(RangeChoices,{property:i,onChange:v}),a==="color"&&jsxRuntime.jsxRuntimeExports.jsx(ColorChoice,{property:i,onChange:v}),a==="dropdown"&&jsxRuntime.jsxRuntimeExports.jsx(DropDownChoices,{label:o,property:i,onChange:v})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:`w-[30px] cursor-pointer ${b?"visible":"invisible"}`,children:S?jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",onClick:()=>x(),title:"Reset",className:"flex px-1.5 text-xs",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CrossCircledIcon,{className:"h-5 w-5 text-blue-500 hover:opacity-80"})}):E&&m?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{delayDuration:100,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{type:"button",className:"invisible ml-3 mt-1 rounded-full bg-blue-500 text-white group-hover:visible",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.InfoCircledIcon,{})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"text-right",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{children:["Current style is set at  ",jsxRuntime.jsxRuntimeExports.jsxs("span",{className:"font-bold",children:[getBreakpoint(lodashEs.get(m,"mq")),d&&!m.dark?"(Light mode)":""]}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsxs("button",{type:"button",onClick:()=>A(lodashEs.get(m,"mq")),className:"block w-full cursor-default text-right font-semibold text-blue-500",children:["Switch to ",lodashEs.get(m,"mq").toUpperCase()]})]})})})]}):null})]})]})})},basicUnits=["px","%","em","rem","ch","vh","vw"],MultipleChoices=({label:r,options:n,borderB:a=!1,borderT:o=!1,type:i="arbitrary",units:l=basicUnits,negative:c=!1})=>{const{t:u}=reactI18next.useTranslation(),[d,p]=React.useState(n[0].key),f=useSelectedBlockCurrentClasses(),m=React.useCallback(h=>lodashEs.map(f,"property").includes(h),[f]);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:`mb-2 border-gray-800 py-2 first:pt-0 last:pb-0 ${a?"border-b":""} ${o?"border-t":""}`,children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-row text-xs",children:[r&&jsxRuntime.jsxRuntimeExports.jsx("span",{className:"relative w-[70px] flex-none text-xs text-foreground",children:u(r)}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mb-3 flex grow flex-row flex-wrap gap-x-px",children:React.Children.toArray(n.map(({label:h,key:g})=>jsxRuntime.jsxRuntimeExports.jsx("div",{className:"first:rounded-l last:rounded-r",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("button",{type:"button",onClick:()=>p(g),className:`relative cursor-pointer rounded-full p-1 text-[8px] ${g===d?" bg-[#3E57F0] text-white":"text-gray-600 dark:text-gray-300"}`,children:[React.createElement("div",{className:m(g)?"-bottom-1.5 absolute bg-[#3E57F0] h-[2px] left-0 w-full":""}),React.createElement(lodashEs.get(EDITOR_ICONS,g,reactIcons.BoxIcon),{className:"text-inherit w-3 h-3"})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:lodashEs.startCase(lodashEs.toLower(h))})]})})))})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-0 flex items-center",children:jsxRuntime.jsxRuntimeExports.jsx(BlockStyle,{type:i,units:[...l],label:"",property:d,negative:c})})]})},NestedOptions=({heading:r,items:n})=>{const{t:a}=reactI18next.useTranslation(),o=useSelectedBlockCurrentClasses(),i=React.useMemo(()=>{const l=d=>lodashEs.flatten(d.map(p=>p.styleType==="multiple"?lodashEs.map(p.options,"key"):p.property)),c=lodashEs.flatten(n.map(d=>d.styleType==="accordion"?l(d.items):d.styleType==="multiple"?lodashEs.map(d.options,"key"):d.property)),u=lodashEs.map(o,"property");return lodashEs.intersection(c,u).length>0},[o,n]);return jsxRuntime.jsxRuntimeExports.jsxs("details",{children:[jsxRuntime.jsxRuntimeExports.jsx("summary",{className:"my-px cursor-default rounded-md bg-gray-50 p-px px-2 text-[11px] text-foreground",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"inline",children:[a(r.toLowerCase()),i?jsxRuntime.jsxRuntimeExports.jsx("span",{className:`ml-1 mr-2 inline-block h-[8px] w-[8px] rounded-full ${i?"bg-blue-500":"bg-gray-300"}`}):null]})}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"p-2",children:n.map(l=>l.styleType==="multiple"?jsxRuntime.jsxRuntimeExports.jsx(MultipleChoices,{...l},l.label):jsxRuntime.jsxRuntimeExports.jsx(BlockStyle,{...l},l.label))})]})},SectionContext=React.createContext({}),StylingGroup=({section:r})=>{const{t:n}=reactI18next.useTranslation(),a=useSelectedBlockCurrentClasses(),o=React.useCallback((l=[])=>{const c={};for(let d=0;d<a.length;d++)c[a[d].property]=a[d].cls;let u=!0;for(const d in l)if(!lodashEs.has(c,d)||c[d]!==l[d]){u=!1;break}return u},[a]),i=React.useMemo(()=>({}),[]);return jsxRuntime.jsxRuntimeExports.jsx(SectionContext.Provider,{value:i,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:r.heading,className:"border-none",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{className:"border-b border-gray-300 py-2 text-xs hover:no-underline",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center gap-x-2 text-sm font-bold",children:n(r.heading)})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionContent,{className:"py-2",children:React.Children.toArray(r.items.map(l=>lodashEs.has(l,"component")?React.createElement(l.component,{key:l.label}):lodashEs.has(l,"styleType")?l.styleType==="multiple"?jsxRuntime.jsxRuntimeExports.jsx(MultipleChoices,{...l},l.label):l.styleType==="accordion"&&o(l==null?void 0:l.conditions)?jsxRuntime.jsxRuntimeExports.jsx(NestedOptions,{...l},l.label):null:jsxRuntime.jsxRuntimeExports.jsx(BlockStyle,{...l},l.label)))})]})})},StylingHelpers=()=>{const r=useSelectedBlock(),[n]=useSelectedStylingBlocks(),{t:a}=reactI18next.useTranslation(),o=runtime.useGlobalStylingPresets(),i=useAddClassesToBlocks(),l=runtime.getBlockComponent(r._type),c=lodashEs.get(lodashEs.first(n),"prop"),u=lodashEs.get(l.props,`${c}.presets`,{});if(lodashEs.isEmpty(o)&&(!lodashEs.has(l,"props")||lodashEs.isEmpty(u)))return null;const d=p=>{const f=p.trim().toLowerCase().replace(/ +(?= )/g,"").split(" ");i([r._id],f,!0)};return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-10",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenu,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"px-4",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{variant:"default",className:"w-full",size:"sm",children:[a("Apply Presets"),jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CaretDownIcon,{})]})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuContent,{className:"max-h-80 w-56",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ScrollArea,{className:"no-scrollbar h-full",children:[lodashEs.isEmpty(u)?null:jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuLabel,{children:[l.type," ",a("presets")]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuSeparator,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuGroup,{children:lodashEs.keys(u).map(p=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuItem,{className:"group text-xs",onClick:()=>d(u[p]),children:[lodashEs.capitalize(lodashEs.startCase(a(p))),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuShortcut,{className:"invisible hover:font-bold hover:text-blue-600 group-hover:visible",children:a("apply")})]}))})]}),lodashEs.isEmpty(o)?null:jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuLabel,{children:a("Global presets")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuSeparator,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuGroup,{children:lodashEs.keys(o).map(p=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuItem,{className:"group text-xs",onClick:()=>d(o[p]),children:[lodashEs.capitalize(lodashEs.startCase(a(p))),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuShortcut,{className:"invisible hover:font-bold hover:text-blue-600 group-hover:visible",children:a("apply")})]}))})]})]})})]})})},MAPPER={px:1,"%":1,em:100,rem:100,ch:1,vw:1,vh:1,"-":1,deg:1,ms:.1};function BlockStyling(){const{flexChild:r,gridChild:n}=useSelectedBlocksDisplayChild(),[a]=useSelectedStylingBlocks(),[o,i]=React.useState(""),[l,c]=React.useState({onDrag:p=>p,onDragEnd:p=>p,dragStartY:0,dragging:!1,dragStartValue:0,dragUnit:"",negative:!1,cssProperty:""}),u=web.useThrottledCallback(p=>{const f=!lodashEs.get(l,"negative",!1),m=lodashEs.get(l,"cssProperty","");let h=parseFloat(l.dragStartValue);h=isNaN(h)?0:h;let g=MAPPER[l.dragUnit];(lodashEs.startsWith(m,"scale")||m==="opacity")&&(g=10);let b=(l.dragStartY-p.pageY)/g+h;f&&b<0&&(b=0),m==="opacity"&&b>1&&(b=1),l.onDrag(`${b}`),i(`${b}`)},[l],50),d=React.useCallback(()=>{setTimeout(()=>l.onDragEnd(`${o}`),100),c({onDrag:p=>p,onDragEnd:p=>p,dragStartY:0,dragging:!1,dragStartValue:0,dragUnit:"",negative:!1,cssProperty:""})},[l,o,c]);return lodashEs.isEmpty(a)?null:jsxRuntime.jsxRuntimeExports.jsxs(BlockSettingsContext.Provider,{value:{setDragData:c},children:[l.dragging?jsxRuntime.jsxRuntimeExports.jsx("div",{onMouseMove:u,onMouseUp:()=>d(),className:"absolute inset-0 z-30 cursor-row-resize bg-gray-300/10"}):null,jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx(StylingHelpers,{}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Accordion,{defaultValue:["Styles"],type:"multiple",className:"w-full",children:[r&&jsxRuntime.jsxRuntimeExports.jsx(StylingGroup,{section:FLEX_CHILD_SECTION}),n?jsxRuntime.jsxRuntimeExports.jsx(StylingGroup,{section:GRID_CHILD_SECTION}):null,SETTINGS_SECTIONS.map(p=>jsxRuntime.jsxRuntimeExports.jsx(StylingGroup,{section:p},p.heading))]})]})]})}const ChaiSelect=({defaultValue:r="",onValueChange:n,options:a,placeholder:o="Select",className:i=""})=>{const[l,c]=React.useState(r),u=d=>{const p=d.target.value;c(p),n(p)};return jsxRuntime.jsxRuntimeExports.jsx("div",{className:iconBase.cn("relative inline-block w-full",i),children:jsxRuntime.jsxRuntimeExports.jsxs("select",{className:"focus:shadow-outline w-full appearance-none rounded border border-gray-300 bg-white px-4 py-1 pr-8 text-sm leading-tight shadow hover:border-gray-400 focus:outline-none",value:l,onChange:u,children:[jsxRuntime.jsxRuntimeExports.jsx("option",{value:"",disabled:!0,children:o}),a.map(d=>jsxRuntime.jsxRuntimeExports.jsx("option",{value:d.value,children:d.label},d.value))]})})},ChaiSelect$1=ChaiSelect;function UILibrariesSelect({uiLibraries:r,library:n,setLibrary:a}){const{t:o}=reactI18next.useTranslation();return n?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"h-12",children:[jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs font-bold text-gray-500",children:o("choose_library")}),jsxRuntime.jsxRuntimeExports.jsx(ChaiSelect$1,{className:"mt-1",options:r.map(i=>({value:i.uuid,label:i.name})),defaultValue:n,onValueChange:i=>a(i)})]}):null}const BlockCard=({block:r,library:n,parentId:a=void 0})=>{const[o,i]=React.useState(!1),l=useBuilderProp("getUILibraryBlock",lodashEs.noop),{addCoreBlock:c,addPredefinedBlock:u}=useAddBlock(),[,d]=useSelectedBlockIds(),[,p]=useHighlightBlockId(),f=lodashEs.get(r,"name",lodashEs.get(r,"label")),m=flagged.useFeature("dnd"),[,h]=jotai.useAtom(draggedBlockAtom),g=v=>{const x=lodashEs.has(v,"styles_attrs.data-page-section");return v._type==="Box"&&x},y=React.useCallback(async v=>{if(v.stopPropagation(),lodashEs.has(r,"component")){c(r,a),emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK});return}i(!0);const x=await l(n,r);lodashEs.isEmpty(x)||u(runtime.syncBlocksWithDefaults(x),a),emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK})},[r]),b=async v=>{const x=await l(n,r);let E=a;if(g(lodashEs.first(x))&&(E=null),!lodashEs.isEmpty(x)){const R={blocks:x,uiLibrary:!0,parent:E};if(v.dataTransfer.setData("text/plain",JSON.stringify(R)),r.preview){const A=new Image;A.src=r.preview,A.onload=()=>{v.dataTransfer.setDragImage(A,0,0)}}else v.dataTransfer.setDragImage(new Image,0,0);h(R),setTimeout(()=>{d([]),p(null),emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK})},200)}};return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("div",{onClick:o?()=>{}:y,draggable:m?"true":"false",onDragStart:b,className:clsx("relative mt-2 cursor-pointer overflow-hidden rounded-md border border-gray-300 bg-white duration-200 hover:border-blue-500 hover:shadow-xl"),children:[o&&jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"absolute flex h-full w-full items-center justify-center bg-black/70",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"animate-spin",size:15,color:"white"}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"pl-2 text-sm text-white",children:"Adding..."})]}),r.preview?jsxRuntime.jsxRuntimeExports.jsx("img",{src:r.preview,className:"min-h-[45px] w-full rounded-md",alt:f}):jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex h-20 items-center justify-center rounded-md border border-border border-gray-300 bg-gray-200",children:jsxRuntime.jsxRuntimeExports.jsx("p",{className:"max-w-xs text-center text-sm text-gray-700",children:f})})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:f})})]})},libraryBlocksAtom=jotai.atom({}),useLibraryBlocks=r=>{const[n,a]=jotai.useAtom(libraryBlocksAtom),o=useBuilderProp("getUILibraryBlocks",lodashEs.noop),i=lodashEs.get(n,`${r==null?void 0:r.uuid}.blocks`,null),l=lodashEs.get(n,`${r==null?void 0:r.uuid}.loading`,"idle"),c=React.useRef("idle");return React.useEffect(()=>{(async()=>{if(l==="complete"||c.current==="loading")return;c.current="loading",a(d=>({...d,[r==null?void 0:r.uuid]:{loading:"loading",blocks:[]}}));const u=await o(r);c.current="idle",a(d=>({...d,[r==null?void 0:r.uuid]:{loading:"complete",blocks:u||[]}}))})()},[r,i,l,c]),{data:i||[],isLoading:l==="loading"}},UILibrarySection=({parentId:r})=>{const[n,a]=jotai.useAtom(selectedLibraryAtom),o=useBuilderProp("uiLibraries",[]),i=runtime.useChaiBlocks(),l=lodashEs.values(i).filter(E=>E.category==="custom"),c=o.find(E=>E.uuid===n)||lodashEs.first(o),{data:u,isLoading:d}=useLibraryBlocks(c),p=lodashEs.groupBy([...u,...l],"group"),[f,m]=React.useState("Hero"),h=lodashEs.get(p,f,[]),g=React.useRef(null),{t:y}=reactI18next.useTranslation(),b=E=>{g.current&&(clearTimeout(g.current),g.current=null),g.current=setTimeout(()=>{g.current&&m(E)},300)};if(d)return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-4 grid h-full w-full grid-cols-12 gap-2",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"col-span-3 h-full"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"col-span-9 h-full"})]});const v=lodashEs.filter(h,(E,R)=>R%2===0),x=lodashEs.filter(h,(E,R)=>R%2===1);return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"relative mt-2 flex h-full max-h-full overflow-hidden bg-background",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full pt-2",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full max-h-full w-60 flex-col gap-1 px-1 pr-2",children:[jsxRuntime.jsxRuntimeExports.jsx(UILibrariesSelect,{library:c==null?void 0:c.uuid,setLibrary:a,uiLibraries:o}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2 flex h-full max-h-full w-full flex-1 flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:"text-xs font-bold text-gray-500",children:y("groups")}),jsxRuntime.jsxRuntimeExports.jsx("hr",{className:"mt-1"}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar mt-2 h-full max-h-full flex-1 overflow-y-auto pb-20",children:React.Children.toArray(lodashEs.map(p,(E,R)=>jsxRuntime.jsxRuntimeExports.jsxs("div",{onMouseEnter:()=>b(R),onMouseLeave:()=>clearTimeout(g.current),onClick:()=>m(R),className:iconBase.cn("flex w-full cursor-pointer items-center justify-between rounded-md p-2 text-sm transition-all ease-in-out hover:bg-gray-200",R===f?"bg-blue-500 text-white hover:bg-blue-600":""),children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:lodashEs.capitalize(y(R.toLowerCase()))}),jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CaretRightIcon,{className:"ml-2 h-5 w-5"})]},R)))})]})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.ScrollArea,{onMouseEnter:()=>g.current?clearTimeout(g.current):null,className:"z-10 -mt-2 flex h-full max-h-full w-full flex-col gap-2 border-l border-border transition-all ease-linear",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"grid grid-cols-2 gap-2 px-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col gap-1",children:React.Children.toArray(v.map(E=>jsxRuntime.jsxRuntimeExports.jsx(BlockCard,{parentId:r,block:E,library:c})))}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col gap-1",children:React.Children.toArray(x.map(E=>jsxRuntime.jsxRuntimeExports.jsx(BlockCard,{parentId:r,block:E,library:c})))})]}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{})]})]})})})},UILibrariesPanel=({parentId:r})=>jsxRuntime.jsxRuntimeExports.jsx(UILibrarySection,{parentId:r}),UILibraries=UILibrariesPanel,add_block="Add block",enter_paste_tailwind_html="(Enter or paste TailwindCSS HTML snippet)",click_to_add_block="(Click to add block to page)",core="Core",custom_blocks="Custom Blocks",ui_library="UI Library",html_snippet_description="Use HTML snippets from Tailwind CSS component libraries etc. or just copy paste your own HTML code.",tailwind_html_snippet="Tailwind HTML snippet:",enter_code_snippet="Enter your code snippet here...",import_html="Import HTML",note_imported_html="NOTE: Imported html will be added to the currently selected block. If no block is selected, the html will be added to the page.",dark_mode="Dark mode",tree_view_no_blocks="This page has no blocks. Add a block by clicking the + button",canvas_empty="This page is empty",no_block_selected_for_styling="Please select a block to edit settings or styles",no_block_selected_for_ask_ai="Please select a block to ask AI",no_styling_block_selected="Please select a styling block",drop_here_message="Drop your block here",use_setting="Use setting",mobile_xs_title="Mobile (XS)",mobile_xs_content="Styles set here are applied to all screen unless edited at higher breakpoint",mobile_sm_title="Mobile landscape (SM)",mobile_sm_content="Styles set here are applied at 640px and up unless edited at higher breakpoint",tablet_md_title="Tablet (MD)",tablet_md_content="Styles set here are applied at 768px and up",tablet_lg_title="Tablet Landscape (LG)",tablet_lg_content="Styles set here are applied at 1024px and up unless edited at higher breakpoint",desktop_xl_title="Desktop (XL)",desktop_xl_content="Styles set here are applied at 1280px and up unless edited at higher breakpoint",large_desktop_2xl_title="Large Desktop (2XL)",large_desktop_2xl_content="Styles set here are applied at 1536px and up",Breakpoints$1="Breakpoints",clear="Clear",clear_canvas_title="Clear whole canvas?",clear_canvas_description="Are you sure you want to clear the whole canvas?",cancel="Cancel",yes="Yes",preview="Preview",settings="Settings",styling="Styling",data_provider="Data Provider",remove_provider_confirmation="Are you sure you want to remove <span class='text-blue-500'>{name}</span> provider?",remove_provider_warning="Your data provider will be removed from this page and all added data binding will be not visible on blocks.",remove="Remove",no_data_providers="You have no data providers registered. Please add a data provider to your project.",learn_more="Learn more",add_data_providers="Add data providers:",select_provider="Select a provider",choose="Choose",page_data_providers="Page data providers:",view_data="View Data",mark_as_global="Mark as Global",global_block_note="Note: Global blocks are single instances. Editing global blocks will be reflected on all pages using these blocks.",global_block_indicator="Global blocks are indicated with",global_block_category="Global blocks are available under 'Global' category",enter_global_block_name="Enter global block name",eg_header_footer="Eg: Header, Footer",blocks_selected="{{length}} blocks selected.",cut="Cut",copy$1="Copy",clear_selection="Clear Selection",dev_mode_message="This is dev mode. Visit",to_see_page_preview="to see page preview",theme_config={heading_font:"Heading Font",body_font:"Body Font",rounded_corner:"Rounded Corners",primary:"Primary",secondary:"Secondary",background:"Background",text_color:"Text Color",background_dark_mode:"Background (Dark Mode)",text_color_dark_mode:"Text Color (Dark Mode)"},web_blocks={box:"box",tag:"Tag",div:"div",level:"Level",header:"header",footer:"footer",section:"section",article:"article",aside:"aside",main:"main",nav:"navigation",figure:"figure",details:"details",summary:"summary",dialog:"dialog",strike:"strike",caption:"caption",legend:"legend",figcaption:"figure caption",mark:"mark",background_image:"Background Image",label:"Label",default:"default",icon_size:"Icon Size",icon_position:"Icon Position",start:"Start",end:"End",button:"Button",custom_html:"Custom HTML",html_code:"HTML Code",default_snippet:"The HTML snippet goes here...",placeholder:"Enter custom HTML code here",custom_script:"Custom Script",dark_mode:"Dark Mode",divider:"Divider",empty_box:"Empty Box",heading:"Heading",image:"Image",alt:"Alt",width:"Width",height:"Height",video:"Video",span:"Span",content:"Content",icon:"Icon",richtext:"Rich Text",list:"List",list_type:"List Type",listitem:"List Item",link:"Link",list_item:"List Item",none:"None",disc:"Disc",number:"Number",paragraph:"Paragraph",lightbox_link:"Lightbox Link",href:"Link",type:"Type",iframe:"iframe",inline:"inline",ajax:"ajax",autoplay:"Video autoplay",max_width:"Max Width",backdrop_color:"Background Color",gallery_name:"Gallery Name",slot:"Slot",empty_slot:"Empty Slot",text:"Text",video_url:"Video URL",controls:"Show Controls",loop:"Loop",muted:"Muted",checkbox:"Checkbox",required:"Required",checked:"Checked",submit_button:"Submit Button",form:"Form",submit_url:"Submit URL",error_message:"Error Message",success_message:"Success Message",input:"Input",value:"Value",show_label:"Show Label",field_name:"Field Name",radio:"Radio",multiple:"Multiple",options:"Options",select:"Select",multiple_choice:"Multiple Choice",textarea:"Textarea",rows:"Rows"},ai_assistant="AI Assistant",close_preview="Close Preview",saved="Saved",unsaved="Unsaved",saving="Saving...",page_is_empty="This page is empty.",Theme="Theme",Outline="Outline",clipboard_not_supported="Not supported",please_use_chrome_firefox_or_safari="Please use Chrome, Firefox or Safari",classes_copied_to_clipboard="Classes copied to clipboard",download_complete="Download complete",copied="Copied",enter_classes_separated_by_space="Enter classes separated by space",copy_classes_to_clipboard="Copy classes to clipboard",classes="Classes",ask_ai="Ask AI",edit_with_ai="Edit with AI",generating_please_wait="Generating... Please wait",stop$1="Stop",eg_this_page_is_about_an_ai_assistant_app_called_chai_studio_it_allows_users_to_create_beautiful_webpages_and_edit_content_with_ai="E.g.: This page is about an AI assistant app called Chai Studio. It allows users to create beautiful webpages and edit content with AI.",ask_ai_to_edit_styles="Ask AI to edit styles",ask_ai_to_edit_content="Ask AI to edit content",ai_context="AI Context",please_select_a_block_to_ask_ai="Select a block to edit with AI",please_select_a_block_to_edit="Please select a block to edit",edit="Edit",tell_about_this_page_eg_this_page_is_about="Describe this page. E.g.: This page is about...",tag="Tag",value="Value",background_image="Background Image",enter_image_url="Enter image URL",replace_image="Replace image",choose_image="Choose image",images="Images",typography="Typography",background="Background",library="Library",blocks="Blocks",basic="Basic",media="Media",advanced="Advanced",form="Form",choose_icon_or_enter_svg="Choose an icon or enter SVG",groups="Groups",ui_libraries="UI Libraries",accordions="Accordions",buttons="Buttons",layouts="Layouts",choose_library="Choose library",no_library_found="No library found.",faq="FAQ",hero="Hero",features="Features",footer="Footer",navbar="Navbar",icons="Icons",testimonials="Testimonials",blog="Blog",ai_quick_prompts={improve_writing:"Improve writing",replace_placeholder_content:"Replace placeholder content",fix_grammar:"Fix grammar",make_longer:"Make longer",make_shorter:"Make shorter",add_emojis:"Add emojis",randomize:"Randomize"},sidebar={outline:"Outline",edit_block:"Edit Block",ai_assistant:"AI Assistant",theme:"Theme"},remove_context="Remove context",yes_delete="Yes, Delete",ai_context_updated="AI Context Updated",you_can_now_ask_ai_to_edit_your_content="You can now ask AI to edit your content.",lngEn={add_block,enter_paste_tailwind_html,click_to_add_block,core,custom_blocks,ui_library,import:"Import",html_snippet_description,tailwind_html_snippet,enter_code_snippet,import_html,note_imported_html,dark_mode,tree_view_no_blocks,canvas_empty,no_block_selected_for_styling,no_block_selected_for_ask_ai,no_styling_block_selected,drop_here_message,use_setting,mobile_xs_title,mobile_xs_content,mobile_sm_title,mobile_sm_content,tablet_md_title,tablet_md_content,tablet_lg_title,tablet_lg_content,desktop_xl_title,desktop_xl_content,large_desktop_2xl_title,large_desktop_2xl_content,Breakpoints:Breakpoints$1,clear,clear_canvas_title,clear_canvas_description,cancel,yes,preview,settings,styling,data_provider,remove_provider_confirmation,remove_provider_warning,remove,no_data_providers,learn_more,add_data_providers,select_provider,choose,page_data_providers,view_data,mark_as_global,global_block_note,global_block_indicator,global_block_category,enter_global_block_name,eg_header_footer,blocks_selected,cut,copy:copy$1,delete:"Delete",clear_selection,dev_mode_message,to_see_page_preview,"flex.heading":"Flex Child","flex.basis":"Basis","flex.order":"Order","flex.flex":"Flex","flex.grow":"Grow","flex.shrink":"Shrink","grid.heading":"Grid Child","grid.col_span":"Col Span","grid.col_start":"Col Start","grid.col_end":"Col End","grid.row_span":"Row Span","grid.row_start":"Row Start","grid.row_end":"Row End","grid.order":"Order","layout.heading":"Layout","layout.width":"Width","layout.height":"Height","layout.margin":"Margin","layout.margin_all":"All","layout.margin_lr":"Left-Right","layout.margin_tb":"Top-Bottom","layout.margin_top":"Top","layout.margin_right":"Right","layout.margin_bottom":"Bottom","layout.margin_left":"Left","layout.padding":"Padding","layout.padding_all":"All","layout.padding_lr":"Left-Right","layout.padding_tb":"Top-Bottom","layout.padding_top":"Top","layout.padding_right":"Right","layout.padding_bottom":"Bottom","layout.padding_left":"Left","layout.space_bt":"Space Bt.","layout.space_lr":"Left-Right","layout.space_tb":"Top-Bottom","size.heading":"Size","size.min_width_height":"Min width & height","size.min_width":"Min Width","size.min_height":"Min Height","size.max_width_height":"Max width & height","size.max_width":"Max Width","size.max_height":"Max Height","size.object_options_aspect_ratio":"Object options & aspect ratio","size.aspect":"Aspect","size.fit":"Fit","size.position":"Position","display.heading":"Display","display.display":"Display","display.flex_options":"Flex options","display.flex_direction":"Direction","display.flex_wrap":"Wrap","display.justify_content":"Justify","display.align_content":"Content","display.align_items":"Items","display.gap":"Gap","display.gap_all":"All","display.gap_lr":"Left-Right","display.gap_tb":"Top-Bottom","display.grid_options":"Grid options","display.grid_columns":"Columns","display.grid_rows":"Rows","display.grid_auto_flow":"Auto Flow","display.grid_auto_cols":"Auto Cols","display.grid_auto_rows":"Auto Rows","display.visibility_opacity":"Visibility & Opacity","display.visibility":"Visibility","display.opacity":"Opacity","position.heading":"Position","position.position":"Position","position.options":"Position options","position.direction":"Direction","position.top":"Top","position.right":"Right","position.bottom":"Bottom","position.left":"Left","position.inset":"Inset","position.all":"All","position.lr":"Left Right","position.tb":"Top Bottom","position.z_index":"Z-Index","position.float_clear":"Float & Clear","position.float":"Float","position.clear":"Clear","position.overflow_overscroll":"Overflow & Overscroll","position.overflow":"Overflow","position.overscroll":"Overscroll","typography.heading":"Typography","typography.font":"Font","typography.size":"Size","typography.height":"Height","typography.weight":"Weight","typography.color":"Color","typography.alignments":"Alignments","typography.align":"Align","typography.valign":"V. Align","typography.spacing_decoration_more":"Spacing, decoration & more","typography.spacing":"Spacing","typography.decoration":"Decoration","typography.thickness":"Thickness","typography.transform":"Transform","typography.whitespace_breaks":"White space & breaks","typography.whitespace":"Whitespace","typography.wordbreak":"Wordbreak","background.heading":"Background","background.bgcolor":"Bg. Color","background.position_size_more":"Position, Size & more","background.attachment":"Attachment","background.clipping":"Clipping","background.origin":"Origin","background.position":"Position","background.repeat":"Repeat","background.size":"Size","background.gradient":"Gradient","background.gradient_colors":"Gradient colors","background.from_color":"From","background.via_color":"Via","background.to_color":"To","border.heading":"Border & Outline","border.width":"Width","border.all":"All","border.lr":"Left Right","border.tb":"Top bottom","border.top":"Top","border.right":"Right","border.bottom":"Bottom","border.left":"Left","border.corners":"Corners","border.top_left":"Top Left","border.top_right":"Top right","border.bottom_right":"Bottom right","border.bottom_left":"Bottom left","border.color":"Color","border.style":"Style","border.divide_options":"Divide options","border.divide_color":"Color","border.divide_style":"Style","border.outline_styling":"Outline styling","border.outline_width":"Width","border.outline_offset":"Offset","border.outline_style":"Style","border.ring_options":"Ring options","border.ring_width":"Width","border.ring_color":"Color","border.ring_offset_width":"Offset","border.ring_offset_color":"Off. color","effect.heading":"Effect & Animation","effect.shadow":"Shadow","effect.color":"Color","effect.cursor":"Cursor","effect.blend_cursor":"Blend & Cursor","effect.mix_blend":"Mix Blend","effect.bg_blend":"Bg. Blend","effect.transform":"Transform","effect.origin":"Origin","effect.scale":"Scale","effect.all":"All","effect.lr":"Left-Right","effect.tb":"Top-Bottom","effect.skew":"Skew","effect.translate":"Translate","effect.rotate":"Rotate","effect.animation":"Animation","effect.transition":"Transition","effect.easing":"Easing","effect.duration":"Duration","effect.delay":"Delay","classes.heading":"Classes",theme_config,web_blocks,ai_assistant,close_preview,saved,unsaved,saving,page_is_empty,Theme,Outline,clipboard_not_supported,please_use_chrome_firefox_or_safari,classes_copied_to_clipboard,download_complete,copied,enter_classes_separated_by_space,copy_classes_to_clipboard,classes,ask_ai,edit_with_ai,generating_please_wait,stop:stop$1,eg_this_page_is_about_an_ai_assistant_app_called_chai_studio_it_allows_users_to_create_beautiful_webpages_and_edit_content_with_ai,ask_ai_to_edit_styles,ask_ai_to_edit_content,ai_context,please_select_a_block_to_ask_ai,please_select_a_block_to_edit,edit,tell_about_this_page_eg_this_page_is_about,tag,value,background_image,enter_image_url,replace_image,choose_image,images,typography,background,library,blocks,basic,media,advanced,form,choose_icon_or_enter_svg,groups,ui_libraries,accordions,buttons,layouts,choose_library,no_library_found,faq,hero,features,footer,navbar,icons,testimonials,blog,ai_quick_prompts,sidebar,remove_context,yes_delete,ai_context_updated,you_can_now_ask_ai_to_edit_your_content};i18n.use(reactI18next.initReactI18next).init({resources:{en:{translation:lngEn}},lng:"en",fallbackLng:"en",interpolation:{escapeValue:!1}});const CoreBlock=({block:r,disabled:n,parentId:a})=>{const[,o]=jotai.useAtom(draggedBlockAtom),{type:i,icon:l,label:c}=r,{addCoreBlock:u,addPredefinedBlock:d}=useAddBlock(),[,p]=useSelectedBlockIds(),[,f]=useHighlightBlockId(),m=()=>{if(console.log("addBlockToPage",r,a),lodashEs.has(r,"blocks")){const y=lodashEs.isFunction(r.blocks)?r.blocks():r.blocks;d(runtime.syncBlocksWithDefaults(y),a||null)}else u(r,a||null);emitChaiBuilderMsg({name:CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK})},h=flagged.useFeature("dnd"),{t:g}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment,{children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("button",{disabled:n,onClick:m,type:"button",onDragStart:y=>{y.dataTransfer.setData("text/plain",JSON.stringify(lodashEs.omit(r,["component","icon"]))),y.dataTransfer.setDragImage(new Image,0,0),o(lodashEs.omit(r,["component","icon"])),setTimeout(()=>{p([]),f(null)},200)},draggable:h?"true":"false",className:"cursor-pointer space-y-2 rounded-lg border border-border p-3 text-center hover:bg-slate-300/50 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:text-gray-400",children:[React.createElement(l||reactIcons.BoxIcon,{className:"w-4 h-4 mx-auto"}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"truncate text-xs",children:lodashEs.capitalize(g(c||i))})]})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:g(c||i)})})]})})},DefaultChaiBlocks=({parentId:r,gridCols:n="grid-cols-2"})=>{const a=runtime.useChaiBlocks(),o=useBuilderProp("filterChaiBlock",()=>!0),i=lodashEs.filter(a,o),l=lodashEs.groupBy(i,"category"),c=lodashEs.uniq(lodashEs.map(l.core,"group"));return jsxRuntime.jsxRuntimeExports.jsx(ChaiBuilderBlocks,{gridCols:n,parentId:r,groups:c,blocks:l.core})},CORE_GROUPS=["basic","typography","media","layout","form","advanced","other"],ChaiBuilderBlocks=({groups:r,blocks:n,parentId:a,gridCols:o="grid-cols-4"})=>{var u;const{t:i}=reactI18next.useTranslation(),[l]=useBlocksStore(),c=(u=lodashEs.find(l,d=>d._id===a))==null?void 0:u._type;return React.Children.toArray(lodashEs.map(lodashEs.sortBy(r,d=>CORE_GROUPS.indexOf(d)===-1?99:CORE_GROUPS.indexOf(d)),d=>lodashEs.reject(lodashEs.filter(lodashEs.values(n),{group:d}),{hidden:!0}).length?jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Accordion,{type:"single",value:d,collapsible:!0,className:"w-full",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:d,children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{className:"rounded-md bg-gray-100 px-4 py-2 capitalize hover:no-underline",children:lodashEs.capitalize(i(d.toLowerCase()))}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionContent,{className:"mx-auto max-w-xl p-3",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"grid gap-2 "+o,children:React.Children.toArray(lodashEs.reject(lodashEs.filter(lodashEs.values(n),{group:d}),{hidden:!0}).map(p=>jsxRuntime.jsxRuntimeExports.jsx(CoreBlock,{parentId:a,block:p,disabled:!canAcceptChildBlock(c,p.type)||!canBeNestedInside(c,p.type)})))})})]})}):null))},AddBlocksPanel=({className:r,showHeading:n=!0,parentId:a=void 0})=>{const{t:o}=reactI18next.useTranslation(),[i,l]=React.useState("library"),[,c]=jotai.useAtom(showPredefinedBlockCategoryAtom),u=useBuilderProp("importHTMLSupport",!0);return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:iconBase.cn("flex h-full w-full flex-col overflow-hidden",r),children:[n?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mb-2 flex flex-col justify-between rounded-md bg-background/30 p-1",children:[jsxRuntime.jsxRuntimeExports.jsx("h1",{className:"flex flex-col items-baseline px-1 text-xl font-semibold xl:flex-col",children:o("add_block")}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"p-0 text-xs font-light leading-3 opacity-80 xl:pl-1",children:o(i==="html"?"enter_paste_tailwind_html":"click_to_add_block")})]}):null,jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Tabs,{onValueChange:d=>{c(""),l(d)},value:i,className:iconBase.cn("h-max",u?"":"hidden"),children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.TabsList,{className:"grid w-full "+(u?"grid-cols-3":"grid-cols-1"),children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"library",children:o("library")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"core",children:o("blocks")}),u?jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TabsTrigger,{value:"html",children:o("import")}):null]})}),i==="core"&&jsxRuntime.jsxRuntimeExports.jsx(contextMenu.ScrollArea,{className:"-mx-1.5 h-[calc(100vh-156px)] overflow-y-auto",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-2 w-full",children:jsxRuntime.jsxRuntimeExports.jsx(DefaultChaiBlocks,{gridCols:"grid-cols-4",parentId:a})})}),i==="library"&&jsxRuntime.jsxRuntimeExports.jsx(UILibraries,{parentId:a}),i==="html"&&u?jsxRuntime.jsxRuntimeExports.jsx(ImportHTML$1,{parentId:a}):null]})},AddBlocksPanel$1=AddBlocksPanel;function FaCheck(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 448 512"},child:[{tag:"path",attr:{d:"M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"},child:[]}]})(r)}function FaFilePen(r){return iconBase.GenIcon({tag:"svg",attr:{viewBox:"0 0 576 512"},child:[{tag:"path",attr:{d:"M0 64C0 28.7 28.7 0 64 0H224V128c0 17.7 14.3 32 32 32H384V299.6l-94.7 94.7c-8.2 8.2-14 18.5-16.8 29.7l-15 60.1c-2.3 9.4-1.8 19 1.4 27.8H64c-35.3 0-64-28.7-64-64V64zm384 64H256V0L384 128zM549.8 235.7l14.4 14.4c15.6 15.6 15.6 40.9 0 56.6l-29.4 29.4-71-71 29.4-29.4c15.6-15.6 40.9-15.6 56.6 0zM311.9 417L441.1 287.8l71 71L382.9 487.9c-4.1 4.1-9.2 7-14.9 8.4l-60.1 15c-5.5 1.4-11.2-.2-15.2-4.2s-5.6-9.7-4.2-15.2l15-60.1c1.4-5.6 4.3-10.8 8.4-14.9z"},child:[]}]})(r)}const QUICK_PROMPTS=[{name:"ai_quick_prompts.improve_writing",icon:FaFilePen,prompt:"Improving writing in all text elements. Replacing placeholder content with meaningful relevant content."},{name:"ai_quick_prompts.replace_placeholder_content",icon:FaRecycle,prompt:"Discard current placeholder content and replace with meaningful relevant content."},{name:"ai_quick_prompts.fix_grammar",icon:reactIcons.CheckIcon,prompt:"Fix grammar in all text elements. Ensuring the text is grammatically correct and free of errors."},{name:"ai_quick_prompts.make_longer",icon:reactIcons.ArrowUpIcon,prompt:"Make all text elements longer."},{name:"ai_quick_prompts.make_shorter",icon:reactIcons.ArrowDownIcon,prompt:"Make all text elements shorter."},{name:"ai_quick_prompts.add_emojis",icon:lucideReact.SmileIcon,prompt:"Add emojis to text elements if relevant."},{name:"ai_quick_prompts.randomize",icon:lucideReact.ShuffleIcon,prompt:"Randomize all text elements."}];function QuickPrompts({onClick:r}){const{loading:n}=useAskAi(),{t:a}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsx("div",{className:n?"pointer-events-none opacity-50":"",children:jsxRuntime.jsxRuntimeExports.jsx("ul",{className:"space-y-2",children:QUICK_PROMPTS.map(({name:o,icon:i,subMenus:l,prompt:c})=>l?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenu,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs("li",{className:"flex cursor-pointer items-center space-x-2 hover:bg-gray-100",children:[jsxRuntime.jsxRuntimeExports.jsx(i,{className:"h-4 w-4"}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:o})]},o)}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuContent,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuLabel,{children:"My Account"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuSeparator,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuItem,{children:"Profile"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuItem,{children:"Billing"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuItem,{children:"Team"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuItem,{children:"Subscription"})]})]}):jsxRuntime.jsxRuntimeExports.jsxs("li",{onClick:()=>r(c),className:"flex cursor-pointer items-center space-x-2 rounded p-1 pl-2 text-sm hover:bg-gray-100",children:[jsxRuntime.jsxRuntimeExports.jsx(i,{className:"h-4 w-4"}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:a(o)})]},o))})})}const AIUserPrompt=({blockId:r})=>{const{t:n}=reactI18next.useTranslation(),{askAi:a,loading:o,error:i}=useAskAi(),[l,c]=React.useState(""),[u,d]=React.useState(!0),[p,f]=React.useState(),m=React.useRef(null),h=React.useRef(null);React.useEffect(()=>{var y;(y=m.current)==null||y.focus()},[]);const g=y=>{const{usage:b}=y||{};!i&&b&&f(b),h.current=setTimeout(()=>f(void 0),1e4),i||c("")};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{onClick:()=>d(!u),className:"flex cursor-default items-center justify-between border-b border-gray-300 py-2 text-sm font-bold text-gray-600 hover:bg-gray-50",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:n("ask_ai")}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.ChevronDown,{className:"h-4 w-4 text-gray-500 "+(u?"rotate-180":"")})})]}),u&&r?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{ref:m,value:l,onChange:y=>c(y.target.value),placeholder:n("ask_ai_to_edit_content"),className:"w-full border border-gray-400 focus:border-0",rows:3,onKeyDown:y=>{y.key==="Enter"&&(y.preventDefault(),h.current&&clearTimeout(h.current),f(void 0),a("content",r,l,g))}}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"my-2 flex items-center gap-2",children:[o?null:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:l.trim().length<5||o,onClick:()=>{h.current&&clearTimeout(h.current),f(void 0),a("content",r,l,g)},variant:"default",className:"w-fit",size:"sm",children:o?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"h-5 w-5 animate-spin"}),n("generating_please_wait")]}):n("edit_with_ai")}),o?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col gap-2",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Skeleton,{className:"flex w-full items-center space-x-1 px-4 py-1 pl-2",children:[jsxRuntime.jsxRuntimeExports.jsx(FaSpinner,{className:"h-4 w-4 animate-spin text-gray-500"}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs",children:n("generating_please_wait")})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{variant:"destructive",onClick:()=>stop(),className:"hidden w-fit",size:"sm",children:n("Stop")})]}):null]}),p?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"max-w-full",children:jsxRuntime.jsxRuntimeExports.jsxs("p",{className:"mb-1 flex justify-between break-words rounded border border-blue-500 bg-blue-100 p-1 text-xs text-blue-500",children:[jsxRuntime.jsxRuntimeExports.jsxs("span",{children:[n("Total tokens used"),": ",p.totalTokens]}),jsxRuntime.jsxRuntimeExports.jsx(Countdown,{})]})}):null,jsxRuntime.jsxRuntimeExports.jsx("div",{className:"max-w-full",children:i&&jsxRuntime.jsxRuntimeExports.jsx("p",{className:"break-words rounded border border-red-500 bg-red-100 p-1 text-xs text-red-500",children:i.message})}),jsxRuntime.jsxRuntimeExports.jsx(QuickPrompts,{onClick:y=>{h.current&&clearTimeout(h.current),f(void 0),a("content",r,y,g)}})]}):u?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"p-4 text-center",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-4 rounded-xl p-4",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.SparklesIcon,{className:"mx-auto text-3xl"}),jsxRuntime.jsxRuntimeExports.jsx("h1",{children:n("please_select_a_block_to_ask_ai")})]})}):null]})},AISetContext=()=>{const{t:r}=reactI18next.useTranslation(),n=useBuilderProp("aiContext",""),[a,o]=React.useState(n),i=React.useRef(null),l=useBuilderProp("saveAiContextCallback",lodashEs.noop),[c,u]=React.useState(!1),[d,p]=React.useState(null),[,f]=React.useState(!1),{toast:m}=contextMenu.useToast(),h=React.useRef(null);React.useEffect(()=>{n&&o(n)},[n]);const g=async()=>{try{u(!0),p(null),await l(a),m({title:r("ai_context_updated"),description:r("you_can_now_ask_ai_to_edit_your_content"),variant:"default"}),h.current.click()}catch(y){p(y)}finally{u(!1)}};return jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Accordion,{onValueChange:y=>{f(y!=="")},type:"single",collapsible:!0,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionItem,{value:"set-context",className:"border-none",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AccordionTrigger,{ref:h,className:"border-b py-2 text-gray-600 hover:no-underline",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex w-full items-center justify-between",children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"font-bold",children:r("ai_context")})})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AccordionContent,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{ref:i,value:a,onChange:y=>o(y.target.value),placeholder:r("tell_about_this_page_eg_this_page_is_about"),className:"w-full border border-gray-400 bg-background focus:border",rows:10,onKeyDown:y=>{y.key==="Enter"&&(y.preventDefault(),g())}}),n.trim().length===0?jsxRuntime.jsxRuntimeExports.jsx("p",{className:"mt-2 text-xs text-gray-500",children:r("eg_this_page_is_about_an_ai_assistant_app_called_chai_studio_it_allows_users_to_create_beautiful_webpages_and_edit_content_with_ai")}):null,jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2 flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:a.trim().length<5,onClick:()=>g(),variant:"default",className:"w-fit",size:"sm",children:c?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"h-5 w-5 animate-spin"}),r("generating_please_wait")]}):r("save")}),n.trim().length>0?jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialog,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:n.trim().length===0,variant:"ghost",className:"w-fit",size:"sm",children:c?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Loader,{className:"h-5 w-5 animate-spin"}),r("generating_please_wait")]}):r("delete")})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogContent,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogHeader,{children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogTitle,{children:[r("remove_context")," ?"]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogDescription,{})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogFooter,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogCancel,{children:r("cancel")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogAction,{onClick:()=>{o(""),g()},children:r("yes_delete")})]})]})]}):null]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-2 max-w-full",children:d&&jsxRuntime.jsxRuntimeExports.jsx("p",{className:"break-words rounded border border-red-500 bg-red-100 p-1 text-xs text-red-500",children:d.message})})]})]})})},AskAI=()=>{const[r]=useSelectedBlockIds();return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mt-2",children:[jsxRuntime.jsxRuntimeExports.jsx(AISetContext,{}),jsxRuntime.jsxRuntimeExports.jsx(AIUserPrompt,{blockId:lodashEs.first(r)})]})},AttrsEditor=React.memo(function r({preloadedAttributes:n=[],onAttributesChange:a}){const[o,i]=React.useState([]),[l,c]=React.useState(""),[u,d]=React.useState(""),[p,f]=React.useState(null),[m,h]=React.useState(""),g=React.useRef(null),y=React.useRef(null);React.useEffect(()=>{i(n)},[n]);const b=()=>{if(l.startsWith("@")){h("Attribute keys cannot start with '@'");return}if(l){const A=[...o,{key:l,value:u}];a(A),i(o),c(""),d(""),h("")}},v=A=>{const S=o.filter((w,C)=>C!==A);a(S),i(S)},x=A=>{f(A),c(o[A].key),d(o[A].value)},E=()=>{if(l.startsWith("@")){h("Attribute keys cannot start with '@'");return}if(p!==null&&l){const A=[...o];A[p]={key:l,value:u},a(A),i(A),f(null),c(""),d(""),h("")}},R=A=>{A.key==="Enter"&&!A.shiftKey&&(A.preventDefault(),p!==null?E():b())};return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"max-w-full",children:[jsxRuntime.jsxRuntimeExports.jsxs("form",{onSubmit:A=>{A.preventDefault(),p!==null?E():b()},className:"space-y-3",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"w-full",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Label,{htmlFor:"attrKey",className:"text-xs",children:"Key"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Input,{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",id:"attrKey",ref:g,value:l,onChange:A=>c(A.target.value),placeholder:"Key",className:"h-8 text-sm"})]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"w-full",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Label,{htmlFor:"attrValue",className:"text-xs",children:"Value"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Textarea,{autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",id:"attrValue",rows:2,ref:y,value:u,onChange:A=>d(A.target.value),onKeyDown:R,placeholder:"Value",className:"bg-background text-sm"})]})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{type:"submit",variant:"secondary",className:"h-8 w-fit text-sm",children:p!==null?"Save":"Add"}),m&&jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs text-red-500",children:m})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mt-4 space-y-1 overflow-y-auto",children:o.map((A,S)=>jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-between rounded bg-muted p-1.5 text-sm",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mr-2 flex flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{className:"truncate font-semibold",children:A.key}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"text-wrap max-w-[200px] text-muted-foreground",children:A.value.toString()})]}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex-shrink-0",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{variant:"ghost",size:"icon",className:"h-6 w-6",onClick:()=>x(S),children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Edit2,{className:"h-3 w-3"}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"sr-only",children:"Edit attribute"})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{variant:"ghost",size:"icon",className:"h-6 w-6",onClick:()=>v(S),children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.X,{className:"h-3 w-3"}),jsxRuntime.jsxRuntimeExports.jsx("span",{className:"sr-only",children:"Remove attribute"})]})]})]},S))})]})}),BlockAttributesEditor=React__namespace.memo(()=>{const r=useSelectedBlock(),[n,a]=React.useState([]),[o]=useSelectedStylingBlocks(),i=useUpdateBlocksProps(),l=`${lodashEs.get(o,"0.prop")}_attrs`;React__namespace.useEffect(()=>{const u=lodashEs.map(lodashEs.get(r,l),(d,p)=>({key:p,value:d}));lodashEs.isEmpty(u)?a([]):a(u)},[lodashEs.get(r,l)]);const c=React__namespace.useCallback((u=[])=>{const d={};lodashEs.forEach(u,p=>{lodashEs.isEmpty(p.key)||lodashEs.set(d,p.key,p.value)}),i([lodashEs.get(r,"_id")],{[l]:d})},[r,i,l]);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex-col gap-y-2",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col",children:jsxRuntime.jsxRuntimeExports.jsx("div",{children:jsxRuntime.jsxRuntimeExports.jsx(AttrsEditor,{preloadedAttributes:n,onAttributesChange:c})})})})});var __create=Object.create,__defProp$1v=Object.defineProperty,__getOwnPropDesc=Object.getOwnPropertyDescriptor,__getOwnPropNames=Object.getOwnPropertyNames,__getProtoOf=Object.getPrototypeOf,__hasOwnProp$1x=Object.prototype.hasOwnProperty,__esm=(r,n)=>function(){return r&&(n=(0,r[__getOwnPropNames(r)[0]])(r=0)),n},__commonJS=(r,n)=>function(){return n||(0,r[__getOwnPropNames(r)[0]])((n={exports:{}}).exports,n),n.exports},__copyProps=(r,n,a,o)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of __getOwnPropNames(n))!__hasOwnProp$1x.call(r,i)&&i!==a&&__defProp$1v(r,i,{get:()=>n[i],enumerable:!(o=__getOwnPropDesc(n,i))||o.enumerable});return r},__toESM=(r,n,a)=>(a=r!=null?__create(__getProtoOf(r)):{},__copyProps(n||!r||!r.__esModule?__defProp$1v(a,"default",{value:r,enumerable:!0}):a,r)),init_react_shim=__esm({"react-shim.js"(){}});init_react_shim();init_react_shim();var isEqualAtomsValues=(r,n)=>r.size===n.size&&Array.from(r).every(([a,o])=>Object.is(n.get(a),o)),isEqualAtomsDependents=(r,n)=>r.size===n.size&&Array.from(r).every(([a,o])=>{const i=n.get(a);return i&&o.size===i.size&&Array.from(o).every(l=>i.has(l))});function useAtomsSnapshot({shouldShowPrivateAtoms:r=!1,...n}={}){const a=useStore(n),[o,i]=React.useState(()=>({values:new Map,dependents:new Map})),l=React.useRef(!0);return l.current=!0,React.useLayoutEffect(()=>{l.current=!1}),React.useEffect(()=>{const c=(a==null?void 0:a.dev_subscribe_store)||(a==null?void 0:a.dev_subscribe_state);if(!c)return;let u=new Map,d=new Map;"dev_subscribe_store"in a||console.warn("[DEPRECATION-WARNING]: Your Jotai version is out-of-date and contains deprecated properties that will be removed soon. Please update to the latest version of Jotai.");const p=m=>{var b,v,x;typeof m!="object"&&console.warn("[DEPRECATION-WARNING]: Your Jotai version is out-of-date and contains deprecated properties that will be removed soon. Please update to the latest version of Jotai.");const h=new Map,g=new Map;for(const E of((b=a.dev_get_mounted_atoms)==null?void 0:b.call(a))||[]){if(!r&&E.debugPrivate)continue;const R=(v=a.dev_get_atom_state)==null?void 0:v.call(a,E);R&&"v"in R&&h.set(E,R.v);const A=(x=a.dev_get_mounted)==null?void 0:x.call(a,E);if(A){let S=A.t;r||(S=new Set(Array.from(S.values()).filter(w=>!w.debugPrivate))),g.set(E,S)}}if(isEqualAtomsValues(u,h)&&isEqualAtomsDependents(d,g))return;u=h,d=g;const y=()=>i({values:h,dependents:g});l.current?Promise.resolve().then(y):y()},f=c==null?void 0:c(p,2);return p({}),f},[a,r]),o}init_react_shim();function useGotoAtomsSnapshot(r){const n=useStore(r);return React.useCallback(a=>{n.dev_restore_atoms&&n.dev_restore_atoms(a.values)},[n])}init_react_shim();init_react_shim();init_react_shim();init_react_shim();init_react_shim();function sheetForTag(r){if(r.sheet)return r.sheet;for(var n=0;n<document.styleSheets.length;n++)if(document.styleSheets[n].ownerNode===r)return document.styleSheets[n]}function createStyleElement(r){var n=document.createElement("style");return n.setAttribute("data-emotion",r.key),r.nonce!==void 0&&n.setAttribute("nonce",r.nonce),n.appendChild(document.createTextNode("")),n.setAttribute("data-s",""),n}var StyleSheet=function(){function r(a){var o=this;this._insertTag=function(i){var l;o.tags.length===0?o.insertionPoint?l=o.insertionPoint.nextSibling:o.prepend?l=o.container.firstChild:l=o.before:l=o.tags[o.tags.length-1].nextSibling,o.container.insertBefore(i,l),o.tags.push(i)},this.isSpeedy=a.speedy===void 0?process.env.NODE_ENV==="production":a.speedy,this.tags=[],this.ctr=0,this.nonce=a.nonce,this.key=a.key,this.container=a.container,this.prepend=a.prepend,this.insertionPoint=a.insertionPoint,this.before=null}var n=r.prototype;return n.hydrate=function(o){o.forEach(this._insertTag)},n.insert=function(o){this.ctr%(this.isSpeedy?65e3:1)===0&&this._insertTag(createStyleElement(this));var i=this.tags[this.tags.length-1];if(process.env.NODE_ENV!=="production"){var l=o.charCodeAt(0)===64&&o.charCodeAt(1)===105;l&&this._alreadyInsertedOrderInsensitiveRule&&console.error(`You're attempting to insert the following rule:
62
62
  `+o+"\n\n`@import` rules must be before all other types of rules in a stylesheet but other rules have already been inserted. Please ensure that `@import` rules are before all other rules."),this._alreadyInsertedOrderInsensitiveRule=this._alreadyInsertedOrderInsensitiveRule||!l}if(this.isSpeedy){var c=sheetForTag(i);try{c.insertRule(o,c.cssRules.length)}catch(u){process.env.NODE_ENV!=="production"&&!/:(-moz-placeholder|-moz-focus-inner|-moz-focusring|-ms-input-placeholder|-moz-read-write|-moz-read-only|-ms-clear|-ms-expand|-ms-reveal){/.test(o)&&console.error('There was a problem inserting the following rule: "'+o+'"',u)}}else i.appendChild(document.createTextNode(o));this.ctr++},n.flush=function(){this.tags.forEach(function(o){return o.parentNode&&o.parentNode.removeChild(o)}),this.tags=[],this.ctr=0,process.env.NODE_ENV!=="production"&&(this._alreadyInsertedOrderInsensitiveRule=!1)},r}(),MS="-ms-",MOZ="-moz-",WEBKIT="-webkit-",COMMENT="comm",RULESET="rule",DECLARATION="decl",IMPORT="@import",KEYFRAMES="@keyframes",LAYER="@layer",abs=Math.abs,from=String.fromCharCode,assign=Object.assign;function hash(r,n){return charat(r,0)^45?(((n<<2^charat(r,0))<<2^charat(r,1))<<2^charat(r,2))<<2^charat(r,3):0}function trim(r){return r.trim()}function match(r,n){return(r=n.exec(r))?r[0]:r}function replace(r,n,a){return r.replace(n,a)}function indexof(r,n){return r.indexOf(n)}function charat(r,n){return r.charCodeAt(n)|0}function substr(r,n,a){return r.slice(n,a)}function strlen(r){return r.length}function sizeof(r){return r.length}function append(r,n){return n.push(r),r}function combine(r,n){return r.map(n).join("")}var line=1,column=1,length=0,position=0,character=0,characters="";function node(r,n,a,o,i,l,c){return{value:r,root:n,parent:a,type:o,props:i,children:l,line,column,length:c,return:""}}function copy(r,n){return assign(node("",null,null,"",null,null,0),r,{length:-r.length},n)}function char(){return character}function prev(){return character=position>0?charat(characters,--position):0,column--,character===10&&(column=1,line--),character}function next(){return character=position<length?charat(characters,position++):0,column++,character===10&&(column=1,line++),character}function peek(){return charat(characters,position)}function caret(){return position}function slice$1(r,n){return substr(characters,r,n)}function token(r){switch(r){case 0:case 9:case 10:case 13:case 32:return 5;case 33:case 43:case 44:case 47:case 62:case 64:case 126:case 59:case 123:case 125:return 4;case 58:return 3;case 34:case 39:case 40:case 91:return 2;case 41:case 93:return 1}return 0}function alloc(r){return line=column=1,length=strlen(characters=r),position=0,[]}function dealloc(r){return characters="",r}function delimit(r){return trim(slice$1(position-1,delimiter(r===91?r+2:r===40?r+1:r)))}function whitespace(r){for(;(character=peek())&&character<33;)next();return token(r)>2||token(character)>3?"":" "}function escaping(r,n){for(;--n&&next()&&!(character<48||character>102||character>57&&character<65||character>70&&character<97););return slice$1(r,caret()+(n<6&&peek()==32&&next()==32))}function delimiter(r){for(;next();)switch(character){case r:return position;case 34:case 39:r!==34&&r!==39&&delimiter(character);break;case 40:r===41&&delimiter(r);break;case 92:next();break}return position}function commenter(r,n){for(;next()&&r+character!==57;)if(r+character===84&&peek()===47)break;return"/*"+slice$1(n,position-1)+"*"+from(r===47?r:next())}function identifier(r){for(;!token(peek());)next();return slice$1(r,position)}function compile(r){return dealloc(parse("",null,null,null,[""],r=alloc(r),0,[0],r))}function parse(r,n,a,o,i,l,c,u,d){for(var p=0,f=0,m=c,h=0,g=0,y=0,b=1,v=1,x=1,E=0,R="",A=i,S=l,w=o,C=R;v;)switch(y=E,E=next()){case 40:if(y!=108&&charat(C,m-1)==58){indexof(C+=replace(delimit(E),"&","&\f"),"&\f")!=-1&&(x=-1);break}case 34:case 39:case 91:C+=delimit(E);break;case 9:case 10:case 13:case 32:C+=whitespace(y);break;case 92:C+=escaping(caret()-1,7);continue;case 47:switch(peek()){case 42:case 47:append(comment(commenter(next(),caret()),n,a),d);break;default:C+="/"}break;case 123*b:u[p++]=strlen(C)*x;case 125*b:case 59:case 0:switch(E){case 0:case 125:v=0;case 59+f:x==-1&&(C=replace(C,/\f/g,"")),g>0&&strlen(C)-m&&append(g>32?declaration(C+";",o,a,m-1):declaration(replace(C," ","")+";",o,a,m-2),d);break;case 59:C+=";";default:if(append(w=ruleset(C,n,a,p,f,i,u,R,A=[],S=[],m),l),E===123)if(f===0)parse(C,n,w,w,A,l,m,u,S);else switch(h===99&&charat(C,3)===110?100:h){case 100:case 108:case 109:case 115:parse(r,w,w,o&&append(ruleset(r,w,w,0,0,i,u,R,i,A=[],m),S),i,S,m,u,o?A:S);break;default:parse(C,w,w,w,[""],S,0,u,S)}}p=f=g=0,b=x=1,R=C="",m=c;break;case 58:m=1+strlen(C),g=y;default:if(b<1){if(E==123)--b;else if(E==125&&b++==0&&prev()==125)continue}switch(C+=from(E),E*b){case 38:x=f>0?1:(C+="\f",-1);break;case 44:u[p++]=(strlen(C)-1)*x,x=1;break;case 64:peek()===45&&(C+=delimit(next())),h=peek(),f=m=strlen(R=C+=identifier(caret())),E++;break;case 45:y===45&&strlen(C)==2&&(b=0)}}return l}function ruleset(r,n,a,o,i,l,c,u,d,p,f){for(var m=i-1,h=i===0?l:[""],g=sizeof(h),y=0,b=0,v=0;y<o;++y)for(var x=0,E=substr(r,m+1,m=abs(b=c[y])),R=r;x<g;++x)(R=trim(b>0?h[x]+" "+E:replace(E,/&\f/g,h[x])))&&(d[v++]=R);return node(r,n,a,i===0?RULESET:u,d,p,f)}function comment(r,n,a){return node(r,n,a,COMMENT,from(char()),substr(r,2,-2),0)}function declaration(r,n,a,o){return node(r,n,a,DECLARATION,substr(r,0,o),substr(r,o+1,-1),o)}function serialize(r,n){for(var a="",o=sizeof(r),i=0;i<o;i++)a+=n(r[i],i,r,n)||"";return a}function stringify$2(r,n,a,o){switch(r.type){case LAYER:if(r.children.length)break;case IMPORT:case DECLARATION:return r.return=r.return||r.value;case COMMENT:return"";case KEYFRAMES:return r.return=r.value+"{"+serialize(r.children,o)+"}";case RULESET:r.value=r.props.join(",")}return strlen(a=serialize(r.children,o))?r.return=r.value+"{"+a+"}":""}function middleware(r){var n=sizeof(r);return function(a,o,i,l){for(var c="",u=0;u<n;u++)c+=r[u](a,o,i,l)||"";return c}}function rulesheet(r){return function(n){n.root||(n=n.return)&&r(n)}}var weakMemoize=function r(n){var a=new WeakMap;return function(o){if(a.has(o))return a.get(o);var i=n(o);return a.set(o,i),i}};function memoize(r){var n=Object.create(null);return function(a){return n[a]===void 0&&(n[a]=r(a)),n[a]}}var identifierWithPointTracking=function r(n,a,o){for(var i=0,l=0;i=l,l=peek(),i===38&&l===12&&(a[o]=1),!token(l);)next();return slice$1(n,position)},toRules=function r(n,a){var o=-1,i=44;do switch(token(i)){case 0:i===38&&peek()===12&&(a[o]=1),n[o]+=identifierWithPointTracking(position-1,a,o);break;case 2:n[o]+=delimit(i);break;case 4:if(i===44){n[++o]=peek()===58?"&\f":"",a[o]=n[o].length;break}default:n[o]+=from(i)}while(i=next());return n},getRules=function r(n,a){return dealloc(toRules(alloc(n),a))},fixedElements=new WeakMap,compat=function r(n){if(!(n.type!=="rule"||!n.parent||n.length<1)){for(var a=n.value,o=n.parent,i=n.column===o.column&&n.line===o.line;o.type!=="rule";)if(o=o.parent,!o)return;if(!(n.props.length===1&&a.charCodeAt(0)!==58&&!fixedElements.get(o))&&!i){fixedElements.set(n,!0);for(var l=[],c=getRules(a,l),u=o.props,d=0,p=0;d<c.length;d++)for(var f=0;f<u.length;f++,p++)n.props[p]=l[d]?c[d].replace(/&\f/g,u[f]):u[f]+" "+c[d]}}},removeLabel=function r(n){if(n.type==="decl"){var a=n.value;a.charCodeAt(0)===108&&a.charCodeAt(2)===98&&(n.return="",n.value="")}},ignoreFlag="emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason",isIgnoringComment=function r(n){return n.type==="comm"&&n.children.indexOf(ignoreFlag)>-1},createUnsafeSelectorsAlarm=function r(n){return function(a,o,i){if(!(a.type!=="rule"||n.compat)){var l=a.value.match(/(:first|:nth|:nth-last)-child/g);if(l){for(var c=!!a.parent,u=c?a.parent.children:i,d=u.length-1;d>=0;d--){var p=u[d];if(p.line<a.line)break;if(p.column<a.column){if(isIgnoringComment(p))return;break}}l.forEach(function(f){console.error('The pseudo class "'+f+'" is potentially unsafe when doing server-side rendering. Try changing it to "'+f.split("-child")[0]+'-of-type".')})}}}},isImportRule=function r(n){return n.type.charCodeAt(1)===105&&n.type.charCodeAt(0)===64},isPrependedWithRegularRules=function r(n,a){for(var o=n-1;o>=0;o--)if(!isImportRule(a[o]))return!0;return!1},nullifyElement=function r(n){n.type="",n.value="",n.return="",n.children="",n.props=""},incorrectImportAlarm=function r(n,a,o){isImportRule(n)&&(n.parent?(console.error("`@import` rules can't be nested inside other rules. Please move it to the top level and put it before regular rules. Keep in mind that they can only be used within global styles."),nullifyElement(n)):isPrependedWithRegularRules(a,o)&&(console.error("`@import` rules can't be after other rules. Please put your `@import` rules before your other rules."),nullifyElement(n)))};function prefix(r,n){switch(hash(r,n)){case 5103:return WEBKIT+"print-"+r+r;case 5737:case 4201:case 3177:case 3433:case 1641:case 4457:case 2921:case 5572:case 6356:case 5844:case 3191:case 6645:case 3005:case 6391:case 5879:case 5623:case 6135:case 4599:case 4855:case 4215:case 6389:case 5109:case 5365:case 5621:case 3829:return WEBKIT+r+r;case 5349:case 4246:case 4810:case 6968:case 2756:return WEBKIT+r+MOZ+r+MS+r+r;case 6828:case 4268:return WEBKIT+r+MS+r+r;case 6165:return WEBKIT+r+MS+"flex-"+r+r;case 5187:return WEBKIT+r+replace(r,/(\w+).+(:[^]+)/,WEBKIT+"box-$1$2"+MS+"flex-$1$2")+r;case 5443:return WEBKIT+r+MS+"flex-item-"+replace(r,/flex-|-self/,"")+r;case 4675:return WEBKIT+r+MS+"flex-line-pack"+replace(r,/align-content|flex-|-self/,"")+r;case 5548:return WEBKIT+r+MS+replace(r,"shrink","negative")+r;case 5292:return WEBKIT+r+MS+replace(r,"basis","preferred-size")+r;case 6060:return WEBKIT+"box-"+replace(r,"-grow","")+WEBKIT+r+MS+replace(r,"grow","positive")+r;case 4554:return WEBKIT+replace(r,/([^-])(transform)/g,"$1"+WEBKIT+"$2")+r;case 6187:return replace(replace(replace(r,/(zoom-|grab)/,WEBKIT+"$1"),/(image-set)/,WEBKIT+"$1"),r,"")+r;case 5495:case 3959:return replace(r,/(image-set\([^]*)/,WEBKIT+"$1$`$1");case 4968:return replace(replace(r,/(.+:)(flex-)?(.*)/,WEBKIT+"box-pack:$3"+MS+"flex-pack:$3"),/s.+-b[^;]+/,"justify")+WEBKIT+r+r;case 4095:case 3583:case 4068:case 2532:return replace(r,/(.+)-inline(.+)/,WEBKIT+"$1$2")+r;case 8116:case 7059:case 5753:case 5535:case 5445:case 5701:case 4933:case 4677:case 5533:case 5789:case 5021:case 4765:if(strlen(r)-1-n>6)switch(charat(r,n+1)){case 109:if(charat(r,n+4)!==45)break;case 102:return replace(r,/(.+:)(.+)-([^]+)/,"$1"+WEBKIT+"$2-$3$1"+MOZ+(charat(r,n+3)==108?"$3":"$2-$3"))+r;case 115:return~indexof(r,"stretch")?prefix(replace(r,"stretch","fill-available"),n)+r:r}break;case 4949:if(charat(r,n+1)!==115)break;case 6444:switch(charat(r,strlen(r)-3-(~indexof(r,"!important")&&10))){case 107:return replace(r,":",":"+WEBKIT)+r;case 101:return replace(r,/(.+:)([^;!]+)(;|!.+)?/,"$1"+WEBKIT+(charat(r,14)===45?"inline-":"")+"box$3$1"+WEBKIT+"$2$3$1"+MS+"$2box$3")+r}break;case 5936:switch(charat(r,n+11)){case 114:return WEBKIT+r+MS+replace(r,/[svh]\w+-[tblr]{2}/,"tb")+r;case 108:return WEBKIT+r+MS+replace(r,/[svh]\w+-[tblr]{2}/,"tb-rl")+r;case 45:return WEBKIT+r+MS+replace(r,/[svh]\w+-[tblr]{2}/,"lr")+r}return WEBKIT+r+MS+r+r}return r}var prefixer=function r(n,a,o,i){if(n.length>-1&&!n.return)switch(n.type){case DECLARATION:n.return=prefix(n.value,n.length);break;case KEYFRAMES:return serialize([copy(n,{value:replace(n.value,"@","@"+WEBKIT)})],i);case RULESET:if(n.length)return combine(n.props,function(l){switch(match(l,/(::plac\w+|:read-\w+)/)){case":read-only":case":read-write":return serialize([copy(n,{props:[replace(l,/:(read-\w+)/,":"+MOZ+"$1")]})],i);case"::placeholder":return serialize([copy(n,{props:[replace(l,/:(plac\w+)/,":"+WEBKIT+"input-$1")]}),copy(n,{props:[replace(l,/:(plac\w+)/,":"+MOZ+"$1")]}),copy(n,{props:[replace(l,/:(plac\w+)/,MS+"input-$1")]})],i)}return""})}},defaultStylisPlugins=[prefixer],createCache=function r(n){var a=n.key;if(process.env.NODE_ENV!=="production"&&!a)throw new Error(`You have to configure \`key\` for your cache. Please make sure it's unique (and not equal to 'css') as it's used for linking styles to your cache.
63
63
  If multiple caches share the same key they might "fight" for each other's style elements.`);if(a==="css"){var o=document.querySelectorAll("style[data-emotion]:not([data-s])");Array.prototype.forEach.call(o,function(b){var v=b.getAttribute("data-emotion");v.indexOf(" ")!==-1&&(document.head.appendChild(b),b.setAttribute("data-s",""))})}var i=n.stylisPlugins||defaultStylisPlugins;if(process.env.NODE_ENV!=="production"&&/[^a-z-]/.test(a))throw new Error('Emotion key must only contain lower case alphabetical characters and - but "'+a+'" was passed');var l={},c,u=[];c=n.container||document.head,Array.prototype.forEach.call(document.querySelectorAll('style[data-emotion^="'+a+' "]'),function(b){for(var v=b.getAttribute("data-emotion").split(" "),x=1;x<v.length;x++)l[v[x]]=!0;u.push(b)});var d,p=[compat,removeLabel];process.env.NODE_ENV!=="production"&&p.push(createUnsafeSelectorsAlarm({get compat(){return y.compat}}),incorrectImportAlarm);{var f,m=[stringify$2,process.env.NODE_ENV!=="production"?function(b){b.root||(b.return?f.insert(b.return):b.value&&b.type!==COMMENT&&f.insert(b.value+"{}"))}:rulesheet(function(b){f.insert(b)})],h=middleware(p.concat(i,m)),g=function(v){return serialize(compile(v),h)};d=function(v,x,E,R){f=E,process.env.NODE_ENV!=="production"&&x.map!==void 0&&(f={insert:function(S){E.insert(S+x.map)}}),g(v?v+"{"+x.styles+"}":x.styles),R&&(y.inserted[x.name]=!0)}}var y={key:a,sheet:new StyleSheet({key:a,container:c,nonce:n.nonce,speedy:n.speedy,prepend:n.prepend,insertionPoint:n.insertionPoint}),nonce:n.nonce,inserted:l,registered:{},insert:d};return y.sheet.hydrate(u),y};function _extends$2(){return _extends$2=Object.assign?Object.assign.bind():function(r){for(var n=1;n<arguments.length;n++){var a=arguments[n];for(var o in a)Object.prototype.hasOwnProperty.call(a,o)&&(r[o]=a[o])}return r},_extends$2.apply(this,arguments)}var reactIs$1={exports:{}},reactIs_production_min={};/** @license React v16.13.1
64
64
  * react-is.production.min.js
@@ -220,4 +220,4 @@ object-assign/index.js:
220
220
  (c) Sindre Sorhus
221
221
  @license MIT
222
222
  *)
223
- */init_react_shim();var DevTools=process.env.NODE_ENV!=="production"?InternalDevTools:()=>null;function getDNDSupport(){return new URLSearchParams(window.location.search).has("dnd")}function getOutlinePlugin(){return new URLSearchParams(window.location.search).has("outline")}const FEATURE_TOGGLES={dnd:getDNDSupport(),arborist:getOutlinePlugin()},getParentNodeIds=(r,n)=>{const a=[];let o=lodashEs.find(r,{_id:n}),i=lodashEs.get(o,"_parent","");for(;lodashEs.isString(i)&&!lodashEs.isEmpty(i);)a.push(o==null?void 0:o._parent),o=lodashEs.find(r,{_id:i}),i=o==null?void 0:o._parent;return lodashEs.flatten(a)},expandedIdsAtom=jotai.atom([]),useExpandTree=()=>{const[r]=useSelectedBlockIds(),n=jotai.useAtomValue(presentBlocksAtom),[,a]=jotai.useAtom(expandedIdsAtom);React.useEffect(()=>{let o=[];const i=lodashEs.first(r);lodashEs.isString(i)&&(o=[i,...getParentNodeIds(n,i)]),a(o)},[r,n,a])},UndoRedo=()=>{const{hasUndo:r,hasRedo:n,undo:a,redo:o}=useUndoManager();return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:!r(),size:"sm",onClick:a,className:"rounded-full",variant:"ghost",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ResetIcon,{})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:!n(),onClick:o,size:"sm",className:"rounded-full",variant:"ghost",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ResetIcon,{className:"rotate-180 scale-y-[-1] transform"})})]})};function DarkMode(){const[r,n]=useDarkMode();return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.SunIcon,{className:"size-4 shrink-0"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Switch,{id:"dark-mode-switch",checked:r,onCheckedChange:()=>{n(!r)},className:`${r?"bg-violet-600":"bg-violet-300"} relative ml-2 inline-flex h-[20px] w-[40px] shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75`,children:jsxRuntime.jsxRuntimeExports.jsx("span",{"aria-hidden":"true",className:`${r?"translate-x-5":"translate-x-0"} pointer-events-none -mt-px inline-block h-[18px] w-[20px] transform rounded-full bg-white shadow-lg ring-0 transition duration-200 ease-in-out`})}),jsxRuntime.jsxRuntimeExports.jsx(FaMoon,{className:"size-4 ml-3 shrink-0"})]})}const TabletIcon=({landscape:r=!1})=>jsxRuntime.jsxRuntimeExports.jsx("svg",{className:r?"rotate-90":"",stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"0 0 448 512",height:"14px",width:"14px",xmlns:"http://www.w3.org/2000/svg",children:jsxRuntime.jsxRuntimeExports.jsx("path",{d:"M400 0H48C21.5 0 0 21.5 0 48v416c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V48c0-26.5-21.5-48-48-48zM224 480c-17.7 0-32-14.3-32-32s14.3-32 32-32 32 14.3 32 32-14.3 32-32 32zm176-108c0 6.6-5.4 12-12 12H60c-6.6 0-12-5.4-12-12V60c0-6.6 5.4-12 12-12h328c6.6 0 12 5.4 12 12v312z"})}),WEB_BREAKPOINTS=[{title:"mobile_xs_title",content:"mobile_xs_content",breakpoint:"xs",icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.MobileIcon,{}),width:400},{title:"mobile_sm_title",content:"mobile_sm_content",breakpoint:"sm",icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.MobileIcon,{className:"rotate-90"}),width:640},{title:"tablet_md_title",content:"tablet_md_content",breakpoint:"md",icon:jsxRuntime.jsxRuntimeExports.jsx(TabletIcon,{}),width:800},{title:"tablet_lg_title",content:"tablet_lg_content",breakpoint:"lg",icon:jsxRuntime.jsxRuntimeExports.jsx(TabletIcon,{landscape:!0}),width:1024},{title:"desktop_xl_title",content:"desktop_xl_content",breakpoint:"xl",icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.LaptopIcon,{}),width:1420},{title:"large_desktop_2xl_title",content:"large_desktop_2xl_content",breakpoint:"2xl",icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DesktopIcon,{}),width:1920}],BreakpointCard=({title:r,content:n,currentBreakpoint:a,breakpoint:o,width:i,icon:l,onClick:c})=>{const{t:u}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.HoverCard,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.HoverCardTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{onClick:()=>c(i),size:"sm",variant:o===a?"secondary":"ghost",children:l})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.HoverCardContent,{className:"w-52 border-border",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex justify-between space-x-4",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-1",children:[jsxRuntime.jsxRuntimeExports.jsx("h4",{className:"text-sm font-semibold",children:u(r)}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs",children:u(n)})]})})})]})},Breakpoints=()=>{const[,r,n]=useCanvasWidth(),[a,o]=useSelectedBreakpoints(),{t:i}=reactI18next.useTranslation(),l=useBuilderProp("breakpoints",WEB_BREAKPOINTS),c=u=>{a.includes(u)?a.length>2&&o(a.filter(d=>d!==u)):o(d=>[...d,u])};return l.length<4?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center rounded-md",children:lodashEs.map(l,u=>React.createElement(BreakpointCard,{...u,onClick:n,key:u.breakpoint,currentBreakpoint:r}))}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center rounded-md",children:[lodashEs.map(l.filter(u=>lodashEs.includes(a,lodashEs.toUpper(u.breakpoint))),u=>React.createElement(BreakpointCard,{...u,onClick:n,key:u.breakpoint,currentBreakpoint:r})),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenu,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"cursor-pointer px-2.5 hover:opacity-80",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DotsVerticalIcon,{className:"scale-90 transform"})})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuContent,{className:"w-56 border-border text-xs",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuLabel,{children:i("Breakpoints")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuSeparator,{}),lodashEs.map(l,u=>jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuCheckboxItem,{disabled:u.breakpoint==="xs",onCheckedChange:()=>c(lodashEs.toUpper(u.breakpoint)),checked:lodashEs.includes(a,lodashEs.toUpper(u.breakpoint)),children:i(u.title)},u.breakpoint))]})]})]})},ClearCanvas=()=>{const{t:r}=reactI18next.useTranslation(),{setNewBlocks:n}=useBlocksStoreUndoableActions(),[,a]=useSelectedBlockIds(),[,o]=useSelectedStylingBlocks(),i=React.useCallback(()=>{n([]),a([]),o([])},[n]);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialog,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{size:"sm",variant:"ghost",className:"flex items-center gap-x-1",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.EraserIcon,{})," ",r("clear")]})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogContent,{className:"border-border",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogHeader,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTitle,{children:r("clear_canvas_title")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogDescription,{children:r("clear_canvas_description")})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogFooter,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogCancel,{children:r("cancel")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogAction,{onClick:i,children:r("yes")})]})]})]})})},CanvasTopBar=()=>{const r=useBuilderProp("darkMode",!0),[n]=useCanvasZoom();return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-10 items-center justify-between border-b bg-background/70 px-2",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full space-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx(Breakpoints,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Separator,{orientation:"vertical"}),r?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(DarkMode,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Separator,{orientation:"vertical"})]}):null,jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex w-12 cursor-not-allowed items-center justify-center gap-x-1 space-x-0 font-medium text-gray-400",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ZoomInIcon,{className:"h-3.5 w-3.5 flex-shrink-0"})," ",jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"text-xs leading-3",children:[lodashEs.round(n,0),"%"]})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Separator,{orientation:"vertical"}),jsxRuntime.jsxRuntimeExports.jsx(UndoRedo,{})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex h-full items-center space-x-2",children:jsxRuntime.jsxRuntimeExports.jsx(ClearCanvas,{})})]})},AddBlocksDialog=()=>{const{t:r}=reactI18next.useTranslation(),[n,a]=React.useState(""),[o,i]=React.useState(!1);return useChaiBuilderMsgListener(({name:l,data:c=void 0})=>{l===CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK&&(a(c==null?void 0:c._id),i(!0)),l===CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK&&(a(""),i(!1))}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialog,{open:o,onOpenChange:()=>o?i(!1):"",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogContent,{className:"max-w-5xl overflow-hidden",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogHeader,{className:"flex flex-row items-center justify-between",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTitle,{children:r("add_block")}),jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:()=>i(!1),className:"text-gray-500 hover:text-gray-600 dark:text-gray-400 dark:hover:text-gray-300",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.Cross2Icon,{className:"h-6 w-6"})})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar h-[500px] max-h-full overflow-hidden",children:jsxRuntime.jsxRuntimeExports.jsx(AddBlocksPanel$1,{parentId:n,showHeading:!1})})]})})},SettingsPanel=()=>{const r=useSelectedBlock(),{t:n}=reactI18next.useTranslation(),[a,o]=React.useState(!0),i=useBuilderProp("onError",lodashEs.noop);return lodashEs.isNull(r)?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"p-4 text-center",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-4 rounded-xl p-4",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.MixerHorizontalIcon,{className:"mx-auto text-3xl"}),jsxRuntime.jsxRuntimeExports.jsx("h1",{children:n("please_select_a_block_to_edit")})]})}):jsxRuntime.jsxRuntimeExports.jsx(reactErrorBoundary.ErrorBoundary,{fallback:jsxRuntime.jsxRuntimeExports.jsx(FallbackError,{}),onError:i,children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex max-h-full w-full flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx(BlockSettings,{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx(BlockStyling,{}),jsxRuntime.jsxRuntimeExports.jsxs("div",{onClick:()=>o(!a),className:"flex cursor-default items-center justify-between border-b border-gray-300 py-2 text-sm font-bold hover:bg-gray-50",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:n("Attributes")}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.ChevronDown,{className:"h-4 w-4 text-gray-500 "+(a?"rotate-180":"")})})]}),a&&jsxRuntime.jsxRuntimeExports.jsx(BlockAttributesEditor,{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{})]})})},SettingsPanel$1=SettingsPanel;function LayoutCard({description:r,title:n,selected:a,onSelect:o,children:i}){const{t:l}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Card,{className:`cursor-pointer transition-all ${a?"ring-2 ring-secondary":""}`,onClick:o,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.CardContent,{className:"p-4",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-between",children:[jsxRuntime.jsxRuntimeExports.jsx("h3",{className:"text-lg font-semibold",children:n}),a&&jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CheckIcon,{className:"text-primary"})]}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"mb-4 text-sm text-muted-foreground",children:r}),i,jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{className:"mt-4 w-full",variant:a?"default":"outline",children:l(a?"Selected":"Select")})]})})}const ChooseLayout=({open:r,close:n})=>{const{t:a}=reactI18next.useTranslation(),[o,i]=useLayoutVariant(),l=c=>{i(c),n()};return jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialog,{open:r,onOpenChange:()=>r?n():"",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogContent,{className:"max-w-2xl overflow-hidden",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogHeader,{className:"flex flex-row items-center justify-between",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTitle,{children:a("Choose Builder Layout")}),jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:()=>n(),className:"text-gray-500 hover:text-gray-600 dark:text-gray-400 dark:hover:text-gray-300",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.Cross2Icon,{className:"h-6 w-6"})})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar max-h-full overflow-hidden",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"grid grid-cols-1 gap-4 md:grid-cols-2",children:[jsxRuntime.jsxRuntimeExports.jsx(LayoutCard,{title:a("Single side panel"),description:a("Suitable for smaller screens. Bigger canvas size."),selected:o===LAYOUT_VARIANTS.SINGLE_SIDE_PANEL,onSelect:()=>l(LAYOUT_VARIANTS.SINGLE_SIDE_PANEL),children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col rounded border border-border",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"borde-b h-4 border-b border-border"}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-32",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-1/4 bg-secondary"}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-3/4 border-l border-border bg-background"})]})]})}),jsxRuntime.jsxRuntimeExports.jsx(LayoutCard,{title:a("Dual side panel"),description:a("Suitable for larger screens. Blocks settings is always visible."),selected:o===LAYOUT_VARIANTS.DUAL_SIDE_PANEL,onSelect:()=>l(LAYOUT_VARIANTS.DUAL_SIDE_PANEL),children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col rounded border border-border",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"borde-b h-4 border-b border-border"}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-32",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-1/4 bg-secondary"}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-2/4 border-x border-border bg-background"}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-1/4 bg-secondary"})]})]})})]})})]})})},TopBar=React.lazy(()=>Promise.resolve().then(()=>require("./Topbar-LSKvebNl.cjs"))),useAutoSave=()=>{const{savePage:r}=useSavePage(),n=useBuilderProp("autoSaveSupport",!0),a=useBuilderProp("autoSaveInterval",60);web.useIntervalEffect(()=>{n&&r()},a*1e3)},RootLayout=()=>{const[r,n]=React.useState(0),[a]=useLayoutVariant(),[o,i]=React.useState(!1);useChaiBuilderMsgListener(({name:m})=>{m===CHAI_BUILDER_EVENTS.SHOW_BLOCK_SETTINGS&&n(1)});const l=useBuilderProp("sideBarComponents.top",[]),c=m=>{m.preventDefault()};jotai.useAtom(selectedLibraryAtom),useKeyEventWatcher(),useExpandTree(),useAutoSave();const u=m=>{n(r===m?null:m)},d=React.useMemo(()=>{const m=[{icon:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Layers,{size:20}),label:"sidebar.outline",component:Outline$1},a===LAYOUT_VARIANTS.SINGLE_SIDE_PANEL?{icon:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.EditIcon,{size:16}),label:"sidebar.edit_block",component:SettingsPanel$1}:null,{icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.LightningBoltIcon,{className:"size-5"}),label:"sidebar.ai_assistant",component:AskAI},{icon:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.PaintBucketIcon,{size:20}),label:"sidebar.theme",component:()=>jsxRuntime.jsxRuntimeExports.jsx(ThemeOptions,{showHeading:!1})}];return lodashEs.compact(m)},[a]),{t:p}=reactI18next.useTranslation(),f=[...d,...l];return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-screen max-h-full w-screen overflow-x-hidden bg-background text-foreground",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.TooltipProvider,{children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{onContextMenu:c,className:"flex h-screen max-h-full flex-col bg-background text-foreground",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-14 w-screen shrink-0 border-b border-border",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{children:jsxRuntime.jsxRuntimeExports.jsx(TopBar,{})})}),jsxRuntime.jsxRuntimeExports.jsxs("main",{className:"relative flex h-[calc(100vh-56px)] max-w-full flex-1 flex-row",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex w-12 flex-col items-center justify-between border-r py-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col",children:f.map((m,h)=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{className:`mb-2 rounded-lg p-2 text-gray-500 transition-colors ${r===h?"bg-primary text-white":"hover:bg-primary hover:text-white"}`,onClick:()=>u(h),children:m.icon},h)}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{side:"right",children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:p(m.label)})})]}))}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:()=>i(!0),className:"mb-2 rounded-lg p-2 text-gray-500 transition-colors hover:bg-primary hover:text-white",children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.LayoutTemplate,{size:20})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{side:"right",children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:p("Choose Builder Layout")})})]})})]}),jsxRuntime.jsxRuntimeExports.jsx(framerMotion.motion.div,{className:"h-full max-h-full border-r border-border",initial:{width:280},animate:{width:r!==null?280:0},transition:{duration:.3,ease:"easeInOut"},children:r!==null&&jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar overflow h-full overflow-x-hidden",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col p-3",children:[jsxRuntime.jsxRuntimeExports.jsxs("h2",{className:"-mt-1 flex h-10 items-center space-x-1 text-base font-bold",children:[f[r].icon,jsxRuntime.jsxRuntimeExports.jsx("span",{children:p(f[r].label)})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex-1",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx("div",{children:"Loading..."}),children:React.createElement(f[r].component,{})})})]})})}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full max-h-full flex-1 flex-col bg-slate-800/20",children:[jsxRuntime.jsxRuntimeExports.jsx(CanvasTopBar,{}),jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{children:jsxRuntime.jsxRuntimeExports.jsx(CanvasArea$1,{})})]}),a!==LAYOUT_VARIANTS.SINGLE_SIDE_PANEL?jsxRuntime.jsxRuntimeExports.jsx(framerMotion.motion.div,{className:"h-full max-h-full border-l border-border",initial:{width:280},animate:{width:280},transition:{duration:.3,ease:"easeInOut"},children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar overflow h-full max-h-full overflow-x-hidden",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex max-h-full flex-col p-3",children:[jsxRuntime.jsxRuntimeExports.jsxs("h2",{className:"-mt-1 flex h-10 items-center space-x-1 text-base font-bold",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.EditIcon,{size:"16"}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:p("Block Settings")})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex-1",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx("div",{children:"Loading..."}),children:jsxRuntime.jsxRuntimeExports.jsx(SettingsPanel$1,{})})})]})})}):null]})]}),jsxRuntime.jsxRuntimeExports.jsx(AddBlocksDialog,{}),jsxRuntime.jsxRuntimeExports.jsx(ChooseLayout,{open:o,close:()=>i(!1)})]})})},builderStore=jotai.getDefaultStore(),SmallScreenMessage=()=>jsxRuntime.jsxRuntimeExports.jsx("section",{className:"h-screen w-screen bg-gray-900 py-12 sm:py-16 lg:py-20 xl:hidden",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mx-auto max-w-7xl px-4 sm:px-6 lg:px-8",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mx-auto max-w-md text-center",children:[jsxRuntime.jsxRuntimeExports.jsx("img",{src:"https://fldwljgzcktqnysdkxnn.supabase.co/storage/v1/object/public/chaibuilder-blob-storage/175ac8d8-37fe-4707-bb4a-3c0cd6a6db75/gVH7O-Ir_400x400.png",alt:"Chai Builder",className:"mx-auto w-14 rounded-full"}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("h2",{className:"text-4xl font-bold text-white",children:"Screen too small"}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"mt-6 text-sm font-medium leading-6 text-white text-opacity-70",children:"Please view this page on greater than 1280px screen width."})]})})}),setDebugLogs=r=>{},PreviewScreen=()=>{const[r,n]=usePreviewMode(),{t:a}=reactI18next.useTranslation(),o=useBuilderProp("previewComponent",null);return r?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:iconBase.cn("fixed inset-0 z-[999] bg-background",r?"block":"hidden"),children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{size:"sm",className:"absolute right-0 top-0 m-4 space-x-2",onClick:()=>n(!1),children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.EyeClosedIcon,{}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:a("close_preview")})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{children:o?jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"h-96 w-full"}),children:React.createElement(o)}):null})]}):null},ChaiBuilderComponent=r=>{const[,n]=useBlocksStore(),[,a]=useBrandingOptions(),o=useBuilderReset(),[i]=useAtom(builderSaveStateAtom),l=React.useMemo(()=>r.layout||RootLayout,[r.layout]);return React.useEffect(()=>{builderStore.set(chaiBuilderPropsAtom,lodashEs.omit(r,["blocks","subPages","brandingOptions","dataProviders","customRootLayout","translations"]))},[r]),React.useEffect(()=>{builderStore.set(dataProvidersAtom,r.dataProviders||[])},[r.dataProviders]),React.useEffect(()=>{n(runtime.syncBlocksWithDefaults(r.blocks||[])),o()},[r.blocks]),React.useEffect(()=>{i18n.changeLanguage(r.locale||"en")},[r.locale]),React.useEffect(()=>{setDebugLogs(r.showDebugLogs)},[r.showDebugLogs]),React.useEffect(()=>{r.translations&&lodashEs.each(r.translations,(c,u)=>{i18n.addResourceBundle(u,"translation",c,!0,!0)})},[r.translations]),React.useEffect(()=>{a(r.brandingOptions)},[r.brandingOptions,a]),React.useEffect(()=>(i!=="SAVED"?window.onbeforeunload=()=>"":window.onbeforeunload=null,()=>{window.onbeforeunload=null}),[i]),jsxRuntime.jsxRuntimeExports.jsx(l,{})},ChaiBuilderEditor=r=>{const n=r._flags||{},a=r.onError||lodashEs.noop;return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-screen w-screen",children:jsxRuntime.jsxRuntimeExports.jsx(reactErrorBoundary.ErrorBoundary,{fallback:jsxRuntime.jsxRuntimeExports.jsx(FallbackError,{}),onError:a,children:jsxRuntime.jsxRuntimeExports.jsxs(flagged.FlagsProvider,{features:{...FEATURE_TOGGLES,...n},children:[jsxRuntime.jsxRuntimeExports.jsx(DevTools,{}),jsxRuntime.jsxRuntimeExports.jsx(SmallScreenMessage,{}),jsxRuntime.jsxRuntimeExports.jsx(ChaiBuilderComponent,{...r}),jsxRuntime.jsxRuntimeExports.jsx(PreviewScreen,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Toaster,{})]})})})};exports.AISetContext=AISetContext;exports.AIUserPrompt=AIUserPrompt;exports.AddBlocksPanel=AddBlocksPanel$1;exports.BlockAttributesEditor=BlockAttributesEditor;exports.BlockSettings=BlockSettings;exports.BlockStyling=BlockStyling;exports.Breakpoints=Breakpoints;exports.CHAI_BUILDER_EVENTS=CHAI_BUILDER_EVENTS;exports.CanvasArea=CanvasArea$1;exports.ChaiBuilderEditor=ChaiBuilderEditor;exports.ChaiSelect=ChaiSelect$1;exports.DarkMode=DarkMode;exports.DefaultChaiBlocks=DefaultChaiBlocks;exports.FaCheck=FaCheck;exports.ImportHTML=ImportHTML$1;exports.Outline=Outline$1;exports.ThemeOptions=ThemeOptions;exports.UILibraries=UILibraries;exports.UndoRedo=UndoRedo;exports.emitChaiBuilderMsg=emitChaiBuilderMsg;exports.getBlocksFromHTML=getBlocksFromHTML;exports.useActiveModal=useActiveModal;exports.useActivePanel=useActivePanel;exports.useAddBlock=useAddBlock;exports.useAddBlockParent=useAddBlockParent;exports.useAddClassesToBlocks=useAddClassesToBlocks;exports.useAllBlocks=useAllBlocks;exports.useBlocksStore=useBlocksStore;exports.useBlocksStoreUndoableActions=useBlocksStoreUndoableActions;exports.useBrandingOptions=useBrandingOptions;exports.useBuilderProp=useBuilderProp;exports.useBuilderReset=useBuilderReset;exports.useCanvasWidth=useCanvasWidth;exports.useCanvasZoom=useCanvasZoom;exports.useChaiBuilderMsgListener=useChaiBuilderMsgListener;exports.useCodeEditor=useCodeEditor;exports.useCopyBlockIds=useCopyBlockIds;exports.useCopyToClipboard=useCopyToClipboard;exports.useCurrentPage=useCurrentPage;exports.useCutBlockIds=useCutBlockIds;exports.useDarkMode=useDarkMode;exports.useDuplicateBlocks=useDuplicateBlocks;exports.useGetPageData=useGetPageData;exports.useHiddenBlockIds=useHiddenBlockIds;exports.useHighlightBlockId=useHighlightBlockId;exports.useLayoutVariant=useLayoutVariant;exports.usePasteBlocks=usePasteBlocks;exports.usePreviewMode=usePreviewMode;exports.useReadOnlyMode=useReadOnlyMode;exports.useRemoveBlocks=useRemoveBlocks;exports.useRemoveClassesFromBlocks=useRemoveClassesFromBlocks;exports.useSavePage=useSavePage;exports.useSelectedBlock=useSelectedBlock;exports.useSelectedBlockAllClasses=useSelectedBlockAllClasses;exports.useSelectedBlockCurrentClasses=useSelectedBlockCurrentClasses;exports.useSelectedBlockIds=useSelectedBlockIds;exports.useSelectedBlocksDisplayChild=useSelectedBlocksDisplayChild;exports.useSelectedBreakpoints=useSelectedBreakpoints;exports.useSelectedStylingBlocks=useSelectedStylingBlocks;exports.useStylingBreakpoint=useStylingBreakpoint;exports.useStylingState=useStylingState;exports.useUILibraryBlocks=useUILibraryBlocks;exports.useUndoManager=useUndoManager;exports.useUpdateBlocksProps=useUpdateBlocksProps;exports.useUpdateBlocksPropsRealtime=useUpdateBlocksPropsRealtime;
223
+ */init_react_shim();var DevTools=process.env.NODE_ENV!=="production"?InternalDevTools:()=>null;function getDNDSupport(){return new URLSearchParams(window.location.search).has("dnd")}function getOutlinePlugin(){return new URLSearchParams(window.location.search).has("outline")}const FEATURE_TOGGLES={dnd:getDNDSupport(),arborist:getOutlinePlugin()},getParentNodeIds=(r,n)=>{const a=[];let o=lodashEs.find(r,{_id:n}),i=lodashEs.get(o,"_parent","");for(;lodashEs.isString(i)&&!lodashEs.isEmpty(i);)a.push(o==null?void 0:o._parent),o=lodashEs.find(r,{_id:i}),i=o==null?void 0:o._parent;return lodashEs.flatten(a)},expandedIdsAtom=jotai.atom([]),useExpandTree=()=>{const[r]=useSelectedBlockIds(),n=jotai.useAtomValue(presentBlocksAtom),[,a]=jotai.useAtom(expandedIdsAtom);React.useEffect(()=>{let o=[];const i=lodashEs.first(r);lodashEs.isString(i)&&(o=[i,...getParentNodeIds(n,i)]),a(o)},[r,n,a])},UndoRedo=()=>{const{hasUndo:r,hasRedo:n,undo:a,redo:o}=useUndoManager();return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:!r(),size:"sm",onClick:a,className:"rounded-full",variant:"ghost",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ResetIcon,{})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{disabled:!n(),onClick:o,size:"sm",className:"rounded-full",variant:"ghost",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ResetIcon,{className:"rotate-180 scale-y-[-1] transform"})})]})};function DarkMode(){const[r,n]=useDarkMode();return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.SunIcon,{className:"size-4 shrink-0"}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Switch,{id:"dark-mode-switch",checked:r,onCheckedChange:()=>{n(!r)},className:`${r?"bg-violet-600":"bg-violet-300"} relative ml-2 inline-flex h-[20px] w-[40px] shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75`,children:jsxRuntime.jsxRuntimeExports.jsx("span",{"aria-hidden":"true",className:`${r?"translate-x-5":"translate-x-0"} pointer-events-none -mt-px inline-block h-[18px] w-[20px] transform rounded-full bg-white shadow-lg ring-0 transition duration-200 ease-in-out`})}),jsxRuntime.jsxRuntimeExports.jsx(FaMoon,{className:"size-4 ml-3 shrink-0"})]})}const TabletIcon=({landscape:r=!1})=>jsxRuntime.jsxRuntimeExports.jsx("svg",{className:r?"rotate-90":"",stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"0 0 448 512",height:"14px",width:"14px",xmlns:"http://www.w3.org/2000/svg",children:jsxRuntime.jsxRuntimeExports.jsx("path",{d:"M400 0H48C21.5 0 0 21.5 0 48v416c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V48c0-26.5-21.5-48-48-48zM224 480c-17.7 0-32-14.3-32-32s14.3-32 32-32 32 14.3 32 32-14.3 32-32 32zm176-108c0 6.6-5.4 12-12 12H60c-6.6 0-12-5.4-12-12V60c0-6.6 5.4-12 12-12h328c6.6 0 12 5.4 12 12v312z"})}),WEB_BREAKPOINTS=[{title:"mobile_xs_title",content:"mobile_xs_content",breakpoint:"xs",icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.MobileIcon,{}),width:400},{title:"mobile_sm_title",content:"mobile_sm_content",breakpoint:"sm",icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.MobileIcon,{className:"rotate-90"}),width:640},{title:"tablet_md_title",content:"tablet_md_content",breakpoint:"md",icon:jsxRuntime.jsxRuntimeExports.jsx(TabletIcon,{}),width:800},{title:"tablet_lg_title",content:"tablet_lg_content",breakpoint:"lg",icon:jsxRuntime.jsxRuntimeExports.jsx(TabletIcon,{landscape:!0}),width:1024},{title:"desktop_xl_title",content:"desktop_xl_content",breakpoint:"xl",icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.LaptopIcon,{}),width:1420},{title:"large_desktop_2xl_title",content:"large_desktop_2xl_content",breakpoint:"2xl",icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DesktopIcon,{}),width:1920}],BreakpointCard=({title:r,content:n,currentBreakpoint:a,breakpoint:o,width:i,icon:l,onClick:c})=>{const{t:u}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.HoverCard,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.HoverCardTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{onClick:()=>c(i),size:"sm",variant:o===a?"secondary":"ghost",children:l})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.HoverCardContent,{className:"w-52 border-border",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex justify-between space-x-4",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-1",children:[jsxRuntime.jsxRuntimeExports.jsx("h4",{className:"text-sm font-semibold",children:u(r)}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"text-xs",children:u(n)})]})})})]})},Breakpoints=()=>{const[,r,n]=useCanvasWidth(),[a,o]=useSelectedBreakpoints(),{t:i}=reactI18next.useTranslation(),l=useBuilderProp("breakpoints",WEB_BREAKPOINTS),c=u=>{a.includes(u)?a.length>2&&o(a.filter(d=>d!==u)):o(d=>[...d,u])};return l.length<4?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center rounded-md",children:lodashEs.map(l,u=>React.createElement(BreakpointCard,{...u,onClick:n,key:u.breakpoint,currentBreakpoint:r}))}):jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center rounded-md",children:[lodashEs.map(l.filter(u=>lodashEs.includes(a,lodashEs.toUpper(u.breakpoint))),u=>React.createElement(BreakpointCard,{...u,onClick:n,key:u.breakpoint,currentBreakpoint:r})),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenu,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("span",{className:"cursor-pointer px-2.5 hover:opacity-80",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.DotsVerticalIcon,{className:"scale-90 transform"})})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.DropdownMenuContent,{className:"w-56 border-border text-xs",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuLabel,{children:i("Breakpoints")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuSeparator,{}),lodashEs.map(l,u=>jsxRuntime.jsxRuntimeExports.jsx(contextMenu.DropdownMenuCheckboxItem,{disabled:u.breakpoint==="xs",onCheckedChange:()=>c(lodashEs.toUpper(u.breakpoint)),checked:lodashEs.includes(a,lodashEs.toUpper(u.breakpoint)),children:i(u.title)},u.breakpoint))]})]})]})},ClearCanvas=()=>{const{t:r}=reactI18next.useTranslation(),{setNewBlocks:n}=useBlocksStoreUndoableActions(),[,a]=useSelectedBlockIds(),[,o]=useSelectedStylingBlocks(),i=React.useCallback(()=>{n([]),a([]),o([])},[n]);return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex items-center",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialog,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{size:"sm",variant:"ghost",className:"flex items-center gap-x-1",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.EraserIcon,{})," ",r("clear")]})}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogContent,{className:"border-border",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogHeader,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTitle,{children:r("clear_canvas_title")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogDescription,{children:r("clear_canvas_description")})]}),jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogFooter,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogCancel,{children:r("cancel")}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogAction,{onClick:i,children:r("yes")})]})]})]})})},CanvasTopBar=()=>{const r=useBuilderProp("darkMode",!0),[n]=useCanvasZoom();return jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-10 items-center justify-between border-b bg-background/70 px-2",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full space-x-2",children:[jsxRuntime.jsxRuntimeExports.jsx(Breakpoints,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Separator,{orientation:"vertical"}),r?jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment,{children:[jsxRuntime.jsxRuntimeExports.jsx(DarkMode,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Separator,{orientation:"vertical"})]}):null,jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex w-12 cursor-not-allowed items-center justify-center gap-x-1 space-x-0 font-medium text-gray-400",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.ZoomInIcon,{className:"h-3.5 w-3.5 flex-shrink-0"})," ",jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"text-xs leading-3",children:[lodashEs.round(n,0),"%"]})]}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Separator,{orientation:"vertical"}),jsxRuntime.jsxRuntimeExports.jsx(UndoRedo,{})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex h-full items-center space-x-2",children:jsxRuntime.jsxRuntimeExports.jsx(ClearCanvas,{})})]})},AddBlocksDialog=()=>{const{t:r}=reactI18next.useTranslation(),[n,a]=React.useState(""),[o,i]=React.useState(!1);return useChaiBuilderMsgListener(({name:l,data:c=void 0})=>{l===CHAI_BUILDER_EVENTS.OPEN_ADD_BLOCK&&(a(c==null?void 0:c._id),i(!0)),l===CHAI_BUILDER_EVENTS.CLOSE_ADD_BLOCK&&(a(""),i(!1))}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialog,{open:o,onOpenChange:()=>o?i(!1):"",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogContent,{className:"max-w-5xl overflow-hidden",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogHeader,{className:"flex flex-row items-center justify-between",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTitle,{children:r("add_block")}),jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:()=>i(!1),className:"text-gray-500 hover:text-gray-600 dark:text-gray-400 dark:hover:text-gray-300",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.Cross2Icon,{className:"h-6 w-6"})})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar h-[500px] max-h-full overflow-hidden",children:jsxRuntime.jsxRuntimeExports.jsx(AddBlocksPanel$1,{parentId:n,showHeading:!1})})]})})},SettingsPanel=()=>{const r=useSelectedBlock(),{t:n}=reactI18next.useTranslation(),[a,o]=React.useState(!0),i=useBuilderProp("onError",lodashEs.noop);return lodashEs.isNull(r)?jsxRuntime.jsxRuntimeExports.jsx("div",{className:"p-4 text-center",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"space-y-4 rounded-xl p-4",children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.MixerHorizontalIcon,{className:"mx-auto text-3xl"}),jsxRuntime.jsxRuntimeExports.jsx("h1",{children:n("please_select_a_block_to_edit")})]})}):jsxRuntime.jsxRuntimeExports.jsx(reactErrorBoundary.ErrorBoundary,{fallback:jsxRuntime.jsxRuntimeExports.jsx(FallbackError,{}),onError:i,children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"relative flex max-h-full w-full flex-col",children:[jsxRuntime.jsxRuntimeExports.jsx(BlockSettings,{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx(BlockStyling,{}),jsxRuntime.jsxRuntimeExports.jsxs("div",{onClick:()=>o(!a),className:"flex cursor-default items-center justify-between border-b border-gray-300 py-2 text-sm font-bold hover:bg-gray-50",children:[jsxRuntime.jsxRuntimeExports.jsx("span",{children:n("Attributes")}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.ChevronDown,{className:"h-4 w-4 text-gray-500 "+(a?"rotate-180":"")})})]}),a&&jsxRuntime.jsxRuntimeExports.jsx(BlockAttributesEditor,{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("br",{})]})})},SettingsPanel$1=SettingsPanel;function LayoutCard({description:r,title:n,selected:a,onSelect:o,children:i}){const{t:l}=reactI18next.useTranslation();return jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Card,{className:`cursor-pointer transition-all ${a?"ring-2 ring-secondary":""}`,onClick:o,children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.CardContent,{className:"p-4",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-between",children:[jsxRuntime.jsxRuntimeExports.jsx("h3",{className:"text-lg font-semibold",children:n}),a&&jsxRuntime.jsxRuntimeExports.jsx(reactIcons.CheckIcon,{className:"text-primary"})]}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"mb-4 text-sm text-muted-foreground",children:r}),i,jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Button,{className:"mt-4 w-full",variant:a?"default":"outline",children:l(a?"Selected":"Select")})]})})}const ChooseLayout=({open:r,close:n})=>{const{t:a}=reactI18next.useTranslation(),[o,i]=useLayoutVariant(),l=c=>{i(c),n()};return jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialog,{open:r,onOpenChange:()=>r?n():"",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogContent,{className:"max-w-2xl overflow-hidden",children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.AlertDialogHeader,{className:"flex flex-row items-center justify-between",children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.AlertDialogTitle,{children:a("Choose Builder Layout")}),jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:()=>n(),className:"text-gray-500 hover:text-gray-600 dark:text-gray-400 dark:hover:text-gray-300",children:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.Cross2Icon,{className:"h-6 w-6"})})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar max-h-full overflow-hidden",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"grid grid-cols-1 gap-4 md:grid-cols-2",children:[jsxRuntime.jsxRuntimeExports.jsx(LayoutCard,{title:a("Single side panel"),description:a("Suitable for smaller screens. Bigger canvas size."),selected:o===LAYOUT_VARIANTS.SINGLE_SIDE_PANEL,onSelect:()=>l(LAYOUT_VARIANTS.SINGLE_SIDE_PANEL),children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col rounded border border-border",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"borde-b h-4 border-b border-border"}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-32",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-1/4 bg-secondary"}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-3/4 border-l border-border bg-background"})]})]})}),jsxRuntime.jsxRuntimeExports.jsx(LayoutCard,{title:a("Dual side panel"),description:a("Suitable for larger screens. Blocks settings is always visible."),selected:o===LAYOUT_VARIANTS.DUAL_SIDE_PANEL,onSelect:()=>l(LAYOUT_VARIANTS.DUAL_SIDE_PANEL),children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col rounded border border-border",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"borde-b h-4 border-b border-border"}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-32",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-1/4 bg-secondary"}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-2/4 border-x border-border bg-background"}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"w-1/4 bg-secondary"})]})]})})]})})]})})},TopBar=React.lazy(()=>Promise.resolve().then(()=>require("./Topbar-bGveihDE.cjs"))),useAutoSave=()=>{const{savePage:r}=useSavePage(),n=useBuilderProp("autoSaveSupport",!0),a=useBuilderProp("autoSaveInterval",60);web.useIntervalEffect(()=>{n&&r()},a*1e3)};function useSidebarMenuItems(r){const n=r===LAYOUT_VARIANTS.SINGLE_SIDE_PANEL;return React.useMemo(()=>{const a=[{icon:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.Layers,{size:20}),label:"sidebar.outline",component:Outline$1},n?{icon:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.EditIcon,{size:16}),label:"sidebar.edit_block",component:SettingsPanel$1}:null,{icon:jsxRuntime.jsxRuntimeExports.jsx(reactIcons.LightningBoltIcon,{className:"size-5"}),label:"sidebar.ai_assistant",component:AskAI},{icon:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.PaintBucketIcon,{size:20}),label:"sidebar.theme",component:()=>jsxRuntime.jsxRuntimeExports.jsx(ThemeOptions,{showHeading:!1})}];return lodashEs.compact(a)},[r])}const RootLayout=()=>{const[r,n]=React.useState(0),[a]=useLayoutVariant(),[o,i]=React.useState(!1);useChaiBuilderMsgListener(({name:m})=>{m===CHAI_BUILDER_EVENTS.SHOW_BLOCK_SETTINGS&&n(1)});const l=useBuilderProp("sideBarComponents.top",[]),c=m=>{m.preventDefault()};jotai.useAtom(selectedLibraryAtom),useKeyEventWatcher(),useExpandTree(),useAutoSave();const u=m=>{n(r===m?null:m)},d=useSidebarMenuItems(a),{t:p}=reactI18next.useTranslation(),f=[...d,...l];return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-screen max-h-full w-screen overflow-x-hidden bg-background text-foreground",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.TooltipProvider,{children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{onContextMenu:c,className:"flex h-screen max-h-full flex-col bg-background text-foreground",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-14 w-screen shrink-0 border-b border-border",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{children:jsxRuntime.jsxRuntimeExports.jsx(TopBar,{})})}),jsxRuntime.jsxRuntimeExports.jsxs("main",{className:"relative flex h-[calc(100vh-56px)] max-w-full flex-1 flex-row",children:[jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex w-12 flex-col items-center justify-between border-r py-2",children:[jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col",children:f.map((m,h)=>jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{className:`mb-2 rounded-lg p-2 text-gray-500 transition-colors ${r===h?"bg-primary text-white":"hover:bg-primary hover:text-white"}`,onClick:()=>u(h),children:m.icon},h)}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{side:"right",children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:p(m.label)})})]}))}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex flex-col",children:jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Tooltip,{children:[jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipTrigger,{asChild:!0,children:jsxRuntime.jsxRuntimeExports.jsx("button",{onClick:()=>i(!0),className:"mb-2 rounded-lg p-2 text-gray-500 transition-colors hover:bg-primary hover:text-white",children:jsxRuntime.jsxRuntimeExports.jsx(lucideReact.LayoutTemplate,{size:20})})}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.TooltipContent,{side:"right",children:jsxRuntime.jsxRuntimeExports.jsx("p",{children:p("Choose Builder Layout")})})]})})]}),jsxRuntime.jsxRuntimeExports.jsx(framerMotion.motion.div,{className:"h-full max-h-full border-r border-border",initial:{width:280},animate:{width:r!==null?280:0},transition:{duration:.3,ease:"easeInOut"},children:r!==null&&jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar overflow h-full overflow-x-hidden",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex flex-col p-3",children:[jsxRuntime.jsxRuntimeExports.jsxs("h2",{className:"-mt-1 flex h-10 items-center space-x-1 text-base font-bold",children:[f[r].icon,jsxRuntime.jsxRuntimeExports.jsx("span",{children:p(f[r].label)})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex-1",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx("div",{children:"Loading..."}),children:React.createElement(f[r].component,{})})})]})})}),jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex h-full max-h-full flex-1 flex-col bg-slate-800/20",children:[jsxRuntime.jsxRuntimeExports.jsx(CanvasTopBar,{}),jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{children:jsxRuntime.jsxRuntimeExports.jsx(CanvasArea$1,{})})]}),a!==LAYOUT_VARIANTS.SINGLE_SIDE_PANEL?jsxRuntime.jsxRuntimeExports.jsx(framerMotion.motion.div,{className:"h-full max-h-full border-l border-border",initial:{width:280},animate:{width:280},transition:{duration:.3,ease:"easeInOut"},children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"no-scrollbar overflow h-full max-h-full overflow-x-hidden",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"flex max-h-full flex-col p-3",children:[jsxRuntime.jsxRuntimeExports.jsxs("h2",{className:"-mt-1 flex h-10 items-center space-x-1 text-base font-bold",children:[jsxRuntime.jsxRuntimeExports.jsx(lucideReact.EditIcon,{size:"16"}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:p("Block Settings")})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{className:"flex-1",children:jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx("div",{children:"Loading..."}),children:jsxRuntime.jsxRuntimeExports.jsx(SettingsPanel$1,{})})})]})})}):null]})]}),jsxRuntime.jsxRuntimeExports.jsx(AddBlocksDialog,{}),jsxRuntime.jsxRuntimeExports.jsx(ChooseLayout,{open:o,close:()=>i(!1)})]})})},builderStore=jotai.getDefaultStore(),SmallScreenMessage=()=>jsxRuntime.jsxRuntimeExports.jsx("section",{className:"h-screen w-screen bg-gray-900 py-12 sm:py-16 lg:py-20 xl:hidden",children:jsxRuntime.jsxRuntimeExports.jsx("div",{className:"mx-auto max-w-7xl px-4 sm:px-6 lg:px-8",children:jsxRuntime.jsxRuntimeExports.jsxs("div",{className:"mx-auto max-w-md text-center",children:[jsxRuntime.jsxRuntimeExports.jsx("img",{src:"https://fldwljgzcktqnysdkxnn.supabase.co/storage/v1/object/public/chaibuilder-blob-storage/175ac8d8-37fe-4707-bb4a-3c0cd6a6db75/gVH7O-Ir_400x400.png",alt:"Chai Builder",className:"mx-auto w-14 rounded-full"}),jsxRuntime.jsxRuntimeExports.jsx("br",{}),jsxRuntime.jsxRuntimeExports.jsx("h2",{className:"text-4xl font-bold text-white",children:"Screen too small"}),jsxRuntime.jsxRuntimeExports.jsx("p",{className:"mt-6 text-sm font-medium leading-6 text-white text-opacity-70",children:"Please view this page on greater than 1280px screen width."})]})})}),setDebugLogs=r=>{},PreviewScreen=()=>{const[r,n]=usePreviewMode(),{t:a}=reactI18next.useTranslation(),o=useBuilderProp("previewComponent",null);return r?jsxRuntime.jsxRuntimeExports.jsxs("div",{className:iconBase.cn("fixed inset-0 z-[999] bg-background",r?"block":"hidden"),children:[jsxRuntime.jsxRuntimeExports.jsxs(contextMenu.Button,{size:"sm",className:"absolute right-0 top-0 m-4 space-x-2",onClick:()=>n(!1),children:[jsxRuntime.jsxRuntimeExports.jsx(reactIcons.EyeClosedIcon,{}),jsxRuntime.jsxRuntimeExports.jsx("span",{children:a("close_preview")})]}),jsxRuntime.jsxRuntimeExports.jsx("div",{children:o?jsxRuntime.jsxRuntimeExports.jsx(React.Suspense,{fallback:jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Skeleton,{className:"h-96 w-full"}),children:React.createElement(o)}):null})]}):null},ChaiBuilderComponent=r=>{const[,n]=useBlocksStore(),[,a]=useBrandingOptions(),o=useBuilderReset(),[i]=useAtom(builderSaveStateAtom),l=React.useMemo(()=>r.layout||RootLayout,[r.layout]);return React.useEffect(()=>{builderStore.set(chaiBuilderPropsAtom,lodashEs.omit(r,["blocks","subPages","brandingOptions","dataProviders","customRootLayout","translations"]))},[r]),React.useEffect(()=>{builderStore.set(dataProvidersAtom,r.dataProviders||[])},[r.dataProviders]),React.useEffect(()=>{n(runtime.syncBlocksWithDefaults(r.blocks||[])),o()},[r.blocks]),React.useEffect(()=>{i18n.changeLanguage(r.locale||"en")},[r.locale]),React.useEffect(()=>{setDebugLogs(r.showDebugLogs)},[r.showDebugLogs]),React.useEffect(()=>{r.translations&&lodashEs.each(r.translations,(c,u)=>{i18n.addResourceBundle(u,"translation",c,!0,!0)})},[r.translations]),React.useEffect(()=>{a(r.brandingOptions)},[r.brandingOptions,a]),React.useEffect(()=>(i!=="SAVED"?window.onbeforeunload=()=>"":window.onbeforeunload=null,()=>{window.onbeforeunload=null}),[i]),jsxRuntime.jsxRuntimeExports.jsx(l,{})},ChaiBuilderEditor=r=>{const n=r._flags||{},a=r.onError||lodashEs.noop;return jsxRuntime.jsxRuntimeExports.jsx("div",{className:"h-screen w-screen",children:jsxRuntime.jsxRuntimeExports.jsx(reactErrorBoundary.ErrorBoundary,{fallback:jsxRuntime.jsxRuntimeExports.jsx(FallbackError,{}),onError:a,children:jsxRuntime.jsxRuntimeExports.jsxs(flagged.FlagsProvider,{features:{...FEATURE_TOGGLES,...n},children:[jsxRuntime.jsxRuntimeExports.jsx(DevTools,{}),jsxRuntime.jsxRuntimeExports.jsx(SmallScreenMessage,{}),jsxRuntime.jsxRuntimeExports.jsx(ChaiBuilderComponent,{...r}),jsxRuntime.jsxRuntimeExports.jsx(PreviewScreen,{}),jsxRuntime.jsxRuntimeExports.jsx(contextMenu.Toaster,{})]})})})};exports.AISetContext=AISetContext;exports.AIUserPrompt=AIUserPrompt;exports.AddBlocksPanel=AddBlocksPanel$1;exports.BlockAttributesEditor=BlockAttributesEditor;exports.BlockSettings=BlockSettings;exports.BlockStyling=BlockStyling;exports.Breakpoints=Breakpoints;exports.CHAI_BUILDER_EVENTS=CHAI_BUILDER_EVENTS;exports.CanvasArea=CanvasArea$1;exports.ChaiBuilderEditor=ChaiBuilderEditor;exports.ChaiSelect=ChaiSelect$1;exports.DarkMode=DarkMode;exports.DefaultChaiBlocks=DefaultChaiBlocks;exports.FaCheck=FaCheck;exports.ImportHTML=ImportHTML$1;exports.Outline=Outline$1;exports.ThemeOptions=ThemeOptions;exports.UILibraries=UILibraries;exports.UndoRedo=UndoRedo;exports.emitChaiBuilderMsg=emitChaiBuilderMsg;exports.getBlocksFromHTML=getBlocksFromHTML;exports.useActiveModal=useActiveModal;exports.useActivePanel=useActivePanel;exports.useAddBlock=useAddBlock;exports.useAddBlockParent=useAddBlockParent;exports.useAddClassesToBlocks=useAddClassesToBlocks;exports.useAllBlocks=useAllBlocks;exports.useBlocksStore=useBlocksStore;exports.useBlocksStoreUndoableActions=useBlocksStoreUndoableActions;exports.useBrandingOptions=useBrandingOptions;exports.useBuilderProp=useBuilderProp;exports.useBuilderReset=useBuilderReset;exports.useCanvasWidth=useCanvasWidth;exports.useCanvasZoom=useCanvasZoom;exports.useChaiBuilderMsgListener=useChaiBuilderMsgListener;exports.useCodeEditor=useCodeEditor;exports.useCopyBlockIds=useCopyBlockIds;exports.useCopyToClipboard=useCopyToClipboard;exports.useCurrentPage=useCurrentPage;exports.useCutBlockIds=useCutBlockIds;exports.useDarkMode=useDarkMode;exports.useDuplicateBlocks=useDuplicateBlocks;exports.useGetPageData=useGetPageData;exports.useHiddenBlockIds=useHiddenBlockIds;exports.useHighlightBlockId=useHighlightBlockId;exports.useLayoutVariant=useLayoutVariant;exports.usePasteBlocks=usePasteBlocks;exports.usePreviewMode=usePreviewMode;exports.useReadOnlyMode=useReadOnlyMode;exports.useRemoveBlocks=useRemoveBlocks;exports.useRemoveClassesFromBlocks=useRemoveClassesFromBlocks;exports.useSavePage=useSavePage;exports.useSelectedBlock=useSelectedBlock;exports.useSelectedBlockAllClasses=useSelectedBlockAllClasses;exports.useSelectedBlockCurrentClasses=useSelectedBlockCurrentClasses;exports.useSelectedBlockIds=useSelectedBlockIds;exports.useSelectedBlocksDisplayChild=useSelectedBlocksDisplayChild;exports.useSelectedBreakpoints=useSelectedBreakpoints;exports.useSelectedStylingBlocks=useSelectedStylingBlocks;exports.useStylingBreakpoint=useStylingBreakpoint;exports.useStylingState=useStylingState;exports.useUILibraryBlocks=useUILibraryBlocks;exports.useUndoManager=useUndoManager;exports.useUpdateBlocksProps=useUpdateBlocksProps;exports.useUpdateBlocksPropsRealtime=useUpdateBlocksPropsRealtime;