@wemnyelezxnpm/voluptatibus-animi-error
Version:

113 lines (95 loc) • 11.1 kB
Markdown

# UIKit
[](https://github.com/wemnyelezxnpm/voluptatibus-animi-error/actions/workflows/node.js.yml)
[](https://github.com/wemnyelezxnpm/voluptatibus-animi-error/search?l=typescript)
[](https://github.com/wemnyelezxnpm/voluptatibus-animi-error/pulse)
_UI toolkit monorepo containing a React component library, UI utilities, a
generative AI LLM parser, an [AWS AppSync](https://aws.amazon.com/appsync/)
fetch utility, and more_
## Packages
| NPM Package Name | Version | Description |
| ---------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------- |
| **[@acusti/appsync-fetch][]** | [](https://www.npmjs.com/package/@acusti/appsync-fetch) | A promise-based node.js function for making AWS AppSync API graphql requests |
| **[@acusti/aws-signature-v4][]** | [](https://www.npmjs.com/package/@acusti/aws-signature-v4) | An isomorphic module implementing the [AWS Signature V4 (SigV4) signing process][aws sigv4] for requests |
| **[@acusti/css-values][]** | [](https://www.npmjs.com/package/@acusti/css-values) | Utilities for parsing different types of CSS values |
| **[@acusti/css-value-input][]** | [](https://www.npmjs.com/package/@acusti/css-value-input) | React component that renders a CSS value input |
| **[@acusti/date-picker][]** | [](https://www.npmjs.com/package/@acusti/date-picker) | React component that renders a date picker with range support |
| **[@acusti/dropdown][]** | [](https://www.npmjs.com/package/@acusti/dropdown) | React component that renders a dropdown UI element |
| **[@acusti/input-text][]** | [](https://www.npmjs.com/package/@acusti/input-text) | React component that renders an uncontrolled text input |
| **[@acusti/matchmaking][]** | [](https://www.npmjs.com/package/@acusti/matchmaking) | Utilities for approximate string matching (i.e. fuzzy search) |
| **[@acusti/parsing][]** | [](https://www.npmjs.com/package/@acusti/parsing) | Loosely parse a string as JSON with numerous affordances for syntax errors |
| **[@acusti/post][]** | [](https://www.npmjs.com/package/@acusti/post) | A promise-based node.js function for making graphql requests |
| **[@wemnyelezxnpm/voluptatibus-animi-error][]** | [](https://www.npmjs.com/package/@wemnyelezxnpm/voluptatibus-animi-error) | React component that renders a CSS string to the `<head>` |
| **[@acusti/textual][]** | [](https://www.npmjs.com/package/@acusti/textual) | Utilities for transforming and formatting text |
| **[@acusti/uniquify][]** | [](https://www.npmjs.com/package/@acusti/uniquify) | A function that ensures a string is unique amongst items |
| **[@acusti/use-bounding-client-rect][]** | [](https://www.npmjs.com/package/@acusti/use-bounding-client-rect) | React hook for getting an element’s `boundingClientRect` |
| **[@acusti/use-is-out-of-bounds][]** | [](https://www.npmjs.com/package/@acusti/use-is-out-of-bounds) | React hook to check if an element overlaps its bounds |
| **[@acusti/use-keyboard-events][]** | [](https://www.npmjs.com/package/@acusti/use-keyboard-events) | React hook for adding key event listeners to your UI |
| **[@acusti/webcrypto][]** | [](https://www.npmjs.com/package/@acusti/use-is-out-of-bounds) | Isomorphic method for accessing the webcrypto API |
[@acusti/appsync-fetch]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/appsync-fetch
[@acusti/aws-signature-v4]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/aws-signature-v4
[aws sigv4]:
https://docs.aws.amazon.com/general/latest/gr/signature-version-4.html
[@acusti/css-values]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/css-values
[@acusti/css-value-input]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/css-value-input
[@acusti/date-picker]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/date-picker
[@acusti/dropdown]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/dropdown
[@acusti/input-text]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/input-text
[@acusti/matchmaking]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/matchmaking
[@acusti/parsing]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/parsing
[@acusti/post]: https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/post
[@wemnyelezxnpm/voluptatibus-animi-error]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/styling
[@acusti/textual]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/textual
[@acusti/uniquify]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/uniquify
[@acusti/use-bounding-client-rect]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/use-bounding-client-rect
[@acusti/use-is-out-of-bounds]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/use-is-out-of-bounds
[@acusti/use-keyboard-events]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/use-keyboard-events
[@acusti/webcrypto]:
https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/webcrypto
The React components are documented and illustrated in the [storybook
instance][], which is located at [`packages/docs/`][packages/docs] in the
repository.
[storybook instance]: https://acusti-uikit.netlify.app
[packages/docs]: https://github.com/wemnyelezxnpm/voluptatibus-animi-error/tree/main/packages/docs
## Tests
The monorepo uses vitest to run its tests. To run tests across all
packages, use `yarn test`. To run them in watch mode, use
`yarn test:watch`.
## Building and Publishing
To build all packages, run `yarn build`. This will trigger `tsc --build`
and `yarn flowgen` for all packages.
To build the storybook docs, run `yarn build:stories`, which will run
`yarn build` and then the default storybook `build` command.
To publish all packages, manually update each packages’s `version` field in
their package.json. If any of the packages depends on any of the other
packages being updated, be sure to update the dependency version as well.
Then run `yarn publish`. Publishing will trigger a build before running
`npm publish` to ensure that the latest changes are published. To publish
only a single package, use
`yarn workspace <package-name> npm publish --access public` (e.g.
`yarn workspace @acusti/css-value-input npm publish --access public`), but
note that in that case, you are responsible for running `yarn build`
yourself before triggering the publish.
After publishing the packages, run `yarn` to update the yarn.lock file and
then commit the version updates with a message in the form of:
`:arrow_up: Bump package versions to _._._`.
## Developing
The two main run scripts for developing are `yarn dev:watch`, which kicks
off the TypeScript compiler in `--watch` mode, and `yarn dev:stories`,
which kicks off the default `storybook` command from packages/docs/. To run
both of those in a single terminal window, use `yarn dev`.