attach themes to table story
This commit is contained in:
@@ -1,9 +1,10 @@
|
||||
// import React from 'react';
|
||||
import { storiesOf } from '@storybook/react';
|
||||
import { Table } from './Table';
|
||||
import { getTheme } from '../../themes';
|
||||
|
||||
import { migratedTestTable, migratedTestStyles, simpleTable } from './examples';
|
||||
import { ScopedVars, TableData } from '../../types/index';
|
||||
import { ScopedVars, TableData, GrafanaThemeType } from '../../types/index';
|
||||
import { withFullSizeStory } from '../../utils/storybook/withFullSizeStory';
|
||||
import { number, boolean } from '@storybook/addon-knobs';
|
||||
|
||||
@@ -48,10 +49,11 @@ storiesOf('Alpha/Table', module)
|
||||
fixedRowCount,
|
||||
fixedColumnCount,
|
||||
showHeader,
|
||||
theme: getTheme(GrafanaThemeType.Light),
|
||||
});
|
||||
})
|
||||
.add('variable size', () => {
|
||||
const columnCount = number('Column Count', 10, { min: 2, max: 50, step: 1, range: false });
|
||||
const columnCount = number('Column Count', 20, { min: 2, max: 50, step: 1, range: false });
|
||||
const rowCount = number('Row Count', 20, { min: 0, max: 100, step: 1, range: false });
|
||||
|
||||
const showHeader = boolean('Show Header', true);
|
||||
@@ -65,6 +67,7 @@ storiesOf('Alpha/Table', module)
|
||||
fixedRowCount,
|
||||
fixedColumnCount,
|
||||
showHeader,
|
||||
theme: getTheme(GrafanaThemeType.Light),
|
||||
});
|
||||
})
|
||||
.add('Old tests configuration', () => {
|
||||
@@ -73,5 +76,6 @@ storiesOf('Alpha/Table', module)
|
||||
data: migratedTestTable,
|
||||
replaceVariables,
|
||||
showHeader: true,
|
||||
theme: getTheme(GrafanaThemeType.Light),
|
||||
});
|
||||
});
|
||||
|
||||
@@ -72,6 +72,8 @@ export class Table extends Component<Props, State> {
|
||||
const dataChanged = data !== prevProps.data;
|
||||
const configsChanged = showHeader !== prevProps.showHeader;
|
||||
|
||||
console.log('TABLE', this.props.theme);
|
||||
|
||||
// Reset the size cache
|
||||
if (dataChanged || configsChanged) {
|
||||
this.measurer.clearAll();
|
||||
|
||||
@@ -86,8 +86,6 @@ export function getCellBuilder(schema: Column, style: ColumnStyle | null, props:
|
||||
}
|
||||
|
||||
if (style.type === 'date') {
|
||||
console.log('MAKE DATE Column', schema, style);
|
||||
|
||||
return new CellBuilderWithStyle(
|
||||
(v: any) => {
|
||||
if (v === undefined || v === null) {
|
||||
@@ -160,6 +158,7 @@ class CellBuilderWithStyle {
|
||||
private fmt?: ValueFormatter
|
||||
) {
|
||||
//
|
||||
console.log('COLUMN', column.text, theme);
|
||||
}
|
||||
|
||||
getColorForValue = (value: any): string | null => {
|
||||
|
||||
@@ -1,13 +0,0 @@
|
||||
export function stringToJsRegex(str: string): RegExp {
|
||||
if (str[0] !== '/') {
|
||||
return new RegExp('^' + str + '$');
|
||||
}
|
||||
|
||||
const match = str.match(new RegExp('^/(.*?)/(g?i?m?y?)$'));
|
||||
|
||||
if (!match) {
|
||||
throw new Error(`'${str}' is not a valid regular expression.`);
|
||||
}
|
||||
|
||||
return new RegExp(match[1], match[2]);
|
||||
}
|
||||
Reference in New Issue
Block a user