Skip to content

Latest commit

 

History

History
71 lines (43 loc) · 1.41 KB

README.md

File metadata and controls

71 lines (43 loc) · 1.41 KB
Raw

Text Input Component

This is a text input component which was implemented in React Hooks.

Installation and Setup Instructions

Example:

Clone down this repository. You will need node and npm installed globally on your machine.

Installation:

npm install

To Start Server:

npm start

To Visit App:

localhost:3000

To Run Test Suite:

npm test

Storybook

To Start Storybook:

npm run storybook

To Visit Storybook:

localhost:6006

Unit Test Libraries

  • React Testing Library
  • Jest dom

External Libraries

  • lodash/fp
  • prop-types

Unit Coverage

  • PASS src/component/FieldMessage/FieldMessage.test.jsx
  • PASS src/component/Input/Input.test.jsx
  • PASS src/App.test.js

Test Suites: 3 passed, 3 total

Tests: 12 passed, 12 total

Snapshots: 0 total

Time: 2.531s

Next Steps TODO

This is a very brief list of things that I would love to work (improvement) on given more time:

  • Better solution for floating input label, but still sticking with Pure CSS. Not use empty placeholder by default
  • Introduce TypeScript
  • Make modules css maintenance better, extract out common styling.
  • Introduce CSS-in-JS or styled component
  • Improve the styling of micro-interactions. Coloring in this case.
  • Any edge cases with bugs I haven't found out.

Authors

  • Stanley Hsu

Have fun! Please feel free to contact me if you need any further information, I would love to discuss it.