mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-18 03:26:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(text-input): add missing warning field wrapper class

Browse source
This commit is contained in:
Eric Liu 2021-01-22 15:07:49 -08:00
commit ff5921d31c
2 changed files with 7 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

4
docs/src/pages/components/TextInput.svx
View file

@ -39,6 +39,10 @@ components: ["TextInput", "TextInputSkeleton"]
<TextInput invalid invalidText="User name is already taken. Please try another." labelText="User name" placeholder="Enter user name..." /> <TextInput invalid invalidText="User name is already taken. Please try another." labelText="User name" placeholder="Enter user name..." />
### Warning state
<TextInput warn warnText="Your user name is different from your log in ID." labelText="User name" placeholder="Enter user name..." />
### Disabled state ### Disabled state
<TextInput disabled labelText="User name" placeholder="Enter user name..." /> <TextInput disabled labelText="User name" placeholder="Enter user name..." />

5
src/TextInput/TextInput.svelte
View file

@ -63,8 +63,8 @@
export let inline = false; export let inline = false;
import { getContext } from "svelte"; import { getContext } from "svelte";
import WarningFilled16 from "carbon-icons-svelte/lib/WarningFilled16"; import WarningFilled16 from "carbon-icons-svelte/lib/WarningFilled16/WarningFilled16.svelte";
import WarningAltFilled16 from "carbon-icons-svelte/lib/WarningAltFilled16"; import WarningAltFilled16 from "carbon-icons-svelte/lib/WarningAltFilled16/WarningAltFilled16.svelte";
const ctx = getContext("Form"); const ctx = getContext("Form");
@ -127,6 +127,7 @@
data-invalid="{invalid || undefined}" data-invalid="{invalid || undefined}"
data-warn="{warn || undefined}" data-warn="{warn || undefined}"
class:bx--text-input__field-wrapper="{true}" class:bx--text-input__field-wrapper="{true}"
class:bx--text-input__field-wrapper--warning="{!invalid && warn}"
> >
{#if invalid} {#if invalid}
<WarningFilled16 class="bx--text-input__invalid-icon" /> <WarningFilled16 class="bx--text-input__invalid-icon" />