Remove with Text
Remove GetEngineeringSpcReview Better error message EnforceCodeStyleInBuild NginxFileSystem Remove Reactors and Working Directory AppSettings Delete self contained Thunder Tests Back to .net8.0 api/v4/InfinityQS ApiExplorerSettings Wafer Counter
This commit is contained in:
2
Server/wwwroot/package/dist/collection/components/table-basic-version/interfaces.js
vendored
Normal file
2
Server/wwwroot/package/dist/collection/components/table-basic-version/interfaces.js
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
export const ButtonKeys = ['disabled', 'variant', 'size', 'target', 'color', 'text'];
|
||||
//# sourceMappingURL=interfaces.js.map
|
1
Server/wwwroot/package/dist/collection/components/table-basic-version/interfaces.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/table-basic-version/interfaces.js.map
vendored
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/components/table-basic-version/interfaces.ts"],"names":[],"mappings":"AASA,MAAM,CAAC,MAAM,UAAU,GAAiC,CAAC,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC","sourcesContent":["export interface ButtonInterface {\n disabled?: boolean;\n variant?: string,\n size?: string,\n target?: string,\n color?: string,\n text: string\n}\n\nexport const ButtonKeys: Array<keyof ButtonInterface> = ['disabled', 'variant', 'size', 'target', 'color', 'text'];\n\n\n"]}
|
8086
Server/wwwroot/package/dist/collection/components/table-basic-version/table.css
vendored
Normal file
8086
Server/wwwroot/package/dist/collection/components/table-basic-version/table.css
vendored
Normal file
File diff suppressed because one or more lines are too long
29
Server/wwwroot/package/dist/collection/components/table-basic-version/table.e2e.js
vendored
Normal file
29
Server/wwwroot/package/dist/collection/components/table-basic-version/table.e2e.js
vendored
Normal file
@ -0,0 +1,29 @@
|
||||
import { newE2EPage } from "@stencil/core/testing";
|
||||
describe('ifx-basic-table', () => {
|
||||
it('renders the table', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-basic-table></ifx-basic-table>');
|
||||
const element = await page.find('ifx-basic-table');
|
||||
expect(element).toHaveClass('hydrated');
|
||||
});
|
||||
it('renders with correct height when set to auto', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-basic-table table-height="auto"></ifx-basic-table>');
|
||||
const wrapperElement = await page.find('ifx-basic-table');
|
||||
const autoHeight = await wrapperElement.getProperty('tableHeight');
|
||||
expect(autoHeight).toBe('auto');
|
||||
});
|
||||
// Example for checking parsed columns and rows
|
||||
it('parses cols and rows correctly', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-basic-table cols=\'[...]\' rows=\'[...]\'>'); // Replace [...] with your mock data
|
||||
const component = await page.find('ifx-basic-table');
|
||||
const columnDefs = await component.getProperty('columnDefs');
|
||||
const rowData = await component.getProperty('rowData');
|
||||
expect(columnDefs).toBeDefined();
|
||||
expect(rowData).toBeDefined();
|
||||
expect(Array.isArray(columnDefs)).toBeTruthy();
|
||||
expect(Array.isArray(rowData)).toBeTruthy();
|
||||
});
|
||||
});
|
||||
//# sourceMappingURL=table.e2e.js.map
|
1
Server/wwwroot/package/dist/collection/components/table-basic-version/table.e2e.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/table-basic-version/table.e2e.js.map
vendored
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"file":"table.e2e.js","sourceRoot":"","sources":["../../../src/components/table-basic-version/table.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,iBAAiB,EAAE,GAAG,EAAE;EAE/B,EAAE,CAAC,mBAAmB,EAAE,KAAK,IAAI,EAAE;IACjC,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC,qCAAqC,CAAC,CAAC;IAE7D,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IACnD,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;EAC1C,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;IAC5D,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC,yDAAyD,CAAC,CAAC;IAEjF,MAAM,cAAc,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IAE1D,MAAM,UAAU,GAAG,MAAM,cAAc,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;IACnE,MAAM,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;EAClC,CAAC,CAAC,CAAC;EAIH,+CAA+C;EAC/C,EAAE,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;IAC9C,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC,iDAAiD,CAAC,CAAC,CAAC,oCAAoC;IAE9G,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IACrD,MAAM,UAAU,GAAG,MAAM,SAAS,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;IAC7D,MAAM,OAAO,GAAG,MAAM,SAAS,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;IAEvD,MAAM,CAAC,UAAU,CAAC,CAAC,WAAW,EAAE,CAAC;IACjC,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,CAAC;IAC9B,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;IAC/C,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;EAC9C,CAAC,CAAC,CAAC;AAEL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from '@stencil/core/testing';\n\ndescribe('ifx-basic-table', () => {\n\n it('renders the table', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-basic-table></ifx-basic-table>');\n\n const element = await page.find('ifx-basic-table');\n expect(element).toHaveClass('hydrated');\n });\n\n it('renders with correct height when set to auto', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-basic-table table-height=\"auto\"></ifx-basic-table>');\n\n const wrapperElement = await page.find('ifx-basic-table');\n\n const autoHeight = await wrapperElement.getProperty('tableHeight');\n expect(autoHeight).toBe('auto');\n });\n\n\n\n // Example for checking parsed columns and rows\n it('parses cols and rows correctly', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-basic-table cols=\\'[...]\\' rows=\\'[...]\\'>'); // Replace [...] with your mock data\n\n const component = await page.find('ifx-basic-table');\n const columnDefs = await component.getProperty('columnDefs');\n const rowData = await component.getProperty('rowData');\n\n expect(columnDefs).toBeDefined();\n expect(rowData).toBeDefined();\n expect(Array.isArray(columnDefs)).toBeTruthy();\n expect(Array.isArray(rowData)).toBeTruthy();\n });\n\n});\n"]}
|
216
Server/wwwroot/package/dist/collection/components/table-basic-version/table.js
vendored
Normal file
216
Server/wwwroot/package/dist/collection/components/table-basic-version/table.js
vendored
Normal file
@ -0,0 +1,216 @@
|
||||
import { h } from "@stencil/core";
|
||||
import { Grid } from "ag-grid-community";
|
||||
export class Table {
|
||||
constructor() {
|
||||
this.gridOptions = undefined;
|
||||
this.cols = undefined;
|
||||
this.rows = undefined;
|
||||
this.columnDefs = [];
|
||||
this.rowData = [];
|
||||
this.rowHeight = 'default';
|
||||
this.uniqueKey = undefined;
|
||||
this.tableHeight = 'auto';
|
||||
}
|
||||
componentWillLoad() {
|
||||
this.uniqueKey = `unique-${Math.floor(Math.random() * 1000000)}`;
|
||||
if (typeof this.rows === 'string' && typeof this.cols === 'string') {
|
||||
try {
|
||||
this.columnDefs = JSON.parse(this.cols);
|
||||
this.rowData = JSON.parse(this.rows);
|
||||
}
|
||||
catch (err) {
|
||||
console.error('Failed to parse input:', err);
|
||||
}
|
||||
}
|
||||
else if ((Array.isArray(this.rows) || typeof this.rows === 'object') && (Array.isArray(this.cols) || typeof this.cols === 'object')) {
|
||||
this.columnDefs = this.cols;
|
||||
this.rowData = this.rows;
|
||||
}
|
||||
else {
|
||||
console.error('Unexpected value for cols and rows:', this.rows, this.cols);
|
||||
}
|
||||
this.gridOptions = {
|
||||
rowHeight: this.rowHeight === 'default' ? 40 : 32,
|
||||
headerHeight: 40,
|
||||
defaultColDef: {
|
||||
resizable: true,
|
||||
},
|
||||
suppressCellFocus: true,
|
||||
suppressDragLeaveHidesColumns: true,
|
||||
suppressRowHoverHighlight: true,
|
||||
onFirstDataRendered: this.onFirstDataRendered,
|
||||
columnDefs: this.columnDefs,
|
||||
rowData: this.rowData,
|
||||
icons: {
|
||||
sortAscending: '<ifx-icon icon="arrowtriangleup16"></ifx-icon>',
|
||||
sortDescending: '<ifx-icon icon="arrowtriangledown16"></ifx-icon>',
|
||||
sortUnSort: '<a class="unsort-icon-custom-color"><ifx-icon icon="arrowtrianglevertikal16"></ifx-icon></a>'
|
||||
},
|
||||
rowDragManaged: this.columnDefs.some(col => col.dndSource === true) ? true : false,
|
||||
animateRows: this.columnDefs.some(col => col.dndSource === true) ? true : false,
|
||||
};
|
||||
// console.log("grid options ", this.gridOptions);
|
||||
}
|
||||
onFirstDataRendered(params) {
|
||||
params.api.sizeColumnsToFit();
|
||||
}
|
||||
componentWillUpdate() {
|
||||
this.gridOptions.columnDefs = this.columnDefs;
|
||||
this.gridOptions.rowData = this.rowData;
|
||||
if (this.gridOptions.api) {
|
||||
this.gridOptions.api.setRowData(this.rowData);
|
||||
this.gridOptions.api.setColumnDefs(this.columnDefs);
|
||||
}
|
||||
}
|
||||
componentDidLoad() {
|
||||
new Grid(document.getElementById(`ifxTable-${this.uniqueKey}`), this.gridOptions);
|
||||
if (this.gridOptions.api) {
|
||||
this.gridOptions.api.sizeColumnsToFit();
|
||||
}
|
||||
}
|
||||
render() {
|
||||
return (h("div", { id: "grid-wrapper", class: { 'auto-height': this.tableHeight === 'auto' ? true : false } }, h("div", { id: `ifxTable-${this.uniqueKey}`, class: "ifx-ag-grid ag-theme-alpine", style: {
|
||||
'height': `${this.tableHeight}`, width: '100%'
|
||||
} })));
|
||||
}
|
||||
static get is() { return "ifx-basic-table"; }
|
||||
static get originalStyleUrls() {
|
||||
return {
|
||||
"$": ["table.scss"]
|
||||
};
|
||||
}
|
||||
static get styleUrls() {
|
||||
return {
|
||||
"$": ["table.css"]
|
||||
};
|
||||
}
|
||||
static get properties() {
|
||||
return {
|
||||
"cols": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "any[] | string",
|
||||
"resolved": "any[] | string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "cols",
|
||||
"reflect": false
|
||||
},
|
||||
"rows": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "any[] | string",
|
||||
"resolved": "any[] | string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "rows",
|
||||
"reflect": false
|
||||
},
|
||||
"columnDefs": {
|
||||
"type": "unknown",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "any[]",
|
||||
"resolved": "any[]",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"defaultValue": "[]"
|
||||
},
|
||||
"rowData": {
|
||||
"type": "unknown",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "any[]",
|
||||
"resolved": "any[]",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"defaultValue": "[]"
|
||||
},
|
||||
"rowHeight": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "row-height",
|
||||
"reflect": false,
|
||||
"defaultValue": "'default'"
|
||||
},
|
||||
"uniqueKey": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "unique-key",
|
||||
"reflect": false
|
||||
},
|
||||
"tableHeight": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "table-height",
|
||||
"reflect": false,
|
||||
"defaultValue": "'auto'"
|
||||
}
|
||||
};
|
||||
}
|
||||
static get states() {
|
||||
return {
|
||||
"gridOptions": {}
|
||||
};
|
||||
}
|
||||
}
|
||||
//# sourceMappingURL=table.js.map
|
1
Server/wwwroot/package/dist/collection/components/table-basic-version/table.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/table-basic-version/table.js.map
vendored
Normal file
File diff suppressed because one or more lines are too long
70
Server/wwwroot/package/dist/collection/components/table-basic-version/table.stories.js
vendored
Normal file
70
Server/wwwroot/package/dist/collection/components/table-basic-version/table.stories.js
vendored
Normal file
@ -0,0 +1,70 @@
|
||||
//default
|
||||
const columnDefs = [
|
||||
{ headerName: 'Make', field: 'make', sortable: true, sort: 'desc', unSortIcon: true },
|
||||
{ headerName: 'Model', field: 'model', sortable: true, unSortIcon: true },
|
||||
{ headerName: 'Price', field: 'price' },
|
||||
{ headerName: 'Age', field: 'age' }
|
||||
];
|
||||
const rowData = [
|
||||
{ make: 'Toyota', model: 'Celica', price: 35000, age: 10 },
|
||||
{ make: 'Ford', model: 'Mondeo', price: 32000, age: 12 },
|
||||
{ make: 'Porsche', model: 'Boxster', price: 72000 }
|
||||
];
|
||||
export default {
|
||||
title: 'Components/Table (basic)',
|
||||
// tags: ['autodocs'],
|
||||
args: {
|
||||
tableHeight: 'auto',
|
||||
rowHeight: 40,
|
||||
},
|
||||
argTypes: {
|
||||
tableHeight: {
|
||||
table: {
|
||||
type: {
|
||||
summary: 'Options',
|
||||
detail: 'Default: "auto"\nExample for fixed height: "400px"',
|
||||
}
|
||||
},
|
||||
},
|
||||
rowHeight: {
|
||||
options: ['compact', 'default'],
|
||||
control: { type: 'radio' },
|
||||
},
|
||||
columnDefs: {
|
||||
table: {
|
||||
type: {
|
||||
summary: 'Column header options',
|
||||
detail: 'Standard columns:\nheaderName: "Model", \nfield: "model", \nsortable: true (optional),\nsort: "desc" (optional) => descending sort (show icon)\nunSortIcon: true (optional) => unsorted (show icon)\n\nSpecial columns:\nheaderName: "",\nfield: "button"\nheaderName: "",\nfield: "link"',
|
||||
},
|
||||
},
|
||||
},
|
||||
rowData: {
|
||||
table: {
|
||||
type: {
|
||||
summary: 'Row data options',
|
||||
detail: 'Standard row values:\nmake: "Toyota", \nmodel: "Celica", \nprice: 35000 \n\nSpecial row values (incl buttons):\nmake: "Porsche",\nmodel: "Boxster",\nprice: "72000",\nbutton: { \ndisabled: false (optional),\nvariant: "outline" (optional)\nsize: "s" (optional),\ntext: "Button"\n...other ifx-button properties\n}',
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
};
|
||||
const DefaultTemplate = (args) => `<ifx-basic-table
|
||||
row-height='${args.rowHeight}'
|
||||
cols='${JSON.stringify(args.columnDefs)}'
|
||||
rows='${JSON.stringify(args.rowData)}'
|
||||
table-height='${args.tableHeight}'>
|
||||
</ifx-basic-table>`;
|
||||
export const Default = DefaultTemplate.bind({});
|
||||
Default.args = {
|
||||
rowHeight: 'default',
|
||||
columnDefs: columnDefs,
|
||||
rowData: rowData,
|
||||
};
|
||||
export const FixedHeight = DefaultTemplate.bind({});
|
||||
FixedHeight.args = {
|
||||
tableHeight: '400px',
|
||||
rowHeight: 'default',
|
||||
columnDefs: columnDefs,
|
||||
rowData: rowData,
|
||||
};
|
||||
//# sourceMappingURL=table.stories.js.map
|
1
Server/wwwroot/package/dist/collection/components/table-basic-version/table.stories.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/table-basic-version/table.stories.js.map
vendored
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"file":"table.stories.js","sourceRoot":"","sources":["../../../src/components/table-basic-version/table.stories.ts"],"names":[],"mappings":"AAAA,SAAS;AACT,MAAM,UAAU,GAAG;EACjB,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE;EACrF,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE;EACzE,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;EACvC,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE;CACpC,CAAC;AACF,MAAM,OAAO,GAAG;EACd,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,EAAE;EAC1D,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,EAAE;EACxD,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE;CACpD,CAAC;AAGF,eAAe;EACb,KAAK,EAAE,0BAA0B;EACjC,sBAAsB;EACtB,IAAI,EAAE;IACJ,WAAW,EAAE,MAAM;IACnB,SAAS,EAAE,EAAE;GACd;EACD,QAAQ,EAAE;IACR,WAAW,EAAE;MACX,KAAK,EAAE;QACL,IAAI,EAAE;UACJ,OAAO,EAAE,SAAS;UAClB,MAAM,EAAE,oDAAoD;SAC7D;OACF;KACF;IACD,SAAS,EAAE;MACT,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;MAC/B,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;KAC3B;IACD,UAAU,EAAE;MACV,KAAK,EAAE;QACL,IAAI,EAAE;UACJ,OAAO,EAAE,uBAAuB;UAChC,MAAM,EAAE,2RAA2R;SACpS;OACF;KACF;IACD,OAAO,EAAE;MACP,KAAK,EAAE;QACL,IAAI,EAAE;UACJ,OAAO,EAAE,kBAAkB;UAC3B,MAAM,EAAE,wTAAwT;SACjU;OACF;KACF;GACF;CACF,CAAC;AAGF,MAAM,eAAe,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC;cACpB,IAAI,CAAC,SAAS;QACpB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC;QAC/B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC;gBACpB,IAAI,CAAC,WAAW;mBACb,CAAC;AAEpB,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,OAAO,CAAC,IAAI,GAAG;EACb,SAAS,EAAE,SAAS;EACpB,UAAU,EAAE,UAAU;EACtB,OAAO,EAAE,OAAO;CACjB,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACpD,WAAW,CAAC,IAAI,GAAG;EACjB,WAAW,EAAE,OAAO;EACpB,SAAS,EAAE,SAAS;EACpB,UAAU,EAAE,UAAU;EACtB,OAAO,EAAE,OAAO;CACjB,CAAC","sourcesContent":["//default\nconst columnDefs = [\n { headerName: 'Make', field: 'make', sortable: true, sort: 'desc', unSortIcon: true },\n { headerName: 'Model', field: 'model', sortable: true, unSortIcon: true },\n { headerName: 'Price', field: 'price' },\n { headerName: 'Age', field: 'age' }\n];\nconst rowData = [\n { make: 'Toyota', model: 'Celica', price: 35000, age: 10 },\n { make: 'Ford', model: 'Mondeo', price: 32000, age: 12 },\n { make: 'Porsche', model: 'Boxster', price: 72000 }\n];\n\n\nexport default {\n title: 'Components/Table (basic)',\n // tags: ['autodocs'],\n args: {\n tableHeight: 'auto',\n rowHeight: 40,\n },\n argTypes: {\n tableHeight: {\n table: {\n type: {\n summary: 'Options',\n detail: 'Default: \"auto\"\\nExample for fixed height: \"400px\"',\n }\n },\n },\n rowHeight: {\n options: ['compact', 'default'],\n control: { type: 'radio' },\n },\n columnDefs: {\n table: {\n type: {\n summary: 'Column header options',\n detail: 'Standard columns:\\nheaderName: \"Model\", \\nfield: \"model\", \\nsortable: true (optional),\\nsort: \"desc\" (optional) => descending sort (show icon)\\nunSortIcon: true (optional) => unsorted (show icon)\\n\\nSpecial columns:\\nheaderName: \"\",\\nfield: \"button\"\\nheaderName: \"\",\\nfield: \"link\"',\n },\n },\n },\n rowData: {\n table: {\n type: {\n summary: 'Row data options',\n detail: 'Standard row values:\\nmake: \"Toyota\", \\nmodel: \"Celica\", \\nprice: 35000 \\n\\nSpecial row values (incl buttons):\\nmake: \"Porsche\",\\nmodel: \"Boxster\",\\nprice: \"72000\",\\nbutton: { \\ndisabled: false (optional),\\nvariant: \"outline\" (optional)\\nsize: \"s\" (optional),\\ntext: \"Button\"\\n...other ifx-button properties\\n}',\n },\n },\n }\n }\n};\n\n\nconst DefaultTemplate = (args) => `<ifx-basic-table \nrow-height='${args.rowHeight}'\ncols='${JSON.stringify(args.columnDefs)}' \nrows='${JSON.stringify(args.rowData)}'\ntable-height='${args.tableHeight}'>\n</ifx-basic-table>`;\n\nexport const Default = DefaultTemplate.bind({});\nDefault.args = {\n rowHeight: 'default',\n columnDefs: columnDefs,\n rowData: rowData,\n};\n\nexport const FixedHeight = DefaultTemplate.bind({});\nFixedHeight.args = {\n tableHeight: '400px',\n rowHeight: 'default',\n columnDefs: columnDefs,\n rowData: rowData,\n};\n\n\n"]}
|
Reference in New Issue
Block a user