diff --git a/.circleci/config.yml b/.circleci/config.yml index 348554e..e61e815 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -2,12 +2,12 @@ version: 2.1 jobs: build: docker: - - image: cimg/php:8.2.15-browsers - - image: cimg/mariadb:10.4 + - image: cimg/php:8.3-browsers + - image: cimg/mariadb:10.6 environment: MYSQL_ROOT_PASSWORD: root MYSQL_DATABASE: m2build - - image: docker.elastic.co/elasticsearch/elasticsearch:7.12.0 + - image: docker.elastic.co/elasticsearch/elasticsearch:8.11.0 environment: transport.host: 127.0.0.1 network.host: 127.0.0.1 @@ -16,8 +16,12 @@ jobs: discovery.type: single-node xpack.security.enabled: "false" ES_JAVA_OPTS: "-Xms256m -Xmx256m" - working_directory: ~/magento2 steps: + - checkout + - run: + name: Create magento2 working directory + command: | + mkdir -p ~/magento2 - run: name: Waiting for MySQL startup command: | @@ -64,32 +68,25 @@ jobs: sysvshm \ xsl sudo composer self-update - - run: - name: Composer Configure - command: | - composer config -g http-basic.repo.magento.com $MAGENTO_REPO_KEY $MAGENTO_REPO_SECRET - composer config -g http-basic.repo.packagist.com "token" $GENE_PACKAGIST_TOKEN + composer config --global github-oauth.github.com $GITHUB_CHECKOUT_TOKEN composer config -g allow-plugins true - run: name: Composer Create Project - command: | - php -d memory_limit=-1 /usr/local/bin/composer create-project --no-interaction --repository-url=https://repo.magento.com/ magento/project-community-edition=2.4.6 . --no-install --no-plugins - php -d memory_limit=-1 /usr/local/bin/composer require --no-update colinmollenhour/php-redis-session-abstract:" diff --git a/.github/workflows/generate-dist.yml b/.github/workflows/generate-dist.yml new file mode 100644 index 0000000..cb9a59c --- /dev/null +++ b/.github/workflows/generate-dist.yml @@ -0,0 +1,50 @@ +name: Generate dist + +on: + push: + branches: + - main + - "develop*" + - "hotfix/*" + +jobs: + generate-dist: + runs-on: ubuntu-latest + + steps: + + - name: Prepare git + shell: bash + run: | + git config --global user.name "github-action[bot]" + git config --global user.email "github-action[bot]@users.noreply.github.com" + + - name: Check out the src branch + uses: actions/checkout@v3 + with: + ref: ${{ github.ref_name }} + + - name: Generate dist + shell: bash + run: | + set -v + + git config --global pull.rebase false + git fetch --unshallow || true + + cd view/frontend/web/js/checkout/ + npm ci + npm run build + git add -f ./dist + + git status + + if ! git diff-index --quiet HEAD; then + echo "Adding changes to git" + git commit -am "[bot] generate dist ($GITHUB_SERVER_URL/$GITHUB_REPOSITORY/actions/runs/$GITHUB_RUN_ID)" + git push + else + echo "exiting" + exit 0; + fi + diff --git a/README.md b/README.md index b891759..fca8d8c 100644 --- a/README.md +++ b/README.md @@ -1,80 +1,31 @@ -[![CircleCI](https://dl.circleci.com/status-badge/img/gh/genecommerce/better-checkout-new-module-template/tree/main.svg?style=svg&circle-token=CCIPRJ_MyaGqRZPJU9B3scfCpNUet_ba0218df02ddad960a21e0b7f421435d4e364ebe)](https://dl.circleci.com/status-badge/redirect/gh/genecommerce/better-checkout-new-module-template/tree/main) +[![CircleCI](https://dl.circleci.com/status-badge/img/gh/bluefinchcommerce/checkout-new-module-template/tree/main.svg?style=svg&circle-token=CCIPRJ_MyaGqRZPJU9B3scfCpNUet_ba0218df02ddad960a21e0b7f421435d4e364ebe)](https://dl.circleci.com/status-badge/redirect/gh/bluefinchcommerce/checkout-new-module-template/tree/main) +![Checkout Powered by BlueFinch](./assets/logo.svg) -![Better Checkout Powered by GENE](./assets/logo.svg) +# BlueFinch Checkout Module - Example Extension -# Gene Better Checkout Module - Example Extension +This module serves as an example of how to create a custom extension for the BlueFinch Checkout module. -This module serves as an example of how to create a custom extension for the Gene Better Checkout module. +## Requirements + +- Magento 2.4.6 or higher +- Node 16 or higher (for development purposes only) +- Latest version of BlueFinch Checkout + +## Installation + +Ensure you have installed the latest version of BlueFinch Checkout, which can be found here, [BlueFinch Checkout](https://github.com/bluefinchcommerce/module-checkout). + +For information about a module installation in Adobe Commerce, see [Enable or disable modules](https://experienceleague.adobe.com/en/docs/commerce-operations/installation-guide/tutorials/manage-modules). + +Remember to clear any appropriate caches. ## Getting Started -To use this functionality, follow these steps: - -1. PHTML Integration -In your .phtml file, include the path to your custom functionality files, which could include new components, callback functions, and styles. - -2. Layout File Update -Your .phtml file should already be added to the checkout layout. You just need to modify the name of the .phtml file to match your new component. - -3. Create New Components or Callbacks -After setting up your .phtml file, navigate to the view/frontend/js/checkout/src directory. Here, you can create new callbacks or components with custom names. - -4. Register the Component or Callback -To use your custom component or callback, you need to register it as a functionExtension or componentExtension in the Gene Better Checkout module. - -## Available Extension Points -Below is a list of existing extension points where you can plug in your custom components or callbacks. - -1. additionalPaymentMethod -2. additionalPaymentMethodsPrimary -3. additionalVaultedMethod -4. ageCheckerExtension -5. footerPaymentIcon -6. belowShippingMethodsExtension -7. additionalShippingMethod -8. shippingMethodAdditionalContainer -9. paymentIcon -10. orderSummaryMessagesContainer -11. expressPaymentMethod -12. clickAndCollectComponent - -Callback Extension Points: -1. onLogin -2. onSetShippingStep -3. onHandleCartData -4. onBraintreeExpressInit -5. onUserProceed -6. onSubmitShippingOptionAgeCheck -7. onEditAddress -8. onDeliveryTabEvent -9. getCrossSellsHeader -10. getAppliedCoupons -11. onShippingMethodMounted -12. getRewardPoints -13. getPrices -14. getItems -15. getPaymentMethods -16. getIsVirtual -17. getShippingAddresses -18. getGiftWrapping -19. getGiftCards -20. getFullCart -21. getBillingAddress -22. getStoreCredit -23. onStepCreated -24. belowEmailFieldExtension -25. onCreate -26. onPaymentDataChanged -27. getShippingMethods - -Once you have completed the setup, follow these steps to build your code: - -1. Navigate to the view/frontend/js/checkout directory: -cd view/frontend/js/checkout -2. Install necessary dependencies: -npm install -3. Build the project: -npm run build +Please refer to the [BlueFinch Checkout Modules docs](https://github.com/BlueFinchCommerce/module-checkout), specifically the [Custom extension guide](https://github.com/BlueFinchCommerce/module-checkout/blob/main/docs/Extensions.md) and the [how to create a checkout extension module](https://github.com/BlueFinchCommerce/module-checkout/blob/main/docs/how-to-create-a-checkout-extension-module.md) document. + +## Local frontend development workflow + +Please refer to the local frontend development workflow section of the [BlueFinch Checkout contributing guidelines](https://github.com/BlueFinchCommerce/module-checkout/blob/main/.github/CONTRIBUTING.md), that applies to all BlueFinch Checkout extension modules, such as this one. ## CircleCi diff --git a/assets/logo.svg b/assets/logo.svg index a613a2b..6d2ada6 100644 --- a/assets/logo.svg +++ b/assets/logo.svg @@ -1,32 +1,24 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + diff --git a/composer.json b/composer.json index 15a9d9c..6f9a0ba 100644 --- a/composer.json +++ b/composer.json @@ -1,5 +1,5 @@ { - "name": "gene/module-better-checkout-new-module", + "name": "bluefinchcommerce/module-checkout-new-module", "description": "", "type": "magento2-module", "autoload": { @@ -7,12 +7,12 @@ "registration.php" ], "psr-4": { - "Gene\\BetterCheckoutNewModule\\": "" + "BlueFinch\\CheckoutNewModule\\": "" } }, "require": { "magento/framework": "*", - "gene/module-better-checkout": "^1.0" + "bluefinchcommerce/module-checkout": "^1.0" }, "require-dev": { "magento/magento-coding-standard": "*", @@ -22,16 +22,16 @@ "squizlabs/php_codesniffer": "^3.6", "dealerdirect/phpcodesniffer-composer-installer": "^1.0" }, - "repositories": [ - { - "type": "composer", - "url": "https://repo.magento.com/" - }, - { - "type": "composer", - "url": "https://repo.packagist.com/gene/" - } - ], + "repositories": { + "magento": { + "type": "composer", + "url": "https://mirror.mage-os.org/" + }, + "checkout": { + "type": "git", + "url": "https://github.com/BlueFinchCommerce/module-checkout" + } + }, "authors": [ { "name": "", diff --git a/etc/module.xml b/etc/module.xml index b822bc7..78c1531 100644 --- a/etc/module.xml +++ b/etc/module.xml @@ -1,8 +1,8 @@ - + - + diff --git a/package-lock.json b/package-lock.json index fe89e1a..59f15ac 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,10 +1,10 @@ { - "name": "gene-better-checkout-new-module-template", + "name": "bluefinch-checkout-new-module-template", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "gene-better-checkout-new-module-template", + "name": "bluefinch-checkout-new-module-template", "license": "ISC", "devDependencies": { "eslint": "^8.50.0" diff --git a/package.json b/package.json index 61d563b..b0fc755 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "gene-better-checkout-new-module-template", + "name": "bluefinch-checkout-new-module-template", "description": "", "main": ".eslintrc", "scripts": { @@ -8,14 +8,14 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/genecommerce/better-checkout-new-module-template-module.git" + "url": "git+https://github.com/bluefinchcommerce/checkout-new-module-template-module.git" }, "author": "", "license": "ISC", "bugs": { - "url": "https://github.com/genecommerce/better-checkout-new-module-template/issues" + "url": "https://github.com/bluefinchcommerce/checkout-new-module-template/issues" }, - "homepage": "https://github.com/genecommerce/better-checkout-new-module-template#readme", + "homepage": "https://github.com/bluefinchcommerce/checkout-new-module-template#readme", "devDependencies": { "eslint": "^8.50.0" } diff --git a/registration.php b/registration.php index d045fa4..e76a96d 100644 --- a/registration.php +++ b/registration.php @@ -1,6 +1,6 @@ - - + + - Gene\BetterCheckout\ViewModel\Assets + BlueFinch\Checkout\ViewModel\Assets diff --git a/view/frontend/templates/new-module.phtml b/view/frontend/templates/new-module.phtml index 6e4efea..341438b 100644 --- a/view/frontend/templates/new-module.phtml +++ b/view/frontend/templates/new-module.phtml @@ -2,22 +2,31 @@ /** * @var \Magento\Framework\View\Element\Template $block * @var \Magento\Framework\Escaper $escaper - * @var \Gene\BetterCheckout\ViewModel\Assets $assetViewModel + * @var \BlueFinch\Checkout\ViewModel\Assets $assetViewModel */ -$onNewCallback = $block->getViewFileUrl('Gene_BetterCheckoutNewModule::js/checkout/dist/callbacks/onNewCallback.min.js'); -$newComponent = $block->getViewFileUrl('Gene_BetterCheckoutNewModule::js/checkout/dist/components/NewComponent/NewComponent.min.js'); -$styles = $block->getViewFileUrl('Gene_BetterCheckoutNewModule::js/checkout/dist/styles.css'); +$assetViewModel = $block->getAssetViewModel(); + +$belowEmailFields = $assetViewModel->getDistViewFileUrl('BlueFinch_CheckoutNewModule::js/checkout/dist/components/belowEmailFields/belowEmailFields.min.js'); +$onStepsCreated = $assetViewModel->getDistViewFileUrl('BlueFinch_CheckoutNewModule::js/checkout/dist/callbacks/onStepsCreated.min.js'); + +$styles = $assetViewModel->getDistViewFileUrl('BlueFinch_CheckoutNewModule::js/checkout/dist/styles.css'); ?> - \ No newline at end of file + diff --git a/view/frontend/web/js/checkout/.gitignore b/view/frontend/web/js/checkout/.gitignore index 251ce6d..6f4b533 100644 --- a/view/frontend/web/js/checkout/.gitignore +++ b/view/frontend/web/js/checkout/.gitignore @@ -9,6 +9,7 @@ lerna-debug.log* node_modules dist-ssr +dist-dev *.local # Editor directories and files diff --git a/view/frontend/web/js/checkout/dist/callbacks/onNewCallback.min.js b/view/frontend/web/js/checkout/dist/callbacks/onNewCallback.min.js deleted file mode 100644 index 65a26fc..0000000 --- a/view/frontend/web/js/checkout/dist/callbacks/onNewCallback.min.js +++ /dev/null @@ -1 +0,0 @@ -var a=async()=>{console.log("New callback")};export{a as default}; diff --git a/view/frontend/web/js/checkout/dist/callbacks/onStepsCreated.min.js b/view/frontend/web/js/checkout/dist/callbacks/onStepsCreated.min.js new file mode 100644 index 0000000..be36850 --- /dev/null +++ b/view/frontend/web/js/checkout/dist/callbacks/onStepsCreated.min.js @@ -0,0 +1 @@ +var e=async()=>{console.log("New Component - onStepsCreated")};export{e as default}; diff --git a/view/frontend/web/js/checkout/dist/components/NewComponent/NewComponent.min.js b/view/frontend/web/js/checkout/dist/components/NewComponent/NewComponent.min.js deleted file mode 100644 index 4e7f745..0000000 --- a/view/frontend/web/js/checkout/dist/components/NewComponent/NewComponent.min.js +++ /dev/null @@ -1,17 +0,0 @@ -var n={name:"NewComponent"}; -/** -* @vue/shared v3.4.23 -* (c) 2018-present Yuxi (Evan) You and Vue contributors -* @license MIT -**/const t=[],e=n=>111===n.charCodeAt(0)&&110===n.charCodeAt(1)&&(n.charCodeAt(2)>122||n.charCodeAt(2)<97),l=Object.assign,o=Array.isArray,s=n=>"function"==typeof n,c=n=>"string"==typeof n,r=n=>"symbol"==typeof n,a=n=>null!==n&&"object"==typeof n;let i;function u(n){if(o(n)){const t={};for(let e=0;e{if(n){const e=n.split(f);e.length>1&&(t[e[0].trim()]=e[1].trim())}})),t}function h(n){let t="";if(c(n))t=n;else if(o(n))for(let e=0;e"arguments"!==n&&"caller"!==n)).map((n=>Symbol[n])).filter(r)); -/** -* @vue/runtime-core v3.4.23 -* (c) 2018-present Yuxi (Evan) You and Vue contributors -* @license MIT -**/ -let g=null,m=null;const C=Symbol.for("v-ndc"),b=Object.create(null),v=n=>Object.getPrototypeOf(n)===b,S=Symbol.for("v-fgt"),F=Symbol.for("v-txt"),k=Symbol.for("v-cmt"),w=[];let x=null;function A(n){return n.dynamicChildren=x||t,w.pop(),x=w[w.length-1]||null,x&&x.push(n),n}const N=({key:n})=>null!=n?n:null,E=({ref:n,ref_key:t,ref_for:e})=>{return"number"==typeof n&&(n=""+n),null!=n?c(n)||(l=n)&&!0===l.__v_isRef||s(n)?{i:g,r:n,k:t,f:!!e}:n:null;var l};function O(n,t=null,e=null,l=0,o=null,s=(n===S?0:1),r=!1,a=!1){const i={__v_isVNode:!0,__v_skip:!0,type:n,props:t,key:t&&N(t),ref:t&&E(t),scopeId:m,slotScopeIds:null,children:e,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:s,patchFlag:l,dynamicProps:o,dynamicChildren:null,appContext:null,ctx:g};return a?(P(i,e),128&s&&n.normalize(i)):e&&(i.shapeFlag|=c(e)?8:16),!r&&x&&(i.patchFlag>0||6&s)&&32!==i.patchFlag&&x.push(i),i}const T=function(n,t=null,e=null,r=0,i=null,p=!1){n&&n!==C||(n=k);if(f=n,f&&!0===f.__v_isVNode){const l=I(n,t,!0);return e&&P(l,e),!p&&x&&(6&l.shapeFlag?x[x.indexOf(n)]=l:x.push(l)),l.patchFlag|=-2,l}var f;(function(n){return s(n)&&"__vccOpts"in n})(n)&&(n=n.__vccOpts);if(t){t=function(n){return n?y(n)||v(n)?l({},n):n:null}(t);let{class:n,style:e}=t;n&&!c(n)&&(t.class=h(n)),a(e)&&(y(e)&&!o(e)&&(e=l({},e)),t.style=u(e))}const _=c(n)?1:(n=>n.__isSuspense)(n)?128:(n=>n.__isTeleport)(n)?64:a(n)?4:s(n)?2:0;return O(n,t,e,r,i,_,p,!0)};function I(n,t,l=!1){const{props:s,ref:c,patchFlag:r,children:a}=n,i=t?function(...n){const t={};for(let l=0;l{let l;return(l=n[t])||(l=n[t]=[]),l.push(e),n=>{l.length>1?l.forEach((t=>t(n))):l[0](n)}};t("__VUE_INSTANCE_SETTERS__",(n=>n)),t("__VUE_SSR_SETTERS__",(n=>n))}n.render=function(n,t,e,l,o,s){return function(n=!1){w.push(x=n?null:[])}(),A(O("p",null,"NewComponent",c,r,a,!0));var c,r,a},n.__file="src/components/NewComponent/NewComponent.vue";export{n as default}; diff --git a/view/frontend/web/js/checkout/dist/components/belowEmailFields/belowEmailFields.min.js b/view/frontend/web/js/checkout/dist/components/belowEmailFields/belowEmailFields.min.js new file mode 100644 index 0000000..936fdbe --- /dev/null +++ b/view/frontend/web/js/checkout/dist/components/belowEmailFields/belowEmailFields.min.js @@ -0,0 +1,17 @@ +var n={name:"NewComponent"}; +/** +* @vue/shared v3.4.23 +* (c) 2018-present Yuxi (Evan) You and Vue contributors +* @license MIT +**/const t=[],e=n=>111===n.charCodeAt(0)&&110===n.charCodeAt(1)&&(n.charCodeAt(2)>122||n.charCodeAt(2)<97),l=Object.assign,s=Array.isArray,o=n=>"function"==typeof n,c=n=>"string"==typeof n,r=n=>"symbol"==typeof n,a=n=>null!==n&&"object"==typeof n;let i;function u(n){if(s(n)){const t={};for(let e=0;e{if(n){const e=n.split(f);e.length>1&&(t[e[0].trim()]=e[1].trim())}})),t}function h(n){let t="";if(c(n))t=n;else if(s(n))for(let e=0;e"arguments"!==n&&"caller"!==n)).map((n=>Symbol[n])).filter(r)); +/** +* @vue/runtime-core v3.4.23 +* (c) 2018-present Yuxi (Evan) You and Vue contributors +* @license MIT +**/ +let g=null,m=null;const b=Symbol.for("v-ndc"),C=Object.create(null),F=n=>Object.getPrototypeOf(n)===C,v=Symbol.for("v-fgt"),S=Symbol.for("v-txt"),w=Symbol.for("v-cmt"),E=[];let k=null;function x(n){return n.dynamicChildren=k||t,E.pop(),k=E[E.length-1]||null,k&&k.push(n),n}const A=({key:n})=>null!=n?n:null,O=({ref:n,ref_key:t,ref_for:e})=>{return"number"==typeof n&&(n=""+n),null!=n?c(n)||(l=n)&&!0===l.__v_isRef||o(n)?{i:g,r:n,k:t,f:!!e}:n:null;var l};function N(n,t=null,e=null,l=0,s=null,o=(n===v?0:1),r=!1,a=!1){const i={__v_isVNode:!0,__v_skip:!0,type:n,props:t,key:t&&A(t),ref:t&&O(t),scopeId:m,slotScopeIds:null,children:e,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:o,patchFlag:l,dynamicProps:s,dynamicChildren:null,appContext:null,ctx:g};return a?(P(i,e),128&o&&n.normalize(i)):e&&(i.shapeFlag|=c(e)?8:16),!r&&k&&(i.patchFlag>0||6&o)&&32!==i.patchFlag&&k.push(i),i}const T=function(n,t=null,e=null,r=0,i=null,p=!1){n&&n!==b||(n=w);if(f=n,f&&!0===f.__v_isVNode){const l=I(n,t,!0);return e&&P(l,e),!p&&k&&(6&l.shapeFlag?k[k.indexOf(n)]=l:k.push(l)),l.patchFlag|=-2,l}var f;(function(n){return o(n)&&"__vccOpts"in n})(n)&&(n=n.__vccOpts);if(t){t=function(n){return n?y(n)||F(n)?l({},n):n:null}(t);let{class:n,style:e}=t;n&&!c(n)&&(t.class=h(n)),a(e)&&(y(e)&&!s(e)&&(e=l({},e)),t.style=u(e))}const _=c(n)?1:(n=>n.__isSuspense)(n)?128:(n=>n.__isTeleport)(n)?64:a(n)?4:o(n)?2:0;return N(n,t,e,r,i,_,p,!0)};function I(n,t,l=!1){const{props:o,ref:c,patchFlag:r,children:a}=n,i=t?function(...n){const t={};for(let l=0;l{let l;return(l=n[t])||(l=n[t]=[]),l.push(e),n=>{l.length>1?l.forEach((t=>t(n))):l[0](n)}};t("__VUE_INSTANCE_SETTERS__",(n=>n)),t("__VUE_SSR_SETTERS__",(n=>n))}const V={class:"new-component"};n.render=function(n,t,e,l,s,o){return function(n=!1){E.push(k=n?null:[])}(),x(N("p",V,"New Component - belowEmailFields",c,r,a,!0));var c,r,a},n.__file="src/components/belowEmailFields/belowEmailFields.vue";export{n as default}; diff --git a/view/frontend/web/js/checkout/dist/styles.css b/view/frontend/web/js/checkout/dist/styles.css index 0fa50f4..421a341 100644 --- a/view/frontend/web/js/checkout/dist/styles.css +++ b/view/frontend/web/js/checkout/dist/styles.css @@ -1,21 +1,5 @@ -#gene-better-checkout-root #specified-day .divider-line { - border-top: var(--divider__border); - margin-top: var(--indent__base); -} -#gene-better-checkout-root #specified-day .shipping-method__label { - display: block; -} -#gene-better-checkout-root #specified-day .header { - display: flex; -} -#gene-better-checkout-root #specified-day .am-delivery-checkbox { - margin-top: var(--indent__base); -} -#gene-better-checkout-root #specified-day .am-delivery-container { - display: flex; - align-items: center; -} -#gene-better-checkout-root #specified-day .am-delivery-details { - position: relative; - top: 10px; +#bluefinch-checkout-root .new-component { + background-color: var(--color__semantic-success-light); + border: 1px solid var(--color__semantic-success); + padding: var(--indent__s); } \ No newline at end of file diff --git a/view/frontend/web/js/checkout/package-lock.json b/view/frontend/web/js/checkout/package-lock.json index b4b5312..e9236c0 100644 --- a/view/frontend/web/js/checkout/package-lock.json +++ b/view/frontend/web/js/checkout/package-lock.json @@ -1,11 +1,11 @@ { - "name": "gene-better-checkout-new-module", + "name": "bluefinch-checkout-new-module", "version": "1.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "gene-better-checkout-new-module", + "name": "bluefinch-checkout-new-module", "license": "ISC", "dependencies": { "lodash.debounce": "^4.0.8", @@ -22,6 +22,7 @@ "eslint-plugin-jest": "^28.2.0", "eslint-plugin-vue": "^9.25.0", "rollup": "^4.14.3", + "rollup-plugin-delete": "^2.1.0", "rollup-plugin-multi-input": "^1.4.1", "rollup-plugin-scss": "^3.0.0", "rollup-plugin-svg": "^2.0.0", @@ -615,6 +616,17 @@ "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==", "dev": true }, + "node_modules/@types/glob": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.2.0.tgz", + "integrity": "sha512-ZUxbzKl0IfJILTS6t7ip5fQQM/J3TJYubDm3nMbgubNNYS62eXeUpoLUC8/7fJNiFYHTrGPQn7hspDUzIHX3UA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/minimatch": "*", + "@types/node": "*" + } + }, "node_modules/@types/json-schema": { "version": "7.0.15", "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz", @@ -627,6 +639,23 @@ "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==", "dev": true }, + "node_modules/@types/minimatch": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-5.1.2.tgz", + "integrity": "sha512-K0VQKziLUWkVKiRVrx4a40iPaxTUefQmjtkQofBkYRcoaaL/8rhwDWww9qWbrgicNOgnpIsMxyNIUM4+n6dUIA==", + "dev": true, + "license": "MIT" + }, + "node_modules/@types/node": { + "version": "22.10.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.2.tgz", + "integrity": "sha512-Xxr6BBRCAOQixvonOye19wnzyDiUtTeqldOOmj3CkeblonbccA12PFwlufvRdrpjXxqnmUaeiU5EOA+7s5diUQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "undici-types": "~6.20.0" + } + }, "node_modules/@types/resolve": { "version": "1.20.2", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.20.2.tgz", @@ -896,6 +925,20 @@ "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0" } }, + "node_modules/aggregate-error": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/aggregate-error/-/aggregate-error-3.1.0.tgz", + "integrity": "sha512-4I7Td01quW/RpocfNayFdFVk1qSuoh0E7JrbRJ16nH01HhKFQ88INq9Sd+nd72zqRySlr9BmDA8xlEJ6vJMrYA==", + "dev": true, + "license": "MIT", + "dependencies": { + "clean-stack": "^2.0.0", + "indent-string": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/ajv": { "version": "6.12.6", "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", @@ -1302,6 +1345,16 @@ "fsevents": "~2.3.2" } }, + "node_modules/clean-stack": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz", + "integrity": "sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6" + } + }, "node_modules/color-convert": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", @@ -1498,6 +1551,92 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/del": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/del/-/del-5.1.0.tgz", + "integrity": "sha512-wH9xOVHnczo9jN2IW68BabcecVPxacIA3g/7z6vhSU/4stOKQzeCRK0yD0A24WiAAUJmmVpWqrERcTxnLo3AnA==", + "dev": true, + "license": "MIT", + "dependencies": { + "globby": "^10.0.1", + "graceful-fs": "^4.2.2", + "is-glob": "^4.0.1", + "is-path-cwd": "^2.2.0", + "is-path-inside": "^3.0.1", + "p-map": "^3.0.0", + "rimraf": "^3.0.0", + "slash": "^3.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/del/node_modules/brace-expansion": { + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", + "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "dev": true, + "license": "MIT", + "dependencies": { + "balanced-match": "^1.0.0", + "concat-map": "0.0.1" + } + }, + "node_modules/del/node_modules/glob": { + "version": "7.2.3", + "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", + "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", + "deprecated": "Glob versions prior to v9 are no longer supported", + "dev": true, + "license": "ISC", + "dependencies": { + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^3.1.1", + "once": "^1.3.0", + "path-is-absolute": "^1.0.0" + }, + "engines": { + "node": "*" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/del/node_modules/globby": { + "version": "10.0.2", + "resolved": "https://registry.npmjs.org/globby/-/globby-10.0.2.tgz", + "integrity": "sha512-7dUi7RvCoT/xast/o/dLN53oqND4yk0nsHkhRgn9w65C4PofCLOoJ39iSOg+qVDdWQPIEj+eszMHQ+aLVwwQSg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/glob": "^7.1.1", + "array-union": "^2.1.0", + "dir-glob": "^3.0.1", + "fast-glob": "^3.0.3", + "glob": "^7.1.3", + "ignore": "^5.1.1", + "merge2": "^1.2.3", + "slash": "^3.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/del/node_modules/minimatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", + "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "dev": true, + "license": "ISC", + "dependencies": { + "brace-expansion": "^1.1.7" + }, + "engines": { + "node": "*" + } + }, "node_modules/dequal": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz", @@ -2592,6 +2731,13 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/graceful-fs": { + "version": "4.2.11", + "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz", + "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==", + "dev": true, + "license": "ISC" + }, "node_modules/graphemer": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/graphemer/-/graphemer-1.4.0.tgz", @@ -2725,6 +2871,16 @@ "node": ">=0.8.19" } }, + "node_modules/indent-string": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz", + "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, "node_modules/inflight": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", @@ -2997,6 +3153,16 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-path-cwd": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz", + "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6" + } + }, "node_modules/is-path-inside": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.3.tgz", @@ -3609,6 +3775,19 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/p-map": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/p-map/-/p-map-3.0.0.tgz", + "integrity": "sha512-d3qXVTF/s+W+CdJ5A29wywV2n8CQQYahlgz2bFiA+4eVNJbHJodPZ+/gXwPGh0bOqA+j8S+6+ckmvLGPk1QpxQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "aggregate-error": "^3.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/parent-module": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz", @@ -4028,6 +4207,22 @@ "fsevents": "~2.3.2" } }, + "node_modules/rollup-plugin-delete": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/rollup-plugin-delete/-/rollup-plugin-delete-2.1.0.tgz", + "integrity": "sha512-TEbqJd7giLvzQDTu4jSPufwhTJs/iYVN2LfR/YIYkqjC/oZ0/h9Q0AeljifIhzBzJYZtHQTWKEbMms5fbh54pw==", + "dev": true, + "license": "MIT", + "dependencies": { + "del": "^5.1.0" + }, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "rollup": "*" + } + }, "node_modules/rollup-plugin-multi-input": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/rollup-plugin-multi-input/-/rollup-plugin-multi-input-1.4.1.tgz", @@ -4675,6 +4870,13 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/undici-types": { + "version": "6.20.0", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.20.0.tgz", + "integrity": "sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==", + "dev": true, + "license": "MIT" + }, "node_modules/uri-js": { "version": "4.4.1", "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz", diff --git a/view/frontend/web/js/checkout/package.json b/view/frontend/web/js/checkout/package.json index 551f038..7ee0c2d 100644 --- a/view/frontend/web/js/checkout/package.json +++ b/view/frontend/web/js/checkout/package.json @@ -1,10 +1,11 @@ { - "name": "gene-better-checkout-new-module", + "name": "bluefinch-checkout-new-module", "description": "", "main": "index.js", "type": "module", "scripts": { "build": "rollup -c rollup.config.js", + "build-watch": "rollup -c rollup.config.js --watch", "test": "echo \"Error: no test specified\" && exit 1", "lint": "eslint --quiet --ext .js,.vue src", "lint-fix": "eslint --quiet --ext .js,.vue src --fix" @@ -17,19 +18,20 @@ "vue": "^3.4.20" }, "devDependencies": { - "@vue/eslint-config-airbnb": "^8.0.0", "@rollup/plugin-commonjs": "^25.0.7", "@rollup/plugin-node-resolve": "^15.2.3", "@rollup/plugin-replace": "^5.0.5", "@rollup/plugin-terser": "^0.4.4", + "@vue/eslint-config-airbnb": "^8.0.0", + "eslint": "^8.57.0", + "eslint-plugin-jest": "^28.2.0", + "eslint-plugin-vue": "^9.25.0", "rollup": "^4.14.3", + "rollup-plugin-delete": "^2.1.0", "rollup-plugin-multi-input": "^1.4.1", "rollup-plugin-scss": "^3.0.0", "rollup-plugin-svg": "^2.0.0", "rollup-plugin-vue": "^6.0.0", - "sass": "^1.75.0", - "eslint": "^8.57.0", - "eslint-plugin-jest": "^28.2.0", - "eslint-plugin-vue": "^9.25.0" + "sass": "^1.75.0" } } diff --git a/view/frontend/web/js/checkout/rollup.config.js b/view/frontend/web/js/checkout/rollup.config.js index a50e41b..cc9d2a5 100644 --- a/view/frontend/web/js/checkout/rollup.config.js +++ b/view/frontend/web/js/checkout/rollup.config.js @@ -3,14 +3,17 @@ import { nodeResolve } from '@rollup/plugin-node-resolve'; import replace from '@rollup/plugin-replace'; import multiInput from 'rollup-plugin-multi-input'; import commonjs from '@rollup/plugin-commonjs'; +import del from 'rollup-plugin-delete'; import scss from 'rollup-plugin-scss'; import svg from 'rollup-plugin-svg'; import terser from '@rollup/plugin-terser'; +const dir = process.argv.includes('--watch') ? './dist-dev' : './dist'; + export default { input: ['src/callbacks/**/*.js', 'src/components/**/*.vue'], output: { - dir: 'dist', + dir, chunkFileNames: '[name]-[hash].min.js', }, plugins: [ @@ -24,7 +27,8 @@ export default { transformOutputPath: (output, input) => `${output.replace(/(.+)+(.js|.vue)/, '$1.min$2')}`, }), commonjs(), - scss({ output: 'dist/styles.css' }), + del({ targets: `${dir}/*` }), + scss({ watch: 'src', output: `${dir}/styles.css` }), svg(), terser(), ], diff --git a/view/frontend/web/js/checkout/src/callbacks/onNewCallback.js b/view/frontend/web/js/checkout/src/callbacks/onNewCallback.js deleted file mode 100644 index b79b327..0000000 --- a/view/frontend/web/js/checkout/src/callbacks/onNewCallback.js +++ /dev/null @@ -1,3 +0,0 @@ -export default async () => { - console.log('New callback'); -}; diff --git a/view/frontend/web/js/checkout/src/callbacks/onStepsCreated.js b/view/frontend/web/js/checkout/src/callbacks/onStepsCreated.js new file mode 100644 index 0000000..1ff557c --- /dev/null +++ b/view/frontend/web/js/checkout/src/callbacks/onStepsCreated.js @@ -0,0 +1,3 @@ +export default async () => { + console.log('New Component - onStepsCreated'); +}; diff --git a/view/frontend/web/js/checkout/src/components/NewComponent/NewComponentStyles.scss b/view/frontend/web/js/checkout/src/components/NewComponent/NewComponentStyles.scss deleted file mode 100644 index 756ac9f..0000000 --- a/view/frontend/web/js/checkout/src/components/NewComponent/NewComponentStyles.scss +++ /dev/null @@ -1,27 +0,0 @@ -#gene-better-checkout-root { - #specified-day { - .divider-line { - border-top: var(--divider__border); - margin-top: var(--indent__base); - } - .shipping-method__label { - display: block; - } - .header { - display: flex; - } - .am-delivery { - &-checkbox { - margin-top: var(--indent__base); - } - &-container { - display: flex; - align-items: center; - } - &-details { - position: relative; - top: 10px; - } - } - } -} diff --git a/view/frontend/web/js/checkout/src/components/belowEmailFields/NewComponentStyles.scss b/view/frontend/web/js/checkout/src/components/belowEmailFields/NewComponentStyles.scss new file mode 100644 index 0000000..5dc38e4 --- /dev/null +++ b/view/frontend/web/js/checkout/src/components/belowEmailFields/NewComponentStyles.scss @@ -0,0 +1,7 @@ +#bluefinch-checkout-root { + .new-component { + background-color: var(--color__semantic-success-light); + border: 1px solid var(--color__semantic-success); + padding: var(--indent__s); + } +} diff --git a/view/frontend/web/js/checkout/src/components/NewComponent/NewComponent.vue b/view/frontend/web/js/checkout/src/components/belowEmailFields/belowEmailFields.vue similarity index 70% rename from view/frontend/web/js/checkout/src/components/NewComponent/NewComponent.vue rename to view/frontend/web/js/checkout/src/components/belowEmailFields/belowEmailFields.vue index 43f9c98..0f517a1 100644 --- a/view/frontend/web/js/checkout/src/components/NewComponent/NewComponent.vue +++ b/view/frontend/web/js/checkout/src/components/belowEmailFields/belowEmailFields.vue @@ -1,5 +1,5 @@