[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of product-review-commons/manifest.json from the product-review-commons VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "product-review-commons",
  "version": "0.1.0",
  "title": "IO Base Component",
  "description": "IO Base component",
  "defaultLocale": "pt-BR",
  "builders": {
    "messages": "1.x",
    "store": "0.x",
    "react": "3.x",
    "docs": "0.x"
  },
  "mustUpdateAt": "2019-04-02",
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "dependencies": {
    "vtex.styleguide": "9.x",
    "vtex.store-icons": "0.x"
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of code-cup/manifest.json from the code-cup VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "code-cup",
  "version": "1.0.4",
  "title": "VTEX Code Cup landing page",
  "description": "VTEX Code Cup landing page",
  "builders": {
    "docs": "0.x",
    "react": "3.x",
    "store": "0.x",
    "styles": "1.x"
  },
  "dependencies": {
    "vtex.styleguide": "9.x"
  },
  "mustUpdateAt": "2018-09-05",
  "categories": [],
  "registries": ["smartcheckout"],
  "settingsSchema": {},
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of butik/doczrc.js from the butik VTEX app.

[Assistant]
Here's the implementation:

```javascript
import { css } from 'docz-plugin-css'

export default {
  title: 'VTEX Butik',
  plugins: [
    css({
      preprocessor: 'postcss',
    }),
  ],
  ignore: ['lib'],
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of butik/nwb.config.js from the butik VTEX app.

[Assistant]
Here's the implementation:

```javascript
module.exports = {
  type: 'react-component',
  npm: {
    esModules: true,
    umd: false
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of butik/README.md from the butik VTEX app.

[Assistant]
Here's the implementation:

```markdown
# Butik

> VTEX Butik React components ([Docs](https://butik.vtex.com))

- [Usage](#usage)
  - [Installing](#installing)
  - [Import intl translations](#import-intl-translations)
- [Docz](#docz)
  - [Running local docz page](#running-local-docz-page)

## Usage

For instructions on how to use Butik components in your project refer to the page itself: https://butik.vtex.com.

### Installing

npm
```sh
npm install @vtex/butik
```

VTEX IO
```sh
vtex install vtex.butik
```

### Import intl translations
Import translation files like above and add them to your react-intl
```javascript
import ptMessages from '@vtex/butik/messages/pt-BR.json'
import enMessages from '@vtex/butik/messages/en-US.json'
import esMessages from '@vtex/butik/messages/es-AR.json'
```

## Docz

### Running local docz page
```sh
npm start
```

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of butik/babel.config.js from the butik VTEX app.

[Assistant]
Here's the implementation:

```javascript
module.exports = api => {
  const presets = ['@babel/preset-env', '@babel/preset-react']
  const plugins = [
    'transform-es2015-modules-commonjs',
    'dynamic-import-node',
    '@babel/plugin-proposal-class-properties',
    '@babel/plugin-syntax-class-properties',
  ]

  api.cache(false)

  return { presets, plugins }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of butik/package.json from the butik VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "@vtex/butik",
  "version": "1.3.6",
  "description": "VTEX components for store front",
  "main": "lib/index.js",
  "module": "es/index.js",
  "files": [
    "lib",
    "messages"
  ],
  "scripts": {
    "start": "docz dev",
    "test": "nwb test-react",
    "test:coverage": "nwb test-react --coverage",
    "test:watch": "nwb test-react --server",
    "docz:build": "docz build",
    "prepublishOnly": "run-s compile",
    "deploy": "react-scripts deploy",
    "lint": "eslint react",
    "lint-fix": "eslint react --fix --max-warnings 0",
    "prettier-conflict-check": "eslint --print-config .eslintrc | eslint-config-prettier-check",
    "babel": "NODE_ENV=production babel react/components --out-dir lib --copy-files",
    "cleanlib": "rm -rf lib",
    "compile": "run-s cleanlib babel",
    "vtex-io": "run-s entrypoints manifest-version",
    "prereleasy": "npm run vtex-io",
    "postreleasy": "vtex publish --public --verbose"
  },
  "dependencies": {
    "@material-ui/core": "^3.6.2",
    "classnames": "^2.2.6",
    "debounce": "^1.2.0",
    "lodash": "^4.17.11",
    "object-hash": "^1.3.1",
    "ramda": "^0.26.1",
    "react-content-loader": "^3.4.1",
    "react-docgen": "^2.21.0",
    "react-html-parser": "^2.0.2",
    "react-id-swiper": "^1.6.8",
    "react-intl": "^2.7.2",
    "react-transition-group": "^2.5.1",
    "vtex-tachyons": "^2.10.0",
    "xstate": "^4.2.2"
  },
  "peerDependencies": {
    "react": "16.x",
    "@vtex/styleguide": "9.x"
  },
  "devDependencies": {
    "@babel/cli": "^7.2.3",
    "@babel/core": "^7.2.2",
    "@babel/plugin-proposal-class-properties": "^7.2.3",
    "@babel/plugin-syntax-class-properties": "^7.2.0",
    "@babel/preset-env": "^7.2.3",
    "@babel/preset-react": "^7.0.0",
    "@vtex/react-scripts": "1.2.0",
    "babel-eslint": "^8.2.6",
    "babel-loader": "^8.0.5",
    "babel-plugin-dynamic-import-node": "^1.2.0",
    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
    "copyfiles": "^1.2.0",
    "docz": "^0.13.7",
    "docz-plugin-css": "^0.11.0",
    "docz-theme-default": "^0.13.7",
    "enzyme": "^3.3.0",
    "enzyme-adapter-react-16": "^1.1.1",
    "enzyme-react-intl": "^2.0.0",
    "eslint": "^5.10.0",
    "eslint-config-prettier": "^3.3.0",
    "eslint-config-vtex": "^8.0.0",
    "eslint-config-vtex-react": "^3.0.3",
    "eslint-config-vtex-react-app": "^3.1.1",
    "eslint-loader": "^2.1.1",
    "eslint-plugin-flowtype": "2",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^6.1.2",
    "eslint-plugin-lodash": "^4.0.0",
    "eslint-plugin-prettier": "^3.0.0",
    "eslint-plugin-react": "^7.7.0",
    "eslint-utils": "^1.3.1",
    "html-webpack-plugin": "^3.2.0",
    "husky": "^1.1.3",
    "inferno": "^7.0.4",
    "jest": "^22.4.4",
    "jest-enzyme": "^6.0.2",
    "jscodeshift": "^0.5.0",
    "npm-run-all": "^4.1.3",
    "nwb": "^0.23.0",
    "prettier": "^1.15.3",
    "prettier-eslint": "^8.8.2",
    "prop-types": "^15.6.2",
    "react": "^16.6.3",
    "react-dom": "^16.6.3",
    "react-hot-loader": "^4.6.3",
    "watch": "^1.0.2",
    "webpack": "^4.28.1",
    "@vtex/styleguide": "^9.72.4"
  },
  "author": "",
  "homepage": "",
  "license": "MIT",
  "repository": "",
  "keywords": [
    "react-component"
  ]
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of butik/manifest.json from the butik VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "butik",
  "version": "1.4.0",
  "title": "VTEX Butik",
  "description": "VTEX components for store front",
  "builders": {
    "react": "2.x",
    "messages": "0.x",
    "docs": "0.x"
  },
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "mustUpdateAt": "2019-08-09",
  "categories": [],
  "registries": [
    "smartcheckout"
  ],
  "settingsSchema": {},
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of sms-link/README.md from the sms-link VTEX app.

[Assistant]
Here's the implementation:

```markdown
## sms-link

This app and all affiliated services are provided “as is”, without warranty of any kind, either express or implied. Neither the publisher nor its partners, affiliates, employees, or contractors guarantee that this app will meet your requirements, provide uninterrupted use, or operate without delay or without error. Neither the publisher nor its partners, affiliates, employees, or contractors assume any responsibility for any errors and malfunctions within the app and will not provide support or maintenance of any kind.

All provisions and warranties of any kind, express or implied, including but not limited to any guarantees of performance, process integrity, or particular functionalities, are hereby disclaimed and excluded unless otherwise prohibited or restricted by applicable law.

_Developed under EE FPA._
```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of sms-link/package.json from the sms-link VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "smslink",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@types/node": "^12.12.21",
    "@vtex/prettier-config": "^0.3.1",
    "eslint": "^7.4.0",
    "eslint-config-vtex": "^12.7.0",
    "eslint-config-vtex-react": "^6.7.0",
    "husky": "^4.2.0",
    "lint-staged": "^10.0.2",
    "prettier": "^2.0.5",
    "typescript": "^3.8.3"
  },
  "dependencies": {
    "splunk-events": "^1.7.0"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of sms-link/manifest.json from the sms-link VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "smslink",
  "vendor": "vtex",
  "version": "0.3.0",
  "title": "SMSLink",
  "description": "This application allows the sending of transactional SMS messages to customers using SMSLink SMS Gateway",
  "categories": [],
  "dependencies": {
    "vtex.styleguide": "9.x"
  },
  "builders": {
    "node": "6.x",
    "docs": "0.x",
    "messages": "1.x"
  },
  "scripts": {
    "prereleasy": "bash lint.sh"
  },
  "credentialType": "absolute",
  "policies": [
    {
      "name": "colossus-fire-event"
    },
    {
      "name": "colossus-write-logs"
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "{{account}}.vtexcommercestable.com.br",
        "path": "/api/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "portal.vtexcommercestable.com.br",
        "path": "/api/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "api.vtex.com",
        "path": "/dataentities/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "splunk-heavyforwarder-public.vtex.com",
        "path": "*"
      }
    },
    {
      "name": "OMSViewer"
    },
    {
      "name": "ListOrders"
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "secure.smslink.ro",
        "path": "/*"
      }
    }
  ],
  "settingsSchema": {
    "title": "VTEX SMSLink",
    "type": "object",
    "properties": {
      "enableSandbox": {
        "title": "Enable Test Mode",
        "type": "boolean",
        "default": false
      },
      "connectionID": {
        "title": "Connection ID",
        "type": "string",
        "description": "Connection ID key"
      },
      "password": {
        "title": "Password",
        "type": "string",
        "description": "Connection password"
      },
      "allowSendOrderReceivedSMS": {
        "title": "Send Order received SMS",
        "type": "boolean",
        "default": true,
        "description": "If active a SMS will be sent on receiving the Order"
      },
      "orderReceivedText": {
        "title": "Order received SMS message",
        "type": "string",
        "default": "We received your order {order_id}",
        "pattern": "[a-zA-Z0-9 \\!\\@\\#\\$\\%\\&\\*\\(\\)\\_\\+\\-\\=\\;\\:\\,\\.\\<\\>\\/\\?\\[\\]\\{\\}\\|\\^\\~\\\\\"\\'\\`\\{\\}\\\r\\\n\\\t]$",
        "description": "The <message> string can only contain: abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%&*()_+--+=;:,.<>/?[]{}|^~\\\"'` and \r (carriage return), \n (line feed), \t (tab)."
      },
      "allowPaymentAuthorizedSMS": {
        "title": "Send Online payment authorized SMS",
        "type": "boolean",
        "default": true,
        "description": "If active a SMS will be sent on receiving the Order Payment confirmation"
      },
      "onlinePaymentAuthorizedText": {
        "title": "Online payment Authorized SMS message",
        "type": "string",
        "default": "Order {order_id} payment authorized",
        "pattern": "[a-zA-Z0-9 \\!\\@\\#\\$\\%\\&\\*\\(\\)\\_\\+\\-\\=\\;\\:\\,\\.\\<\\>\\/\\?\\[\\]\\{\\}\\|\\^\\~\\\\\"\\'\\`\\{\\}\\\r\\\n\\\t]$",
        "description": "The <message> string can only contain: abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%&*()_+--+=;:,.<>/?[]{}|^~\\\"'` and \r (carriage return), \n (line feed), \t (tab)."
      },
      "allowPaymentErrorSMS": {
        "title": "Send Online payment error SMS",
        "type": "boolean",
        "default": true,
        "description": "If active a SMS will be sent on Payment failure"
      },
      "onlinePaymentErrorText": {
        "title": "Online payment error SMS message",
        "type": "string",
        "default": "Order {order_id} payment error",
        "pattern": "[a-zA-Z0-9 \\!\\@\\#\\$\\%\\&\\*\\(\\)\\_\\+\\-\\=\\;\\:\\,\\.\\<\\>\\/\\?\\[\\]\\{\\}\\|\\^\\~\\\\\"\\'\\`\\{\\}\\\r\\\n\\\t]$",
        "description": "The <message> string can only contain: abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%&*()_+--+=;:,.<>/?[]{}|^~\\\"'` and \r (carriage return), \n (line feed), \t (tab)."
      },
      "allowCancelledOrderSMS": {
        "title": "Send Order cancelled SMS",
        "type": "boolean",
        "default": true,
        "description": "If active a SMS will be sent on cancelling an Order"
      },
      "orderCancelledText": {
        "title": "Order cancelled SMS message",
        "type": "string",
        "default": "Order {order_id} cancelled",
        "pattern": "[a-zA-Z0-9 \\!\\@\\#\\$\\%\\&\\*\\(\\)\\_\\+\\-\\=\\;\\:\\,\\.\\<\\>\\/\\?\\[\\]\\{\\}\\|\\^\\~\\\\\"\\'\\`\\{\\}\\\r\\\n\\\t]$",
        "description": "The <message> string can only contain: abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%&*()_+--+=;:,.<>/?[]{}|^~\\\"'` and \r (carriage return), \n (line feed), \t (tab)."
      },
      "allowSendReturnRequestSMS": {
        "title": "Send Return request SMS",
        "type": "boolean",
        "default": true,
        "description": "If active a SMS will be sent when a Return request is received."
      },
      "sendReturnRequestText": {
        "title": "Return request received SMS message",
        "type": "string",
        "default": "New return request {request_id} received",
        "pattern": "[a-zA-Z0-9 \\!\\@\\#\\$\\%\\&\\*\\(\\)\\_\\+\\-\\=\\;\\:\\,\\.\\<\\>\\/\\?\\[\\]\\{\\}\\|\\^\\~\\\\\"\\'\\`\\{\\}\\\r\\\n\\\t]$",
        "decription": "The <message> string can only contain: abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%&*()_+--+=;:,.<>/?[]{}|^~\\\"'` and \r (carriage return), \n (line feed), \t (tab)."
      },
      "allowSendReturnedParcelReceivedSMS": {
        "title": "Send Returned parcel received by store SMS",
        "type": "boolean",
        "default": true,
        "description": "If active a SMS will be sent when a Return parcel is received."
      },
      "sendReturnedParcelReceivedText": {
        "title": "Send Returned parcel received by store SMS message",
        "type": "string",
        "default": "Returned parcel {request_id} received by store",
        "pattern": "[a-zA-Z0-9 \\!\\@\\#\\$\\%\\&\\*\\(\\)\\_\\+\\-\\=\\;\\:\\,\\.\\<\\>\\/\\?\\[\\]\\{\\}\\|\\^\\~\\\\\"\\'\\`\\{\\}\\\r\\\n\\\t]$",
        "decription": "The <message> string can only contain: abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%&*()_+--+=;:,.<>/?[]{}|^~\\\"'` and \r (carriage return), \n (line feed), \t (tab)."
      },
      "allowSendReturnRequestFinalizedSMS": {
        "title": "Return request finalized SMS",
        "type": "boolean",
        "default": true,
        "description": "If active a SMS will be sent when a Return request is finalized."
      },
      "sendReturnRequestFinalizedText": {
        "title": "Return request finalized SMS message",
        "type": "string",
        "default": "Return request {request_id} finalized",
        "pattern": "[a-zA-Z0-9 \\!\\@\\#\\$\\%\\&\\*\\(\\)\\_\\+\\-\\=\\;\\:\\,\\.\\<\\>\\/\\?\\[\\]\\{\\}\\|\\^\\~\\\\\"\\'\\`\\{\\}\\\r\\\n\\\t]$",
        "decription": "The <message> string can only contain: abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%&*()_+--+=;:,.<>/?[]{}|^~\\\"'` and \r (carriage return), \n (line feed), \t (tab)."
      },
      "allowSendReturnRequestDeniedSMS": {
        "title": "Return request denied SMS",
        "type": "boolean",
        "default": true,
        "description": "If active a SMS will be sent when a Return request is denied."
      },
      "sendReturnRequestDeniedText": {
        "title": "Return request denied SMS message",
        "type": "string",
        "default": "Return request {request_id} denied",
        "pattern": "[a-zA-Z0-9 \\!\\@\\#\\$\\%\\&\\*\\(\\)\\_\\+\\-\\=\\;\\:\\,\\.\\<\\>\\/\\?\\[\\]\\{\\}\\|\\^\\~\\\\\"\\'\\`\\{\\}\\\r\\\n\\\t]$",
        "decription": "The <message> string can only contain: abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%&*()_+--+=;:,.<>/?[]{}|^~\\\"'` and \r (carriage return), \n (line feed), \t (tab)."
      }
    },
    "required": [
      "connectionID",
      "password"
    ]
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of payment-connector-aws-cdk-node-template/cdk.json from the payment-connector-aws-cdk-node-template VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "app": "npx ts-node --prefer-ts-exts bin/vtex-connector.ts",
  "watch": {
    "include": [
      "**"
    ],
    "exclude": [
      "README.md",
      "cdk*.json",
      "**/*.d.ts",
      "**/*.js",
      "tsconfig.json",
      "package*.json",
      "yarn.lock",
      "node_modules",
      "test"
    ]
  },
  "context": {
    "@aws-cdk/aws-lambda:recognizeLayerVersion": true,
    "@aws-cdk/core:checkSecretUsage": true,
    "@aws-cdk/core:target-partitions": [
      "aws",
      "aws-cn"
    ],
    "@aws-cdk-containers/ecs-service-extensions:enableDefaultLogDriver": true,
    "@aws-cdk/aws-ec2:uniqueImdsv2TemplateName": true,
    "@aws-cdk/aws-ecs:arnFormatIncludesClusterName": true,
    "@aws-cdk/aws-iam:minimizePolicies": true,
    "@aws-cdk/core:validateSnapshotRemovalPolicy": true,
    "@aws-cdk/aws-codepipeline:crossAccountKeyAliasStackSafeResourceName": true,
    "@aws-cdk/aws-s3:createDefaultLoggingPolicy": true,
    "@aws-cdk/aws-sns-subscriptions:restrictSqsDescryption": true,
    "@aws-cdk/aws-apigateway:disableCloudWatchRole": true,
    "@aws-cdk/core:enablePartitionLiterals": true,
    "@aws-cdk/aws-events:eventsTargetQueueSameAccount": true,
    "@aws-cdk/aws-iam:standardizedServicePrincipals": true,
    "@aws-cdk/aws-ecs:disableExplicitDeploymentControllerForCircuitBreaker": true,
    "@aws-cdk/aws-iam:importedRoleStackSafeDefaultPolicyName": true,
    "@aws-cdk/aws-s3:serverAccessLogsUseBucketPolicy": true,
    "@aws-cdk/aws-route53-patters:useCertificate": true,
    "@aws-cdk/customresources:installLatestAwsSdkDefault": false,
    "@aws-cdk/aws-rds:databaseProxyUniqueResourceName": true,
    "@aws-cdk/aws-codedeploy:removeAlarmsFromDeploymentGroup": true,
    "@aws-cdk/aws-apigateway:authorizerChangeDeploymentLogicalId": true,
    "@aws-cdk/aws-ec2:launchTemplateDefaultUserData": true,
    "@aws-cdk/aws-secretsmanager:useAttachedSecretResourcePolicyForSecretTargetAttachments": true,
    "@aws-cdk/aws-redshift:columnId": true,
    "@aws-cdk/aws-stepfunctions-tasks:enableEmrServicePolicyV2": true,
    "@aws-cdk/aws-ec2:restrictDefaultSecurityGroup": true,
    "@aws-cdk/aws-apigateway:requestValidatorUniqueId": true
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of payment-connector-aws-cdk-node-template/README.md from the payment-connector-aws-cdk-node-template VTEX app.

[Assistant]
Here's the implementation:

```markdown
# Hackathon VTEX Payments

## PARTE 1.1 - AWS Access - Console AWS (Via Eventos da AWS)*
1. Receber event hash da AWS
2. Acessar https://dashboard.eventengine.run/login e entrar com o event hash
3. Clicar em Open Console. Bem vindo ao console AWS, aqui você tem acesso a todas as ferramentas e serviços AWS.

'* Essa é uma das forma de obter uma conta AWS com acesso ao console. Mas para seguir os passos seguintes, você poderia usar outras contas AWS.

## PARTE 1.2 - AWS Access - Criar novo usuário AWS para cada membro do time (incluindo para a pessoa que recebeu a conta de evento AWS)
1. Com o Console AWS aberto, na caixa de Search, procure por IAM e entre na página deste serviço
2. Clicar em Users no menu da esquerda.
3. Add user
4. Depois de entrar um username, selecione "Provide user access to the AWS Management Console" e depois "I want to create an IAM user".
5. Defina as regras de password que preferir e clique em next.
6. Depois, selecione `Attach Policies Directly`
7. Selecione `AdministratorAccess` e clique next
8. Revise e finalize a criação do usuário.
9. Depois de finalizado, clique em "Return to users list" e volte à página de listagem de usuarios, clique no usuário recém criado e clique na aba `security credentials``
10. Clique em `create access key` e selecione `Command Line Interface (CLI)`
11. Anote `Access key` e o `Secret access key` em um lugar seguro pois será usado para que este usuário tenha acesso via AWS CLI e o próprio CDK

## PARTE 1.3 - AWS Access - Configurando AWS CLI
1. Instale o npm (14.15.0 or later)
2. Instale o [aws cli](https://docs.aws.amazon.com/pt_br/cli/latest/userguide/getting-started-install.html)
3. Execute `aws configure` via terminal e entre com os valores de `Access key` e o `Secret access key` que você obteve no passo anterior
4. Rode um comando simples como `aws s3 ls` sem que erros sejam mostrados para testar o CLI

## PARTE 2.1 - Rodando CDK - Instalação
1. Rode o comando `npm install -g aws-cdk`

## PARTE 2.2 - Rodando CDK - Executando o modelo
1. Na pasta raiz deste projeto clonado, rode o comando `npm install` para buildar o código
2. npm install aws-sdk
3. Faça um `cdk bootstrap`. Todo o toolkit aws necessário será providenciado na cloud AWS
4. Faça um `cdk deploy`
5. Acesse o console e verifique os serviços que subiram via cloudformation
6. Use `cdk watch` para acionar o deploy automaticamente ao salvar mudanças nos seus arquivos.

## DICAS VALIOSAS
### VIDEO DE TREINAMENTO DE CDK AWS - Assista o vídeo antes de começar o desenvolvimento:
### CDK – Para se familiarizar com o CDK, execute o máximo que der o workshop em https://cdkworkshop.com/
### CLOUD9 – Usar a IDE da AWS pode facilitar sua vida (nao precisaria instalar aws cli e nem aws cdk e nem rodar nada local na sua máquina e todo o deploy de infraestrutura é muito mais rápido)
### CODE WHISPERER – Quer adicionar AI na sua IDE que vai facilitar muito escrever uma stack no CDK? Utilize o code whisperer! Mais informações: https://medium.com/@neonforge/amazon-codewhisperer-how-to-install-ai-code-assistant-for-visual-studio-code-and-use-it-for-free-2580057d48a0
### CONTAS AWS – A partir da conta principal recebida pelo líder do time, criem contas para os demais participantes COM acesso ao console!
### SNIPPETS - Dentro dos Lambdas no CDK, existem snippets de escrita/leitura em DynamoDB e escrita/leitura no SQS para facilitar sua vida
### ARQUITETURA – Lembre-se que a arquitetura proposta é só uma sugestão simplificada. Modificações pensando em segurança, alta disponibilidade e escalabilidade podem dar pontos extras

* Work hard. Have fun. Make history.
```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of payment-connector-aws-cdk-node-template/package.json from the payment-connector-aws-cdk-node-template VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "vtex-connector",
  "version": "0.1.0",
  "bin": {
    "vtex-connector": "bin/vtex-connector.js"
  },
  "scripts": {
    "build": "tsc",
    "watch": "tsc -w",
    "test": "jest",
    "cdk": "cdk"
  },
  "devDependencies": {
    "@aws/dynamodb-data-mapper": "^0.7.3",
    "@types/aws-lambda": "^8.10.115",
    "@types/jest": "^29.5.1",
    "@types/node": "20.1.7",
    "aws-cdk": "2.81.0",
    "esbuild": "^0.17.19",
    "jest": "^29.5.0",
    "ts-jest": "^29.1.0",
    "ts-node": "^10.9.1",
    "typescript": "~5.0.4"
  },
  "dependencies": {
    "aws-cdk-lib": "2.81.0",
    "aws-lambda": "^1.0.7",
    "aws-sdk": "^2.1390.0",
    "axios": "^1.4.0",
    "constructs": "^10.0.0",
    "source-map-support": "^0.5.21"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of tax-protocol-example/package.json from the tax-protocol-example VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "tax-protocol-example",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@types/node": "^12.12.21",
    "@vtex/prettier-config": "^0.3.0",
    "eslint": "^6.8.0",
    "eslint-config-vtex": "^12.2.1",
    "husky": "^4.2.0",
    "lint-staged": "^10.0.2",
    "prettier": "^1.19.1",
    "typescript": "^3.7.5"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of tax-protocol-example/manifest.json from the tax-protocol-example VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "tax-protocol-example",
  "vendor": "vtex",
  "version": "1.0.3",
  "title": "Tax Protocol Example",
  "description": "Reference app for Tax Protocol Services",
  "mustUpdateAt": "2018-01-04",
  "categories": [],
  "dependencies": {},
  "builders": {
    "graphql": "1.x",
    "node": "6.x",
    "docs": "0.x"
  },
  "scripts": {
    "prereleasy": "bash lint.sh"
  },
  "credentialType": "absolute",
  "policies": [
    {
      "name": "SaveOrderFormConfiguration"
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "api.vtex.com",
        "path": "/api/checkout/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "api.vtex.com",
        "path": "/api/logistics/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "api.vtex.com",
        "path": "/api/catalog/*"
      }
    }
  ],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of geolocation-graphql-interface/manifest.json from the geolocation-graphql-interface VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "geolocation-graphql-interface",
  "version": "0.3.0",
  "title": "GraphQL interface for geolocation APIs",
  "description": "GraphQL schemas that can be used to implement your own geolocation resolver",
  "credentialType": "absolute",
  "builders": {
    "graphql": "1.x",
    "docs": "0.x"
  },
  "dependencies": {},
  "policies": [
    {
      "name": "graphql-query"
    }
  ],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of checkout-resources/package.json from the checkout-resources VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "checkout-resources",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,js,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ],
    "*.json": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@vtex/prettier-config": "^0.1.3",
    "eslint": "^6.8.0",
    "eslint-config-vtex": "^12.0.3",
    "eslint-config-vtex-react": "^6.0.3",
    "husky": "^4.2.0",
    "lint-staged": "^10.0.2",
    "prettier": "^1.19.1",
    "typescript": "^3.7.5"
  }
}
```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of checkout-resources/manifest.json from the checkout-resources VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "checkout-resources",
  "version": "0.50.1",
  "title": "Checkout Resources",
  "description": "Checkout Resources",
  "defaultLocale": "pt-BR",
  "builders": {
    "react": "3.x",
    "docs": "0.x"
  },
  "mustUpdateAt": "2019-04-02",
  "dependencies": {
    "vtex.checkout-graphql": "0.x",
    "vtex.gateway-graphql": "1.x",
    "vtex.apps-graphql": "3.x"
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of store-form/package.json from the store-form VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "store-form",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@vtex/prettier-config": "^0.1.3",
    "eslint": "^6.8.0",
    "eslint-config-vtex": "^12.2.1",
    "eslint-config-vtex-react": "^6.2.1",
    "husky": "^4.2.0",
    "lint-staged": "^10.0.2",
    "prettier": "^1.19.1",
    "typescript": "^3.8.3"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of store-form/manifest.json from the store-form VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "store-form",
  "version": "0.10.2",
  "title": "VTEX store-form",
  "description": "Build forms based on Master Data",
  "builders": {
    "react": "3.x",
    "messages": "1.x",
    "docs": "0.x",
    "store": "0.x"
  },
  "dependencies": {
    "vtex.styleguide": "9.x",
    "vtex.store-graphql": "2.x",
    "vtex.css-handles": "0.x",
    "vtex.native-types": "0.x",
    "vtex.file-manager": "0.x",
    "vtex.file-manager-graphql": "0.x"
  },
  "registries": [
    "smartcheckout"
  ],
  "policies": [],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of open-graph/package.json from the open-graph VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "open-graph",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@vtex/prettier-config": "^0.1.3",
    "eslint": "^6.8.0",
    "eslint-config-vtex": "^12.2.1",
    "eslint-config-vtex-react": "^6.2.1",
    "husky": "^4.2.0",
    "lint-staged": "^10.0.2",
    "prettier": "^1.19.1",
    "typescript": "^3.7.5"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of open-graph/manifest.json from the open-graph VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "open-graph",
  "version": "1.4.1",
  "title": "Open Graph",
  "description": "Open Graph tags",
  "builders": {
    "react": "3.x",
    "docs": "0.x"
  },
  "mustUpdateAt": "2019-04-02",
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "dependencies": {
    "vtex.product-context": "0.x",
    "vtex.apps-graphql": "3.x"
  },
  "settingsSchema": {
    "title": "Structured data",
    "type": "object",
    "access": "public",
    "properties": {
      "disableOffers": {
        "title": "Disable Offers",
        "type": "boolean",
        "default": false,
        "description": "Disable product offers"
      }
    }
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of product-details/README.md from the product-details VTEX app.

[Assistant]
Here's the implementation:

```markdown
# VTEX Product Details [DEPRECATED]

## Description

The VTEX Category Menu app shows the details of a product like image, name and price. THis app is used by store theme.

:loudspeaker: **Disclaimer:** Don't fork this project. Use, contribute, or open issue with your feature request.

## Release schedule

| Release |       Status        | Initial Release | Maintenance LTS Start | End-of-life | Dreamstore Compatibility |
| :-----: | :-----------------: | :-------------: | :-------------------: | :---------: | :----------------------: |
|  [1.x]  | **Current Release** |   2018-11-28    |                       |             |           2.x            |
|  [0.x]  | **Maintenance LTS** |   2018-05-29    |      2018-11-28       | March 2019  |           1.x            |

See our [LTS policy](https://github.com/vtex-apps/awesome-io#lts-policy) for more information.

## Table of Contents

- [Usage](#usage)
  - [Blocks API](#blocks-api)
    - [Configuration](#configuration)
  - [Styles API](#styles-api)
    - [CSS namespaces](#css-namespaces)
- [Troubleshooting](#troubleshooting)
- [Contributing](#contributing)
- [Tests](#tests)

## Usage

This app uses our store builder with the blocks architecture. To know more about Store Builder [click here.](https://help.vtex.com/en/tutorial/understanding-storebuilder-and-stylesbuilder#structuring-and-configuring-our-store-with-object-object)

We add the product-details as a block in our [Store Header](https://github.com/vtex-apps/store-header/blob/master/store/interfaces.json).

To configure or customize this app, you need to import it in your dependencies in `manifest.json`.

```json
  dependencies: {
    "vtex.product-details": "1.x"
  }
```

Then, add `product-details` block into your app theme, like we do in our [Store theme app](https://github.com/vtex-apps/store-theme/blob/master/store/blocks.json).

Now, you can change the behavior of the `product-details` block that is in the store header. See an example of how to configure:

```json
  "product-details": {
      "blocks": [
        "breadcrumb",
        "product-name",
        "product-images",
        "product-price",
        "product-description",
        "product-specifications",
        "buy-button",
        "sku-selector",
        "shipping-simulator",
        "availability-subscriber",
        "share"
      ],
      "props": {
        "displayVertically": true,
        "share": {
          "social": {
            "Facebook": true,
            "WhatsApp": true,
            "Twitter": false
          }
        },
        "price": {
          "labelSellingPrice": null,
          "showListPrice": true,
          "showLabels": true,
          "showInstallments": true,
          "showSavings": true
        },
        "name": {
          "showBrandName": false,
          "showSku": false,
          "showProductReference": false
        }
      }
    }
```

### Blocks API

When implementing this app as a block, various inner blocks may be available. The following interface lists the available blocks within `product-details` and describes if they are required or optional.

```json
{
  "product-details": {
    "required": [
      "product-images",
      "product-name",
      "product-price",
      "sku-selector",
      "buy-button",
      "product-description",
      "product-specifications"
    ],
    "allowed": [
      "breadcrumb",
      "shipping-simulator",
      "availability-subscriber",
      "share",
      "addon-details-btn"
    ],
    "component": "ProductDetails"
  },
  "addon-details-btn": {
    "component": "*"
  }
}
```

The `ProductDetails` has the required blocks: `product-images`, `product-name`, `product-price`, `sku-selector`, `buy-button`, `product-description` and `product-specifications`. So, any `ProductDetails` block implementation created must add these blocks.

#### Configuration

Through the Storefront you can change the behavior and interface of `ProductDetails`. But, you can also make adjusts in your theme app, like Store does.

| Prop name               | Type      | Description                                                       | Default Value |
| ----------------------- | --------- | ----------------------------------------------------------------- | ------------- |
| `price`                 | `Object`  | Configures the product price area (More info on the table bellow) | false         |
| `name`                  | `Object`  | Configures the product name area (More info on the table bellow)  | false         |
| `displayVertically`     | `Boolean` | Whether to display the preview images on the vertical or not      | false         |
| `showSpecificationsTab` | `Boolean` | Whether to display the product specification on tab mode or not   | false         |

Price:

| Prop name           | Type      | Description                                    |
| ------------------- | --------- | ---------------------------------------------- |
| `showListPrice`     | `Boolean` | Shows the list prices                          | true |
| `showLabels`        | `Boolean` | Shows the labels in the price and installments | true |
| `showInstallments`  | `Boolean` | Shows the installments information             | true |
| `showSavings`       | `Boolean` | Shows the savings information                  | true |
| `labelSellingPrice` | `String`  | Text of the label before the price             | `null` |

Name:

| Prop name              | Type      | Description                          |
| ---------------------- | --------- | ------------------------------------ |
| `showProductReference` | `Boolean` | Shows the product reference          | false |
| `showBrandName`        | `Boolean` | Shows the brand name of the product  | false |
| `showSku`              | `Boolean` | Shows the sku value for this product | false |

Highlight:

| Prop name          | Type      | Description                                                                                |
| ------------------ | --------- | ---------------------------------------------------------------------------------------------------------------------- |
| `defaultHighlight` | `boolean` | Indicates whether the group chosen as the highlight will contain all the properties in product or a group typed entry. |
| true               |
| `showHighlights`   | `Boolean` | Shows the highlights of the product                                                                                | true |
| `highlightGroup`   |

Specification:

 | Prop name             | Type      | Description                                                                                |
| --------------------- | --------- | -------------------------------------------------------------------------------------------------- |
| `showSpecifications`  | `boolean` | Show the specifications of the product                                                             |
| `specificationGroups` | `object`  | Define if will be displayed all the specifications of the product or a set of this specifications. |
| `viewMode`            | `string`  | Define what is the current view mode for the specifications.                                       |
| `typeSpecifications`  | `string`  | indicates which specifications will be displayed                                                   |

Also, you can configure the `share` that is defined on `ProductDetails`. See [here](https://github.com/vtex-apps/store-components/blob/master/react/components/Share/README.md) the `Share` API.

### Styles API

This app provides some CSS classes as an API for style customization.

To use this CSS API, you must add the `styles` builder and create an app styling CSS file.

1. Add the `styles` builder to your `manifest.json`:

```json
  "builders": {
    "styles": "1.x"
  }
```

2. Create a file called `vtex.product-details.css` inside the `styles/css` folder. Add your custom styles:

```css
.container {
  margin-top: 10px;
}
```

#### CSS namespaces

Below, we describe the namespaces that is define in the `ProductDetails`.

| Class name              | Description                              | Component Source                                            |
| ----------------------- | ---------------------------------------- | ----------------------------------------------------------- |
| `container`             | The main container of Product Details    | [productDetails](/react/productDetails.js)                  |
| `nameContainer`         | The container of the name area           | [productDetails](/react/productDetails.js)                  |
| `detailsContainer`      | The container of the details area        | [productDetails](/react/productDetails.js)                  |
| `priceContainer`        | The container of the price area          | [productDetails](/react/productDetails.js)                  |
| `informationsContainer` | The container of the information area    | [productDetails](/react/productDetails.js)                  |
| `fixedButton`           | The product buy button                   | [FixedButton/index](/react/components/FixedButton/index.js) |
| `highlightsContainer`   | The container of product highlights area | [productDetails](/react/productDetails.js)                  |

## Troubleshooting

You can check if others are passing through similar issues [here](https://github.com/vtex-apps/product-details/issues). Also feel free to [open issues](https://github.com/vtex-apps/product-details/issues/new) or contribute with pull requests.

## Contributing

Check it out [how to contribute](https://github.com/vtex-apps/awesome-io#contributing) with this project.

## Tests

To execute our tests go to `react/` folder and run `yarn test`

### Travis CI

[![Build Status](https://travis-ci.org/vtex-apps/product-details.svg?branch=master)](https://travis-ci.org/vtex-apps/product-details)

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of product-details/manifest.json from the product-details VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "product-details",
  "vendor": "vtex",
  "version": "1.22.0",
  "title": "Product Details",
  "description": "Product details component",
  "defaultLocale": "pt-BR",
  "mustUpdateAt": "2019-05-08",
  "registries": [
    "smartcheckout"
  ],
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "builders": {
    "react": "3.x",
    "messages": "1.x",
    "store": "0.x",
    "docs": "0.x"
  },
  "dependencies": {
    "vtex.breadcrumb": "1.x",
    "vtex.store-graphql": "2.x",
    "vtex.store-components": "3.x",
    "vtex.styleguide": "9.x",
    "vtex.product-context": "0.x"
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of starter.store-react-components/README.md from the starter.store-react-components VTEX app.

[Assistant]
Here's the implementation:

```markdown
# TSDX React w/ Storybook User Guide

Congrats! You just saved yourself hours of work by bootstrapping this project with TSDX. Let’s get you oriented with what’s here and how to use it.

> This TSDX setup is meant for developing React component libraries (not apps!) that can be published to NPM. If you’re looking to build a React-based app, you should use `create-react-app`, `razzle`, `nextjs`, `gatsby`, or `react-static`.

> If you’re new to TypeScript and React, checkout [this handy cheatsheet](https://github.com/sw-yx/react-typescript-cheatsheet/)

## Commands

TSDX scaffolds your new library inside `/src`, and also sets up a [Parcel-based](https://parceljs.org) playground for it inside `/example`.

The recommended workflow is to run TSDX in one terminal:

```bash
npm start # or yarn start
```

This builds to `/dist` and runs the project in watch mode so any edits you save inside `src` causes a rebuild to `/dist`.

Then run either Storybook or the example playground:

### Storybook

Run inside another terminal:

```bash
yarn storybook
```

This loads the stories from `./stories`.

> NOTE: Stories should reference the components as if using the library, similar to the example playground. This means importing from the root project directory. This has been aliased in the tsconfig and the storybook webpack config as a helper.

### Example

Then run the example inside another:

```bash
cd example
npm i # or yarn to install dependencies
npm start # or yarn start
```

The default example imports and live reloads whatever is in `/dist`, so if you are seeing an out of date component, make sure TSDX is running in watch mode like we recommend above. **No symlinking required**, we use [Parcel's aliasing](https://parceljs.org/module_resolution.html#aliases).

To do a one-off build, use `npm run build` or `yarn build`.

To run tests, use `npm test` or `yarn test`.

## Configuration

Code quality is set up for you with `prettier`, `husky`, and `lint-staged`. Adjust the respective fields in `package.json` accordingly.

### Jest

Jest tests are set up to run with `npm test` or `yarn test`.

### Bundle analysis

Calculates the real cost of your library using [size-limit](https://github.com/ai/size-limit) with `npm run size` and visulize it with `npm run analyze`.

#### Setup Files

This is the folder structure we set up for you:

```txt
/example
  index.html
  index.tsx       # test your component here in a demo app
  package.json
  tsconfig.json
/src
  index.tsx       # EDIT THIS
/test
  blah.test.tsx   # EDIT THIS
/stories
  Thing.stories.tsx # EDIT THIS
/.storybook
  main.js
  preview.js
.gitignore
package.json
README.md         # EDIT THIS
tsconfig.json
```

#### React Testing Library

We do not set up `react-testing-library` for you yet, we welcome contributions and documentation on this.

### Rollup

TSDX uses [Rollup](https://rollupjs.org) as a bundler and generates multiple rollup configs for various module formats and build settings. See [Optimizations](#optimizations) for details.

### TypeScript

`tsconfig.json` is set up to interpret `dom` and `esnext` types, as well as `react` for `jsx`. Adjust according to your needs.

## Continuous Integration

### GitHub Actions

Two actions are added by default:

- `main` which installs deps w/ cache, lints, tests, and builds on all pushes against a Node and OS matrix
- `size` which comments cost comparison of your library on every pull request using [size-limit](https://github.com/ai/size-limit)

## Optimizations

Please see the main `tsdx` [optimizations docs](https://github.com/palmerhq/tsdx#optimizations). In particular, know that you can take advantage of development-only optimizations:

```js
// ./types/index.d.ts
declare var __DEV__: boolean;

// inside your code...
if (__DEV__) {
  console.log('foo');
}
```

You can also choose to install and use [invariant](https://github.com/palmerhq/tsdx#invariant) and [warning](https://github.com/palmerhq/tsdx#warning) functions.

## Module Formats

CJS, ESModules, and UMD module formats are supported.

The appropriate paths are configured in `package.json` and `dist/index.js` accordingly. Please report if any issues are found.

## Deploying the Example Playground

The Playground is just a simple [Parcel](https://parceljs.org) app, you can deploy it anywhere you would normally deploy that. Here are some guidelines for **manually** deploying with the Netlify CLI (`npm i -g netlify-cli`):

```bash
cd example # if not already in the example folder
npm run build # builds to dist
netlify deploy # deploy the dist folder
```

Alternatively, if you already have a git repo connected, you can set up continuous deployment with Netlify:

```bash
netlify init
# build command: yarn build && cd example && yarn && yarn build
# directory to deploy: example/dist
# pick yes for netlify.toml
```

## Named Exports

Per Palmer Group guidelines, [always use named exports.](https://github.com/palmerhq/typescript#exports) Code split inside your React app instead of your React library.

## Including Styles

There are many ways to ship styles, including with CSS-in-JS. TSDX has no opinion on this, configure how you like.

For vanilla CSS, you can include it at the root directory and add it to the `files` section in your `package.json`, so that it can be imported separately by your users and run through their bundler's loader.

## Publishing to NPM

We recommend using [np](https://github.com/sindresorhus/np).

## Usage with Lerna

When creating a new package with TSDX within a project set up with Lerna, you might encounter a `Cannot resolve dependency` error when trying to run the `example` project. To fix that you will need to make changes to the `package.json` file _inside the `example` directory_.

The problem is that due to the nature of how dependencies are installed in Lerna projects, the aliases in the example project's `package.json` might not point to the right place, as those dependencies might have been installed in the root of your Lerna project.

Change the `alias` to point to where those packages are actually installed. This depends on the directory structure of your Lerna project, so the actual path might be different from the diff below.

```diff
   "alias": {
-    "react": "../node_modules/react",
-    "react-dom": "../node_modules/react-dom"
+    "react": "../../../node_modules/react",
+    "react-dom": "../../../node_modules/react-dom"
   },
```

An alternative to fixing this problem would be to remove aliases altogether and define the dependencies referenced as aliases as dev dependencies instead. [However, that might cause other problems.](https://github.com/palmerhq/tsdx/issues/64)

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of starter.store-react-components/package.json from the starter.store-react-components VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "@vtex/poc-frontend-app",
  "version": "0.4.6",
  "license": "MIT",
  "main": "dist/index.js",
  "typings": "dist/index.d.ts",
  "files": [
    "dist",
    "src"
  ],
  "engines": {
    "node": ">=10"
  },
  "scripts": {
    "start": "tsdx watch",
    "build": "tsdx build",
    "test": "tsdx test --passWithNoTests",
    "lint": "tsdx lint",
    "prepare": "tsdx build",
    "size": "size-limit",
    "analyze": "size-limit --why",
    "storybook": "start-storybook -p 6006",
    "build-storybook": "build-storybook"
  },
  "peerDependencies": {
    "react": ">=16"
  },
  "husky": {
    "hooks": {
      "pre-commit": "tsdx lint"
    }
  },
  "prettier": {
    "printWidth": 80,
    "semi": true,
    "singleQuote": true,
    "trailingComma": "es5"
  },
  "module": "dist/poc-frontend-app.esm.js",
  "size-limit": [
    {
      "path": "dist/poc-frontend-app.cjs.production.min.js",
      "limit": "10 KB"
    },
    {
      "path": "dist/poc-frontend-app.esm.js",
      "limit": "10 KB"
    }
  ],
  "devDependencies": {
    "@babel/core": "^7.14.8",
    "@rollup/plugin-json": "^4.1.0",
    "@size-limit/preset-small-lib": "^5.0.2",
    "@storybook/addon-essentials": "^6.3.6",
    "@storybook/addon-info": "^5.3.21",
    "@storybook/addon-links": "^6.3.6",
    "@storybook/addons": "^6.3.6",
    "@storybook/react": "^6.3.6",
    "@types/react": "^17.0.15",
    "@types/react-dom": "^17.0.9",
    "babel-loader": "^8.2.2",
    "dotenv": "^10.0.0",
    "eslint-plugin-prettier": "^3.4.0",
    "husky": "^7.0.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-is": "^17.0.2",
    "size-limit": "^5.0.2",
    "tsdx": "^0.14.1",
    "tslib": "^2.3.0",
    "typescript": "^4.3.5"
  },
  "dependencies": {
    "@apollo/client": "^3.4.8",
    "graphql": "^15.5.1"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of starter.store-react-components/tsdx.config.js from the starter.store-react-components VTEX app.

[Assistant]
Here's the implementation:

```javascript
const json = require('@rollup/plugin-json');
const dotenv = require('dotenv');
dotenv.config();

module.exports = {
  rollup(config, options) {
    config.plugins.push(json(),);
    return config;
  },
};

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of multisite-segment-results/policies.json from the multisite-segment-results VTEX app.

[Assistant]
Here's the implementation:

```json
[
  {
    "name": "resolve-graphql",
    "description": "Allows access to resolve a graphql request",
    "statements": [
      {
        "actions": ["post", "get"],
        "effect": "allow",
        "resources": [
          "vrn:vtex.search-segment-resolver:{{region}}:{{account}}:{{workspace}}:/_v/graphql"
        ]
      }
    ]
  }
]

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of multisite-segment-results/README.md from the multisite-segment-results VTEX app.

[Assistant]
Here's the implementation:

```markdown
##  ⚠ Maintenance ⚠
*Starting September 1st 2022, this application will no longer be maintained by VTEX. Code is released for free under the GNU/PL Agreement for you to use and modify at your convenience. The VTEX repository shall remain unchanged with the original version.*

---

# Multisite Segment Results

To use the `multisite-segment-results`, you'll need to install the `vtex.search-segment-graphql@0.x` from this  [**github**](https://github.com/vtex-apps/search-segment-graphql) on your store.

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of multisite-segment-results/package.json from the multisite-segment-results VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "multisite-segment-results",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,js,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@types/node": "^12.12.21",
    "@vtex/prettier-config": "^0.1.3",
    "eslint": "^6.8.0",
    "eslint-config-vtex": "^12.2.1",
    "eslint-config-vtex-react": "^6.2.1",
    "husky": "^4.2.0",
    "lint-staged": "^10.0.2",
    "prettier": "^1.19.1",
    "typescript": "^3.7.5"
  },
  "dependencies": {
    "@vtex/api": "^6.45.0",
    "atob": "^2.1.2"
  }
}
```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of multisite-segment-results/manifest.json from the multisite-segment-results VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtexarg",
  "name": "multisite-segment-results",
  "version": "2.0.1",
  "title": "Multisite Segment Results",
  "description": "Multisite Segment Results component",
  "defaultLocale": "pt-BR",
  "builders": {
    "messages": "1.x",
    "store": "0.x",
    "react": "3.x",
    "docs": "0.x",
    "node": "6.x"
  },
  "dependencies": {
    "vtex.native-types": "0.x",
    "vtex.styleguide": "9.x",
    "vtex.css-handles": "0.x",
    "vtex.messages": "1.x",
    "vtex.search-segment-graphql": "0.x",
    "vtex.store-graphql": "2.x",
    "vtex.search-session": "0.x"
  },
  "settingsSchema": {
    "title": "Multisite Segment Results",
    "type": "object",
    "properties": {
      "parameterValue": {
        "title": "Default segmentation productClustersId",
        "description": "You need to configure this ID to indicate the results when the user is not authenticated.",
        "type": "string"
      }
    }
  },
  "billingOptions": {
    "free": true,
    "availableCountries": [
      "*"
    ]
  },
  "policies": [],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of vtex-anaf/README.md from the vtex-anaf VTEX app.

[Assistant]
Here's the implementation:

```markdown
## vtex-anaf

This app and all affiliated services are provided “as is”, without warranty of any kind, either express or implied. Neither the publisher nor its partners, affiliates, employees, or contractors guarantee that this app will meet your requirements, provide uninterrupted use, or operate without delay or without error. Neither the publisher nor its partners, affiliates, employees, or contractors assume any responsibility for any errors and malfunctions within the app and will not provide support or maintenance of any kind.

All provisions and warranties of any kind, express or implied, including but not limited to any guarantees of performance, process integrity, or particular functionalities, are hereby disclaimed and excluded unless otherwise prohibited or restricted by applicable law.

_Developed under EE FPA._
```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of vtex-anaf/package.json from the vtex-anaf VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "stock-update",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "dependencies": {
    "axios": "^0.20.0"
  },
  "devDependencies": {
    "@vtex/prettier-config": "^0.2.0",
    "eslint": "^6.8.0",
    "eslint-config-vtex": "^12.4.0",
    "eslint-config-vtex-react": "^6.4.0",
    "husky": "^4.2.5",
    "lint-staged": "^10.2.2",
    "prettier": "^2.0.5",
    "typescript": "^3.8.3"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of vtex-anaf/manifest.json from the vtex-anaf VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "admin-example",
  "version": "0.0.1",
  "title": "VTEX Anaf",
  "description": "VTEX Anaf",
  "dependencies": {
    "vtex.store-graphql": "2.x",
    "vtex.styleguide": "9.x",
    "vtex.format-currency": "0.x",
    "vtex.store": "2.x",
    "vtex.my-account": "1.x",
    "vtex.my-account-commons": "1.x",
    "vtex.render-runtime": "8.x",
    "vtex.store-resources": "0.x",
    "vtex.store-session": "0.x",
    "vtex.store-components": "3.x",
    "vtex.react-portal": "0.x",
    "vtex.store-icons": "0.x",
    "vtex.device-detector": "0.x",
    "vtex.css-handles": "0.x"
  },
  "builders": {
    "docs": "0.x",
    "node": "6.x"
  },
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "credentialType": "absolute",
  "policies": [
    {
      "name": "outbound-access",
      "attrs": {
        "host": "webservicesp.anaf.ro",
        "path": "*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "www.listafirme.ro",
        "path": "*"
      }
    }
  ],
  "billingOptions": {
    "termsURL": "https://compliance.vtex.com/gdpr/policies/vtex-privacy-policy",
    "support": {
      "url": "https://support.vtex.com/hc/requests"
    },
    "free": true
  },
  "settingsSchema": {
    "title": "VTEX ANAF",
    "type": "object",
    "properties": {
      "listaFirme": {
        "title": "Key listafirme.ro",
        "type": "string",
        "description": "Your key for listafirme.ro"
      },
      "allowEdit": {
        "title": "Allows the user to edit company data in checkout.",
        "type": "boolean",
        "default": false
      },
      "allowContinue": {
        "title": "Allows the user to complete the order if the company's CUI is invalid",
        "type": "boolean",
        "default": false
      }
    }
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of phone-field/package.json from the phone-field VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "phone-field",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,js,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.json": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@vtex/prettier-config": "^0.1.3",
    "eslint": "^6.8.0",
    "eslint-config-vtex": "^12.2.1",
    "eslint-config-vtex-react": "^6.2.1",
    "husky": "^4.2.0",
    "lint-staged": "^10.0.2",
    "prettier": "^1.19.1",
    "typescript": "^3.7.5"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of phone-field/manifest.json from the phone-field VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "phone-field",
  "version": "0.1.5",
  "title": "Phone field component",
  "description": "UI component responsible for rendering a phone field with a dropdown",
  "builders": {
    "docs": "0.x",
    "react": "3.x"
  },
  "dependencies": {
    "vtex.checkout-components": "0.x",
    "vtex.country-flags": "0.x",
    "vtex.styleguide": "9.x"
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of easy-setup/package.json from the easy-setup VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "beightoneagency.easy-setup",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\"",
    "prepare": "yarn --cwd react"
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@types/node": "^12.12.21",
    "@typescript-eslint/eslint-plugin": "^4.15.0",
    "@vtex/prettier-config": "^0.1.3",
    "eslint": "^7.19.0",
    "eslint-config-vtex": "^12.9.4",
    "eslint-config-vtex-react": "^6.9.4",
    "husky": "^4.2.0",
    "lint-staged": "^10.0.2",
    "prettier": "^2.2.1",
    "tslint-config-prettier": "^1.18.0",
    "typescript": "^4.1.5"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of easy-setup/manifest.json from the easy-setup VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "easy-setup",
  "vendor": "vtex",
  "version": "0.0.10",
  "title": "Easy Setup",
  "description": "Populate the store with a basic setup to B2C and B2B schemas.",
  "mustUpdateAt": "",
  "categories": [],
  "dependencies": {
    "vtex.styleguide": "9.x"
  },
  "scripts": {
    "prereleasy": "bash lint.sh"
  },
  "registries": [
    "smartcheckout"
  ],
  "billingOptions": {
    "free": true
  },
  "builders": {
    "react": "3.x",
    "admin": "0.x",
    "messages": "1.x",
    "node": "6.x",
    "docs": "0.x"
  },
  "credentialType": "absolute",
  "policies": [
    {
      "name": "colossus-fire-event"
    },
    {
      "name": "colossus-write-logs"
    },
    {
      "name": "ADMIN_CRM"
    },
    {
      "name": "POWER_USER_CRM"
    },
    {
      "name": "ADMIN_DS"
    },
    {
      "name": "POWER_USER_DS"
    },
    {
      "name": "OMSViewer"
    },
    {
      "name": "WorkflowAction"
    },
    {
      "name": "Changes"
    },
    {
      "name": "ShippingAction"
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "{{account}}.vtexcommercestable.com.br",
        "path": "/api/catalog/pvt/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "api.vtex.com",
        "path": "/{{account}}/pricing/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "{{account}}.vtexcommercestable.com.br",
        "path": "/api/logistics/pvt/inventory/skus/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "{{account}}.vtexpayments.com.br",
        "path": "/api/pvt/affiliations"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "{{account}}.vtexpayments.com.br",
        "path": "/api/pvt/rules"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "api.vtex.com",
        "path": "/{{account}}/dataentities/*"
      }
    }
  ],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of policies-example-2/policies.json from the policies-example-2 VTEX app.

[Assistant]
Here's the implementation:

```json
[
  {
    "name": "constructor-policie",
    "statements": [
      {
        "actions": ["get"],
        "effect": "allow",
        "resources": [
          "vrn:vtex.policies-example-2:{{region}}:{{account}}:{{workspace}}:/_v/test-policies-route"
        ]
      }
    ]
  }
]

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of policies-example-2/dangerfile.js from the policies-example-2 VTEX app.

[Assistant]
Here's the implementation:

```javascript
// dangerfile.js
const { verify } = require('@vtex/danger')

const config = {
  // Set to true to enforce keepachangelog rules.
  keepachangelog: {
    changeVersion: false,
  },
  rules: {
    description: ['fail', { minLength: 20 }],
    assignee: 'fail',
    reviewers: 'fail',
    pr_size: ['warn', { additionLimit: 800, deletionLimit: -1 }],
    lock_file: 'warn',
    no_ignored_test: ['fail', { pattern: /test|spec/i }],
    no_debugger: ['fail', { pattern: /\.[tj]sx?$/i }],
    enforce_graphql_provider: 'off',
  },
}

verify(config)

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of policies-example-2/package.json from the policies-example-2 VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "policies-example-2",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@types/node": "^12.12.21",
    "@vtex/danger": "^0.2.7",
    "@vtex/prettier-config": "^0.3.6",
    "eslint": "^7.16.0",
    "eslint-config-vtex": "^12.9.3",
    "husky": "^4.3.6",
    "lint-staged": "^10.5.3",
    "prettier": "^2.2.1",
    "typescript": "^3.7.5"
  },
  "dependencies": {
    "dom-parser": "^0.1.6"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of policies-example-2/manifest.json from the policies-example-2 VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "policies-example-2",
  "vendor": "vtex",
  "version": "0.7.5",
  "title": "Service Example",
  "description": "Reference app for VTEX IO Services",
  "mustUpdateAt": "2018-01-04",
  "categories": [],
  "dependencies": {},
  "builders": {
    "node": "6.x",
    "docs": "0.x"
  },
  "scripts": {
    "prereleasy": "bash lint.sh"
  },
  "credentialType": "absolute",
  "policies": [
    {
      "name": "outbound-access",
      "attrs": {
        "host": "httpstat.us",
        "path": "*"
      }
    },
    {
      "name": "colossus-fire-event"
    },
    {
      "name": "colossus-write-logs"
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "ergast.com",
        "path": "/api/f1/2020/*"
      }
    }
  ],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of admin-ley-gondolas-arg/package.json from the admin-ley-gondolas-arg VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "admin-example",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@vtex/prettier-config": "^0.2.0",
    "eslint": "^6.8.0",
    "eslint-config-vtex": "^12.4.0",
    "eslint-config-vtex-react": "^6.4.0",
    "husky": "^4.2.5",
    "lint-staged": "^10.2.2",
    "prettier": "^2.0.5",
    "typescript": "^3.8.3",
    "vtex.render-runtime": "http://vtex.vtexassets.com/_v/public/typings/v1/vtex.render-runtime@8.131.0/public/@types/vtex.render-runtime"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of admin-ley-gondolas-arg/manifest.json from the admin-ley-gondolas-arg VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "admin-ley-gondolas-arg",
  "vendor": "vtexarg",
  "version": "0.2.1",
  "title": "Admin Ley de Gondolas",
  "description": "",
  "mustUpdateAt": "2022-08-28",
  "scripts": {
    "postreleasy": "vtex publish"
  },
  "dependencies": {
    "vtex.styleguide": "9.x",
    "vtex.catalog-graphql": "1.x"
  },
  "builders": {
    "react": "3.x",
    "admin": "0.x",
    "messages": "1.x",
    "docs": "0.x",
    "node": "6.x",
    "graphql": "1.x"
  },
  "billingOptions": {
    "support": {
      "url": "https://support.vtex.com/hc/requests"
    },
    "type": "free",
    "availableCountries": ["*"]
  },
  "policies": [
    {
      "name": "outbound-access",
      "attrs": {
        "host": "{{account}}.myvtex.com",
        "path": "/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "portal.vtexcommercestable.com.br",
        "path": "/api/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "portal.vtexcommercebeta.com.br",
        "path": "/api/*"
      }
    },
    {
      "name": "outbound-access",
      "attrs": {
        "host": "{{account}}.vtexcommercestable.com.br",
        "path": "/api/*"
      }
    },
    {
      "name": "Get_Account_By_Identifier"
    },
    {
      "name": "ADMIN_DS"
    },
    {
      "name": "POWER_USER_DS"
    },
    {
      "name": "AdminPortal"
    },
    {
      "name": "colossus-fire-event"
    },
    {
      "name": "colossus-write-logs"
    }
  ],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of blocks-inspector/manifest.json from the blocks-inspector VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "base-store-component",
  "version": "0.2.1",
  "title": "IO Base Component",
  "description": "IO Base component",
  "defaultLocale": "pt-BR",
  "builders": {
    "messages": "1.x",
    "store": "0.x",
    "react": "3.x",
    "docs": "0.x"
  },
  "mustUpdateAt": "2019-04-02",
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "dependencies": {
    "vtex.styleguide": "9.x"
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of outbrain/manifest.json from the outbrain VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "outbrain",
  "vendor": "vtex",
  "version": "0.1.0",
  "title": "outbrain",
  "description": "outbrain",
  "billingOptions": {
    "termsURL": "",
    "support": {
      "url": "https://support.vtex.com/hc/requests"
    },
    "free": true
  },
  "builders": {
    "react": "3.x",
    "store": "0.x",
    "pixel": "0.x",
    "docs": "0.x"
  },
  "dependencies": {
    "vtex.pixel-interfaces": "1.x"
  },
  "settingsSchema": {
    "title": "Outbrain Options",
    "type": "object",
    "properties": {
      "OB_ADV_ID": {
        "title": "Outbrain Id",
        "description": "Enter your Outbrain Id",
        "type": "string"
      }
    }
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of calling-commerce-apis-example/package.json from the calling-commerce-apis-example VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "service-example",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@types/node": "^12.12.21",
    "@vtex/prettier-config": "^0.3.6",
    "eslint": "^7.16.0",
    "eslint-config-vtex": "^12.9.3",
    "husky": "^4.3.6",
    "lint-staged": "^10.5.3",
    "prettier": "^2.2.1",
    "typescript": "^3.7.5"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of calling-commerce-apis-example/manifest.json from the calling-commerce-apis-example VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "service-example-commerce-apis",
  "vendor": "vtex",
  "version": "0.2.0",
  "title": "Service Example - Commerce Apis",
  "description": "Reference app for VTEX IO Services using VTEX Core Commerce APIs",
  "mustUpdateAt": "2018-01-04",
  "categories": [],
  "dependencies": {},
  "builders": {
    "node": "6.x",
    "docs": "0.x"
  },
  "scripts": {
    "prereleasy": "bash lint.sh"
  },
  "credentialType": "absolute",
  "policies": [
    {
      "name": "outbound-access",
      "attrs": {
        "host": "portal.vtexcommercestable.com.br",
        "path": "api/catalog"
      }
    },
    {
      "name": "colossus-fire-event"
    },
    {
      "name": "colossus-write-logs"
    }
  ],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of KI-367339/README.md from the KI-367339 VTEX app.

[Assistant]
Here's the implementation:

```markdown
# [KI-367339] When arriving at the checkout with more than 23 items, some items in the display of the purchase summary in the interface end up being duplicated

This script solves the KI https://vtexhelp.zendesk.com/agent/tickets/367339.

You need to add the script to the checkout at the `checkout6-custom.js`.

## Contributors ✨

Thanks goes to these wonderful people:

<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore-start -->
<!-- markdownlint-disable -->
<table>
  <tr>
    <td align="center"><a href="https://github.com/germanBonacchi"><img src="https://avatars.githubusercontent.com/u/55905671?v=4" width="100px;" alt=""/><br /><sub><b>Germán Bonacchi</b></sub></a><br /><a href="https://github.com/vtex-apps/vtex-logger-react/commits?author=germanBonacchi" title="Code">💻</a></td>
</tr>
</table>

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of KI-367339/KI-367339.js from the KI-367339 VTEX app.

[Assistant]
Here's the implementation:

```javascript
function observeChangesOnCartItems(oldItems) {
  const cartItems = document.querySelector("ul.cart-items");

  const observer = new MutationObserver((mutationsList, observer) => {
    const items = cartItems.querySelectorAll("li");
    if (oldItems != items.length) {
      //Descomentar para verificar la diferencia de items
      /*
      const startItems = []
      items.forEach((item) => startItems.push(item.getAttribute("data-sku")+ '-' + item.querySelector("[data-bind='text: sellingPriceLabel']").textContent.split(" ")[1]));
      console.log('startItems', startItems);
      */
      const uniqueItems = [];
      items.forEach((item) => {
        const itemId = item.getAttribute("data-sku");
        //El sellingPrice es diferente entre los productos que comparten id pero uno tiene aplicado una promocion y otro no
        const sellingPrice = item.querySelector("[data-bind='text: sellingPriceLabel']").textContent.split(" ")[1]
        if (!uniqueItems.includes(`${itemId}-${sellingPrice}`)) {
          uniqueItems.push(`${itemId}-${sellingPrice}`);
        } else {
          item.remove();
        }
      });
      oldItems = uniqueItems.length;
      //Descomentar para verificar la diferencia de items
      //console.log("uniqueItems", uniqueItems);
    }
  });

  observer.observe(cartItems, {
    attributes: true,
    childList: true,
    subtree: true,
  });
}

$(document).ready(function () {
  let oldItems = -1
  const cartItems = document.querySelector("ul.cart-items");

  const observerCartItems = new MutationObserver((mutations, obsCI) => {
    if (document.contains(cartItems)) {
      observeChangesOnCartItems(oldItems);
      window.addEventListener("hashchange", () => {
        observeChangesOnCartItems(oldItems);
      });
      obsCI.disconnect();
      return;
    }
  });

  observerCartItems.observe(document, {
    childList: true,
    subtree: true,
  });
});

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of graphql-example/graphql-markdown-generator.js from the graphql-example VTEX app.

[Assistant]
Here's the implementation:

```javascript
const { execSync } = require('child_process')
const fs = require('fs')

const argv = require('minimist')(process.argv.slice(2))
const { nativeSchemaDirectivesTypeDefs } = require('@vtex/api')
const graphql = require('graphql')
const { loadFilesSync } = require('@graphql-tools/load-files')
const { makeExecutableSchema } = require('@graphql-tools/schema')
const { mergeTypeDefs } = require('@graphql-tools/merge')
const { stitchingDirectives } = require('@graphql-tools/stitching-directives')

const { allStitchingDirectivesTypeDefs } = stitchingDirectives()

const DEFAULT_GRAPHQL_PATH = './graphql/**/*.{gql,graphql}'
const DEFAULT_MERGED_PATH = './merged.graphql'
const DEFAULT_MARKDOWN_PATH = './schema.md'

const GRAPHQL_ARG = argv['graphql-path']
const MERGED_ARG = argv['merged-path']
const MARKDOWN_ARG = argv['markdown-path']

const GRAPHQL_PATH = GRAPHQL_ARG || DEFAULT_GRAPHQL_PATH
const MERGED_PATH = MERGED_ARG || DEFAULT_MERGED_PATH
const MARKDOWN_PATH = MARKDOWN_ARG || DEFAULT_MARKDOWN_PATH

const loadedFiles = loadFilesSync(GRAPHQL_PATH)

const typeDefs = mergeTypeDefs(loadedFiles)

const schema = makeExecutableSchema({
  typeDefs: [
    allStitchingDirectivesTypeDefs,
    typeDefs,
    nativeSchemaDirectivesTypeDefs,
  ],
})

const printedSchema = graphql.printSchema(schema)

fs.writeFileSync(MERGED_PATH, printedSchema)

execSync(
  `graphql-markdown ${MERGED_PATH} > ${MARKDOWN_PATH} && rm ${MERGED_PATH}`
)

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of graphql-example/dangerfile.js from the graphql-example VTEX app.

[Assistant]
Here's the implementation:

```javascript
// dangerfile.js
const { verify } = require('@vtex/danger')

const config = {
  // Set to true to enforce keepachangelog rules.
  keepachangelog: {
    changeVersion: false,
  },
  rules: {
    description: ['fail', { minLength: 20 }],
    assignee: 'fail',
    reviewers: 'fail',
    pr_size: ['warn', { additionLimit: 800, deletionLimit: -1 }],
    lock_file: 'warn',
    no_ignored_test: ['fail', { pattern: /test|spec/i }],
    no_debugger: ['fail', { pattern: /\.[tj]sx?$/i }],
    enforce_graphql_provider: 'off',
  },
}

verify(config)

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of graphql-example/package.json from the graphql-example VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "CHANGE_ME",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\"",
    "graphql-markdown": "node graphql-markdown-generator.js"
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@graphql-tools/load-files": "^6.5.3",
    "@graphql-tools/merge": "^8.2.13",
    "@graphql-tools/schema": "^8.3.13",
    "@graphql-tools/stitching-directives": "^2.2.17",
    "@types/node": "^12.12.21",
    "@vtex/api": "^6.45.12",
    "@vtex/danger": "^0.2.7",
    "@vtex/prettier-config": "^0.3.1",
    "eslint": "^6.8.0",
    "eslint-config-vtex": "^12.7.0",
    "graphql": "^15.0.0",
    "graphql-markdown": "^6.0.0",
    "husky": "^4.2.0",
    "lint-staged": "^10.0.2",
    "prettier": "^2.0.5",
    "typescript": "^3.9.6"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of graphql-example/manifest.json from the graphql-example VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "graphql-example",
  "vendor": "vtex",
  "version": "0.4.0",
  "title": "GraphQL Example",
  "description": "Reference app for VTEX IO GraphQL Services",
  "mustUpdateAt": "2022-01-04",
  "categories": [],
  "dependencies": {},
  "builders": {
    "docs": "0.x",
    "graphql": "2.x",
    "node": "7.x"
  },
  "scripts": {
    "prereleasy": "bash lint.sh"
  },
  "credentialType": "absolute",
  "policies": [
    {
      "name": "colossus-fire-event"
    },
    {
      "name": "colossus-write-logs"
    },
    {
      "name": "graphql-query"
    }
  ],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of organizations-challenge/package.json from the organizations-challenge VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "organizations-challenge",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\"",
    "lint:locales": "intl-equalizer",
    "test": "cd ./react && yarn test",
    "locales:fix": "intl-equalizer --fix",
    "verify": "yarn lint && yarn lint:locales && yarn test",
    "postinstall": "husky install"
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@vtex/intl-equalizer": "^2.3.0",
    "@vtex/prettier-config": "^0.1.4",
    "eslint": "^7.12.1",
    "eslint-config-vtex": "^12.3.2",
    "eslint-config-vtex-react": "^6.3.2",
    "husky": "^5.0.9",
    "lint-staged": "^10.1.1",
    "prettier": "^2.0.2",
    "typescript": "^3.8.3"
  },
  "version": "0.0.2",
  "intl-equalizer": {
    "referenceLocale": "en",
    "localeDirectory": "messages"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of organizations-challenge/manifest.json from the organizations-challenge VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "organizations-challenge",
  "version": "1.2.2",
  "title": "VTEX Organizations Challenge",
  "description": "",
  "builders": {
    "react": "3.x",
    "messages": "1.x",
    "docs": "0.x",
    "store": "0.x"
  },
  "dependencies": {
    "vtex.store": "2.x",
    "vtex.store-graphql": "2.x",
    "vtex.css-handles": "1.x"
  },
  "registries": [
    "smartcheckout"
  ],
  "policies": [],
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of rich-text/package.json from the rich-text VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "rich-text",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{json,graphql,gql}": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@vtex/prettier-config": "^0.3.6",
    "eslint": "^7.15.0",
    "eslint-config-vtex": "^12.9.2",
    "eslint-config-vtex-react": "^6.9.2",
    "husky": "^4.3.5",
    "lint-staged": "^10.5.3",
    "prettier": "^2.2.1",
    "typescript": "^3.7.5"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of rich-text/manifest.json from the rich-text VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "rich-text",
  "version": "0.16.1",
  "title": "Rich Text",
  "description": "Rich text component",
  "defaultLocale": "pt-BR",
  "builders": {
    "messages": "1.x",
    "store": "0.x",
    "react": "3.x",
    "docs": "0.x"
  },
  "mustUpdateAt": "2019-04-02",
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "dependencies": {
    "vtex.native-types": "0.x",
    "vtex.css-handles": "1.x",
    "vtex.responsive-values": "0.x"
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of storetheme-black-beauty/manifest.json from the storetheme-black-beauty VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "beautytheme",
  "name": "afrodeities",
  "version": "0.1.1-beta.0",
  "builders": {
    "styles": "1.x",
    "store": "0.x",
    "sitemap": "0.x",
    "docs": "0.x"
  },
  "mustUpdateAt": "2020-10-31",
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "dependencies": {
    "vtex.store": "2.x",
    "vtex.store-header": "2.x",
    "vtex.product-summary": "2.x",
    "vtex.store-footer": "2.x",
    "vtex.store-components": "3.x",
    "vtex.styleguide": "9.x",
    "vtex.slider": "0.x",
    "vtex.carousel": "2.x",
    "vtex.shelf": "1.x",
    "vtex.menu": "2.x",
    "vtex.minicart": "2.x",
    "vtex.product-details": "1.x",
    "vtex.product-kit": "1.x",
    "vtex.search-result": "3.x",
    "vtex.login": "2.x",
    "vtex.my-account": "1.x",
    "vtex.flex-layout": "0.x",
    "vtex.rich-text": "0.x",
    "vtex.store-drawer": "0.x",
    "vtex.locale-switcher": "0.x",
    "vtex.product-quantity": "1.x",
    "vtex.product-identifier": "0.x",
    "vtex.breadcrumb": "1.x",
    "vtex.sticky-layout": "0.x",
    "vtex.product-customizer": "2.x",
    "vtex.stack-layout": "0.x",
    "vtex.product-specification-badges": "0.x",
    "vtex.responsive-layout": "0.x"
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema",
  "title": "Afrodeities",
  "description": "VTEX IO Store Theme",
  "registries": [
    "smartcheckout"
  ]
}
```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of condition-layout/package.json from the condition-layout VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "name": "condition-layout",
  "private": true,
  "license": "UNLICENSED",
  "scripts": {
    "lint": "eslint --ext js,jsx,ts,tsx .",
    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{ts,js,tsx,jsx}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.json": [
      "prettier --write"
    ]
  },
  "devDependencies": {
    "@vtex/prettier-config": "^0.3.1",
    "eslint": "^7.9.0",
    "eslint-config-vtex": "^12.8.6",
    "eslint-config-vtex-react": "^6.7.8",
    "husky": "^4.3.0",
    "lint-staged": "^10.4.0",
    "prettier": "^2.1.2",
    "typescript": "^4.0.3"
  }
}

```


[System] You are an expert VTEX IO developer. You specialize in building VTEX Store Framework apps, React components, GraphQL APIs, and Node.js services for e-commerce platforms.

[User] Show me the implementation of condition-layout/manifest.json from the condition-layout VTEX app.

[Assistant]
Here's the implementation:

```json
{
  "vendor": "vtex",
  "name": "condition-layout",
  "version": "2.8.2",
  "title": "IO Base Component",
  "description": "IO Base component",
  "defaultLocale": "pt-BR",
  "builders": {
    "docs": "0.x",
    "messages": "1.x",
    "react": "3.x",
    "store": "0.x"
  },
  "mustUpdateAt": "2019-04-02",
  "scripts": {
    "postreleasy": "vtex publish --verbose"
  },
  "dependencies": {
    "vtex.styleguide": "9.x",
    "vtex.product-context": "0.x",
    "vtex.session-client": "1.x"
  },
  "$schema": "https://raw.githubusercontent.com/vtex/node-vtex-api/master/gen/manifest.schema"
}

```