diff --git a/.pnp.cjs b/.pnp.cjs index 5c8b574..f923e77 100755 --- a/.pnp.cjs +++ b/.pnp.cjs @@ -34,7 +34,7 @@ const RAW_RUNTIME_STATE = "reference": "workspace:packages/kratos-browser-flows"\ },\ {\ - "name": "@atls/react-payment-widget",\ + "name": "@atls/tinkoff-payment-widget",\ "reference": "workspace:packages/payment-widget"\ },\ {\ @@ -54,9 +54,9 @@ const RAW_RUNTIME_STATE = ["@atls/react-identity-links", ["workspace:packages/identity-links"]],\ ["@atls/react-identity-user-provider", ["workspace:packages/identity-user-provider"]],\ ["@atls/react-kratos-browser-flows", ["workspace:packages/kratos-browser-flows"]],\ - ["@atls/react-payment-widget", ["workspace:packages/payment-widget"]],\ ["@atls/react-upload", ["workspace:packages/upload"]],\ ["@atls/react-user", ["virtual:3ceedfe52a4367336e64693125ab45dbd4d5297af4b0beb13fa80c755b2a8540885a9beb615a2d0b3306600ad96d118e7015dd0916af8a4f315b5ede18134945#workspace:packages/user", "workspace:packages/user"]],\ + ["@atls/tinkoff-payment-widget", ["workspace:packages/payment-widget"]],\ ["reactjs", ["workspace:."]]\ ],\ "fallbackPool": [\ @@ -161,12 +161,12 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.12", {\ - "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-button-virtual-7dd46424ff/0/cache/@atls-ui-parts-button-npm-0.0.12-a8b9e60279-14f88ffbad.zip/node_modules/@atls-ui-parts/button/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.12", {\ + "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-button-virtual-98b35d75fa/0/cache/@atls-ui-parts-button-npm-0.0.12-a8b9e60279-14f88ffbad.zip/node_modules/@atls-ui-parts/button/",\ "packageDependencies": [\ - ["@atls-ui-parts/button", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.12"],\ - ["@atls-ui-parts/styles", "virtual:7dd46424ffcd115ef22adf93a563482cdf87938e6fdfd9ded415275e82cc314546f37c1cebe22ec4c157a55d728f38e9e083c337a724ce7d3affdcce430f4266#npm:0.0.4"],\ - ["@emotion/styled", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ + ["@atls-ui-parts/button", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.12"],\ + ["@atls-ui-parts/styles", "virtual:98b35d75fa62948b330b4c10997ee5db80fc8e3a1d4df5dc95e45cc4f9993347b3efa7a6ecee55daf8b72135291a6b0fbbcf5557df053826adf5058f293b6f64#npm:0.0.4"],\ + ["@emotion/styled", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ ["@types/emotion__styled", null],\ ["@types/react", "npm:18.2.20"],\ ["@types/styled-system", "npm:5.1.16"],\ @@ -196,16 +196,16 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.4", {\ - "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-condition-virtual-9402c47e26/0/cache/@atls-ui-parts-condition-npm-0.0.4-96f73c4b32-6d1a23d9da.zip/node_modules/@atls-ui-parts/condition/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.4", {\ + "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-condition-virtual-4d67cd8dc5/0/cache/@atls-ui-parts-condition-npm-0.0.4-96f73c4b32-6d1a23d9da.zip/node_modules/@atls-ui-parts/condition/",\ "packageDependencies": [\ - ["@atls-ui-parts/condition", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.4"],\ - ["@emotion/react", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ - ["@emotion/styled", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ + ["@atls-ui-parts/condition", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.4"],\ + ["@emotion/react", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ + ["@emotion/styled", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ ["@types/emotion__react", null],\ ["@types/emotion__styled", null],\ ["@types/react", "npm:18.2.20"],\ - ["framer-motion", "virtual:9402c47e26506f12508aaf7e48e81a30d173d12557d5533adf3608a486048c152160ec561f444ad7a689ca95ef9951e3fb3a45ad9fdb92c73afa57fd8c6a3d65#npm:10.12.16"],\ + ["framer-motion", "virtual:4d67cd8dc5067346d728d11b9fa6c3ea5b5f7c19b8417fd0d43dad733ad3d3ab25564901dc868458a3172bd0d0def599f0dc79be26a71302a3706cbd81668b66#npm:10.12.16"],\ ["react", "npm:18.2.0"]\ ],\ "packagePeers": [\ @@ -227,10 +227,10 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:28e203c16ceb5cce72ba4050c587b622f5b1c7f4a18a9dc9451e913afa5c1e93a28f8fe84b192e4599b1384d0839ea427c456798c8e8387295510ae97b4171e4#npm:0.0.4", {\ - "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-events-state-virtual-3357841bf9/0/cache/@atls-ui-parts-events-state-npm-0.0.4-85188071cf-6bb519eb06.zip/node_modules/@atls-ui-parts/events-state/",\ + ["virtual:803a97aa0a95fb8de5865cf5724db4e31b939b5b93cdf0438e18664b782548ef295c72f2bd910b722c4f75e68e512b852a60fd6b367e28c8721889ff980877da#npm:0.0.4", {\ + "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-events-state-virtual-362691527e/0/cache/@atls-ui-parts-events-state-npm-0.0.4-85188071cf-6bb519eb06.zip/node_modules/@atls-ui-parts/events-state/",\ "packageDependencies": [\ - ["@atls-ui-parts/events-state", "virtual:28e203c16ceb5cce72ba4050c587b622f5b1c7f4a18a9dc9451e913afa5c1e93a28f8fe84b192e4599b1384d0839ea427c456798c8e8387295510ae97b4171e4#npm:0.0.4"],\ + ["@atls-ui-parts/events-state", "virtual:803a97aa0a95fb8de5865cf5724db4e31b939b5b93cdf0438e18664b782548ef295c72f2bd910b722c4f75e68e512b852a60fd6b367e28c8721889ff980877da#npm:0.0.4"],\ ["@types/react", "npm:18.2.20"],\ ["react", "npm:18.2.0"]\ ],\ @@ -249,11 +249,11 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.6", {\ - "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-hidden-input-virtual-1d19685382/0/cache/@atls-ui-parts-hidden-input-npm-0.0.6-ad49ae516e-5f6ed9bb3c.zip/node_modules/@atls-ui-parts/hidden-input/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.6", {\ + "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-hidden-input-virtual-a20f96d81c/0/cache/@atls-ui-parts-hidden-input-npm-0.0.6-ad49ae516e-5f6ed9bb3c.zip/node_modules/@atls-ui-parts/hidden-input/",\ "packageDependencies": [\ - ["@atls-ui-parts/hidden-input", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.6"],\ - ["@emotion/styled", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ + ["@atls-ui-parts/hidden-input", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.6"],\ + ["@emotion/styled", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ ["@types/emotion__styled", null],\ ["@types/react", "npm:18.2.20"],\ ["react", "npm:18.2.0"]\ @@ -275,13 +275,13 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.13", {\ - "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-input-virtual-28e203c16c/0/cache/@atls-ui-parts-input-npm-0.0.13-dae40ee3f0-43d627a4e7.zip/node_modules/@atls-ui-parts/input/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.13", {\ + "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-input-virtual-803a97aa0a/0/cache/@atls-ui-parts-input-npm-0.0.13-dae40ee3f0-43d627a4e7.zip/node_modules/@atls-ui-parts/input/",\ "packageDependencies": [\ - ["@atls-ui-parts/input", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.13"],\ - ["@atls-ui-parts/events-state", "virtual:28e203c16ceb5cce72ba4050c587b622f5b1c7f4a18a9dc9451e913afa5c1e93a28f8fe84b192e4599b1384d0839ea427c456798c8e8387295510ae97b4171e4#npm:0.0.4"],\ - ["@atls-ui-parts/styles", "virtual:7dd46424ffcd115ef22adf93a563482cdf87938e6fdfd9ded415275e82cc314546f37c1cebe22ec4c157a55d728f38e9e083c337a724ce7d3affdcce430f4266#npm:0.0.4"],\ - ["@emotion/styled", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ + ["@atls-ui-parts/input", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.13"],\ + ["@atls-ui-parts/events-state", "virtual:803a97aa0a95fb8de5865cf5724db4e31b939b5b93cdf0438e18664b782548ef295c72f2bd910b722c4f75e68e512b852a60fd6b367e28c8721889ff980877da#npm:0.0.4"],\ + ["@atls-ui-parts/styles", "virtual:98b35d75fa62948b330b4c10997ee5db80fc8e3a1d4df5dc95e45cc4f9993347b3efa7a6ecee55daf8b72135291a6b0fbbcf5557df053826adf5058f293b6f64#npm:0.0.4"],\ + ["@emotion/styled", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ ["@types/emotion__styled", null],\ ["@types/react", "npm:18.2.20"],\ ["@types/styled-system", "npm:5.1.16"],\ @@ -311,12 +311,12 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.7", {\ - "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-layout-virtual-3026485964/0/cache/@atls-ui-parts-layout-npm-0.0.7-ea4d3f1780-9b09886c54.zip/node_modules/@atls-ui-parts/layout/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.7", {\ + "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-layout-virtual-1fd8fcf436/0/cache/@atls-ui-parts-layout-npm-0.0.7-ea4d3f1780-9b09886c54.zip/node_modules/@atls-ui-parts/layout/",\ "packageDependencies": [\ - ["@atls-ui-parts/layout", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.7"],\ + ["@atls-ui-parts/layout", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.7"],\ ["@emotion/is-prop-valid", "npm:1.2.1"],\ - ["@emotion/styled", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ + ["@emotion/styled", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ ["@types/emotion__styled", null],\ ["@types/react", "npm:18.2.20"],\ ["@types/styled-system", "npm:5.1.16"],\ @@ -342,10 +342,10 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:7dd46424ffcd115ef22adf93a563482cdf87938e6fdfd9ded415275e82cc314546f37c1cebe22ec4c157a55d728f38e9e083c337a724ce7d3affdcce430f4266#npm:0.0.4", {\ - "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-styles-virtual-92996b1555/0/cache/@atls-ui-parts-styles-npm-0.0.4-faa7b97a87-db71a0768b.zip/node_modules/@atls-ui-parts/styles/",\ + ["virtual:98b35d75fa62948b330b4c10997ee5db80fc8e3a1d4df5dc95e45cc4f9993347b3efa7a6ecee55daf8b72135291a6b0fbbcf5557df053826adf5058f293b6f64#npm:0.0.4", {\ + "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-styles-virtual-b9a9e8420a/0/cache/@atls-ui-parts-styles-npm-0.0.4-faa7b97a87-db71a0768b.zip/node_modules/@atls-ui-parts/styles/",\ "packageDependencies": [\ - ["@atls-ui-parts/styles", "virtual:7dd46424ffcd115ef22adf93a563482cdf87938e6fdfd9ded415275e82cc314546f37c1cebe22ec4c157a55d728f38e9e083c337a724ce7d3affdcce430f4266#npm:0.0.4"],\ + ["@atls-ui-parts/styles", "virtual:98b35d75fa62948b330b4c10997ee5db80fc8e3a1d4df5dc95e45cc4f9993347b3efa7a6ecee55daf8b72135291a6b0fbbcf5557df053826adf5058f293b6f64#npm:0.0.4"],\ ["@types/styled-system", "npm:5.1.16"],\ ["styled-system", "npm:5.1.5"]\ ],\ @@ -364,11 +364,11 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.11", {\ - "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-text-virtual-d27a5a1923/0/cache/@atls-ui-parts-text-npm-0.0.11-70c6e86690-5ff00c3eda.zip/node_modules/@atls-ui-parts/text/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.11", {\ + "packageLocation": "./.yarn/__virtual__/@atls-ui-parts-text-virtual-be182730bc/0/cache/@atls-ui-parts-text-npm-0.0.11-70c6e86690-5ff00c3eda.zip/node_modules/@atls-ui-parts/text/",\ "packageDependencies": [\ - ["@atls-ui-parts/text", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.11"],\ - ["@emotion/styled", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ + ["@atls-ui-parts/text", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.11"],\ + ["@emotion/styled", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ ["@types/emotion__styled", null],\ ["@types/react", "npm:18.2.20"],\ ["react", "npm:18.2.0"],\ @@ -507,31 +507,6 @@ const RAW_RUNTIME_STATE = "linkType": "SOFT"\ }]\ ]],\ - ["@atls/react-payment-widget", [\ - ["workspace:packages/payment-widget", {\ - "packageLocation": "./packages/payment-widget/",\ - "packageDependencies": [\ - ["@atls/react-payment-widget", "workspace:packages/payment-widget"],\ - ["@atls-ui-parts/button", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.12"],\ - ["@atls-ui-parts/condition", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.4"],\ - ["@atls-ui-parts/hidden-input", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.6"],\ - ["@atls-ui-parts/input", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.13"],\ - ["@atls-ui-parts/layout", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.7"],\ - ["@atls-ui-parts/text", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:0.0.11"],\ - ["@emotion/react", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ - ["@emotion/styled", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ - ["@types/react", "npm:18.2.20"],\ - ["@types/styled-system", "npm:5.1.16"],\ - ["csstype", "npm:3.1.2"],\ - ["react", "npm:18.2.0"],\ - ["react-intl", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:6.4.4"],\ - ["react-laag", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:2.0.5"],\ - ["styled-system", "npm:5.1.5"],\ - ["styled-tools", "npm:1.7.2"]\ - ],\ - "linkType": "SOFT"\ - }]\ - ]],\ ["@atls/react-upload", [\ ["workspace:packages/upload", {\ "packageLocation": "./packages/upload/",\ @@ -597,6 +572,35 @@ const RAW_RUNTIME_STATE = "linkType": "HARD"\ }]\ ]],\ + ["@atls/tinkoff-payment-widget", [\ + ["workspace:packages/payment-widget", {\ + "packageLocation": "./packages/payment-widget/",\ + "packageDependencies": [\ + ["@atls/tinkoff-payment-widget", "workspace:packages/payment-widget"],\ + ["@atls-ui-parts/button", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.12"],\ + ["@atls-ui-parts/condition", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.4"],\ + ["@atls-ui-parts/hidden-input", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.6"],\ + ["@atls-ui-parts/input", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.13"],\ + ["@atls-ui-parts/layout", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.7"],\ + ["@atls-ui-parts/text", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:0.0.11"],\ + ["@emotion/jest", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.4"],\ + ["@emotion/react", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ + ["@emotion/styled", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ + ["@testing-library/react", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:14.1.0"],\ + ["@types/react", "npm:18.2.20"],\ + ["@types/react-dom", "npm:18.2.15"],\ + ["@types/styled-system", "npm:5.1.16"],\ + ["csstype", "npm:3.1.2"],\ + ["react", "npm:18.2.0"],\ + ["react-dom", "virtual:0f253325d64667267f8a5c1074e4aa2f59120ad20372d39bddcfd3951915b9b89e0bfaf1fa90999b4185ff651ab603643a0d5aca289d2a340e670217b32db551#npm:18.2.0"],\ + ["react-intl", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:6.4.4"],\ + ["react-laag", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:2.0.5"],\ + ["styled-system", "npm:5.1.5"],\ + ["styled-tools", "npm:1.7.2"]\ + ],\ + "linkType": "SOFT"\ + }]\ + ]],\ ["@babel/code-frame", [\ ["npm:7.22.10", {\ "packageLocation": "./.yarn/cache/@babel-code-frame-npm-7.22.10-bc14e2ec1b-d97177c73f.zip/node_modules/@babel/code-frame/",\ @@ -1457,6 +1461,33 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ + ["npm:11.9.4", {\ + "packageLocation": "./.yarn/cache/@emotion-jest-npm-11.9.4-c14f8151a2-b25afc2d4e.zip/node_modules/@emotion/jest/",\ + "packageDependencies": [\ + ["@emotion/jest", "npm:11.9.4"]\ + ],\ + "linkType": "SOFT"\ + }],\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.4", {\ + "packageLocation": "./.yarn/__virtual__/@emotion-jest-virtual-12ebda1efb/0/cache/@emotion-jest-npm-11.9.4-c14f8151a2-b25afc2d4e.zip/node_modules/@emotion/jest/",\ + "packageDependencies": [\ + ["@emotion/jest", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.4"],\ + ["@babel/runtime", "npm:7.22.10"],\ + ["@emotion/css-prettifier", "npm:1.1.3"],\ + ["@types/enzyme-to-json", null],\ + ["@types/jest", null],\ + ["chalk", "npm:4.1.2"],\ + ["enzyme-to-json", null],\ + ["specificity", "npm:0.4.1"],\ + ["stylis", "npm:4.0.13"]\ + ],\ + "packagePeers": [\ + "@types/enzyme-to-json",\ + "@types/jest",\ + "enzyme-to-json"\ + ],\ + "linkType": "HARD"\ + }],\ ["virtual:bc1d8bf3bfb49da974172767ff229849e25532e8f1ec9d98a9033971d9a06627559c20b048511818c1ce7b3e216af1547500e502801eeba06a895379e74e6dcc#npm:11.11.0", {\ "packageLocation": "./.yarn/__virtual__/@emotion-jest-virtual-72e010b31a/0/cache/@emotion-jest-npm-11.11.0-c473c4e800-16a3ac1bcd.zip/node_modules/@emotion/jest/",\ "packageDependencies": [\ @@ -1502,10 +1533,10 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3", {\ - "packageLocation": "./.yarn/__virtual__/@emotion-react-virtual-6481fc9a6a/0/cache/@emotion-react-npm-11.9.3-dcd9c32ac6-6bd367b606.zip/node_modules/@emotion/react/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3", {\ + "packageLocation": "./.yarn/__virtual__/@emotion-react-virtual-46d1a27b98/0/cache/@emotion-react-npm-11.9.3-dcd9c32ac6-6bd367b606.zip/node_modules/@emotion/react/",\ "packageDependencies": [\ - ["@emotion/react", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ + ["@emotion/react", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ ["@babel/core", null],\ ["@babel/runtime", "npm:7.22.10"],\ ["@emotion/babel-plugin", "npm:11.11.0"],\ @@ -1582,15 +1613,15 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3", {\ - "packageLocation": "./.yarn/__virtual__/@emotion-styled-virtual-e386601ee0/0/cache/@emotion-styled-npm-11.9.3-01b80e031e-29e5b42e36.zip/node_modules/@emotion/styled/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3", {\ + "packageLocation": "./.yarn/__virtual__/@emotion-styled-virtual-e517270dfa/0/cache/@emotion-styled-npm-11.9.3-01b80e031e-29e5b42e36.zip/node_modules/@emotion/styled/",\ "packageDependencies": [\ - ["@emotion/styled", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ + ["@emotion/styled", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ ["@babel/core", null],\ ["@babel/runtime", "npm:7.22.10"],\ ["@emotion/babel-plugin", "npm:11.11.0"],\ ["@emotion/is-prop-valid", "npm:1.2.1"],\ - ["@emotion/react", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:11.9.3"],\ + ["@emotion/react", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:11.9.3"],\ ["@emotion/serialize", "npm:1.1.2"],\ ["@emotion/utils", "npm:1.2.1"],\ ["@types/babel__core", null],\ @@ -1713,10 +1744,10 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:d00caa4d13afb7a78df949e97a1fe9cc4f34ef4c55c78addcc8008c148635ec0bdd5963fcc18d707a4558b4f677d10ea4e9e8bf8bc40dd4876405fb70a6fce89#npm:2.9.0", {\ - "packageLocation": "./.yarn/__virtual__/@formatjs-intl-virtual-566c494bf4/0/cache/@formatjs-intl-npm-2.9.0-bf61aa2747-be63240038.zip/node_modules/@formatjs/intl/",\ + ["virtual:2962c1c73acd8a1b6526c1fc99041f0251f79535c9cee14fdb50e5884d2f92336e527151e83c646ec29dcac8dfea0103e013ce5f56986d7c9b70d6cd39649a7d#npm:2.9.0", {\ + "packageLocation": "./.yarn/__virtual__/@formatjs-intl-virtual-a364ba6352/0/cache/@formatjs-intl-npm-2.9.0-bf61aa2747-be63240038.zip/node_modules/@formatjs/intl/",\ "packageDependencies": [\ - ["@formatjs/intl", "virtual:d00caa4d13afb7a78df949e97a1fe9cc4f34ef4c55c78addcc8008c148635ec0bdd5963fcc18d707a4558b4f677d10ea4e9e8bf8bc40dd4876405fb70a6fce89#npm:2.9.0"],\ + ["@formatjs/intl", "virtual:2962c1c73acd8a1b6526c1fc99041f0251f79535c9cee14fdb50e5884d2f92336e527151e83c646ec29dcac8dfea0103e013ce5f56986d7c9b70d6cd39649a7d#npm:2.9.0"],\ ["@formatjs/ecma402-abstract", "npm:1.17.0"],\ ["@formatjs/fast-memoize", "npm:2.2.0"],\ ["@formatjs/icu-messageformat-parser", "npm:2.6.0"],\ @@ -2608,6 +2639,21 @@ const RAW_RUNTIME_STATE = ["pretty-format", "npm:27.5.1"]\ ],\ "linkType": "HARD"\ + }],\ + ["npm:9.3.3", {\ + "packageLocation": "./.yarn/cache/@testing-library-dom-npm-9.3.3-c5d4692db9-dbb4ce2973.zip/node_modules/@testing-library/dom/",\ + "packageDependencies": [\ + ["@testing-library/dom", "npm:9.3.3"],\ + ["@babel/code-frame", "npm:7.22.10"],\ + ["@babel/runtime", "npm:7.22.10"],\ + ["@types/aria-query", "npm:5.0.1"],\ + ["aria-query", "npm:5.1.3"],\ + ["chalk", "npm:4.1.2"],\ + ["dom-accessibility-api", "npm:0.5.16"],\ + ["lz-string", "npm:1.5.0"],\ + ["pretty-format", "npm:27.5.1"]\ + ],\ + "linkType": "HARD"\ }]\ ]],\ ["@testing-library/jest-dom", [\ @@ -2636,6 +2682,13 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ + ["npm:14.1.0", {\ + "packageLocation": "./.yarn/cache/@testing-library-react-npm-14.1.0-6f896be630-3369b08183.zip/node_modules/@testing-library/react/",\ + "packageDependencies": [\ + ["@testing-library/react", "npm:14.1.0"]\ + ],\ + "linkType": "SOFT"\ + }],\ ["virtual:0f253325d64667267f8a5c1074e4aa2f59120ad20372d39bddcfd3951915b9b89e0bfaf1fa90999b4185ff651ab603643a0d5aca289d2a340e670217b32db551#npm:12.1.5", {\ "packageLocation": "./.yarn/__virtual__/@testing-library-react-virtual-ce6363f785/0/cache/@testing-library-react-npm-12.1.5-745f86e555-0a32d7b86c.zip/node_modules/@testing-library/react/",\ "packageDependencies": [\ @@ -2654,6 +2707,25 @@ const RAW_RUNTIME_STATE = "react"\ ],\ "linkType": "HARD"\ + }],\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:14.1.0", {\ + "packageLocation": "./.yarn/__virtual__/@testing-library-react-virtual-5973e51e42/0/cache/@testing-library-react-npm-14.1.0-6f896be630-3369b08183.zip/node_modules/@testing-library/react/",\ + "packageDependencies": [\ + ["@testing-library/react", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:14.1.0"],\ + ["@babel/runtime", "npm:7.22.10"],\ + ["@testing-library/dom", "npm:9.3.3"],\ + ["@types/react", "npm:18.2.20"],\ + ["@types/react-dom", "npm:18.2.15"],\ + ["react", "npm:18.2.0"],\ + ["react-dom", "virtual:0f253325d64667267f8a5c1074e4aa2f59120ad20372d39bddcfd3951915b9b89e0bfaf1fa90999b4185ff651ab603643a0d5aca289d2a340e670217b32db551#npm:18.2.0"]\ + ],\ + "packagePeers": [\ + "@types/react-dom",\ + "@types/react",\ + "react-dom",\ + "react"\ + ],\ + "linkType": "HARD"\ }]\ ]],\ ["@testing-library/react-hooks", [\ @@ -2921,6 +2993,14 @@ const RAW_RUNTIME_STATE = }]\ ]],\ ["@types/react-dom", [\ + ["npm:18.2.15", {\ + "packageLocation": "./.yarn/cache/@types-react-dom-npm-18.2.15-2269cd02ff-e3aa4cbd0e.zip/node_modules/@types/react-dom/",\ + "packageDependencies": [\ + ["@types/react-dom", "npm:18.2.15"],\ + ["@types/react", "npm:18.2.20"]\ + ],\ + "linkType": "HARD"\ + }],\ ["npm:18.2.7", {\ "packageLocation": "./.yarn/cache/@types-react-dom-npm-18.2.7-a20ba684a5-20c9dbe8ba.zip/node_modules/@types/react-dom/",\ "packageDependencies": [\ @@ -4788,10 +4868,10 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:9402c47e26506f12508aaf7e48e81a30d173d12557d5533adf3608a486048c152160ec561f444ad7a689ca95ef9951e3fb3a45ad9fdb92c73afa57fd8c6a3d65#npm:10.12.16", {\ - "packageLocation": "./.yarn/__virtual__/framer-motion-virtual-b732540d42/0/cache/framer-motion-npm-10.12.16-15fa41631a-938b0267a1.zip/node_modules/framer-motion/",\ + ["virtual:4d67cd8dc5067346d728d11b9fa6c3ea5b5f7c19b8417fd0d43dad733ad3d3ab25564901dc868458a3172bd0d0def599f0dc79be26a71302a3706cbd81668b66#npm:10.12.16", {\ + "packageLocation": "./.yarn/__virtual__/framer-motion-virtual-c6c78b075e/0/cache/framer-motion-npm-10.12.16-15fa41631a-938b0267a1.zip/node_modules/framer-motion/",\ "packageDependencies": [\ - ["framer-motion", "virtual:9402c47e26506f12508aaf7e48e81a30d173d12557d5533adf3608a486048c152160ec561f444ad7a689ca95ef9951e3fb3a45ad9fdb92c73afa57fd8c6a3d65#npm:10.12.16"],\ + ["framer-motion", "virtual:4d67cd8dc5067346d728d11b9fa6c3ea5b5f7c19b8417fd0d43dad733ad3d3ab25564901dc868458a3172bd0d0def599f0dc79be26a71302a3706cbd81668b66#npm:10.12.16"],\ ["@emotion/is-prop-valid", "npm:0.8.8"],\ ["@types/react", "npm:18.2.20"],\ ["@types/react-dom", null],\ @@ -7800,13 +7880,13 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:6.4.4", {\ - "packageLocation": "./.yarn/__virtual__/react-intl-virtual-d00caa4d13/0/cache/react-intl-npm-6.4.4-5d775191b5-1ac3b4981a.zip/node_modules/react-intl/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:6.4.4", {\ + "packageLocation": "./.yarn/__virtual__/react-intl-virtual-2962c1c73a/0/cache/react-intl-npm-6.4.4-5d775191b5-1ac3b4981a.zip/node_modules/react-intl/",\ "packageDependencies": [\ - ["react-intl", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:6.4.4"],\ + ["react-intl", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:6.4.4"],\ ["@formatjs/ecma402-abstract", "npm:1.17.0"],\ ["@formatjs/icu-messageformat-parser", "npm:2.6.0"],\ - ["@formatjs/intl", "virtual:d00caa4d13afb7a78df949e97a1fe9cc4f34ef4c55c78addcc8008c148635ec0bdd5963fcc18d707a4558b4f677d10ea4e9e8bf8bc40dd4876405fb70a6fce89#npm:2.9.0"],\ + ["@formatjs/intl", "virtual:2962c1c73acd8a1b6526c1fc99041f0251f79535c9cee14fdb50e5884d2f92336e527151e83c646ec29dcac8dfea0103e013ce5f56986d7c9b70d6cd39649a7d#npm:2.9.0"],\ ["@formatjs/intl-displaynames", "npm:6.5.0"],\ ["@formatjs/intl-listformat", "npm:7.4.0"],\ ["@types/hoist-non-react-statics", "npm:3.3.1"],\ @@ -7858,14 +7938,14 @@ const RAW_RUNTIME_STATE = ],\ "linkType": "SOFT"\ }],\ - ["virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:2.0.5", {\ - "packageLocation": "./.yarn/__virtual__/react-laag-virtual-f85788abc9/0/cache/react-laag-npm-2.0.5-ee934b6029-32de5cb560.zip/node_modules/react-laag/",\ + ["virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:2.0.5", {\ + "packageLocation": "./.yarn/__virtual__/react-laag-virtual-8b48689d61/0/cache/react-laag-npm-2.0.5-ee934b6029-32de5cb560.zip/node_modules/react-laag/",\ "packageDependencies": [\ - ["react-laag", "virtual:19d7eaf137e33421ff5238900f2fdd4e99a0ba752774535459c4d3a7f8ca81429b82550d05152f34261f2882346c7d8459777f85638dc6cedf919ce9bc362a3a#npm:2.0.5"],\ + ["react-laag", "virtual:5df5417e007cf624295c3dfc9c18b541c8f15fbbead2fcd958b8514a53e86ee6c640495d53e378a3d48c5ae0b86482593ca5c241f44dea6b3f5eb1e38d547d43#npm:2.0.5"],\ ["@types/react", "npm:18.2.20"],\ - ["@types/react-dom", null],\ + ["@types/react-dom", "npm:18.2.15"],\ ["react", "npm:18.2.0"],\ - ["react-dom", null],\ + ["react-dom", "virtual:0f253325d64667267f8a5c1074e4aa2f59120ad20372d39bddcfd3951915b9b89e0bfaf1fa90999b4185ff651ab603643a0d5aca289d2a340e670217b32db551#npm:18.2.0"],\ ["tiny-warning", "npm:1.0.3"]\ ],\ "packagePeers": [\ @@ -8470,6 +8550,13 @@ const RAW_RUNTIME_STATE = }]\ ]],\ ["stylis", [\ + ["npm:4.0.13", {\ + "packageLocation": "./.yarn/cache/stylis-npm-4.0.13-3f245d840f-3231e328da.zip/node_modules/stylis/",\ + "packageDependencies": [\ + ["stylis", "npm:4.0.13"]\ + ],\ + "linkType": "HARD"\ + }],\ ["npm:4.2.0", {\ "packageLocation": "./.yarn/cache/stylis-npm-4.2.0-6b07f11c99-c7ee385328.zip/node_modules/stylis/",\ "packageDependencies": [\ diff --git a/.run/test-unit.run.xml b/.run/test-unit.run.xml new file mode 100644 index 0000000..fcd8473 --- /dev/null +++ b/.run/test-unit.run.xml @@ -0,0 +1,17 @@ + + + + \ No newline at end of file diff --git a/.yarn/cache/@emotion-jest-npm-11.9.4-c14f8151a2-b25afc2d4e.zip b/.yarn/cache/@emotion-jest-npm-11.9.4-c14f8151a2-b25afc2d4e.zip new file mode 100644 index 0000000..4fa28e3 Binary files /dev/null and b/.yarn/cache/@emotion-jest-npm-11.9.4-c14f8151a2-b25afc2d4e.zip differ diff --git a/.yarn/cache/@testing-library-dom-npm-9.3.3-c5d4692db9-dbb4ce2973.zip b/.yarn/cache/@testing-library-dom-npm-9.3.3-c5d4692db9-dbb4ce2973.zip new file mode 100644 index 0000000..b1957a0 Binary files /dev/null and b/.yarn/cache/@testing-library-dom-npm-9.3.3-c5d4692db9-dbb4ce2973.zip differ diff --git a/.yarn/cache/@testing-library-react-npm-14.1.0-6f896be630-3369b08183.zip b/.yarn/cache/@testing-library-react-npm-14.1.0-6f896be630-3369b08183.zip new file mode 100644 index 0000000..f54d4e1 Binary files /dev/null and b/.yarn/cache/@testing-library-react-npm-14.1.0-6f896be630-3369b08183.zip differ diff --git a/.yarn/cache/@types-react-dom-npm-18.2.15-2269cd02ff-e3aa4cbd0e.zip b/.yarn/cache/@types-react-dom-npm-18.2.15-2269cd02ff-e3aa4cbd0e.zip new file mode 100644 index 0000000..272f9e5 Binary files /dev/null and b/.yarn/cache/@types-react-dom-npm-18.2.15-2269cd02ff-e3aa4cbd0e.zip differ diff --git a/.yarn/cache/stylis-npm-4.0.13-3f245d840f-3231e328da.zip b/.yarn/cache/stylis-npm-4.0.13-3f245d840f-3231e328da.zip new file mode 100644 index 0000000..8f83cbf Binary files /dev/null and b/.yarn/cache/stylis-npm-4.0.13-3f245d840f-3231e328da.zip differ diff --git a/packages/payment-widget/README.md b/packages/payment-widget/README.md new file mode 100644 index 0000000..f65460b --- /dev/null +++ b/packages/payment-widget/README.md @@ -0,0 +1,61 @@ +# @atls/tinkoff-payment-widget + +[//]: # 'VERSIONS' + +## [](https://www.npmjs.com/package/@atls-ui-parts/button/v/0.0.12) [](https://www.npmjs.com/package/@atls-ui-parts/condition/v/0.0.4) [](https://www.npmjs.com/package/@atls-ui-parts/hidden-input/v/0.0.6) [](https://www.npmjs.com/package/@atls-ui-parts/input/v/0.0.13) [](https://www.npmjs.com/package/@atls-ui-parts/layout/v/0.0.7) [](https://www.npmjs.com/package/@atls-ui-parts/layout/v/0.0.7) [](https://www.npmjs.com/package/react-intl/v/6.4.4) [](https://www.npmjs.com/package/react-laag) [](https://www.npmjs.com/package/styled-tools) + +**@atls/tinkoff-payment-widget** предназначен для интеграции в проекты формы, позволяющей проводить оплаты с помощью терминала "Тинькофф Касса". Реализован при помощи `styled-components` и `@emotion`. + +## Использование со стандартной темой + +Для корректной работы **@atls/tinkoff-payment-widget** достаточно для компонента `Widget` назначить атрибуту `settings` объект с ключом `storeID`: + +```tsx +import { Widget } from '@atls/tinkoff-payment-widget' +export const Form = () => +``` + +Основные атрибуты для компонента `Widget`: + +- **`settings`** - обязательный атрибут, принимает объект с настройками для терминала. +- **`amount`** - опциональный атрибут, принимает сумму платежа.Без заданного значения `Widget` генерирует обязательное поле для ввода суммы. +- **`additionalFields`** - опциональный атрибут для добавления дополнительных полей, принимает массив объектов с обязательным ключом `name`. +- **`receipt`** - опциональный атрибут, принимает объект с настройками для генерации чека. +- **`styles`** - опциональный атрибут, принимает объект с настройками для генерации чека. +- **`disabled`** - опциональный атрибут для управлением активным состоянием кнопки, принимает булево значение. + +## Использование с кастомной темой + +**@atls/tinkoff-payment-widget** предусматривает возможность использования стилизованных полей ввода и кнопки из Вашего проекта. Для этого предоставляются компоненты обёртки `InputWrapper` и `ButtonWrapper`. + +`InputWrapper` принимает обязательный атрибут `name`. + +```tsx +import { AdditionalFieldsType } from '@atls/tinkoff-payment-widget' +import { ButtonWrapper } from '@atls/tinkoff-payment-widget' +import { InputWrapper } from '@atls/tinkoff-payment-widget' +import { Widget } from '@atls/tinkoff-payment-widget' +export const Form = () => ( + + {(props) => } + {(props) => } + +) +``` + +> [!WARNING] +> Не используйте атрибут `additionalFields` совместно с `InputWrapper`, это приведет к исключению. +> +> Так же, при использовании `InputWrapper` Виджет не генерирует дополнительные поля. + +## Экспортируемые компоненты + +[**Widget**]() - главный компонент Виджета. + +[**InputWrapper**]() - компонент обёртка для полей ввода. + +[**ButtonWrapper**]() - компонент обёртка для кнопки. + +[**AdditionalFieldsType**]() - интерфейс дополнительных полей. + +[**RequiredFieldsType**]() - интерфейс обязательных полей. diff --git a/packages/payment-widget/package.json b/packages/payment-widget/package.json index 25d1832..6bbb5ae 100644 --- a/packages/payment-widget/package.json +++ b/packages/payment-widget/package.json @@ -1,5 +1,5 @@ { - "name": "@atls/react-payment-widget", + "name": "@atls/tinkoff-payment-widget", "version": "0.0.1", "license": "BSD-3-Clause", "main": "src/index.ts", @@ -23,12 +23,16 @@ "styled-tools": "1.7.2" }, "devDependencies": { + "@emotion/jest": "11.9.4", "@emotion/react": "11.9.3", "@emotion/styled": "11.9.3", + "@testing-library/react": "14.1.0", "@types/react": "18.2.20", + "@types/react-dom": "18", "@types/styled-system": "5.1.16", "csstype": "3.1.2", "react": "18.2.0", + "react-dom": "18.2.0", "styled-system": "5.1.5" }, "peerDependencies": { diff --git a/packages/payment-widget/src/enums/button.enum.ts b/packages/payment-widget/src/enums/button.enum.ts new file mode 100644 index 0000000..af6dc7c --- /dev/null +++ b/packages/payment-widget/src/enums/button.enum.ts @@ -0,0 +1,4 @@ +/* eslint-disable no-shadow */ +export enum ButtonType { + Submit = 'submit', +} diff --git a/packages/payment-widget/src/enums/index.ts b/packages/payment-widget/src/enums/index.ts index fa89379..8715c59 100644 --- a/packages/payment-widget/src/enums/index.ts +++ b/packages/payment-widget/src/enums/index.ts @@ -4,3 +4,5 @@ export * from './payment-method.enum' export * from './payment-object.enum' export * from './tax.enum' export * from './taxation.enum' +export * from './button.enum' +export * from './wrapper.enum' diff --git a/packages/payment-widget/src/enums/wrapper.enum.ts b/packages/payment-widget/src/enums/wrapper.enum.ts new file mode 100644 index 0000000..0d5191a --- /dev/null +++ b/packages/payment-widget/src/enums/wrapper.enum.ts @@ -0,0 +1,5 @@ +/* eslint-disable no-shadow */ +export enum NameWrapperComponent { + InputWrapper = 'InputWrapper', + ButtonWrapper = 'ButtonWrapper', +} diff --git a/packages/payment-widget/src/hooks/index.ts b/packages/payment-widget/src/hooks/index.ts index 8ef3085..cd0e192 100644 --- a/packages/payment-widget/src/hooks/index.ts +++ b/packages/payment-widget/src/hooks/index.ts @@ -2,3 +2,5 @@ export * from './use-init.hook' export { useValidate } from './use-validate.hook' export { useFieldsState } from './use-fields-state.hook' export { useFieldsRenderer } from './use-fields-render.hook' +export { useCustomFields } from './use-custom-fields.hook' +export { useCustomButton } from './use-custom-button.hook' diff --git a/packages/payment-widget/src/hooks/use-custom-button.hook.ts b/packages/payment-widget/src/hooks/use-custom-button.hook.ts new file mode 100644 index 0000000..87ed3b4 --- /dev/null +++ b/packages/payment-widget/src/hooks/use-custom-button.hook.ts @@ -0,0 +1,7 @@ +import { ReactNode } from 'react' + +import { NameWrapperComponent } from '../enums' +import { isCustomElement } from '../utils' + +export const useCustomButton = (nodeArray: ReactNode[]): ReactNode => + nodeArray.find((node) => isCustomElement(NameWrapperComponent.ButtonWrapper, node)) diff --git a/packages/payment-widget/src/hooks/use-custom-fields.hook.ts b/packages/payment-widget/src/hooks/use-custom-fields.hook.ts new file mode 100644 index 0000000..326502e --- /dev/null +++ b/packages/payment-widget/src/hooks/use-custom-fields.hook.ts @@ -0,0 +1,60 @@ +import { ReactNode } from 'react' +import { isValidElement } from 'react' + +import { AdditionalFieldsType } from '../enums' +import { NameWrapperComponent } from '../enums' +import { RequiredFieldsType } from '../enums' +import { CustomFields } from '../interfaces' +import { CustomFieldsProps } from '../interfaces' +import { isCustomElement } from '../utils' + +export const useCustomFields = ({ + existAmount, + existReceipt, + existAdditionalFields, + nodeArray, +}: CustomFieldsProps): CustomFields => { + const isAdditionalField = (node: ReactNode): boolean => + isValidElement(node) ? Object.values(AdditionalFieldsType).includes(node.props.name) : false + const isRequiredField = (node: ReactNode): boolean => + isValidElement(node) ? node.props.name === RequiredFieldsType.Amount && !existAmount : false + + const customFields = nodeArray.filter( + (node) => + isCustomElement(NameWrapperComponent.InputWrapper, node) && + (isAdditionalField(node) || isRequiredField(node)) + ) + + const isGenerateReceiptField = existReceipt && !customFields.length + + const isGenerateRequiredField = !existAmount && existAdditionalFields + + const existCustomAmountField = customFields.some( + (field) => isValidElement(field) && field.props.name === RequiredFieldsType.Amount + ) + const existCustomReceiptField = customFields.some( + (field) => + isValidElement(field) && + (field.props.name === AdditionalFieldsType.Email || + field.props.name === AdditionalFieldsType.Phone) + ) + + if (existAdditionalFields && customFields.length) + throw new Error('Don`t use additionalFields property with InputWrapper component') + + if (customFields.length && !existAmount && !existCustomAmountField) + throw new Error( + 'If you use InputWrapper component and don`t set amount property, you mast use InputWrapper componnet with property name equal RequiredFieldsType.Amount' + ) + + if (customFields.length && existReceipt && !existCustomReceiptField) + throw new Error( + 'If you set receipt property whith InputWrapper component, you mast use InputWrapper componnet with property name equal AdditionalFieldsType.Phone or AdditionalFieldsType.Email' + ) + + return { + customFields, + isGenerateReceiptField, + isGenerateRequiredField, + } +} diff --git a/packages/payment-widget/src/hooks/use-fields-render.hook.tsx b/packages/payment-widget/src/hooks/use-fields-render.hook.tsx index 2412f07..4516c92 100644 --- a/packages/payment-widget/src/hooks/use-fields-render.hook.tsx +++ b/packages/payment-widget/src/hooks/use-fields-render.hook.tsx @@ -5,15 +5,17 @@ import React from 'react' import { useIntl } from 'react-intl' import { Field } from '../interfaces' +import { NameField } from '../interfaces' import { HandleBlurField } from '../interfaces' import { FieldState } from '../interfaces' import { HandleChangeField } from '../interfaces' import { FieldsErrors } from '../interfaces' import { MemoizedInput } from '../ui' +import { ThemeProvider } from '../ui/theme/src' import { translate } from '../utils/translate.util' export const useFieldsRenderer = ( - fields: Field[], + fields: Field[] | NameField[], errors: FieldsErrors, fieldsState: FieldState, handleChange: HandleChangeField, @@ -22,27 +24,31 @@ export const useFieldsRenderer = ( ) => { const intl = useIntl() - return fields.map((field, index, currentFields) => { - const translatePlaceholder = translate(intl, field.placeholder, field.placeholder) - const translateError = translate(intl, errors[field.name], errors[field.name]) - const isNotLastField = index !== currentFields.length - 1 + return ( + + {fields.map((field, index, currentFields) => { + const translatePlaceholder = translate(intl, field.placeholder, field.placeholder) + const translateError = translate(intl, errors[field.name], errors[field.name]) + const isNotLastField = index !== currentFields.length - 1 - return ( - - - - - - - ) - }) + return ( + + + + + + + ) + })} + + ) } diff --git a/packages/payment-widget/src/hooks/use-fields-state.hook.ts b/packages/payment-widget/src/hooks/use-fields-state.hook.ts index a4a8781..2e84b36 100644 --- a/packages/payment-widget/src/hooks/use-fields-state.hook.ts +++ b/packages/payment-widget/src/hooks/use-fields-state.hook.ts @@ -3,13 +3,14 @@ import { useCallback } from 'react' import { useState } from 'react' import { Field } from '../interfaces' +import { FieldsState } from '../interfaces' import { HandleBlurField } from '../interfaces' import { FieldState } from '../interfaces' import { HandleChangeField } from '../interfaces' import { FieldsNames } from '../interfaces' import { ValidateField } from '../interfaces' -export const useFieldsState = (fields: Field[], validateField: ValidateField) => { +export const useFieldsState = (validateField: ValidateField, fields: Field[]): FieldsState => { const initialState = fields.reduce((acc, field) => ({ ...acc, [field.name]: '' }), {}) const [fieldsState, setFieldsState] = useState(initialState as FieldState) diff --git a/packages/payment-widget/src/index.ts b/packages/payment-widget/src/index.ts index 2334a21..38bb613 100644 --- a/packages/payment-widget/src/index.ts +++ b/packages/payment-widget/src/index.ts @@ -1,4 +1,4 @@ -export { Widget } from './ui' +export { Widget, InputWrapper, ButtonWrapper } from './ui' export { Settings, Styles, diff --git a/packages/payment-widget/src/interfaces/custom-fields.iterfaces.ts b/packages/payment-widget/src/interfaces/custom-fields.iterfaces.ts new file mode 100644 index 0000000..831bfe8 --- /dev/null +++ b/packages/payment-widget/src/interfaces/custom-fields.iterfaces.ts @@ -0,0 +1,18 @@ +import { ReactNode } from 'react' + +import { Field } from './fields.interfaces' + +export type NameField = Pick + +export interface CustomFields { + customFields: ReactNode[] + isGenerateReceiptField: boolean + isGenerateRequiredField: boolean +} + +export interface CustomFieldsProps { + existAmount: boolean + existReceipt: boolean + existAdditionalFields: boolean + nodeArray: ReactNode[] +} diff --git a/packages/payment-widget/src/interfaces/fields.interfaces.ts b/packages/payment-widget/src/interfaces/fields.interfaces.ts index 2183392..e00a08d 100644 --- a/packages/payment-widget/src/interfaces/fields.interfaces.ts +++ b/packages/payment-widget/src/interfaces/fields.interfaces.ts @@ -13,7 +13,7 @@ export type HandleBlurField = (e: FormEvent) => void export interface Field { name: FieldsNames - placeholder: string + placeholder?: string required?: boolean type?: HTMLInputTypeAttribute } @@ -31,11 +31,20 @@ export type FieldsErrors = { } export interface FieldsProps { - errors: FieldsErrors - validateField: ValidateField amount?: number direction?: DirectionFields inputGaps?: number - isGenerateReceipt?: boolean - additionalFields?: AdditionalField[] + useCustomFields: boolean +} + +export interface FieldsValidator { + errors: FieldsErrors + validateField: ValidateField + isValidate: boolean +} + +export interface FieldsState { + fieldsState: FieldState + handleChange: HandleChangeField + handleBlur: HandleBlurField } diff --git a/packages/payment-widget/src/interfaces/form.interfaces.ts b/packages/payment-widget/src/interfaces/form.interfaces.ts new file mode 100644 index 0000000..c3023ac --- /dev/null +++ b/packages/payment-widget/src/interfaces/form.interfaces.ts @@ -0,0 +1,27 @@ +import { ReactNode } from 'react' + +import { NameField } from './custom-fields.iterfaces' +import { Field } from './fields.interfaces' +import { FieldsState } from './fields.interfaces' +import { FieldsValidator } from './fields.interfaces' +import { WidgetProps } from './widget.interfaces' + +export interface FormProps extends WidgetProps { + useCustomFields: boolean + useCustomButton: boolean +} + +export interface FormProviderProps { + additionalFields?: Field[] + nameFields: Field[] + isGenerateReceipt: boolean + isGenerateRequiredField: boolean + disabled: boolean + children: ReactNode +} + +export interface FormContext extends FieldsValidator, FieldsState { + fields: Field[] | NameField[] + disabled: boolean + isLoaded: boolean +} diff --git a/packages/payment-widget/src/interfaces/index.ts b/packages/payment-widget/src/interfaces/index.ts index b48e070..fd499ca 100644 --- a/packages/payment-widget/src/interfaces/index.ts +++ b/packages/payment-widget/src/interfaces/index.ts @@ -3,3 +3,7 @@ export * from './fields.interfaces' export * from './settings.interfaces' export * from './receipt.interfaces' export * from './styles.interfaces' +export * from './theme.interfaces' +export * from './form.interfaces' +export * from './wrappers.interfaces' +export * from './custom-fields.iterfaces' diff --git a/packages/payment-widget/src/interfaces/theme.interfaces.ts b/packages/payment-widget/src/interfaces/theme.interfaces.ts new file mode 100644 index 0000000..057e8b2 --- /dev/null +++ b/packages/payment-widget/src/interfaces/theme.interfaces.ts @@ -0,0 +1,5 @@ +import { ReactNode } from 'react' + +export interface ThemeProps { + children: ReactNode +} diff --git a/packages/payment-widget/src/interfaces/widget.interfaces.ts b/packages/payment-widget/src/interfaces/widget.interfaces.ts index 2f81291..a077abe 100644 --- a/packages/payment-widget/src/interfaces/widget.interfaces.ts +++ b/packages/payment-widget/src/interfaces/widget.interfaces.ts @@ -1,3 +1,5 @@ +import { ReactNode } from 'react' + import { AdditionalField } from './fields.interfaces' import { ReceiptSettings } from './receipt.interfaces' import { Settings } from './settings.interfaces' @@ -9,4 +11,6 @@ export interface WidgetProps { receipt?: ReceiptSettings styles?: Styles additionalFields?: AdditionalField[] + disabled?: boolean + children?: ReactNode } diff --git a/packages/payment-widget/src/interfaces/wrappers.interfaces.ts b/packages/payment-widget/src/interfaces/wrappers.interfaces.ts new file mode 100644 index 0000000..4f73550 --- /dev/null +++ b/packages/payment-widget/src/interfaces/wrappers.interfaces.ts @@ -0,0 +1,29 @@ +import { ReactElement } from 'react' + +import { AdditionalFieldsType } from '../enums' +import { ButtonType } from '../enums' +import { RequiredFieldsType } from '../enums' +import { HandleBlurField } from './fields.interfaces' +import { HandleChangeField } from './fields.interfaces' + +interface ChildrenInputProps { + name: string + value: string + onChangeNative: HandleChangeField + onBlur: HandleBlurField + errorText: string +} + +interface ChildrenButtonProps { + type: ButtonType + disabled: boolean +} + +export interface InputWrapperProps { + name: AdditionalFieldsType | RequiredFieldsType + children: (props: ChildrenInputProps) => ReactElement +} + +export interface ButtonWrapperProps { + children: (props: ChildrenButtonProps) => ReactElement +} diff --git a/packages/payment-widget/src/ui/fields.component.tsx b/packages/payment-widget/src/ui/fields.component.tsx index 2b57790..db2d20f 100644 --- a/packages/payment-widget/src/ui/fields.component.tsx +++ b/packages/payment-widget/src/ui/fields.component.tsx @@ -1,36 +1,30 @@ -import { Condition } from '@atls-ui-parts/condition' -import { HiddenInput } from '@atls-ui-parts/hidden-input' -import { Box } from '@atls-ui-parts/layout' -import { Column } from '@atls-ui-parts/layout' -import { Layout } from '@atls-ui-parts/layout' -import { Row } from '@atls-ui-parts/layout' +import { Condition } from '@atls-ui-parts/condition' +import { HiddenInput } from '@atls-ui-parts/hidden-input' +import { Box } from '@atls-ui-parts/layout' +import { Column } from '@atls-ui-parts/layout' +import { Layout } from '@atls-ui-parts/layout' +import { Row } from '@atls-ui-parts/layout' -import React from 'react' +import React from 'react' -import { RequiredFieldsType } from '../enums' -import { FieldsProps } from '../interfaces' -import { DirectionFields } from '../interfaces' -import { requiredFields } from '../data' -import { useFieldsState } from '../hooks' -import { useFieldsRenderer } from '../hooks' -import { addReceiptFieldsUtil } from '../utils' +import { RequiredFieldsType } from '../enums' +import { FieldsProps } from '../interfaces' +import { DirectionFields } from '../interfaces' +import { useFieldsRenderer } from '../hooks' +import { useForm } from './form' export const Fields = ({ - errors, - validateField, amount, - additionalFields = [], - isGenerateReceipt = false, direction = DirectionFields.Column, inputGaps = 16, + useCustomFields, }: FieldsProps) => { - const processedFields = isGenerateReceipt - ? addReceiptFieldsUtil(additionalFields) - : additionalFields - const fields = !amount ? [...requiredFields, ...processedFields] : [...processedFields] - const { fieldsState, handleChange, handleBlur } = useFieldsState(fields, validateField) + const { fields, fieldsState, handleChange, handleBlur, errors } = useForm() + + const fieldsForRender = useCustomFields ? [] : fields + const renderedFields = useFieldsRenderer( - fields, + fieldsForRender, errors, fieldsState, handleChange, diff --git a/packages/payment-widget/src/ui/form.component.tsx b/packages/payment-widget/src/ui/form.component.tsx deleted file mode 100644 index 5f6303d..0000000 --- a/packages/payment-widget/src/ui/form.component.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import React from 'react' -import { FormEventHandler } from 'react' -import { FormattedMessage } from 'react-intl' - -import { WidgetProps } from '../interfaces' -import { Button } from './button/button.component' -import { Fields } from './fields.component' -import { Settings } from './settings.component' -import { useInit } from '../hooks' -import { useValidate } from '../hooks' -import { makePayment } from '../utils' -import { makePaymentWithCheck } from '../utils' - -export const Form = ({ settings, amount, receipt, styles, additionalFields }: WidgetProps) => { - const isLoaded = useInit() - const { errors, validateField, isValidate } = useValidate() - const payHandler: FormEventHandler = (event) => { - event.preventDefault() - if (!isValidate) return - - if (receipt) { - makePaymentWithCheck(event, receipt) - } else { - makePayment(event) - } - } - - return ( -
- - - - - ) -} diff --git a/packages/payment-widget/src/ui/form/form.component.tsx b/packages/payment-widget/src/ui/form/form.component.tsx new file mode 100644 index 0000000..e8d25e8 --- /dev/null +++ b/packages/payment-widget/src/ui/form/form.component.tsx @@ -0,0 +1,51 @@ +import React from 'react' +import { FormEventHandler } from 'react' +import { FormattedMessage } from 'react-intl' + +import { FormProps } from '../../interfaces' +import { Button } from '../button/button.component' +import { Fields } from '../fields.component' +import { Settings } from '../settings.component' +import { makePayment } from '../../utils' +import { makePaymentWithCheck } from '../../utils' +import { useForm } from './use-form.hook' + +export const Form = ({ + settings, + amount, + receipt, + styles, + useCustomButton, + useCustomFields, + children, +}: FormProps) => { + const { isValidate, disabled, isLoaded } = useForm() + const payHandler: FormEventHandler = (event) => { + event.preventDefault() + if (!isValidate) return + + if (receipt) { + makePaymentWithCheck(event, receipt) + } else { + makePayment(event) + } + } + + return ( +
+ + + {children} + {!useCustomButton && ( + + )} + + ) +} diff --git a/packages/payment-widget/src/ui/form/form.context.ts b/packages/payment-widget/src/ui/form/form.context.ts new file mode 100644 index 0000000..1a496b5 --- /dev/null +++ b/packages/payment-widget/src/ui/form/form.context.ts @@ -0,0 +1,7 @@ +import { createContext } from 'react' + +import { FormContext } from '../../interfaces' + +export const Context = createContext(null) + +export const { Provider, Consumer } = Context diff --git a/packages/payment-widget/src/ui/form/form.provider.tsx b/packages/payment-widget/src/ui/form/form.provider.tsx new file mode 100644 index 0000000..baa9aef --- /dev/null +++ b/packages/payment-widget/src/ui/form/form.provider.tsx @@ -0,0 +1,66 @@ +import React from 'react' +import { FC } from 'react' +import { useMemo } from 'react' + +import { AdditionalField } from '../../interfaces' +import { FormProviderProps } from '../../interfaces' +import { Provider } from './form.context' +import { requiredFields } from '../../data' +import { useFieldsState } from '../../hooks' +import { useInit } from '../../hooks' +import { useValidate } from '../../hooks' +import { addReceiptFieldsUtil } from '../../utils' + +export const FormProvider: FC = ({ + additionalFields, + nameFields, + isGenerateReceipt, + isGenerateRequiredField, + disabled, + children, +}) => { + const { errors, validateField, isValidate } = useValidate() + + const processedFields = + additionalFields && isGenerateReceipt + ? addReceiptFieldsUtil(additionalFields as AdditionalField[]) + : nameFields + const fields = useMemo( + () => + additionalFields && isGenerateRequiredField + ? [...requiredFields, ...processedFields] + : [...processedFields], + [additionalFields, isGenerateRequiredField, processedFields] + ) + + const { fieldsState, handleChange, handleBlur } = useFieldsState(validateField, fields) + + const isLoaded = useInit() + + const value = useMemo( + () => ({ + fields, + fieldsState, + handleChange, + handleBlur, + errors, + validateField, + isValidate, + disabled, + isLoaded, + }), + [ + fields, + fieldsState, + handleChange, + handleBlur, + errors, + validateField, + isValidate, + disabled, + isLoaded, + ] + ) + + return {children} +} diff --git a/packages/payment-widget/src/ui/form/index.ts b/packages/payment-widget/src/ui/form/index.ts new file mode 100644 index 0000000..62720ce --- /dev/null +++ b/packages/payment-widget/src/ui/form/index.ts @@ -0,0 +1,2 @@ +export * from './form.component' +export * from './use-form.hook' diff --git a/packages/payment-widget/src/ui/form/use-form.hook.ts b/packages/payment-widget/src/ui/form/use-form.hook.ts new file mode 100644 index 0000000..0538c80 --- /dev/null +++ b/packages/payment-widget/src/ui/form/use-form.hook.ts @@ -0,0 +1,12 @@ +import { useContext } from 'react' + +import { FormContext } from '../../interfaces' +import { Context } from './form.context' + +export const useForm = (): FormContext => { + const context = useContext(Context) + + if (!context) throw new Error('Missing form context provider') + + return context +} diff --git a/packages/payment-widget/src/ui/index.ts b/packages/payment-widget/src/ui/index.ts index 86e6890..10615d5 100644 --- a/packages/payment-widget/src/ui/index.ts +++ b/packages/payment-widget/src/ui/index.ts @@ -1,3 +1,4 @@ export * from './widget.component' +export * from './wrapper' export { Input } from './input/input.component' export { MemoizedInput } from './input/input.component' diff --git a/packages/payment-widget/src/ui/theme/src/theme.provider.tsx b/packages/payment-widget/src/ui/theme/src/theme.provider.tsx index 320b417..8d7e06b 100644 --- a/packages/payment-widget/src/ui/theme/src/theme.provider.tsx +++ b/packages/payment-widget/src/ui/theme/src/theme.provider.tsx @@ -3,7 +3,10 @@ import * as theme from './theme' import { ThemeProvider as EmotionThemeProvider } from '@emotion/react' import React from 'react' +import { FC } from 'react' -export const ThemeProvider = ({ children }) => ( +import { ThemeProps } from '../../../interfaces' + +export const ThemeProvider: FC = ({ children }) => ( {children} ) diff --git a/packages/payment-widget/src/ui/widget.component.tsx b/packages/payment-widget/src/ui/widget.component.tsx index 7e5a591..0e18633 100644 --- a/packages/payment-widget/src/ui/widget.component.tsx +++ b/packages/payment-widget/src/ui/widget.component.tsx @@ -1,37 +1,70 @@ -import * as messagesRu from '../locales/ru.json' -import * as messagesEn from '../locales/en.json' +import * as messagesRu from '../locales/ru.json' +import * as messagesEn from '../locales/en.json' -import React from 'react' -import { IntlProvider } from 'react-intl' +import React from 'react' +import { Children } from 'react' +import { IntlProvider } from 'react-intl' +import { useMemo } from 'react' -import { LanguagesType } from '../enums' -import { WidgetProps } from '../interfaces' -import { Form } from './form.component' -import { ThemeProvider } from './theme/src' +import { LanguagesType } from '../enums' +import { WidgetProps } from '../interfaces' +import { Form } from './form' +import { FormProvider } from './form/form.provider' +import { useCustomButton } from '../hooks' +import { useCustomFields } from '../hooks' +import { getNameFields } from '../utils' const messages = { [LanguagesType.RUSSIAN]: messagesRu, [LanguagesType.ENGLISH]: messagesEn, } -export const Widget = ({ amount, settings, receipt, additionalFields, styles }: WidgetProps) => { +export const Widget = ({ + amount, + settings, + receipt, + additionalFields, + styles, + disabled, + children, +}: WidgetProps) => { const locale = settings.language ?? LanguagesType.RUSSIAN + const childrenArray = Children.toArray(children) + const customFieldsProps = useMemo( + () => ({ + existAmount: !!amount, + existReceipt: !!receipt, + existAdditionalFields: !!additionalFields?.length, + nodeArray: childrenArray, + }), + [amount, receipt, additionalFields, childrenArray] + ) + const { customFields, isGenerateReceiptField, isGenerateRequiredField } = + useCustomFields(customFieldsProps) + const customButton = useCustomButton(childrenArray) + const nameFields = getNameFields(customFields) return ( - - +
- - + useCustomButton={!!customButton} + useCustomFields={!!customFields.length} + > + {customFields} + {customButton} +
+
+
) } diff --git a/packages/payment-widget/src/ui/wrapper/button-wrapper.component.tsx b/packages/payment-widget/src/ui/wrapper/button-wrapper.component.tsx new file mode 100644 index 0000000..363c494 --- /dev/null +++ b/packages/payment-widget/src/ui/wrapper/button-wrapper.component.tsx @@ -0,0 +1,21 @@ +import { Condition } from '@atls-ui-parts/condition' + +import React from 'react' +import { FC } from 'react' + +import { ButtonType } from '../../enums' +import { ButtonWrapperProps } from '../../interfaces' +import { useForm } from '../form' + +export const ButtonWrapper: FC = ({ children }) => { + const { disabled, isLoaded } = useForm() + + return ( + + {children({ + type: ButtonType.Submit, + disabled: disabled || !isLoaded, + })} + + ) +} diff --git a/packages/payment-widget/src/ui/wrapper/index.ts b/packages/payment-widget/src/ui/wrapper/index.ts new file mode 100644 index 0000000..8a58f1c --- /dev/null +++ b/packages/payment-widget/src/ui/wrapper/index.ts @@ -0,0 +1,2 @@ +export * from './input-wrapper.component' +export * from './button-wrapper.component' diff --git a/packages/payment-widget/src/ui/wrapper/input-wrapper.component.tsx b/packages/payment-widget/src/ui/wrapper/input-wrapper.component.tsx new file mode 100644 index 0000000..e2c417b --- /dev/null +++ b/packages/payment-widget/src/ui/wrapper/input-wrapper.component.tsx @@ -0,0 +1,27 @@ +import { Condition } from '@atls-ui-parts/condition' + +import React from 'react' +import { FC } from 'react' +import { useIntl } from 'react-intl' + +import { InputWrapperProps } from '../../interfaces' +import { translate } from '../../utils/translate.util' +import { useForm } from '../form' + +export const InputWrapper: FC = ({ name, children }) => { + const { fieldsState, handleChange, handleBlur, errors } = useForm() + const intl = useIntl() + const translateError = translate(intl, errors[name], errors[name]) + + return ( + + {children({ + name, + value: fieldsState[name], + onChangeNative: handleChange, + onBlur: handleBlur, + errorText: translateError, + })} + + ) +} diff --git a/packages/payment-widget/src/utils/add-receipt-fields.util.ts b/packages/payment-widget/src/utils/add-receipt-fields.util.ts index 8862826..dec2d61 100644 --- a/packages/payment-widget/src/utils/add-receipt-fields.util.ts +++ b/packages/payment-widget/src/utils/add-receipt-fields.util.ts @@ -8,7 +8,5 @@ export const addReceiptFieldsUtil = (additionalFields: AdditionalField[]) => { field.name === AdditionalFieldsType.Email || field.name === AdditionalFieldsType.Phone ) - if (missingReceiptFields) return [...receiptFields, ...additionalFields] - - return additionalFields + return missingReceiptFields ? [...receiptFields, ...additionalFields] : additionalFields } diff --git a/packages/payment-widget/src/utils/get-name-fields.util.ts b/packages/payment-widget/src/utils/get-name-fields.util.ts new file mode 100644 index 0000000..63e5b15 --- /dev/null +++ b/packages/payment-widget/src/utils/get-name-fields.util.ts @@ -0,0 +1,13 @@ +import { ReactNode } from 'react' +import { isValidElement } from 'react' + +import { Field } from '../interfaces' + +export const getNameFields = (customFields: ReactNode[]) => + customFields.reduce((acc, field) => { + if (isValidElement(field)) + acc.push({ + name: field.props.name, + }) + return acc + }, []) diff --git a/packages/payment-widget/src/utils/index.ts b/packages/payment-widget/src/utils/index.ts index 140d34b..6c0fb00 100644 --- a/packages/payment-widget/src/utils/index.ts +++ b/packages/payment-widget/src/utils/index.ts @@ -1,3 +1,5 @@ export * from './pay.util' export * from './add-receipt-fields.util' export * from './convert-to-penny.util' +export * from './is-custom-element.util' +export * from './get-name-fields.util' diff --git a/packages/payment-widget/src/utils/is-custom-element.util.ts b/packages/payment-widget/src/utils/is-custom-element.util.ts new file mode 100644 index 0000000..5d59981 --- /dev/null +++ b/packages/payment-widget/src/utils/is-custom-element.util.ts @@ -0,0 +1,11 @@ +import { ReactNode } from 'react' +import { JSXElementConstructor } from 'react' +import { isValidElement } from 'react' + +import { NameWrapperComponent } from '../enums' + +export const isCustomElement = (nameNode: NameWrapperComponent, node: ReactNode): boolean => + isValidElement(node) + ? (node.type as JSXElementConstructor).name === nameNode && + typeof node.props.children === 'function' + : false diff --git a/yarn.lock b/yarn.lock index 6883e3d..5c68256 100644 --- a/yarn.lock +++ b/yarn.lock @@ -259,33 +259,6 @@ __metadata: languageName: unknown linkType: soft -"@atls/react-payment-widget@workspace:packages/payment-widget": - version: 0.0.0-use.local - resolution: "@atls/react-payment-widget@workspace:packages/payment-widget" - dependencies: - "@atls-ui-parts/button": "npm:0.0.12" - "@atls-ui-parts/condition": "npm:0.0.4" - "@atls-ui-parts/hidden-input": "npm:0.0.6" - "@atls-ui-parts/input": "npm:0.0.13" - "@atls-ui-parts/layout": "npm:0.0.7" - "@atls-ui-parts/text": "npm:0.0.11" - "@emotion/react": "npm:11.9.3" - "@emotion/styled": "npm:11.9.3" - "@types/react": "npm:18.2.20" - "@types/styled-system": "npm:5.1.16" - csstype: "npm:3.1.2" - react: "npm:18.2.0" - react-intl: "npm:6.4.4" - react-laag: "npm:2.0.5" - styled-system: "npm:5.1.5" - styled-tools: "npm:1.7.2" - peerDependencies: - "@emotion/react": 11.9.3 - "@emotion/styled": 11.9.3 - react: 18.2.0 - languageName: unknown - linkType: soft - "@atls/react-upload@workspace:packages/upload": version: 0.0.0-use.local resolution: "@atls/react-upload@workspace:packages/upload" @@ -337,6 +310,37 @@ __metadata: languageName: node linkType: hard +"@atls/tinkoff-payment-widget@workspace:packages/payment-widget": + version: 0.0.0-use.local + resolution: "@atls/tinkoff-payment-widget@workspace:packages/payment-widget" + dependencies: + "@atls-ui-parts/button": "npm:0.0.12" + "@atls-ui-parts/condition": "npm:0.0.4" + "@atls-ui-parts/hidden-input": "npm:0.0.6" + "@atls-ui-parts/input": "npm:0.0.13" + "@atls-ui-parts/layout": "npm:0.0.7" + "@atls-ui-parts/text": "npm:0.0.11" + "@emotion/jest": "npm:11.9.4" + "@emotion/react": "npm:11.9.3" + "@emotion/styled": "npm:11.9.3" + "@testing-library/react": "npm:14.1.0" + "@types/react": "npm:18.2.20" + "@types/react-dom": "npm:18" + "@types/styled-system": "npm:5.1.16" + csstype: "npm:3.1.2" + react: "npm:18.2.0" + react-dom: "npm:18.2.0" + react-intl: "npm:6.4.4" + react-laag: "npm:2.0.5" + styled-system: "npm:5.1.5" + styled-tools: "npm:1.7.2" + peerDependencies: + "@emotion/react": 11.9.3 + "@emotion/styled": 11.9.3 + react: 18.2.0 + languageName: unknown + linkType: soft + "@babel/code-frame@npm:^7.0.0, @babel/code-frame@npm:^7.10.4, @babel/code-frame@npm:^7.12.13, @babel/code-frame@npm:^7.22.10, @babel/code-frame@npm:^7.22.5": version: 7.22.10 resolution: "@babel/code-frame@npm:7.22.10" @@ -771,7 +775,7 @@ __metadata: languageName: node linkType: hard -"@emotion/css-prettifier@npm:^1.1.3": +"@emotion/css-prettifier@npm:^1.0.1, @emotion/css-prettifier@npm:^1.1.3": version: 1.1.3 resolution: "@emotion/css-prettifier@npm:1.1.3" dependencies: @@ -806,6 +810,27 @@ __metadata: languageName: node linkType: hard +"@emotion/jest@npm:11.9.4": + version: 11.9.4 + resolution: "@emotion/jest@npm:11.9.4" + dependencies: + "@babel/runtime": "npm:^7.13.10" + "@emotion/css-prettifier": "npm:^1.0.1" + chalk: "npm:^4.1.0" + specificity: "npm:^0.4.1" + stylis: "npm:4.0.13" + peerDependencies: + "@types/jest": ^26.0.14 || ^27.0.0 || ^28.0.0 + enzyme-to-json: ^3.2.1 + peerDependenciesMeta: + "@types/jest": + optional: true + enzyme-to-json: + optional: true + checksum: b25afc2d4edd07d42695fe2c1dc87642546cf053e421a9d6334998e6b22bd1947df2034e7f2609b8463304ec3e2cf88435c4ae51ba6e9936d75cd1380019c9a3 + languageName: node + linkType: hard + "@emotion/jest@npm:^11.9.1": version: 11.11.0 resolution: "@emotion/jest@npm:11.11.0" @@ -1804,6 +1829,22 @@ __metadata: languageName: node linkType: hard +"@testing-library/dom@npm:^9.0.0": + version: 9.3.3 + resolution: "@testing-library/dom@npm:9.3.3" + dependencies: + "@babel/code-frame": "npm:^7.10.4" + "@babel/runtime": "npm:^7.12.5" + "@types/aria-query": "npm:^5.0.1" + aria-query: "npm:5.1.3" + chalk: "npm:^4.1.0" + dom-accessibility-api: "npm:^0.5.9" + lz-string: "npm:^1.5.0" + pretty-format: "npm:^27.0.2" + checksum: dbb4ce29730058e7ad2f610a1f1907e1ac28abfd8389d36d11fad7d48ef7bc08b1c87f89a97cc1cd1ac85b38665697fdecae712ca5ed3e7b86ffcdd07ae7b52e + languageName: node + linkType: hard + "@testing-library/jest-dom@npm:^5.16.1, @testing-library/jest-dom@npm:^5.16.2": version: 5.17.0 resolution: "@testing-library/jest-dom@npm:5.17.0" @@ -1843,6 +1884,20 @@ __metadata: languageName: node linkType: hard +"@testing-library/react@npm:14.1.0": + version: 14.1.0 + resolution: "@testing-library/react@npm:14.1.0" + dependencies: + "@babel/runtime": "npm:^7.12.5" + "@testing-library/dom": "npm:^9.0.0" + "@types/react-dom": "npm:^18.0.0" + peerDependencies: + react: ^18.0.0 + react-dom: ^18.0.0 + checksum: 3369b0818317456725a9ae4c012b50b88e94406d2c7688faddba918add0bcb46957f6bd0d760a1fbfc06986adf7d048e14c767901c7adb6f20d6e175197a77ac + languageName: node + linkType: hard + "@testing-library/react@npm:^12.1.2, @testing-library/react@npm:^12.1.3": version: 12.1.5 resolution: "@testing-library/react@npm:12.1.5" @@ -2049,6 +2104,15 @@ __metadata: languageName: node linkType: hard +"@types/react-dom@npm:18, @types/react-dom@npm:^18.0.0": + version: 18.2.15 + resolution: "@types/react-dom@npm:18.2.15" + dependencies: + "@types/react": "npm:*" + checksum: e3aa4cbd0edbae1d9d7ced55da2306a2eae966aa6fcf9a2d220ff304676bf40d541ef3dd4c84d64f29002d71699816a2043685a6799d8c9342d210d4019bebeb + languageName: node + linkType: hard + "@types/react-dom@npm:18.2.7, @types/react-dom@npm:>=16.9.0, @types/react-dom@npm:^18.2.7": version: 18.2.7 resolution: "@types/react-dom@npm:18.2.7" @@ -6264,7 +6328,7 @@ __metadata: languageName: node linkType: hard -"react-dom@npm:^18.2.0": +"react-dom@npm:18.2.0, react-dom@npm:^18.2.0": version: 18.2.0 resolution: "react-dom@npm:18.2.0" dependencies: @@ -6896,6 +6960,13 @@ __metadata: languageName: node linkType: hard +"stylis@npm:4.0.13": + version: 4.0.13 + resolution: "stylis@npm:4.0.13" + checksum: 3231e328da331d07673edc39f1bf0e741d0b891473764b116fe4f4eb22c595435f142860f7a54ddff32bf64ecdd3dbe356cc608a029c4f066d5c5b7f1315d996 + languageName: node + linkType: hard + "stylis@npm:4.2.0": version: 4.2.0 resolution: "stylis@npm:4.2.0"