slice-machine-ui 2.19.2-alpha.jp-figma-to-slice-2.1 → 2.19.2-alpha.jp-figma-to-slice-2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/out/404.html +1 -1
  2. package/out/_next/static/Wmps-QiwWdxiaXbaHHRvL/_buildManifest.js +1 -0
  3. package/out/_next/static/chunks/{489-b4b2ce029ea444c1.js → 489-32281540712d98bb.js} +1 -1
  4. package/out/_next/static/chunks/{593-97393b59cba3d429.js → 593-7ffd1197c3405ef8.js} +1 -1
  5. package/out/_next/static/chunks/633-275b9968b5aaa920.js +1 -0
  6. package/out/_next/static/chunks/882-48d61b2fabee28d8.js +1 -0
  7. package/out/_next/static/chunks/pages/{_app-1d7a014f4b9c9714.js → _app-ea98f69a500733ed.js} +1 -1
  8. package/out/_next/static/chunks/pages/{changes-b3f45dfeb5dc08f0.js → changes-e66094f57453cf9c.js} +1 -1
  9. package/out/_next/static/chunks/pages/custom-types/{[customTypeId]-02278526092bcf5c.js → [customTypeId]-6d613b67e6967ae5.js} +1 -1
  10. package/out/_next/static/chunks/pages/page-types/{[pageTypeId]-4d99de1b52de7c9b.js → [pageTypeId]-40207b66190e3fcd.js} +1 -1
  11. package/out/_next/static/chunks/pages/slices/[lib]/[sliceName]/{[variation]-330e5d545d9f6269.js → [variation]-22ffa2561ac66557.js} +1 -1
  12. package/out/_next/static/chunks/pages/{slices-de5f8cf4719e88c4.js → slices-a9b4d6d022cfcd88.js} +1 -1
  13. package/out/changelog.html +1 -1
  14. package/out/changes.html +1 -1
  15. package/out/custom-types/[customTypeId].html +1 -1
  16. package/out/custom-types.html +1 -1
  17. package/out/index.html +1 -1
  18. package/out/labs.html +1 -1
  19. package/out/page-types/[pageTypeId].html +1 -1
  20. package/out/slices/[lib]/[sliceName]/[variation]/simulator.html +1 -1
  21. package/out/slices/[lib]/[sliceName]/[variation].html +1 -1
  22. package/out/slices.html +1 -1
  23. package/package.json +3 -3
  24. package/src/features/customTypes/customTypesBuilder/CreateSliceFromImageModal/CreateSliceFromImageModal.tsx +2 -4
  25. package/src/features/customTypes/customTypesBuilder/CreateSliceFromImageModal/SliceCard.tsx +2 -2
  26. package/src/icons/FigmaIcon.tsx +6 -61
  27. package/src/icons/FigmaIconSquare.tsx +45 -0
  28. package/src/legacy/components/ScreenshotChangesModal/index.tsx +2 -2
  29. package/out/_next/static/chunks/20-169231cb23a752ff.js +0 -1
  30. package/out/_next/static/chunks/907-ed8b6f8bf21b1e5d.js +0 -1
  31. package/out/_next/static/fXaiB7Mqn_2CEdnnVaEyz/_buildManifest.js +0 -1
  32. /package/out/_next/static/{fXaiB7Mqn_2CEdnnVaEyz → Wmps-QiwWdxiaXbaHHRvL}/_ssgManifest.js +0 -0
