JSFiddle - React, Tailwind, and code Playground
by irinablue
JavaScript
const event = {"id":14,"rule_id":1,"selector":".product_page .product-wrap.product .basket_btn:not(.not_active),.product_page .product-wrap.product .basket_btn:not(.not_active) > *,.product_info_top.product .basket_btn:not(.not_active),.product_info_top.product .basket_btn:not(.not_active) > *,.product + .different-volumes .basket_btn:not(.not_active),.product_fixed_menu .basket_btn:not(.not_active),.product_fixed_menu .basket_btn:not(.not_active) *","name":"product mobile","type":"click","data_grabber":"{\"qty\": \"KMTXMobileProductQty\", \"price\": \"KmtxGetPrice\", \"rates_qty\": \"GetRatesQty\", \"stars_qty\": \"GetStarsForAddProduct\", \"brand_name\": \"KmtxProductBrandName\", \"generic_id\": \"KmtxProductGenericId\", \"product_id\": \"KmtxGetProductId\", \"comments_qty\": \"GetCommentsQty\", \"expert_choice\": \"isExpertChoice\", \"original_price\": \"KmtxOriginalPrice\", \"product_advantages\": \"isBrandDescriptionExist\", \"reviews_have_files\": \"reviewHaveFile\"}","uri":null,"created_at":"2019-04-29 09:42:23","updated_at":"2021-10-12 10:56:26","deleted_at":null,"impression_variable_id":8,"track_visual_impression":true,"parent_id":null,"is_dynamic_content":false,"validation_required_fields":"qty,price","is_draft":false,"draft_related_event_id":null,"variables":[{"id":7,"account_id":1,"is_global":0,"name":"KmtxGetQty","system_name":"qty","alias":"Kmtx Get Qty","code":"[\n {\n input: {\n get: 'value',\n where: [\n 'input.quantity',\n 'input.amount',\n 'input.ammount',\n 'input.qty',\n 'input[name=\"qty\"]',\n 'input[name=\"quantity\"]',\n 'input[name=\"amount\"]',\n 'input[data-qty]',\n 'input.pkw-product__input',\n 'input.pkw-related__counter-input',\n 'select.quantity',\n 'select.amount',\n 'select.ammount',\n ...