JezK

Edit File: sc-test-mode-info.js.map

{"file":"sc-test-mode-info.js","mappings":";;;;;;AAAA,MAAM,iBAAiB,GAAG,iqBAAiqB,CAAC;AAC5rB,6BAAe,iBAAiB;;;;;;;;;mRCgBJ,UAAE,oSAIf,UAAE,8JAEI,UAAE,kIACF,UAAE,wSAEuE,UAAE,2IAGjF,UAAE,2JAEI,UAAE,oIACF,UAAE,yGACF,UAAE,kSAEqE,UAAE,+WAMjF,UAAE,6RAGF,UAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/ui/test-mode-info/sc-test-mode-info.scss?tag=sc-test-mode-info","src/components/ui/test-mode-info/sc-test-mode-info.tsx"],"sourcesContent":["sc-test-mode-info {\n .sc-test-mode-info-content {\n ol {\n padding-left: 1em;\n margin: 0;\n font-size: 12px;\n\n img {\n width: 320px;\n margin-top: 12px;\n }\n }\n ul {\n padding-left: 1em;\n }\n }\n\n .sc-test-mode-info-footer {\n display: flex;\n justify-content: space-between;\n sc-button > sc-icon {\n margin-left: 4px;\n }\n & > span {\n font-size: var(--sc-button-font-size-small);\n align-content: center;\n opacity: 0.75;\n }\n }\n\n sc-popover {\n --panel-width: 25em;\n }\n}\n\n// We need this CSS to set the Icon of the Admin Bar Setting to change the Mode.\n#wpadminbar #wp-admin-bar-sc_change_checkout_mode > .ab-item:before {\n content: '\\f186'/ '';\n top: 2px;\n}\n","import { Component, h } from '@stencil/core';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * @part base - The elements base wrapper.\n * @part trigger - The trigger.\n * @part panel - The panel.\n */\n@Component({\n tag: 'sc-test-mode-info',\n styleUrl: 'sc-test-mode-info.scss',\n})\nexport class ScTestModeInfo {\n render() {\n return (\n <sc-popover skidding={30}>\n <slot name=\"trigger\" slot=\"trigger\" />\n <span slot=\"title\">{__('How to switch from Test to Live mode', 'surecart')}</span>\n <div class=\"sc-test-mode-info-content\" slot=\"content\">\n <ol>\n <li>\n {__('From the Admin Bar', 'surecart')}\n <ul>\n <li>{__('Select any product & proceed to its checkout page.', 'surecart')}</li>\n <li>{__('Access the dropdown menu & select the live mode.', 'surecart')}</li>\n </ul>\n <img src={`${window?.scData?.plugin_url}/images/change-from-adminbar.png`} alt={__('Screenshot showing how to change mode from the admin bar', 'surecart')} />\n </li>\n <li>\n {__('From the Editor', 'surecart')}\n <ul>\n <li>{__('Navigate to the custom Forms section under SureCart.', 'surecart')}</li>\n <li>{__('Select the checkout form.', 'surecart')}</li>\n <li>{__('Select \"Live\" from the dropdown. Hit Update!', 'surecart')}</li>\n </ul>\n <img src={`${window?.scData?.plugin_url}/images/change-from-editor.png`} alt={__('Screenshot showing how to change mode from the editor', 'surecart')} />\n </li>\n </ol>\n </div>\n <div class=\"sc-test-mode-info-footer\" slot=\"footer\">\n <sc-button size=\"small\" type=\"link\" target=\"_blank\" href=\"https://surecart.com/docs/how-to-make-test-payments/\">\n {__('Documentation ', 'surecart')} <sc-icon name=\"external-link\" />\n </sc-button>\n <sc-button size=\"small\" type=\"link\" target=\"_blank\" href=\"https://surecart.com/contact-us/\">\n {__('Open a ticket ', 'surecart')} <sc-icon name=\"external-link\" />\n </sc-button>\n </div>\n </sc-popover>\n );\n }\n}\n"],"version":3}