diff --git a/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte b/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte index ea9cb644e0..806961476e 100644 --- a/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte +++ b/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte @@ -91,9 +91,24 @@ } const handleTypeChange = column => evt => { - schema[column].type = evt.target.value + schema[column].type = evt.detail validateCSV() } + + const typeOptions = [ + { + label: "Text", + value: "string", + }, + { + label: "Number", + value: "number", + }, + { + label: "Date", + value: "datetime", + }, + ] </script> <div class="dropzone"> @@ -108,14 +123,12 @@ <div class="field"> <span>{columnName}</span> <Select - secondary - thin bind:value={schema[columnName].type} - on:change={handleTypeChange(columnName)}> - <option value={'string'}>Text</option> - <option value={'number'}>Number</option> - <option value={'datetime'}>Date</option> - </Select> + on:change={handleTypeChange(columnName)} + options={typeOptions} + placeholder={null} + getOptionLabel={option => option.label} + getOptionValue={option => option.value} /> <span class="field-status" class:error={!schema[columnName].success}> {schema[columnName].success ? 'Success' : 'Failure'} </span> @@ -128,12 +141,10 @@ </div> {#if fields.length} <div class="display-column"> - <Label extraSmall grey>Display Column</Label> - <Select thin secondary bind:value={primaryDisplay}> - {#each fields as field} - <option value={field}>{field}</option> - {/each} - </Select> + <Select + label="Display Column" + bind:value={primaryDisplay} + options={fields} /> </div> {/if} @@ -201,7 +212,7 @@ .field { display: grid; - grid-template-columns: 2fr 4fr 1fr 1fr; + grid-template-columns: 2fr 2fr 1fr auto; margin-top: var(--spacing-m); align-items: center; grid-gap: var(--spacing-m); diff --git a/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte b/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte index f6a4298521..3a82dc3815 100644 --- a/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte +++ b/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte @@ -92,7 +92,6 @@ <ModalContent title="Create Table" confirmText="Create" - size="large" onConfirm={saveTable} disabled={error || !name || (dataImport && !dataImport.valid)}> <Input