attach themes to table story

This commit is contained in:
ryan
2019-03-10 15:34:02 -07:00
parent 0a094c1226
commit b80c773ebe
4 changed files with 9 additions and 17 deletions
@@ -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]);
}