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 (
+
+ )
+}
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"