slice-machine-ui 2.19.2-beta.3 → 2.19.2-beta.5
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.
- package/out/404.html +1 -1
- package/out/_next/static/{uC4K1_hgf7dK4FL02cbUH → XQ4G4BQLvAzh_yCVuiGu6}/_buildManifest.js +1 -1
- package/out/_next/static/chunks/633-6ef64d197d323bf7.js +1 -0
- package/out/_next/static/chunks/pages/{_app-9cc2da8ff60c3087.js → _app-0f3a7a06eafa1943.js} +1 -1
- package/out/changelog.html +1 -1
- package/out/changes.html +1 -1
- package/out/custom-types/[customTypeId].html +1 -1
- package/out/custom-types.html +1 -1
- package/out/index.html +1 -1
- package/out/labs.html +1 -1
- package/out/page-types/[pageTypeId].html +1 -1
- package/out/slices/[lib]/[sliceName]/[variation]/simulator.html +1 -1
- package/out/slices/[lib]/[sliceName]/[variation].html +1 -1
- package/out/slices.html +1 -1
- package/package.json +3 -3
- package/src/features/customTypes/customTypesBuilder/CreateSliceFromImageModal/CreateSliceFromImageModal.tsx +141 -45
- package/src/features/customTypes/customTypesBuilder/CreateSliceFromImageModal/SliceCard.tsx +10 -3
- package/out/_next/static/chunks/633-275b9968b5aaa920.js +0 -1
- /package/out/_next/static/{uC4K1_hgf7dK4FL02cbUH → XQ4G4BQLvAzh_yCVuiGu6}/_ssgManifest.js +0 -0
package/out/changelog.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-
|
|
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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/59b4e022-ef680789f7cc9b11.js" defer=""></script><script src="/_next/static/chunks/183-4ea255b867ff171b.js" defer=""></script><script src="/_next/static/chunks/870-a72b74312773efea.js" defer=""></script><script src="/_next/static/chunks/pages/changelog-8514e0696e90a1b2.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/changelog","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
package/out/changes.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=""/><link rel="preload" href="/_next/static/css/d98ebc475f8423a3.css" as="style"/><link rel="stylesheet" href="/_next/static/css/d98ebc475f8423a3.css" data-n-p=""/><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-
|
|
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=""/><link rel="preload" href="/_next/static/css/d98ebc475f8423a3.css" as="style"/><link rel="stylesheet" href="/_next/static/css/d98ebc475f8423a3.css" data-n-p=""/><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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/59b4e022-ef680789f7cc9b11.js" defer=""></script><script src="/_next/static/chunks/c8eae200-966ce352f7b5d2b9.js" defer=""></script><script src="/_next/static/chunks/8eec4907-b712959d9f984b68.js" defer=""></script><script src="/_next/static/chunks/66-d9d3bcb5d041cb6d.js" defer=""></script><script src="/_next/static/chunks/125-00b909bdbab2ca15.js" defer=""></script><script src="/_next/static/chunks/882-48d61b2fabee28d8.js" defer=""></script><script src="/_next/static/chunks/593-7ffd1197c3405ef8.js" defer=""></script><script src="/_next/static/chunks/pages/changes-e66094f57453cf9c.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/changes","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
|
@@ -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=""/><link rel="preload" href="/_next/static/css/56f2a6684a524374.css" as="style"/><link rel="stylesheet" href="/_next/static/css/56f2a6684a524374.css" data-n-p=""/><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-
|
|
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=""/><link rel="preload" href="/_next/static/css/56f2a6684a524374.css" as="style"/><link rel="stylesheet" href="/_next/static/css/56f2a6684a524374.css" data-n-p=""/><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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/59b4e022-ef680789f7cc9b11.js" defer=""></script><script src="/_next/static/chunks/f36c6662-1f3a854183168b10.js" defer=""></script><script src="/_next/static/chunks/4c744e84-480e426e4b1cfef3.js" defer=""></script><script src="/_next/static/chunks/065a3ddb-9a38ca0d60f0bf2f.js" defer=""></script><script src="/_next/static/chunks/1cc2734a-09fb3b997ad1eb70.js" defer=""></script><script src="/_next/static/chunks/397-e6c340070a3bcb41.js" defer=""></script><script src="/_next/static/chunks/66-d9d3bcb5d041cb6d.js" defer=""></script><script src="/_next/static/chunks/183-4ea255b867ff171b.js" defer=""></script><script src="/_next/static/chunks/344-b64f09e670634ed1.js" defer=""></script><script src="/_next/static/chunks/256-07f768a2b19b0a0e.js" defer=""></script><script src="/_next/static/chunks/422-c9192a1dbdd2ae0e.js" defer=""></script><script src="/_next/static/chunks/882-48d61b2fabee28d8.js" defer=""></script><script src="/_next/static/chunks/647-aa094286bc248d52.js" defer=""></script><script src="/_next/static/chunks/630-2bf927bca082a191.js" defer=""></script><script src="/_next/static/chunks/633-6ef64d197d323bf7.js" defer=""></script><script src="/_next/static/chunks/489-32281540712d98bb.js" defer=""></script><script src="/_next/static/chunks/pages/custom-types/%5BcustomTypeId%5D-6d613b67e6967ae5.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/custom-types/[customTypeId]","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
package/out/custom-types.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=""/><link rel="preload" href="/_next/static/css/4e475d945cf8a890.css" as="style"/><link rel="stylesheet" href="/_next/static/css/4e475d945cf8a890.css" data-n-p=""/><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-
|
|
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=""/><link rel="preload" href="/_next/static/css/4e475d945cf8a890.css" as="style"/><link rel="stylesheet" href="/_next/static/css/4e475d945cf8a890.css" data-n-p=""/><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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/397-e6c340070a3bcb41.js" defer=""></script><script src="/_next/static/chunks/647-aa094286bc248d52.js" defer=""></script><script src="/_next/static/chunks/248-84a5987f0499b074.js" defer=""></script><script src="/_next/static/chunks/pages/custom-types-5acd56959b60346f.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/custom-types","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
package/out/index.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=""/><link rel="preload" href="/_next/static/css/4e475d945cf8a890.css" as="style"/><link rel="stylesheet" href="/_next/static/css/4e475d945cf8a890.css" data-n-p=""/><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-
|
|
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=""/><link rel="preload" href="/_next/static/css/4e475d945cf8a890.css" as="style"/><link rel="stylesheet" href="/_next/static/css/4e475d945cf8a890.css" data-n-p=""/><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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/397-e6c340070a3bcb41.js" defer=""></script><script src="/_next/static/chunks/647-aa094286bc248d52.js" defer=""></script><script src="/_next/static/chunks/248-84a5987f0499b074.js" defer=""></script><script src="/_next/static/chunks/pages/index-0d8cb369de720a35.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
package/out/labs.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-
|
|
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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/pages/labs-56fd818a63553497.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/labs","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
|
@@ -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=""/><link rel="preload" href="/_next/static/css/56f2a6684a524374.css" as="style"/><link rel="stylesheet" href="/_next/static/css/56f2a6684a524374.css" data-n-p=""/><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-
|
|
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=""/><link rel="preload" href="/_next/static/css/56f2a6684a524374.css" as="style"/><link rel="stylesheet" href="/_next/static/css/56f2a6684a524374.css" data-n-p=""/><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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/59b4e022-ef680789f7cc9b11.js" defer=""></script><script src="/_next/static/chunks/f36c6662-1f3a854183168b10.js" defer=""></script><script src="/_next/static/chunks/4c744e84-480e426e4b1cfef3.js" defer=""></script><script src="/_next/static/chunks/065a3ddb-9a38ca0d60f0bf2f.js" defer=""></script><script src="/_next/static/chunks/1cc2734a-09fb3b997ad1eb70.js" defer=""></script><script src="/_next/static/chunks/397-e6c340070a3bcb41.js" defer=""></script><script src="/_next/static/chunks/66-d9d3bcb5d041cb6d.js" defer=""></script><script src="/_next/static/chunks/183-4ea255b867ff171b.js" defer=""></script><script src="/_next/static/chunks/344-b64f09e670634ed1.js" defer=""></script><script src="/_next/static/chunks/256-07f768a2b19b0a0e.js" defer=""></script><script src="/_next/static/chunks/422-c9192a1dbdd2ae0e.js" defer=""></script><script src="/_next/static/chunks/882-48d61b2fabee28d8.js" defer=""></script><script src="/_next/static/chunks/647-aa094286bc248d52.js" defer=""></script><script src="/_next/static/chunks/630-2bf927bca082a191.js" defer=""></script><script src="/_next/static/chunks/633-6ef64d197d323bf7.js" defer=""></script><script src="/_next/static/chunks/489-32281540712d98bb.js" defer=""></script><script src="/_next/static/chunks/pages/page-types/%5BpageTypeId%5D-40207b66190e3fcd.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/page-types/[pageTypeId]","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
|
@@ -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-
|
|
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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/c8eae200-966ce352f7b5d2b9.js" defer=""></script><script src="/_next/static/chunks/72585f70-28b4d7d5384b3703.js" defer=""></script><script src="/_next/static/chunks/429-aab52070cad2884b.js" defer=""></script><script src="/_next/static/chunks/pages/slices/%5Blib%5D/%5BsliceName%5D/%5Bvariation%5D/simulator-faeb6d2f77d97096.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/slices/[lib]/[sliceName]/[variation]/simulator","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
|
@@ -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=""/><link rel="preload" href="/_next/static/css/e8e03c0d4003d1eb.css" as="style"/><link rel="stylesheet" href="/_next/static/css/e8e03c0d4003d1eb.css" data-n-p=""/><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-
|
|
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=""/><link rel="preload" href="/_next/static/css/e8e03c0d4003d1eb.css" as="style"/><link rel="stylesheet" href="/_next/static/css/e8e03c0d4003d1eb.css" data-n-p=""/><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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/59b4e022-ef680789f7cc9b11.js" defer=""></script><script src="/_next/static/chunks/c8eae200-966ce352f7b5d2b9.js" defer=""></script><script src="/_next/static/chunks/f36c6662-1f3a854183168b10.js" defer=""></script><script src="/_next/static/chunks/4c744e84-480e426e4b1cfef3.js" defer=""></script><script src="/_next/static/chunks/065a3ddb-9a38ca0d60f0bf2f.js" defer=""></script><script src="/_next/static/chunks/1cc2734a-09fb3b997ad1eb70.js" defer=""></script><script src="/_next/static/chunks/52d4c156-89c6ec6efca0a0bb.js" defer=""></script><script src="/_next/static/chunks/397-e6c340070a3bcb41.js" defer=""></script><script src="/_next/static/chunks/66-d9d3bcb5d041cb6d.js" defer=""></script><script src="/_next/static/chunks/183-4ea255b867ff171b.js" defer=""></script><script src="/_next/static/chunks/344-b64f09e670634ed1.js" defer=""></script><script src="/_next/static/chunks/256-07f768a2b19b0a0e.js" defer=""></script><script src="/_next/static/chunks/444-d39213143f782fec.js" defer=""></script><script src="/_next/static/chunks/484-3e011e79c41f0342.js" defer=""></script><script src="/_next/static/chunks/882-48d61b2fabee28d8.js" defer=""></script><script src="/_next/static/chunks/630-2bf927bca082a191.js" defer=""></script><script src="/_next/static/chunks/593-7ffd1197c3405ef8.js" defer=""></script><script src="/_next/static/chunks/pages/slices/%5Blib%5D/%5BsliceName%5D/%5Bvariation%5D-22ffa2561ac66557.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/slices/[lib]/[sliceName]/[variation]","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
package/out/slices.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=""/><link rel="preload" href="/_next/static/css/efa5152b7c0f35c0.css" as="style"/><link rel="stylesheet" href="/_next/static/css/efa5152b7c0f35c0.css" data-n-p=""/><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-
|
|
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=""/><link rel="preload" href="/_next/static/css/efa5152b7c0f35c0.css" as="style"/><link rel="stylesheet" href="/_next/static/css/efa5152b7c0f35c0.css" data-n-p=""/><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-0f3a7a06eafa1943.js" defer=""></script><script src="/_next/static/chunks/59b4e022-ef680789f7cc9b11.js" defer=""></script><script src="/_next/static/chunks/c8eae200-966ce352f7b5d2b9.js" defer=""></script><script src="/_next/static/chunks/52d4c156-89c6ec6efca0a0bb.js" defer=""></script><script src="/_next/static/chunks/397-e6c340070a3bcb41.js" defer=""></script><script src="/_next/static/chunks/66-d9d3bcb5d041cb6d.js" defer=""></script><script src="/_next/static/chunks/344-b64f09e670634ed1.js" defer=""></script><script src="/_next/static/chunks/444-d39213143f782fec.js" defer=""></script><script src="/_next/static/chunks/882-48d61b2fabee28d8.js" defer=""></script><script src="/_next/static/chunks/633-6ef64d197d323bf7.js" defer=""></script><script src="/_next/static/chunks/593-7ffd1197c3405ef8.js" defer=""></script><script src="/_next/static/chunks/pages/slices-a9b4d6d022cfcd88.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_buildManifest.js" defer=""></script><script src="/_next/static/XQ4G4BQLvAzh_yCVuiGu6/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/slices","query":{},"buildId":"XQ4G4BQLvAzh_yCVuiGu6","runtimeConfig":{"sentryEnvironment":"beta"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "slice-machine-ui",
|
|
3
|
-
"version": "2.19.2-beta.
|
|
3
|
+
"version": "2.19.2-beta.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "A visual builder for your Slice Models with all the tools you need to generate data models and mock CMS content locally.",
|
|
6
6
|
"repository": {
|
|
@@ -35,8 +35,8 @@
|
|
|
35
35
|
"start-slicemachine": "./bin/start-slicemachine.cjs"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@slicemachine/manager": "0.25.7-beta.
|
|
39
|
-
"start-slicemachine": "0.12.65-beta.
|
|
38
|
+
"@slicemachine/manager": "0.25.7-beta.5",
|
|
39
|
+
"start-slicemachine": "0.12.65-beta.5"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"@emotion/react": "11.11.1",
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { useStableCallback } from "@prismicio/editor-support/React";
|
|
1
2
|
import {
|
|
2
3
|
BlankSlate,
|
|
3
4
|
BlankSlateIcon,
|
|
@@ -17,6 +18,7 @@ import {
|
|
|
17
18
|
Text,
|
|
18
19
|
} from "@prismicio/editor-ui";
|
|
19
20
|
import { SharedSlice } from "@prismicio/types-internal/lib/customtypes";
|
|
21
|
+
import { useRouter } from "next/router";
|
|
20
22
|
import { useEffect, useRef, useState } from "react";
|
|
21
23
|
import { useHotkeys } from "react-hotkeys-hook";
|
|
22
24
|
import { toast } from "react-toastify";
|
|
@@ -52,8 +54,11 @@ export function CreateSliceFromImageModal(
|
|
|
52
54
|
props: CreateSliceFromImageModalProps,
|
|
53
55
|
) {
|
|
54
56
|
const { open, location, onSuccess, onClose } = props;
|
|
57
|
+
const router = useRouter();
|
|
58
|
+
|
|
55
59
|
const [slices, setSlices] = useState<Slice[]>([]);
|
|
56
60
|
const [isSubmitting, setIsSubmitting] = useState(false);
|
|
61
|
+
const [showCancelConfirmation, setShowCancelConfirmation] = useState(false);
|
|
57
62
|
|
|
58
63
|
const { syncChanges } = useAutoSync();
|
|
59
64
|
const { createSliceSuccess } = useSliceMachineActions();
|
|
@@ -61,6 +66,9 @@ export function CreateSliceFromImageModal(
|
|
|
61
66
|
const existingSlices = useExistingSlices({ open });
|
|
62
67
|
const isFigmaEnabled = useIsFigmaEnabled();
|
|
63
68
|
const { libraryID, isLoading: isLoadingLibraryID } = useLibraryID();
|
|
69
|
+
const stableCancelGeneratingRequests = useStableCallback(
|
|
70
|
+
cancelGeneratingRequests,
|
|
71
|
+
);
|
|
64
72
|
|
|
65
73
|
/**
|
|
66
74
|
* Keeps track of the current instance id.
|
|
@@ -72,11 +80,29 @@ export function CreateSliceFromImageModal(
|
|
|
72
80
|
["meta+v", "ctrl+v"],
|
|
73
81
|
(event) => {
|
|
74
82
|
event.preventDefault();
|
|
75
|
-
void
|
|
83
|
+
void onPaste();
|
|
76
84
|
},
|
|
77
85
|
{ enabled: open && isFigmaEnabled },
|
|
78
86
|
);
|
|
79
87
|
|
|
88
|
+
useEffect(() => {
|
|
89
|
+
if (!slices.some((slice) => slice.status === "generating")) return;
|
|
90
|
+
|
|
91
|
+
const onBeforeUnload = (event: BeforeUnloadEvent) => {
|
|
92
|
+
stableCancelGeneratingRequests();
|
|
93
|
+
const message = "Your current generating slices will be cancelled.";
|
|
94
|
+
event.returnValue = message;
|
|
95
|
+
return message;
|
|
96
|
+
};
|
|
97
|
+
|
|
98
|
+
router.events.on("routeChangeStart", stableCancelGeneratingRequests);
|
|
99
|
+
window.addEventListener("beforeunload", onBeforeUnload);
|
|
100
|
+
return () => {
|
|
101
|
+
router.events.off("routeChangeStart", stableCancelGeneratingRequests);
|
|
102
|
+
window.removeEventListener("beforeunload", onBeforeUnload);
|
|
103
|
+
};
|
|
104
|
+
}, [slices, router.events, stableCancelGeneratingRequests]);
|
|
105
|
+
|
|
80
106
|
const setSlice = (args: {
|
|
81
107
|
index: number;
|
|
82
108
|
slice: (prevSlice: Slice) => Slice;
|
|
@@ -166,12 +192,15 @@ export function CreateSliceFromImageModal(
|
|
|
166
192
|
const { index, imageUrl, source } = args;
|
|
167
193
|
let currentId = id.current;
|
|
168
194
|
|
|
195
|
+
const requestId = crypto.randomUUID();
|
|
196
|
+
|
|
169
197
|
setSlice({
|
|
170
198
|
index,
|
|
171
199
|
slice: (prevSlice) => ({
|
|
172
200
|
...prevSlice,
|
|
173
201
|
status: "generating",
|
|
174
202
|
thumbnailUrl: imageUrl,
|
|
203
|
+
requestId,
|
|
175
204
|
}),
|
|
176
205
|
});
|
|
177
206
|
|
|
@@ -180,6 +209,7 @@ export function CreateSliceFromImageModal(
|
|
|
180
209
|
source,
|
|
181
210
|
libraryID,
|
|
182
211
|
imageUrl,
|
|
212
|
+
requestId,
|
|
183
213
|
});
|
|
184
214
|
|
|
185
215
|
if (currentId !== id.current) return;
|
|
@@ -251,7 +281,10 @@ export function CreateSliceFromImageModal(
|
|
|
251
281
|
index,
|
|
252
282
|
slice: (prevSlice) => ({
|
|
253
283
|
...prevSlice,
|
|
254
|
-
status:
|
|
284
|
+
status:
|
|
285
|
+
error instanceof Error && error.name === "AbortError"
|
|
286
|
+
? "cancelled"
|
|
287
|
+
: "generateError",
|
|
255
288
|
thumbnailUrl: imageUrl,
|
|
256
289
|
onRetry: () => {
|
|
257
290
|
void inferSlice({ index, imageUrl, source });
|
|
@@ -275,32 +308,39 @@ export function CreateSliceFromImageModal(
|
|
|
275
308
|
});
|
|
276
309
|
};
|
|
277
310
|
|
|
278
|
-
const
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
}).length;
|
|
311
|
+
const totals = slices.reduce(
|
|
312
|
+
(result, slice) => {
|
|
313
|
+
if (slice.status === "generating") {
|
|
314
|
+
result.generating++;
|
|
315
|
+
} else if (slice.status === "uploading") {
|
|
316
|
+
result.uploading++;
|
|
317
|
+
} else if (slice.status === "pending") {
|
|
318
|
+
result.pending++;
|
|
319
|
+
} else if (slice.status === "success") {
|
|
320
|
+
result.completed++;
|
|
321
|
+
}
|
|
322
|
+
result.loading = result.generating + result.uploading;
|
|
291
323
|
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
324
|
+
/** Total count for the generate button.
|
|
325
|
+
* Avoids resetting to zero when switching status for better UX. */
|
|
326
|
+
result.generate = result.loading + result.pending;
|
|
295
327
|
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
328
|
+
return result;
|
|
329
|
+
},
|
|
330
|
+
{
|
|
331
|
+
generating: 0,
|
|
332
|
+
uploading: 0,
|
|
333
|
+
pending: 0,
|
|
334
|
+
completed: 0,
|
|
335
|
+
loading: 0,
|
|
336
|
+
generate: 0,
|
|
337
|
+
},
|
|
338
|
+
);
|
|
299
339
|
|
|
300
|
-
const
|
|
340
|
+
const hasTriggeredGeneration = totals.generating > 0 || totals.completed > 0;
|
|
301
341
|
|
|
302
342
|
const closeModal = () => {
|
|
303
|
-
if (
|
|
343
|
+
if (totals.loading > 0) return;
|
|
304
344
|
onClose();
|
|
305
345
|
id.current = crypto.randomUUID();
|
|
306
346
|
setTimeout(() => setSlices([]), 250); // wait for the modal fade animation
|
|
@@ -329,7 +369,7 @@ export function CreateSliceFromImageModal(
|
|
|
329
369
|
}
|
|
330
370
|
};
|
|
331
371
|
|
|
332
|
-
const
|
|
372
|
+
const onPaste = async () => {
|
|
333
373
|
if (
|
|
334
374
|
!open ||
|
|
335
375
|
!isFigmaEnabled ||
|
|
@@ -451,6 +491,22 @@ export function CreateSliceFromImageModal(
|
|
|
451
491
|
}
|
|
452
492
|
};
|
|
453
493
|
|
|
494
|
+
function cancelGeneratingRequests() {
|
|
495
|
+
const cancelableIds = slices.flatMap((slice) => {
|
|
496
|
+
return slice.status === "generating" ? [slice.requestId] : [];
|
|
497
|
+
});
|
|
498
|
+
if (cancelableIds.length === 0) return;
|
|
499
|
+
|
|
500
|
+
cancelableIds.forEach((requestId) => {
|
|
501
|
+
void managerClient.customTypes.cancelInferSlice({ requestId });
|
|
502
|
+
});
|
|
503
|
+
}
|
|
504
|
+
|
|
505
|
+
const onCancelConfirm = () => {
|
|
506
|
+
setShowCancelConfirmation(false);
|
|
507
|
+
cancelGeneratingRequests();
|
|
508
|
+
};
|
|
509
|
+
|
|
454
510
|
return (
|
|
455
511
|
<Dialog open={open} onOpenChange={(open) => !open && closeModal()}>
|
|
456
512
|
<DialogHeader title="Generate with AI" />
|
|
@@ -507,7 +563,7 @@ export function CreateSliceFromImageModal(
|
|
|
507
563
|
color="indigo"
|
|
508
564
|
onClick={() =>
|
|
509
565
|
window.open(
|
|
510
|
-
"https://www.figma.com/community/plugin/
|
|
566
|
+
"https://www.figma.com/community/plugin/1567955296461153730/figma-to-slice",
|
|
511
567
|
"_blank",
|
|
512
568
|
)
|
|
513
569
|
}
|
|
@@ -525,14 +581,14 @@ export function CreateSliceFromImageModal(
|
|
|
525
581
|
overlay={
|
|
526
582
|
<UploadBlankSlate
|
|
527
583
|
onFilesSelected={onImagesSelected}
|
|
528
|
-
onPaste={() => void
|
|
584
|
+
onPaste={() => void onPaste()}
|
|
529
585
|
droppingFiles
|
|
530
586
|
/>
|
|
531
587
|
}
|
|
532
588
|
>
|
|
533
589
|
<UploadBlankSlate
|
|
534
590
|
onFilesSelected={onImagesSelected}
|
|
535
|
-
onPaste={() => void
|
|
591
|
+
onPaste={() => void onPaste()}
|
|
536
592
|
/>
|
|
537
593
|
</FileDropZone>
|
|
538
594
|
</Box>
|
|
@@ -570,31 +626,40 @@ export function CreateSliceFromImageModal(
|
|
|
570
626
|
</>
|
|
571
627
|
)}
|
|
572
628
|
<DialogActions>
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
629
|
+
{totals.generating > 0 ? (
|
|
630
|
+
<DialogCancelButton
|
|
631
|
+
onClick={() => setShowCancelConfirmation(true)}
|
|
632
|
+
size="medium"
|
|
633
|
+
sx={{ marginRight: 8 }}
|
|
634
|
+
invisible
|
|
635
|
+
>
|
|
636
|
+
Cancel
|
|
637
|
+
</DialogCancelButton>
|
|
638
|
+
) : (
|
|
639
|
+
<DialogCancelButton
|
|
640
|
+
onClick={() => closeModal()}
|
|
641
|
+
size="medium"
|
|
642
|
+
sx={{ marginRight: 8 }}
|
|
643
|
+
invisible
|
|
644
|
+
>
|
|
645
|
+
Close
|
|
646
|
+
</DialogCancelButton>
|
|
647
|
+
)}
|
|
648
|
+
{totals.completed === 0 || totals.loading > 0 ? (
|
|
583
649
|
<DialogActionButton
|
|
584
650
|
color="purple"
|
|
585
651
|
startIcon="autoFixHigh"
|
|
586
|
-
onClick={
|
|
652
|
+
onClick={generatePendingSlices}
|
|
587
653
|
disabled={
|
|
588
654
|
hasTriggeredGeneration ||
|
|
589
|
-
|
|
590
|
-
|
|
655
|
+
totals.loading > 0 ||
|
|
656
|
+
totals.pending === 0
|
|
591
657
|
}
|
|
592
|
-
loading={
|
|
658
|
+
loading={totals.loading > 0}
|
|
593
659
|
size="medium"
|
|
594
660
|
>
|
|
595
|
-
Generate{
|
|
596
|
-
{
|
|
597
|
-
{generateSliceCount === 1 ? "Slice" : "Slices"}
|
|
661
|
+
Generate {totals.generate > 0 ? `(${totals.generate}) ` : ""}
|
|
662
|
+
{totals.generate === 1 ? "Slice" : "Slices"}
|
|
598
663
|
</DialogActionButton>
|
|
599
664
|
) : (
|
|
600
665
|
<DialogActionButton
|
|
@@ -603,7 +668,7 @@ export function CreateSliceFromImageModal(
|
|
|
603
668
|
loading={isSubmitting}
|
|
604
669
|
size="medium"
|
|
605
670
|
>
|
|
606
|
-
{getSubmitButtonLabel(location,
|
|
671
|
+
{getSubmitButtonLabel(location, totals.completed)}
|
|
607
672
|
</DialogActionButton>
|
|
608
673
|
)}
|
|
609
674
|
</DialogActions>
|
|
@@ -619,6 +684,37 @@ export function CreateSliceFromImageModal(
|
|
|
619
684
|
</Box>
|
|
620
685
|
)}
|
|
621
686
|
</DialogContent>
|
|
687
|
+
<Dialog
|
|
688
|
+
size="small"
|
|
689
|
+
open={showCancelConfirmation}
|
|
690
|
+
onOpenChange={setShowCancelConfirmation}
|
|
691
|
+
>
|
|
692
|
+
<DialogHeader title="Cancel generation" />
|
|
693
|
+
<DialogContent>
|
|
694
|
+
<DialogDescription>
|
|
695
|
+
<Box display="flex" flexDirection="column" padding={{ inline: 16 }}>
|
|
696
|
+
<Text variant="bold">
|
|
697
|
+
Are you sure you want to cancel the generation for all slices?
|
|
698
|
+
</Text>
|
|
699
|
+
</Box>
|
|
700
|
+
</DialogDescription>
|
|
701
|
+
<DialogActions>
|
|
702
|
+
<DialogCancelButton
|
|
703
|
+
onClick={() => setShowCancelConfirmation(false)}
|
|
704
|
+
size="small"
|
|
705
|
+
>
|
|
706
|
+
Keep generating
|
|
707
|
+
</DialogCancelButton>
|
|
708
|
+
<DialogActionButton
|
|
709
|
+
color="tomato"
|
|
710
|
+
onClick={onCancelConfirm}
|
|
711
|
+
size="small"
|
|
712
|
+
>
|
|
713
|
+
Confirm
|
|
714
|
+
</DialogActionButton>
|
|
715
|
+
</DialogActions>
|
|
716
|
+
</DialogContent>
|
|
717
|
+
</Dialog>
|
|
622
718
|
</Dialog>
|
|
623
719
|
);
|
|
624
720
|
}
|
|
@@ -15,13 +15,16 @@ export function SliceCard(props: SliceCardProps) {
|
|
|
15
15
|
const loading = slice.status === "uploading" || slice.status === "generating";
|
|
16
16
|
|
|
17
17
|
const error =
|
|
18
|
-
slice.status === "uploadError" ||
|
|
18
|
+
slice.status === "uploadError" ||
|
|
19
|
+
slice.status === "generateError" ||
|
|
20
|
+
slice.status === "cancelled";
|
|
19
21
|
|
|
20
22
|
const hasThumbnail =
|
|
21
23
|
slice.status === "pending" ||
|
|
22
24
|
slice.status === "generateError" ||
|
|
23
25
|
slice.status === "generating" ||
|
|
24
|
-
slice.status === "success"
|
|
26
|
+
slice.status === "success" ||
|
|
27
|
+
slice.status === "cancelled";
|
|
25
28
|
|
|
26
29
|
let action: ReactNode | undefined;
|
|
27
30
|
if (error) {
|
|
@@ -61,8 +64,9 @@ export type Slice = { image: File; source: "upload" | "figma" } & (
|
|
|
61
64
|
| { status: "uploading" }
|
|
62
65
|
| { status: "uploadError"; onRetry: () => void }
|
|
63
66
|
| { status: "pending"; thumbnailUrl: string }
|
|
64
|
-
| { status: "generating"; thumbnailUrl: string }
|
|
67
|
+
| { status: "generating"; thumbnailUrl: string; requestId: string }
|
|
65
68
|
| { status: "generateError"; thumbnailUrl: string; onRetry: () => void }
|
|
69
|
+
| { status: "cancelled"; thumbnailUrl: string; onRetry: () => void }
|
|
66
70
|
| {
|
|
67
71
|
status: "success";
|
|
68
72
|
thumbnailUrl: string;
|
|
@@ -85,6 +89,7 @@ function getStartIcon(status: Slice["status"]) {
|
|
|
85
89
|
switch (status) {
|
|
86
90
|
case "uploadError":
|
|
87
91
|
case "generateError":
|
|
92
|
+
case "cancelled":
|
|
88
93
|
return "close";
|
|
89
94
|
case "pending":
|
|
90
95
|
return "image";
|
|
@@ -117,6 +122,8 @@ function getSubtitle(slice: Slice) {
|
|
|
117
122
|
return "Generating...";
|
|
118
123
|
case "generateError":
|
|
119
124
|
return "Something went wrong";
|
|
125
|
+
case "cancelled":
|
|
126
|
+
return "Cancelled";
|
|
120
127
|
case "success":
|
|
121
128
|
return "Generated";
|
|
122
129
|
}
|
|
@@ -1 +0,0 @@
|
|
|
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)})}}}]);
|