@ng-solid/design-system 22.0.6 → 22.1.0
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 +36 -0
- package/fesm2022/ng-solid-design-system.mjs +496 -669
- package/fesm2022/ng-solid-design-system.mjs.map +1 -1
- package/package.json +1 -1
- package/types/ng-solid-design-system.d.ts +177 -179
package/README.md
CHANGED
|
@@ -38,3 +38,39 @@ and in your html template
|
|
|
38
38
|
```angular2html
|
|
39
39
|
<ns-button label="My Button" [theme]="true"></ns-button>
|
|
40
40
|
```
|
|
41
|
+
|
|
42
|
+
### Input groups
|
|
43
|
+
|
|
44
|
+
`ns-input-group` is a visual wrapper. Keep `formControlName`, `formControl` or
|
|
45
|
+
`ngModel` on every input, checkbox or radio inside the group.
|
|
46
|
+
|
|
47
|
+
```ts
|
|
48
|
+
import {
|
|
49
|
+
NsInputComponent,
|
|
50
|
+
NsInputGroupAddonComponent,
|
|
51
|
+
NsInputGroupComponent
|
|
52
|
+
} from '@ng-solid/design-system';
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
```html
|
|
56
|
+
<ns-input-group
|
|
57
|
+
append=".tienda-aprovecha.do"
|
|
58
|
+
label="Store URL"
|
|
59
|
+
size="md"
|
|
60
|
+
[wrap]="false"
|
|
61
|
+
>
|
|
62
|
+
<ns-input formControlName="domain" placeholder="demo" />
|
|
63
|
+
</ns-input-group>
|
|
64
|
+
|
|
65
|
+
<ns-input-group label="Amount">
|
|
66
|
+
<ns-input-group-addon>$</ns-input-group-addon>
|
|
67
|
+
<ns-input formControlName="amount" ariaLabel="Amount" />
|
|
68
|
+
<ns-input-group-addon>USD</ns-input-group-addon>
|
|
69
|
+
<ns-button label="Apply" />
|
|
70
|
+
</ns-input-group>
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
The group supports text addons through `prepend` and `append`, repeated
|
|
74
|
+
`ns-input-group-addon` elements, buttons on either side, multiple inputs,
|
|
75
|
+
checkbox/radio content, `sm | md | lg` sizing and configurable wrapping. Labels
|
|
76
|
+
belong outside the visual row and are associated with the first `ns-input`.
|