search

Police-Data-Accessibility-Project / design-system

Vue component library and assets for PDAP-branded client apps
MIT License
0 stars 0 forks source link

feature/component-library #12

Closed joshuagraber closed 7 months ago

joshuagraber commented 8 months ago

Resolves #3

joshuagraber commented 8 months ago

Hey @josh-chamberlain @mbodeantor @kalenluciano Here's the start of the component library work, if you're interested in having a look. The config is complete and there is a lightweight Button component that works well in a vue project where I tested it locally.

My goals to complete the PR are as follows:

  1. Add actual testing with jest and write one for the Button component.
  2. Create lightweight versions of other components currently represented by PDAP UI and write associated tests.
  3. Revise the README and CONTRIBUTING docs to ensure clarity for contributors to this repo and those consuming in other apps.

Once all of that is done, we should be g2g to both begin using these components/assets in projects and create a road map of work to continue building on this foundation.

josh-chamberlain commented 8 months ago

Thanks for the status update! Thanks for considering testing, too. Let us know if you want to sit down and check in about this, or how it relates to the app/site.

kalenluciano commented 8 months ago

This looks great! Like Josh said, let us know if you want to sit down and check in about anything

joshuagraber commented 7 months ago

Hey, @josh-chamberlain @kalenluciano @mbodeantor this is finally ready for review with the symlink strategy. (pull repo, npm i then npm link -> in test repo npm link pdap-design-system, then at root import 'pdap-design-system/styles', then you should be good to import { Header, Footer, etc } from 'pdap-design-system' and use.

Ignore the README for the time being. I'm working on a full set of documentation for these components, as well a test app to be contained within this repo to run the UI, but it's not quite ready. If you want to wait for that, it should be ready by tomorrow sometime. ✨

josh-chamberlain commented 7 months ago

@joshuagraber thank you! that sounds good. The symlinks are still good for testing changes to the design system on other apps, correct? or will there be a better way to do that, too?

I've had a little trouble getting things to work, because I'm in over my head without docs. I can wait!

joshuagraber commented 7 months ago

The symlinks are still good for testing changes to the design system on other apps, correct? or will there be a better way to do that, too?

@josh-chamberlain Hey, yes the symlink is still the best strategy. I tried to nest a test app in the repo, but Vue and its router got confused. I think I need to do a little more research on how to isolate the sub-package within the same repo.

I've had a little trouble getting things to work, because I'm in over my head without docs. I can wait!

Absolutely! Docs incoming, with detailed explanations of the components' APIs. Started today, will finish up Monday or Tuesday.