carbon-components-svelte/src/TextInput/TextInputSkeleton.svelte
Sam c436dbd761
feat!: TextInput v11 Styles (#1889)
* Initial commit

* Fixes [FluidForm] TextInput error icon is misplaced #1667

* Contributes to [TextInput] helperText enhancements #1633

* Adopts Standardize props and events #1621

* Added slots for Standardize props and events #1621

* Added pointer events, updated skeleton TextInput v11 #1888

* Address a bug in the word counter regex

* Update src/TextInput/TextInput.svelte

Correcting type attribute definition for HTML attributes

Co-authored-by: Enrico Sacchetti <esacchetti@gmail.com>

* Update src/TextInput/TextInput.svelte

Correcting type attribute definition for HTML attributes

Co-authored-by: Enrico Sacchetti <esacchetti@gmail.com>

* Update src/TextInput/TextInput.svelte

Explicitly define default value for `size`

Co-authored-by: Enrico Sacchetti <esacchetti@gmail.com>

* Adopted suggested changes

* Updated `TextInput.test`; added forgotten files from previous

---------

Co-authored-by: Samuel Janda <hi@simpleprogramming.com.au>
Co-authored-by: Enrico Sacchetti <esacchetti@gmail.com>
2024-01-17 10:48:25 -05:00

27 lines
696 B
Svelte

<script>
/** Set to `true` to hide the label text */
export let hideLabel = false;
/**
* Specify the div HTML attributes for the skeleton container
* @type {import('svelte/elements').HTMLDivAttributes}
*/
export let divAttributes = {};
</script>
<!-- svelte-ignore a11y-mouse-events-have-key-events -->
<!-- svelte-ignore a11y-no-static-element-interactions -->
<div
class:bx--form-item="{true}"
{...divAttributes}
on:click
on:pointerup
on:pointerover
on:pointerenter
on:pointerleave
>
{#if !hideLabel}
<span class:bx--label="{true}" class:bx--skeleton="{true}"></span>
{/if}
<div class:bx--skeleton="{true}" class:bx--text-input="{true}"></div>
</div>