Table constructor

Table({
  1. List<TableColumn> columns = const [],
  2. List<TableRowData> rows = const [],
  3. Object? emptyState,
  4. bool loading = false,
  5. Object? loadingState,
  6. String? className,
  7. Map<String, Object?> props = const {},
  8. Map<String, Object?> style = const {},
  9. DartStyle? dartStyle,
  10. String? tableClassName,
  11. Map<String, Object?> tableProps = const {},
  12. Map<String, Object?> tableStyle = const {},
  13. DartStyle? tableDartStyle,
  14. String? headerClassName,
  15. Map<String, Object?> headerStyle = const {},
  16. DartStyle? headerDartStyle,
  17. String? rowClassName,
  18. String? selectedRowClassName,
  19. Map<String, Object?> rowStyle = const {},
  20. Map<String, Object?> selectedRowStyle = const {},
  21. DartStyle? rowDartStyle,
  22. DartStyle? selectedRowDartStyle,
  23. String? cellClassName,
  24. Map<String, Object?> cellStyle = const {},
  25. DartStyle? cellDartStyle,
  26. void onRowClick(
    1. Object event,
    2. TableRowData row
    )?,
})

Creates a table from columns and rows.

Implementation

Table({
  List<TableColumn> columns = const [],
  List<TableRowData> rows = const [],
  Object? emptyState,
  bool loading = false,
  Object? loadingState,
  String? className,
  Map<String, Object?> props = const {},
  Map<String, Object?> style = const {},
  DartStyle? dartStyle,
  String? tableClassName,
  Map<String, Object?> tableProps = const {},
  Map<String, Object?> tableStyle = const {},
  DartStyle? tableDartStyle,
  String? headerClassName,
  Map<String, Object?> headerStyle = const {},
  DartStyle? headerDartStyle,
  String? rowClassName,
  String? selectedRowClassName,
  Map<String, Object?> rowStyle = const {},
  Map<String, Object?> selectedRowStyle = const {},
  DartStyle? rowDartStyle,
  DartStyle? selectedRowDartStyle,
  String? cellClassName,
  Map<String, Object?> cellStyle = const {},
  DartStyle? cellDartStyle,
  void Function(Object event, TableRowData row)? onRowClick,
}) : super(
        'div',
        props: mergeComponentProps(
          props,
          className: className,
          defaultStyle: const {
            'overflow-x': 'auto',
            'border': '1px solid #e4e7ec',
            'border-radius': '8px',
            'background': '#ffffff',
          },
          dartStyle: dartStyle,
          style: style,
        ),
        children: [
          if (loading)
            toFlintNode(loadingState ?? 'Loading...')
          else if (rows.isEmpty)
            toFlintNode(emptyState ?? 'No records found.')
          else
            FlintElement(
              'table',
              props: mergeComponentProps(
                tableProps,
                className: tableClassName,
                defaultStyle: const {
                  'width': '100%',
                  'border-collapse': 'collapse',
                },
                dartStyle: tableDartStyle,
                style: tableStyle,
              ),
              children: [
                _thead(
                  columns,
                  headerClassName: headerClassName,
                  headerStyle: headerStyle,
                  headerDartStyle: headerDartStyle,
                ),
                _tbody(
                  columns,
                  rows,
                  onRowClick,
                  rowClassName: rowClassName,
                  selectedRowClassName: selectedRowClassName,
                  rowStyle: rowStyle,
                  selectedRowStyle: selectedRowStyle,
                  rowDartStyle: rowDartStyle,
                  selectedRowDartStyle: selectedRowDartStyle,
                  cellClassName: cellClassName,
                  cellStyle: cellStyle,
                  cellDartStyle: cellDartStyle,
                ),
              ],
            ),
        ],
      );