0.0.6 • Published 2 years ago
@ds-pack/components-experimental v0.0.6
@ds-pack/components-experimental
A bare-bones component library built using:
Setup:
This library publishes the direct source and doesn't manage building locally - instead the consuming application should manage building the library!
Install:
# @TODO - replace when renaming the package
# Install the package and it's peerDependencies
yarn add @ds-pack/components-experimental @ds-pack/use-refs @vanilla-extract/css @vanilla-extract/dynamic rainbow-sprinkles nanopop
# Install it's dependencies
yarn add -D polished
Usage with Next.js:
// next-transpile-modules
import createTM from 'next-transpile-modules'
// withVanillaExtract
import { createVanillaExtractPlugin } from '@vanilla-extract/next-plugin'
// @TODO - replace when renaming the package
let withTM = createTM(['@ds-pack/components-experimental'])
let withVanillaExtract = createVanillaExtractPlugin()
export default withVanillaExtract({
/* ... */
})
Usage with other frameworks (create-react-app, vanilla webpack applications, etc):
// Import the styles:
// @TODO - replace when renaming the package
import '@ds-pack/components-experimental/compiled.css'
import { Button } from '@ds-pack/components-experimental/compiled'
Tools:
- Typescript
- Jest
Cutting a Release:
- Update the version in package.json
- Push to main (with associated changes)
- Create release on the repo
- Workflow will kick off and build + publish the new version
Docs:
Components
- Box
- Banner
- Stack
- Text
- Label
- List
- InlineCode
- VisuallyHidden
- Link
- Tapable
- Button
- ToggleInput
- Checkbox
- Heading
- Blockquote
- TwitterMention
- GitHubMention
- Image
- Figure
- Input
- Textarea
- Chip
Hooks
System Props:
is
- essentiallyforwardedAs
from styled-components, but easier to type 😄testIds
- An optional prop that allows for passing indata-testid
to the rendered components