Skip to content

[01295] Ghost variant for DataTable (no edges, no padding)#2896

Open
nielsbosma wants to merge 6 commits intomainfrom
plan-01295-Ivy-Framework
Open

[01295] Ghost variant for DataTable (no edges, no padding)#2896
nielsbosma wants to merge 6 commits intomainfrom
plan-01295-Ivy-Framework

Conversation

@nielsbosma
Copy link
Copy Markdown
Contributor

Summary

Added a Ghost variant to DataTable that removes the container border, border-radius, horizontal grid borders, and footer border. This allows seamless embedding of a DataTable inside containers like Card with zero padding. A sample app DataTableGhostApp demonstrates the ghost variant alongside the default for comparison.

API Changes

  • New enum DataTableVariant (Default, Ghost) in Ivy namespace
  • New property DataTable.Variant (defaults to DataTableVariant.Default)
  • New extension method DataTable.Variant(DataTableVariant variant)
  • New extension method DataTable.Ghost() (shorthand for Variant(DataTableVariant.Ghost))

Files Modified

Backend:

  • src/Ivy/Widgets/DataTables/DataTable.cs — Added enum, prop, and extension methods

Frontend:

  • src/frontend/src/widgets/dataTables/types/types.ts — Added variant to TableProps
  • src/frontend/src/widgets/dataTables/styles/style.ts — Added ghost container and footer styles
  • src/frontend/src/widgets/dataTables/DataTableWidget.tsx — Thread variant to editor
  • src/frontend/src/widgets/dataTables/dataTableEditor/DataTableEditor.tsx — Thread variant to GridContainer, useTableTheme, and AggregateFooter
  • src/frontend/src/widgets/dataTables/components/GridContainer.tsx — Select ghost/default container styles based on variant
  • src/frontend/src/widgets/dataTables/hooks/useTableTheme.ts — Set horizontalBorderColor to transparent in ghost mode
  • src/frontend/src/widgets/dataTables/DataTableFooter.tsx — Ghost footer with no top border

Sample:

  • src/Ivy.Samples.Shared/Apps/Widgets/DataTableGhostApp.cs — Demo app with ghost-in-card and default comparison

Commits

  • 067626c9 — [01295] Add Ghost variant for DataTable (no edges, no padding)
  • a3ade27d — [01295] Fix missing using for RelatedToAttribute
  • 8d8ae775 — [01295] Thread Ghost variant through DataTableBuilder and DataTableView
  • b8a73599 — [01295] Fix sample app - Card does not have Padding method

@artem-ivy-ai
Copy link
Copy Markdown
Collaborator

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants