1 2!function(){try{var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{},n=(new e.Error).stack;n&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[n]="a30fcf5b-cfa2-5adc-a526-30608544d1ba")}catch(e){}}(); 3import{j as e,u as h,s as M,O as B,b as $,g as rt,r as x,l as R,a as ne,aj as Ke,bp as Le,af as Te,w as He,e as O,ac as it,f as $e,c as qe,by as nt,H as te,E as re}from"./index-BibjyPTE.js";import{A as ot}from"./AccountLayout-Cr2S8RDa.js";import{ac as xe,c as at,a2 as st,D as lt,I as We,u as se,$ as G,bR as Je,a1 as ct,s as z,a0 as dt,bA as mt,a as ut,b as pt,B as A}from"./Breadcrumb-EkcGPuP6.js";import"./index-qYAPjvJR.js";import{u as fe}from"./useAgentHttpClient-D6WK9D1F.js";import{R as Pe,x as ht}from"./ResourceCommitPromote-BUButU3l.js";import{b as q}from"./index-BllNGK-1.js";import"./cloneDeep-BZde2shh.js";import"./merge-Bpphc1Ck.js";import"./isPlainObject-BuZ6-dWq.js";import"./useWorkflow-CTbtuO4M.js";import{g as gt}from"./environment-CuwLrmDK.js";import{i as Ge,P as ie,Q as xt}from"./paths-BWPz_M_c.js";import{C as ft}from"./index-DXLYvgu0.js";import"./UpdateMessageTypeModal-CZx-iamn.js";import{g as yt}from"./index-BRysSYGQ.js";import"./index-CZsZYQTi.js";import"./index-BUirL_DR.js";import"./ColorPopoverContent.styles-B8eyq-2a.js";import{V as Qe}from"./index-jJ9-bWWS.js";import"./AssetPickerHost-D_r6mCdr.js";import"./ImageUploadMetadataContext-Do2AJgBG.js";import{k as Ie,F as vt}from"./get-DuPZLZpA.js";import"./helpers-DOEGB2cR.js";import{C as Fe}from"./CenteredSpinner-Cw-HfplT.js";import"./Meta-CR0s0B-S.js";import"./MessageTypePreviewRenderer-BJyUwWC0.js";import"./TableColumnManager-B1o5SMFm.js";import"./types-3Mxs7ypx.js";import"./gql-DE20YUEL.js";import"./gql-CGK4EQDH.js";import{F as le,a as ce,n as bt,c as Oe,m as jt,d as ge}from"./formik.esm-BdcHBANq.js";import{E as ze}from"./ExternalRecipientSelector-CJd083mc.js";import{E as Ct}from"./ExternalTenantSelector-RHT_DLUC.js";import{W as Q}from"./WorkflowStatePane-BLLzMkxw.js";import{J as kt}from"./JsonObjectEditorModal-BWOqP9Oh.js";import{u as X}from"./useKnockToast-Co4WD0qW.js";import wt from"./square-pen-DnjoYrBz.js";import{R as Et}from"./ResourceActivityBadges-BvBiqVY6.js";import{R as St}from"./ResourceCommits-BoeVAv48.js";import{R as Lt}from"./ResourceActivityTimeline-BY3TYFHP.js";import"./ActivityCell-CzL32YU-.js";import"./utils-CRiRZYlJ.js";import"./Timeline-dGTrJ0Y1.js";import"./gql-GLMazpq4.js";import"./gql-CUW37FfZ.js";import{R as he}from"./constants-DuhbT1ky.js";import{U as Tt}from"./UsedInPanel-CXGhSign.js";import{H as Pt}from"./MainHeader-DWpc0SF1.js";import{P as S}from"./Pane-3oFVsEZv.js";import{R as It}from"./ReadOnlyEnvironmentBanner-DRsPa6mH.js";import{p as Y}from"./formHelpers-FXshqlws.js";import{l as I,a as oe}from"./variables-ro2rMT_1.js";import{u as D}from"./index-DlyMlN9-.js";import{A as Re}from"./AssetUploadIconButton-BGJlTa8r.js";import{C as ae}from"./ColorPickerInput-b-WDjedL.js";import{A as ye}from"./AutoSave-DoBdsps-.js";import{B as Ae}from"./CopyVariableButton.styles-DzcBkDIj.js";import{C as K,c as H,E as Ft,L as ve}from"./LayoutPreviewPane-CN_qWIF2.js";import Ot from"./refresh-cw-BfUIA_92.js";import zt from"./lock-BpnKAD57.js";import Rt from"./external-link-B_mn5IxT.js";import At from"./moon-8eKTJhJO.js";import Dt from"./sun-CqwZJF6X.js";import Bt from"./chevron-right-DJ2xXW7k.js";import Mt from"./layout-template-CyVxXdUN.js";import Ye from"./file-code-corner-BZp7k3PQ.js";import{u as Nt}from"./react-hotkeys-hook.esm-uGxPHoQD.js";import{u as Vt}from"./useLeavePrevention-BMnXLqas.js";import{P as be,a as _t,u as Ut,p as Kt,b as Ht,c as $t}from"./useEmailLayoutTemplateVariables-BEAMGlWU.js";import{M as De}from"./ManagePreferencesUrlInactiveCallout-BMZgZxUj.js";import{p as qt}from"./gql.typegen-CUuZhoGR.js";import{u as je}from"./useQuery-ChrxxERi.js";import{M as Be,s as Me}from"./constants-BALBsoxw.js";import{K as Wt}from"./KeyValueField-BzyYZ0Bj.js";import Jt from"./code-CX4Djp09.js";import Gt from"./undo-2-CbnzviFh.js";import Qt from"./file-type-corner-BsdiYqto.js";import Yt from"./panel-left-BgpdUTzY.js";import{u as Xt}from"./useLazyQuery-DcFJpl-i.js";import"./fragments.typegen-CqjmN_fH.js";import"./index-DToj8SII.js";import"./index-0bv2VSDu.js";import"./monitor-BZujgGmU.js";import"./AccountAvatar-iRJn78zS.js";import"./gql.typegen-1kWCHIrk.js";import"./AgentToggleButton-1PU_txNJ.js";import"./index-UJmbo33A.js";import"./check-goOWWmpv.js";import"./index-p-nHktlA.js";import"./index-Bqum08hH.js";import"./useCurrentUser-BfvTNe4N.js";import"./smile-CfqF-oqN.js";import"./frown-CpJAC9xF.js";import"./bug-NwV40jxU.js";import"./keyboard-aYAzyJT8.js";import"./messages-square-BltroTB3.js";import"./useAnimatedText-4tQOqGt5.js";import"./house-AlB8_a7B.js";import"./package-BnUdsTjX.js";import"./useLocalStorage-4sZ8gRoN.js";import"./localStorage-ChIflZH5.js";import"./user-plus-CYzsZm23.js";import"./circle-question-mark-uqaUqbxd.js";import"./check-check-Jw5J0cHX.js";
3import"./arrow-right-BxMu1bB5.js";import"./useClipboard-B0VW0Njm.js";import"./fragments-gZyjuvDu.js";import"./index-C4ev2U8w.js";import"./mail-QKnCcR9w.js";import"./slugify-Bf4wVM_c.js";import"./useResourceChangeCounts-CGmb_i7b.js";import"./commits-DU3eqEiB.js";import"./useSubscription-CdUCuNOu.js";import"./dates-DjzzusVh.js";import"./git-commit-horizontal-CEI3htyJ.js";import"./gql.typegen-CXOZ2V90.js";import"./gql.typegen-mTchMjgM.js";import"./git-pull-request-draft-BlQ-tZwz.js";import"./delete-B6VulfDU.js";import"./navigation-8uFS96WC.js";import"./git-pull-request-DXr6t2Tt.js";import"./_initCloneObject-rh81Yd20.js";import"./isPlainObject-3rdonpEy.js";import"./_setToString-BqVw3WOv.js";import"./graphql-Bt4ZtNHA.js";import"./type-CAeIcp0q.js";import"./heading-1-ByNMX4Gd.js";import"./heading-2-CGIc_7T6.js";import"./heading-3-c2FnuBnE.js";import"./text-quote-C6KPGMvh.js";import"./bell-dot-B79NaKjK.js";import"./PropertySelectorMenu-CtiFCBxq.js";import"./use-motion-value--HMAJCCV.js";import"./animate-D63uxMra.js";import"./brackets-5kztHFXn.js";import"./corner-down-right-KzQFbMwo.js";import"./repeat-ByZnRHmY.js";import"./shield-off-BAuesC87.js";import"./list-tree-DPbtu1iI.js";import"./clipboard-copy-CjaBVJ2t.js";import"./message-square-off-BBcduPxH.js";import"./languages-ByVwu1BP.js";import"./schemaPropertyVisibility-CvQXqUYU.js";import"./text-cursor-input-CQ6dZEN2.js";import"./IconPicker-C_rOz2mh.js";import"./rectangle-horizontal-DdI7at32.js";import"./toggle-right-CLZfyPVf.js";import"./file-down-A5e9ckuo.js";import"./square-check-big-L0btkLEs.js";import"./list-todo-r8KpTzRQ.js";import"./link-2-CWxKks6V.js";import"./palette-B3LreSDw.js";import"./hash-CZWT4h2t.js";
3import"./PaginationControl-FIBHHrtU.js";import"./trash-2-DiganWf-.js";import"./gql.typegen-DYWTVK5j.js";import"./useIframeThemeSync-D3Fz-nTI.js";import"./previewRequestQueue-t-f775tb.js";import"./sortable.esm-Db5-IM2K.js";import"./pin-DtvjhFCP.js";import"./eye-off-CK50g1PQ.js";import"./ExternalObjectSelector-DVCuUWdS.js";import"./ManageExternalObjectModal-7hYGvnni.js";import"./buildRecipientUpsertInput-Dd7qMfEx.js";import"./set-BYHdukiG.js";import"./_baseSet-DyyTPZ25.js";import"./useObjectSchema-Uu4Jdwpj.js";import"./gql.typegen-DLf_pE7q.js";import"./useTenantSchema-B1MZkVXc.js";import"./useUserSchema-DcHCWuCE.js";import"./SchemaAddPropertyForm-P8jLgwUd.js";import"./typeMeta-DMrjJHFy.js";import"./toggle-left-CDASkx2Q.js";import"./binary-BlnFBEqx.js";import"./ban-DvRnzJWv.js";import"./timezones-BxxwGanW.js";import"./recipients-CBmZKwLS.js";import"./useObjectCollections-CLEnhy-_.js";import"./common-Bh2g5KdN.js";import"./TruncatedText-BvE9s4c5.js";import"./ExternalUserSelector-CNr7lCTv.js";import"./ManageExternalUserModal-C6nK8bsf.js";import"./useHiddenUserSchemaPropertyKeys-us4DfkOX.js";import"./gql-6dQBgP9q.js";import"./SourceEventSelector-B8ujgU_G.js";import"./useHiddenTenantSchemaPropertyKeys-d4XKbuTQ.js";import"./useWorkflowState-xvV-3Bqv.js";import"./config-S-4tB8sX.js";import"./helpers-EoOUn5m1.js";import"./navigation-off-COP1YBQt.js";import"./mail-x-CUfE6FBd.js";import"./mail-warning-g-RK_oNH.js";import"./mail-check-EmWyJCSp.js";import"./eye-tk9sEj5z.js";import"./book-open-check-VvZGV1aV.js";import"./mail-open-cKk9ckaT.js";import"./mail-plus-IxfoeYdV.js";import"./mouse-pointer-click-CQBnxY8t.js";import"./archive-BWGxlGoN.js";import"./hooks-B5RLpGIO.js";import"./templateVariables-D-PjX9vv.js";import"./labels-B7TByOzP.js";import"./audienceEventOptions-BAu8Wuvb.js";import"./graphqlHelpers-B8h-1hoG.js";import"./recipientPath-DVZVjDJ5.js";import"./clock-r-WPI5e6.js";import"./flag-DaPYh-mP.js";import"./mail-minus-CAnAzujQ.js";import"./archive-restore-M0kdx-UJ.js";import"./helpers-4DN8ehN2.js";import"./Primitives-DuG09iZR.js";import"./StepIcon-CNIYxk_K.js";import"./ProviderBrandmark-DxWLtk72.js";import"./Brandmark-DkUhmZnC.js";import"./puzzle-CVu_6Psr.js";import"./user-round-check-CD_468ve.js";import"./zap-BxvpFNLD.js";import"./smartphone-C7aAn6Yq.js";import"./message-circle-BoS1sUfn.js";import"./hourglass-CCpZgZq4.js";import"./user-DUTo_Hz_.js";import"./shuffle-92jNldRh.js";import"./network-BlL_pOVt.js";import"./file-braces-CHQIYAZx.js";import"./timer-D2MsbS5P.js";import"./useWorkflowPermissions-Bfnjx5YV.js";import"./gql.typegen-CXNcAlMt.js";import"./helpers-DlNQ89fx.js";import"./workflowBuilderConfig-DTolzQXu.js";import"./helpers-BCgamnjB.js";import"./providerSettings-CHWH_Erx.js";import"./react-use-clipboard.module-C7zmYPh1.js";import"./filters-EWq4QCS9.js";import"./GenericSingleSelectFilter-BscF0keU.js";import"./GenericTextInputFilter-C2fO3dfe.js";import"./viewFilters-CkkF4GA6.js";import"./GenericMultiSelectFilter-Btwi-hmO.js";import"./useResourceTags-B3RijRuv.js";import"./gql.typegen-BgZA_g6E.js";/* empty css */import"./OperatorField-Bq3mV9ph.js";import"./config-sZY0AIYX.js";import"./helpers-B9-wM7xc.js";import"./route-CbrU3dXd.js";import"./debounce-BqrJm7X4.js";import"./SchemaFieldCard-DrcTowhz.js";import"./DataList-D6KZlEr2.js";import"./comboboxPaste-B3klOqlL.js";import"./mailbox-D9ljiu3q.js";import"./mouse-pointer-2-BSbLiB3O.js";import"./play-CYW5DMiS.js";import"./numbers-DfiUvO2J.js";import"./utils-D2BpMpyh.js";import"./ReadOnlyCondition-CPTWUK4f.js";import"./useAudienceFromConditionArgument-BLzT2708.js";import"./hooks-DRkJHAuC.js";import"./helpers-CcFxNo8i.js";import"./useWorkflowTrigger-Dc2a4G8p.js";import"./helpers-CnSb6rFC.js";import"./useAudience-LVxQZvBP.js";import"./string-B_J5Q0ZO.js";import"./arrow-down-wide-narrow-DeSzkdXL.js";import"./circle-check-big-BC3D6L2m.js";import"./refresh-ccw-y_JS4yjW.js";import"./useIntegrationSource-kaWYe56Z.js";import"./brandmarkIcons-CTYpVLBs.js";import"./index-BvrzL5IR.js";import"./workos-BW7N1x5_.js";import"./helpers-CEtYNeNG.js";
3import"./useSamplePayload-ByOZXl6t.js";import"./gql.typegen-D112thwe.js";import"./SourceEventSearch-CG7-i65a.js";import"./TruncateMiddle-D647irH7.js";import"./useAllSourceEvents-4mfEs4rN.js";import"./gql.typegen-B9CXSFYO.js";import"./ReadOnlyJsonCodeBlock-kyPdUBPc.js";import"./expand-BqMaSUcy.js";import"./resolveSourceVariablePath-C-9AnO-u.js";import"./SchemaPropertiesAsJsonModal-CR8opHiC.js";import"./chevron-up-DqmXsSVk.js";import"./constants-BcP1QuBI.js";import"./TooltipLabelWithKbd-CXRWdJTK.js";import"./minimize-2-B7nexSD_.js";import"./maximize-2-CT6Wx0qR.js";import"./shrink-BiPGI-uc.js";import"./badge-check-Dt_oy6Xr.js";import"./useCommits-D-baLO9h.js";import"./DateTimePopover-BnEafoam.js";import"./arrow-down-from-line-DqYT6Z8l.js";import"./git-commit-vertical-CC9Mvyo9.js";import"./arrow-big-up-DzaVvtJ8.js";import"./gql-D8XACtib.js";import"./ReferenceSection-BJ2H3P_3.js";import"./StatusIcon-DAj2IPn8.js";import"./circle-play-Di5wtBp7.js";import"./gql.typegen-9jrxTRrc.js";import"./earth-lock-uGh6jHZT.js";import"./cloud-upload-CjXEb7C9.js";import"./DottedBackground-ByxXXPSg.js";import"./useDotBackground-DbO_waYH.js";import"./PreviewThemeToggle-Bp1-PZcD.js";import"./UpgradePlanBanner-D_FxtRx6.js";import"./star-BiUnXwyS.js";import"./DarkModeUnsupportedBanner-wL9g45LY.js";import"./useAppAppearance-BRJgkbR1.js";import"./usePlaceholderExternalTenant-C1xNUb7x.js";import"./PropertySelectorField-WuK-xcC3.js";import"./arrayHelpers-D9Uw5AND.js";const Zt=({dispatch:i,schemaOverrides:t,templateVariablesBySection:r,onSaveSchemaOverrides:a})=>{const{settingsPath:n}=xe(),l=X(),o=at("edit-email-layout-overrides");return e.jsxs(e.Fragment,{children:[e.jsxs(h,{h:"full",direction:"column",bg:"surface-1",w:"full","data-testid":"email-layout-template-vars-pane",py:"0",my:"0",children:[e.jsx(h,{px:"4",h:"10",align:"center",justify:"space-between",bg:"surface-1",direction:"row",children:e.jsx(M,{as:"h3",size:"2",py:"4",weight:"medium",children:"Layout variables"})}),e.jsx(Q,{title:"Preview variables",state:t,emptyMessage:"No preview variables available.",action:e.jsx(q,{label:"Edit preview variables",children:e.jsx(B,{as:$,href:o.openHref,icon:{icon:wt,alt:"Edit preview variables"},size:"1",color:"gray",variant:"ghost"})})}),e.jsx(ze.Root,{value:r.recipient||null,onValueChange:s=>{i({type:"selectedRecipientId",payload:s?.id??void 0})},defaultType:r.recipient&&"collection"in r.recipient?"object":"user",defaultIfEmpty:!0,children:e.jsx(Q,{title:"Recipient",state:r.recipient||{},variablePrefix:"recipient",children:e.jsx(ze.Selector,{})})}),e.jsx(Q,{title:"Tenant",state:r.tenant,variablePrefix:"tenant",action:e.jsx(Ct,{value:r.tenant,onValueChange:s=>{i({type:"selectedTenantId",payload:s?.id??void 0})},clearable:!0})}),e.jsx(Q,{title:"Layout",state:r.layout}),e.jsx(Q,{title:"Environment variables",state:r.vars,variablePrefix:"vars",action:e.jsx(q,{label:"Edit environment variables",children:e.jsx(B,{as:$,href:n(["variables"]),target:"_blank",icon:{icon:rt,alt:"Set environment variables"},size:"1",color:"gray",variant:"ghost"})})})]}),e.jsx(kt,{isOpen:o.isOpen,onCancel:o.onClose,onEsc:o.onClose,onSubmit:async({jsonProperties:s})=>{const m=st(s);if(!m.valid){l({title:"Invalid preview variables",description:m.message??"Payload must be a valid JSON object.",status:"error",position:"bottom-right"});return}try{await a(JSON.parse(s)),o.onClose()}catch(c){l({title:"Could not save preview variables",description:c instanceof Error?c.message:"An unknown error occurred",status:"error",position:"bottom-right"})}},initialValues:{jsonProperties:JSON.stringify(t,null,2)},title:"Preview variables"})]})},er=(i,t)=>{const r={...i};return delete r[I.primaryTextColor],delete r[I.secondaryTextColor],t.primaryTextColor&&(r[I.primaryTextColor]=Ne(t.primaryTextColor)),t.secondaryTextColor&&(r[I.secondaryTextColor]=Ne(t.secondaryTextColor)),r},Ne=i=>i?(i.startsWith("#")?i:`#${i}`).toUpperCase():"",tr=({emailLayout:i,updateLayout:t,readOnly:r,refreshPreviewMaybe:a,latestBrandingOverridesRef:n})=>{const l=X(),o=i?.brandingOverrides||{},s=Ie(o,I.primaryTextColor),m=Ie(o,I.secondaryTextColor),c=x.useMemo(()=>({primaryTextColor:s??"",secondaryTextColor:m??""}),[s,m]);return e.jsx(le,{initialValues:c,onSubmit:async(d,b)=>{const g=n.current||{},u=er(g,d),p=n.current;n.current=u;const v={emailLayoutId:i?.id||"",brandingOverrides:JSON.stringify(u)},f=await t({variables:{input:v}}),j=f.data?.result?.errors??[];if(j.length>
30)return n.current===u&&(n.current=p),j.forEach(k=>b.setFieldError(k.field,k.message)),l({title:"There was an error updating layout typography.",status:"error",position:"bottom-right"}),f;const C=f.data?.result?.emailLayout;return C&&a(Y(C)),f},children:d=>e.jsxs(ce,{children:[e.jsx(ye,{syncValues:c}),e.jsxs(D.List,{gap:"4",children:[e.jsxs(D.Item,{"data-branding-row":!0,label:"Primary text color",description:H("vars.branding.primary_text_color"),align:"center",valueProps:{align:"center",gap:"2"},children:[e.jsx(ae,{disabled:r,value:d.values.primaryTextColor??"",placeholder:"#51545E",onChange:b=>{r||d.setFieldValue("primaryTextColor",b)}}),e.jsx(K,{variablePath:"vars.branding.primary_text_color"})]}),e.jsxs(D.Item,{"data-branding-row":!0,label:"Secondary text color",description:H("vars.branding.secondary_text_color"),align:"center",valueProps:{align:"center",gap:"2"},children:[e.jsx(ae,{disabled:r,value:d.values.secondaryTextColor??"",placeholder:"#333333",onChange:b=>{r||d.setFieldValue("secondaryTextColor",b)}}),e.jsx(K,{variablePath:"vars.branding.secondary_text_color"})]})]})]})})},rr=(i,t,r)=>{const{logoKey:a,iconKey:n,primaryColorKey:l,primaryColorContrastKey:o}=i,s=R.get(t,a)||R.get(r,`branding.${a}`),m=R.get(t,n)||R.get(r,`branding.${n}`),c=R.get(t,l)||R.get(r,`branding.${l}`),d=R.get(t,o)||R.get(r,`branding.${o}`);return{brandingLogoUrl:s,brandingIconUrl:m,brandingPrimaryColor:c,brandingPrimaryColorContrast:d}},ir=i=>{const t=i?I.brandingDarkLogo:I.brandingLogo,r=i?I.brandingDarkIcon:I.brandingIcon,a=i?I.brandingDarkPrimaryColor:I.brandingPrimaryColor,n=i?I.brandingDarkPrimaryColorContrast:I.brandingPrimaryColorContrast;return{logoKey:t,iconKey:r,primaryColorKey:a,primaryColorContrastKey:n}},Ve=["image/jpeg","image/png"],_e=({label:i,darkMode:t=!1,defaultOpen:r=!0,isReadOnly:a,project:n,environment:l,overrides:o,variables:s,emailLayout:m,updateOverride:c})=>{const[d,b]=x.useState(r),g=ir(t),{logoKey:u,iconKey:p,primaryColorKey:v,primaryColorContrastKey:f}=g,{brandingLogoUrl:j,brandingIconUrl:C}=rr(g,o,s),k=a?.65:1,T=t?"black":"white",E=!!(n&&l&&m?.id),w={primaryColor:o[v]??"",primaryColorContrast:o[f]??""};return e.jsxs(h,{direction:"column",gap:"2",overflow:"hidden",children:[e.jsxs(h,{as:"button",type:"button","aria-expanded":d,direction:"row",align:"center",gap:"2",py:"1",px:"1",w:"full",rounded:"2",_hover:{bg:"gray-2"},style:{cursor:"pointer"},onClick:()=>b(!d),children:[e.jsx(ne,{icon:t?At:Dt,size:"1",color:"gray",alt:i}),e.jsx(M,{as:"span",size:"1",weight:"medium",color:"gray",children:i}),e.jsx(ne,{icon:d?Ke:Bt,size:"1",color:"gray",alt:d?"Collapse":"Expand"})]}),d&&e.jsx(le,{initialValues:w,onSubmit:async F=>{await c(L=>({...L,[v]:F.primaryColor||null,[f]:F.primaryColorContrast||null}))},children:F=>e.jsxs(ce,{children:[e.jsx(ye,{syncValues:w}),e.jsxs(D.List,{gap:"3",ml:"2_5",pl:"4",py:"2",borderLeft:"px",borderColor:"gray-4",children:[e.jsxs(D.Item,{"data-branding-row":!0,label:"Primary brand color",description:H(`vars.branding.${v}`),align:"center",valueProps:{align:"center",gap:"2"},children:[e.jsx(ae,{disabled:a,value:F.values.primaryColor,placeholder:s?.branding?.[v]||"#000000",onChange:L=>{a||F.setFieldValue("primaryColor",L)}}),e.jsx(K,{variablePath:`vars.branding.${v}`})]}),e.jsxs(D.Item,{"data-branding-row":!0,label:"Contrast text color",description:H(`vars.branding.${f}`),align:"center",valueProps:{align:"center",gap:"2"},children:[e.jsx(ae,{disabled:a,value:F.values.primaryColorContrast,placeholder:s?.branding?.[f]||"#FFFFFF",onChange:L=>{a||F.setFieldValue("primaryColorContrast",L)}}),e.jsx(K,{variablePath:`vars.branding.${f}`})]}),e.jsxs(D.Item,{"data-branding-row":!0,label:"Logo",description:H(`vars.branding.${u}`),align:"center",valueProps:{align:"center",gap:"2"},children:[e.jsxs(h,{direction:"row",align:"center",gap:"2",flexWrap:"wrap",children:[j&&e.jsx(Ae,{backgroundColor:T,maxWidth:"150px",src:j,opacity:k}),!a&&E&&e.jsx(Re,{project:n,environment:l??null,accept:Ve,assetType:Te.LayoutBrandingLogo,metadata:{type:Le.LayoutBrandingLogo,emailLayoutId:m.id},tooltip:"500x160 px in JPEG or PNG recommended.",onCompleteToastMessage:"Successfully uploaded the layout brand logo image",onAssetUploaded:L=>{c(N=>({...N,[u]:L.url??""}))}})]}),e.jsx(K,{variablePath:`vars.branding.${u}`})]}),e.jsxs(D.Item,{"data-branding-row":!0,label:"Icon",description:H(`vars.branding.${p}`),align:"center",valueProps:{align:"center",gap:"2"},children:[e.jsxs(h,{direction:"row",align:"center",gap:"2",flexWrap:"wrap",children:[C&&e.jsx(Ae,{backgroundColor:T,maxWidth:"50px",src:C,opacity:k}),!a&&E&&e.jsx(Re,{project:n,environment:l??null,accept:Ve,assetType:Te.LayoutBrandingIcon,metadata:{type:Le.LayoutBrandingIcon,emailLayoutId:m.id},tooltip:"128x128 px in JPEG or PNG recommended",onCompleteToastMessage:"Successfully uploaded the layout brand icon",onAssetUploaded:L=>{c(N=>({...N,[p]:L.url??""}))}})]}),e.jsx(K,{variablePath:`vars.branding.${p}`})]})]})]})})]})}
3,nr=({title:i="Branding",subtitle:t,project:r,environment:a,variables:n,isReadOnly:l=!1,emailLayout:o,updateLayout:s,refreshPreviewMaybe:m})=>{const{settingsPath:c}=xe(),d=X(),b=x.useRef(o),g=x.useRef(m),u=x.useRef(o?.brandingOverrides||{});x.useEffect(()=>{b.current=o},[o]),x.useEffect(()=>{g.current=m},[m]);const p=u.current,v=c(["branding"]),f=Object.values(p).some(C=>!!C),j=async C=>{if(l||!s||!o?.id)return;const k=C(u.current),T=u.current;u.current=k;const E=await s({variables:{input:{emailLayoutId:o.id,brandingOverrides:JSON.stringify(k)}}});if(E.data?.result?.errors?.length){u.current===k&&(u.current=T),d({title:"There was an error updating this layout.",status:"error",position:"bottom-right"});return}const F=E.data?.result?.emailLayout;setTimeout(()=>{g.current(F||{...b.current,brandingOverrides:k})},0)};return e.jsxs(h,{direction:"column",gap:"3",children:[e.jsxs(h,{direction:"row",align:"center",justify:"space-between",children:[e.jsx(q,{enabled:!!t,label:t,children:e.jsx(M,{as:"h3",size:"1",weight:"medium",borderBottom:"px",borderStyle:"dashed",style:{width:"fit-content"},children:i})}),e.jsxs(h,{direction:"row",align:"center",justify:"space-between",gap:"1",children:[f?e.jsx(B,{onClick:async()=>j(C=>({})),leadingIcon:{icon:Ot,alt:"Reset to account defaults"},align:"center",variant:"ghost",color:"gray",size:"1",disabled:l,children:"Reset to account defaults"}):e.jsxs(e.Fragment,{children:[e.jsx(ne,{icon:zt,size:"1",alt:"Synced with account",color:"gray"}),e.jsx(M,{as:"span",size:"1",color:"gray",mr:"1",children:"Synced with account"})]}),e.jsx(B,{as:$,href:v,target:"_blank",rel:"noopener noreferrer",leadingIcon:{icon:Rt,alt:"Open account branding in a new tab"},align:"center",variant:"outline",size:"1",children:"Set account branding"})]})]}),e.jsxs(h,{direction:"column",gap:"3",children:[e.jsx(_e,{label:"Light mode",defaultOpen:!0,isReadOnly:l,project:r,environment:a,overrides:p,variables:n,emailLayout:o,updateOverride:j}),e.jsx(_e,{label:"Dark mode",darkMode:!0,defaultOpen:!1,isReadOnly:l,project:r,environment:a,overrides:p,variables:n,emailLayout:o,updateOverride:j})]}),e.jsx(tr,{emailLayout:o,updateLayout:s,readOnly:l,refreshPreviewMaybe:m,latestBrandingOverridesRef:u})]})},or=({emailLayout:i,formProps:t,readOnly:r,defaultLayoutTooltipLabel:a,onSetAsDefault:n})=>e.jsxs(h,{direction:"column",gap:"4",p:"4",children:[e.jsxs(h,{direction:"row",align:"center",gap:"3",w:"full",children:[e.jsx(h,{w:"8",h:"8",rounded:"2",bg:"gray-2",align:"center",justify:"center",style:{flexShrink:0},children:e.jsx(ne,{icon:Mt,size:"1",color:"gray",alt:"Email layout"})}),e.jsxs(h,{direction:"column",w:"full",style:{minWidth:0},children:[e.jsx(yt,{variant:"ghost",size:"1",w:"full",value:t.values.name??"",placeholder:i.key,"aria-label":"Layout name",textProps:{size:"3",color:"default",weight:"medium"},onChange:l=>{const o=typeof l=="string"?l:l.target.value;t.setFieldValue("name",o),t.setFieldTouched("name",!0,!1)},disabled:r,autoComplete:"off","data-1p-ignore":!0}),e.jsx(He,{as:"span",size:"1",color:"gray",variant:"ghost",px:"1",maxW:"full",children:i.key})]}),e.jsx(Qe,{size:"0",icon:{icon:Ye,"aria-hidden":!0},children:i.isMjml?"MJML":"HTML"})]}),e.jsx(D.List,{children:e.jsx(D.Item,{label:"Set as default layout",description:a,align:"center",children:e.jsx(ft.Default,{size:"1","aria-label":"Set as default layout",disabled:r||i.isDefault,onValueChange:l=>{l&&n()},value:i.isDefault})})})]}),ar=({completionsOverride:i=[],readOnly:t,targetContent:r="",emailLayout:a})=>e.jsxs(h,{h:"full",direction:"column",children:[e.jsx(h,{minH:"0","data-cm-fill-host":"true",style:{flex:1},children:e.jsx(vt,{name:r,acceptValueOnChange:!0,touchFieldOnChange:!0,hasBottomMargin:!1,children:n=>e.jsx(lt,{...n,language:a.isMjml&&n.name==="htmlContent"?"mjml":n.name==="htmlContent"?"html":"plaintext",height:"100%",color:"ghost",disabled:t,completionsOverride:i,style:{height:"100%"},innerStyle:{borderWidth:"0px",overflowY:"auto"}})})}),e.jsx(h,{px:"4",mb:"12",style:{flexShrink:0},children:e.jsx(We,{href:"https://docs.knock.app/integrations/email/layouts",target:"_blank",weight:"medium",color:"blue",size:"0",children:"Learn more about email layouts"})})]}
3),sr={enableOnTags:["SELECT","INPUT","TEXTAREA"],enableOnContentEditable:!0},Xe=({account:i,readOnly:t,emailLayout:r,updateLayout:a,targetContent:n,formProps:l,actionButton:o,completionsOverride:s,contentTypeSwitchButton:m,contentTypeSelector:c,isPreviewLoading:d,previewResult:b,previewAppearance:g,setPreviewAppearance:u,refreshPreviewMaybe:p,isPreviewPaneOpen:v=!0,isOpen:f=!0})=>{const j=Object.keys(l.touched).length>0&&l.dirty;Vt(j);const C=x.useRef(p),k=x.useRef(R.debounce(w=>C.current(w),500));x.useEffect(()=>{C.current=p},[p]),x.useEffect(()=>{const w=k.current;return w(l.values),()=>{w.cancel()}},[l.values,p]);const T={...sr,enabled:f};Nt("cmd+s,ctrl+s",w=>{w.preventDefault(),j&&l.isValid&&l.submitForm()},T,[j,l.isValid]);const E={isPreviewLoading:d,previewResult:b,previewAppearance:g,refreshPreviewMaybe:p};return!i||!i.seat?null:e.jsxs(S.Group,{orientation:"horizontal",children:[e.jsx(S.Item,{id:"email-layout-editor",defaultSize:"50%",minSize:"30%",maxSize:"70%",children:e.jsxs(h,{direction:"column",h:"full",children:[e.jsx(Ft,{title:"Content",afterTitle:c,actions:e.jsxs(e.Fragment,{children:[m,o]})}),e.jsx(O,{position:"relative",overflow:"hidden",style:{flex:1,minHeight:0},children:e.jsx(O,{position:"absolute",style:{inset:0},children:e.jsx(ar,{completionsOverride:s,formProps:l,targetContent:n,readOnly:t,emailLayout:r,updateLayout:a})})})]})}),v&&e.jsxs(e.Fragment,{children:[e.jsx(S.Handle,{}),e.jsx(S.Item,{id:"email-layout-preview",defaultSize:"50%",minSize:"30%",maxSize:"70%",children:e.jsxs(ve,{previewAppearance:g,setPreviewAppearance:n==="htmlContent"?u:void 0,children:[n==="htmlContent"&&e.jsx(be,{...E}),n==="textContent"&&e.jsx(_t,{...E})]})})]})]})},lr=()=>{const{environment:i}=se(),{data:t,loading:r}=je(qt,{skip:!i?.nodeId,variables:{nodeId:i?.nodeId??""},fetchPolicy:"cache-first"});return{preferenceCenterEnabled:t?.environment?.__typename==="Environment"?t.environment.preferenceCenterEnabled:void 0,loading:r}},Ue="{{ vars.commercial_unsubscribe_url }}",cr=({footerLinks:i,readOnly:t,onAddLink:r})=>{const n=!!it()["preference-center-manage-preferences-link"],l=i.some(c=>c.url===Ue),o=i.some(c=>c.url===Be),s=i.filter(({text:c,url:d})=>c.trim()&&d.trim()),m=l&&(!n||o);return e.jsxs(G.Root,{children:[e.jsx(G.Trigger,{children:e.jsx(B,{variant:"outline",size:"1",trailingIcon:{icon:Ke,"aria-hidden":!0},disabled:t||m,children:"Add link"})}),e.jsxs(G.Content,{align:"start",children:[e.jsx(G.Button,{disabled:l,onClick:()=>{r([...s,{text:"Unsubscribe",url:Ue}])},children:"1-click unsubscribe"}),n&&e.jsx(G.Button,{disabled:o,onClick:()=>{r([...s,{text:"Manage preferences",url:Be}])},children:"Manage preferences"})]})]})},dr=`{{\\s*${oe.footerLinks}\\s*}}`,mr=ge().urlValid(void 0,{protocols:null}).required();function ur(i){try{const t=Je(i);if(t)return t;mr.validateSync(i)}catch(t){return i.includes("{{")?void 0:t.message}}const pr=i=>!!i.match(dr),hr=()=>e.jsxs(M,{as:"p",size:"1",color:"gray",children:["Unable to detect"," ",e.jsx(He,{as:"span",color:"accent",children:`{{ ${oe.footerLinks} }}`})," ","in the HTML. Edit in code editor to add this variable where you want to place footer links."]}),gr=Oe({footerLinks:jt().of(Oe({text:ge().required("must provide a link label"),url:ge().required("must provide a url or liquid that evaluates to a url")}))}),xr=({title:i="Footer links",subtitle:t,emailLayout:r,updateLayout:a,readOnly:n,refreshPreviewMaybe:l})=>{const o=X(),{preferenceCenterEnabled:s,loading:m}=lr(),c=()=>{o({title:"There was an error updating this layout.",status:"error",position:"bottom-right"})},d={footerLinks:Y(r.footerLinks?.length?r.footerLinks:[{text:"",url:""}])},b=x.useMemo(()=>pr(r.htmlContent),[r]);return e.jsxs(O,{children:[!b&&e.jsxs(h,{direction:"column",gap:"3",children:[e.jsx(q,{enabled:!!t,label:t,children:e.jsx(M,{as:"h3",size:"1",weight:"medium",borderBottom:"px",borderStyle:"dashed",style:{width:"fit-content"},children:i})}),e.jsx(O,{maxW:"120",children:e.jsx(hr,{})}),Me(s,m,r.htmlContent,r.footerLinks)?e.jsx(De,{}):null]}),b&&e.jsx(le,{initialValues:d,validationSchema:gr,validateOnBlur:!1,validateOnChange:!1,validateOnMount:!1,onSubmit:async(g,u)=>{const p={...g,emailLayoutId:r.id};let v;try{v=await a({variables:{input:p}})}catch(f){throw c(),u.resetForm({values:d}),f}if(v.data?.result?.errors)c(),u.resetForm({values:d});else{const f=v.data?.result?.emailLayout;f&&l(f)}return v},children:g=>e.jsxs(ce,{children:[e.jsx(ye,{}),e.jsxs(h,{direction:"column",gap:"4",children:[e.jsxs(h,{direction:"row",gap:"2",justifyContent:"space-between",children:[e.jsx(q,{enabled:!!t,label:t,children:e.jsx(M,{as:"h3",size:"1",weight:"medium",borderBottom:"px",borderStyle:"dashed",style:{width:"fit-content"},children:i})}),e.jsx(cr,{footerLinks:g.values.footerLinks,readOnly:n,onAddLink:async u=>
3{await g.setFieldValue("footerLinks",u),g.submitForm()}})]}),Me(s,m,r.htmlContent,g.values.footerLinks)?e.jsx(De,{}):null,e.jsx(bt,{name:"footerLinks",children:({field:u})=>e.jsx(Wt,{value:u.value,options:{key:{fieldName:"text",placeholder:"Label",fieldProps:{disabled:n},validate:{fn:p=>p?Je(p):"Required"}},value:{fieldName:"url",placeholder:"Enter URL",fieldProps:{disabled:n},validate:{fn:p=>p?ur(p):"Required"}}},onValueChange:p=>{g.setFieldValue("footerLinks",p)}})})]})]})})]})},fr={kind:"Document",definitions:[{kind:"OperationDefinition",operation:"mutation",name:{kind:"Name",value:"SetEmailLayoutAsDefault"},variableDefinitions:[{kind:"VariableDefinition",variable:{kind:"Variable",name:{kind:"Name",value:"input"}},type:{kind:"NonNullType",type:{kind:"NamedType",name:{kind:"Name",value:"SetEmailLayoutAsDefaultInput"}}}}],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",alias:{kind:"Name",value:"result"},name:{kind:"Name",value:"setEmailLayoutAsDefault"},arguments:[{kind:"Argument",name:{kind:"Name",value:"input"},value:{kind:"Variable",name:{kind:"Name",value:"input"}}}],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"emailLayout"},selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"id"}},{kind:"Field",name:{kind:"Name",value:"isDefault"}}]}},{kind:"Field",name:{kind:"Name",value:"errors"},selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"field"}},{kind:"Field",name:{kind:"Name",value:"message"}}]}}]}}]}}]},yr=fr,vr=({editMode:i,setEditMode:t})=>e.jsxs(B,{size:"1",variant:"outline",leadingIcon:{icon:i==="visual"?Jt:Gt,"aria-hidden":!0},onClick:()=>t(i==="visual"?"manual":"visual"),children:["Edit in ",i==="visual"?"code":"visual"," editor"]}),br=({href:i})=>e.jsx(We,{as:$,href:i,size:"1",children:"account settings"}),jr=i=>{const{settingsPath:t}=xe(),r=X(),{account:a,emailLayout:n,environment:l,project:o,variables:s,updateLayout:m,formProps:c,readOnly:d,isPreviewLoading:b,previewResult:g,refreshPreviewMaybe:u,contentTypeSelector:p,contentTypeSwitchButton:v,isPreviewPaneOpen:f=!0,previewAppearance:j="light",setPreviewAppearance:C}=i,[k,T]=x.useState(null),[E,w]=x.useState("visual"),[F,{loading:L}]=$e(yr,{refetchQueries:["EmailLayoutForEnv","EmailLayoutsForEnv"],awaitRefetchQueries:!0});if(x.useEffect(()=>{s&&E==="visual"&&u(n)},[E,s,u,n]),!a||!a.seat)return null;if(E==="manual")return e.jsxs(O,{position:"relative",h:"full",children:[e.jsx(ct,{isOpen:k!==null,onClose:()=>T(null),title:"Unsaved layout changes",description:e.jsxs(h,{direction:"column",gap:"3",children:[e.jsx(M,{as:"p",size:"1",children:"You have unsaved changes in your layout. Youâll lose them if you go back to the visual editor prior to saving."}),e.jsx(M,{as:"p",size:"1",children:"Do you want to go back to the visual editor and lose your changes?"})]}),isConfirming:!1,confirmButtonLabel:"Yes, take me to the visual editor",onConfirm:()=>{c.resetForm(),k!==null&&(w(k),T(null))}}),e.jsx(Xe,{targetContent:"htmlContent",contentTypeSelector:p,contentTypeSwitchButton:v,actionButton:e.jsx(vr,{editMode:E,setEditMode:_=>{if(Object.keys(c.touched).length>0&&c.dirty)return T(_);w(_)}}),isOpen:i.isOpen,...i})]});const N=async()=>{if(!(d||n.isDefault||L))try{const W=(await F({variables:{input:{emailLayoutId:n.id}}})).data?.result?.errors??[];if(W.length>0){r({title:W[0]?.message||"There was an error setting this layout as default.",status:"error",position:"bottom-right"});return}r({title:"Layout set as default.",status:"success",position:"bottom-right"})}catch{r({title:"There was an error setting this layout as default.",status:"error",position:"bottom-right"})}},de=d?"This layout is read-only in this environment, so you can't set it as the default.":n.isDefault?"To disable as default layout, you must enable another layout as default.":void 0;return e.jsxs(S.Group,{orientation:"horizontal",children:[e.jsx(S.Item,{id:"email-layout-visual-editor",defaultSize:"50%",minSize:"20%",maxSize:"60%",style:{minHeight:"fit-content",overflow:"auto"},children:e.jsxs(h,{direction:"column",h:"full",children:[e.jsx(or,{emailLayout:n,formProps:c,readOnly:d,defaultLayoutTooltipLabel:de,onSetAsDefault:()=>{N()}}),e.jsx(O,{p:"4",borderTop:"px",children:e.jsx(nr,{isReadOnly:d,subtitle:e.jsxs(M,{as:"span",size:"1",children:["Override account-level branding for this layout, or manage account defaults in"," ",e.jsx(br,{href:t(["branding"])}),"."]}),project:o,environment:l,variables:s,emailLayout:n,updateLayout:m,refreshPreviewMaybe:u})}),e.jsx(O,{p:"4",pb:"32",borderTop:"px",children:e.jsx(xr,{subtitle:"Label & URL support liquid templates",emailLayout:n,updateLayout:m,readOnly:d,refreshPreviewMaybe:u})})]})}),f&&e.jsxs(e.Fragment,{children:[e.jsx(S.Handle,{}),e.jsx(S.Item,{id:"email-layout-visual-preview",defaultSize:"50%",minSize:"30%",maxSize:"80%",children:e.jsx(ve,{previewAppearance:j,setPreviewAppearance:C,children:e.jsx(be,{isPreviewLoading:b,previewAppearance:j,previewResult:g,refreshPreviewMaybe:u})})})]})]})},Cr=({environment:i,emailLayout:t})=>{const{account:r}=fe(),a=r?.allEnvironmentsWriteable||!1,{project:n,environment:l}=se(),o=qe(),s=o.query.tab||"general",[m,c]=x.useState("html"),[d,b]=x.use
3State(!0),[g,u]=x.useState(!0),p=s==="editor"||s==="general"||s==="usage",v=x.useCallback(y=>{const P={...o.query,tab:y};delete P.activeCommitId,delete P.displayMode,o.push({pathname:o.pathname,query:P},void 0,{shallow:!0})},[o]),f=x.useRef({}),j=x.useRef(""),[C,k]=x.useState(void 0),[T,E]=x.useState("light"),[w]=$e(Ut),{data:F}=je(Kt,{fetchPolicy:"cache-and-network",variables:{environmentId:i.id}}),L=F?.previewVariablesForEnvironment?.envVariables,{completions:N,dispatch:de,refreshSchema:_,schemaOverrides:W,templateVariables:Ce,templateVariablesBySection:Ze}=Ht({emailLayoutKey:t.key}),[ke,{loading:we}]=Xt($t,{fetchPolicy:"cache-and-network",onCompleted:({result:y})=>k(y??void 0)}),Z=x.useCallback(y=>{const{htmlContent:P,textContent:V,footerLinks:U}=Y(y),J={htmlContent:P,textContent:V,footerLinks:U},ue=Y(f.current),pe=JSON.stringify(Object.fromEntries(Object.entries(Ce).filter(([Se])=>Se!==oe.content&&Se!==oe.footerLinks)));!(ue.htmlContent!==J.htmlContent||ue.textContent!==J.textContent||!R.isEqual(ue.footerLinks,J.footerLinks))&&j.current===pe||(f.current=J,j.current=pe,ke({variables:{environmentId:i.id,input
3:{emailLayoutKey:t.key,emailLayout:J,previewVariables:pe,isMjml:t.isMjml??!1}}}))},[ke,i.id,Ce,t.isMjml,t.key]);x.useEffect(()=>{L&&Z(t)},[L,Z,t]);const et=x.useCallback(async y=>{const V=(await w({variables:{input:{emailLayoutId:t.id,variableOverrides:JSON.stringify(y)}}})).data?.result?.errors;if(V?.length){const[U]=V;throw new Error(U?.message||"Failed to save preview variables")}await _()},[t.id,_,w]);if(!r||!n)return null;const Ee=Ge(t,i,a),me=a&&t?.originEnvironment?{name:t.originEnvironment.name?.toLowerCase(),slug:t.originEnvironment.slug}:{name:"development",slug:"development"},ee={readOnly:Ee,emailLayout:t,updateLayout:w,variables:L,isPreviewLoading:we,previewResult:C,refreshPreviewMaybe:Z,previewAppearance:T,setPreviewAppearance:E},tt={emailLayoutId:t?.id,name:t?.name,htmlContent:t?.htmlContent,textContent:t?.textContent,footerLinks:Y(t?.footerLinks||[])};return e.jsx(le,{enableReinitialize:!0,initialValues:tt,onSubmit:async(y,P)=>{const V=await w({variables:{input:y}});return V.data?.result?.errors&&V.data.result.errors.forEach(U=>P.setFieldError(U.field,U.message)),V},children:y=>e.jsxs(O,{as:ce,h:"full",backgroundColor:"surface-1",style:{display:"flex",flexDirection:"column"},children:[Ee&&e.jsx(It,{message:a?`This layout can only be modified in its origin environment. Switch to the ${me.name} environment to update this layout.`:`Layouts cannot be edited in the ${l?.name} environment. Switch to a lower environment to update layouts.`,targetEnvironmentName:me.name,onSwitchEnvironment:()=>{o.push({pathname:o.pathname,query:{...o.query,environment:me.slug}})}}),e.jsxs(S.Group,{orientation:"horizontal",children:[d&&e.jsxs(e.Fragment,{children:[e.jsx(S.Item,{id:"email-layout-template-vars",defaultSize:"20%",minSize:"15%",maxSize:"40%",borderTop:"0",children:e.jsx(Zt,{dispatch:de,schemaOverrides:W,templateVariablesBySection:Ze,onSaveSchemaOverrides:et})}),e.jsx(S.Handle,{})]}),e.jsx(S.Item,{id:"email-layout-editor-tabs",defaultSize:"80%",minSize:"60%",variant:"transparent",borderTop:"0",children:e.jsxs(z,{value:s,onValueChange:v,style:{display:"flex",flexDirection:"column",height:"100%"},children:[e.jsx(h,{align:"center",px:"2",children:e.jsxs(z.List,{mb:"0",mt:"1",children:[e.jsx(z.Tab,{value:"general",children:"General"}),e.jsx(z.Tab,{value:"editor",children:"Editor"}),e.jsx(z.Tab,{value:"usage",children:"Used in"}),e.jsx(z.Tab,{value:he,trailingComponent:e.jsx(Et,{}),children:"Changes"})]})}),e.jsx(z.Panel,{value:"general",px:"0",style:{flex:1,overflow:"auto"},children:e.jsx(h,{direction:"column",h:"full",children:e.jsx(O,{style:{flex:1,minHeight:0},children:e.jsx(jr,{formProps:y,account:r,completionsOverride:N,environment:i,project:n,isPreviewPaneOpen:g,isOpen:s==="general",...ee},"v2-general-visual")})})}),e.jsx(z.Panel,{value:"editor",px:"0",style:{flex:1,overflow:"hidden"},children:e.jsx(Xe,{account:r,completionsOverride:N,formProps:y,targetContent:m==="html"?"htmlContent":"textContent",isOpen:s==="editor",isPreviewPaneOpen:g,contentTypeSelector:e.jsx(Qe,{size:"0",icon:{icon:m==="html"?Ye:Qt,"aria-hidden":!0},children:m==="html"?t.isMjml?"MJML":"HTML":"Plaintext"}),contentTypeSwitchButton:e.jsx(B,{size:"1",variant:"ghost",color:"gray",leadingIcon:{icon:dt,"aria-hidden":!0},onClick:()=>c(P=>P==="html"?"text":"html"),children:m==="html"?"Plaintext":t.isMjml?"MJML":"HTML"}),...ee},`v2-${m}`)}),e.jsx(z.Panel,{value:"usage",px:"0",forceBackgroundMount:"once",hidden:s!=="usage",style:{flex:1,overflow:"hidden"},children:e.jsxs(S.Group,{orientation:"horizontal",children:[e.jsx(S.Item,{id:"email-layout-usages",defaultSize:"50%",minSize:"20%",maxSize:"60%",style:{overflow:"auto"},children:e.jsx(Tt,{entityType:nt.EmailLayout,entityKey:t.key,environmentId:i.id})}),g&&e.jsxs(e.Fragment,{children:[e.jsx(S.Handle,{}),e.jsx(S.Item,{id:"email-layout-usages-preview",defaultSize:"50%",minSize:"30%",maxSize:"80%",children:e.jsx(ve,{previewAppearance:T,setPreviewAppearance:E,children:e.jsx(be,{isPreviewLoading:we,previewAppearance:T,previewResult:C,refreshPreviewMaybe:Z})})})]})]})}
3),e.jsx(z.Panel,{value:he,px:"0",forceBackgroundMount:"once",borderTop:"px",hidden:s!==he,style:{flex:1,overflow:"hidden"},children:e.jsx(St,{children:e.jsx(Lt,{object:t,editTabDestination:{tab:"editor"},canCommit:t.canBePublished})})})]})}),p&&e.jsx(Pt.Portal,{children:e.jsxs(h,{direction:"row",align:"center",gap:"2",mr:"2",children:[e.jsx(q,{label:ee.readOnly?"A layout can only be modified in the development environment.":Object.keys(y.touched).length>0&&y.dirty?"Save layout (â+S)":"You haven't made any changes to this layout yet.",children:e.jsx(O,{as:"span",children:e.jsx(B,{type:"button",variant:"outline",size:"1",disabled:ee.readOnly||!(Object.keys(y.touched).length>0&&y.dirty)||!y.isValid,state:y.isSubmitting?"loading":"default",onClick:()=>y.submitForm(),children:"Save changes"})})}),e.jsx(Pe,{commitButtonProps:{canCommit:t.canBePublished&&!(Object.keys(y.touched).length>0&&y.dirty)}}),e.jsx(O,{borderLeft:"px",h:"4"}),e.jsxs(h,{gap:"1",children:[e.jsx(B,{size:"1",variant:d?"outline":"ghost",icon:{icon:Yt,alt:"Toggle template variables pane"},active:d,onClick:()=>b(P=>!P)}),e.jsx(B,{size:"1",variant:g?"outline":"ghost",icon:{icon:mt,alt:"Toggle preview pane"},active:g,onClick:()=>u(P=>!P)})]})]})}),!p&&e.jsx(Pe,{commitButtonProps:{canCommit:t.canBePublished&&!(Object.keys(y.touched).length>0&&y.dirty)},hidden:!0})]})]})})},kr=()=>{const i=qe(),{key:t}=i.query,{account:r}=fe(),{environment:a}=se(),n=r?.allEnvironmentsWriteable||!1,l=gt(r),{data:o,loading:s,refetch:m}=je(ht,{skip:!r||!a?.id||!t,variables:{environmentId:a?.id,key:t}});if(ut({type:"activeEmailLayoutKey",value:o?.emailLayout?.key,skip:!o?.emailLayout?.key}),pt({signalKey:`knock:email_layout:refetch:${o?.emailLayout?.id}`,fn:()=>m(),skip:!o?.emailLayout?.id}),s)return e.jsx(Fe,{});const c=o?.emailLayout??null,d=Ge(c,a,n);return!r||!a||!l?null:!s&&!c&&d?e.jsxs(e.Fragment,{children:[e.jsx(te,{children:e.jsx("title",{children:"Layout not found | Layouts | Knock"})}),e.jsx(A.Portal,{children:e.jsx(A.Container,{children:e.jsx(A.Item,{href:r?ie(r,a):"",children:"Layouts"})})}),e.jsx(h,{alignItems:"center",justifyContent:"center",mt:"44",children:e.jsx(re,{title:"Layout not found",description:`You haven't pushed your layout into this environment just yet. Make 4 sure you do that before pushing any workflows with an email channel 5 step.`,Actions:e.jsx(re.ActionButton,{as:$,href:xt(r,l,{key:t}),children:"Go to layout in development"})})})]}):!c&&!s?e.jsxs(e.Fragment,{children:[e.jsx(te,{children:e.jsx("title",{children:"Layout not found | Layouts | Knock"})}),e.jsx(h,{alignItems:"center",justifyContent:"center",mt:"44",children:e.jsx(re,{title:"Layout not found",description:"The layout you're looking for doesn't exist. Please check the layout key and try again.",Actions:e.jsx(re.ActionButton,{as:$,href:ie(r,a),children:"See all layouts"})})})]}):s?e.jsxs(e.Fragment,{children:[e.jsx(te,{children:e.jsx("title",{children:"Loading layout | Layouts | Knock"})}),e.jsx(Fe,{})]}):c?e.jsxs(e.Fragment,{children:[e.jsx(te,{children:e.jsxs("title",{children:[c.key," | Layouts | Knock"]})}),e.jsx(A.Portal,{children:e.jsxs(A.Container,{children:[e.jsx(A.Item,{href:r?ie(r,a):"",children:"Layouts"}),e.jsx(A.Separator,{}),e.jsx(A.Item,{children:c?.name||c?.key})]})}),c&&e.jsx(O,{h:"full",minH:"0",style:{display:"flex",flexDirection:"column"},children:e.jsx(Cr,{environment:a,emailLayout:c})})]}):null},wr=({children:i})=>{const{account:t}=fe(),{environment:r}=se(),a=t&&r?ie(t,r):null;return e.jsx(ot,{verifyPermission:"email_layouts:read",isPageFlush:!0,isFullHeight:!0,Sidebar:null,backButton:a?{href:a,label:"Back to layouts"}:void 0,initialBreadcrumb:e.jsx(A.Container,{children:e.jsx(A.Item,{children:"Layouts"})}),children:i})};kr.getLayout=i=>e.jsx(wr,{children:i});export{kr as default}; 6 7//# debugId=a30fcf5b-cfa2-5adc-a526-30608544d1ba
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.