diff --git a/packages/frontend-core/src/components/grid/cells/GutterCell.svelte b/packages/frontend-core/src/components/grid/cells/GutterCell.svelte
index 349fea332c..f67aa99764 100644
--- a/packages/frontend-core/src/components/grid/cells/GutterCell.svelte
+++ b/packages/frontend-core/src/components/grid/cells/GutterCell.svelte
@@ -56,7 +56,7 @@
rowIdx={row?.__idx}
metadata={row?.__metadata?.row}
>
-
+
{#if $$slots.default}
{:else}
@@ -116,12 +116,9 @@
margin: 3px 0 0 0;
}
.number {
- color: val(--cell-font-color, var(--spectrum-global-color-gray-500));
- }
- .checkbox.visible,
- .number.visible {
- display: flex;
+ color: var(--spectrum-global-color-gray-500);
}
+
.delete,
.expand {
margin-right: 4px;
@@ -137,4 +134,11 @@
.delete:hover :global(.spectrum-Icon) {
color: var(--spectrum-global-color-red-600) !important;
}
+
+ /* Visibility of checkbox and number */
+ .gutter.selectable .checkbox.visible,
+ .number.visible,
+ .gutter:not(.selectable) .number {
+ display: flex;
+ }
diff --git a/packages/frontend-core/src/components/grid/layout/Grid.svelte b/packages/frontend-core/src/components/grid/layout/Grid.svelte
index 1a0488d9a4..1a7cb64534 100644
--- a/packages/frontend-core/src/components/grid/layout/Grid.svelte
+++ b/packages/frontend-core/src/components/grid/layout/Grid.svelte
@@ -354,11 +354,16 @@
/* Overrides for quiet */
.grid.quiet :global(.grid-data-content .row > .cell:not(:last-child)),
- .grid.quiet :global(.sticky-column .row > .cell),
- .grid.quiet :global(.new-row .row > .cell:not(:last-child)) {
+ .grid.quiet :global(.sticky-column .row .cell),
+ .grid.quiet :global(.new-row .row > .cell:not(:last-child)),
+ .grid.quiet :global(.header-cell:not(:last-child) .cell) {
border-right: none;
}
.grid.quiet :global(.sticky-column:before) {
display: none;
}
+ .grid.quiet :global(.header),
+ .grid.quiet :global(.header .cell) {
+ background: var(--grid-background);
+ }
diff --git a/packages/frontend-core/src/components/grid/stores/config.ts b/packages/frontend-core/src/components/grid/stores/config.ts
index 2ddaf1b65c..9245289565 100644
--- a/packages/frontend-core/src/components/grid/stores/config.ts
+++ b/packages/frontend-core/src/components/grid/stores/config.ts
@@ -7,8 +7,12 @@ type ConfigStore = {
[key in keyof BaseStoreProps]: Readable
}
+interface ConfigState extends BaseStoreProps {
+ canSelectRows: boolean
+}
+
interface ConfigDerivedStore {
- config: Readable
+ config: Readable
}
export type Store = ConfigStore & ConfigDerivedStore
@@ -47,7 +51,7 @@ export const deriveStores = (context: StoreContext): ConfigDerivedStore => {
const config = derived(
[props, definition, hasNonAutoColumn],
([$props, $definition, $hasNonAutoColumn]) => {
- let config = { ...$props }
+ let config: ConfigState = { ...$props, canSelectRows: false }
const type = $props.datasource?.type
// Disable some features if we're editing a view
@@ -78,6 +82,9 @@ export const deriveStores = (context: StoreContext): ConfigDerivedStore => {
config.canEditColumns = false
}
+ // Determine if we can select rows
+ config.canSelectRows = false //!!config.canDeleteRows || !!config.canAddRows
+
return config
}
)
diff --git a/packages/server/src/constants/screens.ts b/packages/server/src/constants/screens.ts
index 764250bd03..51d7049746 100644
--- a/packages/server/src/constants/screens.ts
+++ b/packages/server/src/constants/screens.ts
@@ -296,6 +296,7 @@ export function createSampleDataTableScreen(): Screen {
active: true,
conditions: [
{
+ id: Math.random(),
target: "row",
metadataKey: "backgroundColor",
operator: "contains",