diff --git a/iframe.html b/iframe.html index 87d1bcd01..77105135b 100644 --- a/iframe.html +++ b/iframe.html @@ -359,4 +359,4 @@ - window['STORIES'] = [{"titlePrefix":"","directory":"./stories","files":"**/*.stories.mdx","importPathMatcher":"^\\.[\\\\/](?:stories(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.mdx)$"},{"titlePrefix":"","directory":"./stories","files":"**/*.stories.@(js|jsx|ts|tsx)","importPathMatcher":"^\\.[\\\\/](?:stories(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.(js|jsx|ts|tsx))$"}]; \ No newline at end of file + window['STORIES'] = [{"titlePrefix":"","directory":"./stories","files":"**/*.stories.mdx","importPathMatcher":"^\\.[\\\\/](?:stories(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.mdx)$"},{"titlePrefix":"","directory":"./stories","files":"**/*.stories.@(js|jsx|ts|tsx)","importPathMatcher":"^\\.[\\\\/](?:stories(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.(js|jsx|ts|tsx))$"}]; \ No newline at end of file diff --git a/main.32d0fc41.iframe.bundle.js b/main.32d0fc41.iframe.bundle.js new file mode 100644 index 000000000..0d8828b34 --- /dev/null +++ b/main.32d0fc41.iframe.bundle.js @@ -0,0 +1 @@ +(self.webpackChunkprestashop_hummingbird_dev_tools=self.webpackChunkprestashop_hummingbird_dev_tools||[]).push([[179],{"./.storybook/preview.js-generated-config-entry.js":(__unused_webpack_module,__unused_webpack___webpack_exports__,__webpack_require__)=>{"use strict";var preview_namespaceObject={};__webpack_require__.r(preview_namespaceObject),__webpack_require__.d(preview_namespaceObject,{parameters:()=>parameters});__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptor.js"),__webpack_require__("./node_modules/core-js/modules/es.array.for-each.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.for-each.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptors.js"),__webpack_require__("./node_modules/core-js/modules/es.object.define-properties.js"),__webpack_require__("./node_modules/core-js/modules/es.object.define-property.js");var ClientApi=__webpack_require__("./node_modules/@storybook/client-api/dist/esm/ClientApi.js"),esm=__webpack_require__("./node_modules/@storybook/client-logger/dist/esm/index.js"),bootstrap_esm=(__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./src/scss/theme.scss"),__webpack_require__("./node_modules/bootstrap/dist/js/bootstrap.esm.js"));__webpack_require__("./node_modules/core-js/modules/es.array.concat.js"),__webpack_require__("./node_modules/core-js/modules/es.string.trim.js"),__webpack_require__("./node_modules/core-js/modules/es.string.split.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.string.match.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.date.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js");const selectors_map={qtyInput:{default:".js-quantity-button",modal:".modal-dialog .js-quantity-button",increment:".js-increment-button",decrement:".js-decrement-button",confirm:".confirmation",icon:".material-icons",spinner:".spinner-border",alert:function alert(param){return"#js-product-line-alert--"+param}},alert:{selector:"#notifications .container",alert:".alert",heading:".alert-heading",body:".alert-body",icon:".material-icons",close:".btn-close"},toast:{container:"#js-toast-container",template:".js-toast-template",toast:".toast",body:".toast-body",close:".btn-close"},product:{carousel:".js-product-carousel",miniature:".js-product-miniature",thumbnail:".js-thumb-container",activeThumbail:function activeThumbail(id){return".js-thumb-container:nth-child("+(id+1)+")"}},order:{returnForm:".js-order-return-form",returnFormMainCheckbox:".js-order-return-form table thead input[type=checkbox]",returnFormItemCheckbox:".js-order-return-form table tbody input[type=checkbox]"},modalBody:".modal-body",pageCms:".page-cms",quickview:".js-quickview",quickviewModal:".quickview",facetedsearch:{range:".js-faceted-slider",rangeContainer:".js-faceted-slider-container",rangeValues:".js-faceted-values",filterSlider:".js-faceted-filter-slider",offCanvasFaceted:"#offcanvas-faceted"},pageLoader:".js-page-loader",listing:{searchFilterToggler:"#search_filter_toggler, .js-search-toggler",searchFiltersWrapper:"#search_filters_wrapper",searchFilterControls:"#search_filter_controls",searchFilters:"#search-filters",activeSearchFilters:"#js-active-search-filters",listTop:"#js-product-list-top",product:".js-product",list:"#js-product-list",listBottom:"#js-product-list-bottom",listHeader:"#js-product-list-header",searchFiltersClearAll:".js-search-filters-clear-all",searchLink:".js-search-link",pagerLink:".js-pager-link"},cart:{container:".cart-container",overview:".cart-overview",discountCode:".js-discount .js-code",discountName:"[name=discount_name]",displayPromo:".display-promo",promoCode:"#promo-code",deleteLinkAction:"delete-from-cart",productQuantity:".cart__items .js-quantity-button"},progressRing:{checkout:{element:".progress-ring",circle:".progress-ring__circle",backgroundCircle:".progress-ring__background-circle"},text:".progress-ring text"},checkout:{steps:{item:".js-step-item",current:".js-current-step",shownResponsiveStep:".checkout__steps__step:not(.d-none)",specificStep:function specificStep(param){return'.checkout__steps__step[data-step="'+param+'"]'},specificStepContent:function specificStepContent(param){return"#"+param},backButton:function backButton(param){return'.js-step-item button[data-bs-target="#'+param+'"]'}},actionsButtons:".js-back, .js-edit-addresses, .js-edit-shipping",termsLink:".js-terms a",checkoutModal:"#checkout-modal",carrierExtraContentWrapper:".carrier__extra-content-wrapper",carrierExtraContent:".carrier__extra-content",carrierExtraContentActive:".carrier__extra-content-wrapper--active"},blockcart:{modal:"#blockcart-modal"},currencySelector:{currencySelector:".js-currency-selector"},languageSelector:{languageSelector:".js-language-selector"},searchBar:{searchCanvas:".js-search-offcanvas",searchWidget:".js-search-widget",searchDropdown:".js-search-dropdown",searchResults:".js-search-results",searchTemplate:".js-search-template",searchInput:".js-search-input",searchIcon:".js-search-icon"},mobileMenu:{openChildsButton:".js-menu-open-child",backTitle:".js-menu-back-title",backButton:".js-back-button",menuCanvas:".js-menu-canvas",menuCurrent:".menu--current",specificParent:function specificParent(param){return'.menu--parent[data-depth="'+param+'"]'},specificChild:function specificChild(param){return'.menu[data-id="'+param+'"]'}},visiblePassword:{visiblePassword:".js-visible-password"},desktopMenu:{dropdownToggles:".js-menu-desktop .dropdown .dropdown-toggle[data-depth]",dropdownItemAnchor:function dropdownItemAnchor(depth){return'.js-menu-desktop a[data-depth="'+depth+'"]'}},formValidation:{default:".form-validation"},passwordPolicy:{template:"#password-feedback",hint:".js-hint-password",container:".password-strength-feedback",strengthText:".password-strength-text",requirementScore:".password-requirements-score",requirementLength:".password-requirements-length",requirementScoreIcon:".password-requirements-score i",requirementLengthIcon:".password-requirements-length i",progressBar:".progress-bar"}};var Theme={light:"bg-light text-dark border-1",dark:"bg-dark text-light",primary:"bg-primary text-white",secondary:"bg-secondary text-black",info:"bg-info text-black",success:"bg-success text-white",warning:"bg-warning text-black",danger:"bg-danger text-white"},Default={type:"info",autohide:!0,delay:3e3},getToastElement=function getToastElement(template){var toastContainer=document.querySelector(selectors_map.toast.container);return toastContainer?void 0===template?cloneToastTemplate(toastContainer):appendToastTemplate(toastContainer,template):useFallbackToastContainer(template)},cloneToastTemplate=function cloneToastTemplate(toastContainer){var fallback=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],toastTemplate=toastContainer.querySelector(selectors_map.toast.template),toastClone=null==toastTemplate?void 0:toastTemplate.content.cloneNode(!0),toastElement=null==toastClone?void 0:toastClone.querySelector(selectors_map.toast.toast),toastBody=null==toastElement?void 0:toastElement.querySelector(selectors_map.toast.body);if(toastElement&&toastBody)return toastContainer.appendChild(toastElement),toastElement;if(fallback){var fallbackContainer=getFallbackContainer();if(fallbackContainer)return toastContainer.innerHTML=fallbackContainer.innerHTML,cloneToastTemplate(toastContainer,!1)}return printConsoleError("Failed to clone toast template.","Check the toast markup in theme or JS fallback."),null},appendToastTemplate=function appendToastTemplate(toastContainer,template){var dummyElement=document.createElement("div");dummyElement.innerHTML=template;var toastElement=null==dummyElement?void 0:dummyElement.querySelector(selectors_map.toast.toast),toastBody=null==toastElement?void 0:toastElement.querySelector(selectors_map.toast.body);return toastElement&&toastBody?(toastContainer.appendChild(toastElement),toastElement):(printConsoleError("The override toast template is not valid.","Reference: https://getbootstrap.com/docs/5.0/components/toasts/"),null)},useFallbackToastContainer=function useFallbackToastContainer(template){var body=document.querySelector("body"),fallbackContainer=getFallbackContainer();if(body&&fallbackContainer){var toastElement=void 0===template?cloneToastTemplate(fallbackContainer,!1):appendToastTemplate(fallbackContainer,template);if(toastElement)return fallbackContainer.appendChild(toastElement),body.appendChild(fallbackContainer),toastElement}return null},getFallbackContainer=function getFallbackContainer(){var dummyElement=document.createElement("div");return dummyElement.innerHTML='\n
\n \n
\n',dummyElement.querySelector(selectors_map.toast.container)},insertToastMessage=function insertToastMessage(toastElement,message){var toastBody=toastElement.querySelector(selectors_map.toast.body);toastBody&&(toastBody.innerHTML=message)},addToastClassList=function addToastClassList(toastElement,options){var bsClassList=Theme[options.type],customClassList=options.classlist;customClassList&&(bsClassList=bsClassList.concat(" ",customClassList.trim())),bsClassList.split(" ").forEach((function(value){value&&toastElement.classList.add(value)}))},setCloseButtonVisible=function setCloseButtonVisible(toastElement){var closeButton=toastElement.querySelector(selectors_map.toast.close);if(closeButton){var _toastElement$classLi,toastColor=null===(_toastElement$classLi=toastElement.classList.toString().match(/text-\w+/))||void 0===_toastElement$classLi?void 0:_toastElement$classLi.toString();toastColor&&("white"!==(toastColor=toastColor.substring(toastColor.indexOf("-")+1))&&"light"!==toastColor||closeButton.classList.add("btn-close-white")),closeButton.classList.remove("d-none")}},printConsoleError=function printConsoleError(error,info){info?(console.group("useToast"),console.error(error),console.info(info),console.groupEnd()):console.error(error)};const components_useToast=function useToast(message,options){var toastObject={instance:null,element:null,content:null,show:function show(){return!1},hide:function hide(){return!1},dispose:function dispose(){return!1},message:function message(){return!1},remove:function remove(){return!1}},toastElement=getToastElement(null==options?void 0:options.template);if(toastElement){insertToastMessage(toastElement,message);var clonedOptions=Object.assign({},Default,options);addToastClassList(toastElement,clonedOptions),!1===clonedOptions.autohide&&setCloseButtonVisible(toastElement);var toastElementBody=toastElement.querySelector(selectors_map.toast.body);if(toastElementBody){var toastInstance=new bootstrap_esm.FN(toastElement,{autohide:clonedOptions.autohide,delay:clonedOptions.delay});toastObject={instance:toastInstance,element:toastElement,content:toastElementBody,show:function show(){return!!toastElement.isConnected&&(toastInstance.show(),!0)},hide:function hide(){return!!toastElement.isConnected&&(toastInstance.hide(),!0)},dispose:function dispose(){return!!toastElement.isConnected&&(toastInstance.dispose(),!0)},message:function message(markup){return!!toastElement.isConnected&&(markup&&(toastElementBody.innerHTML=markup),toastElementBody.innerHTML)},remove:function remove(){return!!toastElement.isConnected&&(toastElement.remove(),!0)}}}}return toastObject};var useAlert_data_Theme={light:"alert-light",dark:"alert-dark",primary:"alert-primary",secondary:"alert-secondary",info:"alert-info",success:"alert-success",warning:"alert-warning",danger:"alert-danger"},Codepoint={light:"e88f",dark:"e88f",primary:"e88f",secondary:"e88f",info:"e88e",success:"e5ca",warning:"e002",danger:"e000"},useAlert_data_Default={type:"info",dismissible:!0},cloneAlertElement=function cloneAlertElement(options){var _alertOptions$selecto,alertOptions=Object.assign({},useAlert_data_Default,options),selector=null!==(_alertOptions$selecto=alertOptions.selector)&&void 0!==_alertOptions$selecto?_alertOptions$selecto:selectors_map.alert.selector,alertSelectorElement=document.querySelector(selector);if(alertSelectorElement){var dummyElement=document.createElement("div");dummyElement.innerHTML='\n \n';var alertElement=dummyElement.querySelector(selectors_map.alert.alert);if(alertElement){alertElement.classList.add(useAlert_data_Theme[alertOptions.type]);var alertElementIcon=alertElement.querySelector(selectors_map.alert.icon);if(alertElementIcon)if(void 0===alertOptions.title){var codepoint=alertOptions.icon?alertOptions.icon:Codepoint[alertOptions.type];alertElementIcon.innerHTML="&#x"+codepoint+";"}else alertElement.classList.add("flex-wrap"),alertElementIcon.classList.add("d-none");if(!1===alertOptions.dismissible){var alertElementCloseBtn=alertElement.querySelector(selectors_map.alert.close);null==alertElementCloseBtn||alertElementCloseBtn.classList.add("d-none")}alertOptions.classlist&&alertOptions.classlist.split(" ").forEach((function(value){value&&alertElement.classList.add(value)})),alertSelectorElement.appendChild(alertElement)}return alertElement}return console.error("The selector for alert is not valid: %c%o","color: white",selector),null},insertAlertTitle=function insertAlertTitle(alertElement,title){if(title){var alertHeader=alertElement.querySelector(selectors_map.alert.heading);if(alertHeader)return alertHeader.innerHTML=title,alertHeader.classList.remove("d-none"),alertHeader}return null},insertAlertMessage=function insertAlertMessage(alertElement,message){var alertBody=alertElement.querySelector(selectors_map.alert.body);return alertBody&&(alertBody.innerHTML=message),alertBody};const components_useAlert=function useAlert(message,options){var alertObject={instance:null,element:null,show:function show(){return!1},hide:function hide(){return!1},dispose:function dispose(){return!1},title:function title(){return!1},message:function message(){return!1},remove:function remove(){return!1}},alertElement=cloneAlertElement(options);if(alertElement){var alertElementHeader=insertAlertTitle(alertElement,null==options?void 0:options.title),alertElementBody=insertAlertMessage(alertElement,message),alertInstance=new bootstrap_esm.bZ(alertElement);alertObject={instance:alertInstance,element:alertElement,show:function show(){return!!alertElement.isConnected&&(alertElement.classList.add("show"),!0)},hide:function hide(){return!!alertElement.isConnected&&(alertElement.classList.remove("show"),!0)},dispose:function dispose(){return!!alertElement.isConnected&&(alertInstance.dispose(),!0)},title:function title(markup){return!(null==alertElementHeader||!alertElementHeader.isConnected)&&(markup&&(alertElementHeader.innerHTML=markup),alertElementHeader.innerHTML)},message:function message(markup){return!(null==alertElementBody||!alertElementBody.isConnected)&&(markup&&(alertElementBody.innerHTML=markup),alertElementBody.innerHTML)},remove:function remove(){return!!alertElement.isConnected&&(alertElement.remove(),!0)}}}return alertObject};__webpack_require__("./node_modules/core-js/modules/es.number.constructor.js");var Text={enum:"enum",percent:"percent",hidden:"hidden"};var ProgressRingMap=selectors_map.progressRing;const components_useProgressRing=function useProgressRing(selector,options){var progressElement=document.querySelector(selector);if(progressElement){var progressText=progressElement.querySelector("text"),circle=progressElement.querySelector(ProgressRingMap.checkout.circle);if(circle){var circumference=2*Number(circle.getAttribute("r"))*Math.PI;return{setProgress:function setProgress(step){var percent=Math.min(step,options.steps)/options.steps*100,offset=circumference-percent/100*circumference;if(circle.style.strokeDashoffset=offset.toString(),circle.dataset.percent=String(percent),progressText&&options.text!==Text.hidden){var text=void 0===options.text||options.text===Text.enum?Math.min(step,options.steps)+" / "+options.steps:percent+"%";progressText.innerHTML=text}},progressElement}}}return{error:new Error("The circle is not linked to an SVG circle")}};window.Theme={components:{useToast:components_useToast,useAlert:components_useAlert,useProgressRing:components_useProgressRing}},window.prestashop={themeSelectors:Object.assign({},selectors_map)};var parameters={actions:{argTypesRegex:"^on[A-Z].*"},controls:{matchers:{color:/(background|color)$/i,date:/Date$/}},options:{storySort:{order:["Theme",["Introduction","JavaScript",["Components",["Introduction"]]],"UI",["Introduction"]]}}};function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter((function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable}))),keys.push.apply(keys,symbols)}return keys}function _defineProperty(obj,key,value){return key in obj?Object.defineProperty(obj,key,{value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}Object.keys(preview_namespaceObject).forEach((function(key){var value=preview_namespaceObject[key];switch(key){case"args":case"argTypes":return esm.kg.warn("Invalid args/argTypes in config, ignoring.",JSON.stringify(value));case"decorators":return value.forEach((function(decorator){return(0,ClientApi.$9)(decorator,!1)}));case"loaders":return value.forEach((function(loader){return(0,ClientApi.HZ)(loader,!1)}));case"parameters":return(0,ClientApi.h1)(function _objectSpread(target){for(var i=1;i{"use strict";module=__webpack_require__.nmd(module),(0,__webpack_require__("./node_modules/@storybook/html/dist/esm/client/index.js").configure)([__webpack_require__("./stories sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.stories\\.mdx)$"),__webpack_require__("./stories sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cts%7Ctsx))$")],module,!1)},"./storybook-init-framework-entry.js":(__unused_webpack_module,__unused_webpack___webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__("./node_modules/@storybook/html/dist/esm/client/index.js")},"./stories/theme/introduction.stories.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{__page:()=>__page,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/react/index.js");var _mdx_js_react__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@mdx-js/react/dist/esm.js"),_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@storybook/addon-docs/dist/esm/index.js"),_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@storybook/addon-docs/blocks.js"),_excluded=["components"];function _extends(){return _extends=Object.assign||function(target){for(var i=1;i=0||(target[key]=source[key]);return target}(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i=0||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}var layoutProps={};function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("wrapper",_extends({},layoutProps,props,{components,mdxType:"MDXLayout"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_7__.h_,{title:"Theme/Introduction",mdxType:"Meta"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("h1",{id:"the-theme-folder"},"The Theme Folder"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("p",null,"This folder contains every custom components of the theme, including bootstrap composed components."))}MDXContent.isMDXComponent=!0;var __page=function __page(){throw new Error("Docs-only story")};__page.parameters={docsOnly:!0};var componentMeta={title:"Theme/Introduction",includeStories:["__page"]},mdxStoryNameToKey={};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs=Object.assign({},componentMeta.parameters.docs||{},{page:function page(){return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_6__.aT,{mdxStoryNameToKey,mdxComponentAnnotations:componentMeta},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)(MDXContent,null))}});const __WEBPACK_DEFAULT_EXPORT__=componentMeta},"./stories/theme/javascript/components/introduction.stories.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{__page:()=>__page,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/react/index.js");var _mdx_js_react__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@mdx-js/react/dist/esm.js"),_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@storybook/addon-docs/dist/esm/index.js"),_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@storybook/addon-docs/blocks.js"),_excluded=["components"];function _extends(){return _extends=Object.assign||function(target){for(var i=1;i=0||(target[key]=source[key]);return target}(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i=0||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}var layoutProps={};function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("wrapper",_extends({},layoutProps,props,{components,mdxType:"MDXLayout"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_7__.h_,{title:"Theme/JavaScript/Components/Introduction",mdxType:"Meta"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("h1",{id:"components"},"Components"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("p",null,"The Theme exposes some components using webpack to the ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("inlineCode",{parentName:"p"},"window.Theme.components")," object. "),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("p",null,"Everything exported from ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("a",{parentName:"p",href:"https://github.com/PrestaShop/theme-refacto/blob/develop/src/js/theme.ts",target:"_blank",rel:"nofollow noopener noreferrer"},"theme.ts")," is accessible inside the ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("inlineCode",{parentName:"p"},"window.Theme")," object."))}MDXContent.isMDXComponent=!0;var __page=function __page(){throw new Error("Docs-only story")};__page.parameters={docsOnly:!0};var componentMeta={title:"Theme/JavaScript/Components/Introduction",includeStories:["__page"]},mdxStoryNameToKey={};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs=Object.assign({},componentMeta.parameters.docs||{},{page:function page(){return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_6__.aT,{mdxStoryNameToKey,mdxComponentAnnotations:componentMeta},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)(MDXContent,null))}});const __WEBPACK_DEFAULT_EXPORT__=componentMeta},"./stories/theme/javascript/components/useAlert/index.stories.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{basicUsage:()=>basicUsage,default:()=>__WEBPACK_DEFAULT_EXPORT__,withPrimaryParameter:()=>withPrimaryParameter});__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.promise.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/react/index.js");var _mdx_js_react__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@mdx-js/react/dist/esm.js"),_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@storybook/addon-docs/dist/esm/index.js"),_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("./node_modules/@storybook/addon-docs/blocks.js"),_usealert_html__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./stories/theme/javascript/components/useAlert/usealert.html"),_usealert_html__WEBPACK_IMPORTED_MODULE_10___default=__webpack_require__.n(_usealert_html__WEBPACK_IMPORTED_MODULE_10__),_excluded=["components"];function _extends(){return _extends=Object.assign||function(target){for(var i=1;i=0||(target[key]=source[key]);return target}(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i=0||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}var layoutProps={};function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("wrapper",_extends({},layoutProps,props,{components,mdxType:"MDXLayout"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__.h_,{title:"Theme/JavaScript/Components/useAlert",mdxType:"Meta"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h1",{id:"usealert"},"useAlert"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"useAlert")," is accessible through ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("inlineCode",{parentName:"p"},"window.Theme.components.useAlert"),"."),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h2",{id:"concept"},"Concept"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"The alert container is the default notifications container of the theme, you can use another one specifying the selector option. "),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"The toast markup is generated on the fly by the javascript, based on bootstrap."),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h2",{id:"parameters"},"Parameters"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"text")," (Optional): string;",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("br",{parentName:"p"}),"\n",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"options")," (Optional): Options; "),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h2",{id:"options"},"Options"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"type"),": 'light' | 'dark' | 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger'",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("br",{parentName:"p"}),"\n",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"icon")," (Optional): string;",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("br",{parentName:"p"}),"\n",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"title")," (Optional): string;",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("br",{parentName:"p"}),"\n",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"dismissible")," (Optional): boolean;",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("br",{parentName:"p"}),"\n",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"classlist")," (Optional): string;",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("br",{parentName:"p"}),"\n",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"selector")," (Optional): string; "),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h2",{id:"return"},"Return"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"useAlert return an Object, here is the definition:"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("pre",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("code",{parentName:"pre",className:"language-ts"},"interface Instance {\n instance: Alert | null;\n element: HTMLElement | null;\n show: () => boolean;\n hide: () => boolean;\n dispose: () => boolean;\n remove: () => boolean;\n title: (markup?: string) => string | boolean;\n message: (markup?: string) => string | boolean;\n}\n")),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h3",{id:"examples-only-testable-inside-the-canvas-tab"},"Examples (only testable inside the Canvas tab)"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"Overall destructuring is a good practice, if you can, use it!"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"Without any options:"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__.Xz,{mdxType:"Canvas"},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__.oG,{name:"Basic usage",parameters:{docs:{source:{code:_usealert_html__WEBPACK_IMPORTED_MODULE_10___default()}}},play:function(){var _ref3=_asyncToGenerator(regeneratorRuntime.mark((function _callee(_ref2){return regeneratorRuntime.wrap((function _callee$(_context){for(;;)switch(_context.prev=_context.next){case 0:_ref2.canvasElement,document.querySelector(".btn").addEventListener("click",(function(){(0,window.Theme.components.useAlert("Lorem ipsum sit dolor amet").show)()}));case 3:case"end":return _context.stop()}}),_callee)})));return function(_x){return _ref3.apply(this,arguments)}}(),mdxType:"Story"},(function(){return _usealert_html__WEBPACK_IMPORTED_MODULE_10___default()}))),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"Without a different colorscheme:"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("pre",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("code",{parentName:"pre",className:"language-js"},"const {show} = window.Theme.components.useAlert('Lorem ipsum sit dolor amet', {type: 'primary'});\nshow();\n")),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__.Xz,{mdxType:"Canvas"},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__.oG,{name:"with primary parameter",parameters:{docs:{source:{code:_usealert_html__WEBPACK_IMPORTED_MODULE_10___default()}}},play:function(){var _ref5=_asyncToGenerator(regeneratorRuntime.mark((function _callee2(_ref4){return regeneratorRuntime.wrap((function _callee2$(_context2){for(;;)switch(_context2.prev=_context2.next){case 0:_ref4.canvasElement,document.querySelector(".btn").addEventListener("click",(function(){(0,window.Theme.components.useAlert("Lorem ipsum sit dolor amet",{type:"primary"}).show)()}));case 3:case"end":return _context2.stop()}}),_callee2)})));return function(_x2){return _ref5.apply(this,arguments)}}(),mdxType:"Story"},(function(){return _usealert_html__WEBPACK_IMPORTED_MODULE_10___default()}))))}MDXContent.isMDXComponent=!0;var basicUsage=function basicUsage(){return _usealert_html__WEBPACK_IMPORTED_MODULE_10___default()};basicUsage.storyName="Basic usage",basicUsage.parameters=Object.assign({storySource:{source:"() => useAlertContent"}},{docs:{source:{code:_usealert_html__WEBPACK_IMPORTED_MODULE_10___default()}}}),basicUsage.play=function(){var _ref7=_asyncToGenerator(regeneratorRuntime.mark((function _callee3(_ref6){return regeneratorRuntime.wrap((function _callee3$(_context3){for(;;)switch(_context3.prev=_context3.next){case 0:_ref6.canvasElement,document.querySelector(".btn").addEventListener("click",(function(){(0,window.Theme.components.useAlert("Lorem ipsum sit dolor amet").show)()}));case 3:case"end":return _context3.stop()}}),_callee3)})));return function(_x3){return _ref7.apply(this,arguments)}}();var withPrimaryParameter=function withPrimaryParameter(){return _usealert_html__WEBPACK_IMPORTED_MODULE_10___default()};withPrimaryParameter.storyName="with primary parameter",withPrimaryParameter.parameters=Object.assign({storySource:{source:"() => useAlertContent"}},{docs:{source:{code:_usealert_html__WEBPACK_IMPORTED_MODULE_10___default()}}}),withPrimaryParameter.play=function(){var _ref9=_asyncToGenerator(regeneratorRuntime.mark((function _callee4(_ref8){return regeneratorRuntime.wrap((function _callee4$(_context4){for(;;)switch(_context4.prev=_context4.next){case 0:_ref8.canvasElement,document.querySelector(".btn").addEventListener("click",(function(){(0,window.Theme.components.useAlert("Lorem ipsum sit dolor amet",{type:"primary"}).show)()}));case 3:case"end":return _context4.stop()}}),_callee4)})));return function(_x4){return _ref9.apply(this,arguments)}}();var componentMeta={title:"Theme/JavaScript/Components/useAlert",includeStories:["basicUsage","withPrimaryParameter"]},mdxStoryNameToKey={"Basic usage":"basicUsage","with primary parameter":"withPrimaryParameter"};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs=Object.assign({},componentMeta.parameters.docs||{},{page:function page(){return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_8__.aT,{mdxStoryNameToKey,mdxComponentAnnotations:componentMeta},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(MDXContent,null))}});const __WEBPACK_DEFAULT_EXPORT__=componentMeta},"./stories/theme/javascript/components/useProgressRing/index.stories.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{basicUsage:()=>basicUsage,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.promise.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/react/index.js");var _mdx_js_react__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@mdx-js/react/dist/esm.js"),_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@storybook/addon-docs/dist/esm/index.js"),_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("./node_modules/@storybook/addon-docs/blocks.js"),_useprogressring_html__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./stories/theme/javascript/components/useProgressRing/useprogressring.html"),_useprogressring_html__WEBPACK_IMPORTED_MODULE_10___default=__webpack_require__.n(_useprogressring_html__WEBPACK_IMPORTED_MODULE_10__),_excluded=["components"];function _extends(){return _extends=Object.assign||function(target){for(var i=1;i=0||(target[key]=source[key]);return target}(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i=0||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}var layoutProps={};function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("wrapper",_extends({},layoutProps,props,{components,mdxType:"MDXLayout"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__.h_,{title:"Theme/JavaScript/Components/useProgressRing",mdxType:"Meta"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h1",{id:"useprogressring"},"useProgressRing"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"useProgressRing")," is accessible through ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("inlineCode",{parentName:"p"},"window.Theme.components.useProgressRing"),"."),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h2",{id:"concept"},"Concept"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"You can use the smarty file from ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("inlineCode",{parentName:"p"},"components/progress-circle.tpl"),"."),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"Example: ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("inlineCode",{parentName:"p"},"{include file=\"components/progress-circle.tpl\" classes=\"text-success col-4\" size=74 stroke=4 percent=50 text={l s='2 / 4' d='Shop.Theme.Checkout'}}")),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"The progress ring use the text color for the ring color."),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"Size, stroke, percent")," are required in order to set the default state of the ring."),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"Initial calculation for the ring are done in smarty, so every child themes can override it and change the behavior."),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h2",{id:"options"},"Options"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"element"),": HTMLElement "),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h2",{id:"return"},"Return"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"useProgressRing return an Object, here is the definition:"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("pre",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("code",{parentName:"pre",className:"language-ts"},"interface ProgressRingReturn {\n setProgress?: (perfect: number) => void\n error?: Error\n}\n")),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h3",{id:"examples"},"Examples"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"Overall destructuring is a good practice, if you can, use it!"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__.Xz,{mdxType:"Canvas"},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__.oG,{name:"Basic usage",parameters:{docs:{source:{code:_useprogressring_html__WEBPACK_IMPORTED_MODULE_10___default()}}},play:function(){var _ref3=_asyncToGenerator(regeneratorRuntime.mark((function _callee(_ref2){var progressElement,_window$Theme$compone,setProgress;return regeneratorRuntime.wrap((function _callee$(_context){for(;;)switch(_context.prev=_context.next){case 0:_ref2.canvasElement,progressElement=document.querySelectorwindow.prestashop.themeSelectors.progressRing.checkout.element,_window$Theme$compone=window.Theme.components.useProgressRing(progressElement),setProgress=_window$Theme$compone.setProgress,!_window$Theme$compone.error&&setProgress&&setProgress(75);case 4:case"end":return _context.stop()}}),_callee)})));return function(_x){return _ref3.apply(this,arguments)}}(),mdxType:"Story"},(function(){return _useprogressring_html__WEBPACK_IMPORTED_MODULE_10___default()}))),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"Without a different colorscheme:"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("pre",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("code",{parentName:"pre",className:"language-ts"},"const progressElement = document.querySelector(window.prestashop.themeSelectors.progressRing.checkout.element);\nconst {setProgress, error} = window.Theme.components.useProgressRing(progressElement);\n\nif (!error && setProgress) {\n setProgress(75);\n}\n")))}MDXContent.isMDXComponent=!0;var basicUsage=function basicUsage(){return _useprogressring_html__WEBPACK_IMPORTED_MODULE_10___default()};basicUsage.storyName="Basic usage",basicUsage.parameters=Object.assign({storySource:{source:"() => useProgressRingContent"}},{docs:{source:{code:_useprogressring_html__WEBPACK_IMPORTED_MODULE_10___default()}}}),basicUsage.play=function(){var _ref5=_asyncToGenerator(regeneratorRuntime.mark((function _callee2(_ref4){var progressElement,_window$Theme$compone2,setProgress;return regeneratorRuntime.wrap((function _callee2$(_context2){for(;;)switch(_context2.prev=_context2.next){case 0:_ref4.canvasElement,progressElement=document.querySelectorwindow.prestashop.themeSelectors.progressRing.checkout.element,_window$Theme$compone2=window.Theme.components.useProgressRing(progressElement),setProgress=_window$Theme$compone2.setProgress,!_window$Theme$compone2.error&&setProgress&&setProgress(75);case 4:case"end":return _context2.stop()}}),_callee2)})));return function(_x2){return _ref5.apply(this,arguments)}}();var componentMeta={title:"Theme/JavaScript/Components/useProgressRing",includeStories:["basicUsage"]},mdxStoryNameToKey={"Basic usage":"basicUsage"};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs=Object.assign({},componentMeta.parameters.docs||{},{page:function page(){return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_8__.aT,{mdxStoryNameToKey,mdxComponentAnnotations:componentMeta},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(MDXContent,null))}});const __WEBPACK_DEFAULT_EXPORT__=componentMeta},"./stories/theme/javascript/components/useToast/index.stories.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{basicUsage:()=>basicUsage,default:()=>__WEBPACK_DEFAULT_EXPORT__,multipleToastsAtTheSameTime:()=>multipleToastsAtTheSameTime,withPrimaryParameter:()=>withPrimaryParameter,withTemplateOverridden:()=>withTemplateOverridden,withoutAutohide:()=>withoutAutohide});__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.promise.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/react/index.js");var _mdx_js_react__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@mdx-js/react/dist/esm.js"),_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@storybook/addon-docs/dist/esm/index.js"),_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("./node_modules/@storybook/addon-docs/blocks.js"),_usetoast_html__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./stories/theme/javascript/components/useToast/usetoast.html"),_usetoast_html__WEBPACK_IMPORTED_MODULE_10___default=__webpack_require__.n(_usetoast_html__WEBPACK_IMPORTED_MODULE_10__),_multiple_html__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./stories/theme/javascript/components/useToast/multiple.html"),_multiple_html__WEBPACK_IMPORTED_MODULE_11___default=__webpack_require__.n(_multiple_html__WEBPACK_IMPORTED_MODULE_11__),_excluded=["components"];function _extends(){return _extends=Object.assign||function(target){for(var i=1;i=0||(target[key]=source[key]);return target}(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i=0||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}var layoutProps={};function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("wrapper",_extends({},layoutProps,props,{components,mdxType:"MDXLayout"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)(_storybook_addon_docs_blocks__WEBPACK_IMPORTED_MODULE_9__.h_,{title:"Theme/JavaScript/Components/useToast",mdxType:"Meta"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h1",{id:"usetoast"},"useToast"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("strong",{parentName:"p"},"useToast")," is accessible through ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("inlineCode",{parentName:"p"},"window.Theme.components.useToast"),"."),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("h2",{id:"concept"},"Concept"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"The useToast function use the markup of ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("a",{parentName:"p",href:"https://github.com/PrestaShop/theme-refacto/blob/develop/templates/components/toast-container.tpl",target:"_blank",rel:"nofollow noopener noreferrer"},"toast-container.tpl")," and ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("a",{parentName:"p",href:"https://github.com/PrestaShop/theme-refacto/blob/develop/templates/components/toast.tpl",target:"_blank",rel:"nofollow noopener noreferrer"},"toast.tpl"),". "),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"The toast container is placed on the top right of the viewport by default. "),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("p",null,"The toast markup is generated on the fly using the ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_7__.kt)("inlineCode",{parentName:"p"},"