16 |
22 | { /* 17 | 18 | { strings.limitedTimeOffer }: { strings.bannerCopy } 19 |
20 |{ strings.discountCopy }
21 |{strings.bannerHeading}
*/ } 23 |
21 |
33 |
34 | );
35 | };
36 |
--------------------------------------------------------------------------------
/src/free-trial/tax/components/partner-card.scss:
--------------------------------------------------------------------------------
1 | .woocommerce-tax-partner-card {
2 | border: 1px solid $gray-300;
3 | border-radius: 3px;
4 | margin: 0 $gap-smaller $gap $gap-smaller;
5 | padding: 20px;
6 | display: flex;
7 | flex-direction: column;
8 |
9 | a {
10 | text-decoration: none;
11 | }
12 | }
13 |
14 | .woocommerce-tax-partner-card__logo {
15 | margin-bottom: $gap-smaller;
16 | img {
17 | max-height: 35px;
18 | }
19 | }
20 |
21 | .woocommerce-tax-partner-card__description {
22 | color: $gray-700;
23 | }
24 |
25 | .woocommerce-tax-partner-card__benefits {
26 | color: $gray-900;
27 | list-style: none;
28 | li {
29 | margin-bottom: $gap-smaller;
30 | display: flex;
31 |
32 | svg {
33 | margin-right: 10px;
34 | }
35 | }
36 | }
37 |
38 | .woocommerce-tax-partner-card__action {
39 | margin-top: auto;
40 | }
41 |
42 | .woocommerce-tax-partner-card__terms {
43 | color: $gray-600;
44 | font-size: 9px;
45 | margin-bottom: $gap-smaller;
46 | }
47 |
48 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "outDir": "./build/",
4 | // Target latest version of ECMAScript.
5 | "target": "esnext",
6 | // Search under node_modules for non-relative imports.
7 | "moduleResolution": "node",
8 | // Process & infer types from .js files.
9 | "allowJs": true,
10 | "jsx": "preserve",
11 | // Don't emit; allow Babel to transform files.
12 | "noEmit": true,
13 | // Enable strictest settings like strictNullChecks & noImplicitAny.
14 | "strict": true,
15 | // Import non-ES modules as default imports.
16 | "esModuleInterop": true,
17 | "skipLibCheck": false,
18 | "module": "esnext",
19 | "baseUrl": "./",
20 | "paths": {
21 | "~/*": [ "src/*" ]
22 | },
23 | "typeRoots": [ "./typings", "./node_modules/@types" ],
24 | },
25 | "exclude": [
26 | "node_modules",
27 | "**/build",
28 | "**/jest.config.js",
29 | "**/jest-preset.js",
30 | "**/webpack.*.js",
31 | "**/babel.config.js"
32 | ],
33 | "include": [ "typings/**/*", "src/**/*" ]
34 | }
35 |
--------------------------------------------------------------------------------
/src/payment-gateway-suggestions/components/Toggle/Toggle.js:
--------------------------------------------------------------------------------
1 | /**
2 | * External dependencies
3 | */
4 | import { Button } from '@wordpress/components';
5 | import ChevronUpIcon from 'gridicons/dist/chevron-up';
6 | import ChevronDownIcon from 'gridicons/dist/chevron-down';
7 | import { useState } from '@wordpress/element';
8 |
9 | /**
10 | * Internal dependencies
11 | */
12 | import './Toggle.scss';
13 |
14 | export const Toggle = ( { children, heading, onToggle } ) => {
15 | const [ isShow, setIsShow ] = useState( false );
16 | const onClick = () => {
17 | onToggle( isShow );
18 | setIsShow( ! isShow );
19 | };
20 |
21 | return (
22 |
23 |
37 | { isShow ? children : null }
38 |
39 | );
40 | };
41 |
--------------------------------------------------------------------------------
/src/free-trial/tax/woocommerce-tax/setup.scss:
--------------------------------------------------------------------------------
1 | .woocommerce-task-tax__automated-tax-control {
2 | display: flex;
3 | align-items: center;
4 | margin-top: $gap;
5 |
6 | i {
7 | margin-left: $gap;
8 | margin-right: $gap-large;
9 | }
10 |
11 | .woocommerce-task-tax__automated-tax-control-inner {
12 | border-top: 1px solid $studio-gray-5;
13 | display: flex;
14 | align-items: center;
15 | flex: 1;
16 | font-size: 16px;
17 | padding-top: $gap;
18 | padding-bottom: $gap;
19 | }
20 |
21 | .components-form-toggle {
22 | margin-left: auto;
23 | }
24 | }
25 |
26 | .woocommerce-task-tax__success {
27 | display: flex;
28 | flex-direction: column;
29 | align-items: center;
30 | padding: $gap-largest;
31 | text-align: center;
32 |
33 | .woocommerce-task-tax__success-icon {
34 | font-size: 48px;
35 | height: 48px;
36 | align-items: center;
37 | display: flex;
38 | }
39 |
40 | #woocommerce-task-tax__success-message {
41 | font-size: 32px;
42 | font-weight: 400;
43 | }
44 |
45 | p {
46 | margin-top: 0;
47 | font-size: 16px;
48 | }
49 | }
50 |
--------------------------------------------------------------------------------
/src/launch-store/images/products_icon.js:
--------------------------------------------------------------------------------
1 | export default () => (
2 | /* eslint-disable */
3 |
17 | /* eslint-enable */
18 | );
19 |
--------------------------------------------------------------------------------
/assets/css/free-trial-plan-picker-banner.css:
--------------------------------------------------------------------------------
1 | #free-trial-plan-picker-banner {
2 | background-color: #c9356e;
3 | color: #ffffff;
4 | font-size: 0.8125em;
5 | position: sticky;
6 | z-index: 99999;
7 | padding: 5px;
8 | text-align: center;
9 | top: calc( var( --wp-admin--admin-bar--height, 0px ) ) !important;
10 | }
11 |
12 | #free-trial-plan-picker-banner a {
13 | color: #ffffff !important;
14 | text-decoration: underline;
15 | }
16 |
17 | /**
18 | * Store notice can be at the top or bottom depending on the activated theme.
19 | * Force it to be at the bottom all the time to place the free trial banner at the top.
20 | */
21 | body.has-free-trial-plan-picker .woocommerce-store-notice {
22 | top: auto !important;
23 | }
24 |
25 | @media screen and (max-width: 782px) {
26 | html {
27 | --wp-admin--admin-bar--height: 46px !important;
28 | }
29 | }
30 |
31 | @media screen and (max-width: 480px) {
32 | #free-trial-plan-picker-banner {
33 | position: inherit;
34 | }
35 | }
36 |
37 | body.hide-free-trial-plan-picker #free-trial-plan-picker-banner {
38 | display: none;
39 | }
--------------------------------------------------------------------------------
/src/stylesheets/_variables.scss:
--------------------------------------------------------------------------------
1 | @import '@automattic/color-studio/dist/color-variables.scss';
2 | @import '@wordpress/base-styles/colors.scss';
3 |
4 | // Think very carefully before adding a new breakpoint.
5 | // The list below is based on wp-admin's main breakpoints
6 | // See https://github.com/WordPress/gutenberg/tree/master/packages/viewport#usage
7 | $breakpoints: 480px, 600px, 782px, 960px, 1280px, 1440px;
8 | $grid-unit: 8px;
9 | $grid-unit-50: 5 * $grid-unit; // 40px
10 | $grid-unit-20: 2 * $grid-unit; // 16px
11 | $grid-unit-30: 3 * $grid-unit; // 24px
12 | $grid-unit-10: 1 * $grid-unit; // 8px
13 | $grid-unit-15: 1.5 * $grid-unit; // 12px
14 | $grid-unit-05: 0.5 * $grid-unit; // 4px
15 | $gap-largest: $grid-unit-50;
16 | $gap-larger: 4.5 * $grid-unit;
17 | $gap-large: $grid-unit-30;
18 | $gap: $grid-unit-20;
19 | $gap-small: $grid-unit-15;
20 | $gap-smaller: $grid-unit-10;
21 | $gap-smallest: $grid-unit-05;
22 |
23 | $studio-gray-60: #50575e;
24 | $studio-gray-80: #2c3338;
25 | $gray-700: #757575; // Meets 4.6:1 text contrast against white.
26 | $studio-gray-5: #dcdcde;
27 | $studio-gray-90: #1d2327;
28 | $studio-gray-50: #646970;
29 |
--------------------------------------------------------------------------------
/src/free-trial/tax/woocommerce-tax/connect.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * External dependencies
3 | */
4 | import { __ } from '@wordpress/i18n';
5 | import { recordEvent, queueRecordEvent } from '@woocommerce/tracks';
6 |
7 | /**
8 | * Internal dependencies
9 | */
10 | import { default as ConnectForm } from '../components/connect-form';
11 | import { SetupStepProps } from './setup';
12 |
13 | export const Connect: React.FC< SetupStepProps > = ( {
14 | onDisable,
15 | onManual,
16 | } ) => {
17 | return (
18 |
23 | (
26 |
35 | );
36 | };
37 |
--------------------------------------------------------------------------------
/assets/css/free-trial-admin.css:
--------------------------------------------------------------------------------
1 | .wc-calypso-notice {
2 | background: #fff;
3 | border: 1px solid #c3c4c7;
4 | border-left-width: 4px;
5 | box-shadow: 0 1px 1px rgb( 0 0 0 / 4% );
6 | border-left-color: var( --wp-admin-theme-color );
7 | padding: 12px 16px;
8 | margin: 0 0 24px 0;
9 | }
10 |
11 | .wc-calypso-notice a {
12 | color: #007cba;
13 | }
14 |
15 | .free-trial-orders-notice {
16 | padding: 12px !important;
17 | display: flex;
18 | border-left-color: var( --wp-admin-theme-color );
19 | }
20 |
21 | .free-trial-orders-notice h3 {
22 | font-weight: 600;
23 | line-height: 20px;
24 | font-size: 14px;
25 | color: #3c434a;
26 | margin: 0;
27 | }
28 |
29 | .free-trial-orders-notice p {
30 | padding: 3px 0 3px 0;
31 | margin: 0px;
32 | }
33 |
34 | .free-trial-orders-notice .upgrade-action {
35 | display: flex;
36 | flex: 1;
37 | align-items: center;
38 | justify-content: end;
39 | }
40 |
41 | .woocommerce-task-list__setup
42 | .woocommerce-experimental-list
43 | .woocommerce-experimental-list__item.complete {
44 | color: var( --wp-admin-theme-color );
45 | }
46 |
47 | .woocommerce-task-tax__success {
48 | flex-direction: row !important;
49 | padding: 0 !important;
50 | }
--------------------------------------------------------------------------------
/src/payments-welcome/tracks.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * External dependencies
3 | */
4 | import domReady from '@wordpress/dom-ready';
5 |
6 | /**
7 | * Checks if site tracking is enabled.
8 | *
9 | * @return {boolean} True if site tracking is enabled.
10 | */
11 | function isEnabled() {
12 | return window.wcTracks.isEnabled;
13 | }
14 |
15 | /**
16 | * Records site event.
17 | *
18 | * @param {string} eventName Name of the event.
19 | * @param {Object?} eventProperties Event properties.
20 | */
21 | function recordEvent( eventName: string, eventProperties?: object ) {
22 | // Wc-admin track script is enqueued after ours, wrap in domReady
23 | // to make sure we're not too early.
24 | domReady( () => {
25 | const recordFunction =
26 | window.wc?.tracks?.recordEvent ?? window.wcTracks.recordEvent;
27 | recordFunction( eventName, eventProperties );
28 | } );
29 | }
30 |
31 | const events = {
32 | CONNECT_ACCOUNT_CLICKED: 'wcpay_connect_account_clicked',
33 | CONNECT_ACCOUNT_LEARN_MORE: 'wcpay_welcome_learn_more',
34 | CONNECT_ACCOUNT_VIEW: 'page_view',
35 | SURVEY_FEEDBACK: 'wcpay_exit_survey',
36 | };
37 |
38 | export default {
39 | isEnabled,
40 | recordEvent,
41 | events,
42 | };
43 |
--------------------------------------------------------------------------------
/src/wc-navigation-root-url.js:
--------------------------------------------------------------------------------
1 | /**
2 | * External dependencies
3 | */
4 | import { addFilter } from '@wordpress/hooks';
5 |
6 | /**
7 | * Internal dependencies
8 | */
9 | import storage from './utils/storage';
10 |
11 | const LOCAL_STORAGE_PROP = 'wc_nav_root_url_referrer';
12 |
13 | const rootUrlStorage = storage( LOCAL_STORAGE_PROP, null );
14 |
15 | const getRedirectUrl = ( homeUrl ) => {
16 | const protocolRegex = /.*?:\/\//i;
17 | const slug = homeUrl.replace( protocolRegex, '' ).replace( '/', '::' );
18 |
19 | return `https://wordpress.com/home/${ slug }`;
20 | };
21 |
22 | export default () => {
23 | const { isWooPage, homeUrl } = window.wcCalypsoBridge;
24 | const fromCalypso =
25 | document.referrer.indexOf( 'https://wordpress.com' ) === 0;
26 |
27 | if ( fromCalypso ) {
28 | rootUrlStorage.set( 'calypso' );
29 | } else if ( ! isWooPage ) {
30 | rootUrlStorage.set( 'wcadmin' );
31 | }
32 |
33 | // Only continue to add filter if referred by Calypso
34 | if ( rootUrlStorage.get() !== 'calypso' ) {
35 | return;
36 | }
37 |
38 | addFilter(
39 | 'woocommerce_navigation_root_back_url',
40 | 'wc-calypso-bridge',
41 | () => getRedirectUrl( homeUrl )
42 | );
43 | };
44 |
--------------------------------------------------------------------------------
/.eslintrc.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | extends: [ 'plugin:@woocommerce/eslint-plugin/recommended' ],
3 | overrides: [
4 | {
5 | files: [ '**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx' ],
6 | rules: {
7 | 'react/react-in-jsx-scope': 'off',
8 | '@wordpress/i18n-text-domain': [
9 | 'error',
10 | {
11 | allowedTextDomain: [
12 | 'wc-calypso-bridge',
13 | 'woocommerce',
14 | ],
15 | },
16 | ],
17 | },
18 | },
19 | ],
20 | settings: {
21 | 'import/core-modules': [
22 | '@woocommerce/admin-layout',
23 | '@woocommerce/block-templates',
24 | '@woocommerce/components',
25 | '@woocommerce/customer-effort-score',
26 | '@woocommerce/currency',
27 | '@woocommerce/data',
28 | '@woocommerce/experimental',
29 | '@woocommerce/expression-evaluation',
30 | '@woocommerce/navigation',
31 | '@woocommerce/number',
32 | '@woocommerce/settings',
33 | '@woocommerce/tracks',
34 | '@testing-library/react',
35 | 'react',
36 | 'react-router-dom',
37 | 'prop-types',
38 | 'lodash',
39 | ],
40 | 'import/resolver': {
41 | node: {
42 | extensions: [ '.js', '.jsx', '.ts', '.tsx' ],
43 | },
44 | },
45 | },
46 | };
47 |
--------------------------------------------------------------------------------
/languages/wc-calypso-bridge-id_ID-beb9e19fb5e7cb316b39d09ff6ca8bdf.json:
--------------------------------------------------------------------------------
1 | {"translation-revision-date":"2025-03-25 09:54:03+0000","generator":"WP-CLI\/2.10.0","source":"build\/53.js","domain":"messages","locale_data":{"messages":{"":{"domain":"messages","lang":"id","plural-forms":"nplurals=2; plural=n > 1;"},"Payment illustration":["Ilustrasi pembayaran"],"By clicking \"Test payments\", you agree to the {{tosLink}}Terms of Service{{\/tosLink}}":["Dengan mengeklik \"Uji pembayaran,\" Anda setuju dengan {{tosLink}}Ketentuan Layanan{{\/tosLink}}"],"Power your payments with a simple, all-in-one option. Verify your business details to start testing transactions with WooCommerce Payments.":["Perkuat sistem pembayaran Anda dengan pilihan lengkap dan mudah. Periksa detail bisnis Anda untuk mulai menguji transaksi dengan WooCommerce Payments."],"Test payments":["Uji pembayaran"],"Give your customers an easy and convenient way to pay! Set up and test some of our fast and secure online or in person payment methods.":["Hadirkan metode pembayaran yang praktis dan mudah untuk pelanggan! Siapkan dan uji beberapa metode pembayaran langsung atau online yang cepat dan aman."],"It\u2019s time to test payments":["Kini saatnya menguji pembayaran"]}}}
--------------------------------------------------------------------------------
/src/payment-gateway-suggestions/components/List/List.js:
--------------------------------------------------------------------------------
1 | /**
2 | * External dependencies
3 | */
4 | import { Card, CardHeader, CardFooter } from '@wordpress/components';
5 |
6 | /**
7 | * Internal dependencies
8 | */
9 | import { Item } from './Item';
10 |
11 | import './List.scss';
12 |
13 | export const List = ( {
14 | heading,
15 | headingDescription,
16 | markConfigured,
17 | recommendation,
18 | paymentGateways,
19 | footerLink,
20 | } ) => {
21 | return (
22 |
27 |
31 |
32 | ) }
33 | />
34 | 28 | { headingDescription } 29 |
30 | ) } 31 |
32 |
37 | );
38 | };
39 |
40 | // shows up at http://host/wp-admin/admin.php?page=wc-admin&task=woocommerce-payments which is the default url for woocommerce-payments task
41 | export const WoocommercePaymentsTaskPage = () => (
42 |
34 | Preparing payment settings...
35 |
36 |
35 | { children }
36 |
37 | -
38 |
- 39 | 49 | 50 |
- 51 | 61 | 62 |
36 |
37 |
38 |
39 |
43 |
40 |
41 |
42 |
44 |
45 |
46 |
33 |
72 | );
73 | };
74 |
--------------------------------------------------------------------------------
/languages/wc-calypso-bridge-ja-beb9e19fb5e7cb316b39d09ff6ca8bdf.json:
--------------------------------------------------------------------------------
1 | {"translation-revision-date":"2025-03-26 09:54:03+0000","generator":"WP-CLI\/2.10.0","source":"build\/53.js","domain":"messages","locale_data":{"messages":{"":{"domain":"messages","lang":"ja_JP","plural-forms":"nplurals=1; plural=0;"},"Payment illustration":["\u652f\u6255\u3044\u306e\u30a4\u30e9\u30b9\u30c8"],"By clicking \"Test payments\", you agree to the {{tosLink}}Terms of Service{{\/tosLink}}":["\u300c\u652f\u6255\u3044\u3092\u30c6\u30b9\u30c8\u300d\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u3001{{tosLink}}\u5229\u7528\u898f\u7d04{{\/tosLink}}\u306b\u540c\u610f\u3057\u305f\u3082\u306e\u3068\u307f\u306a\u3055\u308c\u307e\u3059\u3002"],"Power your payments with a simple, all-in-one option. Verify your business details to start testing transactions with WooCommerce Payments.":["\u30b7\u30f3\u30d7\u30eb\u306a\u30aa\u30fc\u30eb\u30a4\u30f3\u30ef\u30f3\u30aa\u30d7\u30b7\u30e7\u30f3\u3067\u652f\u6255\u3044\u3092\u5f37\u5316\u3057\u307e\u3059\u3002 \u30d3\u30b8\u30cd\u30b9\u306e\u8a73\u7d30\u3092\u78ba\u8a8d\u3059\u308b\u3068\u3001WooCommerce Payments \u3067\u30c8\u30e9\u30f3\u30b6\u30af\u30b7\u30e7\u30f3\u306e\u30c6\u30b9\u30c8\u3092\u958b\u59cb\u3067\u304d\u307e\u3059\u3002"],"Test payments":["\u652f\u6255\u3044\u3092\u30c6\u30b9\u30c8"],"Give your customers an easy and convenient way to pay! Set up and test some of our fast and secure online or in person payment methods.":["\u304a\u5ba2\u69d8\u306b\u7c21\u5358\u3067\u4fbf\u5229\u306a\u6c7a\u6e08\u65b9\u6cd5\u3092\u63d0\u4f9b\u3057\u307e\u3059\u3002 \u8fc5\u901f\u3067\u5b89\u5168\u306a\u30aa\u30f3\u30e9\u30a4\u30f3\u307e\u305f\u306f\u30aa\u30d5\u30e9\u30a4\u30f3\u3067\u306e\u652f\u6255\u3044\u65b9\u6cd5\u306e\u4e00\u90e8\u3092\u8a2d\u5b9a\u3057\u3066\u30c6\u30b9\u30c8\u3057\u307e\u3059\u3002"],"It\u2019s time to test payments":["\u652f\u6255\u3044\u3092\u30c6\u30b9\u30c8\u3057\u307e\u3059"]}}}
--------------------------------------------------------------------------------
/src/payment-gateway-suggestions/components/WCPay/UsageModal.js:
--------------------------------------------------------------------------------
1 | /**
2 | * External dependencies
3 | */
4 | import { __ } from '@wordpress/i18n';
5 | import { useState } from '@wordpress/element';
6 | import { getQuery, updateQueryString } from '@woocommerce/navigation';
7 | import interpolateComponents from '@automattic/interpolate-components';
8 | import { Link } from '@woocommerce/components';
9 |
10 | /**
11 | * Internal dependencies
12 | */
13 | import Modal from './Modal';
14 |
15 | export const UsageModal = () => {
16 | const query = getQuery();
17 | const shouldDisplayModal = query[ 'wcpay-connection-success' ] === '1';
18 | const [ isOpen, setIsOpen ] = useState( shouldDisplayModal );
19 |
20 | if ( ! isOpen ) {
21 | return null;
22 | }
23 |
24 | const closeModal = () => {
25 | setIsOpen( false );
26 | updateQueryString( { 'wcpay-connection-success': undefined } );
27 | };
28 |
29 | const title = __(
30 | 'Help us build a better WooCommerce Payments experience',
31 | 'woocommerce'
32 | );
33 | const trackingMessage = interpolateComponents( {
34 | mixedString: __(
35 | 'By agreeing to share non-sensitive {{link}}usage data{{/link}}, you’ll help us improve features and optimize the WooCommerce Payments experience. You can opt out at any time.',
36 | 'woocommerce'
37 | ),
38 | components: {
39 | link: (
40 |
45 | ),
46 | },
47 | } );
48 |
49 | return (
50 |
34 | 
35 |
36 |
37 |
38 | { description }
39 |
40 | -
41 | { benefits.map( ( benefit, i ) => {
42 | return (
43 |
-
47 |
48 |
49 | 50 | 51 | { benefit } 52 | 53 |
54 | );
55 | } ) }
56 |
59 |
71 |
60 | { terms }
61 |
62 |
70 |
36 |
55 | { notice }
37 | 48 |49 | { __( 'Get more sales', 'wc-calypso-bridge' ) } 50 |
51 |52 | { __( 'Launch your store', 'wc-calypso-bridge' ) } 53 |
54 |
21 |
29 |
52 | );
53 | } }
54 |
30 |
51 | 31 | { __( 'Add a domain', 'wc-calypso-bridge' ) } 32 |
33 |34 | { __( 35 | 'Choose a new website address for your store or transfer one you already own.', 36 | 'wc-calypso-bridge' 37 | ) } 38 |
39 | 46 |
47 | { ' ' }
48 | { task.time }
49 |
26 |
34 |
53 | );
54 | } }
55 |
35 |
52 | { taskTitle }
36 |{ taskDescription }
37 | 45 |
46 | { ' ' }
47 |
48 | { __( '2 minutes', 'woocommerce' ) }
49 |
50 |
42 | { generalSettings?.woocommerce_calc_taxes !== 'yes' && 43 | interpolateComponents( { 44 | mixedString: __( 45 | /*eslint-disable max-len*/ 46 | 'By clicking "Configure" you\'re enabling tax rates and calculations. More info {{link}}here{{/link}}.', 47 | 'woocommerce' 48 | ), 49 | components: { 50 | link: ( 51 | 56 | <> 57 | 58 | ), 59 | }, 60 | } ) } 61 |
62 | 63 | ); 64 | }; 65 | --------------------------------------------------------------------------------