# Tables

Clean data and comparison tables, plus native operational table designs.

## Installation

Download: /api/catalog/table-pattern/download

Ignition Perspective 8.3. In a development project, choose Designer > File > Import and select the ZIP. Preserve the view and style-class paths. Review resource conflicts before replacing anything.

Append stylesheet-snippet.css to Perspective Styles > stylesheet.css (enable Advanced Stylesheet). Preserve existing CSS. This supporting file is not imported automatically.

Add an Embedded View (ia.display.view), set props.path to Data/TablePattern, and configure props.params using the contract below. Connect your own data in the host view. The package does not include live tags, page configuration or Gateway settings.

## Parameters

Types are inferred from saved defaults; directions come from native propConfig. These are not full schemas or validated ranges.

| Parameter | Type | Direction | Default |

| --- | --- | --- | --- |

| caption | string | input | "Live tag browse · Line A" |

| showZebra | boolean | input | true |

| col0Header | string | input | "Tag" |

| col1Header | string | input | "Value" |

| col2Header | string | input | "Quality" |

| col3Header | string | input | "Time" |

| row0col0 | string | input | "TT-101" |

| row0col1 | string | input | "72.4 °C" |

| row0col2 | string | input | "Good" |

| row0col3 | string | input | "14:32:01" |

| row1col0 | string | input | "PT-204" |

| row1col1 | string | input | "1.82 bar" |

| row1col2 | string | input | "Good" |

| row1col3 | string | input | "14:32:01" |

| row2col0 | string | input | "FT-310" |

| row2col1 | string | input | "42.5 gpm" |

| row2col2 | string | input | "Uncertain" |

| row2col3 | string | input | "14:31:58" |

| row3col0 | string | input | "LT-118" |

| row3col1 | string | input | "68.2 %" |

| row3col2 | string | input | "Good" |

| row3col3 | string | input | "14:32:00" |

| row4col0 | string | input | "XS-401" |

| row4col1 | string | input | "RUN" |

| row4col2 | string | input | "Bad" |

| row4col3 | string | input | "14:31:55" |

## Embedded View usage

```json

{
  "type": "ia.display.view",
  "props": {
    "path": "Data/TablePattern",
    "params": {
      "caption": "Live tag browse · Line A",
      "showZebra": true,
      "col0Header": "Tag",
      "col1Header": "Value",
      "col2Header": "Quality",
      "col3Header": "Time",
      "row0col0": "TT-101",
      "row0col1": "72.4 °C",
      "row0col2": "Good",
      "row0col3": "14:32:01",
      "row1col0": "PT-204",
      "row1col1": "1.82 bar",
      "row1col2": "Good",
      "row1col3": "14:32:01",
      "row2col0": "FT-310",
      "row2col1": "42.5 gpm",
      "row2col2": "Uncertain",
      "row2col3": "14:31:58",
      "row3col0": "LT-118",
      "row3col1": "68.2 %",
      "row3col2": "Good",
      "row3col3": "14:32:00",
      "row4col0": "XS-401",
      "row4col1": "RUN",
      "row4col2": "Bad",
      "row4col3": "14:31:55"
    },
    "useDefaultViewWidth": false,
    "useDefaultViewHeight": false
  }
}

```

## Verification

Source and archive hashes are checked. Designer import acceptance has not been completed for this archive; test in your development project before production.

## Files

### com.inductiveautomation.perspective/views/Data/TablePattern/view.json

