@emporix/cockpit-component-library 0.0.1 → 0.0.2
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 +26 -26
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -89,16 +89,16 @@ import { PrimaryButton } from '@emporix/cockpit-component-library'
|
|
|
89
89
|
|
|
90
90
|
#### Props
|
|
91
91
|
|
|
92
|
-
| Prop | Type
|
|
93
|
-
| ----------- |
|
|
94
|
-
| label | string
|
|
95
|
-
| disabled | boolean
|
|
96
|
-
| loading | boolean
|
|
97
|
-
| icon | ReactNode
|
|
98
|
-
| iconPos | `'left' \| 'right'`
|
|
99
|
-
| onClick | () => void
|
|
100
|
-
| className | string
|
|
101
|
-
| data-testid | string
|
|
92
|
+
| Prop | Type | Default | Description |
|
|
93
|
+
| ----------- | ------------------- | ------- | ---------------------------------------------- |
|
|
94
|
+
| label | string | - | Text label displayed inside the button |
|
|
95
|
+
| disabled | boolean | false | Whether button is disabled |
|
|
96
|
+
| loading | boolean | false | Shows loading spinner and disables the button |
|
|
97
|
+
| icon | ReactNode | - | Optional icon shown next to the label or alone |
|
|
98
|
+
| iconPos | `'left' \| 'right'` | 'left' | Icon position relative to the label |
|
|
99
|
+
| onClick | () => void | - | Click handler |
|
|
100
|
+
| className | string | - | Additional CSS class |
|
|
101
|
+
| data-testid | string | - | Test ID for testing |
|
|
102
102
|
|
|
103
103
|
### InputText
|
|
104
104
|
|
|
@@ -131,17 +131,17 @@ import { InputText } from '@emporix/cockpit-component-library'
|
|
|
131
131
|
|
|
132
132
|
#### Props
|
|
133
133
|
|
|
134
|
-
| Prop | Type | Default | Description
|
|
135
|
-
| ----------- | --------- | ------- |
|
|
136
|
-
| label | ReactNode | - | Label text above the input
|
|
137
|
-
| tooltip | string | - | If set, shows info icon with this tooltip
|
|
138
|
-
| required | boolean | false | Shows asterisk on label
|
|
139
|
-
| inputId | string | - | id for the input (for label association)
|
|
140
|
-
| textarea | boolean | false | When true, renders a `<textarea>` instead of `<input>`
|
|
141
|
-
| rows | number | 3 | Number of visible rows (textarea only)
|
|
142
|
-
| disabled | boolean | false | Whether the input is disabled
|
|
143
|
-
| className | string | - | Additional CSS class for the root
|
|
144
|
-
| data-testid | string | - | Test ID for root and input (input gets suffix `-input`)
|
|
134
|
+
| Prop | Type | Default | Description |
|
|
135
|
+
| ----------- | --------- | ------- | ------------------------------------------------------- |
|
|
136
|
+
| label | ReactNode | - | Label text above the input |
|
|
137
|
+
| tooltip | string | - | If set, shows info icon with this tooltip |
|
|
138
|
+
| required | boolean | false | Shows asterisk on label |
|
|
139
|
+
| inputId | string | - | id for the input (for label association) |
|
|
140
|
+
| textarea | boolean | false | When true, renders a `<textarea>` instead of `<input>` |
|
|
141
|
+
| rows | number | 3 | Number of visible rows (textarea only) |
|
|
142
|
+
| disabled | boolean | false | Whether the input is disabled |
|
|
143
|
+
| className | string | - | Additional CSS class for the root |
|
|
144
|
+
| data-testid | string | - | Test ID for root and input (input gets suffix `-input`) |
|
|
145
145
|
|
|
146
146
|
All standard HTML input/textarea attributes (placeholder, value, onChange, etc.) are supported.
|
|
147
147
|
|
|
@@ -266,15 +266,15 @@ The component library provides a minimal set of CSS variables that are actually
|
|
|
266
266
|
#### Colors
|
|
267
267
|
|
|
268
268
|
```css
|
|
269
|
-
--color-primary: #
|
|
270
|
-
--color-primary-hover: #
|
|
271
|
-
--color-dark: #
|
|
269
|
+
--color-primary: #0e99c6;
|
|
270
|
+
--color-primary-hover: #0e87b3;
|
|
271
|
+
--color-dark: #27313b;
|
|
272
272
|
```
|
|
273
273
|
|
|
274
274
|
#### Text Colors
|
|
275
275
|
|
|
276
276
|
```css
|
|
277
|
-
--color-text-primary: #
|
|
277
|
+
--color-text-primary: #ffffff;
|
|
278
278
|
--color-text-secondary: #999999;
|
|
279
279
|
```
|
|
280
280
|
|
|
@@ -288,7 +288,7 @@ The component library provides a minimal set of CSS variables that are actually
|
|
|
288
288
|
#### Border Colors
|
|
289
289
|
|
|
290
290
|
```css
|
|
291
|
-
--color-border-light: #
|
|
291
|
+
--color-border-light: #cad0d6;
|
|
292
292
|
```
|
|
293
293
|
|
|
294
294
|
#### Focus Ring
|