Product
Socket Now Supports uv.lock Files
Socket now supports uv.lock files to ensure consistent, secure dependency resolution for Python projects and enhance supply chain security.
@vtex/styleguide
Advanced tools
> VTEX Styleguide React components ([Docs](https://vtex.github.io/styleguide))
VTEX Styleguide React components (Docs)
For instructions on how to use the Styleguide in your project refer to the page itself: https://vtex.github.io/styleguide/.
yarn install
yarn styleguide
npm link
Run this in this repo:
yarn develop
In your project run:
npm link @vtex/styleguide
Import (case a <Button>
component in lib):
import Button from '@vtex/styleguide/lib/Button'
To add tests to a component, just add a test file with the .test.js
extension next to the component implementation.
Example:
react/components/Alert/
├── README.md
├── index.js
└── index.test.js
We use react-testing-library to test our components.
To run the test use:
yarn test
You can also pass the --watch
flag:
yarn test --watch
To post the changelog on Github Release Notes, is required to configure a Personal Token. See more here
We use releasy to publish our styleguide. To publish on both npm and render(VTEX IO) with Github Release Notes, execute the command below:
releasy --stable
To update the docs:
yarn deploy
Your project has to run with webpack >= 2. Here's a guide for upgrading Webpack to v2.
VTEX Styleguide
is a project built to run on top of either npm
or VTEX IO
. To
make this viable, we currently use two package.json
files, one in the top repository
folder for npm
, and one inside the react
folder for VTEX IO
. We are
looking into how we can improve this architecture, but for now we have to live
with duplicated dependencies in these package.json
files.
For more info, please refer to https://github.com/vtex/styleguide/issues/483
We currently have two majors of the Styleguide, 8.x
and 9.x
(master branch).
Each major supports a specific VTEX's Render version.
This means that we develop new features only on the master
branch (9.x major) and do bug fixes on both master
and 8.x
branches.
The icon
components supports customization through the <use>
element available in SVG. Read more
How to use: In the same page that has a icon, load in any place inside the <html>
a SVG with the following structure:
<svg class="dn" height="0" version="1.1" width="0" xmlns="http://www.w3.org/2000/svg">
<defs>
<g id="icon-columns">
<path d="M10.8 4.4L9.4 3L5.4 7L3.4 5L2 6.4L5.4 9.8L10.8 4.4Z" fill="currentColor" />
</g>
<g id="OTHER-ICON-ID">
<path d="M11.7 0.3C11.5 0.1 11.3 0 11 0H10V3C10 3.6 9.6 4 9 4H4C3.4 4 3 3.6 3 3V0H1C0.4 0 0 0.4 0 1V15C0 15.6 0.4 16 1 16H15C15.6 16 16 15.6 16 15V5C16 4.7 15.9 4.5 15.7 4.3L11.7 0.3ZM13 14H3V11C3 10.4 3.4 10 4 10H12C12.6 10 13 10.4 13 11V14Z" fill="currentColor"/>
<path d="M9 0H7V3H9V0Z" fill="currentColor"/>
</g>
</defs>
</svg>
<g id="">
, one for each icon you want to update.[9.124.2] - 2020-07-09
FAQs
> VTEX Styleguide React components ([Docs](https://vtex.github.io/styleguide))
The npm package @vtex/styleguide receives a total of 2,390 weekly downloads. As such, @vtex/styleguide popularity was classified as popular.
We found that @vtex/styleguide demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Socket now supports uv.lock files to ensure consistent, secure dependency resolution for Python projects and enhance supply chain security.
Research
Security News
Socket researchers have discovered multiple malicious npm packages targeting Solana private keys, abusing Gmail to exfiltrate the data and drain Solana wallets.
Security News
PEP 770 proposes adding SBOM support to Python packages to improve transparency and catch hidden non-Python dependencies that security tools often miss.