```json

{
  "custom": {},
  "params": {
    "caption": "Live tag browse · Line A",
    "showZebra": true,
    "col0Header": "Tag",
    "col1Header": "Value",
    "col2Header": "Quality",
    "col3Header": "Time",
    "row0col0": "TT-101",
    "row0col1": "72.4 °C",
    "row0col2": "Good",
    "row0col3": "14:32:01",
    "row1col0": "PT-204",
    "row1col1": "1.82 bar",
    "row1col2": "Good",
    "row1col3": "14:32:01",
    "row2col0": "FT-310",
    "row2col1": "42.5 gpm",
    "row2col2": "Uncertain",
    "row2col3": "14:31:58",
    "row3col0": "LT-118",
    "row3col1": "68.2 %",
    "row3col2": "Good",
    "row3col3": "14:32:00",
    "row4col0": "XS-401",
    "row4col1": "RUN",
    "row4col2": "Bad",
    "row4col3": "14:31:55"
  },
  "propConfig": {
    "params.caption": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.showZebra": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.col0Header": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.col1Header": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.col2Header": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.col3Header": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row0col0": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row0col1": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row0col2": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row0col3": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row1col0": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row1col1": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row1col2": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row1col3": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row2col0": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row2col1": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row2col2": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row2col3": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row3col0": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row3col1": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row3col2": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row3col3": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row4col0": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row4col1": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row4col2": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.row4col3": {
      "paramDirection": "input",
      "persistent": true
    }
  },
  "props": {
    "defaultSize": {
      "width": 560,
      "height": 280
    }
  },
  "root": {
    "type": "ia.container.flex",
    "version": 0,
    "meta": {
      "name": "TablePattern"
    },
    "props": {
      "direction": "column",
      "style": {
        "classes": "vc/table-pattern-root vc-r-table",
        "gap": "0px",
        "padding": "0px",
        "backgroundColor": "#0a0a0a",
        "color": "#fafafa",
        "borderColor": "rgba(255, 255, 255, 0.1)",
        "borderStyle": "solid",
        "borderWidth": "1px",
        "borderRadius": "8px",
        "boxSizing": "border-box",
        "overflow": "hidden",
        "width": "100%",
        "minHeight": "0px"
      }
    },
    "position": {
      "grow": 0,
      "shrink": 0,
      "basis": "auto"
    },
    "children": [
      {
        "type": "ia.container.flex",
        "version": 0,
        "meta": {
          "name": "TableShell"
        },
        "props": {
          "direction": "column",
          "style": {
            "gap": "0px",
            "width": "100%",
            "boxSizing": "border-box"
          }
        },
        "position": {
          "grow": 0,
          "shrink": 0,
          "basis": "auto"
        },
        "children": [
          {
            "type": "ia.container.flex",
            "version": 0,
            "meta": {
              "name": "HeaderRow"
            },
            "props": {
              "direction": "row",
              "alignItems": "center",
              "style": {
                "classes": "vc/table-pattern-header",
                "height": "48px",
                "minHeight": "48px",
                "maxHeight": "48px",
                "width": "100%",
                "borderColor": "rgba(255, 255, 255, 0.1)",
                "borderStyle": "solid",
                "borderWidth": "0 0 1px 0",
                "backgroundColor": "#171717",
                "boxSizing": "border-box"
              }
            },
            "position": {
              "grow": 0,
              "shrink": 0,
              "basis": "48px"
            },
            "children": [
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "HeaderCol0"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 500,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#a1a1a1",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 1,
                  "shrink": 0,
                  "basis": "34%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.col0Header}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "HeaderCol1"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 500,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#a1a1a1",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.col1Header}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "HeaderCol2"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 500,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#a1a1a1",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.col2Header}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "HeaderCol3"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 500,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#a1a1a1",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.col3Header}"
                      }
                    }
                  }
                }
              }
            ]
          },
          {
            "type": "ia.container.flex",
            "version": 0,
            "meta": {
              "name": "BodyRow0"
            },
            "props": {
              "direction": "row",
              "alignItems": "center",
              "style": {
                "classes": "vc/table-pattern-row",
                "height": "48px",
                "minHeight": "48px",
                "maxHeight": "48px",
                "width": "100%",
                "borderColor": "rgba(255, 255, 255, 0.1)",
                "borderStyle": "solid",
                "borderWidth": "0 0 1px 0",
                "backgroundColor": "#171717",
                "boxSizing": "border-box"
              }
            },
            "position": {
              "grow": 0,
              "shrink": 0,
              "basis": "48px"
            },
            "children": [
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row0Col0"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 1,
                  "shrink": 0,
                  "basis": "34%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row0col0}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row0Col1"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row0col1}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row0Col2"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell vc-r-quality",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row0col2}"
                      }
                    }
                  },
                  "props.style.color": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "if({this.props.text} = \"Good\", \"#86efac\", if({this.props.text} = \"Uncertain\", \"#fde047\", \"#fca5a5\"))"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row0Col3"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row0col3}"
                      }
                    }
                  }
                }
              }
            ]
          },
          {
            "type": "ia.container.flex",
            "version": 0,
            "meta": {
              "name": "BodyRow1"
            },
            "props": {
              "direction": "row",
              "alignItems": "center",
              "style": {
                "classes": "vc/table-pattern-row",
                "height": "48px",
                "minHeight": "48px",
                "maxHeight": "48px",
                "width": "100%",
                "borderColor": "rgba(255, 255, 255, 0.1)",
                "borderStyle": "solid",
                "borderWidth": "0 0 1px 0",
                "backgroundColor": "#171717",
                "boxSizing": "border-box"
              }
            },
            "position": {
              "grow": 0,
              "shrink": 0,
              "basis": "48px"
            },
            "children": [
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row1Col0"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 1,
                  "shrink": 0,
                  "basis": "34%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row1col0}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row1Col1"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row1col1}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row1Col2"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell vc-r-quality",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row1col2}"
                      }
                    }
                  },
                  "props.style.color": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "if({this.props.text} = \"Good\", \"#86efac\", if({this.props.text} = \"Uncertain\", \"#fde047\", \"#fca5a5\"))"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row1Col3"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row1col3}"
                      }
                    }
                  }
                }
              }
            ],
            "propConfig": {
              "props.style.backgroundColor": {
                "binding": {
                  "type": "expr",
                  "config": {
                    "expression": "if(coalesce({view.params.showZebra}, true), \"#1c1c1c\", \"#171717\")"
                  }
                }
              }
            }
          },
          {
            "type": "ia.container.flex",
            "version": 0,
            "meta": {
              "name": "BodyRow2"
            },
            "props": {
              "direction": "row",
              "alignItems": "center",
              "style": {
                "classes": "vc/table-pattern-row",
                "height": "48px",
                "minHeight": "48px",
                "maxHeight": "48px",
                "width": "100%",
                "borderColor": "rgba(255, 255, 255, 0.1)",
                "borderStyle": "solid",
                "borderWidth": "0 0 1px 0",
                "backgroundColor": "#171717",
                "boxSizing": "border-box"
              }
            },
            "position": {
              "grow": 0,
              "shrink": 0,
              "basis": "48px"
            },
            "children": [
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row2Col0"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 1,
                  "shrink": 0,
                  "basis": "34%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row2col0}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row2Col1"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row2col1}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row2Col2"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell vc-r-quality",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row2col2}"
                      }
                    }
                  },
                  "props.style.color": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "if({this.props.text} = \"Good\", \"#86efac\", if({this.props.text} = \"Uncertain\", \"#fde047\", \"#fca5a5\"))"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row2Col3"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row2col3}"
                      }
                    }
                  }
                }
              }
            ]
          },
          {
            "type": "ia.container.flex",
            "version": 0,
            "meta": {
              "name": "BodyRow3"
            },
            "props": {
              "direction": "row",
              "alignItems": "center",
              "style": {
                "classes": "vc/table-pattern-row",
                "height": "48px",
                "minHeight": "48px",
                "maxHeight": "48px",
                "width": "100%",
                "borderColor": "rgba(255, 255, 255, 0.1)",
                "borderStyle": "solid",
                "borderWidth": "0 0 1px 0",
                "backgroundColor": "#171717",
                "boxSizing": "border-box"
              }
            },
            "position": {
              "grow": 0,
              "shrink": 0,
              "basis": "48px"
            },
            "children": [
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row3Col0"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 1,
                  "shrink": 0,
                  "basis": "34%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row3col0}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row3Col1"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row3col1}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row3Col2"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell vc-r-quality",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row3col2}"
                      }
                    }
                  },
                  "props.style.color": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "if({this.props.text} = \"Good\", \"#86efac\", if({this.props.text} = \"Uncertain\", \"#fde047\", \"#fca5a5\"))"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row3Col3"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row3col3}"
                      }
                    }
                  }
                }
              }
            ],
            "propConfig": {
              "props.style.backgroundColor": {
                "binding": {
                  "type": "expr",
                  "config": {
                    "expression": "if(coalesce({view.params.showZebra}, true), \"#1c1c1c\", \"#171717\")"
                  }
                }
              }
            }
          },
          {
            "type": "ia.container.flex",
            "version": 0,
            "meta": {
              "name": "BodyRow4"
            },
            "props": {
              "direction": "row",
              "alignItems": "center",
              "style": {
                "classes": "vc/table-pattern-row",
                "height": "48px",
                "minHeight": "48px",
                "maxHeight": "48px",
                "width": "100%",
                "borderColor": "rgba(255, 255, 255, 0.1)",
                "borderStyle": "solid",
                "borderWidth": "0",
                "backgroundColor": "#171717",
                "boxSizing": "border-box"
              }
            },
            "position": {
              "grow": 0,
              "shrink": 0,
              "basis": "48px"
            },
            "children": [
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row4Col0"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 1,
                  "shrink": 0,
                  "basis": "34%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row4col0}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row4Col1"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row4col1}"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row4Col2"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell vc-r-quality",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-start",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "left",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row4col2}"
                      }
                    }
                  },
                  "props.style.color": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "if({this.props.text} = \"Good\", \"#86efac\", if({this.props.text} = \"Uncertain\", \"#fde047\", \"#fca5a5\"))"
                      }
                    }
                  }
                }
              },
              {
                "type": "ia.display.label",
                "version": 0,
                "meta": {
                  "name": "Row4Col3"
                },
                "props": {
                  "text": "",
                  "style": {
                    "classes": "vc/table-pattern-cell",
                    "fontSize": "14px",
                    "fontWeight": 400,
                    "lineHeight": "20px",
                    "padding": "0 16px",
                    "overflow": "hidden",
                    "textOverflow": "ellipsis",
                    "whiteSpace": "nowrap",
                    "color": "#fafafa",
                    "boxSizing": "border-box",
                    "alignSelf": "stretch",
                    "display": "flex",
                    "alignItems": "center",
                    "justifyContent": "flex-end",
                    "fontVariantNumeric": "tabular-nums"
                  },
                  "align": "right",
                  "alignVertical": "center"
                },
                "position": {
                  "grow": 0,
                  "shrink": 0,
                  "basis": "22%"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "type": "expr",
                      "config": {
                        "expression": "{view.params.row4col3}"
                      }
                    }
                  }
                }
              }
            ]
          }
        ]
      },
      {
        "type": "ia.display.label",
        "version": 0,
        "meta": {
          "name": "Caption"
        },
        "props": {
          "text": "",
          "style": {
            "fontSize": "14px",
            "lineHeight": "20px",
            "color": "#a1a1a1",
            "padding": "12px 8px 8px 8px",
            "boxSizing": "border-box"
          }
        },
        "position": {
          "grow": 0,
          "shrink": 0,
          "basis": "auto"
        },
        "propConfig": {
          "props.text": {
            "binding": {
              "type": "expr",
              "config": {
                "expression": "{view.params.caption}"
              }
            }
          },
          "meta.visible": {
            "binding": {
              "type": "expr",
              "config": {
                "expression": "len(trim(toString(coalesce({view.params.caption}, \"\")))) > 0"
              }
            }
          }
        }
      }
    ]
  }
}


```

