slice-machine-ui 2.19.2-beta.6 → 2.19.2-beta.8

package/out/_next/static/chunks/pages/slices-a9b4d6d022cfcd88.js

@@ -1 +0,0 @@
-(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[436],{74600:function(e,t,n){var i=n(34311),l=n(23779),o=i(function(e,t,n){return e+(n?" ":"")+l(t)});e.exports=o},26688:function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/slices",function(){return n(31562)}])},34166:function(e,t,n){"use strict";n.d(t,{nZ:function(){return d},rT:function(){return u},tB:function(){return x}});var i=n(52322),l=n(11699),o=n(2784),s=n(30195),r=n(94160),a=n(76611),c=n(5683);function d(e){let{type:t,library:n,sliceId:i,variationId:l,langSmithUrl:o}=e,s=(0,c.iv)({type:t,library:n,sliceId:i,variationId:l}),r=JSON.stringify({langSmithUrl:o});localStorage.setItem(s,r)}function x(e){let{type:t,library:n,sliceId:i,variationId:l}=e,o=(0,c.iv)({type:t,library:n,sliceId:i,variationId:l});localStorage.removeItem(o)}function u(e){let{type:t,library:n,sliceId:d,variationId:x}=e,{key:u,value:m,done:h}=function(e){let{type:t,library:n,sliceId:i,variationId:l}=e,o=(0,c.iv)({type:t,library:n,sliceId:i,variationId:l}),[r,d]=(0,a.V)(o,void 0,{schema:s.z.object({langSmithUrl:s.z.string().url().optional()})});return{key:o,value:r,done:()=>d(void 0)}}({type:t,library:n,sliceId:d,variationId:x}),[p,f]=(0,o.useState)(),g=e=>()=>{m&&(f(u),r.Xe.track({event:"slice-generation-feedback",type:t,sliceId:d,variationId:x,feedback:e,langSmithUrl:m.langSmithUrl}),h())};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(l.be,{children:(0,i.jsx)(l.bQ,{anchor:(0,i.jsx)(l.D,{width:"100%",justifyContent:"center",position:"absolute",bottom:64}),icon:"check",title:"Thanks for your feedback!",seconds:2,open:!!p,onOpenChange:e=>{e||f(void 0)}},p)}),(0,i.jsx)(l.i,{children:m&&(0,i.jsxs)(l.D,{flexDirection:"row",justifyContent:"end",gap:8,alignItems:"center",children:[(0,i.jsx)(l.bL,{color:"grey11",children:"Did the AI get it right?"}),(0,i.jsxs)(l.D,{flexDirection:"row",gap:4,children:[(0,i.jsx)(l.c3,{side:"bottom",sideOffset:4,variant:"text",content:"Looks good",children:(0,i.jsx)(l.aZ,{variant:"solid",size:"small",icon:"thumbUp",onClick:g("up")})}),(0,i.jsx)(l.c3,{side:"bottom",sideOffset:4,variant:"text",content:"Needs improvement",children:(0,i.jsx)(l.aZ,{variant:"solid",size:"small",icon:"thumbDown",onClick:g("down")})})]})]})})]})}},33986:function(e,t,n){"use strict";n.d(t,{z:function(){return a}});var i=n(52322),l=n(2784),o=n(75289);let s=(e,t)=>e?"".concat(e,"-").concat(t):"",r=e=>{switch(e){case"white":case"secondaryMedium":case"secondarySmall":case"secondary":return"#1A1523";default:return"grey01"}},a=(0,l.forwardRef)((e,t)=>{let{label:n,Icon:l,type:a,form:c,isLoading:d=!1,disabled:x=!1,onClick:u,sx:m={},iconSize:h=16,iconFill:p,variant:f="primary",...g}=e;return(0,i.jsx)(o.zx,{ref:t,sx:{...m,display:"flex",alignItems:"center",justifyContent:"center",gap:"8px",...d?{cursor:"wait !important"}:{}},type:a,form:c,disabled:x||d,onClick:d?void 0:u,variant:f,...g,children:d?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(o.$j,{size:h,color:r(f),"data-testid":s(g["data-testid"],"spinner")}),l&&n]}):(0,i.jsxs)(i.Fragment,{children:[l&&(0,i.jsx)(l,{size:h,fill:p,"data-testid":s(g["data-testid"],"icon")}),n]})})})},46999:function(e,t,n){"use strict";n.d(t,{W:function(){return s}});var i=n(52322),l=n(63397);n(2784);var o=n(75289);let s=e=>{let{name:t,label:n,placeholder:s,error:r,testId:a,onChange:c}=e;return(0,i.jsxs)(o.xu,{mb:3,children:[(0,i.jsx)(o.__,{htmlFor:t,mb:2,children:n}),(0,i.jsx)(l.gN,{name:t,type:"text",placeholder:s,as:o.II,autoComplete:"off",...c?{onChange:c}:null,...a?{"data-testid":a}:null}),r?(0,i.jsx)(o.xv,{"data-testid":a?"".concat(a,"-error"):"input-error",sx:{color:"error",mt:1},children:r}):null]})}},59532:function(e,t,n){"use strict";var i=n(52322),l=n(63397),o=n(37149),s=n.n(o),r=n(75289),a=n(33986),c=n(55862),d=n(30527);function x(e){let{children:t}=e,n=(0,d.W)();return(0,i.jsx)(r.kC,{sx:{position:"sticky",top:0,zIndex:1,p:"16px",pl:4,bg:"headSection",alignItems:"center",justifyContent:"space-between",borderTopLeftRadius:n,borderTopRightRadius:n,borderBottom:e=>{var t;return"1px solid ".concat(null===(t=e.colors)||void 0===t?void 0:t.borders)}},children:t})}t.Z=function(e){let{children:t,close:n,isOpen:o,formId:u,validate:m,onSubmit:h,widthInPx:p,initialValues:f,content:{title:g},cardProps:j,omitFooter:v=!1,isLoading:y=!1,buttonLabel:b="Save",testId:S,actionMessage:C}=e;return s().setAppElement("#__next"),(0,i.jsx)(c.Z,{isOpen:o,shouldCloseOnOverlayClick:!0,onRequestClose:n,contentLabel:g,style:{content:{width:null!=p?p:"900px"}},children:(0,i.jsx)(l.J9,{initialValues:f,validate:e=>m?m(e):void 0,onSubmit:e=>{h(e)},children:e=>{let{isValid:o,isSubmitting:s,values:c,errors:m,touched:h,setFieldValue:p,setValues:f}=e;return(0,i.jsx)(l.l0,{id:u,...null!=S?{"data-testid":S}:null,children:(0,i.jsx)(d.Z,{borderFooter:!0,footerSx:{p:3,position:"sticky",bottom:0,background:"gray"},bodySx:{px:4,py:4},sx:{border:"none"},...j,Header:(0,i.jsxs)(x,{children:[(0,i.jsx)(r.X6,{sx:{fontSize:"20px"},children:g}),(0,i.jsx)(r.x8,{type:"button",onClick:n})]}),Footer:v?null:(0,i.jsxs)(r.kC,{sx:{alignItems:"space-between"},children:[(0,i.jsx)(r.kC,{sx:{fontSize:"14px",alignItems:"center"},children:"function"==typeof C?C(e):C}),(0,i.jsxs)(r.kC,{sx:{ml:"auto"},children:[(0,i.jsx)(r.zx,{mr:2,type:"button",onClick:n,variant:"secondary",disabled:s||y,children:"Cancel"}),(0,i.jsx)(a.z,{label:b,form:u,type:"submit",disabled:!o||s||y,isLoading:s||y,sx:{fontWeight:"400",paddingBlock:"8px",paddingInline:"16px",fontSize:"14px",borderRadius:"4px"}})]})]}),children:t({isValid:o,isSubmitting:s,values:c,errors:m,touched:h,setFieldValue:p,setValues:f})})})}})})}},31562:function(e,t,n){"use strict";n.r(t),n.d(t,{default:function(){return M}});var i=n(52322),l=n(11699),o=n(97729),s=n.n(o),r=n(5632),a=n(2784),c=n(56580),d=n(88932),x=n(65077),u=n(75289),m=n(43388),h=n(21446),p=n(27213),f=n(51507),g=n(27763),j=n(21442),v=n(58446),y=n(65186),b=n(59326),S=n(34166),C=n(80148);async function k(e){let{sliceName:t,sliceID:n,libraryID:i,sliceVariationIds:l,onSuccess:o}=e;try{let{errors:e}=await C.managerClient.slices.deleteSlice({libraryID:i,sliceID:n});if(e.length>0)throw e;l.forEach(e=>{(0,S.tB)({type:"model",library:i,sliceId:n,variationId:e})}),o(),d.Am.success("Successfully deleted slice “".concat(t,"”"))}catch(n){let e="An unexpected error happened while deleting slice “".concat(t,"”.");console.error(e,n),d.Am.error(e)}}var w=n(68968),I=n(33986),z=n(30527),N=n(55862),D=n(54597);let R=e=>{var t;let{isOpen:n,libName:l,sliceId:o,sliceName:s,sliceVariationIds:r,onClose:c}=e,[d,x]=(0,a.useState)(!1),{deleteSliceSuccess:m}=(0,D.Z)(),{syncChanges:h}=(0,w.g)(),{theme:p}=(0,b.B7)(),f=async()=>{x(!0),await k({libraryID:l,sliceID:o,sliceName:s,sliceVariationIds:r,onSuccess:()=>{m(o,l),h()}}),c(),x(!1)};return(0,i.jsx)(N.Z,{isOpen:n,shouldCloseOnOverlayClick:!0,style:{content:{maxWidth:612}},onRequestClose:c,children:(0,i.jsx)(z.Z,{bodySx:{p:0,bg:"white",position:"relative",height:"100%",padding:16},footerSx:{position:"sticky",bottom:0,p:0},sx:{border:"none"},borderFooter:!0,Header:(0,i.jsxs)(u.kC,{sx:{position:"sticky",background:"gray",top:0,zIndex:1,p:"16px",alignItems:"center",justifyContent:"space-between",borderBottom:e=>{var t;return"1px solid ".concat(String(null===(t=e.colors)||void 0===t?void 0:t.borders))}},children:[(0,i.jsxs)(u.kC,{sx:{alignItems:"center"},children:[(0,i.jsx)(y.$vK,{size:20,color:null===(t=p.colors)||void 0===t?void 0:t.greyIcon}),(0,i.jsx)(u.X6,{sx:{fontSize:"14px",fontWeight:"bold",ml:1},children:"Delete Slice"})]}),(0,i.jsx)(u.x8,{type:"button",onClick:c})]}),Footer:()=>(0,i.jsxs)(u.kC,{sx:{justifyContent:"flex-end",height:64,alignItems:"center",paddingRight:16,borderTop:e=>{var t;return"1px solid ".concat(String(null===(t=e.colors)||void 0===t?void 0:t.darkBorders))},backgroundColor:"gray"},children:[(0,i.jsx)(I.z,{label:"Cancel",variant:"secondary",onClick:c,sx:{mr:"10px",fontWeight:"bold",color:"grey12",borderRadius:6}}),(0,i.jsx)(I.z,{label:"Delete",variant:"danger",isLoading:d,sx:{minHeight:39,minWidth:78},onClick:()=>{f()}})]}),children:(0,i.jsxs)(u.nv,{children:["This action will immediately make the following changes:",(0,i.jsxs)("ul",{children:[(0,i.jsxs)("li",{children:["Delete the"," ",(0,i.jsxs)(u.xv,{sx:{fontWeight:"bold"},children:[l,"/",s,"/"]})," ","directory."]}),(0,i.jsx)("li",{children:"Remove the Slice from all Slice Zones that use it."})]}),"The next time you push your changes to Prismic, the following change will happen:",(0,i.jsx)("ul",{children:(0,i.jsx)("li",{children:"Remove the Slice from the list of available Slices to use in the Page Builder."})}),"You will need to manually remove the Slice from any Pages that currently use it."]})})})};var W=n(36887),_=n(94160),Z=e=>{let{title:t,onCreateNew:n,buttonText:l,documentationComponent:o,videoPublicIdUrl:s,...r}=e;return(0,i.jsxs)(u.xu,{sx:{display:"flex",width:"80%",flexWrap:"wrap",justifyContent:"center"},...r,children:[(0,i.jsx)(u.xu,{sx:e=>{var t;return{display:"flex",flex:1,alignItems:"center",minWidth:"400px",maxWidth:"70%",border:"1px solid ".concat(null===(t=e.colors)||void 0===t?void 0:t.grey02)}},children:(0,i.jsx)(W.nk,{cloudName:"dmtf1daqp",controls:!0,loop:!0,style:{maxWidth:"100%",objectFit:"contain"},publicId:s,onPlay:()=>{_.Xe.track({event:"open-video-tutorials",video:s})}})}),(0,i.jsxs)(u.xu,{sx:e=>{var t;return{bg:"white",display:"flex",flexDirection:"column",border:"1px solid ".concat(null===(t=e.colors)||void 0===t?void 0:t.grey02),flex:1,minWidth:"400px",maxWidth:"70%"}},children:[(0,i.jsxs)(u.xu,{sx:e=>{var t;return{display:"flex",flexDirection:"column",p:4,borderBottom:"1px solid ".concat(null===(t=e.colors)||void 0===t?void 0:t.grey02)}},children:[(0,i.jsx)(u.X6,{as:"h3",variant:"heading",sx:{fontSize:"16px",lineHeight:"24px",mb:2},children:t}),(0,i.jsx)(u.xv,{variant:"xs",sx:{lineHeight:"24px",fontSize:"13px"},children:o})]}),(0,i.jsxs)(u.xu,{sx:{display:"flex",p:4,alignItems:"center"},children:[(0,i.jsx)(u.zx,{onClick:n,"data-testid":"empty-state-main-button",sx:{display:"flex",justifyContent:"center",alignItems:"center",flexShrink:0,mr:4},children:l}),(0,i.jsx)(u.xv,{sx:{fontSize:"12px",color:"grey04",maxWidth:"280px"},children:"It will be stored locally and you will be able to push it to your repository"})]})]})]})},O=n(6256),F=n(63908),L=n(26109);async function P(e){let{slice:t,newSliceName:n,onSuccess:i}=e;try{let e=(0,F.PQ)(t,n),{errors:l}=await C.managerClient.slices.renameSlice({libraryID:t.from,model:L.id.fromSM(e.model)});if(l.length>0)throw l;i(e),d.Am.success("Slice name updated")}catch(n){let e="An unexpected error happened while renaming “".concat(t.model.name,"”.");console.error(e,n),d.Am.error(e)}}var T=n(7723),A=n(59532),B=n(46999),E=n(63019);let X=e=>{var t,n;let{slice:l,isOpen:o,onClose:s}=e,{renameSliceSuccess:r}=(0,D.Z)(),{syncChanges:a}=(0,w.g)(),{localLibs:d,remoteLibs:x}=(0,c.v9)(e=>({localLibs:(0,T.Sd)(e),remoteLibs:(0,T.sT)(e)})),m=null!==(t=null==l?void 0:l.model.name)&&void 0!==t?t:"",h=async e=>{l&&(await P({slice:l,newSliceName:e.sliceName,onSuccess:e=>{r(e.from,e.model),a()}}),s())};return(0,i.jsx)(A.Z,{testId:"rename-slice-modal",isOpen:o,widthInPx:"530px",formId:"rename-slice-modal-".concat(null!==(n=null==l?void 0:l.model.id)&&void 0!==n?n:""),close:s,buttonLabel:"Rename",onSubmit:e=>void h(e),initialValues:{sliceName:m},content:{title:"Rename a slice"},validate:e=>(0,E.h)(e,d,x),children:e=>{let{touched:t,errors:n}=e;return(0,i.jsx)(u.xu,{children:(0,i.jsx)(B.W,{name:"sliceName",label:"Slice Name","data-testid":"slice-name-input",placeholder:"Pascalised Slice API ID (e.g. TextBlock)",error:t.sliceName?n.sliceName:void 0,testId:"slice-name-input"})})}})};var H=n(21151),U=n(86652),V=n(39204),q=n(7974),M=()=>{var e,t,n,o;let y=(0,r.useRouter)(),{modalPayload:b,onOpenModal:S}=(0,j.H)(),{openLoginModal:k}=(0,D.Z)(),w=(0,p.F)({menuType:"Dropdown"}),{sliceFilterFn:I,defaultVariationSelector:z}=b,{remoteSlices:N,libraries:W}=(0,c.v9)(e=>({remoteSlices:(0,T.sT)(e),libraries:(0,T.Sd)(e)})),[_,F]=(0,a.useState)(!1),[L,P]=(0,a.useState)(!1),[A,B]=(0,a.useState)(!1),[E,M]=(0,a.useState)(!1),Q=W.filter(e=>e.isLocal),Y=W.map(e=>(e.components=[...e.components].sort((e,t)=>e.model.name.localeCompare(t.model.name)),e)),G=(W||[]).map(e=>e.components).flat(),J=G.length,[K,$]=(0,a.useState)(),ee=()=>{P(!0)},et=()=>{B(!0)},en=async()=>{await C.managerClient.user.checkIsLoggedIn()?M(!0):k()},ei=()=>{M(!1)};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(s(),{children:(0,i.jsx)("title",{children:"Slices - Slice Machine"})}),(0,i.jsxs)(v.LN,{children:[(0,i.jsxs)(v.wd,{children:[(0,i.jsx)(v.Cx,{children:(0,i.jsx)(m.g,{children:"Slices"})}),(null==Q?void 0:Q.length)!==0&&0!==J?(0,i.jsxs)(l.ar,{children:[(0,i.jsx)(l.av,{children:(0,i.jsx)(l.E,{color:"purple",startIcon:"add","data-testid":"add-new-slice-dropdown",children:"Add"})}),(0,i.jsxs)(l.as,{align:"end",children:[(0,i.jsx)(l.at,{renderStartIcon:()=>w.fromImage.BackgroundIcon,onSelect:()=>void en(),description:w.fromImage.description,children:w.fromImage.title}),(0,i.jsx)(l.at,{renderStartIcon:()=>w.fromScratch.BackgroundIcon,onSelect:()=>F(!0),description:w.fromScratch.description,children:w.fromScratch.title})]})]}):void 0]}),(0,i.jsxs)(v.RN,{children:[(0,i.jsx)(x.xR,{sx:{display:"flex",flexDirection:"column"},children:Y.length>0?(0,i.jsx)(u.kC,{sx:{flex:1,flexDirection:"column"},children:0===J?(0,i.jsx)(u.kC,{sx:{flex:1,justifyContent:"center",alignItems:"center"},children:(0,i.jsx)(Z,{title:"What are slices?",onCreateNew:()=>{F(!0)},buttonText:"Create one",videoPublicIdUrl:q.rd,documentationComponent:(0,i.jsxs)(i.Fragment,{children:['Slices are sections of your website. Prismic documents contain a dynamic "Slice Zone" that allows content creators to add, edit, and rearrange slices to compose dynamic layouts for any page design.'," ",(0,i.jsx)(u.rU,{target:"_blank",href:"https://prismic.io/docs/core-concepts/slices",sx:e=>{var t;return{color:null==e?void 0:null===(t=e.colors)||void 0===t?void 0:t.primary}},children:"Learn more"}),"."]}),"data-testid":"slices-table-blank-slate"})}):Y.map(e=>{let{name:t,isLocal:n,components:l}=e;return(0,i.jsxs)(u.kC,{sx:{flexDirection:"column","&:not(:last-of-type)":{mb:4}},children:[(0,i.jsxs)(u.kC,{sx:{alignItems:"center",justifyContent:"space-between"},children:[(0,i.jsx)(u.kC,{sx:{alignItems:"center",fontSize:3,lineHeight:"48px",fontWeight:"heading",mb:1},children:(0,i.jsx)(u.xv,{children:1===Y.length?"Your slices":t})}),!n&&(0,i.jsx)("p",{children:"⚠️ External libraries are read-only"})]}),(0,i.jsx)(H.Z,{elems:l,defineElementKey:e=>e.model.name,renderElem:e=>(0,i.jsx)(f.b,{action:{type:"menu",onRemove:()=>{$(e),ee()},onRename:()=>{$(e),et()}},mode:"navigation",onUpdateScreenshot:()=>{S({sliceFilterFn:t=>t.filter(t=>t.model.id===e.model.id)})},slice:e,variant:"solid"}),gridGap:"32px 16px"})]},t)})}):void 0}),(null==Q?void 0:Q.length)>0&&(0,i.jsx)(U.Z,{slices:I(G),defaultVariationSelector:z}),(null==Q?void 0:Q.length)>0&&_&&(0,i.jsx)(O.c,{localLibraries:Q,location:"slices",remoteSlices:N,onSuccess:(e,t)=>{let n=e.variations[0].id,i=g.Y.getBuilderPagePathname({libraryName:t,sliceName:e.name,variationId:n});y.push(i),d.Am.success((0,V.kQ)({path:"".concat(t,"/").concat(e.name,"/model.json")}))},onClose:()=>{F(!1)}}),(0,i.jsx)(X,{isOpen:A,slice:K,onClose:()=>{B(!1)},"data-testid":"rename-slice-modal"}),(0,i.jsx)(R,{isOpen:L,libName:null!==(e=null==K?void 0:K.from)&&void 0!==e?e:"",sliceId:null!==(t=null==K?void 0:K.model.id)&&void 0!==t?t:"",sliceName:null!==(n=null==K?void 0:K.model.name)&&void 0!==n?n:"",sliceVariationIds:(null!==(o=null==K?void 0:K.model.variations)&&void 0!==o?o:[]).map(e=>e.id),onClose:()=>{P(!1)}}),(0,i.jsx)(h.S,{open:E,location:"slices",onSuccess:e=>{let{library:t}=e;d.Am.success((0,i.jsx)(V.GX,{message:"Slice(s) added to slice zone and created at: ",path:t})),ei()},onClose:ei})]})]})]})}}},function(e){e.O(0,[898,789,797,397,66,344,444,882,633,593,888,774,179],function(){return e(e.s=26688)}),_N_E=e.O()}]);