package/out/404.html CHANGED
@@ -1 +1 @@
1
- <!DOCTYPE html><html><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width"/><meta name="next-head-count" content="2"/><link rel="preload" href="/_next/static/css/bc89f2cd4e4781f5.css" as="style"/><link rel="stylesheet" href="/_next/static/css/bc89f2cd4e4781f5.css" data-n-g=""/><noscript data-n-css=""></noscript><script defer="" nomodule="" src="/_next/static/chunks/polyfills-42372ed130431b0a.js"></script><script src="/_next/static/chunks/webpack-24ddb02bea621501.js" defer=""></script><script src="/_next/static/chunks/framework-ab7ddb551c23d05a.js" defer=""></script><script src="/_next/static/chunks/main-de87250a4e0c9fcf.js" defer=""></script><script src="/_next/static/chunks/pages/_app-1d7a014f4b9c9714.js" defer=""></script><script src="/_next/static/chunks/pages/_error-fedd2c6ebd3d27b9.js" defer=""></script><script src="/_next/static/fXaiB7Mqn_2CEdnnVaEyz/_buildManifest.js" defer=""></script><script src="/_next/static/fXaiB7Mqn_2CEdnnVaEyz/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"statusCode":404}},"page":"/_error","query":{},"buildId":"fXaiB7Mqn_2CEdnnVaEyz","runtimeConfig":{"sentryEnvironment":"alpha"},"nextExport":true,"isFallback":false,"gip":true,"scriptLoader":[]}</script></body></html>
1
+ <!DOCTYPE html><html><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width"/><meta name="next-head-count" content="2"/><link rel="preload" href="/_next/static/css/bc89f2cd4e4781f5.css" as="style"/><link rel="stylesheet" href="/_next/static/css/bc89f2cd4e4781f5.css" data-n-g=""/><noscript data-n-css=""></noscript><script defer="" nomodule="" src="/_next/static/chunks/polyfills-42372ed130431b0a.js"></script><script src="/_next/static/chunks/webpack-24ddb02bea621501.js" defer=""></script><script src="/_next/static/chunks/framework-ab7ddb551c23d05a.js" defer=""></script><script src="/_next/static/chunks/main-de87250a4e0c9fcf.js" defer=""></script><script src="/_next/static/chunks/pages/_app-ea98f69a500733ed.js" defer=""></script><script src="/_next/static/chunks/pages/_error-fedd2c6ebd3d27b9.js" defer=""></script><script src="/_next/static/Wmps-QiwWdxiaXbaHHRvL/_buildManifest.js" defer=""></script><script src="/_next/static/Wmps-QiwWdxiaXbaHHRvL/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"statusCode":404}},"page":"/_error","query":{},"buildId":"Wmps-QiwWdxiaXbaHHRvL","runtimeConfig":{"sentryEnvironment":"alpha"},"nextExport":true,"isFallback":false,"gip":true,"scriptLoader":[]}</script></body></html>
package/out/_next/static/Wmps-QiwWdxiaXbaHHRvL/_buildManifest.js ADDED
@@ -0,0 +1 @@
1
+ self.__BUILD_MANIFEST=function(s,c,a,e,t,i,b,n,u,f,d,h,k,j,l,p,g,o,r,m,_,y,I){return{__rewrites:{afterFiles:[],beforeFiles:[],fallback:[]},"/":[s,t,g,o,"static/chunks/pages/index-0d8cb369de720a35.js"],"/_error":["static/chunks/pages/_error-fedd2c6ebd3d27b9.js"],"/changelog":[c,i,"static/chunks/870-a72b74312773efea.js","static/chunks/pages/changelog-8514e0696e90a1b2.js"],"/changes":[c,b,"static/chunks/8eec4907-b712959d9f984b68.js",a,"static/chunks/125-00b909bdbab2ca15.js",e,u,"static/css/d98ebc475f8423a3.css","static/chunks/pages/changes-e66094f57453cf9c.js"],"/custom-types":[s,t,g,o,"static/chunks/pages/custom-types-5acd56959b60346f.js"],"/custom-types/[customTypeId]":[c,f,d,h,k,s,a,i,n,j,r,e,t,l,p,m,_,"static/chunks/pages/custom-types/[customTypeId]-6d613b67e6967ae5.js"],"/labs":["static/chunks/pages/labs-56fd818a63553497.js"],"/page-types/[pageTypeId]":[c,f,d,h,k,s,a,i,n,j,r,e,t,l,p,m,_,"static/chunks/pages/page-types/[pageTypeId]-40207b66190e3fcd.js"],"/slices":[c,b,y,s,a,n,I,e,p,u,"static/css/efa5152b7c0f35c0.css","static/chunks/pages/slices-a9b4d6d022cfcd88.js"],"/slices/[lib]/[sliceName]/[variation]":[c,b,f,d,h,k,y,s,a,i,n,j,I,"static/chunks/484-3e011e79c41f0342.js",e,l,u,"static/css/e8e03c0d4003d1eb.css","static/chunks/pages/slices/[lib]/[sliceName]/[variation]-22ffa2561ac66557.js"],"/slices/[lib]/[sliceName]/[variation]/simulator":[b,"static/chunks/72585f70-28b4d7d5384b3703.js","static/chunks/429-aab52070cad2884b.js","static/chunks/pages/slices/[lib]/[sliceName]/[variation]/simulator-faeb6d2f77d97096.js"],sortedPages:["/","/_app","/_error","/changelog","/changes","/custom-types","/custom-types/[customTypeId]","/labs","/page-types/[pageTypeId]","/slices","/slices/[lib]/[sliceName]/[variation]","/slices/[lib]/[sliceName]/[variation]/simulator"]}}("static/chunks/397-e6c340070a3bcb41.js","static/chunks/59b4e022-ef680789f7cc9b11.js","static/chunks/66-d9d3bcb5d041cb6d.js","static/chunks/882-48d61b2fabee28d8.js","static/chunks/647-aa094286bc248d52.js","static/chunks/183-4ea255b867ff171b.js","static/chunks/c8eae200-966ce352f7b5d2b9.js","static/chunks/344-b64f09e670634ed1.js","static/chunks/593-7ffd1197c3405ef8.js","static/chunks/f36c6662-1f3a854183168b10.js","static/chunks/4c744e84-480e426e4b1cfef3.js","static/chunks/065a3ddb-9a38ca0d60f0bf2f.js","static/chunks/1cc2734a-09fb3b997ad1eb70.js","static/chunks/256-07f768a2b19b0a0e.js","static/chunks/630-2bf927bca082a191.js","static/chunks/633-275b9968b5aaa920.js","static/chunks/248-84a5987f0499b074.js","static/css/4e475d945cf8a890.css","static/chunks/422-c9192a1dbdd2ae0e.js","static/chunks/489-32281540712d98bb.js","static/css/56f2a6684a524374.css","static/chunks/52d4c156-89c6ec6efca0a0bb.js","static/chunks/444-d39213143f782fec.js"),self.__BUILD_MANIFEST_CB&&self.__BUILD_MANIFEST_CB();
package/out/_next/static/chunks/{489-b4b2ce029ea444c1.js → 489-32281540712d98bb.js} RENAMED
@@ -1 +1 @@
1
- (self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[489],{19489:function(e,t,l){"use strict";l.d(t,{H:function(){return e4}});var n=l(52322),i=l(11699),a=l(97729),o=l.n(a),r=l(5632),s=l(2784),c=l(56580),d=l(43388),m=l(77630),u=l(23094),h=l(59294),p=l(58446),x=l(74217),v=l(94160),b=l(68968),y=l(23710),g=l(54597),f=l(98564);let j=(0,s.createContext)(void 0);function S(e){let{children:t,initialCustomType:l}=e,[i,a]=(0,s.useState)(l),o=(0,m.y6)(i),r=f.$[o],{actionQueueStatus:c,setNextAction:d}=(0,y.c)({errorMessage:r.autoSaveFailed}),{refreshState:u}=(0,g.Z)(),h=(0,x.R9)(u),{syncChanges:p}=(0,b.g)(),S=(0,s.useCallback)(e=>{let{customType:t,onSaveCallback:l,updateMeta:n}=e;a(t),d(async()=>{let{errors:e}=await (0,v.KA)({customType:t,updateMeta:n});if(e.length>0)throw e;h(await (0,v.y0)()),p(),null==l||l()})},[d,h,p]),I=(0,s.useMemo)(()=>({actionQueueStatus:c,customType:i,setCustomType:S}),[c,i,S]);return(0,n.jsx)(j.Provider,{value:I,children:"function"==typeof t?t(I):t})}function I(){let e=(0,s.useContext)(j);if(!e)throw Error("CustomTypeProvider not found");return e}var C=l(30195);function T(){var e;let[t,l]=(0,s.useState)(!1),{customType:a,setCustomType:o}=I(),[r,c]=null!==(e=(0,m.j5)(a))&&void 0!==e?e:[],d=c?(0,m.N3)(c):"",[u,h]=(0,s.useState)(null!=d?d:""),[p,v]=(0,s.useState)();(0,x.pQ)(t,()=>{t||(h(null!=d?d:""),v(void 0))});let b=(0,s.useCallback)(()=>(0,n.jsx)(i.aX,{name:c?"language":"add",size:"small",color:"grey11"}),[c]);return(0,n.jsxs)(i.ae,{open:t,onOpenChange:l,size:"small",trigger:(0,n.jsx)(i.E,{color:"grey",textColor:"placeholder",textWeight:"normal",renderStartIcon:b,sx:{marginInline:"auto"},children:c?d:"Add an UID"}),children:[(0,n.jsx)(i.al,{title:"Edit the UID label"}),(0,n.jsx)(i.aj,{children:(0,n.jsxs)(i.aJ,{onSubmit:function(){p||(o({customType:c?(0,m.eK)(u,a):(0,m.H8)(u,a)}),l(!1))},children:[(0,n.jsx)(i.D,{flexDirection:"column",padding:16,gap:4,children:(0,n.jsx)(i.aM,{type:"text",label:"Label *",placeholder:"UID",value:u,onValueChange:function(e){h(e),v(function(e){let t=D.safeParse(e,{errorMap:w});if(t.error)return t.error.errors[0].message}(e))},error:p,description:"A label for the UID"})}),(0,n.jsxs)(i.ah,{children:[(0,n.jsx)(i.ai,{size:"medium"}),(0,n.jsx)(i.af,{type:"submit",size:"medium",disabled:!!p,children:"Save"})]})]})})]})}let D=C.z.string().max(35).min(1),w=e=>{switch(e.code){case C.z.ZodIssueCode.too_big:return{message:"The label can't be longer than ".concat(e.maximum," characters")};case C.z.ZodIssueCode.too_small:return{message:"This field is required"};default:return{message:"Invalid value"}}};var k=l(94840),_=l(59532),L=l(63397),A=l(75289);let E=e=>{let{name:t,label:l,placeholder:i,error:a,...o}=e;return(0,n.jsxs)(A.xu,{mb:3,children:[(0,n.jsx)(A.__,{htmlFor:t,mb:2,children:l}),(0,n.jsx)(L.gN,{name:t,type:"text",placeholder:i,as:A.II,autoComplete:"off",...o}),a?(0,n.jsx)(A.xv,{sx:{color:"error",mt:1},children:a}):null]})};var N=e=>{let{isOpen:t,onSubmit:l,close:i,tabIds:a}=e;return(0,n.jsx)(_.Z,{isOpen:t,widthInPx:"530px",formId:"create-tab",close:i,onSubmit:e=>{l(e),i()},initialValues:{id:""},validate:e=>{let{id:t}=e;return t?a.includes(t.toLowerCase())?{id:"Tab exists already"}:void 0:{id:"Tab ID is required"}},content:{title:"Add Tab"},children:e=>{let{errors:t}=e;return(0,n.jsx)(E,{name:"id",label:"New Tab ID",placeholder:"A label for selecting the tab (i.e. not used in the API)",error:t.id})}})},M=e=>{let{isOpen:t,onSubmit:l,close:i}=e;return(0,n.jsx)(_.Z,{omitFooter:!0,isOpen:t,widthInPx:"530px",formId:"create-tab",close:i,cardProps:{bodySx:{p:0}},onSubmit:e=>{l(e),i()},initialValues:{},content:{title:"Remove Tab"},children:()=>(0,n.jsxs)(A.xu,{sx:{px:4,py:4},children:[(0,n.jsx)(A.X6,{as:"h4",children:"Remove this tab?"}),(0,n.jsx)(A.xv,{as:"p",color:"textClear",sx:{mt:2},children:"This action cannot be undone."}),(0,n.jsx)(A.zx,{type:"button",variant:"buttons.actionDelete",sx:{mt:3},onClick:()=>{l({}),i()},children:"Yes, remove tab"})]})})},z=e=>{let{isOpen:t,onSubmit:l,close:i,tabIds:a,initialTabKey:o}=e;return(0,n.jsx)(_.Z,{omitFooter:!0,isOpen:t,widthInPx:"530px",formId:"create-tab",close:i,cardProps:{bodySx:{p:0}},onSubmit:e=>{l(e),i()},initialValues:{id:o},validate:e=>{let{id:t}=e;return t?a.includes(t.toLowerCase())?{id:"Tab exists already"}:void 0:{id:"Tab ID is required"}},content:{title:"Rename Tab"},children:e=>{let{errors:t,values:a,setFieldValue:o,isValid:r}=e;return(0,n.jsxs)(A.xu,{sx:{px:4,py:4},children:[(0,n.jsx)(E,{name:"id",label:"Rename Tab ID",placeholder:"A label for selecting the tab (i.e. not used in the API)",error:t.id,onBlur:e=>{a.id!==e.target.value&&o("id",e.target.value.trim())},onChange:e=>{o("id",e.target.value)}}),(0,n.jsx)(A.zx,{type:"button",sx:{mt:3,width:"100%"},disabled:!r,onClick:()=>{a.id&&a.id.length&&l({id:a.id.trim()}),i()},children:"Save"})]})}})},Z=l(28316),O=l(88932),P=l(35289),F=l(87446),K=l(45440),B=l(16086),R=l(358),U=l(5495),V=l(39302),X=l(3285),G=l(40141),Y=l(65077),q=l(91589),H=l(27213);let Q=e=>{let{openCreateSliceModal:t,openCreateSliceFromImageModal:l,openUpdateSliceZoneModal:a,openSlicesTemplatesModal:o,projectHasAvailableSlices:r,isSlicesTemplatesSupported:s}=e,c=(0,H.F)({menuType:"ActionList"});return(0,n.jsxs)(i.s,{"data-testid":"slice-zone-blank-slate",sx:{width:648},children:[(0,n.jsx)(i.x,{lineColor:"purple9",backgroundColor:"purple5",name:"add",size:"large"}),(0,n.jsx)(i.z,{size:"big",children:"Add slices"}),(0,n.jsx)(i.w,{children:"Slices are reusable website sections. You can use them on different pages and write unique content for each. Each slice has its own component in your code."}),(0,n.jsx)(i.v,{children:(0,n.jsxs)(i.A,{children:[(0,n.jsx)(i.b,{renderStartIcon:()=>c.fromImage.BackgroundIcon,onClick:l,description:c.fromImage.description,children:c.fromImage.title}),(0,n.jsx)(i.b,{renderStartIcon:()=>c.fromScratch.BackgroundIcon,onClick:t,description:c.fromScratch.description,children:c.fromScratch.title}),s&&(0,n.jsx)(i.b,{renderStartIcon:()=>c.fromTemplate.BackgroundIcon,onClick:o,description:c.fromTemplate.description,children:c.fromTemplate.title}),r&&(0,n.jsx)(i.b,{renderStartIcon:()=>c.fromExisting.BackgroundIcon,onClick:a,description:c.fromExisting.description,children:c.fromExisting.title})]})})]})};var W=l(98250);function $(e){let{customType:t,tabId:l,slices:n}=e,i={...t};return n.forEach(e=>{i={...i,tabs:i.tabs.map(t=>t.key===l&&t.sliceZone?{...t,sliceZone:{key:t.sliceZone.key,value:[{key:e.id,value:e},...t.sliceZone.value]}}:t)}}),v.Xe.track({event:"custom-type:slice-zone-updated",customTypeId:t.id}),i}var J=l(18566),ee=l(80148);async function et(){try{let{templates:e,errors:t}=await ee.managerClient.sliceTemplateLibrary.readLibrary({});if(t.length>0)throw t;return e.map(e=>({model:e.model,screenshots:Object.fromEntries(Object.entries(e.screenshots).map(e=>{let[t,l]=e;return[t,URL.createObjectURL(l)]}))}))}catch(e){return[]}}var el=l(6256),en=l(39204),ei=l(7723),ea=l(33986),eo=l(30527),er=l(55862);let es=e=>{let{deleteSliceZone:t,closeDeleteSliceZoneModal:l}=e;return(0,n.jsx)(er.Z,{isOpen:!0,shouldCloseOnOverlayClick:!0,style:{content:{maxWidth:612}},onRequestClose:l,children:(0,n.jsx)(eo.Z,{bodySx:{p:0,bg:"white",position:"relative",height:"100%",padding:16},footerSx:{position:"sticky",bottom:0,p:0},sx:{border:"none",overflow:"hidden"},borderFooter:!0,Header:(0,n.jsxs)(A.kC,{sx:{position:"sticky",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,n.jsx)(A.X6,{sx:{fontSize:"14px",fontWeight:"bold",ml:1},children:"Do you really want to delete Slice Zone?"}),(0,n.jsx)(A.x8,{type:"button",onClick:l})]}),Footer:()=>(0,n.jsxs)(A.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,n.jsx)(ea.z,{label:"Cancel",variant:"secondary",onClick:l,sx:{mr:"10px",fontWeight:"bold",color:"grey12",borderRadius:6}}),(0,n.jsx)(ea.z,{label:"Delete",variant:"danger",onClick:t,sx:{minHeight:39,minWidth:78}})]}),children:(0,n.jsx)(A.nv,{children:"You're about to delete Slice Zone."})})})};var ec=l(84879),ed=l(62434),em=l(63908),eu=l(63019),eh=l(65375),ep=l.n(eh);let ex=e=>{var t;let{isOpen:l,close:a,onSubmit:o,isLoading:r,slice:d,libraries:m}=e,{remoteSlices:u}=(0,c.v9)(e=>({remoteSlices:(0,ei.sT)(e)})),h={from:null===(t=m[0])||void 0===t?void 0:t.name,sliceName:(0,R.MP)(d.key)},[p,v]=(0,s.useState)(h),[b,y]=(0,s.useState)();function g(e){v(e),y((0,eu.h)(e,m,u))}return(0,x.pQ)(l,()=>{l||(v(h),y(void 0))}),(0,n.jsxs)(i.ae,{open:l,onOpenChange:e=>!e&&a(),size:{width:448,height:"auto"},children:[(0,n.jsx)(i.al,{title:"Upgrade slice"}),(0,n.jsx)(i.aj,{children:(0,n.jsx)(i.aJ,{onSubmit:function(){b&&Object.keys(b).length>0||o({libraryID:p.from,sliceID:p.sliceName})},children:(0,n.jsxs)(i.D,{flexDirection:"column",children:[(0,n.jsxs)(i.bn,{className:ep().scrollArea,children:[(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"This will create a new slice with the same fields. The new slice will replace the legacy slice in all of your types, and the existing slice content will be re-mapped to the new slice."}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"This will not migrate your component. You will need to do that manually."}),(0,n.jsxs)(i.D,{flexDirection:"column",gap:4,children:[(0,n.jsx)(i.aM,{label:"Slice name *",placeholder:"Pascalised Slice API ID (e.g. ".concat((0,R.MP)(d.key),")"),error:null==b?void 0:b.sliceName,value:p.sliceName,onValueChange:e=>g({...p,sliceName:e.slice(0,30)}),"data-testid":"slice-name-input"}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"A display name for the slice"})]}),(0,n.jsxs)(i.D,{flexDirection:"column",gap:4,children:[(0,n.jsx)("label",{className:ep().label,children:(0,n.jsx)(i.bL,{variant:"bold",children:"Slice library *"})}),(0,n.jsx)(i.bq,{size:"medium",color:"grey",startIcon:"folder",flexContent:!0,value:p.from,onValueChange:e=>{e&&g({...p,from:e})},children:m.map(e=>(0,n.jsx)(i.bt,{value:e.name,children:e.name},e.name))}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"The library where we'll store your slice"})]})]}),(0,n.jsxs)(i.ah,{children:[(0,n.jsx)(i.ai,{size:"medium"}),(0,n.jsx)(i.af,{type:"submit",size:"medium",loading:r,disabled:b&&Object.keys(b).length>0,children:"Upgrade"})]})]})})})]})};var ev=l(96009),eb=l.n(ev);let ey=e=>{var t,l;let{isOpen:a,close:o,onSubmit:r,isLoading:c,slice:d,sliceName:m,libraries:u,localSharedSlices:h}=e,p={libraryID:null===(t=h[0])||void 0===t?void 0:t.from,sliceID:null===(l=h[0])||void 0===l?void 0:l.model.id,variationID:eb()(d.key),variationName:m},[v,b]=(0,s.useState)(!0),[y,g]=(0,s.useState)(p),[f,j]=(0,s.useState)({});function S(e){g(e),j(eg(e,u))}return(0,x.pQ)(a,()=>{a||(g(p),j({}))}),(0,n.jsxs)(i.ae,{open:a,onOpenChange:e=>!e&&o(),size:{width:448,height:"auto"},children:[(0,n.jsx)(i.al,{title:"Convert to slice variation"}),(0,n.jsx)(i.aj,{children:(0,n.jsx)(i.aJ,{onSubmit:function(){Object.keys(f).length>0||r(y)},children:(0,n.jsxs)(i.D,{display:"flex",flexDirection:"column",children:[(0,n.jsxs)(i.bn,{className:ep().scrollArea,children:[(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"If you have multiple slices that are similar, you can combine them as variations of the same slice."}),(0,n.jsxs)(i.D,{display:"flex",flexDirection:"column",gap:4,children:[(0,n.jsxs)("label",{className:ep().label,children:[(0,n.jsx)(i.bL,{variant:"bold",children:"Target slice *"}),"string"==typeof f.libraryID?(0,n.jsx)(i.bL,{variant:"small",color:"tomato10",children:f.libraryID}):null,"string"==typeof f.sliceID?(0,n.jsx)(i.bL,{variant:"small",color:"tomato10",children:f.sliceID}):null]}),(0,n.jsx)(i.bq,{size:"medium",color:"grey",startIcon:"viewDay",flexContent:!0,value:"".concat(y.libraryID,"::").concat(y.sliceID),onValueChange:e=>{if(e){let[t,l]=e.split("::");S({...y,libraryID:t,sliceID:l})}},children:h.map(e=>(0,n.jsxs)(i.bt,{value:"".concat(e.from,"::").concat(e.model.id),children:[e.from," ",">"," ",e.model.name," (",e.model.id,")"]},"".concat(e.from,"::").concat(e.model.id)))}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"Choose the slice to which you would like to add this variation."})]}),(0,n.jsx)(i.D,{display:"flex",flexDirection:"column",gap:4,children:(0,n.jsx)(i.aM,{label:"Variation name *",placeholder:m,error:f.variationName,value:y.variationName,onValueChange:e=>{let t={...y,variationName:e.slice(0,30)};v&&(t.variationID=eb()(t.variationName)),S(t)},"data-testid":"variation-name-input"})}),(0,n.jsx)(i.D,{display:"flex",flexDirection:"column",gap:4,children:(0,n.jsx)(i.aM,{label:"ID *",placeholder:eb()(d.key),error:f.variationID,value:y.variationID,onValueChange:e=>{b(!1),S({...y,variationID:e.slice(0,30)})},"data-testid":"variation-id-input"})})]}),(0,n.jsxs)(i.ah,{children:[(0,n.jsx)(i.ai,{size:"medium"}),(0,n.jsx)(i.af,{type:"submit",size:"medium",loading:c,disabled:Object.keys(f).length>0,children:"Convert"})]})]})})})]})},eg=(e,t)=>{let l={};e.libraryID||(l.libraryID="Cannot be empty.");let n=t.find(t=>t.path===e.libraryID);l.libraryID||n||(l.libraryID="Does not exist."),e.sliceID||(l.sliceID="Cannot be empty.");let i=null==n?void 0:n.components.find(t=>t.model.id===e.sliceID);if(l.sliceID||i||(l.sliceID="Does not exist."),e.variationName||(l.variationName="Cannot be empty."),e.variationID){var a;(null!==(a=null==i?void 0:i.model.variations.map(e=>e.id))&&void 0!==a?a:[]).includes(e.variationID)&&(l.variationID="Slice variation ID is already taken.")}else l.variationID="Cannot be empty.";return l},ef=e=>{var t,l;let{isOpen:a,close:o,onSubmit:r,isLoading:c,identicalSlices:d}=e,m=null!==(l=null===(t=d[0])||void 0===t?void 0:t.path)&&void 0!==l?l:"",[u,h]=(0,s.useState)(m),[p,v]=(0,s.useState)();return(0,x.pQ)(a,()=>{a||(h(m),v(void 0))}),(0,n.jsxs)(i.ae,{open:a,onOpenChange:e=>!e&&o(),size:{width:448,height:"auto"},children:[(0,n.jsx)(i.al,{title:"Merge with an existing slice"}),(0,n.jsx)(i.aj,{children:(0,n.jsx)(i.aJ,{onSubmit:function(){if(p)return;let[e,t,l]=u.split("::");r({libraryID:e,sliceID:t,variationID:l})},children:(0,n.jsxs)(i.D,{display:"flex",flexDirection:"column",children:[(0,n.jsxs)(i.bn,{className:ep().scrollArea,children:[(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"If you have multiple identical slices, you can merge them. All of your content will be remapped to the target slice."}),(0,n.jsxs)(i.D,{display:"flex",flexDirection:"column",gap:4,children:[(0,n.jsxs)("label",{className:ep().label,children:[(0,n.jsx)(i.bL,{variant:"bold",children:"Target slice*"}),"string"==typeof p?(0,n.jsx)(i.bL,{variant:"small",color:"tomato10",children:p}):null]}),(0,n.jsx)(i.bq,{size:"medium",color:"grey",startIcon:"viewDay",flexContent:!0,value:u,onValueChange:function(e){h(e),e||v("Cannot be empty.")},children:d.map(e=>(0,n.jsx)(i.bt,{value:e.path,children:e.path.split("::").join(" > ")},e.path))}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"Choose a slice that you would like to merge this into."})]})]}),(0,n.jsxs)(i.ah,{children:[(0,n.jsx)(i.ai,{size:"medium"}),(0,n.jsx)(i.af,{type:"submit",size:"medium",loading:c,disabled:!!p,children:"Merge"})]})]})})})]})},ej=e=>{var t;let{slice:l,path:a}=e,{refreshState:o}=(0,g.Z)(),[r,d]=(0,s.useState)(!1),[m,u]=(0,s.useState)(),{setCustomType:h}=I(),{libraries:p}=(0,c.v9)(e=>({libraries:(0,ei.Sd)(e)})),x="Slice"===l.value.type&&null!==(t=l.value.fieldset)&&void 0!==t?t:l.key,b=p.filter(e=>e.isLocal),y=b.map(e=>e.components).flat(),f=eS(l,x,y),j=async e=>{var t,n,i;if(!m)return;d(!0),v.Xe.track({event:"legacy-slice:converted",id:e.sliceID,variation:null!==(t=e.variationID)&&void 0!==t?t:"default",library:e.libraryID,conversionType:m});let{errors:r}=await ee.managerClient.slices.convertLegacySliceToSharedSlice({model:l.value,src:{...a,sliceID:l.key},dest:{libraryID:e.libraryID,sliceID:e.sliceID,variationName:null!==(n=e.variationName)&&void 0!==n?n:"Default",variationID:null!==(i=e.variationID)&&void 0!==i?i:"default"}});if(r.length)throw console.error("Could not convert slice `".concat(x,"`"),r),O.Am.error("Could not convert slice `".concat(x,"`")),r;let{model:s,errors:c}=await ee.managerClient.customTypes.readCustomType({id:a.customTypeID});if(c.length||!s){console.error("Could not refresh custom type view `".concat(a.customTypeID,"`"),c),O.Am.error("Could not refresh custom type view `".concat(a.customTypeID,"`"));return}switch(o(await (0,v.y0)()),d(!1),u(void 0),m){case"as_new_slice":O.Am.success("".concat(x," has been upgraded to a new slice ").concat(e.libraryID," > ").concat(e.sliceID));break;case"as_new_variation":O.Am.success("".concat(x," has been converted as a variation of ").concat(e.libraryID," > ").concat(e.sliceID));break;default:O.Am.success("".concat(x," has been merged with ").concat(e.libraryID," > ").concat(e.sliceID))}h({customType:s})},S={path:a,slice:l,sliceName:x,libraries:b,localSharedSlices:y,identicalSlices:f,close:()=>u(void 0),onSubmit:j,isLoading:r};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(i.ar,{children:[(0,n.jsx)(i.av,{children:(0,n.jsx)(i.E,{"data-testid":"convert-legacy-slice",startIcon:"refresh",endIcon:"arrowDropDown",size:"medium",color:"grey",children:"Migrate legacy slice"})}),(0,n.jsxs)(i.as,{align:"start",children:[(0,n.jsx)(i.at,{startIcon:(0,n.jsx)(i.aX,{name:"folder",size:"large"}),description:"Use it with new types",onSelect:()=>u("as_new_slice"),children:"Upgrade slice"}),(0,n.jsx)(i.at,{startIcon:(0,n.jsx)(i.aX,{name:"viewDay",size:"large"}),description:"Add it to another slice",onSelect:()=>u("as_new_variation"),disabled:!y.length,children:"Convert to slice variation"}),(0,n.jsx)(i.at,{startIcon:(0,n.jsx)(i.aX,{name:"driveFileMove",size:"large"}),description:"Combine identical slices",onSelect:()=>u("merge_with_identical"),disabled:!f.length,children:"Merge with another slice"})]})]}),(0,n.jsx)(ex,{...S,isOpen:"as_new_slice"===m}),(0,n.jsx)(ey,{...S,isOpen:"as_new_variation"===m}),(0,n.jsx)(ef,{...S,isOpen:"merge_with_identical"===m})]})},eS=(e,t,l)=>(0,s.useMemo)(()=>{let n=[],i=(0,em.ux)(e.value,t);for(let e of l)for(let t of e.model.variations){let l=(0,em.ux)(t,e.model.name);i.primary===l.primary&&i.items===l.items&&n.push({libraryID:e.from,sliceID:e.model.id,variationID:t.id,path:"".concat(e.from,"::").concat(e.model.id,"::").concat(t.id)})}return n},[e,t,l]),eI=e=>{let{slice:t,path:l}=e,[a]=(0,ec.E)("legacySliceUpgrader"),o=a.enabled?"This Slice was created with the Legacy Builder. It needs to be converted first to be used within Slice Machine.":"This Slice was created with the Legacy Builder, and is incompatible with Slice Machine. You cannot edit, push, or delete it in Slice Machine. In order to proceed, manually remove the Slice from your type model. Then create a new Slice with the same fields using Slice Machine.";return(0,n.jsxs)(ed.Zb,{children:[(0,n.jsx)(ed.ZB,{component:"div",children:(0,n.jsx)(i.D,{alignItems:"center",justifyContent:"center",children:(0,n.jsx)(i.bL,{color:"grey11",component:"span",children:"No screenshot available"})})}),(0,n.jsxs)(ed.T$,{children:[(0,n.jsx)(i.c3,{content:o,side:"bottom",children:(0,n.jsx)(i.m,{color:"purple",title:"Legacy Slice"})}),a.enabled?(0,n.jsx)(ej,{slice:t,path:l}):null]}),(0,n.jsx)(ed.eW,{subtitle:"1 variation",title:(0,em.Dj)(t.value)})]})};var eC=l(51507),eT=l(21151);let eD=e=>{let{slices:t,format:l,path:i,onRemoveSharedSlice:a}=e,o=t.some(e=>"SharedSlice"!==e.type),r=f.$[l],[c]=(0,ec.E)("legacySliceUpgrader");return(0,s.useEffect)(()=>{o&&(c.enabled?O.Am.info("This ".concat(r.name({start:!1,plural:!1})," contains legacy slices that can be upgraded.")):O.Am.warning("This ".concat(r.name({start:!1,plural:!1})," contains slices that are incompatible.")))},[o]),(0,n.jsx)(eT.Z,{elems:t,defineElementKey:e=>"SharedSlice"!==e.type?e.payload.key:e.payload.model.name,renderElem:e=>{if("SharedSlice"!==e.type){let t=e.payload;return(0,n.jsx)(eI,{slice:t,path:i})}{let t=e.payload;return(0,n.jsx)(eC.b,{action:{type:"remove",onRemove:()=>{a(t.model.id)}},mode:"navigation",slice:t,variant:"solid"})}},sx:{padding:"16px"}})};async function ew(e){try{let{templateIDs:t,localLibrariesNames:l,location:n,onSuccess:i}=e,{data:a,errors:o}=await ee.managerClient.sliceTemplateLibrary.createSlices({templateIDs:t});if(o.length>0||void 0===a)throw o;a.sliceIDs.forEach((e,i)=>{v.Xe.track({event:"slice:created",id:e,name:e,library:l[0],location:n,mode:"template",sliceTemplate:t[i]})}),await i(a.sliceIDs)}catch(t){let e="Internal Error: Slice(s) not created";console.error(e,t),O.Am.error(e)}}var ek=l(26109),e_=e=>{let{availableSlices:t,values:l}=e;return(0,n.jsx)(L.F2,{name:"sliceKeys",render:e=>(0,n.jsx)(eT.Z,{gridTemplateMinPx:"200px",elems:t,defineElementKey:e=>"".concat(e.from,"-").concat(e.model.name),renderElem:t=>{let i=l.sliceKeys.includes(t.model.id);return(0,n.jsx)(eC.b,{action:{type:"checkbox"},mode:"selection",onSelectedChange:n=>{n?e.push(t.model.id):e.remove(l.sliceKeys.indexOf(t.model.id))},selected:i,slice:t,variant:"outlined"})}})})};let eL=e=>{let{formId:t,close:l,onSuccess:i,availableSlicesTemplates:a,localLibraries:o,location:r}=e,{createSliceSuccess:s}=(0,g.Z)();return(0,n.jsx)(_.Z,{isOpen:!0,buttonLabel:"Add",formId:t,close:l,onSubmit:e=>{let{sliceKeys:t}=e;ew({templateIDs:t,localLibrariesNames:o.map(e=>e.name),location:r,onSuccess:async e=>{s((await (0,v.y0)()).libraries),i(await Promise.all(e.map(async e=>(await ee.managerClient.slices.readSlice({libraryID:o[0].name,sliceID:e})).model).filter(e=>void 0!==e)))}})},initialValues:{sliceKeys:[]},content:{title:"Use template slices"},validate:e=>{if(0===e.sliceKeys.length)return{sliceKeys:"Select at least one template to add"}},actionMessage:e=>{let{errors:t}=e;return void 0!==t.sliceKeys?(0,n.jsx)(A.xv,{sx:{color:"error"},children:t.sliceKeys}):void 0},children:e=>{let{values:t}=e;return(0,n.jsx)(e_,{values:t,availableSlices:a.map(e=>({extension:"",fileName:"",from:"",href:"",pathToSlice:"",model:ek.id.toSM(e.model),screenshots:Object.entries(e.screenshots).reduce((e,t)=>({...e,[t[0]]:{url:t[1]}}),{})}))})}})};var eA=e=>{let{formId:t,close:l,onSubmit:i,availableSlices:a}=e;return(0,n.jsx)(_.Z,{isOpen:!0,buttonLabel:"Add",formId:t,close:l,onSubmit:e=>{let{sliceKeys:t}=e;i(t.map(e=>{var t;return null===(t=a.find(t=>t.model.id===e))||void 0===t?void 0:t.model}).filter(e=>void 0!==e))},initialValues:{sliceKeys:[]},content:{title:"Select existing slices"},testId:"update-slices-modal",validate:e=>{if(0===e.sliceKeys.length)return{sliceKeys:"Select at least one slice to add"}},actionMessage:e=>{let{errors:t}=e;return void 0!==t.sliceKeys?(0,n.jsx)(A.xv,{sx:{color:"error"},children:t.sliceKeys}):void 0},children:e=>{let{values:t}=e;return(0,n.jsx)(e_,{values:t,availableSlices:a})}})};let eE=(e,t)=>{let l=(t||[]).reduce((e,t)=>[...e,...t.components],[]),{slicesInSliceZone:n,notFound:i}=e.value.reduce((e,t)=>{let{key:n,value:i}=t;if("SharedSlice"===i.type){let t=l.find(e=>e.model.id===n);return t?{...e,slicesInSliceZone:[...e.slicesInSliceZone,{type:"SharedSlice",payload:t}]}:{...e,notFound:[...e.notFound,{key:n}]}}return{...e,slicesInSliceZone:[...e.slicesInSliceZone,{type:"Slice",payload:{key:n,value:i}}]}},{slicesInSliceZone:[],notFound:[]});return{availableSlices:l,slicesInSliceZone:n,notFound:i}};var eN=e=>{var t;let{customType:l,onCreateSliceZone:a,onDeleteSliceZone:o,onRemoveSharedSlice:r,sliceZone:d,tabId:m}=e,u=(0,J.QT)(et,[]),[h,p]=(0,s.useState)(!1),[x,b]=(0,s.useState)(!1),[y,f]=(0,s.useState)(!1),[j,S]=(0,s.useState)(!1),{remoteSlices:C,libraries:T}=(0,c.v9)(e=>({remoteSlices:(0,ei.sT)(e),libraries:(0,ei.Sd)(e),slices:(0,ei.xC)(e)})),{setCustomType:D}=I(),{completeStep:w}=(0,W.k)(),{openLoginModal:_}=(0,g.Z)(),L=(0,H.F)({menuType:"Dropdown"}),A=T.filter(e=>e.isLocal),{availableSlices:E,slicesInSliceZone:N,notFound:M}=(0,s.useMemo)(()=>d?eE(d,T):{availableSlices:[],slicesInSliceZone:[],notFound:[]},[d,T]),[z,Z]=(0,s.useState)(!1);(0,s.useEffect)(()=>{(null==M?void 0:M.length)&&M.forEach(e=>{let{key:t}=e;r(t)})},[M]);let F=N.filter(e=>"SharedSlice"===e.type).map(e=>e.payload),K=E.filter(e=>!F.some(t=>t.model.id===e.model.id)),B=()=>{b(!0)},R=()=>{f(!0)},U=async()=>{await ee.managerClient.user.checkIsLoggedIn()?S(!0):_()},V=()=>{p(!0),v.Xe.track({event:"custom-type:open-add-from-templates",customTypeId:l.id,customTypeFormat:l.format})},X=()=>{b(!1)},G=()=>{f(!1)},ea=()=>{S(!1)},eo=()=>{p(!1)};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(P.Bu,{actions:d?(0,n.jsxs)(i.ar,{children:[(0,n.jsx)(i.av,{children:(0,n.jsx)(i.E,{color:"purple",startIcon:"add","data-testid":"add-new-slice-dropdown",children:"Add"})}),(0,n.jsxs)(i.as,{align:"end",children:[(0,n.jsx)(i.at,{renderStartIcon:()=>L.fromImage.BackgroundIcon,onSelect:()=>void U(),description:L.fromImage.description,children:L.fromImage.title}),(0,n.jsx)(i.at,{renderStartIcon:()=>L.fromScratch.BackgroundIcon,onSelect:R,description:L.fromScratch.description,children:L.fromScratch.title}),u.length>0?(0,n.jsx)(i.at,{onSelect:V,renderStartIcon:()=>L.fromTemplate.BackgroundIcon,description:L.fromTemplate.description,children:L.fromTemplate.title}):void 0,K.length>0?(0,n.jsx)(i.at,{onSelect:B,renderStartIcon:()=>L.fromExisting.BackgroundIcon,description:L.fromExisting.description,children:L.fromExisting.title}):void 0]})]}):void 0,toggle:"page"!==l.format||"Main"!==m?(0,n.jsx)(i.bC,{checked:!!d,onCheckedChange:e=>{e?a():Z(!0)},size:"small","data-testid":"slice-zone-switch"}):void 0,children:"Slices"}),d?N.length>0?(0,n.jsx)(Y.xR,{children:(0,n.jsx)(eD,{slices:N,format:l.format,path:{customTypeID:l.id,tabID:m,sliceZoneID:null!==(t=null==d?void 0:d.key)&&void 0!==t?t:""},onRemoveSharedSlice:r})}):(0,n.jsx)(i.D,{flexDirection:"column",flexGrow:1,justifyContent:"center",alignItems:"center",padding:{block:32},children:(0,n.jsx)(Q,{openUpdateSliceZoneModal:B,openCreateSliceModal:R,openCreateSliceFromImageModal:()=>void U(),openSlicesTemplatesModal:V,projectHasAvailableSlices:K.length>0,isSlicesTemplatesSupported:u.length>0})}):void 0,x&&(0,n.jsx)(eA,{formId:"tab-slicezone-form-".concat(m),availableSlices:K,onSubmit:e=>{let t=$({customType:l,tabId:m,slices:e});D({customType:k.Dc.fromSM(t),onSaveCallback:()=>{O.Am.success("Slice(s) added to slice zone")}}),w("createSlice"),X()},close:X}),h&&(0,n.jsx)(eL,{formId:"tab-slicezone-form-".concat(m),availableSlicesTemplates:u,localLibraries:A,location:"".concat(l.format,"_type"),onSuccess:e=>{let t=$({customType:l,tabId:m,slices:e});D({customType:k.Dc.fromSM(t),onSaveCallback:()=>{O.Am.success((0,n.jsx)(en.GX,{message:"Slice template(s) added to slice zone and created at: ",path:"".concat(A[0].name,"/")}))}}),w("createSlice"),eo()},close:eo}),z&&(0,n.jsx)(es,{closeDeleteSliceZoneModal:()=>{Z(!1)},deleteSliceZone:()=>{o(),Z(!1)}}),(null==A?void 0:A.length)!==0&&y&&(0,n.jsx)(el.c,{onSuccess:e=>{let t=$({customType:l,tabId:m,slices:[e]});D({customType:k.Dc.fromSM(t),onSaveCallback:()=>{O.Am.success((0,n.jsx)(en.GX,{message:"New slice added to slice zone and created at: ",path:"".concat(A[0].name,"/")}))}}),G()},localLibraries:A,location:"".concat(l.format,"_type"),remoteSlices:C,onClose:G}),(0,n.jsx)(q.S,{open:j,location:"".concat(l.format,"_type"),onSuccess:e=>{let{slices:t,library:i}=e,a=$({customType:l,tabId:m,slices:t});D({customType:k.Dc.fromSM(a),onSaveCallback:()=>{O.Am.success((0,n.jsx)(en.GX,{message:"Slice(s) added to slice zone and created at: ",path:i}))}}),ea()},onClose:ea})]})};let eM=[K.C.UID,K.C.Image,K.C.Text,K.C.StructuredText,K.C.Link,K.C.Select,K.C.Boolean,K.C.Number,K.C.Color,K.C.Date,K.C.Table,K.C.Embed,K.C.Timestamp,K.C.GeoPoint,K.C.ContentRelationship,K.C.LinkToMedia,K.C.Group,K.C.NestedGroup];var ez=e=>{var t,l,a,o;let{tabId:r}=e,{customType:c,setCustomType:d}=I(),u=k.Dc.toSM(c),h=null===(t=u.tabs.find(e=>e.key===r))||void 0===t?void 0:t.sliceZone,p=null!==(a=null===(l=u.tabs.find(e=>e.key===r))||void 0===l?void 0:l.value)&&void 0!==a?a:[],x="page"===u.format&&u.repeatable?p.filter(e=>"uid"!==e.key):p,v=u.tabs.reduce((e,t)=>[...e,...t.value],[]),b=e=>{var t;let{apiId:l,value:n}=e,i=null===(t=n.config)||void 0===t?void 0:t.label;if((0,B.Ss)(K.C,n.type)||null==i)return;if("Range"===n.type||"IntegrationFields"===n.type||"Separator"===n.type)throw Error("Unsupported Field Type: ".concat(n.type));let a=K.C[n.type];try{a.schema.validateSync(n,{stripUnknown:!1})}catch(e){throw Error('Add field: Model is invalid for field "'.concat(n.type,'".'))}let o=k.L$.fromSM(n);d({customType:(0,m.xS)({customType:c,newField:o,newFieldId:l,sectionId:r}),onSaveCallback:()=>{O.Am.success("".concat("Group"===n.type?"Group":"Field"," added"))}}),(0,U.V)({id:l,field:o})},y=e=>{let{apiId:t,newKey:l,value:n,inGroupFieldAction:i,updateMeta:a}=e;if((0,B.Ss)(K.C,n.type))return;let o=k.L$.fromSM(n);d({customType:(0,m.L4)({customType:c,previousFieldId:t,newFieldId:l,newField:o,sectionId:r}),onSaveCallback:()=>{"add"===i&&O.Am.success("Field added")},updateMeta:a}),i||(0,V.Z)({previousId:t,id:l,field:o})};return(0,n.jsx)(F.h,{children:(0,n.jsx)(s.Suspense,{fallback:(0,n.jsx)(i.D,{padding:32,children:(0,n.jsx)(i.bg,{})}),children:(0,n.jsxs)(P.aV,{border:!1,style:{flexGrow:1},children:[(0,n.jsx)(G.Z,{zoneType:"customType",zoneTypeFormat:null!==(o=c.format)&&void 0!==o?o:"custom",tabId:r,title:"Static zone",dataTip:"",fields:x,poolOfFieldsToCheck:v,showHints:!0,EditModal:X.Z,widgetsArray:eM,onDeleteItem:e=>{d({customType:(0,m.AK)({customType:c,fieldId:e,sectionId:r})})},onSave:e=>""===e.apiId?b({...e,apiId:e.newKey}):y(e),onDragEnd:e=>{if((0,B.uS)(e))return;let{source:t,destination:l}=e;if(!l)return;let n=(0,m.gR)({customType:c,sourceIndex:t.index,destinationIndex:l.index,sectionId:r});(0,Z.flushSync)(()=>d({customType:n}))},renderHintBase:e=>{let{item:t}=e;return"data".concat((0,R.Ti)(t.key))},renderFieldAccessor:e=>"data".concat((0,R.Ti)(e)),testId:"static-zone-content",isRepeatableCustomType:c.repeatable}),(0,n.jsx)(eN,{customType:u,tabId:r,sliceZone:h,onRemoveSharedSlice:e=>{d({customType:(0,m.EN)({customType:c,sectionId:r,sliceId:e})})},onCreateSliceZone:()=>{d({customType:(0,m.Tr)(c,r)})},onDeleteSliceZone:()=>{d({customType:(0,m.E3)(c,r)})}})]})})})};let eZ=()=>{var e,t,l;let{customType:a,setCustomType:o}=I(),r=k.Dc.toSM(a),[c,d]=(0,s.useState)(null===(e=r.tabs[0])||void 0===e?void 0:e.key),[u,h]=(0,s.useState)(),p=(null===(l=r.tabs.find(e=>e.key===c))||void 0===l?void 0:null===(t=l.sliceZone)||void 0===t?void 0:t.value.length)===0;return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(i.c9,{sx:p?{flexGrow:1}:void 0,children:["page"===a.format?(0,n.jsx)(i.ca,{title:a.repeatable?(0,n.jsx)(T,{}):void 0}):void 0,(0,n.jsxs)(i.cb,{onValueChange:d,value:c,children:[(0,n.jsx)(i.cd,{onAddNewTab:()=>{h({type:"CREATE_CUSTOM_TYPE_TAB"})},children:r.tabs.map(e=>(0,n.jsx)(i.ce,{menu:(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(i.at,{onSelect:()=>{h({type:"UPDATE_CUSTOM_TYPE_TAB",tabKey:e.key})},startIcon:(0,n.jsx)(i.aX,{name:"edit"}),children:"Rename"}),(0,n.jsx)(i.at,{color:"tomato",disabled:function(e){if(r.tabs.length<=1)return!0;let t=r.tabs.find(e=>e.value.find(e=>"uid"===e.key));return"page"===a.format&&a.repeatable&&(null==t?void 0:t.key)===e}(e.key),onSelect:()=>{h({type:"DELETE_CUSTOM_TYPE_TAB",tabKey:e.key})},startIcon:(0,n.jsx)(i.aX,{name:"delete"}),children:"Remove"})]}),value:e.key,children:e.key},e.key))}),r.tabs.map(e=>(0,n.jsx)(i.cc,{value:e.key,children:(0,n.jsx)(ez,{tabId:e.key})},e.key))]})]}),(null==u?void 0:u.type)==="CREATE_CUSTOM_TYPE_TAB"?(0,n.jsx)(N,{close:()=>{h(void 0)},isOpen:!0,onSubmit:e=>{let{id:t}=e;o({customType:(0,m.vB)(a,t)}),d(t)},tabIds:r.tabs.map(e=>e.key.toLowerCase())}):void 0,(null==u?void 0:u.type)==="UPDATE_CUSTOM_TYPE_TAB"?(0,n.jsx)(z,{close:()=>{h(void 0)},initialTabKey:u.tabKey,isOpen:!0,onSubmit:e=>{let{id:t}=e;o({customType:(0,m.HO)(a,u.tabKey,t)}),c===u.tabKey&&d(t)},tabIds:r.tabs.filter(e=>e.key!==u.tabKey).map(e=>e.key.toLowerCase())}):void 0,(null==u?void 0:u.type)==="DELETE_CUSTOM_TYPE_TAB"?(0,n.jsx)(M,{close:()=>{h(void 0)},isOpen:!0,onSubmit:()=>{if(o({customType:(0,m.F$)(a,u.tabKey)}),c===u.tabKey){var e;let t=null===(e=r.tabs.find(e=>e.key!==u.tabKey))||void 0===e?void 0:e.key;void 0!==t&&d(t)}}}):void 0]})};var eO=l(16442),eP=l(78254),eF=l(60867),eK=l(11166),eB=l(34919),eR=l.n(eB);let eU=e=>{let{tabs:t,...l}=e;return(0,n.jsxs)(eK.fC,{...l,className:eR().root,defaultValue:t[0].label,orientation:"vertical",children:[(0,n.jsx)(eK.aV,{className:eR().list,"aria-label":"content tabs",children:t.map((e,t)=>{let{label:l}=e;return(0,n.jsx)(eK.xz,{className:eR().trigger,value:l,children:(0,n.jsx)(i.bL,{className:eR().triggerText,component:"span",color:"inherit",children:l})},"".concat(l,"-trig").concat(t+1))})}),t.map((e,t)=>{let{label:l,content:a}=e;return(0,n.jsx)(eK.VY,{className:eR().content,value:l,children:(0,n.jsx)(i.bn,{className:eR().scrollArea,children:a})},"".concat(l,"-content").concat(t+1))})]})};var eV=l(25661),eX=l(88241),eG=l(32554),eY=l(44621),eq=l.n(eY);let eH=e=>{var t,l;let{inline:a,...o}=e,r=(0,eG.p)();if(!0===a)return(0,n.jsx)("code",{...o,className:eq().inlineCode});let s=(()=>{var e,t,l,n,i;if((null===(t=o.node)||void 0===t?void 0:null===(e=t.data)||void 0===e?void 0:e.meta)!==void 0){let e=null===(n=o.node)||void 0===n?void 0:null===(l=n.data)||void 0===l?void 0:l.meta;return{fileName:e.substring(1,e.length-1),language:null===(i=o.className)||void 0===i?void 0:i.split("-")[1]}}return null})(),c=null===(t=/language-(\w+)/.exec(null!==(l=o.className)&&void 0!==l?l:""))||void 0===t?void 0:t[1];return(0,n.jsx)(i.W,{...o,onCopy:()=>{v.Xe.track({event:"page-type:copy-snippet",framework:r})},language:c,code:String(o.children).replace(/\n$/,""),title:null==s?void 0:s.fileName})},eQ=e=>{let{markdown:t}=e;return(0,n.jsx)(eV.D,{children:t,linkTarget:"_blank",remarkPlugins:[eX.Z],components:{code:e=>(0,n.jsx)(eH,{...e}),h1:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h1",variant:"h1"}),h2:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h2",variant:"h2"}),h3:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h3",variant:"h3"}),h4:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h4",variant:"h4"}),h5:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h4",variant:"h4"}),p:e=>(0,n.jsx)(i.bL,{className:eq().section,children:e.children,component:"p",variant:"normal"}),pre:e=>(0,n.jsx)(i.bL,{className:eq().section,children:e.children,component:"pre",variant:"normal"})}})};async function eW(e){let t=JSON.parse(e),{errors:l,documentation:n}=await ee.managerClient.documentation.read({kind:t.kind,data:t.data});if(l.length>0)throw l;return n}var e$=l(65480),eJ=l.n(e$);let e0=e=>{var t;let{model:l}=e,a=(0,eG.p)(),o=(t={kind:"PageSnippet",data:{model:l}},(0,J.QT)(eW,[JSON.stringify(t)])),{completeStep:r}=(0,W.k)();return 0===o.length?null:(0,n.jsxs)(i.ae,{size:"small",trigger:(0,n.jsx)(i.E,{color:"grey",onClick:()=>{r("codePage"),v.Xe.track({event:"page-type:open-snippet",framework:a})},startIcon:"code",children:"Page snippet"}),children:[(0,n.jsx)(i.al,{icon:"code",title:"Page snippet"}),(0,n.jsx)("section",{className:eJ().content,children:o.length>1?(0,n.jsx)(eU,{style:{flex:1},tabs:o.map((e,t)=>{let{label:l,content:i}=e;return{label:null!=l?l:"Tab ".concat(t+1),content:(0,n.jsx)(eQ,{markdown:i})}})}):(0,n.jsx)(i.bn,{style:{flex:1,padding:16},children:(0,n.jsx)(eQ,{markdown:o[0].content})})})]})},e1=e=>{let{model:t}=e;return(0,n.jsx)("div",{children:(0,n.jsx)(F.h,{children:(0,n.jsx)(s.Suspense,{fallback:(0,n.jsx)(i.E,{color:"grey",startIcon:"code",children:"Page snippet"}),children:(0,n.jsx)(e0,{model:t})})})})},e4=()=>{let e=(0,r.useRouter)(),{selectedCustomType:t}=(0,c.v9)(t=>({selectedCustomType:(0,eP.Jk)(t,(0,h.Ag)(e.query))}));return((0,s.useEffect)(()=>{t&&(0,eO.TG)(t)||e.replace("/")},[t,e]),t&&(0,eO.TG)(t))?(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(o(),{children:(0,n.jsxs)("title",{children:[t.local.label," - Slice Machine"]})}),(0,n.jsx)(e6,{customType:t.local})]}):(0,n.jsx)(p.LN,{})},e6=e=>{let{customType:t}=e;return null===t?(0,n.jsx)(p.LN,{}):(0,n.jsx)(p.LN,{children:(0,n.jsx)(S,{initialCustomType:k.Dc.fromSM(t),children:e=>{var l;let{actionQueueStatus:a,customType:o,setCustomType:r}=e,s=(0,m.y6)(o),c=h.cd[t.format],x=f.$[t.format];return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(p.wd,{children:[(0,n.jsx)(p.Xq,{url:c.tablePagePathname}),(0,n.jsxs)(p.Cx,{children:[(0,n.jsx)(d.g,{children:x.name({start:!0,plural:!0})}),(0,n.jsx)(d.g,{active:!0,children:null!==(l=o.label)&&void 0!==l?l:o.id})]}),(0,n.jsxs)(p.K2,{children:[(0,n.jsx)(u.X,{status:a}),"page"===o.format?(0,n.jsx)(e1,{model:o}):void 0,(0,n.jsx)(eF._,{isChangesLocal:!0,format:s,customType:o,setLocalCustomType:r})]})]}),(0,n.jsx)(p.RN,{children:(0,n.jsx)(i.D,{flexDirection:"column",minWidth:0,children:(0,n.jsx)(eZ,{})})})]})}})})}},84879:function(e,t,l){"use strict";l.d(t,{E:function(){return o}});var n=l(18566),i=l(80148);async function a(){return i.managerClient.project.getSliceMachineConfig()}function o(e){var t,l;let[o,r]=[(0,n.QT)(a,[]),async e=>{await i.managerClient.project.writeSliceMachineConfig({config:e}),(0,n.VA)(a,[],e)}],s=async t=>{let l={...o,labs:{...o.labs}};t?l.labs[e]=t:e in l.labs&&delete l.labs[e],0===Object.keys(l.labs).length&&delete l.labs,await r(l)};return[{enabled:null!==(l=null==o?void 0:null===(t=o.labs)||void 0===t?void 0:t[e])&&void 0!==l&&l},s]}},34919:function(e){e.exports={flex:"ContentTabs_flex__T21Oc",column:"ContentTabs_column__1f8b8 ContentTabs_flex__T21Oc",root:"ContentTabs_root__Gn3Zg ContentTabs_column__1f8b8 ContentTabs_flex__T21Oc",list:"ContentTabs_list__rAZtl ContentTabs_flex__T21Oc",trigger:"ContentTabs_trigger__cTyPN ContentTabs_column__1f8b8 ContentTabs_flex__T21Oc",triggerText:"ContentTabs_triggerText__p_ZBl",content:"ContentTabs_content__H1Stj ContentTabs_column__1f8b8 ContentTabs_flex__T21Oc",scrollArea:"ContentTabs_scrollArea__DuDcQ"}},65480:function(e){e.exports={content:"PageSnippetDialog_content__jIN6d"}},44621:function(e){e.exports={section:"MarkdownRenderer_section__uNS1M",inlineCode:"MarkdownRenderer_inlineCode__lmGTi"}},65375:function(e){e.exports={scrollArea:"ConvertLegacySliceButton_scrollArea__xf3vM",label:"ConvertLegacySliceButton_label__BK0Gd"}}}]);
1
+ (self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[489],{19489:function(e,t,l){"use strict";l.d(t,{H:function(){return e4}});var n=l(52322),i=l(11699),a=l(97729),o=l.n(a),r=l(5632),s=l(2784),c=l(56580),d=l(43388),m=l(77630),u=l(23094),h=l(59294),p=l(58446),x=l(74217),v=l(94160),b=l(68968),y=l(23710),g=l(54597),f=l(98564);let j=(0,s.createContext)(void 0);function S(e){let{children:t,initialCustomType:l}=e,[i,a]=(0,s.useState)(l),o=(0,m.y6)(i),r=f.$[o],{actionQueueStatus:c,setNextAction:d}=(0,y.c)({errorMessage:r.autoSaveFailed}),{refreshState:u}=(0,g.Z)(),h=(0,x.R9)(u),{syncChanges:p}=(0,b.g)(),S=(0,s.useCallback)(e=>{let{customType:t,onSaveCallback:l,updateMeta:n}=e;a(t),d(async()=>{let{errors:e}=await (0,v.KA)({customType:t,updateMeta:n});if(e.length>0)throw e;h(await (0,v.y0)()),p(),null==l||l()})},[d,h,p]),I=(0,s.useMemo)(()=>({actionQueueStatus:c,customType:i,setCustomType:S}),[c,i,S]);return(0,n.jsx)(j.Provider,{value:I,children:"function"==typeof t?t(I):t})}function I(){let e=(0,s.useContext)(j);if(!e)throw Error("CustomTypeProvider not found");return e}var C=l(30195);function T(){var e;let[t,l]=(0,s.useState)(!1),{customType:a,setCustomType:o}=I(),[r,c]=null!==(e=(0,m.j5)(a))&&void 0!==e?e:[],d=c?(0,m.N3)(c):"",[u,h]=(0,s.useState)(null!=d?d:""),[p,v]=(0,s.useState)();(0,x.pQ)(t,()=>{t||(h(null!=d?d:""),v(void 0))});let b=(0,s.useCallback)(()=>(0,n.jsx)(i.aX,{name:c?"language":"add",size:"small",color:"grey11"}),[c]);return(0,n.jsxs)(i.ae,{open:t,onOpenChange:l,size:"small",trigger:(0,n.jsx)(i.E,{color:"grey",textColor:"placeholder",textWeight:"normal",renderStartIcon:b,sx:{marginInline:"auto"},children:c?d:"Add an UID"}),children:[(0,n.jsx)(i.al,{title:"Edit the UID label"}),(0,n.jsx)(i.aj,{children:(0,n.jsxs)(i.aJ,{onSubmit:function(){p||(o({customType:c?(0,m.eK)(u,a):(0,m.H8)(u,a)}),l(!1))},children:[(0,n.jsx)(i.D,{flexDirection:"column",padding:16,gap:4,children:(0,n.jsx)(i.aM,{type:"text",label:"Label *",placeholder:"UID",value:u,onValueChange:function(e){h(e),v(function(e){let t=D.safeParse(e,{errorMap:w});if(t.error)return t.error.errors[0].message}(e))},error:p,description:"A label for the UID"})}),(0,n.jsxs)(i.ah,{children:[(0,n.jsx)(i.ai,{size:"medium"}),(0,n.jsx)(i.af,{type:"submit",size:"medium",disabled:!!p,children:"Save"})]})]})})]})}let D=C.z.string().max(35).min(1),w=e=>{switch(e.code){case C.z.ZodIssueCode.too_big:return{message:"The label can't be longer than ".concat(e.maximum," characters")};case C.z.ZodIssueCode.too_small:return{message:"This field is required"};default:return{message:"Invalid value"}}};var k=l(94840),_=l(59532),L=l(63397),A=l(75289);let E=e=>{let{name:t,label:l,placeholder:i,error:a,...o}=e;return(0,n.jsxs)(A.xu,{mb:3,children:[(0,n.jsx)(A.__,{htmlFor:t,mb:2,children:l}),(0,n.jsx)(L.gN,{name:t,type:"text",placeholder:i,as:A.II,autoComplete:"off",...o}),a?(0,n.jsx)(A.xv,{sx:{color:"error",mt:1},children:a}):null]})};var N=e=>{let{isOpen:t,onSubmit:l,close:i,tabIds:a}=e;return(0,n.jsx)(_.Z,{isOpen:t,widthInPx:"530px",formId:"create-tab",close:i,onSubmit:e=>{l(e),i()},initialValues:{id:""},validate:e=>{let{id:t}=e;return t?a.includes(t.toLowerCase())?{id:"Tab exists already"}:void 0:{id:"Tab ID is required"}},content:{title:"Add Tab"},children:e=>{let{errors:t}=e;return(0,n.jsx)(E,{name:"id",label:"New Tab ID",placeholder:"A label for selecting the tab (i.e. not used in the API)",error:t.id})}})},M=e=>{let{isOpen:t,onSubmit:l,close:i}=e;return(0,n.jsx)(_.Z,{omitFooter:!0,isOpen:t,widthInPx:"530px",formId:"create-tab",close:i,cardProps:{bodySx:{p:0}},onSubmit:e=>{l(e),i()},initialValues:{},content:{title:"Remove Tab"},children:()=>(0,n.jsxs)(A.xu,{sx:{px:4,py:4},children:[(0,n.jsx)(A.X6,{as:"h4",children:"Remove this tab?"}),(0,n.jsx)(A.xv,{as:"p",color:"textClear",sx:{mt:2},children:"This action cannot be undone."}),(0,n.jsx)(A.zx,{type:"button",variant:"buttons.actionDelete",sx:{mt:3},onClick:()=>{l({}),i()},children:"Yes, remove tab"})]})})},z=e=>{let{isOpen:t,onSubmit:l,close:i,tabIds:a,initialTabKey:o}=e;return(0,n.jsx)(_.Z,{omitFooter:!0,isOpen:t,widthInPx:"530px",formId:"create-tab",close:i,cardProps:{bodySx:{p:0}},onSubmit:e=>{l(e),i()},initialValues:{id:o},validate:e=>{let{id:t}=e;return t?a.includes(t.toLowerCase())?{id:"Tab exists already"}:void 0:{id:"Tab ID is required"}},content:{title:"Rename Tab"},children:e=>{let{errors:t,values:a,setFieldValue:o,isValid:r}=e;return(0,n.jsxs)(A.xu,{sx:{px:4,py:4},children:[(0,n.jsx)(E,{name:"id",label:"Rename Tab ID",placeholder:"A label for selecting the tab (i.e. not used in the API)",error:t.id,onBlur:e=>{a.id!==e.target.value&&o("id",e.target.value.trim())},onChange:e=>{o("id",e.target.value)}}),(0,n.jsx)(A.zx,{type:"button",sx:{mt:3,width:"100%"},disabled:!r,onClick:()=>{a.id&&a.id.length&&l({id:a.id.trim()}),i()},children:"Save"})]})}})},Z=l(28316),O=l(88932),P=l(35289),F=l(87446),K=l(45440),B=l(16086),R=l(358),U=l(5495),V=l(39302),X=l(3285),G=l(40141),Y=l(65077),q=l(21446),H=l(27213);let Q=e=>{let{openCreateSliceModal:t,openCreateSliceFromImageModal:l,openUpdateSliceZoneModal:a,openSlicesTemplatesModal:o,projectHasAvailableSlices:r,isSlicesTemplatesSupported:s}=e,c=(0,H.F)({menuType:"ActionList"});return(0,n.jsxs)(i.s,{"data-testid":"slice-zone-blank-slate",sx:{width:648},children:[(0,n.jsx)(i.x,{lineColor:"purple9",backgroundColor:"purple5",name:"add",size:"large"}),(0,n.jsx)(i.z,{size:"big",children:"Add slices"}),(0,n.jsx)(i.w,{children:"Slices are reusable website sections. You can use them on different pages and write unique content for each. Each slice has its own component in your code."}),(0,n.jsx)(i.v,{children:(0,n.jsxs)(i.A,{children:[(0,n.jsx)(i.b,{renderStartIcon:()=>c.fromImage.BackgroundIcon,onClick:l,description:c.fromImage.description,children:c.fromImage.title}),(0,n.jsx)(i.b,{renderStartIcon:()=>c.fromScratch.BackgroundIcon,onClick:t,description:c.fromScratch.description,children:c.fromScratch.title}),s&&(0,n.jsx)(i.b,{renderStartIcon:()=>c.fromTemplate.BackgroundIcon,onClick:o,description:c.fromTemplate.description,children:c.fromTemplate.title}),r&&(0,n.jsx)(i.b,{renderStartIcon:()=>c.fromExisting.BackgroundIcon,onClick:a,description:c.fromExisting.description,children:c.fromExisting.title})]})})]})};var W=l(98250);function $(e){let{customType:t,tabId:l,slices:n}=e,i={...t};return n.forEach(e=>{i={...i,tabs:i.tabs.map(t=>t.key===l&&t.sliceZone?{...t,sliceZone:{key:t.sliceZone.key,value:[{key:e.id,value:e},...t.sliceZone.value]}}:t)}}),v.Xe.track({event:"custom-type:slice-zone-updated",customTypeId:t.id}),i}var J=l(18566),ee=l(80148);async function et(){try{let{templates:e,errors:t}=await ee.managerClient.sliceTemplateLibrary.readLibrary({});if(t.length>0)throw t;return e.map(e=>({model:e.model,screenshots:Object.fromEntries(Object.entries(e.screenshots).map(e=>{let[t,l]=e;return[t,URL.createObjectURL(l)]}))}))}catch(e){return[]}}var el=l(6256),en=l(39204),ei=l(7723),ea=l(33986),eo=l(30527),er=l(55862);let es=e=>{let{deleteSliceZone:t,closeDeleteSliceZoneModal:l}=e;return(0,n.jsx)(er.Z,{isOpen:!0,shouldCloseOnOverlayClick:!0,style:{content:{maxWidth:612}},onRequestClose:l,children:(0,n.jsx)(eo.Z,{bodySx:{p:0,bg:"white",position:"relative",height:"100%",padding:16},footerSx:{position:"sticky",bottom:0,p:0},sx:{border:"none",overflow:"hidden"},borderFooter:!0,Header:(0,n.jsxs)(A.kC,{sx:{position:"sticky",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,n.jsx)(A.X6,{sx:{fontSize:"14px",fontWeight:"bold",ml:1},children:"Do you really want to delete Slice Zone?"}),(0,n.jsx)(A.x8,{type:"button",onClick:l})]}),Footer:()=>(0,n.jsxs)(A.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,n.jsx)(ea.z,{label:"Cancel",variant:"secondary",onClick:l,sx:{mr:"10px",fontWeight:"bold",color:"grey12",borderRadius:6}}),(0,n.jsx)(ea.z,{label:"Delete",variant:"danger",onClick:t,sx:{minHeight:39,minWidth:78}})]}),children:(0,n.jsx)(A.nv,{children:"You're about to delete Slice Zone."})})})};var ec=l(84879),ed=l(62434),em=l(63908),eu=l(63019),eh=l(65375),ep=l.n(eh);let ex=e=>{var t;let{isOpen:l,close:a,onSubmit:o,isLoading:r,slice:d,libraries:m}=e,{remoteSlices:u}=(0,c.v9)(e=>({remoteSlices:(0,ei.sT)(e)})),h={from:null===(t=m[0])||void 0===t?void 0:t.name,sliceName:(0,R.MP)(d.key)},[p,v]=(0,s.useState)(h),[b,y]=(0,s.useState)();function g(e){v(e),y((0,eu.h)(e,m,u))}return(0,x.pQ)(l,()=>{l||(v(h),y(void 0))}),(0,n.jsxs)(i.ae,{open:l,onOpenChange:e=>!e&&a(),size:{width:448,height:"auto"},children:[(0,n.jsx)(i.al,{title:"Upgrade slice"}),(0,n.jsx)(i.aj,{children:(0,n.jsx)(i.aJ,{onSubmit:function(){b&&Object.keys(b).length>0||o({libraryID:p.from,sliceID:p.sliceName})},children:(0,n.jsxs)(i.D,{flexDirection:"column",children:[(0,n.jsxs)(i.bn,{className:ep().scrollArea,children:[(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"This will create a new slice with the same fields. The new slice will replace the legacy slice in all of your types, and the existing slice content will be re-mapped to the new slice."}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"This will not migrate your component. You will need to do that manually."}),(0,n.jsxs)(i.D,{flexDirection:"column",gap:4,children:[(0,n.jsx)(i.aM,{label:"Slice name *",placeholder:"Pascalised Slice API ID (e.g. ".concat((0,R.MP)(d.key),")"),error:null==b?void 0:b.sliceName,value:p.sliceName,onValueChange:e=>g({...p,sliceName:e.slice(0,30)}),"data-testid":"slice-name-input"}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"A display name for the slice"})]}),(0,n.jsxs)(i.D,{flexDirection:"column",gap:4,children:[(0,n.jsx)("label",{className:ep().label,children:(0,n.jsx)(i.bL,{variant:"bold",children:"Slice library *"})}),(0,n.jsx)(i.bq,{size:"medium",color:"grey",startIcon:"folder",flexContent:!0,value:p.from,onValueChange:e=>{e&&g({...p,from:e})},children:m.map(e=>(0,n.jsx)(i.bt,{value:e.name,children:e.name},e.name))}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"The library where we'll store your slice"})]})]}),(0,n.jsxs)(i.ah,{children:[(0,n.jsx)(i.ai,{size:"medium"}),(0,n.jsx)(i.af,{type:"submit",size:"medium",loading:r,disabled:b&&Object.keys(b).length>0,children:"Upgrade"})]})]})})})]})};var ev=l(96009),eb=l.n(ev);let ey=e=>{var t,l;let{isOpen:a,close:o,onSubmit:r,isLoading:c,slice:d,sliceName:m,libraries:u,localSharedSlices:h}=e,p={libraryID:null===(t=h[0])||void 0===t?void 0:t.from,sliceID:null===(l=h[0])||void 0===l?void 0:l.model.id,variationID:eb()(d.key),variationName:m},[v,b]=(0,s.useState)(!0),[y,g]=(0,s.useState)(p),[f,j]=(0,s.useState)({});function S(e){g(e),j(eg(e,u))}return(0,x.pQ)(a,()=>{a||(g(p),j({}))}),(0,n.jsxs)(i.ae,{open:a,onOpenChange:e=>!e&&o(),size:{width:448,height:"auto"},children:[(0,n.jsx)(i.al,{title:"Convert to slice variation"}),(0,n.jsx)(i.aj,{children:(0,n.jsx)(i.aJ,{onSubmit:function(){Object.keys(f).length>0||r(y)},children:(0,n.jsxs)(i.D,{display:"flex",flexDirection:"column",children:[(0,n.jsxs)(i.bn,{className:ep().scrollArea,children:[(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"If you have multiple slices that are similar, you can combine them as variations of the same slice."}),(0,n.jsxs)(i.D,{display:"flex",flexDirection:"column",gap:4,children:[(0,n.jsxs)("label",{className:ep().label,children:[(0,n.jsx)(i.bL,{variant:"bold",children:"Target slice *"}),"string"==typeof f.libraryID?(0,n.jsx)(i.bL,{variant:"small",color:"tomato10",children:f.libraryID}):null,"string"==typeof f.sliceID?(0,n.jsx)(i.bL,{variant:"small",color:"tomato10",children:f.sliceID}):null]}),(0,n.jsx)(i.bq,{size:"medium",color:"grey",startIcon:"viewDay",flexContent:!0,value:"".concat(y.libraryID,"::").concat(y.sliceID),onValueChange:e=>{if(e){let[t,l]=e.split("::");S({...y,libraryID:t,sliceID:l})}},children:h.map(e=>(0,n.jsxs)(i.bt,{value:"".concat(e.from,"::").concat(e.model.id),children:[e.from," ",">"," ",e.model.name," (",e.model.id,")"]},"".concat(e.from,"::").concat(e.model.id)))}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"Choose the slice to which you would like to add this variation."})]}),(0,n.jsx)(i.D,{display:"flex",flexDirection:"column",gap:4,children:(0,n.jsx)(i.aM,{label:"Variation name *",placeholder:m,error:f.variationName,value:y.variationName,onValueChange:e=>{let t={...y,variationName:e.slice(0,30)};v&&(t.variationID=eb()(t.variationName)),S(t)},"data-testid":"variation-name-input"})}),(0,n.jsx)(i.D,{display:"flex",flexDirection:"column",gap:4,children:(0,n.jsx)(i.aM,{label:"ID *",placeholder:eb()(d.key),error:f.variationID,value:y.variationID,onValueChange:e=>{b(!1),S({...y,variationID:e.slice(0,30)})},"data-testid":"variation-id-input"})})]}),(0,n.jsxs)(i.ah,{children:[(0,n.jsx)(i.ai,{size:"medium"}),(0,n.jsx)(i.af,{type:"submit",size:"medium",loading:c,disabled:Object.keys(f).length>0,children:"Convert"})]})]})})})]})},eg=(e,t)=>{let l={};e.libraryID||(l.libraryID="Cannot be empty.");let n=t.find(t=>t.path===e.libraryID);l.libraryID||n||(l.libraryID="Does not exist."),e.sliceID||(l.sliceID="Cannot be empty.");let i=null==n?void 0:n.components.find(t=>t.model.id===e.sliceID);if(l.sliceID||i||(l.sliceID="Does not exist."),e.variationName||(l.variationName="Cannot be empty."),e.variationID){var a;(null!==(a=null==i?void 0:i.model.variations.map(e=>e.id))&&void 0!==a?a:[]).includes(e.variationID)&&(l.variationID="Slice variation ID is already taken.")}else l.variationID="Cannot be empty.";return l},ef=e=>{var t,l;let{isOpen:a,close:o,onSubmit:r,isLoading:c,identicalSlices:d}=e,m=null!==(l=null===(t=d[0])||void 0===t?void 0:t.path)&&void 0!==l?l:"",[u,h]=(0,s.useState)(m),[p,v]=(0,s.useState)();return(0,x.pQ)(a,()=>{a||(h(m),v(void 0))}),(0,n.jsxs)(i.ae,{open:a,onOpenChange:e=>!e&&o(),size:{width:448,height:"auto"},children:[(0,n.jsx)(i.al,{title:"Merge with an existing slice"}),(0,n.jsx)(i.aj,{children:(0,n.jsx)(i.aJ,{onSubmit:function(){if(p)return;let[e,t,l]=u.split("::");r({libraryID:e,sliceID:t,variationID:l})},children:(0,n.jsxs)(i.D,{display:"flex",flexDirection:"column",children:[(0,n.jsxs)(i.bn,{className:ep().scrollArea,children:[(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"If you have multiple identical slices, you can merge them. All of your content will be remapped to the target slice."}),(0,n.jsxs)(i.D,{display:"flex",flexDirection:"column",gap:4,children:[(0,n.jsxs)("label",{className:ep().label,children:[(0,n.jsx)(i.bL,{variant:"bold",children:"Target slice*"}),"string"==typeof p?(0,n.jsx)(i.bL,{variant:"small",color:"tomato10",children:p}):null]}),(0,n.jsx)(i.bq,{size:"medium",color:"grey",startIcon:"viewDay",flexContent:!0,value:u,onValueChange:function(e){h(e),e||v("Cannot be empty.")},children:d.map(e=>(0,n.jsx)(i.bt,{value:e.path,children:e.path.split("::").join(" > ")},e.path))}),(0,n.jsx)(i.bL,{variant:"normal",color:"grey11",children:"Choose a slice that you would like to merge this into."})]})]}),(0,n.jsxs)(i.ah,{children:[(0,n.jsx)(i.ai,{size:"medium"}),(0,n.jsx)(i.af,{type:"submit",size:"medium",loading:c,disabled:!!p,children:"Merge"})]})]})})})]})},ej=e=>{var t;let{slice:l,path:a}=e,{refreshState:o}=(0,g.Z)(),[r,d]=(0,s.useState)(!1),[m,u]=(0,s.useState)(),{setCustomType:h}=I(),{libraries:p}=(0,c.v9)(e=>({libraries:(0,ei.Sd)(e)})),x="Slice"===l.value.type&&null!==(t=l.value.fieldset)&&void 0!==t?t:l.key,b=p.filter(e=>e.isLocal),y=b.map(e=>e.components).flat(),f=eS(l,x,y),j=async e=>{var t,n,i;if(!m)return;d(!0),v.Xe.track({event:"legacy-slice:converted",id:e.sliceID,variation:null!==(t=e.variationID)&&void 0!==t?t:"default",library:e.libraryID,conversionType:m});let{errors:r}=await ee.managerClient.slices.convertLegacySliceToSharedSlice({model:l.value,src:{...a,sliceID:l.key},dest:{libraryID:e.libraryID,sliceID:e.sliceID,variationName:null!==(n=e.variationName)&&void 0!==n?n:"Default",variationID:null!==(i=e.variationID)&&void 0!==i?i:"default"}});if(r.length)throw console.error("Could not convert slice `".concat(x,"`"),r),O.Am.error("Could not convert slice `".concat(x,"`")),r;let{model:s,errors:c}=await ee.managerClient.customTypes.readCustomType({id:a.customTypeID});if(c.length||!s){console.error("Could not refresh custom type view `".concat(a.customTypeID,"`"),c),O.Am.error("Could not refresh custom type view `".concat(a.customTypeID,"`"));return}switch(o(await (0,v.y0)()),d(!1),u(void 0),m){case"as_new_slice":O.Am.success("".concat(x," has been upgraded to a new slice ").concat(e.libraryID," > ").concat(e.sliceID));break;case"as_new_variation":O.Am.success("".concat(x," has been converted as a variation of ").concat(e.libraryID," > ").concat(e.sliceID));break;default:O.Am.success("".concat(x," has been merged with ").concat(e.libraryID," > ").concat(e.sliceID))}h({customType:s})},S={path:a,slice:l,sliceName:x,libraries:b,localSharedSlices:y,identicalSlices:f,close:()=>u(void 0),onSubmit:j,isLoading:r};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(i.ar,{children:[(0,n.jsx)(i.av,{children:(0,n.jsx)(i.E,{"data-testid":"convert-legacy-slice",startIcon:"refresh",endIcon:"arrowDropDown",size:"medium",color:"grey",children:"Migrate legacy slice"})}),(0,n.jsxs)(i.as,{align:"start",children:[(0,n.jsx)(i.at,{startIcon:(0,n.jsx)(i.aX,{name:"folder",size:"large"}),description:"Use it with new types",onSelect:()=>u("as_new_slice"),children:"Upgrade slice"}),(0,n.jsx)(i.at,{startIcon:(0,n.jsx)(i.aX,{name:"viewDay",size:"large"}),description:"Add it to another slice",onSelect:()=>u("as_new_variation"),disabled:!y.length,children:"Convert to slice variation"}),(0,n.jsx)(i.at,{startIcon:(0,n.jsx)(i.aX,{name:"driveFileMove",size:"large"}),description:"Combine identical slices",onSelect:()=>u("merge_with_identical"),disabled:!f.length,children:"Merge with another slice"})]})]}),(0,n.jsx)(ex,{...S,isOpen:"as_new_slice"===m}),(0,n.jsx)(ey,{...S,isOpen:"as_new_variation"===m}),(0,n.jsx)(ef,{...S,isOpen:"merge_with_identical"===m})]})},eS=(e,t,l)=>(0,s.useMemo)(()=>{let n=[],i=(0,em.ux)(e.value,t);for(let e of l)for(let t of e.model.variations){let l=(0,em.ux)(t,e.model.name);i.primary===l.primary&&i.items===l.items&&n.push({libraryID:e.from,sliceID:e.model.id,variationID:t.id,path:"".concat(e.from,"::").concat(e.model.id,"::").concat(t.id)})}return n},[e,t,l]),eI=e=>{let{slice:t,path:l}=e,[a]=(0,ec.E)("legacySliceUpgrader"),o=a.enabled?"This Slice was created with the Legacy Builder. It needs to be converted first to be used within Slice Machine.":"This Slice was created with the Legacy Builder, and is incompatible with Slice Machine. You cannot edit, push, or delete it in Slice Machine. In order to proceed, manually remove the Slice from your type model. Then create a new Slice with the same fields using Slice Machine.";return(0,n.jsxs)(ed.Zb,{children:[(0,n.jsx)(ed.ZB,{component:"div",children:(0,n.jsx)(i.D,{alignItems:"center",justifyContent:"center",children:(0,n.jsx)(i.bL,{color:"grey11",component:"span",children:"No screenshot available"})})}),(0,n.jsxs)(ed.T$,{children:[(0,n.jsx)(i.c3,{content:o,side:"bottom",children:(0,n.jsx)(i.m,{color:"purple",title:"Legacy Slice"})}),a.enabled?(0,n.jsx)(ej,{slice:t,path:l}):null]}),(0,n.jsx)(ed.eW,{subtitle:"1 variation",title:(0,em.Dj)(t.value)})]})};var eC=l(51507),eT=l(21151);let eD=e=>{let{slices:t,format:l,path:i,onRemoveSharedSlice:a}=e,o=t.some(e=>"SharedSlice"!==e.type),r=f.$[l],[c]=(0,ec.E)("legacySliceUpgrader");return(0,s.useEffect)(()=>{o&&(c.enabled?O.Am.info("This ".concat(r.name({start:!1,plural:!1})," contains legacy slices that can be upgraded.")):O.Am.warning("This ".concat(r.name({start:!1,plural:!1})," contains slices that are incompatible.")))},[o]),(0,n.jsx)(eT.Z,{elems:t,defineElementKey:e=>"SharedSlice"!==e.type?e.payload.key:e.payload.model.name,renderElem:e=>{if("SharedSlice"!==e.type){let t=e.payload;return(0,n.jsx)(eI,{slice:t,path:i})}{let t=e.payload;return(0,n.jsx)(eC.b,{action:{type:"remove",onRemove:()=>{a(t.model.id)}},mode:"navigation",slice:t,variant:"solid"})}},sx:{padding:"16px"}})};async function ew(e){try{let{templateIDs:t,localLibrariesNames:l,location:n,onSuccess:i}=e,{data:a,errors:o}=await ee.managerClient.sliceTemplateLibrary.createSlices({templateIDs:t});if(o.length>0||void 0===a)throw o;a.sliceIDs.forEach((e,i)=>{v.Xe.track({event:"slice:created",id:e,name:e,library:l[0],location:n,mode:"template",sliceTemplate:t[i]})}),await i(a.sliceIDs)}catch(t){let e="Internal Error: Slice(s) not created";console.error(e,t),O.Am.error(e)}}var ek=l(26109),e_=e=>{let{availableSlices:t,values:l}=e;return(0,n.jsx)(L.F2,{name:"sliceKeys",render:e=>(0,n.jsx)(eT.Z,{gridTemplateMinPx:"200px",elems:t,defineElementKey:e=>"".concat(e.from,"-").concat(e.model.name),renderElem:t=>{let i=l.sliceKeys.includes(t.model.id);return(0,n.jsx)(eC.b,{action:{type:"checkbox"},mode:"selection",onSelectedChange:n=>{n?e.push(t.model.id):e.remove(l.sliceKeys.indexOf(t.model.id))},selected:i,slice:t,variant:"outlined"})}})})};let eL=e=>{let{formId:t,close:l,onSuccess:i,availableSlicesTemplates:a,localLibraries:o,location:r}=e,{createSliceSuccess:s}=(0,g.Z)();return(0,n.jsx)(_.Z,{isOpen:!0,buttonLabel:"Add",formId:t,close:l,onSubmit:e=>{let{sliceKeys:t}=e;ew({templateIDs:t,localLibrariesNames:o.map(e=>e.name),location:r,onSuccess:async e=>{s((await (0,v.y0)()).libraries),i(await Promise.all(e.map(async e=>(await ee.managerClient.slices.readSlice({libraryID:o[0].name,sliceID:e})).model).filter(e=>void 0!==e)))}})},initialValues:{sliceKeys:[]},content:{title:"Use template slices"},validate:e=>{if(0===e.sliceKeys.length)return{sliceKeys:"Select at least one template to add"}},actionMessage:e=>{let{errors:t}=e;return void 0!==t.sliceKeys?(0,n.jsx)(A.xv,{sx:{color:"error"},children:t.sliceKeys}):void 0},children:e=>{let{values:t}=e;return(0,n.jsx)(e_,{values:t,availableSlices:a.map(e=>({extension:"",fileName:"",from:"",href:"",pathToSlice:"",model:ek.id.toSM(e.model),screenshots:Object.entries(e.screenshots).reduce((e,t)=>({...e,[t[0]]:{url:t[1]}}),{})}))})}})};var eA=e=>{let{formId:t,close:l,onSubmit:i,availableSlices:a}=e;return(0,n.jsx)(_.Z,{isOpen:!0,buttonLabel:"Add",formId:t,close:l,onSubmit:e=>{let{sliceKeys:t}=e;i(t.map(e=>{var t;return null===(t=a.find(t=>t.model.id===e))||void 0===t?void 0:t.model}).filter(e=>void 0!==e))},initialValues:{sliceKeys:[]},content:{title:"Select existing slices"},testId:"update-slices-modal",validate:e=>{if(0===e.sliceKeys.length)return{sliceKeys:"Select at least one slice to add"}},actionMessage:e=>{let{errors:t}=e;return void 0!==t.sliceKeys?(0,n.jsx)(A.xv,{sx:{color:"error"},children:t.sliceKeys}):void 0},children:e=>{let{values:t}=e;return(0,n.jsx)(e_,{values:t,availableSlices:a})}})};let eE=(e,t)=>{let l=(t||[]).reduce((e,t)=>[...e,...t.components],[]),{slicesInSliceZone:n,notFound:i}=e.value.reduce((e,t)=>{let{key:n,value:i}=t;if("SharedSlice"===i.type){let t=l.find(e=>e.model.id===n);return t?{...e,slicesInSliceZone:[...e.slicesInSliceZone,{type:"SharedSlice",payload:t}]}:{...e,notFound:[...e.notFound,{key:n}]}}return{...e,slicesInSliceZone:[...e.slicesInSliceZone,{type:"Slice",payload:{key:n,value:i}}]}},{slicesInSliceZone:[],notFound:[]});return{availableSlices:l,slicesInSliceZone:n,notFound:i}};var eN=e=>{var t;let{customType:l,onCreateSliceZone:a,onDeleteSliceZone:o,onRemoveSharedSlice:r,sliceZone:d,tabId:m}=e,u=(0,J.QT)(et,[]),[h,p]=(0,s.useState)(!1),[x,b]=(0,s.useState)(!1),[y,f]=(0,s.useState)(!1),[j,S]=(0,s.useState)(!1),{remoteSlices:C,libraries:T}=(0,c.v9)(e=>({remoteSlices:(0,ei.sT)(e),libraries:(0,ei.Sd)(e),slices:(0,ei.xC)(e)})),{setCustomType:D}=I(),{completeStep:w}=(0,W.k)(),{openLoginModal:_}=(0,g.Z)(),L=(0,H.F)({menuType:"Dropdown"}),A=T.filter(e=>e.isLocal),{availableSlices:E,slicesInSliceZone:N,notFound:M}=(0,s.useMemo)(()=>d?eE(d,T):{availableSlices:[],slicesInSliceZone:[],notFound:[]},[d,T]),[z,Z]=(0,s.useState)(!1);(0,s.useEffect)(()=>{(null==M?void 0:M.length)&&M.forEach(e=>{let{key:t}=e;r(t)})},[M]);let F=N.filter(e=>"SharedSlice"===e.type).map(e=>e.payload),K=E.filter(e=>!F.some(t=>t.model.id===e.model.id)),B=()=>{b(!0)},R=()=>{f(!0)},U=async()=>{await ee.managerClient.user.checkIsLoggedIn()?S(!0):_()},V=()=>{p(!0),v.Xe.track({event:"custom-type:open-add-from-templates",customTypeId:l.id,customTypeFormat:l.format})},X=()=>{b(!1)},G=()=>{f(!1)},ea=()=>{S(!1)},eo=()=>{p(!1)};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(P.Bu,{actions:d?(0,n.jsxs)(i.ar,{children:[(0,n.jsx)(i.av,{children:(0,n.jsx)(i.E,{color:"purple",startIcon:"add","data-testid":"add-new-slice-dropdown",children:"Add"})}),(0,n.jsxs)(i.as,{align:"end",children:[(0,n.jsx)(i.at,{renderStartIcon:()=>L.fromImage.BackgroundIcon,onSelect:()=>void U(),description:L.fromImage.description,children:L.fromImage.title}),(0,n.jsx)(i.at,{renderStartIcon:()=>L.fromScratch.BackgroundIcon,onSelect:R,description:L.fromScratch.description,children:L.fromScratch.title}),u.length>0?(0,n.jsx)(i.at,{onSelect:V,renderStartIcon:()=>L.fromTemplate.BackgroundIcon,description:L.fromTemplate.description,children:L.fromTemplate.title}):void 0,K.length>0?(0,n.jsx)(i.at,{onSelect:B,renderStartIcon:()=>L.fromExisting.BackgroundIcon,description:L.fromExisting.description,children:L.fromExisting.title}):void 0]})]}):void 0,toggle:"page"!==l.format||"Main"!==m?(0,n.jsx)(i.bC,{checked:!!d,onCheckedChange:e=>{e?a():Z(!0)},size:"small","data-testid":"slice-zone-switch"}):void 0,children:"Slices"}),d?N.length>0?(0,n.jsx)(Y.xR,{children:(0,n.jsx)(eD,{slices:N,format:l.format,path:{customTypeID:l.id,tabID:m,sliceZoneID:null!==(t=null==d?void 0:d.key)&&void 0!==t?t:""},onRemoveSharedSlice:r})}):(0,n.jsx)(i.D,{flexDirection:"column",flexGrow:1,justifyContent:"center",alignItems:"center",padding:{block:32},children:(0,n.jsx)(Q,{openUpdateSliceZoneModal:B,openCreateSliceModal:R,openCreateSliceFromImageModal:()=>void U(),openSlicesTemplatesModal:V,projectHasAvailableSlices:K.length>0,isSlicesTemplatesSupported:u.length>0})}):void 0,x&&(0,n.jsx)(eA,{formId:"tab-slicezone-form-".concat(m),availableSlices:K,onSubmit:e=>{let t=$({customType:l,tabId:m,slices:e});D({customType:k.Dc.fromSM(t),onSaveCallback:()=>{O.Am.success("Slice(s) added to slice zone")}}),w("createSlice"),X()},close:X}),h&&(0,n.jsx)(eL,{formId:"tab-slicezone-form-".concat(m),availableSlicesTemplates:u,localLibraries:A,location:"".concat(l.format,"_type"),onSuccess:e=>{let t=$({customType:l,tabId:m,slices:e});D({customType:k.Dc.fromSM(t),onSaveCallback:()=>{O.Am.success((0,n.jsx)(en.GX,{message:"Slice template(s) added to slice zone and created at: ",path:"".concat(A[0].name,"/")}))}}),w("createSlice"),eo()},close:eo}),z&&(0,n.jsx)(es,{closeDeleteSliceZoneModal:()=>{Z(!1)},deleteSliceZone:()=>{o(),Z(!1)}}),(null==A?void 0:A.length)!==0&&y&&(0,n.jsx)(el.c,{onSuccess:e=>{let t=$({customType:l,tabId:m,slices:[e]});D({customType:k.Dc.fromSM(t),onSaveCallback:()=>{O.Am.success((0,n.jsx)(en.GX,{message:"New slice added to slice zone and created at: ",path:"".concat(A[0].name,"/")}))}}),G()},localLibraries:A,location:"".concat(l.format,"_type"),remoteSlices:C,onClose:G}),(0,n.jsx)(q.S,{open:j,location:"".concat(l.format,"_type"),onSuccess:e=>{let{slices:t,library:i}=e,a=$({customType:l,tabId:m,slices:t});D({customType:k.Dc.fromSM(a),onSaveCallback:()=>{O.Am.success((0,n.jsx)(en.GX,{message:"Slice(s) added to slice zone and created at: ",path:i}))}}),ea()},onClose:ea})]})};let eM=[K.C.UID,K.C.Image,K.C.Text,K.C.StructuredText,K.C.Link,K.C.Select,K.C.Boolean,K.C.Number,K.C.Color,K.C.Date,K.C.Table,K.C.Embed,K.C.Timestamp,K.C.GeoPoint,K.C.ContentRelationship,K.C.LinkToMedia,K.C.Group,K.C.NestedGroup];var ez=e=>{var t,l,a,o;let{tabId:r}=e,{customType:c,setCustomType:d}=I(),u=k.Dc.toSM(c),h=null===(t=u.tabs.find(e=>e.key===r))||void 0===t?void 0:t.sliceZone,p=null!==(a=null===(l=u.tabs.find(e=>e.key===r))||void 0===l?void 0:l.value)&&void 0!==a?a:[],x="page"===u.format&&u.repeatable?p.filter(e=>"uid"!==e.key):p,v=u.tabs.reduce((e,t)=>[...e,...t.value],[]),b=e=>{var t;let{apiId:l,value:n}=e,i=null===(t=n.config)||void 0===t?void 0:t.label;if((0,B.Ss)(K.C,n.type)||null==i)return;if("Range"===n.type||"IntegrationFields"===n.type||"Separator"===n.type)throw Error("Unsupported Field Type: ".concat(n.type));let a=K.C[n.type];try{a.schema.validateSync(n,{stripUnknown:!1})}catch(e){throw Error('Add field: Model is invalid for field "'.concat(n.type,'".'))}let o=k.L$.fromSM(n);d({customType:(0,m.xS)({customType:c,newField:o,newFieldId:l,sectionId:r}),onSaveCallback:()=>{O.Am.success("".concat("Group"===n.type?"Group":"Field"," added"))}}),(0,U.V)({id:l,field:o})},y=e=>{let{apiId:t,newKey:l,value:n,inGroupFieldAction:i,updateMeta:a}=e;if((0,B.Ss)(K.C,n.type))return;let o=k.L$.fromSM(n);d({customType:(0,m.L4)({customType:c,previousFieldId:t,newFieldId:l,newField:o,sectionId:r}),onSaveCallback:()=>{"add"===i&&O.Am.success("Field added")},updateMeta:a}),i||(0,V.Z)({previousId:t,id:l,field:o})};return(0,n.jsx)(F.h,{children:(0,n.jsx)(s.Suspense,{fallback:(0,n.jsx)(i.D,{padding:32,children:(0,n.jsx)(i.bg,{})}),children:(0,n.jsxs)(P.aV,{border:!1,style:{flexGrow:1},children:[(0,n.jsx)(G.Z,{zoneType:"customType",zoneTypeFormat:null!==(o=c.format)&&void 0!==o?o:"custom",tabId:r,title:"Static zone",dataTip:"",fields:x,poolOfFieldsToCheck:v,showHints:!0,EditModal:X.Z,widgetsArray:eM,onDeleteItem:e=>{d({customType:(0,m.AK)({customType:c,fieldId:e,sectionId:r})})},onSave:e=>""===e.apiId?b({...e,apiId:e.newKey}):y(e),onDragEnd:e=>{if((0,B.uS)(e))return;let{source:t,destination:l}=e;if(!l)return;let n=(0,m.gR)({customType:c,sourceIndex:t.index,destinationIndex:l.index,sectionId:r});(0,Z.flushSync)(()=>d({customType:n}))},renderHintBase:e=>{let{item:t}=e;return"data".concat((0,R.Ti)(t.key))},renderFieldAccessor:e=>"data".concat((0,R.Ti)(e)),testId:"static-zone-content",isRepeatableCustomType:c.repeatable}),(0,n.jsx)(eN,{customType:u,tabId:r,sliceZone:h,onRemoveSharedSlice:e=>{d({customType:(0,m.EN)({customType:c,sectionId:r,sliceId:e})})},onCreateSliceZone:()=>{d({customType:(0,m.Tr)(c,r)})},onDeleteSliceZone:()=>{d({customType:(0,m.E3)(c,r)})}})]})})})};let eZ=()=>{var e,t,l;let{customType:a,setCustomType:o}=I(),r=k.Dc.toSM(a),[c,d]=(0,s.useState)(null===(e=r.tabs[0])||void 0===e?void 0:e.key),[u,h]=(0,s.useState)(),p=(null===(l=r.tabs.find(e=>e.key===c))||void 0===l?void 0:null===(t=l.sliceZone)||void 0===t?void 0:t.value.length)===0;return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(i.c9,{sx:p?{flexGrow:1}:void 0,children:["page"===a.format?(0,n.jsx)(i.ca,{title:a.repeatable?(0,n.jsx)(T,{}):void 0}):void 0,(0,n.jsxs)(i.cb,{onValueChange:d,value:c,children:[(0,n.jsx)(i.cd,{onAddNewTab:()=>{h({type:"CREATE_CUSTOM_TYPE_TAB"})},children:r.tabs.map(e=>(0,n.jsx)(i.ce,{menu:(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(i.at,{onSelect:()=>{h({type:"UPDATE_CUSTOM_TYPE_TAB",tabKey:e.key})},startIcon:(0,n.jsx)(i.aX,{name:"edit"}),children:"Rename"}),(0,n.jsx)(i.at,{color:"tomato",disabled:function(e){if(r.tabs.length<=1)return!0;let t=r.tabs.find(e=>e.value.find(e=>"uid"===e.key));return"page"===a.format&&a.repeatable&&(null==t?void 0:t.key)===e}(e.key),onSelect:()=>{h({type:"DELETE_CUSTOM_TYPE_TAB",tabKey:e.key})},startIcon:(0,n.jsx)(i.aX,{name:"delete"}),children:"Remove"})]}),value:e.key,children:e.key},e.key))}),r.tabs.map(e=>(0,n.jsx)(i.cc,{value:e.key,children:(0,n.jsx)(ez,{tabId:e.key})},e.key))]})]}),(null==u?void 0:u.type)==="CREATE_CUSTOM_TYPE_TAB"?(0,n.jsx)(N,{close:()=>{h(void 0)},isOpen:!0,onSubmit:e=>{let{id:t}=e;o({customType:(0,m.vB)(a,t)}),d(t)},tabIds:r.tabs.map(e=>e.key.toLowerCase())}):void 0,(null==u?void 0:u.type)==="UPDATE_CUSTOM_TYPE_TAB"?(0,n.jsx)(z,{close:()=>{h(void 0)},initialTabKey:u.tabKey,isOpen:!0,onSubmit:e=>{let{id:t}=e;o({customType:(0,m.HO)(a,u.tabKey,t)}),c===u.tabKey&&d(t)},tabIds:r.tabs.filter(e=>e.key!==u.tabKey).map(e=>e.key.toLowerCase())}):void 0,(null==u?void 0:u.type)==="DELETE_CUSTOM_TYPE_TAB"?(0,n.jsx)(M,{close:()=>{h(void 0)},isOpen:!0,onSubmit:()=>{if(o({customType:(0,m.F$)(a,u.tabKey)}),c===u.tabKey){var e;let t=null===(e=r.tabs.find(e=>e.key!==u.tabKey))||void 0===e?void 0:e.key;void 0!==t&&d(t)}}}):void 0]})};var eO=l(16442),eP=l(78254),eF=l(60867),eK=l(11166),eB=l(34919),eR=l.n(eB);let eU=e=>{let{tabs:t,...l}=e;return(0,n.jsxs)(eK.fC,{...l,className:eR().root,defaultValue:t[0].label,orientation:"vertical",children:[(0,n.jsx)(eK.aV,{className:eR().list,"aria-label":"content tabs",children:t.map((e,t)=>{let{label:l}=e;return(0,n.jsx)(eK.xz,{className:eR().trigger,value:l,children:(0,n.jsx)(i.bL,{className:eR().triggerText,component:"span",color:"inherit",children:l})},"".concat(l,"-trig").concat(t+1))})}),t.map((e,t)=>{let{label:l,content:a}=e;return(0,n.jsx)(eK.VY,{className:eR().content,value:l,children:(0,n.jsx)(i.bn,{className:eR().scrollArea,children:a})},"".concat(l,"-content").concat(t+1))})]})};var eV=l(25661),eX=l(88241),eG=l(32554),eY=l(44621),eq=l.n(eY);let eH=e=>{var t,l;let{inline:a,...o}=e,r=(0,eG.p)();if(!0===a)return(0,n.jsx)("code",{...o,className:eq().inlineCode});let s=(()=>{var e,t,l,n,i;if((null===(t=o.node)||void 0===t?void 0:null===(e=t.data)||void 0===e?void 0:e.meta)!==void 0){let e=null===(n=o.node)||void 0===n?void 0:null===(l=n.data)||void 0===l?void 0:l.meta;return{fileName:e.substring(1,e.length-1),language:null===(i=o.className)||void 0===i?void 0:i.split("-")[1]}}return null})(),c=null===(t=/language-(\w+)/.exec(null!==(l=o.className)&&void 0!==l?l:""))||void 0===t?void 0:t[1];return(0,n.jsx)(i.W,{...o,onCopy:()=>{v.Xe.track({event:"page-type:copy-snippet",framework:r})},language:c,code:String(o.children).replace(/\n$/,""),title:null==s?void 0:s.fileName})},eQ=e=>{let{markdown:t}=e;return(0,n.jsx)(eV.D,{children:t,linkTarget:"_blank",remarkPlugins:[eX.Z],components:{code:e=>(0,n.jsx)(eH,{...e}),h1:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h1",variant:"h1"}),h2:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h2",variant:"h2"}),h3:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h3",variant:"h3"}),h4:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h4",variant:"h4"}),h5:e=>(0,n.jsx)(i.bL,{children:e.children,component:"h4",variant:"h4"}),p:e=>(0,n.jsx)(i.bL,{className:eq().section,children:e.children,component:"p",variant:"normal"}),pre:e=>(0,n.jsx)(i.bL,{className:eq().section,children:e.children,component:"pre",variant:"normal"})}})};async function eW(e){let t=JSON.parse(e),{errors:l,documentation:n}=await ee.managerClient.documentation.read({kind:t.kind,data:t.data});if(l.length>0)throw l;return n}var e$=l(65480),eJ=l.n(e$);let e0=e=>{var t;let{model:l}=e,a=(0,eG.p)(),o=(t={kind:"PageSnippet",data:{model:l}},(0,J.QT)(eW,[JSON.stringify(t)])),{completeStep:r}=(0,W.k)();return 0===o.length?null:(0,n.jsxs)(i.ae,{size:"small",trigger:(0,n.jsx)(i.E,{color:"grey",onClick:()=>{r("codePage"),v.Xe.track({event:"page-type:open-snippet",framework:a})},startIcon:"code",children:"Page snippet"}),children:[(0,n.jsx)(i.al,{icon:"code",title:"Page snippet"}),(0,n.jsx)("section",{className:eJ().content,children:o.length>1?(0,n.jsx)(eU,{style:{flex:1},tabs:o.map((e,t)=>{let{label:l,content:i}=e;return{label:null!=l?l:"Tab ".concat(t+1),content:(0,n.jsx)(eQ,{markdown:i})}})}):(0,n.jsx)(i.bn,{style:{flex:1,padding:16},children:(0,n.jsx)(eQ,{markdown:o[0].content})})})]})},e1=e=>{let{model:t}=e;return(0,n.jsx)("div",{children:(0,n.jsx)(F.h,{children:(0,n.jsx)(s.Suspense,{fallback:(0,n.jsx)(i.E,{color:"grey",startIcon:"code",children:"Page snippet"}),children:(0,n.jsx)(e0,{model:t})})})})},e4=()=>{let e=(0,r.useRouter)(),{selectedCustomType:t}=(0,c.v9)(t=>({selectedCustomType:(0,eP.Jk)(t,(0,h.Ag)(e.query))}));return((0,s.useEffect)(()=>{t&&(0,eO.TG)(t)||e.replace("/")},[t,e]),t&&(0,eO.TG)(t))?(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(o(),{children:(0,n.jsxs)("title",{children:[t.local.label," - Slice Machine"]})}),(0,n.jsx)(e6,{customType:t.local})]}):(0,n.jsx)(p.LN,{})},e6=e=>{let{customType:t}=e;return null===t?(0,n.jsx)(p.LN,{}):(0,n.jsx)(p.LN,{children:(0,n.jsx)(S,{initialCustomType:k.Dc.fromSM(t),children:e=>{var l;let{actionQueueStatus:a,customType:o,setCustomType:r}=e,s=(0,m.y6)(o),c=h.cd[t.format],x=f.$[t.format];return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(p.wd,{children:[(0,n.jsx)(p.Xq,{url:c.tablePagePathname}),(0,n.jsxs)(p.Cx,{children:[(0,n.jsx)(d.g,{children:x.name({start:!0,plural:!0})}),(0,n.jsx)(d.g,{active:!0,children:null!==(l=o.label)&&void 0!==l?l:o.id})]}),(0,n.jsxs)(p.K2,{children:[(0,n.jsx)(u.X,{status:a}),"page"===o.format?(0,n.jsx)(e1,{model:o}):void 0,(0,n.jsx)(eF._,{isChangesLocal:!0,format:s,customType:o,setLocalCustomType:r})]})]}),(0,n.jsx)(p.RN,{children:(0,n.jsx)(i.D,{flexDirection:"column",minWidth:0,children:(0,n.jsx)(eZ,{})})})]})}})})}},84879:function(e,t,l){"use strict";l.d(t,{E:function(){return o}});var n=l(18566),i=l(80148);async function a(){return i.managerClient.project.getSliceMachineConfig()}function o(e){var t,l;let[o,r]=[(0,n.QT)(a,[]),async e=>{await i.managerClient.project.writeSliceMachineConfig({config:e}),(0,n.VA)(a,[],e)}],s=async t=>{let l={...o,labs:{...o.labs}};t?l.labs[e]=t:e in l.labs&&delete l.labs[e],0===Object.keys(l.labs).length&&delete l.labs,await r(l)};return[{enabled:null!==(l=null==o?void 0:null===(t=o.labs)||void 0===t?void 0:t[e])&&void 0!==l&&l},s]}},34919:function(e){e.exports={flex:"ContentTabs_flex__T21Oc",column:"ContentTabs_column__1f8b8 ContentTabs_flex__T21Oc",root:"ContentTabs_root__Gn3Zg ContentTabs_column__1f8b8 ContentTabs_flex__T21Oc",list:"ContentTabs_list__rAZtl ContentTabs_flex__T21Oc",trigger:"ContentTabs_trigger__cTyPN ContentTabs_column__1f8b8 ContentTabs_flex__T21Oc",triggerText:"ContentTabs_triggerText__p_ZBl",content:"ContentTabs_content__H1Stj ContentTabs_column__1f8b8 ContentTabs_flex__T21Oc",scrollArea:"ContentTabs_scrollArea__DuDcQ"}},65480:function(e){e.exports={content:"PageSnippetDialog_content__jIN6d"}},44621:function(e){e.exports={section:"MarkdownRenderer_section__uNS1M",inlineCode:"MarkdownRenderer_inlineCode__lmGTi"}},65375:function(e){e.exports={scrollArea:"ConvertLegacySliceButton_scrollArea__xf3vM",label:"ConvertLegacySliceButton_label__BK0Gd"}}}]);
package/out/_next/static/chunks/{593-97393b59cba3d429.js → 593-7ffd1197c3405ef8.js} RENAMED
@@ -1 +1 @@
1
- (self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[593],{21442:function(e,t,i){"use strict";i.d(t,{H:function(){return s}});var r=i(2784),n=i(54597);let s=()=>{let{openScreenshotsModal:e}=(0,n.Z)(),[t,i]=(0,r.useState)({sliceFilterFn:e=>e});return{modalPayload:t,onOpenModal:t=>{i(t),e()}}}},86652:function(e,t,i){"use strict";i.d(t,{Z:function(){return _}});var r,n,s=i(52322),o=i(2784),l=i(951),a=i(75100),d=i(56580),c=i(75289),x=i(68238),u=i.n(x);let p=e=>{let{children:t}=e;return(0,s.jsx)("kbd",{className:u().root,children:t})};var h=i(42828),v=i(30527),f=i(55862),m=i(75966),g=i(34830),j=i(54597);(r=n||(n={})).Mac="Mac",r.Linux="Linux",r.Windows="Windows";let b=()=>{let{userAgent:e}=navigator,t="Linux";return Object.values(n).forEach(i=>{e.includes(i)&&(t=i)}),t};var y=i(76473),C=i(88932),E=i(94160);async function w(e){let{variationId:t,slice:i,file:r,method:n}=e;try{let e=new FormData;e.append("file",r),e.append("libraryName",i.from),e.append("sliceName",i.model.name),e.append("variationId",t);let{errors:s,url:o}=await (0,E.XQ)({libraryName:i.from,sliceId:i.model.id,variationId:t,file:r});if(s.length>0)throw s;return E.Xe.track({event:"screenshot-taken",type:"custom",method:n}),{...i,screenshots:{...i.screenshots,[t]:{url:o}}}}catch(t){let e="Screenshot not saved";console.error(e,t),C.Am.error(e)}}var F=i(77823),k=i(7974);let D=e=>{let{inputFile:t,handleFile:i,children:r,isDragActive:n}=e;return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(c.__,{htmlFor:"input-file",variant:"buttons.white",sx:{p:2,px:0,display:"flex",justifyContent:"center",width:200,alignItems:"center",flex:1},children:r||"Select file"}),(0,s.jsx)("input",{id:"input-file",type:"file",ref:t,style:{display:"none"},accept:k.nG.map(e=>"image/".concat(e)).join(","),onChange:e=>{var t;i(null===(t=e.target.files)||void 0===t?void 0:t[0],n)}})]})},I=()=>(0,s.jsx)(c.kC,{variant:"boxes.centered",sx:{p:2,position:"absolute",height:"100%",width:"100%",background:"rgba(249, 248, 249, 0.7)",backdropFilter:"blur(5px)",zIndex:"1",pointerEvents:"none"},children:(0,s.jsxs)(c.kC,{variant:"boxes.centered",sx:{border:"1px dashed #6E56CF",height:"100%",width:"100%",borderRadius:"4px"},children:[(0,s.jsx)(S,{isActive:!0}),(0,s.jsx)(c.xv,{sx:{my:2},children:"Drop file here"}),(0,s.jsx)(c.xv,{variant:"secondary",children:"Maximum upload size file: 128Mb"})]})}),S=e=>{let{isActive:t}=e;return(0,s.jsx)(c.kC,{sx:{p:1,borderRadius:"50%",bg:t?"#F1EEFE":"#EDECEE",alignItems:"center",justifyContent:"center",width:"48px",height:"48px"},children:(0,s.jsx)(l.IEK,{style:{color:t?"#6E56CF":"#6F6E77",fontSize:"34px"}})})};var R=e=>{let{variationID:t,slice:i,imageTypes:r=k.nG,onUploadSuccess:n}=e,l=i.screenshots[t],{saveSliceCustomScreenshotSuccess:a}=(0,j.Z)(),[d,x]=(0,o.useState)(!1),[u,p]=(0,o.useState)(!1),[h,v]=(0,o.useState)(!1);(0,y.y1)(["meta+v","ctrl+v"],()=>void E(),[t,i]);let{FileInputRenderer:f,fileInputProps:m}=function(e){let{onHandleFile:t}=e,i=(0,o.useRef)(null),r=async(e,r)=>{e&&(await t(e,r),(null==i?void 0:i.current)&&(i.current.value=""))};return{handleFile:r,inputFile:i,FileInputRenderer:D,fileInputProps:{inputFile:i,handleFile:r}}}({onHandleFile:async(e,r)=>{v(!0);let s=await w({slice:i,file:e,method:r?"dragAndDrop":"upload",variationId:t});p(!1);let o=null==s?void 0:s.screenshots[t];o&&(a(t,o,s),n&&n(s)),v(!1)}}),g=async e=>{if(e.size>128e6)return C.Am.error("File is too big. Max file size: 128Mb.");v(!0);let r=await w({slice:i,file:e,method:"dragAndDrop",variationId:t}),s=null==r?void 0:r.screenshots[t];s&&(a(t,s,r),n&&n(r)),v(!1)},b="function"==typeof navigator.clipboard.read,E=async()=>{if(b)try{let e=await navigator.clipboard.read();if(void 0!==e[0]){let t=e[0].types.find(e=>r.map(e=>"image/".concat(e)).includes(e));if(void 0!==t){let i=await e[0].getType(t),r=new File([i],"file");return g(r)}}}catch(e){console.error("Could not paste file",e)}},R=e=>t=>{t.preventDefault(),x(e)},z=e=>t=>{t.preventDefault(),p(e)};return(0,s.jsxs)(c.kC,{as:"form",variant:"boxes.centered",sx:{bg:"#F9F8F9",position:"relative",borderRadius:"6px",height:"320px"},onDragEnter:R(!0),onDragLeave:R(!1),onDragOver:R(!0),onMouseEnter:z(!0),onMouseLeave:z(!1),onSubmit:e=>e.preventDefault(),onDrop:e=>{var t;e.preventDefault(),x(!1);let i=null===(t=e.dataTransfer.files)||void 0===t?void 0:t[0];if(void 0!==i)return r.some(e=>"image/".concat(e)===i.type)?void g(i):C.Am.error("Only files of type ".concat(r.join(", ")," are accepted."))},children:[h?(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(c.$j,{}),(0,s.jsx)(c.xv,{sx:{my:2},children:"Uploading file ..."})]}):null,h||void 0===l?null:(0,s.jsx)(F.q,{src:l.url,sx:{width:"100%",height:"100%",maxHeight:"100%",backdropFilter:"blur(5px)"}}),h?null:(0,s.jsx)(c.kC,{sx:{p:2,position:"absolute",width:"100%",height:"100%",borderRadius:"6px",background:"#F9F8F9B2",justifyContent:"center",alignItems:"center",visibility:u||void 0===l?"visible":"hidden"},children:(0,s.jsx)(c.kC,{variant:"boxes.centered",sx:{border:"1px dashed #6E56CF",height:"100%",width:"100%",borderRadius:"4px"},children:(0,s.jsxs)(c.kC,{sx:{width:"100%",justifyContent:"center",alignItems:"center",flexDirection:"column"},children:[(0,s.jsx)(S,{isActive:d}),(0,s.jsx)(c.xv,{sx:{my:2},children:b?"Paste, drop or ...":"Drop or ..."}),(0,s.jsx)(f,{...m,isDragActive:d}),(0,s.jsx)(c.xv,{sx:{color:"greyIcon",mt:1},children:"Maximum file size: 128Mb"})]})})}),d?(0,s.jsx)(I,{}):null]})};let z=()=>{let e=b(),t=[n.Windows,n.Linux].includes(e)?(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(p,{children:"ctrl"})," + ",(0,s.jsx)(p,{children:"shift"})," + ",(0,s.jsx)(p,{children:"c"})]}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(p,{children:"cmd"})," + ",(0,s.jsx)(p,{children:"shift"})," + ",(0,s.jsx)(p,{children:"c"})]});return(0,s.jsxs)(c.kC,{sx:{pl:"4px",alignItems:"center",color:"#000",borderRadius:"6px",fontSize:"12px",lineHeight:"24px",border:"1px solid #E4E2E4",boxShadow:"0px 1px 0px 0px rgba(0, 0, 0, 0.04)",width:"100%",minHeight:"40px"},children:[(0,s.jsx)(h.Y,{variant:"square"}),(0,s.jsxs)("div",{children:["Use\xa0",t," to copy any frame as .png, then just paste it here"]})]})},M=e=>{let{isValid:t}=e;return(0,s.jsx)(c.kC,{sx:{p:2,border:"1px solid #E4E2E4",borderRadius:"6px",bg:"#FFF"},children:t?(0,s.jsx)(l.Ypm,{style:{fontSize:"16px"}}):(0,s.jsx)(a.j6O,{style:{fontSize:"16px",color:"#ED811C"}})})},O=e=>{let{slice:t,onSelectVariation:i,variationSelector:r}=e;return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(c.X6,{as:"h4",sx:{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:t.model.name}),(0,s.jsx)(c.xu,{children:(0,s.jsx)(c.xu,{as:"ul",sx:{pl:0,my:3},children:t.model.variations.map(e=>{let{sliceID:n,variationID:o}=r,l=n===t.model.id&&o===e.id;return(0,s.jsx)(c.xu,{as:"li",sx:{listStyle:"none",my:2,p:2,cursor:"pointer",borderRadius:"4px",...l&&{bg:"#EDECEE",fontWeight:"500"},":hover":{bg:"#EDECEE"}},onClick:()=>i({sliceID:t.model.id,variationID:e.id}),children:(0,s.jsxs)(c.kC,{sx:{alignItems:"center"},children:[(0,s.jsx)(M,{isValid:!!t.screenshots[e.id]}),(0,s.jsx)(c.xv,{sx:{ml:2},children:e.name})]})},"".concat(t.model.id,"-").concat(e.id))})})})]})},A=(e,t)=>e||(t.length?{sliceID:t[0].model.id,variationID:t[0].model.variations[0].id}:void 0);function H(e){let{children:t}=e,i=(0,v.W)();return(0,s.jsx)(c.kC,{sx:{position:"sticky",top:0,zIndex:1,background:"gray",p:"16px",alignItems:"center",justifyContent:"space-between",borderTopLeftRadius:i,borderTopRightRadius:i,borderBottom:e=>{var t;return"1px solid ".concat(String(null===(t=e.colors)||void 0===t?void 0:t.borders))}},children:t})}var _=e=>{let{slices:t,defaultVariationSelector:i,onUploadSuccess:r}=e,{closeModals:n}=(0,j.Z)(),{isOpen:l}=(0,d.v9)(e=>({isOpen:(0,m.gP)(e,g.q.SCREENSHOTS)})),[a,x]=(0,o.useState)(A(i,t));if((0,o.useEffect)(()=>{x(A(i,t))},[null==i?void 0:i.sliceID,null==i?void 0:i.variationID,l]),0===t.length||!a)return null;let u="function"==typeof navigator.clipboard.read;return(0,s.jsx)(f.Z,{isOpen:l,shouldCloseOnOverlayClick:!0,onRequestClose:()=>n(),children:(0,s.jsx)(v.Z,{radius:"0px",bodySx:{p:0,bg:"#FFF",position:"relative"},sx:{border:"none"},Header:(0,s.jsxs)(H,{children:[(0,s.jsx)(c.X6,{sx:{fontSize:"20px"},children:"Slice screenshots"}),(0,s.jsx)(c.x8,{type:"button",onClick:()=>n()})]}),Footer:null,children:(0,s.jsxs)(c.xu,{sx:{display:"flex",flexWrap:"wrap",height:"100%"},children:[(0,s.jsx)(c.xu,{sx:{p:3,bg:"grey07",flexGrow:1,overflow:"auto",maxHeight:"100%",flexBasis:"sidebar"},children:t.map((e,t)=>(0,s.jsx)(O,{slice:e,variationSelector:a,onSelectVariation:x},"".concat(e.model.id,"-").concat(t)))}),(0,s.jsxs)(c.kC,{as:"main",sx:{p:3,flexGrow:99999,flexBasis:0,flexDirection:"column",minWidth:320,gap:"8px"},children:[u?(0,s.jsx)(z,{}):void 0,(()=>{let e=t.find(e=>e.model.id===a.sliceID);return e?(0,s.jsx)(R,{variationID:a.variationID,slice:e,onUploadSuccess:r}):null})()]})]})})})}},77823:function(e,t,i){"use strict";i.d(t,{q:function(){return a}});var r=i(52322),n=i(2784),s=i(65186),o=i(75289);let l=(0,n.memo)(e=>{let{src:t}=e;return(0,r.jsx)(o.Ee,{src:t,alt:"Preview image",sx:{maxHeight:"100%"}})}),a=e=>{let{src:t,sx:i}=e;return(0,r.jsx)(o.kC,{sx:{position:"relative",alignItems:"center",justifyContent:"center",overflow:"hidden",backgroundImage:"url(/pattern.png)",backgroundColor:"headSection",backgroundRepeat:"repeat",backgroundSize:"20px",borderRadius:"4px",...i},children:void 0!==t?(0,r.jsx)(l,{src:t}):(0,r.jsxs)(o.xv,{sx:{display:"flex",flexDirection:"column",alignItems:"center"},children:[(0,r.jsx)(s.eJU,{}),"You have no screenshot yet."]})})}},68238:function(e){e.exports={root:"Kbd_root__LRA1F"}}}]);
1
+ (self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[593],{21442:function(e,t,i){"use strict";i.d(t,{H:function(){return s}});var r=i(2784),n=i(54597);let s=()=>{let{openScreenshotsModal:e}=(0,n.Z)(),[t,i]=(0,r.useState)({sliceFilterFn:e=>e});return{modalPayload:t,onOpenModal:t=>{i(t),e()}}}},86652:function(e,t,i){"use strict";i.d(t,{Z:function(){return _}});var r,n,s=i(52322),o=i(2784),l=i(951),a=i(75100),d=i(56580),c=i(75289),x=i(68238),u=i.n(x);let p=e=>{let{children:t}=e;return(0,s.jsx)("kbd",{className:u().root,children:t})};var h=i(56141),v=i(30527),f=i(55862),m=i(75966),g=i(34830),j=i(54597);(r=n||(n={})).Mac="Mac",r.Linux="Linux",r.Windows="Windows";let b=()=>{let{userAgent:e}=navigator,t="Linux";return Object.values(n).forEach(i=>{e.includes(i)&&(t=i)}),t};var y=i(76473),C=i(88932),E=i(94160);async function w(e){let{variationId:t,slice:i,file:r,method:n}=e;try{let e=new FormData;e.append("file",r),e.append("libraryName",i.from),e.append("sliceName",i.model.name),e.append("variationId",t);let{errors:s,url:o}=await (0,E.XQ)({libraryName:i.from,sliceId:i.model.id,variationId:t,file:r});if(s.length>0)throw s;return E.Xe.track({event:"screenshot-taken",type:"custom",method:n}),{...i,screenshots:{...i.screenshots,[t]:{url:o}}}}catch(t){let e="Screenshot not saved";console.error(e,t),C.Am.error(e)}}var F=i(77823),k=i(7974);let D=e=>{let{inputFile:t,handleFile:i,children:r,isDragActive:n}=e;return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(c.__,{htmlFor:"input-file",variant:"buttons.white",sx:{p:2,px:0,display:"flex",justifyContent:"center",width:200,alignItems:"center",flex:1},children:r||"Select file"}),(0,s.jsx)("input",{id:"input-file",type:"file",ref:t,style:{display:"none"},accept:k.nG.map(e=>"image/".concat(e)).join(","),onChange:e=>{var t;i(null===(t=e.target.files)||void 0===t?void 0:t[0],n)}})]})},I=()=>(0,s.jsx)(c.kC,{variant:"boxes.centered",sx:{p:2,position:"absolute",height:"100%",width:"100%",background:"rgba(249, 248, 249, 0.7)",backdropFilter:"blur(5px)",zIndex:"1",pointerEvents:"none"},children:(0,s.jsxs)(c.kC,{variant:"boxes.centered",sx:{border:"1px dashed #6E56CF",height:"100%",width:"100%",borderRadius:"4px"},children:[(0,s.jsx)(S,{isActive:!0}),(0,s.jsx)(c.xv,{sx:{my:2},children:"Drop file here"}),(0,s.jsx)(c.xv,{variant:"secondary",children:"Maximum upload size file: 128Mb"})]})}),S=e=>{let{isActive:t}=e;return(0,s.jsx)(c.kC,{sx:{p:1,borderRadius:"50%",bg:t?"#F1EEFE":"#EDECEE",alignItems:"center",justifyContent:"center",width:"48px",height:"48px"},children:(0,s.jsx)(l.IEK,{style:{color:t?"#6E56CF":"#6F6E77",fontSize:"34px"}})})};var R=e=>{let{variationID:t,slice:i,imageTypes:r=k.nG,onUploadSuccess:n}=e,l=i.screenshots[t],{saveSliceCustomScreenshotSuccess:a}=(0,j.Z)(),[d,x]=(0,o.useState)(!1),[u,p]=(0,o.useState)(!1),[h,v]=(0,o.useState)(!1);(0,y.y1)(["meta+v","ctrl+v"],()=>void E(),[t,i]);let{FileInputRenderer:f,fileInputProps:m}=function(e){let{onHandleFile:t}=e,i=(0,o.useRef)(null),r=async(e,r)=>{e&&(await t(e,r),(null==i?void 0:i.current)&&(i.current.value=""))};return{handleFile:r,inputFile:i,FileInputRenderer:D,fileInputProps:{inputFile:i,handleFile:r}}}({onHandleFile:async(e,r)=>{v(!0);let s=await w({slice:i,file:e,method:r?"dragAndDrop":"upload",variationId:t});p(!1);let o=null==s?void 0:s.screenshots[t];o&&(a(t,o,s),n&&n(s)),v(!1)}}),g=async e=>{if(e.size>128e6)return C.Am.error("File is too big. Max file size: 128Mb.");v(!0);let r=await w({slice:i,file:e,method:"dragAndDrop",variationId:t}),s=null==r?void 0:r.screenshots[t];s&&(a(t,s,r),n&&n(r)),v(!1)},b="function"==typeof navigator.clipboard.read,E=async()=>{if(b)try{let e=await navigator.clipboard.read();if(void 0!==e[0]){let t=e[0].types.find(e=>r.map(e=>"image/".concat(e)).includes(e));if(void 0!==t){let i=await e[0].getType(t),r=new File([i],"file");return g(r)}}}catch(e){console.error("Could not paste file",e)}},R=e=>t=>{t.preventDefault(),x(e)},z=e=>t=>{t.preventDefault(),p(e)};return(0,s.jsxs)(c.kC,{as:"form",variant:"boxes.centered",sx:{bg:"#F9F8F9",position:"relative",borderRadius:"6px",height:"320px"},onDragEnter:R(!0),onDragLeave:R(!1),onDragOver:R(!0),onMouseEnter:z(!0),onMouseLeave:z(!1),onSubmit:e=>e.preventDefault(),onDrop:e=>{var t;e.preventDefault(),x(!1);let i=null===(t=e.dataTransfer.files)||void 0===t?void 0:t[0];if(void 0!==i)return r.some(e=>"image/".concat(e)===i.type)?void g(i):C.Am.error("Only files of type ".concat(r.join(", ")," are accepted."))},children:[h?(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(c.$j,{}),(0,s.jsx)(c.xv,{sx:{my:2},children:"Uploading file ..."})]}):null,h||void 0===l?null:(0,s.jsx)(F.q,{src:l.url,sx:{width:"100%",height:"100%",maxHeight:"100%",backdropFilter:"blur(5px)"}}),h?null:(0,s.jsx)(c.kC,{sx:{p:2,position:"absolute",width:"100%",height:"100%",borderRadius:"6px",background:"#F9F8F9B2",justifyContent:"center",alignItems:"center",visibility:u||void 0===l?"visible":"hidden"},children:(0,s.jsx)(c.kC,{variant:"boxes.centered",sx:{border:"1px dashed #6E56CF",height:"100%",width:"100%",borderRadius:"4px"},children:(0,s.jsxs)(c.kC,{sx:{width:"100%",justifyContent:"center",alignItems:"center",flexDirection:"column"},children:[(0,s.jsx)(S,{isActive:d}),(0,s.jsx)(c.xv,{sx:{my:2},children:b?"Paste, drop or ...":"Drop or ..."}),(0,s.jsx)(f,{...m,isDragActive:d}),(0,s.jsx)(c.xv,{sx:{color:"greyIcon",mt:1},children:"Maximum file size: 128Mb"})]})})}),d?(0,s.jsx)(I,{}):null]})};let z=()=>{let e=b(),t=[n.Windows,n.Linux].includes(e)?(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(p,{children:"ctrl"})," + ",(0,s.jsx)(p,{children:"shift"})," + ",(0,s.jsx)(p,{children:"c"})]}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(p,{children:"cmd"})," + ",(0,s.jsx)(p,{children:"shift"})," + ",(0,s.jsx)(p,{children:"c"})]});return(0,s.jsxs)(c.kC,{sx:{pl:"4px",alignItems:"center",color:"#000",borderRadius:"6px",fontSize:"12px",lineHeight:"24px",border:"1px solid #E4E2E4",boxShadow:"0px 1px 0px 0px rgba(0, 0, 0, 0.04)",width:"100%",minHeight:"40px"},children:[(0,s.jsx)(h.S,{}),(0,s.jsxs)("div",{children:["Use\xa0",t," to copy any frame as .png, then just paste it here"]})]})},M=e=>{let{isValid:t}=e;return(0,s.jsx)(c.kC,{sx:{p:2,border:"1px solid #E4E2E4",borderRadius:"6px",bg:"#FFF"},children:t?(0,s.jsx)(l.Ypm,{style:{fontSize:"16px"}}):(0,s.jsx)(a.j6O,{style:{fontSize:"16px",color:"#ED811C"}})})},O=e=>{let{slice:t,onSelectVariation:i,variationSelector:r}=e;return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(c.X6,{as:"h4",sx:{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:t.model.name}),(0,s.jsx)(c.xu,{children:(0,s.jsx)(c.xu,{as:"ul",sx:{pl:0,my:3},children:t.model.variations.map(e=>{let{sliceID:n,variationID:o}=r,l=n===t.model.id&&o===e.id;return(0,s.jsx)(c.xu,{as:"li",sx:{listStyle:"none",my:2,p:2,cursor:"pointer",borderRadius:"4px",...l&&{bg:"#EDECEE",fontWeight:"500"},":hover":{bg:"#EDECEE"}},onClick:()=>i({sliceID:t.model.id,variationID:e.id}),children:(0,s.jsxs)(c.kC,{sx:{alignItems:"center"},children:[(0,s.jsx)(M,{isValid:!!t.screenshots[e.id]}),(0,s.jsx)(c.xv,{sx:{ml:2},children:e.name})]})},"".concat(t.model.id,"-").concat(e.id))})})})]})},A=(e,t)=>e||(t.length?{sliceID:t[0].model.id,variationID:t[0].model.variations[0].id}:void 0);function H(e){let{children:t}=e,i=(0,v.W)();return(0,s.jsx)(c.kC,{sx:{position:"sticky",top:0,zIndex:1,background:"gray",p:"16px",alignItems:"center",justifyContent:"space-between",borderTopLeftRadius:i,borderTopRightRadius:i,borderBottom:e=>{var t;return"1px solid ".concat(String(null===(t=e.colors)||void 0===t?void 0:t.borders))}},children:t})}var _=e=>{let{slices:t,defaultVariationSelector:i,onUploadSuccess:r}=e,{closeModals:n}=(0,j.Z)(),{isOpen:l}=(0,d.v9)(e=>({isOpen:(0,m.gP)(e,g.q.SCREENSHOTS)})),[a,x]=(0,o.useState)(A(i,t));if((0,o.useEffect)(()=>{x(A(i,t))},[null==i?void 0:i.sliceID,null==i?void 0:i.variationID,l]),0===t.length||!a)return null;let u="function"==typeof navigator.clipboard.read;return(0,s.jsx)(f.Z,{isOpen:l,shouldCloseOnOverlayClick:!0,onRequestClose:()=>n(),children:(0,s.jsx)(v.Z,{radius:"0px",bodySx:{p:0,bg:"#FFF",position:"relative"},sx:{border:"none"},Header:(0,s.jsxs)(H,{children:[(0,s.jsx)(c.X6,{sx:{fontSize:"20px"},children:"Slice screenshots"}),(0,s.jsx)(c.x8,{type:"button",onClick:()=>n()})]}),Footer:null,children:(0,s.jsxs)(c.xu,{sx:{display:"flex",flexWrap:"wrap",height:"100%"},children:[(0,s.jsx)(c.xu,{sx:{p:3,bg:"grey07",flexGrow:1,overflow:"auto",maxHeight:"100%",flexBasis:"sidebar"},children:t.map((e,t)=>(0,s.jsx)(O,{slice:e,variationSelector:a,onSelectVariation:x},"".concat(e.model.id,"-").concat(t)))}),(0,s.jsxs)(c.kC,{as:"main",sx:{p:3,flexGrow:99999,flexBasis:0,flexDirection:"column",minWidth:320,gap:"8px"},children:[u?(0,s.jsx)(z,{}):void 0,(()=>{let e=t.find(e=>e.model.id===a.sliceID);return e?(0,s.jsx)(R,{variationID:a.variationID,slice:e,onUploadSuccess:r}):null})()]})]})})})}},77823:function(e,t,i){"use strict";i.d(t,{q:function(){return a}});var r=i(52322),n=i(2784),s=i(65186),o=i(75289);let l=(0,n.memo)(e=>{let{src:t}=e;return(0,r.jsx)(o.Ee,{src:t,alt:"Preview image",sx:{maxHeight:"100%"}})}),a=e=>{let{src:t,sx:i}=e;return(0,r.jsx)(o.kC,{sx:{position:"relative",alignItems:"center",justifyContent:"center",overflow:"hidden",backgroundImage:"url(/pattern.png)",backgroundColor:"headSection",backgroundRepeat:"repeat",backgroundSize:"20px",borderRadius:"4px",...i},children:void 0!==t?(0,r.jsx)(l,{src:t}):(0,r.jsxs)(o.xv,{sx:{display:"flex",flexDirection:"column",alignItems:"center"},children:[(0,r.jsx)(s.eJU,{}),"You have no screenshot yet."]})})}},68238:function(e){e.exports={root:"Kbd_root__LRA1F"}}}]);
package/out/_next/static/chunks/633-275b9968b5aaa920.js ADDED
@@ -0,0 +1 @@
1
+ "use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[633],{21446:function(e,t,a){a.d(t,{S:function(){return w}});var i=a(52322),r=a(11699),n=a(2784),l=a(76473),s=a(88932),o=a(30195),c=a(94160),d=a(34166),u=a(98250),m=a(68968),g=a(96317);let p=(0,n.forwardRef)((e,t)=>{let{width:a,height:r}=e;return void 0===a&&void 0===r&&(a=10,r=16),(0,i.jsxs)("svg",{ref:t,viewBox:"0 0 10 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",height:r,width:a,children:[(0,i.jsx)("path",{d:"M5 7.83323C5 6.45253 6.11928 5.33325 7.49997 5.33325C8.8807 5.33325 10 6.45255 10 7.83328V8.16656C10 9.54728 8.8807 10.6666 7.49997 10.6666C6.11928 10.6666 5 9.54731 5 8.16661V7.83323Z",fill:"#1ABCFE"}),(0,i.jsx)("path",{d:"M0 13.3334C0 11.8607 1.19391 10.6667 2.66667 10.6667H5V13.5001C5 14.8808 3.88071 16.0001 2.5 16.0001C1.11929 16.0001 0 14.8808 0 13.5001L0 13.3334Z",fill:"#0ACF83"}),(0,i.jsx)("path",{d:"M5 0V5.33333H7.33333C8.80609 5.33333 10 4.13943 10 2.66667C10 1.19391 8.80609 0 7.33333 0L5 0Z",fill:"#FF7262"}),(0,i.jsx)("path",{d:"M0 2.66659C0 4.13934 1.19391 5.33325 2.66667 5.33325L5 5.33325L5 -8.15392e-05L2.66667 -8.15392e-05C1.19391 -8.15392e-05 0 1.19383 0 2.66659Z",fill:"#F24E1E"}),(0,i.jsx)("path",{d:"M0 8.00008C0 9.47284 1.19391 10.6667 2.66667 10.6667H5L5 5.33341L2.66667 5.33341C1.19391 5.33341 0 6.52732 0 8.00008Z",fill:"#A259FF"})]})});var h=a(80148),f=a(54597),x=a(62434),y=a(56141);function b(e){let t;let{slice:a}=e,n="uploading"===a.status||"generating"===a.status,l="uploadError"===a.status||"generateError"===a.status,s="pending"===a.status||"generateError"===a.status||"generating"===a.status||"success"===a.status;return l?t=(0,i.jsx)(r.E,{startIcon:"refresh",color:"grey",onClick:a.onRetry,children:"Retry"}):"figma"===a.source&&(t=(0,i.jsx)(r.c3,{content:"Pasted from Figma",children:(0,i.jsx)(y.S,{})})),(0,i.jsxs)(x.Zb,{disabled:n,children:[s?(0,i.jsx)(x.ZB,{src:a.thumbnailUrl}):(0,i.jsx)(x.ZB,{component:"div"}),(0,i.jsx)(x.eW,{loading:n,startIcon:function(e){switch(e){case"uploadError":case"generateError":return"close";case"pending":return"image";case"success":return"check";default:return}}(a.status),title:"success"===a.status?a.model.name:"figma"===a.source?a.image.name.split(".")[0]:a.image.name,subtitle:function(e){switch(e.status){case"uploading":return"Uploading...";case"pending":var t;return(t=e.image.size)<1024?"".concat(t," B"):t<1048576?"".concat((t/1024).toFixed(1)," kB"):"".concat((t/1048576).toFixed(1)," MB");case"uploadError":return"Unable to upload image";case"generating":return"Generating...";case"generateError":return"Something went wrong";case"success":return"Generated"}}(a),error:l,action:t})]})}let j=o.z.object({__type:o.z.literal("figma-to-prismic/clipboard-data"),name:o.z.string(),image:o.z.string().startsWith("data:image/")});function w(e){let{open:t,location:a,onSuccess:o,onClose:g}=e,[x,y]=(0,n.useState)([]),[w,I]=(0,n.useState)(!1),{syncChanges:A}=(0,m.g)(),{createSliceSuccess:L}=(0,f.Z)(),{completeStep:k}=(0,u.k)(),D=function(e){let{open:t}=e,a=(0,n.useRef)([]);return(0,n.useEffect)(()=>{t&&(a.current=[],h.managerClient.slices.readAllSlices().then(e=>{a.current=e.models.map(e=>{let{model:t}=e;return t})}).catch(()=>null))},[t]),a}({open:t}),E=F(),{libraryID:U,isLoading:N}=function(){let[e,t]=(0,n.useState)();return(0,n.useEffect)(()=>{h.managerClient.project.getSliceMachineConfig().then(e=>{var a;let i=null==e?void 0:null===(a=e.libraries)||void 0===a?void 0:a[0];if(void 0===i)throw Error("No library found in the config.");t(i)}).catch(()=>{throw Error("Could not get library ID from the config.")})},[]),{libraryID:e,isLoading:void 0===e}}(),z=(0,n.useRef)(crypto.randomUUID());(0,l.y1)(["meta+v","ctrl+v"],e=>{e.preventDefault(),J()},{enabled:t&&E});let B=e=>{let{index:t,slice:a}=e;y(e=>e.map((e,i)=>i===t?a(e):e))},P=e=>{if(V)return;if(e.length>10){s.Am.error("You can only upload ".concat(10," images at a time."));return}let t=x.length;y(t=>[...t,...e.map(e=>({source:"upload",status:"uploading",image:e}))]),e.forEach((e,a)=>{R({index:t+a,image:e,source:"upload"})})},R=async e=>{let{index:t,image:a,source:i}=e,r=z.current;B({index:t,slice:e=>({...e,status:"uploading",image:a,source:i})});try{let e=await C({image:a});if(r!==z.current)return;B({index:t,slice:t=>({...t,status:"pending",thumbnailUrl:e})})}catch(e){if(r!==z.current)return;B({index:t,slice:e=>({...e,status:"uploadError",onRetry:()=>void R({index:t,image:a,source:i})})})}},Z=async e=>{if(void 0===U)return;let{index:t,imageUrl:i,source:r}=e,n=z.current;B({index:t,slice:e=>({...e,status:"generating",thumbnailUrl:i})});try{let e=await h.managerClient.customTypes.inferSlice({source:r,libraryID:U,imageUrl:i});if(n!==z.current)return;let l=function(e){let{existingSlices:t,newSlices:a,slice:i}=e,r=new Set,n=new Set;for(let{id:e,name:a}of t)r.add(e),n.add(a.toLowerCase());for(let e of a)"success"===e.status&&(r.add(e.model.id),n.add(e.model.name.toLowerCase()));let l=i.id,s=2;for(;r.has(l);)l="".concat(i.id,"_").concat(s),s++;let o=i.name;for(s=2;n.has(o.toLowerCase());)o="".concat(i.name).concat(s),s++;return{...i,id:l,name:o}}({existingSlices:D.current,newSlices:x,slice:e.slice});if(y(a=>a.map((a,r)=>r!==t?a:{...a,status:"success",thumbnailUrl:i,model:l,langSmithUrl:e.langSmithUrl})),"upload"===r){n=z.current;let e=x[t],{errors:a}=await h.managerClient.slices.createSlice({libraryID:U,model:l});if(a.length)throw Error("Failed to create slice ".concat(l.id,"."));if(await h.managerClient.slices.updateSliceScreenshot({libraryID:U,sliceID:l.id,variationID:l.variations[0].id,data:e.image}),n!==z.current)return}k("createSlice"),c.Xe.track({event:"slice:created",id:l.id,name:l.name,library:U,location:a,mode:"ai",langSmithUrl:e.langSmithUrl}),(0,d.nZ)({type:"model",library:U,sliceId:l.id,variationId:l.variations[0].id,langSmithUrl:e.langSmithUrl})}catch(e){if(n!==z.current)return;B({index:t,slice:e=>({...e,status:"generateError",thumbnailUrl:i,onRetry:()=>{Z({index:t,imageUrl:i,source:r})}})})}},G=()=>{void 0!==U&&x.forEach((e,t)=>{"pending"===e.status&&Z({index:t,imageUrl:e.thumbnailUrl,source:e.source})})},M=x.filter(e=>"generating"===e.status).length+x.filter(e=>"uploading"===e.status).length,T=x.filter(e=>"pending"===e.status).length,_=x.filter(e=>"success"===e.status).length,V=x.some(e=>"generating"===e.status||"success"===e.status),O=M+T,H=()=>{M>0||(g(),z.current=crypto.randomUUID(),setTimeout(()=>y([]),250))},W=async()=>{if(void 0!==U)try{I(!0);let e=await (0,c.y0)();L(e.libraries),A(),o({slices:x.flatMap(e=>"success"===e.status?e.model:[]),library:U}),H()}finally{I(!1)}},J=async()=>{var e;if(!(!t||!E||x.some(e=>"figma"===e.source)||x.some(e=>"uploading"===e.status||"generating"===e.status))){if("function"!=typeof(null===(e=navigator.clipboard)||void 0===e?void 0:e.read)){s.Am.error("Clipboard paste is not supported in this browser.");return}try{let e=await navigator.clipboard.read();if(0===e.length){s.Am.error("No data found in clipboard.");return}let t="pasted-image.png",a=null,i=!1;for(let t of e){let e=t.types.find(e=>e.startsWith("image/"));if(void 0!==e){a=await t.getType(e);break}}for(let r of e)if(r.types.includes("text/plain"))try{let e=await r.getType("text/plain"),n=await e.text(),l=j.safeParse(JSON.parse(n));if(l.success){i=!0;let e=l.data;if(t="".concat(e.name,".png"),!a){let t=await fetch(e.image);a=await t.blob()}}else console.warn("Clipboard data validation failed:",l.error)}catch(e){console.warn("Failed to parse JSON from clipboard:",e)}if(!a){i?s.Am.error("Could not extract Figma data from clipboard. Please try copying again using the Prismic Figma plugin."):s.Am.error("No Figma data found in clipboard. Make sure you've copied a design using the Prismic Figma plugin.");return}let r=x.length;if(r>=10){s.Am.error("You can only upload ".concat(10," images at a time."));return}let n=new File([a],t,{type:a.type});y(e=>[...e,{source:"figma",status:"uploading",image:n}]),R({index:r,image:n,source:"figma"}),s.Am.success("Pasted ".concat(t).concat(i?" from Figma":""))}catch(e){console.error("Failed to paste from clipboard:",e),s.Am.error("Failed to paste from clipboard. Please check browser permissions and try again.")}}};return(0,i.jsxs)(r.ae,{open:t,onOpenChange:e=>!e&&H(),children:[(0,i.jsx)(r.al,{title:"Generate with AI"}),(0,i.jsxs)(r.aj,{gap:0,children:[(0,i.jsx)(r.ak,{hidden:!0,children:"Upload images to generate slices with AI"}),N?(0,i.jsx)(r.D,{display:"flex",justifyContent:"center",alignItems:"center",height:"100%",children:(0,i.jsx)(r.bg,{color:"purple9"})}):(0,i.jsxs)(i.Fragment,{children:[0===x.length?(0,i.jsxs)(r.D,{padding:16,height:"100%",gap:16,display:"flex",flexDirection:"column",children:[E&&(0,i.jsxs)(r.D,{display:"flex",gap:16,alignItems:"center",backgroundColor:"grey2",padding:16,borderRadius:12,children:[(0,i.jsxs)(r.D,{display:"flex",gap:8,alignItems:"center",flexGrow:1,children:[(0,i.jsx)(r.D,{width:48,height:48,backgroundColor:"grey12",borderRadius:"100%",display:"flex",alignItems:"center",justifyContent:"center",children:(0,i.jsx)(p,{height:25})}),(0,i.jsxs)(r.D,{display:"flex",flexDirection:"column",flexGrow:1,children:[(0,i.jsx)(r.bL,{variant:"bold",children:"Want to work faster?"}),(0,i.jsx)(r.bL,{variant:"small",color:"grey11",children:"Copy frames from Figma with the Slice Machine plugin and paste them here."})]})]}),(0,i.jsx)(r.E,{endIcon:"arrowForward",color:"indigo",onClick:()=>window.open("https://www.figma.com/community/plugin/TODO","_blank"),sx:{marginRight:8},invisible:!0,children:"Install plugin"})]}),(0,i.jsx)(r.aF,{onFilesSelected:P,assetType:"image",maxFiles:10,overlay:(0,i.jsx)(v,{onFilesSelected:P,onPaste:()=>void J(),droppingFiles:!0}),children:(0,i.jsx)(v,{onFilesSelected:P,onPaste:()=>void J()})})]}):(0,i.jsxs)(i.Fragment,{children:[(0,i.jsxs)(r.D,{display:"flex",alignItems:"center",justifyContent:"space-between",padding:16,children:[(0,i.jsx)(r.bL,{variant:"h3",children:"Design"}),(0,i.jsx)(r.aG,{size:"medium",color:"grey",onFilesSelected:P,startIcon:"attachFile",disabled:V,children:"Add images"})]}),(0,i.jsx)(r.bn,{stableScrollbar:!1,children:(0,i.jsx)(r.D,{display:"grid",gridTemplateColumns:"1fr 1fr",gap:16,padding:16,children:x.map((e,t)=>(0,i.jsx)(b,{slice:e},"slice-".concat(t)))})})]}),(0,i.jsxs)(r.ah,{children:[(0,i.jsx)(r.ai,{onClick:()=>H(),size:"medium",disabled:M>0,sx:{marginRight:8},invisible:!0,children:"Close"}),0===_||M>0?(0,i.jsxs)(r.af,{color:"purple",startIcon:"autoFixHigh",onClick:()=>void G(),disabled:V||M>0||0===T,loading:M>0,size:"medium",children:["Generate"," ",O>0?"(".concat(O,") "):"",1===O?"Slice":"Slices"]}):(0,i.jsx)(r.af,{color:"purple",onClick:()=>void W(),loading:w,size:"medium",children:S(a,_)})]})]})]})]})}function v(e){let{droppingFiles:t=!1,onFilesSelected:a,onPaste:n}=e,l=F();return(0,i.jsx)(r.D,{justifyContent:"center",flexDirection:"column",height:"100%",backgroundColor:t?"purple2":"grey2",border:!0,borderStyle:"dashed",borderColor:t?"purple9":"grey6",borderRadius:12,flexGrow:1,children:(0,i.jsx)(r.s,{children:(0,i.jsxs)(r.D,{display:"flex",flexDirection:"column",gap:16,alignItems:"center",children:[(0,i.jsx)(r.x,{lineColor:"purple11",backgroundColor:"purple5",name:"cloudUpload",size:"large"}),(0,i.jsx)(r.D,{display:"flex",flexDirection:"column",gap:4,alignItems:"center",children:l?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(r.bL,{children:"Generate slices from your designs"}),(0,i.jsx)(r.bL,{variant:"small",color:"grey11",children:"Upload your design images or paste them directly from Figma."})]}):(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(r.bL,{children:"Upload your design images."}),(0,i.jsx)(r.bL,{variant:"small",color:"grey11",children:"Once uploaded, you can generate slices automatically using AI."})]})}),(0,i.jsx)(r.D,{display:"flex",alignItems:"center",gap:16,children:l?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(r.E,{size:"small",renderStartIcon:()=>(0,i.jsx)(p,{height:16}),color:"grey",onClick:n,children:"Paste from Figma"}),(0,i.jsx)(r.aG,{size:"small",onFilesSelected:a,color:"purple",invisible:!0,children:"Add images"})]}):(0,i.jsx)(r.aG,{startIcon:"attachFile",onFilesSelected:a,color:"grey",children:"Add images"})})]})})})}async function C(e){let{image:t}=e,a=[await h.managerClient.project.getResolvedRepositoryName(),"shared-slices","prismic-inferred-slices",crypto.randomUUID()].join("/");await h.managerClient.screenshots.initS3ACL();let{url:i}=await h.managerClient.screenshots.uploadScreenshot({keyPrefix:a,data:t});return i}let S=(e,t)=>{switch(e){case"custom_type":return"Add to type (".concat(t,")");case"page_type":return"Add to page (".concat(t,")");case"slices":return"Done"}};function F(){let e=(0,g.L)("llm-proxy-access");return(null==e?void 0:e.value)==="on"}},27213:function(e,t,a){a.d(t,{F:function(){return n}});var i=a(52322),r=a(11699);let n=e=>{let{menuType:t}=e;return{fromImage:{BackgroundIcon:(0,i.jsx)(r.B,{name:"autoFixHigh",size:"ActionList"===t?"small":"extraSmall",iconSize:"ActionList"===t?"medium":"small",color:"purple",variant:"solid",radius:6}),title:"Generate from image",description:"Build a slice based on your design image."},fromScratch:{BackgroundIcon:(0,i.jsx)(r.B,{name:"add",size:"ActionList"===t?"small":"extraSmall",iconSize:"ActionList"===t?"medium":"small",color:"white",variant:"solid",radius:6}),title:"Start from scratch",description:"Build a custom slice your way."},fromTemplate:{BackgroundIcon:(0,i.jsx)(r.B,{name:"contentCopy",size:"ActionList"===t?"small":"extraSmall",iconSize:"ActionList"===t?"medium":"small",color:"white",variant:"solid",radius:6}),title:"Use a template",description:"Choose from ready-made examples."},fromExisting:{BackgroundIcon:(0,i.jsx)(r.B,{name:"folder",size:"ActionList"===t?"small":"extraSmall",iconSize:"ActionList"===t?"medium":"small",color:"white",variant:"solid",radius:6}),title:"Reuse an existing slice",description:"Select from your created slices."}}}},6256:function(e,t,a){a.d(t,{c:function(){return b}});var i=a(52322),r=a(2784),n=a(36131),l=a(75289),s=a(94160),o=a(98250),c=a(88932),d=a(63908),u=a(358),m=a(80148);async function g(e){let{sliceName:t,libraryName:a,location:i,onSuccess:r}=e;try{let e=(0,d.fo)(t),{errors:n}=await m.managerClient.slices.createSlice({libraryID:a,model:e});if(n.length>0)throw n;s.Xe.track({event:"slice:created",id:(0,u.MP)(t),name:t,library:a,location:i,mode:"manual"}),await r(e)}catch(a){let e="An unexpected error happened while creating slice ".concat(t,".");console.error(e,a),c.Am.error(e)}}var p=a(68968),h=a(59532),f=a(54597),x=a(46999),y=a(63019);let b=e=>{let{onClose:t,onSuccess:a,localLibraries:c,location:d,remoteSlices:u}=e,{createSliceSuccess:m}=(0,f.Z)(),[b,j]=(0,r.useState)(!1),{syncChanges:w}=(0,p.g)(),{completeStep:v}=(0,o.k)(),C=async e=>{let t=e.sliceName,i=e.from;j(!0),await g({sliceName:t,libraryName:i,location:d,onSuccess:async e=>{m((await (0,s.y0)()).libraries),a(e,i),w(),v("createSlice")}})};return(0,i.jsx)(h.Z,{testId:"create-slice-modal",isOpen:!0,widthInPx:"530px",isLoading:b,formId:"create-new-slice",close:t,buttonLabel:"Create",onSubmit:e=>{C(e)},initialValues:{sliceName:"",from:c[0].name},validate:e=>(0,y.h)(e,c,u),content:{title:"Create a new slice"},children:e=>{let{touched:t,values:a,setFieldValue:r,errors:s}=e;return(0,i.jsxs)(l.xu,{children:[(0,i.jsx)(x.W,{name:"sliceName",label:"Slice name",placeholder:"Pascalised slice API ID (e.g. TextBlock)",error:t.sliceName?s.sliceName:void 0,testId:"slice-name-input"}),(0,i.jsx)(l.__,{htmlFor:"from",sx:{mb:2},children:"Target Library"}),(0,i.jsx)(n.ZP,{name:"from",options:c.map(e=>({value:e.name,label:e.name})),onChange:e=>e?void r("from",e.value):null,defaultValue:{value:a.from,label:a.from},styles:{option:e=>({...e,color:"#161618"})},theme:e=>({...e,colors:{...e.colors,primary:"#E9E8EA"}}),menuPortalTarget:document.body})]})}})}},63019:function(e,t,a){a.d(t,{h:function(){return o}});var i=a(96009),r=a.n(i),n=a(74600),l=a.n(n),s=a(7974);function o(e,t,a){let{sliceName:i}=e;return i?s.lS.includes(i.toLowerCase())?{sliceName:'Name "'.concat(i,'" is reserved for Slice Machine use.')}:s.xo.exec(i)?l()(r()(i)).replace(/\s/gm,"")!==i.trim()?{sliceName:"Value has to be PascalCased."}:i.match(/^\d/)?{sliceName:"Value cannot start with a number."}:[...t.flatMap(e=>e.components.map(e=>e.model.name)),...a.map(e=>e.name)].includes(i)?{sliceName:"Slice name is already taken."}:void 0:{sliceName:"No special characters allowed."}:{sliceName:"Cannot be empty"}}},21151:function(e,t,a){var i=a(52322),r=a(75289);t.Z=function(e){let{elems:t,renderElem:a,defineElementKey:n,gridTemplateMinPx:l="320px",gridGap:s="16px",sx:o}=e;return(0,i.jsx)(r.xu,{as:"section",sx:{display:"grid",gridTemplateColumns:"repeat(auto-fill, minmax(".concat(l,", 1fr))"),gridGap:s,pt:2,...o},children:t.map((e,t)=>e?(0,i.jsx)("span",{children:a(e,t)},"".concat(n(e),"-").concat(t+1)):null)})}}}]);
package/out/_next/static/chunks/882-48d61b2fabee28d8.js ADDED
@@ -0,0 +1 @@
1
+ (self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[882],{62434:function(e,t,n){"use strict";n.d(t,{Zb:function(){return c},T$:function(){return m},eW:function(){return _},ZB:function(){return u},Lm:function(){return h}});var o=n(52322),r=n(50002),i=n(11699),a=n(6277),l=n(2784),d=n(67968),s=n.n(d);let c=e=>{let{checked:t=!1,size:n="medium",variant:i="solid",interactive:d,disabled:c,onClick:u,href:m,component:_="a",replace:h,...C}=e,x={...C,className:(0,a.W)(s().root,s()["size-".concat(n)],s()[i],{[s().interactive]:e.interactive}),"data-state":!0===t?"checked":void 0,"data-disabled":!0===e.disabled?"":void 0};return!0===e.interactive&&void 0===e.href?(0,o.jsx)("div",{...x,onClick:t=>{if(!0===e.disabled||void 0===e.onClick)return;let n=t.target;(0,r.JY)(n)===t.currentTarget&&e.onClick(t)},tabIndex:!0===e.disabled?void 0:0}):!0===e.interactive?(0,l.createElement)(_,{...x,href:e.href,onClick:e=>{let t=e.target;(0,r.JY)(t)!==e.currentTarget&&e.preventDefault()},..."a"===_?{}:{replace:e.replace}}):(0,o.jsx)("div",{...x})},u=e=>{let{className:t,component:n="img",overlay:r,...i}=e;return(0,o.jsxs)("div",{className:s().media,children:[(0,l.createElement)(n,{...i,className:(0,a.W)(s()["mediaComponent-".concat(n)],t)}),r?(0,o.jsx)("div",{className:s().mediaOverlay,children:r}):void 0]})},m=e=>(0,o.jsx)("div",{...e,className:s().actions}),_=e=>{let{action:t,loading:n=!1,startIcon:r,subtitle:a,title:l,error:d=!1,...c}=e,u=d?"tomato11":"grey11";return(0,o.jsxs)("div",{...c,className:s().footer,children:[(r||n)&&(0,o.jsxs)("div",{className:s().startIconBox,children:[n&&(0,o.jsx)(i.bg,{color:"grey11"}),!n&&r&&(0,o.jsx)(i.aX,{name:r,size:"small",color:u})]}),(0,o.jsxs)("div",{className:s().footerTexts,children:[(0,o.jsx)(i.bL,{component:"span",noWrap:!0,variant:"bold",children:l}),(0,o.jsx)(i.bL,{color:u,component:"span",noWrap:!0,variant:"small",children:a})]}),t]})},h=e=>{let{children:t,...n}=e;return(0,o.jsx)("div",{...n,className:s().status,children:(0,o.jsx)(i.bL,{align:"center",color:"inherit",component:"span",noWrap:!0,variant:"smallBold",children:t})})}},99195:function(e,t,n){"use strict";n.d(t,{O:function(){return l}});var o=n(52322),r=n(11699),i=n(56448),a=n(93671);let l=e=>{let{badgeColor:t,badgeTitle:n,tooltipContent:l}=function(e){let t=d[e.modelType];switch(e.modelStatus){case i.GJ.New:return{badgeColor:"green",badgeTitle:"New",tooltipContent:"This ".concat(t," exists only locally. Upon sync, it will be pushed to your remote repository.")};case i.GJ.Modified:return{badgeColor:"amber",badgeTitle:"Modified",tooltipContent:"This ".concat(t," has been modified locally. Upon sync, changes will be pushed to your remote repository.")};case i.GJ.Synced:return{badgeColor:"purple",badgeTitle:"Synced",tooltipContent:"This ".concat(t," is in sync with the remote repository.")};case i.GJ.Deleted:return{badgeColor:"tomato",badgeTitle:"Deleted",tooltipContent:"This ".concat(t," has been deleted locally.")};case i.GJ.Unknown:if(!e.isOnline)return{badgeColor:"grey",badgeTitle:"Unknown",tooltipContent:"Data from the remote repository could not be fetched (no internet connection)."};if(e.authStatus===a.t.UNAUTHENTICATED)return{badgeColor:"grey",badgeTitle:"Unknown",tooltipContent:"Data from the remote repository could not be fetched (not connected to Prismic)."};default:return{badgeColor:"grey",badgeTitle:"Unknown",tooltipContent:"Data from the remote repository could not be fetched (unknown error)."}}}(e);return(0,o.jsx)(r.c3,{content:l,side:"bottom",children:(0,o.jsx)(r.m,{color:t,title:n})})},d={CustomType:"type",Slice:"slice"}},51507:function(e,t,n){"use strict";n.d(t,{b:function(){return C}});var o=n(52322),r=n(11699),i=n(39097),a=n.n(i),l=n(62434),d=n(63908),s=n(99195),c=n(27763);let u=e=>(0,o.jsx)("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:(0,o.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M4 5.5C4 4.67157 4.67157 4 5.5 4H18.5C19.3284 4 20 4.67157 20 5.5V12.4413C20 12.4512 19.9997 12.461 19.9991 12.4707C20.0072 12.6083 19.9586 12.7485 19.8536 12.8536C19.6583 13.0488 19.3417 13.0488 19.1464 12.8536L16.3536 10.0607C16.1583 9.8654 15.8417 9.8654 15.6464 10.0607L11.8536 13.8536C11.6583 14.0488 11.3417 14.0488 11.1464 13.8536L9.35355 12.0607C9.15829 11.8654 8.84171 11.8654 8.64645 12.0607L5 15.7071V18.5C5 18.7761 5.22386 19 5.5 19H12.5C12.7761 19 13 19.2239 13 19.5C13 19.7761 12.7761 20 12.5 20H5.5C4.67157 20 4 19.3284 4 18.5V15.5003V15.4997V5.5ZM11.5 12.7929L14.9393 9.35355C15.5251 8.76777 16.4749 8.76777 17.0607 9.35355L19 11.2929V5.5C19 5.22386 18.7761 5 18.5 5H5.5C5.22386 5 5 5.22386 5 5.5V14.2929L7.93934 11.3536C8.52513 10.7678 9.47487 10.7678 10.0607 11.3536L11.5 12.7929ZM16.5 13C16.7761 13 17 13.2239 17 13.5V16H19.5C19.7761 16 20 16.2239 20 16.5C20 16.7761 19.7761 17 19.5 17H17V19.5C17 19.7761 16.7761 20 16.5 20C16.2239 20 16 19.7761 16 19.5V17H13.5C13.2239 17 13 16.7761 13 16.5C13 16.2239 13.2239 16 13.5 16H16V13.5C16 13.2239 16.2239 13 16.5 13Z",fill:"currentColor"})}),m=e=>({hash:e.hash}),_=e=>e?Object.entries(e).reduce((e,t)=>{let[n,o]=t;return o.hash?{...e,[n]:{...o,...m(o)}}:e},{}):{},h={build:e=>({...e,screenshots:_(e.screenshots)}),variation(e,t){if(e.model.variations.length)return t?e.model.variations.find(e=>e.id===t):e.model.variations[0]}},C=e=>{let t;let{action:n,isDeleted:i=!1,onUpdateScreenshot:m,selected:_=!1,slice:C,variant:v,variationId:f}=e,b=h.variation(C,f);if(!b)return null;let g=(0,d.d7)(C,b),j=!i&&!!m,y="outlined"===v,w=void 0!==f;return t="selection"===e.mode?{disabled:i,interactive:!0,onClick:()=>{e.onSelectedChange(!_)}}:i?{interactive:!1}:{component:a(),href:c.Y.getBuilderPagePathname({libraryName:C.href,sliceName:C.model.name,variationId:b.id}),interactive:!0,replace:e.replace},(0,o.jsxs)(l.Zb,{"aria-label":"".concat(C.model.name," ").concat(b.name," slice card"),checked:_,"data-testid":"shared-slice-card",...t,..."outlined"===v?{size:"small",variant:"outlined"}:{},children:[void 0!==g?(0,o.jsx)(l.ZB,{alt:"Preview image",overlay:j&&!y?(0,o.jsx)(r.D,{alignItems:"center",justifyContent:"center",children:(0,o.jsx)(x,{onClick:m})}):void 0,src:g}):(0,o.jsx)(l.ZB,{component:"div",children:(0,o.jsxs)(r.D,{alignItems:"center",flexDirection:"column",gap:8,justifyContent:"center",children:[(0,o.jsx)(r.bL,{color:"grey11",component:"span",children:"No screenshot available"}),j&&!y?(0,o.jsx)(x,{onClick:m}):void 0]})}),(0,o.jsx)(l.eW,{action:"checkbox"===n.type&&"selection"===e.mode?(0,o.jsx)("div",{onClick:e=>e.stopPropagation(),children:(0,o.jsx)(r.U,{checked:_,disabled:i,onCheckedChange:e.onSelectedChange})}):"menu"===n.type?(0,o.jsxs)(r.ar,{modal:!0,children:[(0,o.jsx)(r.av,{disabled:i,children:(0,o.jsx)(r.aZ,{hiddenLabel:"Slice actions",icon:"moreVert"})}),(0,o.jsxs)(r.as,{align:"end","data-testid":"slice-action-icon-dropdown",children:[j&&y?(0,o.jsx)(r.at,{onSelect:m,startIcon:(0,o.jsx)(u,{}),children:"Update screenshot"}):void 0,(0,o.jsx)(r.at,{onSelect:n.onRename,startIcon:(0,o.jsx)(r.aX,{name:"edit"}),children:"Rename"}),!0===n.removeDisabled&&w?(0,o.jsx)(r.c3,{content:"The slice needs to have at least one variation.",side:"bottom",stableMount:!0,children:(0,o.jsx)(p,{disabled:!0,onSelect:n.onRemove})}):(0,o.jsx)(p,{disabled:!0===n.removeDisabled,onSelect:n.onRemove})]})]}):"remove"===n.type?(0,o.jsx)(r.aZ,{icon:"close",onClick:()=>!i&&n.onRemove(),hiddenLabel:"Remove slice"}):"status"===n.type?(0,o.jsx)(s.O,{authStatus:n.authStatus,isOnline:n.isOnline,modelStatus:n.modelStatus,modelType:"Slice"}):void 0,subtitle:(0,o.jsx)(o.Fragment,{children:w?b.id:"".concat(C.model.variations.length," variation").concat(C.model.variations.length>1?"s":"")}),title:w?b.name:C.model.name}),j&&!w&&(0,d.cx)(C)>0?(0,o.jsx)(l.Lm,{children:"Missing screenshot"}):void 0]})},x=e=>(0,o.jsx)(r.E,{onClick:e.onClick,renderStartIcon:()=>(0,o.jsx)(u,{color:r.t.color.grey11}),color:"grey",children:"Update screenshot"}),p=e=>(0,o.jsx)(r.at,{...e,color:"tomato",startIcon:(0,o.jsx)(r.aX,{name:"delete"}),children:"Delete"})},27763:function(e,t,n){"use strict";n.d(t,{Y:function(){return o}});let o={getBuilderPagePathname:e=>"/slices/".concat(e.libraryName.replaceAll("/","--"),"/").concat(e.sliceName,"/").concat(e.variationId)}},56141:function(e,t,n){"use strict";n.d(t,{S:function(){return r}});var o=n(52322);let r=e=>(0,o.jsxs)("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:[(0,o.jsxs)("g",{clipPath:"url(#clip0_5065_192538)",children:[(0,o.jsx)("path",{d:"M9.66862 19.9993C11.1406 19.9993 12.3353 18.8047 12.3353 17.3327V14.666H9.66862C8.19662 14.666 7.00195 15.8607 7.00195 17.3327C7.00195 18.8047 8.19662 19.9993 9.66862 19.9993Z",fill:"#0ACF83"}),(0,o.jsx)("path",{d:"M7.00195 12.0007C7.00195 10.5287 8.19662 9.33398 9.66862 9.33398H12.3353V14.6673H9.66862C8.19662 14.6673 7.00195 13.4727 7.00195 12.0007Z",fill:"#A259FF"}),(0,o.jsx)("path",{d:"M7.00195 6.66667C7.00195 5.19467 8.19662 4 9.66862 4H12.3353V9.33333H9.66862C8.19662 9.33333 7.00195 8.13867 7.00195 6.66667Z",fill:"#F24E1E"}),(0,o.jsx)("path",{d:"M12.334 4H15.0007C16.4727 4 17.6673 5.19467 17.6673 6.66667C17.6673 8.13867 16.4727 9.33333 15.0007 9.33333H12.334V4Z",fill:"#FF7262"}),(0,o.jsx)("path",{d:"M17.6673 12.0007C17.6673 13.4727 16.4727 14.6673 15.0007 14.6673C13.5287 14.6673 12.334 13.4727 12.334 12.0007C12.334 10.5287 13.5287 9.33398 15.0007 9.33398C16.4727 9.33398 17.6673 10.5287 17.6673 12.0007Z",fill:"#1ABCFE"})]}),(0,o.jsx)("defs",{children:(0,o.jsx)("clipPath",{id:"clip0_5065_192538",children:(0,o.jsx)("rect",{width:"10.6688",height:"16",fill:"white",transform:"translate(7 4)"})})})]})},30527:function(e,t,n){"use strict";n.d(t,{Z:function(){return s},W:function(){return d}});var o=n(52322),r=n(2784),i=n(75289);let a=e=>{let{bg:t,background:n,sx:r,withRadius:a,radius:l,children:d}=e;return(0,o.jsx)(i.xu,{sx:{p:4,bg:t||n,...a?{borderBottomLeftRadius:l,borderBottomRightRadius:l}:null,...r},children:d})},l=(0,r.createContext)("6px"),d=()=>(0,r.useContext)(l),s=e=>{let{Header:t=null,SubHeader:n=null,Body:r=null,Footer:d=null,borderFooter:s=!1,radius:c="6px",bodySx:u={},footerSx:m={},sx:_=null,bg:h,background:C,children:x,...p}=e;return(0,o.jsx)(l.Provider,{value:c,children:(0,o.jsxs)(i.Zb,{sx:{border:e=>{var t;return"1px solid ".concat(String(null===(t=e.colors)||void 0===t?void 0:t.borders))},borderRadius:c,..._},...p,children:[t||null,n||null,(0,o.jsxs)(a,{bg:h,background:C,sx:u,withRadius:!d,children:[r?(0,o.jsx)(r,{}):null,x||null]}),d?(0,o.jsx)(a,{bg:h,background:C,sx:{...s?{borderTop:e=>{let{colors:t}=e;return"1px solid ".concat(String(null==t?void 0:t.borders))}}:null,...m},radius:c,withRadius:!0,children:"object"==typeof d?d:(0,o.jsx)(d,{})}):null]})})}},7974:function(e,t,n){"use strict";n.d(t,{Sn:function(){return l},lS:function(){return o},nG:function(){return r},pq:function(){return d},rd:function(){return a},xo:function(){return i}});let o=["components","update","insert"],r=["png","jpg","jpeg"],i=/^[A-Za-z0-9]+(?:_[A-Za-z0-9]+)*$/,a="placeholders/What_are_Slices_mrvome",l="SM_HELP_VIDEOS/mock_data",d="slice-machine-simulator"},67968:function(e){e.exports={flex:"Card_flex__opby1",grid:"Card_grid__VAvIS",column:"Card_column__W4ACG Card_flex__opby1",root:"Card_root__YVuvU Card_column__W4ACG Card_flex__opby1","size-small":"Card_size-small__aIlxd","size-medium":"Card_size-medium__xegz0",solid:"Card_solid__GNGar",outlined:"Card_outlined__W_dxI",interactive:"Card_interactive__rXw5L",media:"Card_media__l0kHL Card_column__W4ACG Card_flex__opby1","mediaComponent-div":"Card_mediaComponent-div__Y2_PZ Card_grid__VAvIS","mediaComponent-img":"Card_mediaComponent-img__ezOTu",mediaOverlay:"Card_mediaOverlay__Aa__Q Card_grid__VAvIS",nonMedia:"Card_nonMedia__Fv3Mz Card_flex__opby1",actions:"Card_actions__XdhOt Card_nonMedia__Fv3Mz Card_flex__opby1",footer:"Card_footer__U0HS1 Card_nonMedia__Fv3Mz Card_flex__opby1",footerTexts:"Card_footerTexts__rTXup Card_column__W4ACG Card_flex__opby1",status:"Card_status__PNN2a Card_column__W4ACG Card_flex__opby1",startIconBox:"Card_startIconBox__1_L4u"}}}]);