componenteshospitais 1.4.7 → 1.4.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +103 -0
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
COMPONENTESHOSPITAIS
|
|
2
|
+
|
|
3
|
+
componenteshospitais is a versatile and modular component library . This package provides a collection of React components that streamline the development of modern, responsive, and accessible user interfaces for systems, portals, and other platforms.
|
|
4
|
+
|
|
5
|
+
Installation
|
|
6
|
+
|
|
7
|
+
To install the package, use npm or yarn:
|
|
8
|
+
|
|
9
|
+
npm install componenteshospitais
|
|
10
|
+
|
|
11
|
+
or
|
|
12
|
+
|
|
13
|
+
yarn add componenteshospitais
|
|
14
|
+
|
|
15
|
+
Components
|
|
16
|
+
1. Button
|
|
17
|
+
A customizable button component that supports different styles and sizes. It's designed to handle user interactions with visual feedback.
|
|
18
|
+
|
|
19
|
+
Props:
|
|
20
|
+
texto: The text to display inside the button.
|
|
21
|
+
onClick: The event handler for the click event.
|
|
22
|
+
largura: The width of the button.
|
|
23
|
+
empresa: A custom prop to define button styles for different companies.
|
|
24
|
+
|
|
25
|
+
2. InputField
|
|
26
|
+
A flexible input component that can be used for various types of inputs, including text, email, and numbers. It includes built-in validation and styling to match hospital-themed applications.
|
|
27
|
+
|
|
28
|
+
Props:
|
|
29
|
+
type: The type of input (e.g., text, email, number).
|
|
30
|
+
id: The unique identifier for the input field.
|
|
31
|
+
placeholder: Placeholder text for the input.
|
|
32
|
+
value: The current value of the input.
|
|
33
|
+
onChange: The event handler for the change event.
|
|
34
|
+
label: The label displayed above the input field.
|
|
35
|
+
|
|
36
|
+
3. SelectField
|
|
37
|
+
A dropdown select component that allows users to choose from a list of options. It supports single and multi-select functionalities, making it ideal for forms requiring dropdowns.
|
|
38
|
+
|
|
39
|
+
Props:
|
|
40
|
+
id: The unique identifier for the select field.
|
|
41
|
+
name: The name attribute for the select field.
|
|
42
|
+
options: An array of options to display.
|
|
43
|
+
value: The current selected value(s).
|
|
44
|
+
onChange: The event handler for when the selection changes.
|
|
45
|
+
label: The label displayed above the select field.
|
|
46
|
+
|
|
47
|
+
4. CheckboxGroup
|
|
48
|
+
A group of checkboxes that allows users to select multiple options from a list. The component is designed to support custom layouts, such as multi-column displays.
|
|
49
|
+
|
|
50
|
+
Props:
|
|
51
|
+
id: The unique identifier for the checkbox group.
|
|
52
|
+
name: The name attribute for the checkboxes.
|
|
53
|
+
options: An array of options to display.
|
|
54
|
+
selectedValues: The currently selected values.
|
|
55
|
+
onChange: The event handler for when the selection changes.
|
|
56
|
+
label: The label displayed above the checkbox group.
|
|
57
|
+
|
|
58
|
+
5. Card
|
|
59
|
+
A container component that presents content in a card format. It can be used to display various information such as user profiles, notifications, or articles.
|
|
60
|
+
|
|
61
|
+
Props:
|
|
62
|
+
title: The title of the card.
|
|
63
|
+
description: The description or content inside the card.
|
|
64
|
+
image: An optional image to display in the card.
|
|
65
|
+
onClick: The event handler for click events on the card.
|
|
66
|
+
|
|
67
|
+
6. CardImage
|
|
68
|
+
A component for displaying images within a card or standalone. It supports custom styling and resizing.
|
|
69
|
+
|
|
70
|
+
Props:
|
|
71
|
+
src: The source URL of the image.
|
|
72
|
+
alt: The alternative text for the image.
|
|
73
|
+
width: The width of the image.
|
|
74
|
+
height: The height of the image.
|
|
75
|
+
|
|
76
|
+
7. TituloPagina
|
|
77
|
+
A header component to display page titles. It's styled to match the overall theme of hospital management interfaces.
|
|
78
|
+
|
|
79
|
+
Props:
|
|
80
|
+
titulo: The title text to display.
|
|
81
|
+
subtitulo: An optional subtitle to display under the main title.
|
|
82
|
+
|
|
83
|
+
8. MenuPage
|
|
84
|
+
A component that generates a navigation menu for different sections of the application. It is fully customizable to fit various layout needs.
|
|
85
|
+
|
|
86
|
+
Props:
|
|
87
|
+
items: An array of menu items to display.
|
|
88
|
+
onSelect: The event handler when a menu item is selected.
|
|
89
|
+
|
|
90
|
+
9. TextPage
|
|
91
|
+
A simple text display component that can be used for paragraphs, instructions, or any textual content within your application.
|
|
92
|
+
|
|
93
|
+
Props:
|
|
94
|
+
content: The text content to display.
|
|
95
|
+
className: Custom class names for additional styling.
|
|
96
|
+
|
|
97
|
+
10. Busca
|
|
98
|
+
A search component that provides instant filtering and search capabilities. It's designed to be fast and user-friendly, suitable for searching through patient records, documents, or any large datasets.
|
|
99
|
+
|
|
100
|
+
Props:
|
|
101
|
+
onSearch: The event handler when a search is performed.
|
|
102
|
+
placeholder: Placeholder text for the search input.
|
|
103
|
+
results: The search results to display.
|