mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-15 02:11:05 +00:00
feat(components): add Form, FormGroup, FormItem, FormLabel
Supports #17 Fixes broken storybook. TODO: Define stories using other components (e.g. NumberInput, Select...)
This commit is contained in:
parent
3345b71a8c
commit
3be285e112
18 changed files with 248 additions and 1 deletions
22
src/components/FormGroup/FormGroup.svelte
Normal file
22
src/components/FormGroup/FormGroup.svelte
Normal file
|
@ -0,0 +1,22 @@
|
|||
<script>
|
||||
let className = undefined;
|
||||
export { className as class };
|
||||
export let legendText = '';
|
||||
export let invalid = false;
|
||||
export let message = false;
|
||||
export let messageText = '';
|
||||
export let style = undefined;
|
||||
|
||||
import { cx } from '../../lib';
|
||||
|
||||
const _class = cx('--fieldset', className);
|
||||
const _legendClass = cx('--label', className);
|
||||
</script>
|
||||
|
||||
<fieldset data-invalid={invalid ? '' : undefined} class={_class} {style}>
|
||||
<legend class={_legendClass}>{legendText}</legend>
|
||||
<slot />
|
||||
{#if message}
|
||||
<div class={cx('--form__requirements')}>{messageText}</div>
|
||||
{/if}
|
||||
</fieldset>
|
Loading…
Add table
Add a link
Reference in a new issue