refactor(fileuploader): move reactive assignment

This commit is contained in:
Eric Liu 2019-12-29 19:43:58 -08:00
commit d9c951f332
4 changed files with 9 additions and 17 deletions

View file

@ -3,9 +3,9 @@
export { className as class }; export { className as class };
export let style = undefined; export let style = undefined;
import { cx } from '../../lib';
import SkeletonText from '../SkeletonText'; import SkeletonText from '../SkeletonText';
import { ButtonSkeleton } from '../Button'; import { ButtonSkeleton } from '../Button';
import { cx } from '../../lib';
</script> </script>
<div on:click on:mouseover on:mouseenter on:mouseleave class={cx('--form-item', className)} {style}> <div on:click on:mouseover on:mouseenter on:mouseleave class={cx('--form-item', className)} {style}>

View file

@ -16,20 +16,12 @@
import { cx } from '../../lib'; import { cx } from '../../lib';
let inputRef = undefined; let inputRef = undefined;
$: _class = cx(
'--btn',
'--btn--sm',
kind && `--btn--${kind}`,
disabled && '--btn--disabled',
className
);
</script> </script>
<label <label
tabindex={disabled ? '-1' : tabindex} tabindex={disabled ? '-1' : tabindex}
aria-disabled={disabled} aria-disabled={disabled}
class={_class} class={cx('--btn', '--btn--sm', kind && `--btn--${kind}`, disabled && '--btn--disabled', className)}
for={id} for={id}
on:keydown on:keydown
on:keydown={({ key }) => { on:keydown={({ key }) => {
@ -54,8 +46,8 @@
} }
}} }}
on:click on:click
on:click={event => { on:click={({ target }) => {
event.target.value = null; target.value = null;
}} }}
{id} {id}
{disabled} {disabled}

View file

@ -26,9 +26,6 @@
<p class={cx('--file-filename')}>{name}</p> <p class={cx('--file-filename')}>{name}</p>
<span class={cx('--file__state-container')}> <span class={cx('--file__state-container')}>
<Filename <Filename
{iconDescription}
{status}
{invalid}
on:keydown={({ key }) => { on:keydown={({ key }) => {
if (key === ' ' || key === 'Enter') { if (key === ' ' || key === 'Enter') {
dispatch('delete', id); dispatch('delete', id);
@ -36,7 +33,10 @@
}} }}
on:click={() => { on:click={() => {
dispatch('delete', id); dispatch('delete', id);
}} /> }}
{iconDescription}
{status}
{invalid} />
</span> </span>
{#if invalid && errorSubject} {#if invalid && errorSubject}
<div class={cx('--form-requirement')}> <div class={cx('--form-requirement')}>

View file

@ -15,7 +15,7 @@
</script> </script>
{#if status === 'uploading'} {#if status === 'uploading'}
<Loading description={iconDescription} withOverlay={false} small class={className} {style} /> <Loading small description={iconDescription} withOverlay={false} class={className} {style} />
{/if} {/if}
{#if status === 'edit'} {#if status === 'edit'}