2 lines
7.8 KiB
JavaScript
2 lines
7.8 KiB
JavaScript
import{_ as d,a as o,b as l,ag as r,p as t,g as a}from"./chunks/framework.BcrMLAmg.js";const f=JSON.parse('{"title":"Table","description":"","frontmatter":{},"headers":[],"relativePath":"references/elements/Table.md","filePath":"references/elements/Table.md","lastUpdated":1757844696000}'),n={name:"references/elements/Table.md"};function s(i,e,c,u,h,b){return l(),o("div",null,e[0]||(e[0]=[r('<h1 id="table" tabindex="-1">Table <a class="header-anchor" href="#table" aria-label="Permalink to "Table""></a></h1><p><em>This is the table class. It provides a sortable data grid with customizable columns,</em><em>row selection, and scrolling capabilities.</em></p><p>Extends: <code>VisualElement</code></p><h2 id="properties" tabindex="-1">Properties <a class="header-anchor" href="#properties" aria-label="Permalink to "Properties""></a></h2><table tabindex="0"><thead><tr><th>Property</th><th>Type</th><th>Default</th><th>Description</th></tr></thead><tbody><tr><td>columns</td><td>table</td><td>{}</td><td>List of column definitions with {name, width} properties</td></tr><tr><td>data</td><td>table</td><td>{}</td><td>The table data as array of row arrays</td></tr><tr><td>headerColor</td><td>color</td><td>blue</td><td>Color of the column headers</td></tr><tr><td>selectedColor</td><td>color</td><td>lightBlue</td><td>Background color of selected row</td></tr><tr><td>gridColor</td><td>color</td><td>gray</td><td>Color of grid lines</td></tr><tr><td>sortDirection</td><td>string</td><td>"asc"</td><td>Sort direction ("asc" or "desc")</td></tr><tr><td>scrollOffset</td><td>number</td><td>0</td><td>Current scroll position</td></tr><tr><td>customSortFunction</td><td>table</td><td>{}</td><td>Custom sort functions for columns</td></tr></tbody></table><h2 id="functions" tabindex="-1">Functions <a class="header-anchor" href="#functions" aria-label="Permalink to "Functions""></a></h2><table tabindex="0"><thead><tr><th>Method</th><th>Returns</th><th>Description</th></tr></thead><tbody><tr><td><a href="#table-addcolumn-name-width">Table:addColumn</a></td><td>Table</td><td>Adds a new column to the table</td></tr><tr><td><a href="#table-adddata-any">Table:addData</a></td><td>Table</td><td>Adds a new row of data to the table</td></tr><tr><td><a href="#table-setcolumnsortfunction-columnindex-sortfn">Table:setColumnSortFunction</a></td><td>Table</td><td>Sets a custom sort function for a column</td></tr><tr><td><a href="#table-setformatteddata-displaydata-sortdata">Table:setFormattedData</a></td><td>Table</td><td>Adds formatted data with raw sort values</td></tr><tr><td><a href="#table-setdata-rawdata-formatters">Table:setData</a></td><td>Table</td><td>Sets table data with optional column formatters</td></tr><tr><td><a href="#table-sortdata-columnindex-fn">Table:sortData</a></td><td>Table</td><td>Sorts the table data by the specified column</td></tr></tbody></table><h2 id="table-addcolumn-name-width" tabindex="-1">Table:addColumn(name, width) <a class="header-anchor" href="#table-addcolumn-name-width" aria-label="Permalink to "Table:addColumn(name, width)""></a></h2><p>Adds a new column to the table</p><h3 id="parameters" tabindex="-1">Parameters <a class="header-anchor" href="#parameters" aria-label="Permalink to "Parameters""></a></h3><ul><li><code>name</code> <code>string</code> The name of the column</li><li><code>width</code> <code>number</code> The width of the column</li></ul><h3 id="returns" tabindex="-1">Returns <a class="header-anchor" href="#returns" aria-label="Permalink to "Returns""></a></h3><ul><li><code>Table</code> <code>self</code> The Table instance</li></ul><h2 id="table-adddata-any" tabindex="-1">Table:addData(any) <a class="header-anchor" href="#table-adddata-any" aria-label="Permalink to "Table:addData(any)""></a></h2><p>Adds a new row of data to the table</p><h3 id="parameters-1" tabindex="-1">Parameters <a class="header-anchor" href="#parameters-1" aria-label="Permalink to "Parameters""></a></h3><ul><li><code>any</code> <code>The</code> data for the new row</li></ul><h3 id="returns-1" tabindex="-1">Returns <a class="header-anchor" href="#returns-1" aria-label="Permalink to "Returns""></a></h3><ul><li><code>Table</code> <code>self</code> The Table instance</li></ul><h2 id="table-setcolumnsortfunction-columnindex-sortfn" tabindex="-1">Table:setColumnSortFunction(columnIndex, sortFn) <a class="header-anchor" href="#table-setcolumnsortfunction-columnindex-sortfn" aria-label="Permalink to "Table:setColumnSortFunction(columnIndex, sortFn)""></a></h2><p>Sets a custom sort function for a specific column</p><h3 id="parameters-2" tabindex="-1">Parameters <a class="header-anchor" href="#parameters-2" aria-label="Permalink to "Parameters""></a></h3><ul><li><code>columnIndex</code> <code>number</code> The index of the column</li><li><code>sortFn</code> <code>function</code> Function that takes (rowA, rowB) and returns comparison result</li></ul><h3 id="returns-2" tabindex="-1">Returns <a class="header-anchor" href="#returns-2" aria-label="Permalink to "Returns""></a></h3><ul><li><code>Table</code> <code>self</code> The Table instance</li></ul><h2 id="table-setformatteddata-displaydata-sortdata" tabindex="-1">Table:setFormattedData(displayData, sortData) <a class="header-anchor" href="#table-setformatteddata-displaydata-sortdata" aria-label="Permalink to "Table:setFormattedData(displayData, sortData)""></a></h2><p>Adds data with both display and sort values</p><h3 id="parameters-3" tabindex="-1">Parameters <a class="header-anchor" href="#parameters-3" aria-label="Permalink to "Parameters""></a></h3><ul><li><code>displayData</code> <code>table</code> The formatted data for display</li><li><code>sortData</code> <code>table</code> The raw data for sorting (optional)</li></ul><h3 id="returns-3" tabindex="-1">Returns <a class="header-anchor" href="#returns-3" aria-label="Permalink to "Returns""></a></h3><ul><li><code>Table</code> <code>self</code> The Table instance</li></ul><h2 id="table-setdata-rawdata-formatters" tabindex="-1">Table:setData(rawData, formatters) <a class="header-anchor" href="#table-setdata-rawdata-formatters" aria-label="Permalink to "Table:setData(rawData, formatters)""></a></h2><p>Set data with automatic formatting</p><h3 id="parameters-4" tabindex="-1">Parameters <a class="header-anchor" href="#parameters-4" aria-label="Permalink to "Parameters""></a></h3>',34),t("ul",null,[t("li",null,[t("code",null,"rawData"),a(),t("code",null,"table"),a(" The raw data array")]),t("li",{"[2]":""},[t("code",null,"formatters"),a(),t("code",null,"table"),a(" Optional formatter functions for columns")])],-1),r('<h3 id="returns-4" tabindex="-1">Returns <a class="header-anchor" href="#returns-4" aria-label="Permalink to "Returns""></a></h3><ul><li><code>Table</code> <code>self</code> The Table instance</li></ul><h2 id="table-sortdata-columnindex-fn" tabindex="-1">Table:sortData(columnIndex, fn) <a class="header-anchor" href="#table-sortdata-columnindex-fn" aria-label="Permalink to "Table:sortData(columnIndex, fn)""></a></h2><p>Sorts the table data by column</p><h3 id="parameters-5" tabindex="-1">Parameters <a class="header-anchor" href="#parameters-5" aria-label="Permalink to "Parameters""></a></h3><ul><li><code>columnIndex</code> <code>number</code> The index of the column to sort by</li><li><code>fn</code> <code>function</code> ? Optional custom sorting function</li></ul><h3 id="returns-5" tabindex="-1">Returns <a class="header-anchor" href="#returns-5" aria-label="Permalink to "Returns""></a></h3><ul><li><code>Table</code> <code>self</code> The Table instance</li></ul>',8)]))}const T=d(n,[["render",s]]);export{f as __pageData,T as default};
|