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

@ -1407,9 +1407,10 @@ None.
### Props ### Props
| Prop name | Kind | Reactive | Type | Default value | Description | | 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 | | 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 | | 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 | | 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 | | legendText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the legend text |

View file

@ -3514,6 +3514,16 @@
"constant": false, "constant": false,
"reactive": 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", "name": "messageText",
"kind": "let", "kind": "let",

View file

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

View file

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