### com.inductiveautomation.perspective/views/Data/TablePattern/resource.json

```json

{
  "scope": "G",
  "version": 1,
  "restricted": false,
  "overridable": true,
  "files": [
    "view.json"
  ]
}

```

### com.inductiveautomation.perspective/style-classes/vc/table-pattern-root/style.json

```json

{
  "base": {
    "style": {
      "backgroundColor": "#171717",
      "color": "#fafafa",
      "borderColor": "rgba(255, 255, 255, 0.1)",
      "borderStyle": "solid",
      "borderWidth": "1px",
      "borderRadius": "8px",
      "overflow": "hidden",
      "boxSizing": "border-box"
    }
  }
}


```

### com.inductiveautomation.perspective/style-classes/vc/table-pattern-root/resource.json

```json

{
  "scope": "G",
  "version": 1,
  "restricted": false,
  "overridable": true,
  "files": [
    "style.json"
  ]
}

```

### com.inductiveautomation.perspective/style-classes/vc/table-pattern-header/style.json

```json

{
  "base": {
    "style": {
      "borderColor": "rgba(255, 255, 255, 0.1)",
      "borderStyle": "solid",
      "borderWidth": "0 0 1px 0",
      "boxSizing": "border-box"
    }
  }
}


```

### com.inductiveautomation.perspective/style-classes/vc/table-pattern-header/resource.json

