kids-first / kf-uikit

🎨 Design System for Kids First
https://kf-uikit.netlify.com
Apache License 2.0
1 stars 1 forks source link

✨ Add input text box component #119

Open XuTheBunny opened 5 years ago

XuTheBunny commented 5 years ago

Motivation

Create input field - one line input box with different input types. image

Use Cases

  1. Kids First Data Tracker image

  2. Kids First Coordinator image image

  3. Kids First website image

API changes

No API changes are made on this component.

Implementation Notes

The validation for input value would be handled by the app. To show the error message, pass the string to error prop.

Rendering and Storybook location

src/
└── components
    ├── InputText
    │   ├── __tests__/
    │   ├── InputText.jsx
    │   ├── InputText.story.jsx
    │   └── InputText.css
    └── index.js

Functional Tests

Test input text box component with all prop value combinations.

dankolbman commented 5 years ago

UIKit Storybook for Review

Built with commit c9c381d20234ad344d9ac572be40e1a2cc2bb05b

https://deploy-preview-119--kf-uikit.netlify.com

dankolbman commented 5 years ago

UIKit Storybook for Review

Built with commit 87257eee6979d25a55c81d431255e8921563c2a1

https://deploy-preview-119--kf-uikit.netlify.com