feat(form): add noMargin prop to FormGroup

This commit is contained in:
Eric Y Liu 2021-04-02 04:31:34 -07:00
commit 1284ffc5f3
4 changed files with 27 additions and 6 deletions

View file

@ -1406,12 +1406,13 @@ None.
### Props
| Prop name | Kind | Reactive | Type | Default value | Description |
| :---------- | :--------------- | :------- | :------------------- | ------------------ | ------------------------------------------ |
| invalid | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to indicate an invalid state |
| message | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to render a form requirement |
| messageText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the message text |
| legendText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the legend text |
| Prop name | Kind | Reactive | Type | Default value | Description |
| :---------- | :--------------- | :------- | :------------------- | ------------------ | --------------------------------------------- |
| invalid | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to indicate an invalid state |
| message | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to render a form requirement |
| noMargin | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` for to remove the bottom margin |
| messageText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the message text |
| legendText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the legend text |
### Slots

View file

@ -3514,6 +3514,16 @@
"constant": false,
"reactive": false
},
{
"name": "noMargin",
"kind": "let",
"description": "Set to `true` for to remove the bottom margin",
"type": "boolean",
"value": "false",
"isFunction": false,
"constant": false,
"reactive": false
},
{
"name": "messageText",
"kind": "let",

View file

@ -5,6 +5,9 @@
/** Set to `true` to render a form requirement */
export let message = false;
/** Set to `true` for to remove the bottom margin */
export let noMargin = false;
/** Specify the message text */
export let messageText = "";
@ -15,6 +18,7 @@
<fieldset
data-invalid="{invalid || undefined}"
class:bx--fieldset="{true}"
class:bx--fieldset--no-margin="{noMargin}"
{...$$restProps}
on:click
on:mouseover

View file

@ -15,6 +15,12 @@ export interface FormGroupProps
*/
message?: boolean;
/**
* Set to `true` for to remove the bottom margin
* @default false
*/
noMargin?: boolean;
/**
* Specify the message text
* @default ""