UNPKG

optimized-react-component-library-xyz123

Version:
103 lines (83 loc) 2.42 kB
# optimized-react-component-library-xyz123 Ett modernt, best practice React-komponentbibliotek med TypeScript. Förberett för npm-publicering. ## Funktioner - TypeScript - ESLint & Prettier - Vitest för tester - tsup för bundling - Exempelkomponenter: `TextInput`, `Checkbox` - Klar för npm publish ## Komponenter ### TextInput En standard textinput med props: - `value: string` (obligatorisk) - `onChange: (event) => void` (obligatorisk) - `placeholder?: string` **Exempel:** ```tsx import { TextInput } from 'optimized-react-component-library-xyz123'; <TextInput value={text} onChange={handleChange} placeholder="Skriv här" /> ``` ### Checkbox En standard checkbox med props: - `checked: boolean` (obligatorisk) - `onChange: (event) => void` (obligatorisk) - `label?: string` **Exempel:** ```tsx import { Checkbox } from 'optimized-react-component-library-xyz123'; <Checkbox checked={isChecked} onChange={handleCheck} label="Godkänn villkor" /> ``` ### TextFieldStandard En avancerad textfält-komponent med stöd för validering, preview och extra attribut. Props (via `TextFieldStandardProps`): - `question: IQuestion` (obligatorisk) - `isTouched: (event, question) => void` (obligatorisk) - `showPreview?: boolean` - `activatedLanguage?: string` **Exempel:** ```tsx import TextFieldStandard from 'optimized-react-component-library-xyz123/NewInputComponentStandard/TextFieldStandard/TextFieldStandard'; <TextFieldStandard question={question} isTouched={handleTouched} showPreview={false} activatedLanguage="sv" /> ``` ### TextAreaStandard En textarea-komponent med liknande props som TextFieldStandard. **Exempel:** ```tsx import TextAreaStandard from 'optimized-react-component-library-xyz123/NewInputComponentStandard/TextAreaStandard/TextAreaStandard'; <TextAreaStandard question={question} isTouched={handleTouched} showPreview={false} activatedLanguage="sv" /> ``` ## Kom igång 1. Installera beroenden: ```sh npm install ``` 2. Bygg biblioteket: ```sh npm run build ``` 3. Kör tester: ```sh npm test ``` 4. Lint och formatera: ```sh npm run lint npm run format ``` 5. Publicera till npm: - Uppdatera fält i `package.json` (`name`, `author`, `repository`) - Kör: ```sh npm publish --access public ```