```json

{
  "scope": "G",
  "version": 1,
  "restricted": false,
  "overridable": true,
  "files": [
    "style.json"
  ]
}

```

### com.inductiveautomation.perspective/style-classes/vc/table-pattern-cell/style.json

```json

{
  "base": {
    "style": {
      "fontSize": "14px",
      "lineHeight": "20px",
      "padding": "0 8px",
      "overflow": "hidden",
      "textOverflow": "ellipsis",
      "whiteSpace": "nowrap",
      "boxSizing": "border-box"
    }
  }
}


```

### com.inductiveautomation.perspective/style-classes/vc/table-pattern-cell/resource.json

```json

{
  "scope": "G",
  "version": 1,
  "restricted": false,
  "overridable": true,
  "files": [
    "style.json"
  ]
}

```

### com.inductiveautomation.perspective/style-classes/vc/table-pattern-row/style.json

```json

{
  "base": {
    "style": {
      "borderColor": "rgba(255, 255, 255, 0.1)",
      "borderStyle": "solid",
      "borderWidth": "0 0 1px 0",
      "boxSizing": "border-box"
    }
  }
}


```

### com.inductiveautomation.perspective/style-classes/vc/table-pattern-row/resource.json

```json

{
  "scope": "G",
  "version": 1,
  "restricted": false,
  "overridable": true,
  "files": [
    "style.json"
  ]
}

```

### stylesheet-snippet.css

```css


.psc-vc-r-table [class~="psc-vc/table-pattern-cell"] { flex-direction:row!important; align-items:center!important; justify-content:flex-start!important; text-align:left!important; }
.psc-vc-r-table [class~="psc-vc/table-pattern-cell"]:nth-child(2), .psc-vc-r-table [class~="psc-vc/table-pattern-cell"]:nth-child(4) { justify-content:flex-end!important; text-align:right!important; }
.psc-vc-r-table [class~="psc-vc/table-pattern-header"] { background:#141414!important; }
.psc-vc-r-table [class~="psc-vc/table-pattern-row"] { transition:background-color 120ms ease; }
.psc-vc-r-table [class~="psc-vc/table-pattern-row"]:hover { background:#202020!important; }

```