import React from 'react' import { CButton, CCard, CCardBody, CCardFooter, CCardHeader, CCol, CCollapse, CDropdownItem, CDropdownMenu, CDropdownToggle, CFade, CForm, CFormGroup, CFormText, CValidFeedback, CInvalidFeedback, CTextarea, CInput, CInputFile, CInputCheckbox, CInputRadio, CInputGroup, CInputGroupAppend, CInputGroupPrepend, CDropdown, CInputGroupText, CLabel, CSelect, CRow } from '@coreui/react' import CIcon from '@coreui/icons-react' import { DocsLink } from 'src/reusable' const BasicForms = () => { const [collapsed, setCollapsed] = React.useState(true) const [showElements, setShowElements] = React.useState(true) return ( <> Credit Card Form Name Credit Card Number Month Year CVV/CVC Company Form Company VAT Street City Postal Code Country Basic Form Elements Static

Username

Text Input This is a help text Email Input Please enter your email Password Please enter a complex password Date Input Disabled Input Textarea Select Select Large Select Small Disabled Select Radios Option 1 Option 2 Option 3 Inline Radios One Two Three Checkboxes Option 1 Option 2 Option 3 Inline Checkboxes One Two Three File input Multiple File input Choose Files... Custom file input Choose file...
Submit Reset
Inline Form Name Email Submit Reset
Horizontal Form Email Please enter your email Password Please enter your password Submit Reset Normal Form Email Please enter your email Password Please enter your password Submit Reset Input Grid Login Reset Input Sizes Small Input Normal Input Large Input Submit Reset
Form validation feedback Input is valid Cool! Input is valid Input is invalid Houston, we have a problem... Validation feedback Form Non-required input Non-required Required input Please provide a valid information Input provided Icon/Text Groups .00 Submit Reset Button Groups Search Submit Submit Reset Dropdowns Groups Dropdown Action Another Action Something else here Separated link Dropdown Action Another Action Something else here Separated link Action Action Another Action Something else here Separated link Dropdown Action Another Action Something else here Separated link Submit Reset Use the grid for big devices! .col-lg-* .col-md-* .col-sm-* Action Action Action Action Action Input Grid for small devices! .col-* Action Action Action Action Action Example Form Username Email Password Submit Example Form Submit Example Form Submit Form Elements
setCollapsed(!collapsed)} > setShowElements(false)} >
Prepended text
@

Here's some help text

Appended text
.00 Here's more help text
Append and prepend
$ .00
Append with button
Go!
Two-button append
Search Options
Save changes Cancel
) } export default BasicForms