https://www.magicpatterns.com/_next/static/chunks/25786-6d7f04919f2ade9b.js

1!function(){try{var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{},t=(new e.Error).stack;t&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[t]="82df750d-2f27-4237-9e6a-ea1fd0f0ae57",e._sentryDebugIdIdentifier="sentry-dbid-82df750d-2f27-4237-9e6a-ea1fd0f0ae57")}catch(e){}}();"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[25786],{24220:(e,t,n)=>{n.d(t,{X:()=>i});var a=n(54568),r=n(7620);function i(e){let{onMouseDown:t,absorbAdjacentGap:n=!1,cornerInset:i=32}=e,[o,l]=(0,r.useState)(!1),[s,d]=(0,r.useState)(!1);(0,r.useEffect)(()=>{if(!s)return;let e=()=>d(!1);return window.addEventListener("mouseup",e),()=>window.removeEventListener("mouseup",e)},[s]);let c=o||s;return(0,a.jsxs)("div",{style:{width:0,height:"100%",position:"relative",flexShrink:0,...n?{marginLeft:"calc(var(--space-2) * -1)"}:{}},children:[(0,a.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute left-0 z-[1] transition-opacity duration-100 ease-out",style:{top:i,bottom:i,width:1,transform:"translateX(-100%)",opacity:+!!c,background:"linear-gradient(to bottom, transparent 0%, var(--indigo-9) 20%, var(--indigo-9) 80%, transparent 100%)"}}),(0,a.jsx)("div",{onMouseDown:e=>{d(!0),t(e)},onMouseEnter:()=>l(!0),onMouseLeave:()=>l(!1),style:{position:"absolute",top:0,left:-6,height:"100%",width:12,zIndex:2,cursor:"col-resize"}}),(0,a.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute left-0 top-1/2 z-[3] transition-[opacity,background-color,border-color,box-shadow] duration-100 ease-out",style:{width:8,height:24,transform:"translate(calc(-50% - 0.5px), -50%)",borderRadius:4,opacity:+!!c,backgroundColor:s?"var(--indigo-9)":o?"var(--indigo-4)":"#ffffff",border:"1px solid ".concat(s?"var(--indigo-10)":o?"var(--indigo-9)":"var(--slate-6)"),boxShadow:s?"0 1px 4px rgba(0, 0, 0, 0.12)":"0 1px 3px rgba(0, 0, 0, 0.08)"}})]})}},25039:(e,t,n)=>{n.d(t,{i:()=>i});var a=n(7620),r=n(33401);function i(){let{enabled:e=!0,onBeforeFocus:t}=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},{editorRef:n}=(0,r.e1)();(0,a.useEffect)(()=>{if(!e)return;let a=()=>{var e;let t=null==(e=n.current)?void 0:e.editor;return t&&!t.isDestroyed&&t.isEditable?t:null},r=e=>{if("/"!==e.key||e.metaKey||e.ctrlKey||e.altKey)return;let n=document.activeElement;if(n&&("INPUT"===n.tagName||"TEXTAREA"===n.tagName||"SELECT"===n.tagName||n.isContentEditable)||document.querySelector('[role="dialog"], [role="alertdialog"], [role="menu"]'))return;let r=a();r&&(e.preventDefault(),null==t||t(),r.commands.focus("end"))},i=e=>{var n;if((null==(n=e.data)?void 0:n.type)!=="FOCUS_PROMPT")return;let r=a();r&&(null==t||t(),r.commands.focus("end"))};return window.addEventListener("keydown",r),window.addEventListener("message",i),()=>{window.removeEventListener("keydown",r),window.removeEventListener("message",i)}},[e,t,n])}},26437:(e,t,n)=>{n.d(t,{e:()=>tV});var a=n(54568),r=n(39151),i=n(42266),o=n(91879),l=n(71790),s=n(63120),d=n(25758),c=n(8928),u=n(69287),g=n(7620),h=n(69885),m=n(22333),x=n(86799),p=n(15594),f=n(33401),v=n(66991),b=n(33153),j=n(27345),y=n(73291),w=n(62673),N=n(94099),C=n(49255),I=n(98280),k=n(38608),T=n(40856),S=n(66924);function z(e){let{isEditModeOn:t,onEnableEditMode:n}=e;return t?(0,a.jsxs)(C.s,{className:"aurora aurora-sheen-tint rounded-lg bg-matrix-muted shadow-aurora-control-soft",direction:"column",gap:"3",p:"3",children:[(0,a.jsxs)(C.s,{align:"start",gap:"2",children:[(0,a.jsx)(S.A,{className:"mt-0.5 shrink-0 text-aurora-muted-foreground",size:16}),(0,a.jsx)(T.o.Text,{as:"span",size:"2",weight:"medium",children:"Select any element to start visual editing"})]}),(0,a.jsx)(k.w,{}),(0,a.jsxs)(C.s,{direction:"column",gap:"2",children:[(0,a.jsxs)(C.s,{align:"center",justify:"between",children:[(0,a.jsx)(T.o.Text,{muted:!0,as:"span",size:"2",children:"Select Parent"}),(0,a.jsx)(I.u,{children:"Shift"})]}),(0,a.jsxs)(C.s,{align:"center",justify:"between",children:[(0,a.jsx)(T.o.Text,{muted:!0,as:"span",size:"2",children:"Cancel"}),(0,a.jsx)(I.u,{children:"Esc"})]})]})]}):(0,a.jsxs)(C.s,{align:"center",className:"aurora",direction:"column",gap:"4",style:{maxWidth:280,textAlign:"center"},children:[(0,a.jsx)(T.o.Text,{muted:!0,as:"span",size:"2",children:"Select an element to start visual editing"}),(0,a.jsxs)(N.$,{onClick:n,size:"2",variant:"soft",children:[(0,a.jsx)(S.A,{size:14}),"Enable Edit Mode"]}

1),(0,a.jsx)(T.o.Text,{muted:!0,as:"span",size:"1",children:"Then click on any element in the preview"})]})}var E=n(30486),A=n(12199),L=n(16993),_=n(29945),M=n(12494),R=n(2167),W=n(21011),D=n(42816);function F(e){let{displayName:t,edges:n,zone:r}=e,i=(0,g.forwardRef)(function(e,t){let{color:i="currentColor",size:o=15,strokeWidth:l=2,...s}=e;return(0,a.jsx)("svg",{fill:"none",height:o,viewBox:"0 0 24 24",width:o,xmlns:"http://www.w3.org/2000/svg",...s,ref:t,children:"on"===r?(0,a.jsx)("path",{d:function(e,t){let n=n=>e.includes(n)?2*t:t,a=4+n("left"),r=4+n("top"),i=20-n("right"),o=20-n("bottom");return[P(4,4,16,16,2),P(a,r,i-a,o-r,Math.max(0,2-t/2))].join(" ")}(n,l),fill:i,fillRule:"evenodd"}):(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)("rect",{height:16,rx:2,stroke:i,strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:l,width:16,x:4,y:4}),n.map(e=>(0,a.jsx)("line",{stroke:i,strokeLinecap:"round",strokeWidth:l,...function(e,t){let n="outside"===t?3:3.5,a="outside"===t?4-n:4+n,r="outside"===t?20+n:20-n,i="outside"===t?2:8,o="outside"===t?22:16;switch(e){case"top":return{x1:i,y1:a,x2:o,y2:a};case"bottom":return{x1:i,y1:r,x2:o,y2:r};case"left":return{x1:a,y1:i,x2:a,y2:o};case"right":return{x1:r,y1:i,x2:r,y2:o}}}(e,r)},e))]})})});return i.displayName=t,i}function P(e,t,n,a,r){let i=Math.min(r,n/2,a/2),o=(e,t)=>"a ".concat(i," ").concat(i," 0 0 1 ").concat(e," ").concat(t);return["M ".concat(e+i," ").concat(t),"h ".concat(n-2*i),o(i,i),"v ".concat(a-2*i),o(-i,i),"h ".concat(-(n-2*i)),o(-i,-i),"v ".concat(-(a-2*i)),o(i,-i),"Z"].join(" ")}let O=F({displayName:"HorizontalBorderIcon",edges:["left","right"],zone:"on"}),V=F({displayName:"VerticalBorderIcon",edges:["top","bottom"],zone:"on"}),B=F({displayName:"TopBorderIcon",edges:["top"],zone:"on"}),U=F({displayName:"BottomBorderIcon",edges:["bottom"],zone:"on"}),H=F({displayName:"LeftBorderIcon",edges:["left"],zone:"on"}),$=F({displayName:"RightBorderIcon",edges:["right"],zone:"on"});var X=n(68848),q=n(88075),Y=n(84974),K=n(72116);function Q(e){let{title:t,defaultOpen:n=!0,children:r}=e,[i,o]=(0,g.useState)(n);return(0,a.jsxs)(X.a,{className:"aurora",children:[(0,a.jsxs)(X.s,{align:"center",className:"group h-8 cursor-pointer select-none transition-colors hover:bg-matrix-muted",justify:"between",onClick:()=>o(!i),px:"3",children:[(0,a.jsx)("span",{className:"font-aurora-body text-aurora-caption font-medium text-aurora-muted-foreground antialiased transition-colors group-hover:text-aurora-foreground",children:t}),(0,a.jsx)(q.P.div,{animate:{rotate:i?0:-90},transition:{duration:.15},children:(0,a.jsx)(K.A,{className:"text-aurora-subtle-foreground transition-colors group-hover:text-aurora-muted-foreground",size:12})})]}),(0,a.jsx)(Y.N,{initial:!1,children:i&&(0,a.jsx)(q.P.div,{animate:{height:"auto",opacity:1},exit:{height:0,opacity:0},initial:{height:0,opacity:0},style:{overflow:"hidden"},transition:{duration:.15,ease:[.4,0,.2,1]},children:(0,a.jsx)(X.a,{className:"pb-2.5 pt-0.5",px:"3",children:r})})})]})}var Z=n(67123),G=n(57965),J=n.n(G),ee=n(59606),et=n(57061),en=n(81325);function ea(e){let{value:t,onChange:n,artifactColorTokens:r,designSystemColorTokens:i}=e,o=(0,g.useRef)(n);(0,g.useEffect)(()=>{o.current=n},[n]);let[l,s]=(0,g.useState)(t);(0,g.useEffect)(()=>{s(t)},[t]);let d=(0,g.useMemo)(()=>J()(e=>{var t;null==(t=o.current)||t.call(o,e)},100,{trailing:!0}),[]),c=(0,g.useMemo)(()=>{let e=[],t=(null!=i?i:[]).filter(e=>e.resolvedValue).map(e=>({name:e.path,hex:e.resolvedValue}));t.length>0&&e.push({sectionName:"Design System",colors:t});let n=(null!=r?r:[]).filter(e=>e.resolvedValue).map(e=>({name:e.path,hex:e.resolvedValue}));return n.length>0&&e.push({sectionName:"On this design",colors:n}),e.length>0?e:void 0},[i,r]);return(0,a.jsx)(Z.p,{className:"aurora w-full",leading:(0,a.jsx)(ee.$I,{colorSections:c,onChange:e=>{s(e),d(e)},value:(0,et.qt)(l)?l:(0,et.by)(l),children:(0,a.jsx)(A.a,{className:(0,en.cn)("h-4 w-4 cursor-pointer overflow-hidden rounded-[4px]","border border-solid border-aurora-border"),style:{backgroundColor:l,transition:"background-color 0.3s ease"}})}),onChange:e=>{let t=e.target.value;s(t),null==n||n(t)},placeholder:"#000000",size:"1",value:l})}var er=n(19241),ei=n(16306),eo=n(47794),el=n(46068),es=n(19760),ed=n(75830);let ec={row:[function(){return(0,a.jsxs)("svg",{fill:"currentColor",height:"16",viewBox:"0 0 16 16",width:"16",children:[(0,a.jsx)("rect",{height:"2",rx:"1",width:"6",x:"1",y:"3.5"}),(0,a.jsx)("rect",{height:"2",rx:"1",width:"9",x:"1",y:"7"}),(0,a.jsx)("rect",{height:"2",rx:"1",width:"6",x:"1",y:"10.5"})]})},function(){return(0,a.jsxs)("svg",{fill:"currentColor",height:"16",viewBox:"0 0 16 16",width:"16",children:[(0,a.jsx)("rect",{height:"2",rx:"1",width:"6",x:"5",y:"3.5"}),(0,a.jsx)("rect",{height:"2",rx:"1",width:"9",x:"3.5",y:"7"}),(0,a.jsx)("rect",{height:"2",rx:"1",width:"6",x:"5",y:"10.5"})]})},function(){return(0,a.jsxs)("svg",{fill:"currentColor",height:"16",viewBox:"0 0 16 16",width:"16",children:[(0,a.jsx)("rect",{height:"2",rx:"1",width:"6",x:"9",y:"3.5"}),(0,a.jsx)("rect",{height:"2",rx:"1",width:"9",x:"6",y:"7"}),(0,a.jsx)("rect",{height:"2",rx:"1",width:"6",x:"9",y:"10.5"})]})}],column:[function(){return(0,a.jsxs)("svg",{fill:"currentColor",height:"16",viewBox:"0 0 16 16",width:"16",children:[(0,a.jsx)("rect",{height:"6",rx:"1",width:"2",x:"3.5",y:"1"}),(0,a.jsx)("rect",{height:"9",rx:"1",width:"2",x:"7",y:"1"}),(0,a.jsx)("rect",{height:"6",rx:"1",width:"2",x:"10.5",y:"1"})]})},function(){return(0,a.jsxs)("svg",{fill:"currentColor",height:"16",viewBox:"0 0 16 16",width:"16",children:[(0,a.jsx)("rect",{height:"6",rx:"1",width:"2",x:"3.5",y:"5"}),(0,a.jsx)("rect",{height:"9",rx:"1",width:"2",x:"7",y:"3.5"}),(0,a.jsx)("rect",{height:"6",rx:"1",width:"2",x:"10.5",y:"5"})]})},function(){return(0,a.jsxs)("svg",{fill:"currentColor",height:"16",viewBox:"0 0 16 16",width:"16",children:[(0,a.jsx)("rect",{height:"6",rx:"1",width:"2",x:"3.5",y:"9"}),(0,a.jsx)("rect",{height:"9",rx:"1",width:"2",x:"7",y:"6"}),(0,a.jsx)("rect",{height:"6",rx:"1",width:"2",x:"10.5",y:"9"})]})}]};function eu(e){let{direction:t,position:n}=e,r=ec[t][n];return(0,a.jsx)(r,{})}function eg(){return(0,a.jsx)("svg",{fill:"currentColor",height:"16",viewBox:"0 0 16 16",width:"16",children:(0,a.jsx)("circle",{cx:"8",cy:"8",r:"1"})})}function eh(){return(0,a.jsx)("svg",{"data-testid":"gap-icon",fill:"currentColor",height:"16",strokeLinejoin:"round",viewBox:"0 0 16 16",width:"16",children:(0,a.jsx)("path",{d:"M4.11621 14C4.11621 14.5522 3.6684 14.9999 3.11621 15H0.0078125V13.5H2.61621V2.5H0.

10078125V1H3.11621C3.66831 1.00021 4.11621 1.44785 4.11621 2V14ZM7.08203 12.5V3.5H8.58203V12.5H7.08203ZM13.3887 2.5V13.5H15.9971V15H12.8887C12.3365 14.9999 11.8887 14.5522 11.8887 14V2C11.8887 1.44785 12.3366 1.00021 12.8887 1H15.9971V2.5H13.3887Z",fill:"currentColor"})})}function em(){return(0,a.jsx)("svg",{"data-testid":"horizontal-gap-icon",fill:"currentColor",height:"16",strokeLinejoin:"round",viewBox:"0 0 16 16",width:"16",children:(0,a.jsx)("path",{d:"M2 4.11621C1.44772 4.11621 1.00006 3.6684 1 3.11621V0.0078125H2.5V2.61621H13.5V0.0078125H15V3.11621C14.9998 3.66831 14.5522 4.11621 14 4.11621H2ZM3.5 7.08203H12.5V8.58203H3.5V7.08203ZM13.5 13.3887V15.9971H15V12.8887C15.0001 12.3365 14.5522 11.8887 14 11.8887H2C1.44785 11.8887 1.00021 12.3366 1 12.8887V15.9971H2.5V13.3887H13.5Z",fill:"currentColor"})})}let ex=F({displayName:"HorizontalMarginsIcon",edges:["left","right"],zone:"outside"}),ep=F({displayName:"VerticalMarginsIcon",edges:["top","bottom"],zone:"outside"}),ef=F({displayName:"TopMarginIcon",edges:["top"],zone:"outside"}),ev=F({displayName:"BottomMarginIcon",edges:["bottom"],zone:"outside"}),eb=F({displayName:"LeftMarginIcon",edges:["left"],zone:"outside"}),ej=F({displayName:"RightMarginIcon",edges:["right"],zone:"outside"}),ey=F({displayName:"HorizontalPaddingIcon",edges:["left","right"],zone:"inside"}),ew=F({displayName:"VerticalPaddingIcon",edges:["top","bottom"],zone:"inside"}),eN=F({displayName:"TopPaddingIcon",edges:["top"],zone:"inside"}),eC=F({displayName:"BottomPaddingIcon",edges:["bottom"],zone:"inside"}),eI=F({displayName:"LeftPaddingIcon",edges:["left"],zone:"inside"}),ek=F({displayName:"RightPaddingIcon",edges:["right"],zone:"inside"}),eT=new Set(["block","inline-block","flow-root","list-item"]),eS=new Set(["img","input","textarea","select","br","hr","svg","video","canvas","iframe"]),ez=["flex-start","center","flex-end"],eE="0 1 auto";function eA(e,t){return"100%"===e?"fill":"fit-content"===e?"hug":"auto"===e?t.startsWith("1")?"fill":"hug":"fixed"}function eL(e){return"center"===e?1:2*("flex-end"===e)}let e_={fixed:"px",hug:"Hug",fill:"Fill"};function eM(e){let{value:t,onChange:n,icon:r,placeholder:i,mode:o,onModeChange:l}=e,s=t.replace(/px$/i,"").replace(/[^0-9.-]/g,""),d=function(e){let{value:t,onChange:n,min:a=0}=e,[r,i]=(0,g.useState)(!1),o=(0,g.useRef)(null),l=(0,g.useRef)(a);l.current=a;let s=(0,g.useRef)(n);s.current=n;let d=(0,g.useCallback)(e=>{e.preventDefault(),i(!0),o.current={x:e.clientX,initialValue:parseFloat(t)||0}},[t]);return(0,g.useEffect)(()=>{if(!r)return;let e=document.createElement("style");e.textContent="* { cursor: ew-resize !important; } iframe { pointer-events: none !important; }",document.head.appendChild(e);let t=e=>{if(!o.current)return;let t=e.clientX-o.current.x,n=Math.max(l.current,Math.round(o.current.initialValue+t*(e.shiftKey?10:1)));s.current(String(n))},n=()=>{i(!1),o.current=null};return document.addEventListener("mousemove",t),document.addEventListener("mouseup",n),()=>{document.head.removeChild(e),document.removeEventListener("mousemove",t),document.removeEventListener("mouseup",n)}},[r]),{onMouseDown:d,style:{cursor:"ew-resize",userSelect:"none"}}}({value:s,onChange:n}),c=!!o&&"fixed"!==o;return(0,a.jsx)("div",{style:{display:"flex",flex:1,minWidth:0},children:(0,a.jsx)(Z.p,{className:"aurora",leading:(0,a.jsx)("span",{className:"flex items-center text-aurora-muted-foreground",...c?{}:d,children:r}),onChange:e=>{n(e.target.value.replace(/[^0-9.-]/g,""))},placeholder:null!=i?i:"0",readOnly:c,size:"1",style:{width:"100%"},trailing:o&&l?(0,a.jsxs)(ei.l,{className:"h-5 w-auto gap-0.5 border-0 bg-transparent bg-none px-1 text-[11px] shadow-none [&_svg]:h-3 [&_svg]:w-3",menuSize:"1",onValueChange:e=>l(e),size:"1",value:o,children:[(0,a.jsx)(ei.l.Item,{value:"fixed",children:e_.fixed}),(0,a.jsx)(ei.l.Item,{value:"hug",children:e_.hug}),(0,a.jsx)(ei.l.Item,{value:"fill",children:e_.fill})]}):(0,a.jsx)("span",{className:"text-[11px] text-aurora-muted-foreground",children:"px"}),type:"text",value:c?"":s})})}function eR(e){var t;let{spacing:n,initialSpacing:r,onChange:i,display:o,tagName:s,parentDisplay:d,parentFlexDirection:c}=e,u="flex"===o||"inline-flex"===o,h=u||"grid"===o||"inline-grid"===o,m=function(e){let{display:t,tagName:n}=e;return!(!t||!eT.has(t)||n&&eS.has(n.toLowerCase()))}({display:o,tagName:s}),[x,p]=(0,g.useState)(!1),[f,v]=(0,g.useState)(!1),b={duration:.15*!(0,D.I)(),ease:"easeOut"},j=n.paddingTop===n.paddingBottom?n.paddingTop:"",y=n.paddingLeft===n.paddingRight?n.paddingLeft:"",w=n.marginTop===n.marginBottom?n.marginTop:"",I=n.marginLeft===n.marginRight?n.marginLeft:"",k=n.paddingLeft&&n.paddingRight&&n.paddingLeft!==n.paddingRight,S=n.paddingTop&&n.paddingBottom&&n.paddingTop!==n.paddingBottom,z=n.marginLeft&&n.marginRight&&n.marginLeft!==n.marginRight,E=n.marginTop&&n.marginBottom&&n.marginTop!==n.marginBottom,A="row"===n.flexDirection||""===n.flexDirection,L=A?"row":"column",_=eL(n.justifyContent),F=eL(n.alignItems),P=A?F:_,O=A?_:F,V=u?"Remove auto layout":"Add auto layout",B="flex"===d||"inline-flex"===d,U=!(null==c?void 0:c.startsWith("column")),H={width:B&&U,height:B&&!U},$=(e,t)=>{let a="width"===e?"widthSizing":"heightSizing";if("fixed"===t)return void i({[a]:"",[e]:n[e]||(null==r?void 0:r[e])||"",...H[e]?{flex:eE}:{}});let o="fill"===t;if(H[e])return void i({[a]:"auto",flex:o?"1 1 0%":eE});i({[a]:o?"100%":"fit-content"})},X="absolute"===(t=n.position)||"fixed"===t||"sticky"===t,q=(0,a.jsx)(er.y,{label:"Gap",children:(0,a.jsxs)(C.s,{align:"center",gap:"2",children:[(0,a.jsx)(eM,{icon:(0,a.jsx)(eh,{}),onChange:e=>i({gap:e}),value:n.gap}),(0,a.jsx)("div",{style:{flex:1}}),(0,a.jsx)("div",{style:{width:28,flexShrink:0}})]})});return(0,a.jsx)(Q,{title:"Layout",children:(0,a.jsxs)(C.s,{direction:"column",gap:"2",children:[X&&(0,a.jsx)(er.y,{label:"Position",children:(0,a.jsxs)(C.s,{align:"center",gap:"2",children:[(0,a.jsx)(eM,{icon:(0,a.jsx)(T.o.Text,{as:"span",size:"1",children:"X"}),onChange:e=>i({left:e,right:"auto"}),placeholder:"auto",value:n.left}),(0,a.jsx)(eM,{icon:(0,a.jsx)(T.o.Text,{as:"span",size:"1",children:"Y"}),onChange:e=>i({top:e,bottom:"auto"}),placeholder:"auto",value:n.top}),(0,a.jsx)("div",{style:{width:28,flexShrink:0}})]})}),(0,a.jsx)(er.y,{label:"Size",children:(0,a.jsxs)(C.s,{align:"center",gap:"2",children:[(0,a.jsx)(eM,{icon:(0,a.jsx)(T.o.Text,{as:"span",size:"1",children:"W"}),mode:eA(n.widthSizing,n.flex),onChange:e=>i({width:e}),onModeChange:e=>$("width",e),value:n.width}),(0,a.jsx)(eM,{icon:(0,a.jsx)(T.o.Text,{as:"span",size:"1",children:"H"}),mode:eA(n.heightSizing,n.flex),onChange:e=>i({height:e}),onModeChange:e=>$("height",e),value:n.height}),(0,a.jsx)("div",{style:{width:28,flexShrink:0}})]})}),(m||u)&&(0,a.jsx)("div",{className:"-mx-3 my-1 border-y border-solid border-aurora-border px-3 py-2",children:(0,a.jsxs)(C.s,{direction:"column",gap:"2",children:[(0,a.jsxs)(C.s,{align:"center",justify:"between",children:[(0,a.jsx)(T.o.Text,{as:"span",className:"text-aurora-foreground",size:"1",weight:"medium",children:"Auto layout"}),(0,a.jsx)(eo.m,{content:V,children:(0,a.jsx)(N.$,{iconOnly:!0,"aria-label":V,onClick:u?()=>{i({display:"block"})}:()=>{i({display:"flex",flexDirection:"row",alignItems:"center",gap:"8"})},size:"1",variant:"ghost",children:u?(0,a.jsx)(R.A,{size:14}):(0,a.jsx)(M.A,{size:14})})})]}),u&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(er.y,{label:"Direction",children:(0,a.jsxs)(el.Root,{className:"relative inline-flex gap-2 rounded-lg bg-matrix-muted p-0.5 shadow-[inset_0_1px_2px_0_rgba(15,23,42,0.10),inset_-1px_

1-1px_0_0_rgba(255,255,255,0.7)]",onValueChange:e=>{e&&i({flexDirection:e,alignItems:n.justifyContent,justifyContent:n.alignItems})},rovingFocus:!1,type:"single",value:A?"row":"column",children:[(0,a.jsx)(l.P.div,{animate:{x:36*!A},className:"aurora-glass shadow-aurora-sm",style:{position:"absolute",zIndex:5,top:2,left:2,width:28,height:28,borderRadius:"0.375rem",background:"white"},transition:{type:"spring",stiffness:500,damping:35}}),(0,a.jsx)(el.Item,{"aria-label":"Row Direction",className:"flex h-7 w-7 items-center justify-center rounded-md transition-colors duration-200 ".concat(A?"text-aurora-foreground":"text-aurora-muted-foreground hover:text-aurora-foreground"),value:"row",children:(0,a.jsx)("span",{className:"relative z-10",children:(0,a.jsx)(es.A,{size:14,strokeWidth:2.5})})}),(0,a.jsx)(el.Item,{"aria-label":"Column Direction",className:"flex h-7 w-7 items-center justify-center rounded-md transition-colors duration-200 ".concat(A?"text-aurora-muted-foreground hover:text-aurora-foreground":"text-aurora-foreground"),value:"column",children:(0,a.jsx)("span",{className:"relative z-10",children:(0,a.jsx)(ed.A,{size:14,strokeWidth:2.5})})})]})}),(0,a.jsx)(er.y,{label:"Alignment",children:(0,a.jsx)(el.Root,{className:"inline-grid w-fit grid-cols-3 gap-0.5 rounded-lg bg-matrix-muted p-1 shadow-[inset_0_1px_2px_0_rgba(15,23,42,0.10),inset_-1px_-1px_0_0_rgba(255,255,255,0.7)]",onValueChange:e=>{if(e){let[t,n]=e.split("-").map(Number);A?i({justifyContent:ez[n],alignItems:ez[t]}):i({justifyContent:ez[t],alignItems:ez[n]})}},rovingFocus:!1,type:"single",value:"".concat(P,"-").concat(O),children:[0,1,2].map(e=>[0,1,2].map(t=>{let n="".concat(e,"-").concat(t),r=e===P&&t===O;return(0,a.jsx)(el.Item,{className:"group flex h-5 w-8 cursor-pointer items-center justify-center rounded transition-colors duration-200 ".concat(r?"text-aurora-foreground":"text-aurora-subtle-foreground hover:text-aurora-muted-foreground"),value:n,children:r?(0,a.jsx)(eu,{direction:L,position:A?t:e}):(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)("span",{className:"group-hover:hidden",children:(0,a.jsx)(eg,{})}),(0,a.jsx)("span",{className:"hidden group-hover:block",children:(0,a.jsx)(eu,{direction:L,position:A?t:e})})]})},n)}))})}),q]})]})}),!u&&h&&q,!h&&((null==r?void 0:r.spaceX)||(null==r?void 0:r.spaceY))&&(0,a.jsx)(er.y,{label:"Gap",children:(0,a.jsxs)(C.s,{align:"center",gap:"2",children:[(null==r?void 0:r.spaceX)&&(0,a.jsx)(eM,{icon:(0,a.jsx)(eh,{}),onChange:e=>i({spaceX:e}),placeholder:"0",value:n.spaceX}),(null==r?void 0:r.spaceY)&&(0,a.jsx)(eM,{icon:(0,a.jsx)(em,{}),onChange:e=>i({spaceY:e}),placeholder:"0",value:n.spaceY}),!(null==r?void 0:r.spaceX)!=!(null==r?void 0:r.spaceY)&&(0,a.jsx)("div",{style:{flex:1}}),(0,a.jsx)("div",{style:{width:28,flexShrink:0}})]})}),(0,a.jsx)(er.y,{alignTop:!0,label:"Padding",children:x?(0,a.jsxs)(C.s,{align:"start",gap:"2",children:[(0,a.jsxs)(l.P.div,{animate:{opacity:1},className:"grid min-w-0 flex-1 grid-cols-2 gap-2",initial:{opacity:0}

1,transition:b,children:[(0,a.jsx)(eM,{icon:(0,a.jsx)(eN,{}),onChange:e=>i({paddingTop:e}),value:n.paddingTop}),(0,a.jsx)(eM,{icon:(0,a.jsx)(eI,{}),onChange:e=>i({paddingLeft:e}),value:n.paddingLeft}),(0,a.jsx)(eM,{icon:(0,a.jsx)(eC,{}),onChange:e=>i({paddingBottom:e}),value:n.paddingBottom}),(0,a.jsx)(eM,{icon:(0,a.jsx)(ek,{}),onChange:e=>i({paddingRight:e}),value:n.paddingRight})]}),(0,a.jsx)(eo.m,{content:"Toggle all sides",children:(0,a.jsx)(N.$,{iconOnly:!0,"aria-label":"Toggle all sides",onClick:()=>p(!1),size:"1",variant:"soft",children:(0,a.jsx)(W.A,{size:14})})})]}):(0,a.jsxs)(C.s,{align:"center",gap:"2",children:[(0,a.jsx)(eM,{icon:(0,a.jsx)(ew,{}),onChange:e=>{i({paddingTop:e,paddingBottom:e})},placeholder:S?"Multiple":void 0,value:j}),(0,a.jsx)(eM,{icon:(0,a.jsx)(ey,{}),onChange:e=>{i({paddingLeft:e,paddingRight:e})},placeholder:k?"Multiple":void 0,value:y}),(0,a.jsx)(eo.m,{content:"Toggle all sides",children:(0,a.jsx)(N.$,{iconOnly:!0,"aria-label":"Toggle all sides",onClick:()=>p(!0),size:"1",variant:"outline",children:(0,a.jsx)(W.A,{size:14})})})]})}),(0,a.jsx)(er.y,{alignTop:!0,label:"Margin",children:f?(0,a.jsxs)(C.s,{align:"start",gap:"2",children:[(0,a.jsxs)(l.P.div,{animate:{opacity:1},className:"grid min-w-0 flex-1 grid-cols-2 gap-2",initial:{opacity:0}

1,transition:b,children:[(0,a.jsx)(eM,{icon:(0,a.jsx)(ef,{}),onChange:e=>i({marginTop:e}),value:n.marginTop}),(0,a.jsx)(eM,{icon:(0,a.jsx)(eb,{}),onChange:e=>i({marginLeft:e}),value:n.marginLeft}),(0,a.jsx)(eM,{icon:(0,a.jsx)(ev,{}),onChange:e=>i({marginBottom:e}),value:n.marginBottom}),(0,a.jsx)(eM,{icon:(0,a.jsx)(ej,{}),onChange:e=>i({marginRight:e}),value:n.marginRight})]}),(0,a.jsx)(eo.m,{content:"Toggle all sides",children:(0,a.jsx)(N.$,{iconOnly:!0,"aria-label":"Toggle all sides",onClick:()=>v(!1),size:"1",variant:"soft",children:(0,a.jsx)(W.A,{size:14})})})]}):(0,a.jsxs)(C.s,{align:"center",gap:"2",children:[(0,a.jsx)(eM,{icon:(0,a.jsx)(ep,{}),onChange:e=>{i({marginTop:e,marginBottom:e})},placeholder:E?"Multiple":void 0,value:w}),(0,a.jsx)(eM,{icon:(0,a.jsx)(ex,{}),onChange:e=>{i({marginLeft:e,marginRight:e})},placeholder:z?"Multiple":void 0,value:I}),(0,a.jsx)(eo.m,{content:"Toggle all sides",children:(0,a.jsx)(N.$,{iconOnly:!0,"aria-label":"Toggle all sides",onClick:()=>v(!0),size:"1",variant:"outline",children:(0,a.jsx)(W.A,{size:14})})})]})})]})})}function eW(e){let{border:t,onChange:n,artifactColorTokens:r=[],designSystemColorTokens:i=[]}=e,[o,s]=(0,g.useState)(!1),d=(0,D.I)(),c=!t.style||"none"===t.style,u=e=>{n(c?{...e,style:"solid"}:e)},h=[t.topWidth,t.rightWidth,t.bottomWidth,t.leftWidth].some(e=>Number(e)>0),m=e=>({bottomWidth:e,leftWidth:e,rightWidth:e,topWidth:e}),x=t.topWidth===t.bottomWidth?t.topWidth:"",p=t.leftWidth===t.rightWidth?t.leftWidth:"",f=t.topWidth&&t.bottomWidth&&t.topWidth!==t.bottomWidth,v=t.leftWidth&&t.rightWidth&&t.leftWidth!==t.rightWidth;return h?(0,a.jsx)(Q,{title:"Border",children:(0,a.jsxs)(_.so,{direction:"column",gap:"2",children:[(0,a.jsx)(er.y,{label:"Color",children:(0,a.jsxs)(_.so,{align:"center",gap:"2",children:[(0,a.jsx)("div",{className:"min-w-0 flex-1",children:(0,a.jsx)(ea,{artifactColorTokens:r,designSystemColorTokens:i,onChange:e=>n({color:e}),value:t.color})}),(0,a.jsx)(_.m_,{content:"Remove border",children:(0,a.jsx)(_.$n,{iconOnly:!0,"aria-label":"Remove border",onClick:()=>n(m("0")),size:"1",variant:"ghost",children:(0,a.jsx)(R.A,{size:14})})})]})}),(0,a.jsx)(er.y,{alignTop:!0,label:"Width",children:o?(0,a.jsxs)(_.so,{align:"start",gap:"2",children:[(0,a.jsxs)(l.P.div,{animate:{opacity:1},className:"grid min-w-0 flex-1 grid-cols-2 gap-2",initial:{opacity:0}

1,transition:{duration:.15*!d,ease:"easeOut"},children:[(0,a.jsx)(eM,{icon:(0,a.jsx)(B,{}),onChange:e=>u({topWidth:e}),value:t.topWidth}),(0,a.jsx)(eM,{icon:(0,a.jsx)(H,{}),onChange:e=>u({leftWidth:e}),value:t.leftWidth}),(0,a.jsx)(eM,{icon:(0,a.jsx)(U,{}),onChange:e=>u({bottomWidth:e}),value:t.bottomWidth}),(0,a.jsx)(eM,{icon:(0,a.jsx)($,{}),onChange:e=>u({rightWidth:e}),value:t.rightWidth})]}),(0,a.jsx)(_.m_,{content:"Toggle all sides",children:(0,a.jsx)(_.$n,{iconOnly:!0,"aria-label":"Toggle all sides",onClick:()=>s(!1),size:"1",variant:"soft",children:(0,a.jsx)(W.A,{size:14})})})]}):(0,a.jsxs)(_.so,{align:"center",gap:"2",children:[(0,a.jsx)(eM,{icon:(0,a.jsx)(V,{}),onChange:e=>u({topWidth:e,bottomWidth:e}),placeholder:f?"Multiple":void 0,value:x}),(0,a.jsx)(eM,{icon:(0,a.jsx)(O,{}),onChange:e=>u({leftWidth:e,rightWidth:e}),placeholder:v?"Multiple":void 0,value:p}),(0,a.jsx)(_.m_,{content:"Toggle all sides",children:(0,a.jsx)(_.$n,{iconOnly:!0,"aria-label":"Toggle all sides",onClick:()=>s(!0),size:"1",variant:"outline",children:(0,a.jsx)(W.A,{size:14})})})]})})]})}):(0,a.jsx)(Q,{title:"Border",children:(0,a.jsxs)(_.$n,{className:"w-full",onClick:()=>u(m("1")),size:"1",variant:"soft",children:[(0,a.jsx)(M.A,{size:14}),"Add border"]})})}var eD=n(45977),eF=n(25822),eP=n(11282);let eO={type:"linear",angle:90,from:"#6366F1",to:"#EC4899"},eV={"to top":0,"to right":90,"to bottom":180,"to left":270};function eB(e){let t=e.trim();

1return t&&"none"!==t?t.startsWith("url(")?"image":t.includes("gradient(")?"gradient":"solid":"solid"}function eU(e){let t=e.trim(),n=eX(t,"linear-gradient");if(n){let e=eq(n,","),t=function(e){if(!e)return null;let t=e.trim().toLowerCase(),n=t.match(/^(-?[\d.]+)deg$/);if(n)return Number(n[1]);let a=t.match(/^(-?[\d.]+)turn$/);if(a)return 360*Number(a[1]);let r=t.match(/^(-?[\d.]+)rad$/);return r?Math.round(180*Number(r[1])/Math.PI):t in eV?eV[t]:t.startsWith("to ")?180:null}(e[0]),a=null===t?e:e.slice(1);return{type:"linear",angle:null!=t?t:180,...eY(a)}}let a=eX(t,"radial-gradient");if(a){let e=eq(a,","),t=!function(e){if(!e)return!1;let t=e.trim().toLowerCase();return t.includes(" at ")||/^(circle|ellipse|closest-|farthest-)/.test(t)}(e[0])?e:e.slice(1);return{type:"radial",angle:eO.angle,...eY(t)}}return eO}function eH(e){let{from:t,to:n}=e;return"radial"===e.type?"radial-gradient(circle, ".concat(t," 0%, ").concat(n," 100%)"):"linear-gradient(".concat(e.angle,"deg, ").concat(t," 0%, ").concat(n," 100%)")}function e$(e){let t=e.trim().match(/^url\(\s*(['"]?)([\s\S]*?)\1\s*\)/);return t?t[2].replace(/\\(["'\\])/g,"$1"):""}function eX(e,t){let n=e.indexOf("".concat(t,"("));if(-1===n)return null;let a=n+t.length,r=0;for(let t=a;t<e.length;t++)if("("===e[t])r++;else if(")"===e[t]&&0==--r)return e.slice(a+1,t);return null}function eq(e,t){let n=[],a=0,r="";for(let i of e){if("("===i?a++:")"===i&&a--,i===t&&0===a){n.push(r.trim()),r="";continue}r+=i}return n.push(r.trim()),n.filter(e=>e.length>0)}function eY(e){let t=e.map(eK).filter(Boolean);return 0===t.length?{from:eO.from,to:eO.to}:{from:t[0],to:t.length>1?t[t.length-1]:t[0]}}function eK(e){return eq(e.replace(/\s+/g," ")," ").filter(e=>{var t;return t=e,!/^-?[\d.]+(%|px|em|rem|vh|vw)$/.test(t)}).join(" ")}var eQ=n(16600),eZ=n(97325),eG=n(48357);let eJ={x:3,y:3,size:18,radius:2},e0=(0,g.forwardRef)(function(e,t){let{size:n=15,...r}=e;return(0,a.jsx)("svg",{fill:"none",height:n,viewBox:"0 0 24 24",width:n,xmlns:"http://www.w3.org/2000/svg",...r,ref:t,children:(0,a.jsx)("rect",{fill:"currentColor",height:eJ.size,rx:eJ.radius,width:eJ.size,x:eJ.x,y:eJ.y})})}),e1=(0,g.forwardRef)(function(e,t){let{size:n=15,strokeWidth:r=2,...i}=e;return(0,a.jsxs)("svg",{fill:"none",height:n,viewBox:"0 0 24 24",width:n,xmlns:"http://www.w3.org/2000/svg",...i,ref:t,children:[(0,a.jsx)("rect",{height:eJ.size,rx:eJ.radius,stroke:"currentColor",strokeWidth:r,width:eJ.size,x:eJ.x,y:eJ.y}),(0,a.jsx)("path",{d:"M".concat(20," ").concat(4,"v").concat(16,"H").concat(4,"Z"),fill:"currentColor"}),(0,a.jsx)("path",{d:"M".concat(4," ").concat(20,"V").concat(4,"h").concat(16,"Z"),fill:"currentColor",opacity:"0.28"})]})}),e2=(0,g.forwardRef)(function(e,t){let{size:n=15,strokeWidth:r=2,...i}=e;return(0,a.jsxs)("svg",{fill:"none",height:n,viewBox:"0 0 24 24",width:n,xmlns:"http://www.w3.org/2000/svg",...i,ref:t,children:[(0,a.jsx)("rect",{height:eJ.size,rx:eJ.radius,stroke:"currentColor",strokeWidth:r,width:eJ.size,x:eJ.x,y:eJ.y}),(0,a.jsx)("circle",{cx:"8.5",cy:"8.5",fill:"currentColor",r:"1.5"}),(0,a.jsx)("path",{d:"M21 15l-4.5-4.5L7 20",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:r})]})});var e5=n(1527),e6=n(59358);let e4={backgroundImage:"linear-gradient(45deg, var(--gray-a3, rgba(0,0,0,0.05)) 25%, transparent 25%), linear-gradient(-45deg, var(--gray-a3, rgba(0,0,0,0.05)) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--gray-a3, rgba(0,0,0,0.05)) 75%), linear-gradient(-45deg, transparent 75%, var(--gray-a3, rgba(0,0,0,0.05)) 75%)",backgroundSize:"12px 12px",backgroundPosition:"0 0, 0 6px, 6px -6px, -6px 0"};function e3(e){let{inputId:t,isUploading:n,onFiles:r,onRemove:i,previewUrl:s,shouldReduceMotion:d}=e,[c,u]=(0,g.useState)(!1),[h,m]=(0,g.useState)(!1);function x(){var e;null==(e=document.getElementById(t))||e.click()}let p={duration:.12*!d},f=n?"uploading":s?"preview":"empty";return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsxs)("div",{className:(0,en.cn)("relative aspect-square w-full cursor-pointer overflow-hidden rounded-[var(--radius-3)] border border-solid bg-matrix-muted transition-colors",!s&&"border-dashed shadow-[inset_0_1px_2px_0_rgba(15,23,42,0.06)] hover:bg-matrix-muted-hover",c?"border-aurora-border-focus":"border-aurora-border hover:border-aurora-border-hover"),onClick:x,onDragEnter:e=>{e.preventDefault(),u(!0)},onDragLeave:e=>{e.preventDefault(),u(!1)},onDragOver:e=>e.preventDefault(),onDrop:e=>{e.preventDefault(),u(!1),e.dataTransfer.files&&r(e.dataTransfer.files)},onMouseEnter:()=>m(!0),onMouseLeave:()=>{m(!1),u(!1)},children:[(0,a.jsx)(o.N,{initial:!1,mode:"wait",children:(0,a.jsxs)(l.P.div,{animate:{o

1pacity:1},className:"absolute inset-0 flex items-center justify-center",exit:{opacity:0},initial:{opacity:0},transition:p,children:["uploading"===f&&(0,a.jsx)(e5.y$,{label:"Uploading image",size:18}),"preview"===f&&(0,a.jsx)("img",{alt:"",className:"h-full w-full object-cover",src:s,style:e4}),"empty"===f&&(0,a.jsxs)(e5.so,{align:"center",className:"pointer-events-none",direction:"column",gap:"1",children:[(0,a.jsx)("span",{className:"aurora-glass flex h-7 w-7 items-center justify-center rounded-lg bg-white text-aurora-muted-foreground shadow-aurora-sm",children:(0,a.jsx)(e6.A,{size:14})}),(0,a.jsx)("span",{className:"text-[11px] font-medium text-aurora-foreground",children:c?"Drop to upload":"Upload an image"}),!c&&(0,a.jsx)("span",{className:"text-[10px] text-aurora-subtle-foreground",children:"or drop one here"})]})]},f)}),(0,a.jsx)(o.N,{children:s&&h&&!n&&(0,a.jsxs)(l.P.div,{animate:{opacity:1},className:"absolute inset-0 flex items-center justify-center gap-1.5 bg-black/40",exit:{opacity:0},initial:{opacity:0},transition:p,children:[(0,a.jsx)(e5.$n,{onClick:e=>{e.stopPropagation(),x()},size:"1",variant:"outline",children:"Replace"}),(0,a.jsx)(e5.$n,{iconOnly:!0,"aria-label":"Remove image",onClick:e=>{e.stopPropagation(),i()},size:"1",variant:"outline",children:(0,a.jsx)(R.A,{size:14})})]})})]}),(0,a.jsx)("input",{multiple:!0,accept:"image/png, image/jpeg, image/webp, image/gif",id:t,onChange:e=>{e.target.files&&r(e.target.files),e.target.value=""},style:{display:"none"},type:"file"})]})}let e8=[{value:"auto",label:"Original"},{value:"cover",label:"Cover"},{value:"contain",label:"Contain"}];

