(open = true) : null}
+ on:click={editable ? () => (open = true) : null}
>
{#each values as val (val)}
@@ -62,7 +64,7 @@
{/if}
{/each}
- {#if selected}
+ {#if editable}
{/if}
{#if open}
@@ -101,7 +103,7 @@
overflow: hidden;
gap: 4px;
}
- .container.selected:hover {
+ .container.editable:hover {
cursor: pointer;
}
.values {
diff --git a/packages/client/src/components/app/spreadsheet/Spreadsheet.svelte b/packages/client/src/components/app/spreadsheet/Spreadsheet.svelte
index 6275934b3a..d772e88505 100644
--- a/packages/client/src/components/app/spreadsheet/Spreadsheet.svelte
+++ b/packages/client/src/components/app/spreadsheet/Spreadsheet.svelte
@@ -37,7 +37,8 @@
limit,
})
$: fields = Object.keys($fetch.schema || {})
- $: initWidths(fields)
+ $: fieldCount = fields.length
+ $: fieldCount, initWidths()
$: gridStyles = getGridStyles(widths)
$: schema = $fetch.schema
$: rowCount = $fetch.rows?.length || 0
@@ -58,7 +59,7 @@
})
}
- const initWidths = fields => {
+ const initWidths = () => {
widths = fields.map(() => defaultWidth)
}
@@ -306,6 +307,7 @@
schema={schema[field]}
selected={selectedCell === cellIdx}
onChange={val => handleChange(row._id, field, val)}
+ readonly={schema[field]?.autocolumn}
/>
{/each}
diff --git a/packages/client/src/components/app/spreadsheet/TextCell.svelte b/packages/client/src/components/app/spreadsheet/TextCell.svelte
index 47e30aae2d..19531c88aa 100644
--- a/packages/client/src/components/app/spreadsheet/TextCell.svelte
+++ b/packages/client/src/components/app/spreadsheet/TextCell.svelte
@@ -3,13 +3,16 @@
export let selected = false
export let onChange
export let type = "text"
+ export let readonly = false
+
+ $: editable = selected && !readonly
const handleChange = e => {
onChange(e.target.value)
}
-{#if selected}
+{#if editable}