@sc-360-v2/storefront-cms-library 0.4.88 → 0.4.90

package/dist/uploadMedia.js

@@ -0,0 +1,2 @@
+/*! For license information please see uploadMedia.js.LICENSE.txt */
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports["storefront-cms-library"]=t(require("react")):e["storefront-cms-library"]=t(e.react)}(this,(e=>(()=>{var t={155:t=>{"use strict";t.exports=e},172:e=>{e.exports=function(e,t){this.v=e,this.k=t},e.exports.__esModule=!0,e.exports.default=e.exports},371:(e,t,n)=>{"use strict";n.d(t,{Button:()=>o});var r=n(155),a=n.n(r),o=function(e){var t=e.children,n=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(r=Object.getOwnPropertySymbols(e);a<r.length;a++)t.indexOf(r[a])<0&&Object.prototype.propertyIsEnumerable.call(e,r[a])&&(n[r[a]]=e[r[a]])}return n}(e,["children"]);return a().createElement("button",n,t)}},373:e=>{e.exports=function(e){var t=Object(e),n=[];for(var r in t)n.unshift(r);return function e(){for(;n.length;)if((r=n.pop())in t)return e.value=r,e.done=!1,e;return e.done=!0,e}},e.exports.__esModule=!0,e.exports.default=e.exports},546:e=>{function t(n,r,a,o){var i=Object.defineProperty;try{i({},"",{})}catch(n){i=0}e.exports=t=function(e,n,r,a){if(n)i?i(e,n,{value:r,enumerable:!a,configurable:!a,writable:!a}):e[n]=r;else{var o=function(n,r){t(e,n,(function(e){return this._invoke(n,r,e)}))};o("next",0),o("throw",1),o("return",2)}},e.exports.__esModule=!0,e.exports.default=e.exports,t(n,r,a,o)}e.exports=t,e.exports.__esModule=!0,e.exports.default=e.exports},579:(e,t,n)=>{var r=n(738).default;e.exports=function(e){if(null!=e){var t=e["function"==typeof Symbol&&Symbol.iterator||"@@iterator"],n=0;if(t)return t.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length))return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}}}throw new TypeError(r(e)+" is not iterable")},e.exports.__esModule=!0,e.exports.default=e.exports},633:(e,t,n)=>{var r=n(172),a=n(993),o=n(869),i=n(887),l=n(791),c=n(373),u=n(579);function s(){"use strict";var t=a(),n=t.m(s),d=(Object.getPrototypeOf?Object.getPrototypeOf(n):n.__proto__).constructor;function m(e){var t="function"==typeof e&&e.constructor;return!!t&&(t===d||"GeneratorFunction"===(t.displayName||t.name))}var f={throw:1,return:2,break:3,continue:3};function p(e){var t,n;return function(r){t||(t={stop:function(){return n(r.a,2)},catch:function(){return r.v},abrupt:function(e,t){return n(r.a,f[e],t)},delegateYield:function(e,a,o){return t.resultName=a,n(r.d,u(e),o)},finish:function(e){return n(r.f,e)}},n=function(e,n,a){r.p=t.prev,r.n=t.next;try{return e(n,a)}finally{t.next=r.n}}),t.resultName&&(t[t.resultName]=r.v,t.resultName=void 0),t.sent=r.v,t.next=r.n;try{return e.call(this,t)}finally{r.p=t.prev,r.n=t.next}}}return(e.exports=s=function(){return{wrap:function(e,n,r,a){return t.w(p(e),n,r,a&&a.reverse())},isGeneratorFunction:m,mark:t.m,awrap:function(e,t){return new r(e,t)},AsyncIterator:l,async:function(e,t,n,r,a){return(m(t)?i:o)(p(e),t,n,r,a)},keys:c,values:u}},e.exports.__esModule=!0,e.exports.default=e.exports)()}e.exports=s,e.exports.__esModule=!0,e.exports.default=e.exports},738:e=>{function t(n){return e.exports=t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e.exports.__esModule=!0,e.exports.default=e.exports,t(n)}e.exports=t,e.exports.__esModule=!0,e.exports.default=e.exports},756:(e,t,n)=>{var r=n(633)();e.exports=r;try{regeneratorRuntime=r}catch(e){"object"==typeof globalThis?globalThis.regeneratorRuntime=r:Function("r","regeneratorRuntime = r")(r)}},791:(e,t,n)=>{var r=n(172),a=n(546);e.exports=function e(t,n){function o(e,a,i,l){try{var c=t[e](a),u=c.value;return u instanceof r?n.resolve(u.v).then((function(e){o("next",e,i,l)}),(function(e){o("throw",e,i,l)})):n.resolve(u).then((function(e){c.value=e,i(c)}),(function(e){return o("throw",e,i,l)}))}catch(e){l(e)}}var i;this.next||(a(e.prototype),a(e.prototype,"function"==typeof Symbol&&Symbol.asyncIterator||"@asyncIterator",(function(){return this}))),a(this,"_invoke",(function(e,t,r){function a(){return new n((function(t,n){o(e,r,t,n)}))}return i=i?i.then(a,a):a()}),!0)},e.exports.__esModule=!0,e.exports.default=e.exports},869:(e,t,n)=>{var r=n(887);e.exports=function(e,t,n,a,o){var i=r(e,t,n,a,o);return i.next().then((function(e){return e.done?e.value:i.next()}))},e.exports.__esModule=!0,e.exports.default=e.exports},887:(e,t,n)=>{var r=n(993),a=n(791);e.exports=function(e,t,n,o,i){return new a(r().w(e,t,n,o),i||Promise)},e.exports.__esModule=!0,e.exports.default=e.exports},993:(e,t,n)=>{var r=n(546);function a(){var t,n,o="function"==typeof Symbol?Symbol:{},i=o.iterator||"@@iterator",l=o.toStringTag||"@@toStringTag";function c(e,a,o,i){var l=a&&a.prototype instanceof s?a:s,c=Object.create(l.prototype);return r(c,"_invoke",function(e,r,a){var o,i,l,c=0,s=a||[],d=!1,m={p:0,n:0,v:t,a:f,f:f.bind(t,4),d:function(e,n){return o=e,i=0,l=t,m.n=n,u}};function f(e,r){for(i=e,l=r,n=0;!d&&c&&!a&&n<s.length;n++){var a,o=s[n],f=m.p,p=o[2];e>3?(a=p===r)&&(i=o[4]||3,l=o[5]===t?o[3]:o[5],o[4]=3,o[5]=t):o[0]<=f&&((a=e<2&&f<o[1])?(i=0,m.v=r,m.n=o[1]):f<p&&(a=e<3||o[0]>r||r>p)&&(o[4]=e,o[5]=r,m.n=p,i=0))}if(a||e>1)return u;throw d=!0,r}return function(a,s,p){if(c>1)throw TypeError("Generator is already running");for(d&&1===s&&f(s,p),i=s,l=p;(n=i<2?t:l)||!d;){o||(i?i<3?(i>1&&(m.n=-1),f(i,l)):m.n=l:m.v=l);try{if(c=2,o){if(i||(a="next"),n=o[a]){if(!(n=n.call(o,l)))throw TypeError("iterator result is not an object");if(!n.done)return n;l=n.value,i<2&&(i=0)}else 1===i&&(n=o.return)&&n.call(o),i<2&&(l=TypeError("The iterator does not provide a '"+a+"' method"),i=1);o=t}else if((n=(d=m.n<0)?l:e.call(r,m))!==u)break}catch(e){o=t,i=1,l=e}finally{c=1}}return{value:n,done:d}}}(e,o,i),!0),c}var u={};function s(){}function d(){}function m(){}n=Object.getPrototypeOf;var f=[][i]?n(n([][i]())):(r(n={},i,(function(){return this})),n),p=m.prototype=s.prototype=Object.create(f);function v(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,m):(e.__proto__=m,r(e,l,"GeneratorFunction")),e.prototype=Object.create(p),e}return d.prototype=m,r(p,"constructor",m),r(m,"constructor",d),d.displayName="GeneratorFunction",r(m,l,"GeneratorFunction"),r(p),r(p,l,"Generator"),r(p,i,(function(){return this})),r(p,"toString",(function(){return"[object Generator]"})),(e.exports=a=function(){return{w:c,m:v}},e.exports.__esModule=!0,e.exports.default=e.exports)()}e.exports=a,e.exports.__esModule=!0,e.exports.default=e.exports}},n={};function r(e){var a=n[e];if(void 0!==a)return a.exports;var o=n[e]={exports:{}};return t[e](o,o.exports,r),o.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var a={};return(()=>{"use strict";function e(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=Array(t);n<t;n++)r[n]=e[n];return r}function t(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function n(t,n){if(t){if("string"==typeof t)return e(t,n);var r={}.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?e(t,n):void 0}}function o(r){return function(t){if(Array.isArray(t))return e(t)}(r)||t(r)||n(r)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function i(e){if(Array.isArray(e))return e}function l(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function c(e,t){return i(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,a,o,i,l=[],c=!0,u=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(r=o.call(n)).done)&&(l.push(r.value),l.length!==t);c=!0);}catch(e){u=!0,a=e}finally{try{if(!c&&null!=n.return&&(i=n.return(),Object(i)!==i))return}finally{if(u)throw a}}return l}}(e,t)||n(e,t)||l()}r.r(a),r.d(a,{ACCEPTED_FILE_EXTENSIONS:()=>p,ACCEPTED_IMAGE_EXTENSIONS:()=>f,ACCEPTED_VIDEO_EXTENSIONS:()=>v,CONTENT_TYPE_MAP:()=>x,DEFAULT_LABELS:()=>E,DEFAULT_MAX_FILE_SIZE_MB:()=>g,DEFAULT_MEDIA_BASE_URL:()=>h,DEFAULT_STORAGE_PROVIDER:()=>b,FromDevice:()=>A,FromUrl:()=>F,MAX_FILE_SIZE_BYTES:()=>y,MyAssets:()=>G,UploadMedia:()=>V});var u=r(756),s=r.n(u),d=r(155),m=r.n(d),f=["jpg","jpeg","png","gif","svg","webp","bmp","tiff","tif","avif"],p=["doc","docx","pdf","xls","xlsx","ppt","pptx","txt","rtf","csv"],v=["mp4","webm","ogg"],g=25,y=157286400,h="https://sellerscommerce.sirv.com",b="sirv",x={jpg:"image/jpeg",jpeg:"image/jpeg",png:"image/png",gif:"image/gif",bmp:"image/bmp",webp:"image/webp",svg:"image/svg+xml",tiff:"image/tiff",tif:"image/tiff",avif:"image/avif",pdf:"application/pdf",doc:"application/msword",docx:"application/vnd.openxmlformats-officedocument.wordprocessingml.document",xls:"application/vnd.ms-excel",xlsx:"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",ppt:"application/vnd.ms-powerpoint",pptx:"application/vnd.openxmlformats-officedocument.presentationml.presentation",txt:"text/plain",rtf:"application/rtf",csv:"text/csv",mp4:"video/mp4",webm:"video/webm",ogg:"video/ogg"},E={title:"Upload Media",fromDeviceTab:"From Device",fromUrlTab:"From URL",myAssetsTab:"My Assets",uploadBtn:"Upload",selectBtn:"Select",cancelBtn:"Discard",dragDropText:"Drag & drop files here, or click to browse",clickToUploadText:"Image Preview Here",clickToReplaceText:"Click to replace this image",urlPlaceholder:"Enter image URL",searchPlaceholder:"Search files or folders",invalidUrlError:"Please enter a valid URL",noAssetsFound:"No assets found",fileSizeExceedError:"File size should not exceed",invalidFileTypeError:"Only {type} files are allowed",maxFilesError:"Maximum files allowed",imagePreviewHere:"Image Preview Here",macroSelectedLabel:"Selected macro",noImageUrlProvided:"No image URL provided",rootTitle:"Root",minResolutionError:"Minimum image resolution",maxResolutionError:"Maximum image resolution",resolutionRangeError:"Image resolution must be between"},_=function(){return m().createElement("svg",{viewBox:"0 0 24 24"},m().createElement("rect",{x:"2",y:"3",width:"20",height:"14",rx:"2",ry:"2"}),m().createElement("line",{x1:"8",y1:"21",x2:"16",y2:"21"}),m().createElement("line",{x1:"12",y1:"17",x2:"12",y2:"21"}))},w=function(){return m().createElement("svg",{viewBox:"0 0 24 24"},m().createElement("path",{d:"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"}),m().createElement("path",{d:"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"}))},S=function(){return m().createElement("svg",{viewBox:"0 0 24 24"},m().createElement("path",{d:"M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"}))},N=function(){return m().createElement("svg",{viewBox:"0 0 24 24"},m().createElement("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),m().createElement("line",{x1:"6",y1:"6",x2:"18",y2:"18"}))},k=function(){return m().createElement("svg",{viewBox:"0 0 24 24"},m().createElement("circle",{cx:"11",cy:"11",r:"8"}),m().createElement("line",{x1:"21",y1:"21",x2:"16.65",y2:"16.65"}))},U=function(){return m().createElement("svg",{viewBox:"0 0 24 24"},m().createElement("rect",{x:"3",y:"3",width:"18",height:"18",rx:"2",ry:"2"}),m().createElement("circle",{cx:"8.5",cy:"8.5",r:"1.5"}),m().createElement("polyline",{points:"21 15 16 10 5 21"}))},M=function(){return m().createElement("svg",{viewBox:"0 0 24 24"},m().createElement("polyline",{points:"15 18 9 12 15 6"}))},P=function(){return m().createElement("svg",{viewBox:"0 0 24 24"},m().createElement("rect",{x:"3",y:"3",width:"18",height:"18",rx:"2",ry:"2"}),m().createElement("circle",{cx:"8.5",cy:"8.5",r:"1.5"}),m().createElement("polyline",{points:"21 15 16 10 5 21"}))},T=function(e,t,n,r){return new(n||(n=Promise))((function(a,o){function i(e){try{c(r.next(e))}catch(e){o(e)}}function l(e){try{c(r.throw(e))}catch(e){o(e)}}function c(e){var t;e.done?a(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(i,l)}c((r=r.apply(e,t||[])).next())}))},O=(0,d.forwardRef)((function(e,t){var n=e.type,r=void 0===n?"images":n,a=e.isMultiUpload,i=void 0!==a&&a,l=e.currentImagePreview,u=e.fieldSettings,f=e.labels,p=e.acceptedImageExtensions,y=e.acceptedFileExtensions,h=e.onFilesReady,b=e.onUploadStateChange,x=e.onError,E=(0,d.useRef)(null),w=c((0,d.useState)([]),2),S=w[0],k=w[1],M=c((0,d.useState)(!1),2),P=M[0],O=M[1],A=(0,d.useCallback)((function(){var e,t;return!(null===(e=null==u?void 0:u.imageExtensionTypes)||void 0===e?void 0:e.length)||"images"!==r&&"image"!==r?(null===(t=null==u?void 0:u.fileExtensionTypes)||void 0===t?void 0:t.length)&&"doc"===r?u.fileExtensionTypes.map((function(e){return e.toLowerCase().replace(".","")})):"all"===r?[].concat(o(p),o(y)):"images"===r||"image"===r?p:y:u.imageExtensionTypes.map((function(e){return e.toLowerCase().replace(".","")}))}),[r,u,p,y]),C=function(e){return new Promise((function(t){var n=new Image;n.onload=function(){return t({width:n.naturalWidth,height:n.naturalHeight})},n.onerror=function(){return t(null)},n.src=e}))},j=function(e){return T(void 0,void 0,void 0,s().mark((function t(){var n,a,i,l,c,d,m,p,y,h;return s().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(n=A(),a=e.filter((function(e){var t,r,a=(null===(r=null===(t=e.name)||void 0===t?void 0:t.split(".").pop())||void 0===r?void 0:r.toLowerCase())||"";return n.includes(a)})),0!==e.length){t.next=1;break}return k([]),b(!1),t.abrupt("return");case 1:if(a.length===e.length){t.next=2;break}return i="images"===r||"image"===r?"image":"document",null==x||x(((null==f?void 0:f.invalidFileTypeError)||"Only {type} files are allowed").replace("{type}",i)),k([]),b(!1),t.abrupt("return");case 2:if(!((l=(null==u?void 0:u.multiImageLimit)||(null==u?void 0:u.docLimit))&&a.length>l)){t.next=3;break}return null==x||x("".concat((null==f?void 0:f.maxFilesError)||"Maximum files allowed",": ").concat(l)),k([]),b(!1),t.abrupt("return");case 3:if(!(c=(null==u?void 0:u.maxFileSizeAllowed)||(null==u?void 0:u.maxImageSizeAllowed)||g)){t.next=4;break}if(!(a.filter((function(e){return e.size/1048576>c})).length>0)){t.next=4;break}return null==x||x("".concat((null==f?void 0:f.fileSizeExceedError)||"File size should not exceed"," ").concat(c,"MB")),k([]),b(!1),t.abrupt("return");case 4:return d=a.map((function(e){return T(void 0,void 0,void 0,s().mark((function t(){var n,a,o,i,l,c,u;return s().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(a=(null===(n=e.name.split(".").pop())||void 0===n?void 0:n.toLowerCase())||"",o=URL.createObjectURL(e),i=e.size,l=null,c="images"===r||"image"===r,u=v.includes(a),!c||u){t.next=2;break}return t.next=1,C(o);case 1:l=t.sent;case 2:return t.abrupt("return",{file:e,fileName:e.name,extension:a,previewUrl:o,fileSize:i,fileSizeKB:Math.round(i/1024),fileSizeMB:Math.round(i/1048576*100)/100,imageDimensions:l});case 3:case"end":return t.stop()}}),t)})))})),t.next=5,Promise.all(d);case 5:if(m=t.sent,p=null==u?void 0:u.minResolution,y=null==u?void 0:u.maxResolution,!p&&!y||"images"!==r&&"image"!==r){t.next=6;break}if(!(m.filter((function(e){if(!e.imageDimensions)return!1;var t=e.imageDimensions,n=t.width,r=t.height;return!(!p||!(n<p||r<p))||!(!y||!(n>y||r>y))})).length>0)){t.next=6;break}return"",h=p&&y?"".concat((null==f?void 0:f.resolutionRangeError)||"Image resolution must be between"," ").concat(p,"px - ").concat(y,"px"):p?"".concat((null==f?void 0:f.minResolutionError)||"Minimum image resolution",": ").concat(p,"px"):"".concat((null==f?void 0:f.maxResolutionError)||"Maximum image resolution",": ").concat(y,"px"),null==x||x(h),k([]),b(!1),t.abrupt("return");case 6:k((function(e){return[].concat(o(e),o(m))})),b(!1);case 7:case"end":return t.stop()}}),t)})))},F=function(){var e;null===(e=E.current)||void 0===e||e.click()};(0,d.useImperativeHandle)(t,(function(){return{getFiles:function(){return S}}})),(0,d.useEffect)((function(){h(S)}),[S]),(0,d.useEffect)((function(){S.length<=0&&b(!0)}),[]);var I="images"===r||"image"===r?"image/*,.tif,.tiff":"*";return m().createElement("div",{className:"sc-upload-media-device"},m().createElement("input",{ref:E,type:"file",accept:I,multiple:i,onChange:function(e){var t=Array.from(e.target.files||[]);j(t),E.current&&(E.current.value="")},className:"sc-upload-media-device__input"}),0===S.length&&m().createElement("div",{className:"sc-upload-media-device__dropzone ".concat(P?" sc-upload-media-device__dropzone--dragover":""),onClick:F,onKeyDown:function(e){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),F())},onDrop:function(e){e.preventDefault(),O(!1);var t=Array.from(e.dataTransfer.files);j(t)},onDragOver:function(e){e.preventDefault(),O(!0)},onDragLeave:function(){O(!1)},role:"button",tabIndex:0},l?m().createElement("div",{className:"sc-upload-media-device__current-preview"},m().createElement("img",{src:l,alt:"current selection"}),m().createElement("span",{className:"sc-upload-media-device__replace-text"},(null==f?void 0:f.clickToReplaceText)||"Click to replace this image")):m().createElement(m().Fragment,null,m().createElement("span",{className:"sc-upload-media-device__dropzone-icon"},m().createElement(_,null)),m().createElement("span",{className:"sc-upload-media-device__dropzone-text"},(null==f?void 0:f.clickToUploadText)||"Image Preview Here"))),S.length>0&&m().createElement("div",{className:"sc-upload-media-device__file-grid"},S.map((function(e,t){return m().createElement("div",{key:t,className:"sc-upload-media-device__file-item"},m().createElement("div",{className:"sc-upload-media-device__file-preview"},(n=e.extension,v.includes(n)?m().createElement("video",{controls:!0},m().createElement("source",{src:e.previewUrl,type:e.file.type}),m().createElement("track",{kind:"captions"})):m().createElement("img",{src:e.previewUrl,alt:e.fileName})),m().createElement("button",{className:"sc-upload-media-device__file-remove",onClick:function(e){e.stopPropagation(),function(e){k((function(t){var n=t.filter((function(t,n){return n!==e}));return 0===n.length&&b(!0),n}))}(t)},type:"button"},m().createElement(N,null))),m().createElement("div",{className:"sc-upload-media-device__file-name"},m().createElement(U,null),m().createElement("span",{title:e.fileName},e.fileName)));var n}))))}));O.displayName="FromDevice";const A=O;var C=[".jpg",".jpeg",".png",".gif",".bmp",".webp",".svg"],j=(0,d.forwardRef)((function(e,t){var n,r=e.allowMacros,a=void 0!==r&&r,o=e.currentImageSrc,i=void 0===o?"":o,l=e.visible,u=e.labels,s=e.macroSuggestions,f=void 0===s?[]:s,p=e.onUrlReady,v=e.onUploadStateChange,g=c((0,d.useState)(""),2),y=g[0],h=g[1],b=y.trim(),x=function(e){return/^\{\{.+\}\}$/.test(e.trim())},E=a&&b.length>1&&b.startsWith("@")&&(n=b.substring(1),!(!a||!f.length)&&f.some((function(e){return e.displayName===n}))),_=E||a&&x(b),S=function(e){if(!e||0===e.trim().length)return!1;if(e.startsWith("@"))return!0;if(a&&x(e))return!0;try{var t=new URL(e);if("http:"!==t.protocol&&"https:"!==t.protocol)return!1;var n=t.pathname.toLowerCase();return C.some((function(e){return n.endsWith(e)}))}catch(e){return!1}}(b),U=b.length>0&&!_&&!S;return(0,d.useImperativeHandle)(t,(function(){return{getUrlValue:function(){return{url:b,isMacro:_}}}})),(0,d.useEffect)((function(){if(b&&(S||_)){var e=_?x(b)||b.startsWith("@")?b:"@".concat(b):b;p(e,_),v(!1)}else v(!0)}),[y,S,_]),(0,d.useEffect)((function(){h(l&&i||"")}),[l,i]),m().createElement("div",{className:"sc-upload-media-url"},m().createElement("div",{className:"sc-upload-media-url__input-wrapper"},m().createElement("span",{className:"sc-upload-media-url__input-icon"},m().createElement(k,null)),m().createElement("input",{type:"text",value:y,onChange:function(e){return h(e.target.value)},disabled:E,placeholder:(null==u?void 0:u.urlPlaceholder)||"Enter image URL",className:"sc-upload-media-url__input".concat(U?" sc-upload-media-url__input--invalid":"")}),y.length>0&&m().createElement("button",{className:"sc-upload-media-url__input-clear",onClick:function(){return h("")},type:"button"},m().createElement(N,null))),U&&m().createElement("span",{className:"sc-upload-media-url__error"},(null==u?void 0:u.invalidUrlError)||"Please enter a valid URL"),m().createElement("div",{className:"sc-upload-media-url__preview"},y?_?m().createElement("div",{className:"sc-upload-media-url__macro-display"},m().createElement("span",null,(null==u?void 0:u.macroSelectedLabel)||"Selected macro",": ",m().createElement("strong",null,b))):b&&S?m().createElement("img",{src:b,alt:"preview"}):m().createElement("div",{className:"sc-upload-media-url__preview-empty"},m().createElement("span",null,(null==u?void 0:u.noImageUrlProvided)||"No image URL provided")):m().createElement("div",{className:"sc-upload-media-url__preview-empty"},m().createElement(w,null),m().createElement("span",null,(null==u?void 0:u.imagePreviewHere)||"Image Preview Here"))))}));j.displayName="FromUrl";const F=j;var I=r(371);function R(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=Array(t);n<t;n++)r[n]=e[n];return r}var L=function(e,t,n,r){return new(n||(n=Promise))((function(a,o){function i(e){try{c(r.next(e))}catch(e){o(e)}}function l(e){try{c(r.throw(e))}catch(e){o(e)}}function c(e){var t;e.done?a(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(i,l)}c((r=r.apply(e,t||[])).next())}))},D=function(e){var t={},n=[];return e.forEach((function(e){t[e.id]=Object.assign(Object.assign({},e),{children:[]})})),e.forEach((function(e){var r=e.parentFolderID;r&&t[r]?t[r].children.push(t[e.id]):n.push(t[e.id])})),n},B=function(e){var t,n=[].concat(o(arguments.length>1&&void 0!==arguments[1]?arguments[1]:[]),[e.name]);return{key:e.id,label:e.name,data:{path:e.path||"/",breadcrumb:n,folderId:e.id,id:e.id,name:e.name,storageProvider:e.storageProvider},children:(null===(t=e.children)||void 0===t?void 0:t.map((function(e){return B(e,n)})))||[]}},z=function(e,t){var n,r=function(e,t){var n="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!n){if(Array.isArray(e)||(n=function(e,t){if(e){if("string"==typeof e)return R(e,t);var n={}.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?R(e,t):void 0}}(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var r=0,a=function(){};return{s:a,n:function(){return r>=e.length?{done:!0}:{done:!1,value:e[r++]}},e:function(e){throw e},f:a}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var o,i=!0,l=!1;return{s:function(){n=n.call(e)},n:function(){var e=n.next();return i=e.done,e},e:function(e){l=!0,o=e},f:function(){try{i||null==n.return||n.return()}finally{if(l)throw o}}}}(e);try{for(r.s();!(n=r.n()).done;){var a=n.value;if(a.key===t)return a;if(a.children){var o=z(a.children,t);if(o)return o}}}catch(e){r.e(e)}finally{r.f()}return null},H=function(e,t){if(0===t.length)return null;if(1===t.length)return e.find((function(e){return e.label===t[0]}))||null;var n=e.find((function(e){return e.label===t[0]}));return(null==n?void 0:n.children)?H(n.children,t.slice(1)):null},W=(0,d.forwardRef)((function(e,r){var a,u,f=e.multiSelect,p=void 0!==f&&f,v=e.labels,g=e.api,y=e.mediaBaseUrl,h=e.onSelectionChange,b=e.onUploadStateChange,x=c((0,d.useState)(""),2),E=x[0],_=x[1],w=c((0,d.useState)(""),2),N=w[0],k=w[1],U=c((0,d.useState)([]),2),T=U[0],O=U[1],A=c((0,d.useState)([]),2),C=A[0],j=A[1],F=c((0,d.useState)(!1),2),R=F[0],W=F[1],G=c((0,d.useState)(!1),2),$=G[0],V=G[1],X=c((0,d.useState)([]),2),Y=X[0],q=X[1],K=c((0,d.useState)(new Set),2),Z=K[0],J=K[1],Q=(0,d.useMemo)((function(){return T.length?T.map((function(e){return B(e)})):[]}),[T]),ee=function(e,t){return L(void 0,void 0,void 0,s().mark((function n(){var r,a,o,i,l,c,u;return s().wrap((function(n){for(;;)switch(n.prev=n.next){case 0:return V(!0),n.prev=1,o=z(t||Q,e),i=(null===(r=null==o?void 0:o.data)||void 0===r?void 0:r.path)||"/",l=(null===(a=null==o?void 0:o.data)||void 0===a?void 0:a.storageProvider)||"sirv",n.next=2,g.fetchFolderFiles(i,l);case 2:c=n.sent,u=c.map((function(e){return Object.assign(Object.assign({},e),{thumbnailUrl:e.thumbnailUrl||(y?"".concat(y).concat(e.folderPath||"","/").concat(e.name):e.name)})})),j(u),n.next=4;break;case 3:n.prev=3,n.catch(1),j([]);case 4:return n.prev=4,V(!1),n.finish(4);case 5:case"end":return n.stop()}}),n,null,[[1,3,4,5]])})))};(0,d.useEffect)((function(){L(void 0,void 0,void 0,s().mark((function e(){var r,a,o,c,u,d;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return W(!0),e.prev=1,e.next=2,g.fetchFolders();case 2:r=e.sent,a=i(s=null!=r?r:[])||t(s)||n(s)||l(),o=a.slice(1),c=o.map((function(e,t){return Object.assign(Object.assign({},e),{name:0===t?"Home":e.name})})),u=D(c),d=[],u.length>0&&u[0].children&&(d=u[0].children),O(d),k(""),e.next=4;break;case 3:e.prev=3,e.catch(1);case 4:return e.prev=4,W(!1),e.finish(4);case 5:case"end":return e.stop()}var s}),e,null,[[1,3,4,5]])})))}),[]);var te=(0,d.useMemo)((function(){return E.trim()?C.filter((function(e){return e.name.toLowerCase().includes(E.toLowerCase())})):C}),[C,E]),ne=(0,d.useMemo)((function(){var e=function(){if(!N)return Q;var e=z(Q,N);return(null==e?void 0:e.children)||[]}();return E.trim()?e.filter((function(e){return e.label.toLowerCase().includes(E.toLowerCase())})):e}),[N,Q,E]),re=function(e){var t,n=e.thumbnailUrl||"";t=p?Y.some((function(t){return t.id===e.id}))?Y.filter((function(t){return t.id!==e.id})):[].concat(o(Y),[{id:e.id,fileUrl:n}]):Y.some((function(t){return t.id===e.id}))?[]:[{id:e.id,fileUrl:n}],q(t),h(t),b(0===t.length)},ae=R||$,oe=(null===(u=null===(a=z(Q,N))||void 0===a?void 0:a.data)||void 0===u?void 0:u.breadcrumb)||[];return m().createElement("div",{className:"sc-upload-media-assets"},m().createElement("input",{type:"text",value:E,onChange:function(e){return _(e.target.value)},placeholder:(null==v?void 0:v.searchPlaceholder)||"Search files or folders",className:"sc-upload-media-assets__search"}),m().createElement("div",{className:"sc-upload-media-assets__breadcrumb"},N?m().createElement(m().Fragment,null,m().createElement("button",{className:"sc-upload-media-assets__breadcrumb-back",onClick:function(){var e,t=z(Q,N),n=(null===(e=null==t?void 0:t.data)||void 0===e?void 0:e.breadcrumb)||[];if(n.length>1){var r=n.slice(0,-1),a=H(Q,r);if(a)return k(a.key),void ee(a.key)}k(""),j([])},type:"button"},m().createElement(M,null)),oe.map((function(e,t){return m().createElement("span",{key:t,style:{display:"flex",alignItems:"center",gap:4}},m().createElement("button",{type:"button",className:"sc-upload-media-assets__breadcrumb-item".concat(t===oe.length-1?" sc-upload-media-assets__breadcrumb-item--active":""),onClick:function(){return function(e,t){if(e<t.length-1){var n=t.slice(0,e+1),r=H(Q,n);r&&(k(r.key),ee(r.key))}}(t,oe)}},e),t<oe.length-1&&m().createElement("span",{className:"sc-upload-media-assets__breadcrumb-sep"},"/"))}))):m().createElement("span",null,(null==v?void 0:v.rootTitle)||"Root")),m().createElement("div",{className:"sc-upload-media-assets__grid"},ae&&[1,2,3,4].map((function(e){return m().createElement("div",{key:e,className:"sc-upload-media-assets__skeleton"})})),!ae&&ne.map((function(e){return m().createElement(I.Button,{key:e.key,className:"sc-upload-media-assets__folder",onClick:function(){return t=e.key,k(t),void ee(t);var t},type:"button"},m().createElement("div",{className:"sc-upload-media-assets__folder-icon"},m().createElement(S,null)),m().createElement("div",{className:"sc-upload-media-assets__folder-label"},m().createElement("span",{title:e.label},e.label),m().createElement("input",{type:"radio",checked:!1,readOnly:!0,onClick:function(e){return e.stopPropagation()}})))})),!ae&&te.map((function(e){return(null==(t=e.contentType)?void 0:t.startsWith("image/"))?m().createElement(I.Button,{key:e.id,className:"sc-upload-media-assets__image-card".concat(Y.some((function(t){return t.id===e.id}))?" sc-upload-media-assets__image-card--selected":""),onClick:function(){return re(e)},type:"button"},Z.has(e.id)?m().createElement("div",{className:"sc-upload-media-assets__image-placeholder"},m().createElement(P,null)):m().createElement("img",{src:e.thumbnailUrl,alt:e.name,className:"sc-upload-media-assets__image-thumb",onError:function(){return J((function(t){return new Set(t).add(e.id)}))}}),m().createElement("div",{className:"sc-upload-media-assets__image-checkbox"},m().createElement("input",{type:"checkbox",checked:Y.some((function(t){return t.id===e.id})),onChange:function(){return re(e)},onClick:function(e){return e.stopPropagation()}}))):null;var t})),!ae&&0===ne.length&&0===te.length&&m().createElement("div",{className:"sc-upload-media-assets__empty"},(null==v?void 0:v.noAssetsFound)||"No assets found")))}));W.displayName="MyAssets";const G=W;var $=function(e){var t;return(t=e,t?Array.isArray(t)?t:Array.isArray(null==t?void 0:t.results)?t.results:Array.isArray(null==t?void 0:t.data)?t.data:Array.isArray(null==t?void 0:t.valueOrDefault)?t.valueOrDefault:Array.isArray(null==t?void 0:t.assetsDetails)?t.assetsDetails:[t]:[]).map((function(e){if(!e)return null;if(e.isMacro)return e;var t=e.folderPath||e.FolderPath,n=e.displayName||e.DisplayName||e.fileName||e.FileName,r=e.url||e.fileUrl||e.fileURL||e.storageUrl||(t&&n?"".concat(t,"/").concat(n):"");return r?Object.assign(Object.assign({},e),{fileUrl:e.fileUrl||r,url:r}):null})).filter(Boolean)};const V=function(e){var t=e.api,n=e.onUploadComplete,r=e.onError,a=e.onCancel,i=e.type,l=void 0===i?"images":i,u=e.isMultiUpload,v=void 0!==u&&u,g=e.folderPath,y=void 0===g?"":g,k=e.allowMacros,U=void 0!==k&&k,M=e.currentImageSrc,P=void 0===M?null:M,T=e.module,O=void 0===T?"3":T,C=e.fromModule,j=e.mediaBaseUrl,I=void 0===j?h:j,R=e.fieldSettings,L=e.showMyAssetsTab,D=void 0===L||L,B=e.sanitizeForEmail,z=void 0!==B&&B,H=e.labels,W=Object.assign(Object.assign({},E),H),V=c((0,d.useState)(1),2),X=V[0],Y=V[1],q=c((0,d.useState)(!0),2),K=q[0],Z=q[1],J=c((0,d.useState)([]),2),Q=J[0],ee=J[1],te=c((0,d.useState)([]),2),ne=te[0],re=te[1],ae=c((0,d.useState)({url:"",isMacro:!1}),2),oe=ae[0],ie=ae[1],le=(0,d.useRef)(null),ce=(0,d.useRef)(null),ue="string"==typeof P&&P.trim()?function(e,t){if(!e)return"";var n=e.trim();if(!n)return"";if(n.startsWith("@")||/^\{\{.+\}\}$/.test(n))return n;if(/^(https?:|data:)/i.test(n))return n;if(n.startsWith("//"))return"https:".concat(n);var r=n.startsWith("/")?n:"/".concat(n);return"".concat(t).concat(r)}(P,I):"",se="string"==typeof P&&P.trim().length>0&&(P.trim().startsWith("@")||/^\{\{.+\}\}$/.test(P.trim())),de=[{id:1,name:W.fromDeviceTab,icon:_},{id:2,name:W.fromUrlTab,icon:w}].concat(o(D?[{id:3,name:W.myAssetsTab,icon:S}]:[]));(0,d.useEffect)((function(){var e="string"==typeof P?P.trim():"";e&&(e.startsWith("@")||/^\{\{.+\}\}$/.test(e))?(Y(2),Z(!1)):(Y(1),Z(!e))}),[P]);var me=(0,d.useCallback)((function(e){re(e)}),[]),fe=(0,d.useCallback)((function(e,t){ie({url:e,isMacro:t})}),[]),pe=(0,d.useCallback)((function(e){ee(e)}),[]),ve=(0,d.useCallback)((function(e){Z(e)}),[]),ge=3===X?K||0===Q.length:K;return m().createElement("div",{className:"sc-upload-media"},m().createElement("div",{className:"sc-upload-media__header"},m().createElement("h2",{className:"sc-upload-media__title"},W.title),a&&m().createElement("button",{type:"button",className:"sc-upload-media__close",onClick:a,"aria-label":"Close"},m().createElement(N,null))),m().createElement("div",{className:"sc-upload-media__tabs"},de.map((function(e){return m().createElement("button",{key:e.id,type:"button",className:"sc-upload-media__tab".concat(X===e.id?" sc-upload-media__tab--active":""),onClick:function(){return t=e.id,Y(t),void Z(!0);var t}},m().createElement("span",{className:"sc-upload-media__tab-icon"},m().createElement(e.icon,null)),e.name)}))),m().createElement("div",{className:"sc-upload-media__body"},1===X&&m().createElement(A,{ref:le,type:l,isMultiUpload:v,folderPath:y,currentImagePreview:!se&&ue?ue:"",sanitizeForEmail:z,module:O,fromModule:C,fieldSettings:R,labels:H,acceptedImageExtensions:f,acceptedFileExtensions:p,onFilesReady:me,onUploadStateChange:ve,onError:r}),2===X&&m().createElement(F,{ref:ce,type:l,allowMacros:U,currentImageSrc:P,visible:!0,mediaBaseUrl:I,labels:H,onUrlReady:fe,onUploadStateChange:ve}),3===X&&m().createElement(G,{multiSelect:v,type:l,labels:H,api:t,mediaBaseUrl:I,onSelectionChange:pe,onUploadStateChange:ve})),m().createElement("div",{className:"sc-upload-media__footer"},m().createElement("button",{type:"button",className:"sc-upload-media__btn sc-upload-media__btn--cancel",onClick:a},W.cancelBtn),m().createElement("button",{type:"button",className:"sc-upload-media__btn sc-upload-media__btn--primary",disabled:ge,onClick:function(){return e=void 0,a=void 0,o=void 0,i=s().mark((function e(){var a,o,i,l,c,u,d,m,f,p,g,h,E,_,w,S,N,k,U,M,P,T,A,j,F,I;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(!(3===X?K||0===Q.length:K)){e.next=1;break}return e.abrupt("return");case 1:if(e.prev=1,1!==X){e.next=7;break}if(0!==(f=(null===(a=le.current)||void 0===a?void 0:a.getFiles())||ne).length){e.next=2;break}return e.abrupt("return");case 2:if(Z(!0),!v){e.next=4;break}return p=f.map((function(e){var t=z?e.fileName.trim().replace(/\s+/g,"-").replace(/-+\./g,"."):e.fileName.trim().replace(/\s+/g," ").replace(/\s+\./g,".");return{formFile:e.file,fileName:t,contentType:e.file.type||x[e.extension]||"image/".concat(e.extension),extension:e.extension,storageProvider:b,folderPath:y,module:O,fromModule:C}})),e.next=3,t.uploadMultiFiles(p);case 3:g=e.sent,h=$(g),n(h),e.next=6;break;case 4:return E=f[0],_=z?E.file.name.trim().replace(/\s+/g,"-").replace(/-+\./g,"."):E.file.name.trim().replace(/\s+/g," ").replace(/\s+\./g,"."),w={formFile:E.file,fileName:_,contentType:E.file.type,extension:E.extension,storageProvider:b,folderPath:y,module:O,fromModule:C},e.next=5,t.uploadFile(w);case 5:S=e.sent,N=$(S),n(N);case 6:e.next=13;break;case 7:if(2!==X){e.next=12;break}if((k=(null===(o=ce.current)||void 0===o?void 0:o.getUrlValue())||oe).url){e.next=8;break}return e.abrupt("return");case 8:if(Z(!0),!k.isMacro){e.next=9;break}n([{fileUrl:k.url,url:k.url,isMacro:!0}]),e.next=11;break;case 9:return U=new URL(k.url),M=U.pathname.split("/").pop()||"pic.png",P=(M.split(".").pop()||"png").toLowerCase(),T=M.replace(/\.[^.]+$/,"")||"pic",e.next=10,t.uploadFromUrl({fileUrl:k.url,fileName:T,extension:".".concat(P),storageProvider:b,contentType:x[P]||"image/".concat(P),folderPath:y||"/admin"});case 10:A=e.sent,j=$(A),n(j);case 11:e.next=13;break;case 12:3===X&&n(Q.map((function(e){return{fileUrl:e.fileUrl,url:e.fileUrl}})));case 13:e.next=15;break;case 14:e.prev=14,I=e.catch(1),F=(null===(u=null===(c=null===(l=null===(i=null==I?void 0:I.response)||void 0===i?void 0:i.data)||void 0===l?void 0:l.errors)||void 0===c?void 0:c[0])||void 0===u?void 0:u.message)||(null===(m=null===(d=null==I?void 0:I.response)||void 0===d?void 0:d.data)||void 0===m?void 0:m.message)||(null==I?void 0:I.message)||"An error occurred during upload.",null==r||r(F);case 15:return e.prev=15,Z(!1),e.finish(15);case 16:case"end":return e.stop()}}),e,null,[[1,14,15,16]])})),new(o||(o=Promise))((function(t,n){function r(e){try{c(i.next(e))}catch(e){n(e)}}function l(e){try{c(i.throw(e))}catch(e){n(e)}}function c(e){var n;e.done?t(e.value):(n=e.value,n instanceof o?n:new o((function(e){e(n)}))).then(r,l)}c((i=i.apply(e,a||[])).next())}));var e,a,o,i}},W.uploadBtn)))}})(),a})()));

package/dist/uploadMedia.js.LICENSE.txt

@@ -0,0 +1 @@
+/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */

package/dist/variant-picker.scss

@@ -76,6 +76,13 @@ $minWidth: 70px;
       gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
       padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
       white-space: nowrap;
+      .variant__option {
+        width: 100%;
+        .variant__list {
+          display: flex;
+          gap: 12px;
+        }
+      }
 
       .standard_wrapper {
         //   Select Colors

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sc-360-v2/storefront-cms-library",
-  "version": "0.4.88",
+  "version": "0.4.90",
   "main": "/dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {
@@ -48,6 +48,13 @@
     },
     "./widget.scss": {
       "import": "./dist/widget.scss"
+    },
+    "./uploadMedia": {
+      "import": "./dist/uploadMedia.js",
+      "types": "./dist/types/upload-media/index.d.ts"
+    },
+    "./uploadMedia.scss": {
+      "import": "./dist/upload-media.scss"
     }
   },
   "scripts": {