1function e9(e){let{colors:t,onChange:n,uniqueKey:r,colorSections:i}=e,o=eB(t.backgroundImage),[s,d]=(0,g.useState)(o),[c,u]=(0,g.useState)(()=>"gradient"===o?eU(t.backgroundImage):{...eO,from:t.backgroundColor||eO.from}),[m,x]=(0,g.useState)("from"),[p,f]=(0,g.useState)(()=>e$(t.backgroundImage)),[v,b]=(0,g.useState)(!1),j=(0,D.I)(),[y,w]=function(){let e=(0,g.useRef)(null),[t,n]=(0,g.useState)(null);return(0,g.useEffect)(()=>{let t=e.current;if(!t)return;let a=new ResizeObserver(()=>{n(t.getBoundingClientRect().height)});return a.observe(t),()=>a.disconnect()},[]),[e,t]}(),N=t.backgroundSize||"cover",I=(0,g.useMemo)(()=>J()(e=>n(e),100,{trailing:!0}),[n]);function k(e,t){if(!e)return void n({backgroundImage:"none"});n({backgroundImage:function(e){let t=e.replace(/\\/g,"\\\\").replace(/"/g,'\\"');return'url("'.concat(t,'")')}(e),backgroundSize:t,backgroundPosition:"center",backgroundRepeat:"no-repeat"})}function S(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],a={...c,...e};u(a);let r={backgroundImage:eH(a)};t?I(r):n(r)}async function z(e){let t=e[0];if(t){b(!0);try{let{hostedFileData:e}=await (0,eG.QM)({file:t});f(e.url),k(e.url,N)}catch(e){h.o.error("Failed to upload image")}finally{b(!1)}}}return(0,a.jsxs)(C.s,{direction:"column",gap:"3",children:[(0,a.jsxs)(eQ.I,{className:"w-full [&_[role=tablist]]:flex [&_[role=tablist]]:w-full",onValueChange:function(e){d(e),"solid"===e?n({backgroundImage:"none"}):"gradient"===e?n({backgroundImage:eH(c)}):k(p,N)},size:"1",value:s,children:[(0,a.jsx)(eQ.I.Item,{"aria-label":"Solid color",className:"flex-1",icon:(0,a.jsx)(e7,{Icon:e0,isActive:"solid"===s}),value:"solid"}),(0,a.jsx)(eQ.I.Item,{"aria-label":"Gradient",className:"flex-1",icon:(0,a.jsx)(e7,{Icon:e1,isActive:"gradient"===s}),value:"gradient"}),(0,a.jsx)(eQ.I.Item,{"aria-label":"Image",className:"flex-1",icon:(0,a.jsx)(e7,{Icon:e2,isActive:"image"===s}),value:"image"})]}),(0,a.jsx)(l.P.div,{animate:{height:null!=w?w:"auto"},className:"overflow-hidden",initial:!1,transition:{duration:.24*!j,ease:[.22,1,.36,1]},children:(0,a.jsxs)("div",{ref:y,className:"flex flex-col gap-3",children:["solid"===s&&(0,a.jsx)(ee.zi,{colorSections:i,onChange:e=>I({backgroundColor:e,backgroundImage:"none"}),onChangeEnd:e=>n({backgroundColor:e,backgroundImage:"none"}),value:te(t.backgroundColor)}),"gradient"===s&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(A.a,{"aria-hidden":!0,className:"h-6 w-full rounded-[var(--radius-2)] border border-solid border-[var(--gray-a5)]",style:{backgroundImage:eH(c)}}),(0,a.jsxs)(C.s,{gap:"2",children:[(0,a.jsx)("div",{className:"min-w-0 flex-1",children:(0,a.jsxs)(ei.l,{onValueChange:e=>S({type:e}),size:"1",value:c.type,children:[(0,a.jsx)(ei.l.Item,{value:"linear",children:"Linear"}),(0,a.jsx)(ei.l.Item,{value:"radial",children:"Radial"})]})}),(0,a.jsx)("div",{className:"w-[76px] shrink-0",children:(0,a.jsx)(Z.p,{className:"aurora",disabled:"radial"===c.type,onChange:e=>S({angle:Number(e.target.value.replace(/[^0-9.-]/g,""))||0}),size:"1",trailing:(0,a.jsx)("span",{className:"text-[11px] text-aurora-muted-foreground",children:"deg"}),type:"text",value:String(c.angle)})})]}),(0,a.jsxs)(C.s,{gap:"2",children:[(0,a.jsx)(tt,{color:c.from,isActive:"from"===m,label:"Start",onClick:()=>x("from")}),(0,a.jsx)(tt,{color:c.to,isActive:"to"===m,label:"End",onClick:()=>x("to")})]}),(0,a.jsx)(ee.zi,{colorSections:i,onChange:e=>S({[m]:e},!0),onChangeEnd:e=>S({[m]:e}),value:te(c[m])},m)]}),"image"===s&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(e3,{inputId:"visual-edit-fill-".concat(r),isUploading:v,onFiles:z,onRemove:function(){f(""),n({backgroundImage:"none"})},previewUrl:p,shouldReduceMotion:!!j}),(0,a.jsx)(Z.p,{className:"aurora w-full",leading:(0,a.jsx)(eZ.A,{className:"text-aurora-muted-foreground",size:13}),onChange:e=>{f(e.target.value),k(e.target.value,N)},placeholder:"Paste image URL",size:"1",value:p}),(0,a.jsxs)(C.s,{align:"center",gap:"2",justify:"between",children:[(0,a.jsx)(T.o.Text,{as:"span",className:"text-aurora-muted-foreground",size:"1",children:"Layout"}),(0,a.jsx)(ei.l,{className:"w-[136px]",onValueChange:e=>k(p,e),size:"1",value:N,children:e8.map(e=>(0,a.jsx)(ei.l.Item,{value:e.value,children:e.label},e.value))})]})]})]})})]})}function e7(e){let{Icon:t,isActive:n}=e,r=(0,D.I)();

1return(0,a.jsx)(l.P.span,{animate:{scale:n?1:.86,opacity:n?1:.6},className:"flex items-center justify-center",initial:!1,transition:r?{duration:0}:{type:"spring",stiffness:500,damping:30},children:(0,a.jsx)(t,{size:16})})}function te(e){return(0,et.qt)(e)?e:(0,et.by)(e)}function tt(e){let{color:t,isActive:n,label:r,onClick:i}=e;return(0,a.jsxs)("button",{className:(0,en.cn)("flex min-w-0 flex-1 cursor-pointer appearance-none items-center gap-2 rounded-[var(--radius-2)] border border-solid px-2 py-1.5 text-left text-xs transition-colors",n?"border-[var(--gray-a8)] bg-[var(--gray-a3)]":"border-[var(--gray-a5)] bg-transparent hover:bg-[var(--gray-a2)]"),onClick:i,type:"button",children:[(0,a.jsx)("span",{className:"h-4 w-4 shrink-0 rounded-[4px] border border-solid border-[var(--gray-a5)]",style:{background:t}}),(0,a.jsx)("span",{className:"truncate text-[var(--gray-11)]",children:r})]})}function tn(e){var t,n;let{colors:r,onChange:i,uniqueKey:o,artifactColorTokens:l,designSystemColorTokens:s}=e,d=eB(r.backgroundImage),c=(0,g.useRef)(null),[u,h]=(0,g.useState)(!1),[m,x]=(0,g.useState)(r.backgroundColor),p=(0,g.useRef)(r.backgroundColor);p.current!==r.backgroundColor&&(p.current=r.backgroundColor,x(r.backgroundColor));let f=(0,g.useMemo)(()=>{let e=[],t=(null!=s?s:[]).filter(e=>e.resolvedValue).map(e=>({name:e.path,hex:e.resolvedValue}));t.length>0&&e.push({sectionName:"Design System",colors:t});let n=(null!=l?l:[]).filter(e=>e.resolvedValue).map(e=>({name:e.path,hex:e.resolvedValue}));return n.length>0&&e.push({sectionName:"On this design",colors:n}),e.length>0?e:void 0},[s,l]);return(0,a.jsx)(eD.p,{ref:c,className:(0,en.cn)("aurora w-full","solid"!==d&&"cursor-pointer"),leading:(0,a.jsxs)(eF.bL,{onOpenChange:h,open:u,children:[(0,a.jsx)(eF.l9,{children:(0,a.jsx)(eP.a,{className:(0,en.cn)("h-4 w-4 cursor-pointer overflow-hidden rounded-[4px]","border border-solid border-aurora-border"),style:{background:"solid"===d?r.backgroundColor:void 0,backgroundImage:"solid"===d?void 0:r.backgroundImage,backgroundSize:"image"===d?"cover":void 0,backgroundPosition:"image"===d?"center":void 0,transition:"background-color 0.3s ease"}})}),(0,a.jsx)(eF.UC,{collisionPadding:16,onCloseAutoFocus:e=>{document.activeElement===c.current&&e.preventDefault()},onInteractOutside:e=>{var t;(null==(t=c.current)?void 0:t.contains(e.target))&&e.preventDefault()},onOpenAutoFocus:e=>e.preventDefault(),side:"right",sideOffset:8,style:{width:280,padding:12},children:(0,a.jsx)(e9,{colorSections:f,colors:r,onChange:i,uniqueKey:o})})]}),onBlur:()=>x(r.backgroundColor),onChange:e=>{if("solid"!==d)return;let t=e.target.value;x(t),function(e){let t=e.trim();return!!t&&(!!(0,et.Xe)(t)||"undefined"!=typeof CSS&&CSS.supports("background-color",t))}(t)&&i({backgroundColor:t})},onFocus:()=>h(!0),placeholder:"#000000",readOnly:"solid"!==d,size:"1",value:"solid"===d?m:(t=d,n=r.backgroundImage,"image"===t?e$(n).split("/").pop()||"Image":"radial"===eU(n).type?"Radial gradient":"Linear gradient")})}var ta=n(25592);let tr=[{value:"cover",label:"Cover"},{value:"contain",label:"Contain"},{value:"fill",label:"Stretch"},{value:"none",label:"Original"}];function ti(e){let{image:t,onChange:n,uniqueKey:r,canEditSrc:i=!0,onChangeImageWithAi:o}=e,l=(0,g.useRef)(null),[s,d]=(0,g.useState)(!1);return(0,a.jsx)(Z.p,{ref:l,readOnly:!0,className:"aurora w-full cursor-pointer",leading:(0,a.jsxs)(eF.bL,{onOpenChange:d,open:s,children:[(0,a.jsx)(eF.l9,{children:(0,a.jsx)(eP.a,{className:(0,en.cn)("h-4 w-4 cursor-pointer overflow-hidden rounded-[4px]","border border-solid border-aurora-border"),style:{...e4,...t.src?{backgroundImage:'url("'.concat(t.src,'")'),backgroundSize:"cover",backgroundPosition:"center"}:null}})}),(0,a.jsx)(eF.UC,{collisionPadding:16,onInteractOutside:e=>{var t;(null==(t=l.current)?void 0:t.contains(e.target))&&e.preventDefault()},onOpenAutoFocus:e=>e.preventDefault(),side:"right",sideOffset:8,style:{width:280,padding:12},children:(0,a.jsx)(to,{canEditSrc:i,image:t,onChange:n,onChangeImageWithAi:o,uniqueKey:r})})]}),onFocus:()=>d(!0),placeholder:"No image",size:"1",title:i?void 0:"This image comes from data in the code",value:t.src?"Image":""})}function to(e){let{image:t,onChange:n,uniqueKey:r,canEditSrc:i,onChangeImageWithAi:o}=e,[l,s]=(0,g.useState)(!1),d=(0,D.I)();async function c(e){let t=e[0];if(t){s(!0);try{let{hostedFileData:e}=await (0,eG.QM)({file:t});n({src:e.url})}catch(e){h.o.error("Failed to upload image")}finally{s(!1)}}}return(0,a.jsxs)(C.s,{direction:"column",gap:"3",children:[i?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(e3,{inputId:"visual-edit-src-".concat(r),isUploading:l,onFiles:c,onRemove:()=>n({src:""}),previewUrl:t.src,shouldReduceMotion:!!d}),(0,a.jsx)(Z.p,{className:"aurora w-full",leading:(0,a.jsx)(eZ.A,{className:"text-aurora-muted-foreground",size:13}),onChange:e=>n({src:e.target.value}),placeholder:"Paste image URL",size:"1",value:t.src})]}):(0,a.jsxs)(C.s,{direction:"column",gap:"2",children:[(0,a.jsx)(T.o.Text,{as:"span",className:"text-aurora-muted-foreground",size:"1",children:"This image comes from data in the code, so it can only be changed with the Agent."}),o&&(0,a.jsxs)(N.$,{onClick:o,size:"1",children:[(0,a.jsx)(ta.A,{size:12}),"Change with AI"]})]}),(0,a.jsxs)(C.s,{align:"center",gap:"2",justify:"between",children:[(0,a.jsx)(T.o.Text,{as:"span",className:"text-aurora-muted-foreground",size:"1",children:"Layout"}),(0,a.jsx)(ei.l,{className:"w-[136px]",onValueChange:e=>n({objectFit:e}

1),size:"1",value:t.objectFit||"fill",children:tr.map(e=>(0,a.jsx)(ei.l.Item,{value:e.value,children:e.label},e.value))})]})]})}function tl(e){let{colors:t,image:n,onChange:r,onImageChange:i,hasTextContent:o,isImageTag:l=!1,canEditSrc:d=!0,onChangeImageWithAi:c,dataId:u,artifactColorTokens:g=[],designSystemColorTokens:h=[]}=e;return(0,a.jsx)(Q,{title:"Colors",children:(0,a.jsxs)(s.s,{direction:"column",gap:"2",children:[o&&(0,a.jsx)(er.y,{label:"Text",children:(0,a.jsx)(ea,{artifactColorTokens:g,designSystemColorTokens:h,onChange:e=>r({textColor:e}),value:t.textColor})}),l?(0,a.jsx)(er.y,{label:"Image",children:(0,a.jsx)(ti,{canEditSrc:d,image:n,onChange:i,onChangeImageWithAi:c,uniqueKey:null!=u?u:"element"})}):(0,a.jsx)(er.y,{label:"Fill",children:(0,a.jsx)(tn,{artifactColorTokens:g,colors:t,designSystemColorTokens:h,onChange:r,uniqueKey:null!=u?u:"element"})})]})})}var ts=n(12980),td=n(85914),tc=n(40528),tu=n(3457),tg=n(9977),th=n(12355),tm=n(60942),tx=n(71689),tp=n(6438);let tf=["12","14","16","18","20","24","28","32","36","40","48","56","64","72","80","96"],tv=[{value:"left",label:"Align left",Icon:tc.A},{value:"center",label:"Align center",Icon:tu.A},{value:"right",label:"Align right",Icon:tg.A},{value:"justify",label:"Justify",Icon:th.A}],tb=[{value:"italic",label:"Italic",Icon:tm.A},{value:"line-through",label:"Strikethrough",Icon:tx.A}],tj="shadow-[inset_0_1px_2px_0_rgba(15,23,42,0.10),inset_-1px_-1px_0_0_rgba(255,255,255,0.7)]";function ty(e){var t;let{typography:n,onChange:r,designSystemFonts:i=[],textValue:o,textEditBlockedReason:s,canEditText:d=!1,onTextChange:c,onTextCommit:u,onChangeTextWithAi:h}=e,[m,x]=(0,g.useState)(!1),f=(0,g.useRef)(null),v=null!=o?o:n.content;(0,g.useLayoutEffect)(()=>{let e=f.current;if(!e)return;e.style.height="auto";let t=e.offsetHeight-e.clientHeight;e.style.height="".concat(e.scrollHeight+t,"px")},[v]);let b="italic"===n.fontStyle,j=(null!=(t=n.textDecorationLine)?t:"").includes("line-through"),y=[...b?["italic"]:[],...j?["line-through"]:[]];return(0,a.jsx)(Q,{title:"Typography",children:(0,a.jsxs)(C.s,{direction:"column",gap:"2",children:[(0,a.jsx)(er.y,{alignTop:!0,label:"Value",children:(0,a.jsx)(td.T,{ref:f,className:"aurora max-h-40 w-full",disabled:!!s,onBlur:u,onChange:e=>null==c?void 0:c(e.target.value),readOnly:!d,rows:1,size:"1",title:d||s?void 0:"Double-click in the preview to edit",value:v})}),s&&(0,a.jsxs)(C.s,{align:"center",className:"aurora-sheen-tint my-2 rounded-lg bg-amber-muted py-2.5 pl-2.5 pr-1.5 shadow-aurora-control-soft",gap:"2",justify:"between",children:[(0,a.jsx)(T.o.Text,{as:"span",className:"min-w-0 truncate",size:"1",title:"shared-component"===s?"This text comes from a shared component and can’t be edited here.":"This text can’t be edited directly.",children:"shared-component"===s?"From a shared component":"Can’t be edited directly"}),h&&(0,a.jsxs)(N.$,{className:"shrink-0",onClick:h,size:"1",children:[(0,a.jsx)(ta.A,{size:12}),"Change with AI"]})]}),(0,a.jsx)(E.RU,{designSystemFonts:i,fontWeight:n.fontWeight,onChange:function(e){e.isDesignSystem&&e.weight?r({fontFamily:e.family,fontWeight:e.weight}):r({fontFamily:e.family})},value:n.fontFamily}),(0,a.jsx)(er.y,{label:"Weight",children:(0,a.jsx)(ei.l,{onValueChange:e=>r({fontWeight:e}),size:"1",value:n.fontWeight,children:p.qI.map(e=>(0,a.jsx)(ei.l.Item,{value:e.value,children:(0,a.jsx)("span",{style:{fontFamily:(0,p.Ct)(n.fontFamily),fontWeight:Number(e.value)},children:e.label})},e.value))})}),(0,a.jsx)(er.y,{label:"Size",children:(0,a.jsx)(Z.p,{className:"aurora w-full",onChange:e=>r({fontSize:e.target.value}),size:"1",trailing:(0,a.jsx)(ts.A,{align:"end",className:"aurora max-h-[240px] min-w-[72px] overflow-y-auto p-1",onOpenChange:x,open:m,side:"bottom",sideOffset:6,trigger:(0,a.jsx)("button",{"aria-label":"Font sizes",className:"flex h-4 w-4 cursor-pointer appearance-none items-center justify-center border-0 bg-transparent p-0 text-aurora-muted-foreground transition-colors hover:text-aurora-foreground",type:"button",children:(0,a.jsx)(K.A,{size:12})}),children:tf.map(e=>{let t=n.fontSize===e;return(0,a.jsxs)("button",{className:(0,en.cn)("flex w-full cursor-pointer appearance-none items-center gap-2 rounded-lg border-0 bg-transparent px-2 py-1.5 text-left text-[13px] text-aurora-foreground transition-colors hover:bg-matrix-muted",t&&"font-medium"),onClick:()=>{r({fontSize:e}),x(!1)},type:"button",children:[(0,a.jsx)("span",{className:"flex h-4 w-4 shrink-0 items-center justify-center",children:t&&(0,a.jsx)(tp.A,{size:14})}),(0,a.jsx)("span",{children:e})]},e)})}),value:n.fontSize})}),(0,a.jsx)(er.y,{label:"Style",children:(0,a.jsx)(el.Root,{className:(0,en.cn)("inline-flex gap-2 rounded-lg bg-matrix-muted p-0.5",tj),onValueChange:function(e){let t={},a=e.includes("italic");a!==b&&(t.fontStyle=a?"italic":"normal");let i=e.includes("line-through");i!==j&&(t.textDecorationLine=function(e,t){let n=(null!=e?e:"").split(/\s+/).filter(e=>e&&"none"!==e&&"line-through"!==e);return t&&n.push("line-through"),n.length>0?n.join(" "):"none"}(n.textDecorationLine,i)),Object.keys(t).length>0&&r(t)},rovingFocus:!1,type:"multiple",value:y,children:tb.map(e=>{let{value:t,label:n,Icon:r}=e,i=y.includes(t);return(0,a.jsx)(el.Item,{"aria-label":n,className:(0,en.cn)("flex h-7 w-7 items-center justify-center rounded-md transition-colors duration-200",i?"aurora-glass bg-white text-aurora-foreground shadow-aurora-sm":"text-aurora-muted-foreground hover:text-aurora-foreground"),value:t,children:(0,a.jsx)(r,{size:14,strokeWidth:2.5})},t)})})}),(0,a.jsx)(er.y,{label:"Align",children:(0,a.jsxs)(el.Root,{className:(0,en.cn)("relative inline-flex gap-2 rounded-lg bg-matrix-muted p-0.5",tj),onValueChange:e=>{e&&r({textAlign:e})},rovingFocus:!1,type:"single",value:n.textAlign||"left",children:[(0,a.jsx)(l.P.div,{animate:{x:36*Math.max(tv.findIndex(e=>e.value===(n.textAlign||"left")),0)}

1,className:"aurora-glass shadow-aurora-sm",style:{position:"absolute",zIndex:5,top:2,left:2,width:28,height:28,borderRadius:"0.375rem",background:"white"},transition:{type:"spring",stiffness:500,damping:35}}),tv.map(e=>{let{value:t,label:r,Icon:i}=e,o=(n.textAlign||"left")===t;return(0,a.jsx)(el.Item,{"aria-label":r,className:"flex h-7 w-7 items-center justify-center rounded-md transition-colors duration-200 ".concat(o?"text-aurora-foreground":"text-aurora-muted-foreground hover:text-aurora-foreground"),value:t,children:(0,a.jsx)("span",{className:"relative z-10",children:(0,a.jsx)(i,{size:14,strokeWidth:2.5})})},t)})]})})]})})}function tw(e){let{properties:t,initialProperties:n,onPropertiesChange:r,designSystemFonts:i=[],display:o,parentDisplay:l,parentFlexDirection:s,artifactColorTokens:d=[],designSystemColorTokens:c=[],tagName:u,dataId:h,textValue:m,textEditBlockedReason:x,canEditSrc:p=!0,canEditText:f=!1,onTextChange:v,onTextCommit:b,onChangeTextWithAi:j,onChangeImageWithAi:y}=e,w=(0,g.useMemo)(()=>JSON.stringify(t)!==JSON.stringify(n),[t,n]);return(0,a.jsx)(C.s,{className:"aurora",direction:"column",style:{flexGrow:1,minHeight:0,position:"relative"},children:(0,a.jsx)(L.F,{className:"absolute inset-0",children:(0,a.jsxs)(A.a,{py:"0",children:[n.typography.content&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(ty,{canEditText:f,designSystemFonts:i,onChange:e=>r({typography:e}),onChangeTextWithAi:j,onTextChange:v,onTextCommit:b,textEditBlockedReason:x,textValue:m,typography:t.typography}),(0,a.jsx)(k.w,{})]}),(0,a.jsx)(tl,{artifactColorTokens:d,canEditSrc:p,colors:t.colors,dataId:h,designSystemColorTokens:c,hasTextContent:!!n.typography.content,image:t.image,isImageTag:(null==u?void 0:u.toLowerCase())==="img",onChange:e=>r({colors:e}),onChangeImageWithAi:y,onImageChange:e=>r({image:e})}),(0,a.jsx)(k.w,{}),(0,a.jsx)(eW,{artifactColorTokens:d,border:t.border,designSystemColorTokens:c,onChange:e=>r({border:e})}),(0,a.jsx)(k.w,{}),(0,a.jsx)(eR,{display:o,initialSpacing:n.spacing,onChange:e=>r({spacing:e}),parentDisplay:l,parentFlexDirection:s,spacing:t.spacing,tagName:u}),w&&(0,a.jsx)(A.a,{style:{height:64}})]})})})}var tN=n(91374);function tC(e){let t=e.match(/^([\d.]+)/);return t?t[1]:""}function tI(e){if(!e)return"";if("auto"===e)return"auto";let t=e.match(/^(-?[\d.]+)/);return t?String(Math.round(Number(t[1]))):""}let tk={0:0,"0.5":2,1:4,"1.5":6,2:8,"2.5":10,3:12,"3.5":14,4:16,5:20,6:24,7:28,8:32,9:36,10:40,11:44,12:48,14:56,16:64,20:80,24:96,28:112,32:128,36:144,40:160,44:176,48:192,52:208,56:224,60:240,64:256,72:288,80:320,96:384};function tT(e,t){return new RegExp("(^|[\\s\"'`{])".concat(t,"([\\s\"'`}]|$)")).test(e)}function tS(e,t){if(tT(e,"".concat(t,"-full")))return"100%";if(tT(e,"".concat(t,"-fit")))return"fit-content";if(tT(e,"".concat(t,"-auto")))return"auto";let n=e.match(new RegExp("".concat("w"===t?"width":"height",":\\s*['\"`](100%|fit-content|auto)['\"`]")));return n?n[1]:""}function tz(e,t){let n=e.match(new RegExp("space-".concat(t,"-\\[(\\d+)px\\]")));if(n)return n[1];let a=e.match(new RegExp("space-".concat(t,"-(\\d+(?:\\.\\d+)?)")));return a&&void 0!==tk[a[1]]?String(tk[a[1]]):""}function tE(e){var t;let n=e.trim();return(0,et.Zf)(n)||(0,et.hY)(n)?n:null!=(t=(0,et.sC)(n))?t:n}var tA=n(46467);let tL=new Set(["h1","h2","h3","h4","h5","h6","p","span","a","li","label","strong","em","small"]),t_=[];function tM(e){var t,n,r;let{style:i,onSaveComplete:o,onChangeTextWithAi:l,onChangeImageWithAi:N}=e,{codeVisualEditData:C,setCodeVisualEditData:I,isEditModeOn:k,setIsEditModeOn:T,setVisualEditState:S,pendingReference:A,setPendingReference:L,visualEditEntries:_,getVisualEditEntries:M,recordVisualEdit:R,clearVisualEditSession:W,resetPreviewRef:D}=(0,f.e1)(),{iframeRef:F}=(0,v.mi)(),{sourceFiles:P,designSystemStylingFiles:O=t_,canSave:V,save:B}=(0,b.dS)(),U=(0,g.useMemo)(()=>{var e,t,n,a;if(0===O.length)return[];let r=null!=(n=null==(e=O.find(e=>e.filename===d.INDEX_CSS_FILENAME))?void 0:e.content)?n:"",i=null!=(a=null==(t=O.find(e=>e.filename===d.TAILWIND_CONFIG_FILENAME))?void 0:t.content)?a:"";if(!r&&!i)return[];let o=new Set;return(0,x.xb)(r,i).variables.filter(e=>!(!e.resolvedValue||o.has(e.resolvedValue))&&(o.add(e.resolvedValue),!0))},[O]),H=(0,g.useMemo)(()=>{var e,t,n,a;if(0===P.length)return[];let r=null!=(n=null==(e=P.find(e=>e.name.endsWith(d.INDEX_CSS_FILENAME)))?void 0:e.code)?n:"",i=null!=(a=null==(t=P.find(e=>e.name.endsWith(d.TAILWIND_CONFIG_FILENAME)))?void 0:t.code)?a:"";if(!r&&!i)return[];let o=new Set(U.map(e=>e.path)),l=new Set(U.map(e=>

1e.resolvedValue).filter(Boolean)),s=new Set;return(0,x.xb)(r,i).variables.filter(e=>!(o.has(e.path)||!e.resolvedValue||l.has(e.resolvedValue)||s.has(e.resolvedValue))&&(s.add(e.resolvedValue),!0))},[P,U]),$=(0,j.x)(),{getStagedSource:X}=(0,w.v)(),[q,Y]=(0,g.useState)({}),K=(0,g.useMemo)(()=>(0,tA.LC)(_),[_]),Q=(0,g.useMemo)(()=>(0,tA.Eo)(_),[_]),Z=(0,g.useMemo)(()=>{if(!C)return tA.L6;let e=C.dataId,t=q[e]||tA.L6,n=K[e];return n?{typography:{...t.typography,...n.typography},colors:{...t.colors,...n.colors},image:{...t.image,...n.image},spacing:{...t.spacing,...n.spacing},border:{...t.border,...n.border}}:t},[C,q,K]),G=C?"".concat(C.dataId,":").concat(C.instanceIndex):"",J=null!=(n=null==(t=Q[G])?void 0:t.newText)?n:Z.typography.content,[ee,et]=(0,g.useState)(null),[en,ea]=(0,g.useState)(!1);(0,g.useEffect)(()=>{if(!C)return;let e=C.dataId,t=q[e];if(!t||C.isListItem&&t.typography.content!==C.directTextContent){let t=function(e,t,n,a,r){let i={typography:{content:"",fontFamily:"Inter",fontSize:"",fontWeight:"",fontStyle:"normal",textDecorationLine:"none",textAlign:""},colors:{textColor:"",backgroundColor:"",backgroundImage:"none",backgroundSize:"",backgroundPosition:"",backgroundRepeat:""},image:{src:null!=r?r:"",objectFit:""},spacing:{paddingTop:"",paddingBottom:"",paddingLeft:"",paddingRight:"",marginTop:"",marginBottom:"",marginLeft:"",marginRight:"",gap:"",width:"",height:"",widthSizing:"",heightSizing:"",flex:"",position:"",left:"",right:"",top:"",bottom:"",display:"",flexDirection:"",alignItems:"",justifyContent:"",spaceX:"",spaceY:""},border:{topWidth:"",rightWidth:"",bottomWidth:"",leftWidth:"",color:"",style:""}};if(a&&(i.typography.content=a),n){n.fontSize&&(i.typography.fontSize=tC(n.fontSize)),n.fontWeight&&(i.typography.fontWeight=n.fontWeight),n.fontStyle&&(i.typography.fontStyle=n.fontStyle.startsWith("normal")?"normal":"italic"),n.textDecorationLine&&(i.typography.textDecorationLine=n.textDecorationLine),n.fontFamily&&(i.typography.fontFamily=n.fontFamily.replace(/["']/g,"").split(",")[0].trim()),n.color&&"rgba(0, 0, 0, 0)"!==n.color&&(i.colors.textColor=tE(n.color)),n.backgroundColor&&"rgba(0, 0, 0, 0)"!==n.backgroundColor&&(i.colors.backgroundColor=tE(n.backgroundColor)),n.backgroundImage&&(i.colors.backgroundImage=n.backgroundImage),n.backgroundSize&&(i.colors.backgroundSize=n.backgroundSize),n.backgroundPosition&&(i.colors.backgroundPosition=n.backgroundPosition),n.backgroundRepeat&&(i.colors.backgroundRepeat=n.backgroundRepeat),n.objectFit&&(i.image.objectFit=n.objectFit);let e=tC(n.paddingTop||""),t=tC(n.paddingRight||""),a=tC(n.paddingBottom||""),r=tC(n.paddingLeft||"");(e||t||a||r)&&(i.spacing.paddingTop=e?String(e):"",i.spacing.paddingBottom=a?String(a):"",i.spacing.paddingLeft=r?String(r):"",i.spacing.paddingRight=t?String(t):"");let o=tC(n.marginTop||""),l=tC(n.marginRight||""),s=tC(n.marginBottom||""),d=tC(n.marginLeft||"");(o||l||s||d)&&(i.spacing.marginTop=o?String(o):"",i.spacing.marginBottom=s?String(s):"",i.spacing.marginLeft=d?String(d):"",i.spacing.marginRight=l?String(l):"");let c=tC(n.gap||"");c&&(i.spacing.gap=String(c));let u=tC(n.width||"");u&&(i.spacing.width=String(Math.round(Number(u))));let g=tC(n.height||"");if(g&&(i.spacing.height=String(Math.round(Number(g)))),n.position&&(i.spacing.position=n.position),i.spacing.left=tI(n.left||""),i.spacing.right=tI(n.right||""),i.spacing.top=tI(n.top||""),i.spacing.bottom=tI(n.bottom||""),n.textAlign){let e="start"===n.textAlign?"left":"end"===n.textAlign?"right":n.textAlign;i.typography.textAlign=e}n.display&&(i.spacing.display=n.display),n.flexDirection&&(i.spacing.flexDirection=n.flexDirection),n.alignItems&&(i.spacing.alignItems=n.alignItems),n.justifyContent&&(i.spacing.justifyContent=n.justifyContent),i.border.topWidth=tC(n.borderTopWidth||""),i.border.rightWidth=tC(n.borderRightWidth||""),i.border.bottomWidth=tC(n.borderBottomWidth||""),i.border.leftWidth=tC(n.borderLeftWidth||""),n.borderColor&&"rgba(0, 0, 0, 0)"!==n.borderColor&&(i.border.color=tE(n.borderColor)),n.borderStyle&&(i.border.style=n.borderStyle)}if(e){let t=tz(e,"x");t&&(i.spacing.spaceX=t);let n=tz(e,"y");n&&(i.spacing.spaceY=n),i.spacing.widthSizing=tS(e,"w"),i.spacing.heightSizing=tS(e,"h"),i.spacing.flex=function(e){if(tT(e,"flex-1"))return"1 1 0%";if(tT(e,"grow"))return"1 1 auto";let t=e.match(/flex:\s*['"`]([^'"`]+)['"`]/);return t?t[1]:""}(e)}return i}(C.specificCodeSnippet,C.htmlSnippet,C.computedStyles,C.directTextContent,C.srcAttribute);Y(n=>({...n,[e]:t}))}},[C,q]);let er=(0,g.useCallback)(e=>{var t,n,a;let{dataId:r,originalText:i,textContent:o,isListItem:l,instanceIndex:s,ephemeralId:d,cloneToken:u}=e;if(!u&&C&&r===C.dataId){let e=(0,c.Ze)({sourceFiles:P,dataId:r}),n=e?(0,tA.lJ)({usages:e.usages,propName:e.propName,domText:i,entries:M(),requireTextMatch:e.hasUnresolvableUsages}):null;if(n&&e)return R({kind:"prop-text",usageDataId:n.dataId,propName:e.propName,originalText:i,newText:o,ephemeralId:d}),!0;if((0,tA.e6)({candidates:(0,c.UU)({sourceFiles:P,dataId:r}),domText:i,dataId:r,entries:M()}))return R({kind:"literal-text",dataId:r,originalText:i,newText:o,ephemeralId:d}),!0;if(e)return d&&(null==(t=F.current)?void 0:t.contentWindow)&&F.current.contentWindow.postMessage({type:"SET_INSTANCE_TEXT",ephemeralId:d,textContent:i},"*"),!1}if(u&&C){let e=_.find(e=>"duplicate"===e.kind&&e.reorderToken===u);

1return!!e&&"duplicate"===e.kind&&(null===(0,c.Sx)({sourceFiles:P,dataId:r,instanceIndex:e.instanceIndex,newText:o})?(d&&(null==(n=F.current)?void 0:n.contentWindow)&&F.current.contentWindow.postMessage({type:"SET_INSTANCE_TEXT",ephemeralId:d,textContent:i},"*"),h.o.info("That text has fixed parts (like a separator) that need to stay — reverted."),!1):(R({kind:"clone-list-text",duplicateToken:u,dataId:r,originalText:i,newText:o,ephemeralId:d}),!0))}return l&&C&&r===C.dataId?null===(0,c.Sx)({sourceFiles:P,dataId:r,instanceIndex:s,newText:o})?(d&&(null==(a=F.current)?void 0:a.contentWindow)&&F.current.contentWindow.postMessage({type:"SET_INSTANCE_TEXT",ephemeralId:d,textContent:i},"*"),h.o.info("That text has fixed parts (like a separator) that need to stay — reverted."),!1):(R({kind:"list-text",dataId:r,instanceIndex:s,originalText:i,newText:o,ephemeralId:d}),!0):!l&&!!C&&r===C.dataId&&(R({kind:"template-text",dataId:r,ephemeralId:d,originalText:i,newText:o}),!0)},[P,C,M,F,R,_]);(0,g.useEffect)(()=>{function e(e){var t,n,a,r,i,o,l,s,d,c,u,g,h,m,x,p;if(null==C||!C.isPendingClone){if("RESIZE_COMMITTED"===e.data.type){let{dataId:i,width:o,height:l}=e.data;if(C&&i===C.dataId){let e=null==(t=K[i])?void 0:t.spacing,s=(null!=(n=q[i])?n:tA.L6).spacing;R({kind:"style",dataId:i,changes:{spacing:{...o?{width:o}:{},...l?{height:l}:{}}},revert:{spacing:{...o?{width:null!=(a=null==e?void 0:e.width)?a:s.width}:{},...l?{height:null!=(r=null==e?void 0:e.height)?r:s.height}:{}}}})}}if("MOVE_COMMITTED"===e.data.type){let{dataId:t,left:n,top:a,right:r,bottom:u}=e.data;if(C&&t===C.dataId){let e=null==(i=K[t])?void 0:i.spacing,g=(null!=(o=q[t])?o:tA.L6).spacing;R({kind:"style",dataId:t,changes:{spacing:{left:n,top:a,right:r,bottom:u}},revert:{spacing:{left:null!=(l=null==e?void 0:e.left)?l:g.left,top:null!=(s=null==e?void 0:e.top)?s:g.top,right:null!=(d=null==e?void 0:e.right)?d:g.right,bottom:null!=(c=null==e?void 0:e.bottom)?c:g.bottom}}})}}if("PADDING_COMMITTED"===e.data.type){let{dataId:t,side:n,value:a}=e.data;if(C&&t===C.dataId){let e=null==(u=K[t])?void 0:u.spacing,r=(null!=(g=q[t])?g:tA.L6).spacing;R({kind:"style",dataId:t,changes:{spacing:{[n]:a}},revert:{spacing:{[n]:null!=(h=null==e?void 0:e[n])?h:r[n]}}})}}if("GAP_COMMITTED"===e.data.type){let{dataId:t,value:n}=e.data;if(C&&t===C.dataId){let e=null==(m=K[t])?void 0:m.spacing,a=(null!=(x=q[t])?x:tA.L6).spacing;R({kind:"style",dataId:t,changes:{spacing:{gap:n}},revert:{spacing:{gap:null!=(p=null==e?void 0:e.gap)?p:a.gap}}})}}if("TEXT_NODE_EDIT_COMMITTED"===e.data.type){let{dataId:t,childIndex:n,originalText:a,textContent:r,reorderToken:i}=e.data;C&&t===C.dataId&&R({kind:"text-node-edit",containerDataId:t,childIndex:n,originalText:a,newText:r,reorderToken:i});return}if("PLACEHOLDER_EDIT_COMMITTED"===e.data.type){let{dataId:t,originalText:n,textContent:a,ephemeralId:r}=e.data;C&&t===C.dataId&&R({kind:"prop-text",usageDataId:t,propName:"placeholder",originalText:n,newText:a,ephemeralId:r});return}if("TEXT_EDIT_COMMITTED"===e.data.type){let{dataId:t,originalText:n,textContent:a,isListItem:r,instanceIndex:i,ephemeralId:o,cloneToken:l}=e.data;er({dataId:t,originalText:n,textContent:a,isListItem:r,instanceIndex:i,ephemeralId:o,cloneToken:l})}}}return window.addEventListener("message",e),()=>window.removeEventListener("message",e)});let ei=(0,g.useCallback)(e=>{var t,n,a;if(!C||!(null==(t=F.current)?void 0:t.contentWindow))return;let r=(0,tA.Nw)(e),i=(0,tA.Sp)(e),o=e.typography&&"content"in e.typography?e.typography.content:void 0,l={};r.spaceX&&(l.spaceX=r.spaceX,delete r.spaceX),r.spaceY&&(l.spaceY=r.spaceY,delete r.spaceY),F.current.contentWindow.postMessage({type:"UPDATE_ELEMENT_STYLE",dataId:C.dataId,styles:r,spaceStyles:Object.keys(l).length>0?l:void 0,textContent:o,attributes:Object.keys(i).length>0?i:void 0},"*");let s=null==(n=e.typography)?void 0:n.fontFamily;if(s&&s!==E.zs&&!p.tF.includes(s)){let e=(a=s,$.find(e=>((0,p.gU)(e.value)?(0,p.bD)(e.value):e.value)===a));if(e&&(0,p.gU)(e.value)&&(0,p.xn)(e.value)){let t=(0,p.bD)(e.value);F.current.contentWindow.postMessage({type:"INJECT_FONT_CSS",css:"@font-face {\n  font-family: '".concat(t,"';\n  src: url('").concat(e.value,"');\n  font-display: swap;\n}"),id:e.value},"*")}else e&&(0,p.gU)(e.value)?F.current.contentWindow.postMessage({type:"INJECT_URL_FONT",href:e.value},"*"):F.current.contentWindow.postMessage({type:"INJECT_URL_FONT",href:(0,p.kq)(s)},"*")}},[C,F,$]),eo=(0,g.useCallback)(e=>{if(!C||C.isPendingClone)return;let t=C.dataId,n=K[t],a=q[t]||tA.L6,r={},i=[];for(let t of["typography","colors","image","spacing","border"]){let s=e[t];if(!s)continue;let d={};for(let e of Object.keys(s)){var o,l;i.push("".concat(t,".").concat(e)),d[e]=null!=(l=null==n||null==(o=n[t])?void 0:o[e])?l:a[t][e]}r[t]=d}i.length>0&&R({kind:"style",dataId:t,changes:e,revert:r,coalesceKey:"scrub:".concat(t,":").concat(i.join(","))}),ei(e)},[C,K,q,R,ei]),el=(0,g.useCallback)(e=>{var t;if(!C||C.isPendingClone)return;let{dataId:n,instanceIndex:a,isListItem:r,ephemeralId:i}=C,o="".concat(n,":").concat(a);et(t=>(null==t?void 0:t.key)===o?{...t,value:e}:{key:o,original:J,value:e});let l=null==(t=F.current)?void 0:t.contentWindow;l&&(r&&i?l.postMessage({type:"SET_INSTANCE_TEXT",ephemeralId:i,textContent:e},"*"):l.postMessage({type:"UPDATE_ELEMENT_STYLE",dataId:n,textContent:e},"*"))},[C,J,F]),es=(0,g.useCallback)(()=>

1{if(!C||C.isPendingClone)return;let{dataId:e,instanceIndex:t,isListItem:n,ephemeralId:a}=C,r="".concat(e,":").concat(t);if((null==ee?void 0:ee.key)!==r||ee.value===ee.original)return;let i=er({dataId:e,originalText:ee.original,textContent:ee.value,isListItem:n,instanceIndex:t,ephemeralId:a})?ee.value:ee.original;et({key:r,original:i,value:i})},[C,er,ee]),ed=(0,g.useCallback)(()=>{let e=D.current;if(e)e();else{var t;let e=null==(t=F.current)?void 0:t.contentWindow;if(e)for(let t of[...M()].reverse())(0,tN.C)({entry:t,frame:e})}et(null),W(),I(null),L(null)},[F,M,W,D,I,L]),ec=(0,g.useCallback)(async()=>{if(!V)return!1;let e=X();if("error"===e.status)return console.error("[VisualEdit] ".concat(e.message)),u.Cp("[EditorVisualEditPanel] Failed to stage changes: ".concat(e.message)),h.o.error("Failed to save changes"),!1;let{dirtyFiles:t,idRemap:n,files:a}=e.staged;if(0===t.length)return h.o.info("No changes to save"),!1;ea(!0),S({isSaving:!0});let r=!1;try{let e=function(e){var t;let{reference:n,entries:a,idRemap:r,stagedFiles:i}=e;if(!(null==n?void 0:n.dataId))return n;if(a.some(e=>{var t;return"delete"===e.kind&&!e.isListItem&&(null!=(t=e.removedIds)?t:[e.dataId]).includes(n.dataId)}))return null;let o=null!=(t=r.get(n.dataId))?t:n.dataId,l=(0,y.E)({dataId:o,sourceFiles:i});if(!l)return n;let s=i.find(e=>e.name===l.fileName);return s?{...n,dataId:o,specificCodeSnippet:s.code.slice(l.start,l.end)}:n}({reference:A,entries:M(),idRemap:n,stagedFiles:a});await B(t),h.o.success("Changes saved"),m.j.track(d.EVENTS.EDITOR_ROOM.VISUAL_EDIT_SAVE),I(null),Y({}),et(null),L(e),W(),null==o||o(),r=!0}catch(e){console.error(e),u.Cp("[EditorVisualEditPanel] Failed to save changes: ".concat(e)),h.o.error("Failed to save changes")}finally{ea(!1),S({isSaving:!1})}return r},[V,X,M,S,A,I,L,W,o,B]);if((0,g.useEffect)(()=>{S({onSave:ec,onReset:ed})},[ec,ed,S]),!C)return(0,a.jsx)(s.s,{align:"center",direction:"column",justify:"center",p:"4",style:{flexGrow:1,...i},children:(0,a.jsx)(z,{isEditModeOn:k,onEnableEditMode:()=>T(!0)})});let eu=q[C.dataId]||tA.L6,eg=!C.isPendingClone&&!C.textEditBlockedReason&&(!C.isListItem||tL.has(C.tagName));return(0,a.jsx)(s.s,{direction:"column",style:{flexGrow:1,minHeight:0,overflow:"hidden",...i},children:(0,a.jsx)(tw,{artifactColorTokens:H,canEditSrc:null!=(r=C.canEditSrc)&&r,canEditText:eg,dataId:C.dataId,designSystemColorTokens:U,designSystemFonts:$,display:Z.spacing.display||C.computedStyles.display,initialProperties:eu,onChangeImageWithAi:N,onChangeTextWithAi:l,onPropertiesChange:eo,onTextChange:el,onTextCommit:es,parentDisplay:C.computedStyles.parentDisplay,parentFlexDirection:C.computedStyles.parentFlexDirection,properties:Z,tagName:C.tagName,textEditBlockedReason:C.textEditBlockedReason,textValue:(null==ee?void 0:ee.key)===G?ee.value:J})})}let tR={duration:.18,ease:[.22,1,.36,1]};function tW(e){var t,n;let{codeVisualEditData:r}=e,{iframeRef:s}=(0,v.mi)(),[d,c]=(0,g.useState)(!1),u=(0,D.I)(),h=(0,g.useCallback)(e=>{var t,n;null==(n=s.current)||null==(t=n.contentWindow)||t.postMessage(e,"*")},[s]),m=(0,g.useCallback)(e=>{var t;h({type:"HOVER_ELEMENT_BY_ID",dataId:null!=(t=null==e?void 0:e.dataId)?t:null,ephemeralId:null==e?void 0:e.ephemeralId})},[h]),x=(0,g.useCallback)(e=>{c(!1),h({type:"SELECT_ELEMENT_BY_ID",dataId:e.dataId,ephemeralId:e.ephemeralId})},[h]),p=(0,g.useCallback)(e=>{c(e),e||m(null)},[m]),f=function(e){let t=[...[...e.ancestors].reverse(),{dataId:e.dataId,tagName:e.tagName,fileName:e.fileName}];return t.map((e,n)=>({dataId:e.dataId,tagName:e.tagName,ephemeralId:"ephemeralId"in e?e.ephemeralId:void 0,fileName:e.fileName,hidesFileName:n>0&&e.fileName===t[n-1].fileName,isCurrent:n===t.length-1}))}(r),b=f.slice(-4),j=f.length>b.length;return(0,a.jsxs)(C.s,{align:"center",className:"min-h-7 shrink-0 overflow-hidden border-b border-solid border-aurora-border bg-matrix-muted",gap:"0",onMouseLeave:()=>m(null),px:"2",py:"0",children:[j&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(ts.A,{align:"start",className:"w-[320px] max-w-[90vw] p-1",onOpenChange:p,open:d,side:"bottom",sideOffset:6,trigger:(0,a.jsx)(N.$,{"aria-label":"Show full element hierarchy",className:(0,en.cn)(tF,"hover:bg-matrix-muted-hover"),color:"matrix",size:"1",variant:"ghost",children:(0,a.jsx)(i.Oer,{height:13,width:13})}),children:(0,a.jsx)(L.F,{maxHeight:320,children:(0,a.jsx)(C.s,{direction:"column",gap:"1",onMouseLeave:()=>m(null),children:f.map((e,t)=>{var n;return(0,a.jsx)(tO,{depth:t,entry:e,onHover:m,onSelect:x},"".concat(e.dataId,"-").concat(null!=(n=e.ephemeralId)?n:t))})})})}),(0,a.jsx)(tD,{})]}),(0,a.jsx)(o.N,{initial:!1,mode:"popLayout",children:b.map((e,t)=>{var n;

1return(0,a.jsxs)(l.P.div,{animate:{opacity:1,x:0},className:"flex shrink-0 items-center",exit:{opacity:0,x:8*!u},initial:{opacity:0,x:u?0:-8},layout:"position",transition:tR,children:[t>0&&(0,a.jsx)(tD,{}),(0,a.jsx)(tP,{entry:e,onHover:m,onSelect:x})]},"".concat(e.dataId,"-").concat(null!=(n=e.ephemeralId)?n:t))})}),(0,a.jsx)(l.P.div,{className:"flex min-w-0 items-center pl-1.5",layout:"position",transition:tR,children:(0,a.jsx)(T.o.Text,{subtle:!0,as:"span",className:"truncate",size:"1",title:r.fileName,children:null!=(n=(t=r.fileName).split("/").pop())?n:t})})]})}function tD(){return(0,a.jsx)(T.o.Text,{"aria-hidden":!0,subtle:!0,as:"span",className:"shrink-0 select-none px-0.5",size:"1",children:"›"})}let tF="h-5 shrink-0 rounded px-1 font-mono text-xs";function tP(e){let{entry:t,onHover:n,onSelect:r}=e;return t.isCurrent?(0,a.jsx)(T.o.Text,{as:"span",className:(0,en.cn)(tF,"aurora-sheen-tint flex items-center bg-matrix-muted-active text-aurora-foreground shadow-aurora-control-soft"),size:"1",children:t.tagName}):(0,a.jsx)(N.$,{className:(0,en.cn)(tF,"hover:bg-matrix-muted-hover"),color:"matrix",onClick:()=>r(t),onFocus:()=>n(t),onMouseEnter:()=>n(t),size:"1",title:t.fileName,variant:"ghost",children:t.tagName})}function tO(e){let{entry:t,depth:n,onHover:r,onSelect:i}=e,o=(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(T.o.Text,{as:"span",className:(0,en.cn)(tF,"flex items-center bg-matrix-muted text-aurora-foreground"),size:"1",children:t.tagName}),!t.hidesFileName&&t.fileName&&(0,a.jsx)(T.o.Text,{muted:!0,as:"span",className:"min-w-0 flex-1 truncate text-left",size:"1",children:t.fileName})]}),l={paddingLeft:8+10*Math.min(n,8)};return t.isCurrent?(0,a.jsxs)(C.s,{align:"center",className:"aurora-sheen-tint rounded-lg bg-matrix-muted py-1 pr-2 shadow-aurora-control-soft",gap:"2",style:l,children:[o,(0,a.jsx)(T.o.Text,{muted:!0,as:"span",className:"ml-auto shrink-0",size:"1",children:"Selected"})]}):(0,a.jsx)("button",{className:"flex w-full cursor-pointer items-center gap-2 rounded-lg border-0 bg-transparent py-1 pr-2 text-left hover:bg-matrix-muted",onClick:()=>i(t),onFocus:()=>r(t),onMouseEnter:()=>r(t),style:l,title:t.fileName,type:"button",children:o})}function tV(e){let{onClose:t,onSaveComplete:n,onChangeTextWithAi:s,onChangeImageWithAi:d}=e,{visualEditState:c,codeVisualEditData:u}=(0,f.e1)();return(0,a.jsxs)(r.so,{className:"aurora h-full min-h-0",direction:"column",children:[(0,a.jsxs)(r.so,{align:"center",className:"shrink-0 border-b border-solid border-aurora-border",gap:"2",px:"3",py:"2",style:{height:40},children:[t&&(0,a.jsx)(r.$n,{iconOnly:!0,"aria-label":"Close visual edit",color:"matrix",onClick:t,size:"1",variant:"ghost",children:(0,a.jsx)(i.A60,{})}),(0,a.jsx)(r.o5.Text,{as:"span",size:"2",weight:"medium",children:"Visual Edit"})]}),u&&(0,a.jsx)(tW,{codeVisualEditData:u}),(0,a.jsx)(tM,{onChangeImageWithAi:d,onChangeTextWithAi:s,onSaveComplete:n}),(0,a.jsx)(o.N,{children:c.hasUnsavedChanges&&(0,a.jsx)(l.P.div,{animate:{opacity:1,y:0},className:"aurora shrink-0 px-4 pb-3",exit:{opacity:0,y:20},initial:{opacity:0,y:20},transition:{duration:.15,ease:[.4,0,.2,1]},children:(0,a.jsxs)(r.so,{align:"center",className:"rounded-xl border border-solid border-amber bg-amber-muted shadow-aurora-sm",gap:"3",justify:"between",px:"3",py:"3",children:[(0,a.jsx)(r.so,{align:"center",gap:"2",children:(0,a.jsx)(r.o5.Text,{as:"span",className:"text-amber-foreground",size:"2",weight:"medium",children:"Unsaved Changes"})}),(0,a.jsxs)(r.so,{align:"center",gap:"2",children:[(0,a.jsx)(r.$n,{color:"matrix",disabled:c.isSaving,onClick:()=>{var e;return null==(e=c.onReset)?void 0:e.call(c)},size:"2",variant:"soft",children:"Reset"}),(0,a.jsx)(r.$n,{disabled:c.isSaving,loading:c.isSaving,onClick:()=>{var e;return null==(e=c.onSave)?void 0:e.call(c)},size:"2",title:"Save (Cmd/Ctrl+Enter)",variant:"solid",children:"Save"})]})]})})})]})}},29945:(e,t,n)=>{n.d(t,{$n:()=>a.$,m_:()=>i.m,so:()=>r.s});var a=n(94099),r=n(49255),i=n(47794)},45977:(e,t,n)=>{n.d(t,{p:()=>a.p});var a=n(67123)},46572:(e,t,n)=>{n.d(t,{G:()=>r});var a=n(7620);function r(e){(0,a.useEffect)(()=>{let t=document.title;return document.title=e,()=>{document.title=t}},[e])}},58607:(e,t,n)=>{n.d(t,{$n:()=>r.$,az:()=>a.a,lG:()=>i.l,o5:()=>l.o,s6:()=>s.s,so:()=>o.s});var a=n(12199),r=n(94099),i=n(46115),o=n(49255),l=n(40856),s=n(16353)},67659:(e,t,n)=>{n.d(t,{HA:()=>C,TS:()=>w,qL:()=>N});var a=n(54568),r=n(12199),i=n(94099),o=n(88712),l=n(49255),s=n(33021),d=n(40856),c=n(42266),u=n(29304),g=n(19664),h=n.n(g),m=n(7620),x=n(79873),p=n(70502),f=n(45356),v=n(96364),b=n(27996),j=n(68848);function y(e){let{children:t,justify:n="between"}=e;return(0,a.jsxs)(j.s,{className:"aurora",direction:"column",width:"full",children:[(0,a.jsx)(j.a,{"aria-hidden":!0,

1className:"pointer-events-none relative z-[2] -mt-4 h-4 border-x border-solid border-aurora-border"}),(0,a.jsx)(j.s,{align:"center",className:"rounded-b-2xl border-x border-b border-solid border-aurora-border bg-white py-1.5",gap:"2",justify:n,px:"4",children:t})]})}function w(e){let{type:t,linkType:n,editorId:r,onPollAccess:g,hideResourceDetails:h}=e,{user:v,logout:b}=(0,f.Z2)(),{submitRequest:j,wasSent:w,isPending:N}=(0,x.P)(),{data:C}=(0,p.bR)(h?void 0:r),I=("design"===t||"canvas"===t)&&!!r;return(0,m.useEffect)(()=>{if(!w||!g)return;let e=setInterval(g,5e3);return()=>clearInterval(e)},[w,g]),(0,a.jsx)(l.s,{align:"center",className:"aurora h-full w-full",direction:"column",justify:"center",p:"4",children:(0,a.jsxs)(l.s,{className:"w-full max-w-[440px]",direction:"column",children:[(0,a.jsx)(o.Z,{className:"relative z-[1]",padding:"6",children:(0,a.jsxs)(l.s,{align:"center",direction:"column",gap:"4",children:[(0,a.jsxs)(l.s,{align:"center",className:"text-center",direction:"column",gap:"1",children:[(0,a.jsx)(d.o.Header,{className:"m-0 text-balance text-center",level:4,children:h?"You don’t have access to this design.":"You don’t have access to ".concat(C||"this ".concat(t),".")}),(0,a.jsx)(d.o.Text,{muted:!0,className:"m-0",size:"2",children:I?"Request access, or switch to an account with access.":"Switch to an account with access to open it."})]}),I&&(0,a.jsx)(l.s,{align:"center",direction:"column",gap:"5",width:"full",children:(0,a.jsxs)(i.$,{color:w?"leaf":"matrix",disabled:w,loading:N,onClick:()=>{r&&j({editorId:r,requestedPermission:"preview"===n?"write":"read"})},size:"2",variant:"solid",children:[w?(0,a.jsx)(c.KaV,{}):(0,a.jsx)(u.A,{size:16}),w?"Request sent":"Request access"]})})]})}),(0,a.jsxs)(y,{children:[(0,a.jsx)(l.s,{align:"center",className:"min-w-0 flex-1",gap:"2",children:(0,a.jsxs)(d.o.Text,{muted:!0,as:"span",className:"min-w-0 flex-1 truncate",size:"1",children:["Signed in as ",null==v?void 0:v.email]})}),(0,a.jsx)(s.N,{muted:!0,as:"button",className:"shrink-0",onClick:()=>b({skipReroute:!0}),size:"1",weight:"medium",children:"Log\xa0out"})]})]})})}function N(e){let{type:t,linkType:n="editor",editorId:r,onPollAccess:i,hideResourceDetails:o}=e,{user:l}=(0,f.Z2)();return l?(0,a.jsx)(C,{children:(0,a.jsx)(w,{editorId:r,hideResourceDetails:o,linkType:n,onPollAccess:i,type:t})}):(0,a.jsx)(b.AuthPageLayout,{children:(0,a.jsx)(v.LoginPage,{redirectOnLogin:!1,title:"Want to view this design?"})})}function C(e){let{children:t}=e;return(0,a.jsxs)(l.s,{align:"center",className:"aurora relative h-dvh w-screen overflow-hidden",justify:"center",children:[(0,a.jsx)(r.a,{className:"absolute inset-0 scale-110",style:{WebkitFilter:"blur(9px)",filter:"blur(9px)"},children:(0,a.jsx)(z,{})}),(0,a.jsx)(r.a,{className:"absolute inset-0 bg-white/50"}),(0,a.jsx)(h(),{href:"/",children:(0,a.jsx)(l.s,{className:"absolute left-0 top-0 z-[1]",px:"4",py:"4",children:(0,a.jsx)("img",{alt:"Magic Patterns Logo",className:"h-6",src:"/magicpatterns_logo_light.svg"})})}),(0,a.jsx)(l.s,{align:"center",className:"relative z-[1] h-full w-full",justify:"center",children:t})]})}let I=["n1","n2","n3","n4","n5"],k=["k1","k2","k3","k4"],T=["r1","r2","r3","r4","r5"],S=[{id:"b1",height:42},{id:"b2",height:66},{id:"b3",height:50},{id:"b4",height:82},{id:"b5",height:58},{id:"b6",height:71},{id:"b7",height:47},{id:"b8",height:90},{id:"b9",height:62}];function z(){return(0,a.jsxs)("div",{className:"flex h-full w-full flex-col bg-aurora-chrome",children:[(0,a.jsxs)("div",{className:"flex items-center gap-4 border-b border-aurora-border bg-white px-6 py-3",children:[(0,a.jsx)("div",{className:"size-7 rounded-md bg-matrix"}),(0,a.jsx)("div",{className:"h-3 w-24 rounded bg-aurora-border"}),(0,a.jsx)("div",{className:"ml-2 h-8 w-72 rounded-lg bg-matrix-muted"}),(0,a.jsx)("div",{className:"ml-auto h-8 w-24 rounded-md bg-matrix"}),(0,a.jsx)("div",{className:"size-8 rounded-full bg-aurora-border"})]}),(0,a.jsxs)("div",{className:"flex flex-1",children:[(0,a.jsxs)("div",{className:"flex w-56 flex-col gap-1.5 border-r border-aurora-border bg-aurora-surface p-4",children:[(0,a.jsx)("div",{className:"mb-2 h-2 w-16 rounded bg-aurora-border"}),(0,a.jsxs)("div",{className:"flex items-center gap-2 rounded-lg bg-matrix-muted px-3 py-2",children:[(0,a.jsx)("div",{className:"size-4 rounded bg-matrix"}),(0,a.jsx)("div",{className:"h-2.5 w-24 rounded bg-matrix"})]}),I.map(e=>(0,a.jsxs)("div",{className:"flex items-center gap-2 px-3 py-2",children:[(0,a.jsx)("div",{className:"size-4 rounded bg-aurora-border"}),(0,a.jsx)("div",{className:"h-2.5 w-28 rounded bg-matrix-muted"})]},e)),(0,a.jsxs)("div",{className:"mt-auto flex items-center gap-2 px-3 py-2",children:[(0,a.jsx)("div",{className:"size-6 rounded-full bg-aurora-border"}),(0,a.jsx)("div",{className:"h-2.5 w-20 rounded bg-matrix-muted"})]})]}),(0,a.jsxs)("div",{className:"flex flex-1 flex-col gap-6 p-8",children:[(0,a.jsxs)("div",{className:"flex items-center justify-between",children:[(0,a.jsxs)("div",{className:"flex flex-col gap-2",children:[(0,a.jsx)("div",{className:"h-5 w-40 rounded bg-aurora-border-hover"}),(0,a.jsx)("div",{className:"h-2.5 w-56 rounded bg-matrix-muted"})]}),(0,a.jsx)("div",{className:"h-9 w-32 rounded-md bg-matrix"})]}),(0,a.jsx)("div",{className:"grid grid-cols-4 gap-4",children:k.map(e=>(0,a.jsxs)("div",{className:"flex flex-col gap-3 rounded-xl border border-aurora-border bg-white p-4",children:[(0,a.jsx)("div",{className:"h-2.5 w-20 rounded bg-matrix-muted"}),(0,a.jsx)("div",{className:"h-6 w-24 rounded bg-aurora-border-hover"}),(0,a.jsx)("div",{className:"h-2 w-16 rounded bg-sky-muted"})]},e))}),(0,a.jsxs)("div",{className:"grid grid-cols-3 gap-6",children:[(0,a.jsxs)("div",{className:"col-span-2 flex flex-col gap-4 roun

1ded-xl border border-aurora-border bg-white p-5",children:[(0,a.jsx)("div",{className:"h-3 w-32 rounded bg-aurora-border"}),(0,a.jsx)("div",{className:"flex h-40 items-end gap-3",children:S.map(e=>(0,a.jsx)("div",{className:"flex-1 rounded-t bg-sky-muted",style:{height:"".concat(e.height,"%")}},e.id))})]}),(0,a.jsxs)("div",{className:"flex flex-col items-center gap-4 rounded-xl border border-aurora-border bg-white p-5",children:[(0,a.jsx)("div",{className:"h-3 w-24 self-start rounded bg-aurora-border"}),(0,a.jsx)("div",{className:"size-28 rounded-full border-8 border-sky-muted"}),(0,a.jsx)("div",{className:"h-2.5 w-full rounded bg-matrix-muted"}),(0,a.jsx)("div",{className:"h-2.5 w-2/3 self-start rounded bg-matrix-muted"})]})]}),(0,a.jsxs)("div",{className:"flex flex-col gap-3 rounded-xl border border-aurora-border bg-white p-5",children:[(0,a.jsx)("div",{className:"h-3 w-28 rounded bg-aurora-border"}),T.map(e=>(0,a.jsxs)("div",{className:"flex items-center gap-4",children:[(0,a.jsx)("div",{className:"size-7 rounded-full bg-matrix-muted"}),(0,a.jsx)("div",{className:"h-2.5 flex-1 rounded bg-matrix-muted"}),(0,a.jsx)("div",{className:"h-2.5 w-24 rounded bg-matrix-muted"}),(0,a.jsx)("div",{className:"h-5 w-16 rounded-full bg-sky-muted"})]},e))]})]})]})]})}},70502:(e,t,n)=>{n.d(t,{UP:()=>v,bR:()=>j});var a=n(25758),r=n(4869),i=n(27736),o=n(81562),l=n(71208),s=n(7620),d=n(45356);let c=e=>["design-comments","editor",e];async function u(e){return(await l.A.get("".concat(a.API_BASE_URL,"/design-comments/editor/").concat(e))).data}async function g(e){return(await l.A.get("".concat(a.API_BASE_URL,"/design-comments/access/").concat(e))).data}async function h(e){let{artifactId:t,...n}=e;return(await l.A.post("".concat(a.API_BASE_URL,"/design-comments/").concat(t),n)).data}

1async function m(e){let{commentId:t}=e;return(await l.A.post("".concat(a.API_BASE_URL,"/design-comments/mark-as-resolved/").concat(t))).data}async function x(e){let{commentId:t}=e;return(await l.A.post("".concat(a.API_BASE_URL,"/design-comments/mark-as-unresolved/").concat(t))).data}async function p(e){let{commentId:t,comment:n}=e;return(await l.A.patch("".concat(a.API_BASE_URL,"/design-comments/").concat(t),{comment:n})).data}async function f(e){let{commentId:t,comment:n}=e;return(await l.A.post("".concat(a.API_BASE_URL,"/design-comments/reply/").concat(t),{comment:n})).data}function v(e){var t,n,a;let l=(0,r.jE)(),{user:v}=(0,d.Z2)(),b=(0,i.I)({queryKey:c(e.editorId),queryFn:()=>u(e.editorId),staleTime:3e4}),j=(0,i.I)({queryKey:["design-comments","access",e.editorId],queryFn:()=>g(e.editorId),staleTime:3e4}),y=(0,s.useMemo)(()=>{var e;return(null!=(e=b.data)?e:[]).filter(e=>!e.isResolved)},[b.data]),w=(0,s.useMemo)(()=>Math.max(...b.data&&b.data.length>0?b.data.map(e=>parseInt(e.numberLabel,10)):[0])+1,[b.data]),N=e.createArtifactId,C=(0,o.n)({mutationFn:e=>h({...e,artifactId:N}),onMutate:async t=>{var n,a,r,i,o,s,d,u,g,h,m,x,p;await l.cancelQueries({queryKey:c(e.editorId)});let f={id:"new",userId:null!=(n=null==v?void 0:v.id)?n:"user-id",artifactId:N,editorId:e.editorId,user:{id:null!=(a=null==v?void 0:v.id)?a:"user-id",avatarUrl:null!=(r=null==v?void 0:v.avatarUrl)?r:"",firstName:null!=(i=null==v?void 0:v.firstName)?i:"",lastName:null!=(o=null==v?void 0:v.lastName)?o:"",email:null!=(s=null==v?void 0:v.email)?s:""},elementDataId:null!=(d=t.elementDataId)?d:null,elementName:null!=(u=t.elementName)?u:null,elementInnerText:t.elementInnerText,xOffsetPercent:null!=(g=t.xOffsetPercent)?g:null,yOffsetPercent:null!=(h=t.yOffsetPercent)?h:null,screenId:null!=(m=t.screenId)?m:null,canvasX:null!=(x=t.canvasX)?x:null,canvasY:null!=(p=t.canvasY)?p:null,numberLabel:t.numberLabel,comment:t.comment,threadParentId:null,threadRootId:"new",isResolved:!1,createdAt:new Date,lastModifiedAt:null};l.setQueryData(c(e.editorId),e=>[...null!=e?e:[],f])},onError:()=>{l.setQueryData(c(e.editorId),e=>(null!=e?e:[]).filter(e=>"new"!==e.id))},onSettled:()=>{l.invalidateQueries({queryKey:c(e.editorId)})}}),I=(0,o.n)({mutationFn:e=>{let{commentId:t}=e;return m({commentId:t})},onSuccess:()=>{l.invalidateQueries({queryKey:c(e.editorId)})}}),k=(0,o.n)({mutationFn:e=>{let{commentId:t}=e;return x({commentId:t})},onSuccess:()=>{l.invalidateQueries({queryKey:c(e.editorId)})}}),T=(0,o.n)({mutationFn:e=>{let{commentId:t,comment:n}=e;return p({commentId:t,comment:n})},onMutate:async t=>{let{commentId:n,comment:a}=t;await l.cancelQueries({queryKey:c(e.editorId)});let r=l.getQueryData(c(e.editorId));return l.setQueryData(c(e.editorId),e=>(null!=e?e:[]).map(e=>e.id===n?{...e,comment:a,lastModifiedAt:new Date}:e)),{previousComments:r}},onError:(t,n,a)=>{(null==a?void 0:a.previousComments)&&l.setQueryData(c(e.editorId),a.previousComments)},onSettled:()=>{l.invalidateQueries({queryKey:c(e.editorId)})}}),S=(0,o.n)({mutationFn:e=>{let{commentId:t,comment:n}=e;return f({commentId:t,comment:n})},onMutate:async t=>{let{commentId:n,comment:a}=t;await l.cancelQueries({queryKey:c(e.editorId)});let r=l.getQueryData(c(e.editorId)),i=null==r?void 0:r.find(e=>e.id===n);if(i){var o,s,d,u,g,h;let t={id:"reply-".concat(Date.now()),userId:null!=(o=null==v?void 0:v.id)?o:"user-id",artifactId:i.artifactId,editorId:i.editorId,elementDataId:i.elementDataId,elementInnerText:i.elementInnerText,elementName:i.elementName,numberLabel:i.numberLabel,xOffsetPercent:i.xOffsetPercent,yOffsetPercent:i.yOffsetPercent,screenId:i.screenId,canvasX:i.canvasX,canvasY:i.canvasY,comment:a,threadParentId:i.id,threadRootId:i.threadRootId,isResolved:!1,createdAt:new Date,lastModifiedAt:null,user:{id:null!=(s=null==v?void 0:v.id)?s:"user-id",avatarUrl:null!=(d=null==v?void 0:v.avatarUrl)?d:void 0,firstName:null!=(u=null==v?void 0:v.firstName)?u:void 0,lastName:null!=(g=null==v?void 0:v.lastName)?g:void 0,email:null!=(h=null==v?void 0:v.email)?h:void 0}};l.setQueryData(c(e.editorId),e=>[...null!=e?e:[],t])}return{previousComments:r}},onError:(t,n,a)=>{(null==a?void 0:a.previousComments)&&l.setQueryData(c(e.editorId),a.previousComments)},onSettled:()=>

1{l.invalidateQueries({queryKey:c(e.editorId)})}});return{designComments:y,allDesignComments:null!=(n=b.data)?n:[],canComment:null!=(a=null==(t=j.data)?void 0:t.canComment)&&a,nextCommentNumberLabel:w,createDesignComment:C.mutate,markCommentAsResolved:I.mutate,markCommentAsUnresolved:k.mutate,editDesignComment:T.mutate,replyToComment:S.mutate}}async function b(e){return(await l.A.get("".concat(a.API_BASE_URL,"/design-comments/design-name/").concat(e))).data.designName}function j(e){return(0,i.I)({queryKey:["designName",e],queryFn:()=>b(e),enabled:!!e,staleTime:1/0})}},79156:(e,t,n)=>{n.d(t,{$n:()=>a.$,lG:()=>r.l,o5:()=>o.o,s6:()=>l.s,so:()=>i.s});var a=n(94099),r=n(46115),i=n(49255),o=n(40856),l=n(16353)},85702:(e,t,n)=>{n.d(t,{D:()=>a,m:()=>r});let a=48,r=560},85914:(e,t,n)=>{n.d(t,{T:()=>d});var a=n(54568),r=n(7620),i=n(88729),o=n(63909),l=n(54256);let s={1:(0,l.cn)(i.Xl["1"],i.q6["1"],"px-2.5 py-1.5"),2:(0,l.cn)(i.Xl["2"],i.q6["2"],"px-3 py-2"),3:(0,l.cn)(i.Xl["3"],i.q6["3"],"px-4 py-2.5")},d=r.forwardRef((e,t)=>{let{size:n="2",rows:r=3,className:i,style:d,...c}=e;return(0,a.jsx)("textarea",{ref:t,rows:r,style:{fontFamily:o.bA,...d},className:(0,l.cn)("aurora aurora-glass block box-border w-full resize-y appearance-none border border-solid border-aurora-border bg-white text-aurora-foreground antialiased shadow-aurora-sm transition-colors duration-100","placeholder:text-aurora-muted-foreground","[&:enabled:hover:not(:focus)]:border-aurora-border-hover","focus:border-aurora-border-focus focus:outline-none","disabled:cursor-not-allowed disabled:opacity-50",s[n],i),...c})});d.displayName="Aurora.Textarea"},89644:(e,t,n)=>{n.d(t,{t:()=>m});var a=n(54568),r=n(96689),i=n(49653),o=n(45915),l=n(98011),s=n(59953),d=n(54256);function c(e){let{value:t,defaultValue:n,onValueChange:i,className:o,children:l}=e;return(0,a.jsx)(r.p,{className:(0,d.cn)("aurora",o),defaultValue:n,onValueChange:i?e=>i(String(e)):void 0,value:t,children:l})}function u(e){let{className:t,children:n}=e;return(0,a.jsxs)(i.j,{className:(0,d.cn)("relative flex items-center",t),children:[(0,a.jsx)(o.E,{className:(0,d.cn)("absolute bottom-0 left-0 z-[1] h-0.5 rounded-full bg-matrix","transition-[transform,width] duration-200 ease-out motion-reduce:transition-none"),style:{transform:"translateX(var(--active-tab-left))",width:"var(--active-tab-width)"}}),n]})}function g(e){let{value:t,disabled:n,className:r,children:i}=e;return(0,a.jsx)(l.M,{className:(0,d.cn)("relative inline-flex cursor-pointer select-none appearance-none items-center justify-center whitespace-nowrap border-0 bg-transparent px-3 py-2 text-sm font-medium text-aurora-muted-foreground antialiased outline-none transition-colors duration-100","hover:text-aurora-foreground data-[active]:text-aurora-foreground","focus-visible:ring-2 focus-visible:ring-aurora-ring","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50 data-[disabled]:hover:text-aurora-muted-foreground",r),disabled:n,value:t,children:i})}function h(e){let{value:t,className:n,children:r}=e;return(0,a.jsx)(s.R,{className:(0,d.cn)("pt-3 text-aurora-foreground outline-none",n),value:t,children:r})}c.displayName="Aurora.Tabs",u.displayName="Aurora.Tabs.List",g.displayName="Aurora.Tabs.Tab",h.displayName="Aurora.Tabs.Panel";let m=c;m.List=u,m.Tab=g,m.Panel=h}}]);