mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-15 18:31:06 +00:00
feat(file-uploader): make labelTitle
, labelDescription
slottable (#1780)
This commit is contained in:
parent
7ef8b73252
commit
239f1b10e5
4 changed files with 64 additions and 36 deletions
|
@ -37,12 +37,18 @@
|
|||
files = [];
|
||||
};
|
||||
|
||||
/** Specify the label description */
|
||||
export let labelDescription = "";
|
||||
|
||||
/** Specify the label title */
|
||||
/**
|
||||
* Specify the label title.
|
||||
* Alternatively, use the named slot "labelTitle" (e.g., `<span slot="labelTitle">...</span>`)
|
||||
*/
|
||||
export let labelTitle = "";
|
||||
|
||||
/**
|
||||
* Specify the label description.
|
||||
* Alternatively, use the named slot "labelDescription" (e.g., `<span slot="labelDescription">...</span>`)
|
||||
*/
|
||||
export let labelDescription = "";
|
||||
|
||||
/**
|
||||
* Specify the kind of file uploader button
|
||||
* @type {"primary" | "secondary" | "tertiary" | "ghost" | "danger"}
|
||||
|
@ -103,20 +109,24 @@
|
|||
on:mouseenter
|
||||
on:mouseleave
|
||||
>
|
||||
{#if labelTitle}
|
||||
{#if labelTitle || $$slots.labelTitle}
|
||||
<p
|
||||
class:bx--file--label="{true}"
|
||||
class:bx--label-description--disabled="{disabled}"
|
||||
>
|
||||
{labelTitle}
|
||||
<slot name="labelTitle">
|
||||
{labelTitle}
|
||||
</slot>
|
||||
</p>
|
||||
{/if}
|
||||
{#if labelDescription}
|
||||
{#if labelDescription || $$slots.labelDescription}
|
||||
<p
|
||||
class:bx--label-description="{true}"
|
||||
class:bx--label-description--disabled="{disabled}"
|
||||
>
|
||||
{labelDescription}
|
||||
<slot name="labelDescription">
|
||||
{labelDescription}
|
||||
</slot>
|
||||
</p>
|
||||
{/if}
|
||||
<FileUploaderButton
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue