Security News
npm Updates Search Experience with New Objective Sorting Options
npm has a revamped search experience with new, more transparent sorting optionsβRelevance, Downloads, Dependents, and Publish Date.
td-stylekit
Advanced tools
A common set of components and styles to be used across frontend products as well as documentation based on these components.
A common set of components and styles to be used across frontend products as well as documentation based on these components.
yarn add td-stylekit react react-dom moment react-syntax-highlighter react-virtualized
Note: If using create-react-app
no need to install react
and react-dom
Find us on npm.
import { Text, ThemeProvider } from 'td-stylekit'
return () => (
<ThemeProvider customTheme={ThemeProvider.v5Theme}>
<Text>text</Text>
</ThemeProvider>
)
script | description |
---|---|
build | generate a production build of module |
test | run unit tests |
tdd | run tests in watch mode |
start | start dev documentation server |
docs:build | generate static build of docs |
download:snapshots | copy changed snapshots from CircleCI |
publish:yalc | publishes stylekit to yalc |
As of May 2022, stories must be specified in the following format:
import type { Meta, Story } from '@storybook/react'
export default {
title: 'v5/Control', // <-- Change as necessary
.... // and other properties
} as Meta
This ensures that all *.stories.tsx
are parsed correctly and available for visual regression tests.
To test td-stylekit locally in other projects perform the following steps:
In the root folder of the project issue the following:
yarn publish:yalc
If you make subsequent changes - repeat the command above.
In the root folder of the project issue the following:
yalc link td-stylekit --no-pure
yarn
To cleanup:
yalc remove td-stylekit
If you consistently notice errors when issuing yarn
- you may need to clean everything and start again by issuing the following:
rm -rf node_modules
yarn
Fully automated! We follow the conventional commit format and deploy on every meaningful commit to main.
Detailed documentation on the release process and how to format commit messages can be found here.
Visual regression tests take snapshots of each Storybook story and compare them to existing snapshots to identify any visual differences introduced by code changes.
If a visual regression test fails, that means you've made visual changes to a component. If this is unintentional, it'll alert you to your mistake. If this is intentional, you'll need to update the snapshots to make the test pass.
$CIRCLECI_TOKEN
environment variable in your local environment
Push your changes, allow CircleCI to finish executing the Visual Regression step, then run:
yarn download:snapshots # Use the --help flag for more options
This will script will download any altered snapshots that have been saved in CircleCI's Artifacts to your local snapshot directory.
From there, you can simply commit the new snapshots.
Screenshot are automatically generated for all stories. However, if you need to disable tests due to hard-to-screenshot stories, like animations, you have a couple options:
// @disable-regression-test
// @disable-regression-test-file
See: https://docs.treasuredata.com/display/public/PD/Browser+Support+for+TD+Console
Contributions are always welcome! Read our contribution guidelines.
Dependabot is a tool which checks your Github repository for security issues.
You can see a list of security issues under Dependabot Alerts on Github, under the Security tab (or click here).
If Dependabot is able to bump a package's version to fix the security issue, it will create a pull request.
Otherwise, you can try to fix the issue manually.
Some dependencies used by Stylekit have vulnerabilities. As often as possible, these security issues should be mitigated by updating their package versions.
yarn audit
to identify dependencies with vulnerabilities
yarn audit --level [low|moderate|high|critical]
to filter by severityyarn why
to find out which package requires that dependencyyarn upgrade [package name]
to upgrade that package
FAQs
A common set of components and styles to be used across frontend products as well as documentation based on these components.
The npm package td-stylekit receives a total of 996 weekly downloads. As such, td-stylekit popularity was classified as not popular.
We found that td-stylekit 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.
Security News
npm has a revamped search experience with new, more transparent sorting optionsβRelevance, Downloads, Dependents, and Publish Date.
Security News
A supply chain attack has been detected in versions 1.95.6 and 1.95.7 of the popular @solana/web3.js library.
Research
Security News
A malicious npm package targets Solana developers, rerouting funds in 2% of transactions to a hardcoded address.