diff --git a/package-lock.json b/package-lock.json index 471e0bba..0322ef4e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "griddle-react", - "version": "1.13.1", + "version": "1.14.0", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -7192,8 +7192,7 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "aproba": { "version": "1.2.0", @@ -7214,14 +7213,12 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, - "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -7236,20 +7233,17 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "core-util-is": { "version": "1.0.2", @@ -7366,8 +7360,7 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "ini": { "version": "1.3.5", @@ -7379,7 +7372,6 @@ "version": "1.0.0", "bundled": true, "dev": true, - "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -7394,7 +7386,6 @@ "version": "3.0.4", "bundled": true, "dev": true, - "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -7402,14 +7393,12 @@ "minimist": { "version": "0.0.8", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "minipass": { "version": "2.3.5", "bundled": true, "dev": true, - "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -7428,7 +7417,6 @@ "version": "0.5.1", "bundled": true, "dev": true, - "optional": true, "requires": { "minimist": "0.0.8" } @@ -7509,8 +7497,7 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "object-assign": { "version": "4.1.1", @@ -7522,7 +7509,6 @@ "version": "1.4.0", "bundled": true, "dev": true, - "optional": true, "requires": { "wrappy": "1" } @@ -7608,8 +7594,7 @@ "safe-buffer": { "version": "5.1.2", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "safer-buffer": { "version": "2.1.2", @@ -7645,7 +7630,6 @@ "version": "1.0.2", "bundled": true, "dev": true, - "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -7665,7 +7649,6 @@ "version": "3.0.1", "bundled": true, "dev": true, - "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -7709,14 +7692,12 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "yallist": { "version": "3.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true } } }, @@ -10017,7 +9998,8 @@ "lodash": { "version": "4.17.11", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.11.tgz", - "integrity": "sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg==" + "integrity": "sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg==", + "dev": true }, "lodash-es": { "version": "4.17.11", @@ -10034,6 +10016,11 @@ "lodash": "^4.17.4" } }, + "lodash.assignin": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz", + "integrity": "sha1-uo31+4QesKPoBEIysOJjqNxqKKI=" + }, "lodash.clone": { "version": "4.5.0", "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz", @@ -10052,6 +10039,11 @@ "integrity": "sha1-buMFc6A6GmDWcKYu8zwQzxr9vdQ=", "dev": true }, + "lodash.compact": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/lodash.compact/-/lodash.compact-3.0.1.tgz", + "integrity": "sha1-VAzjg3dFl1gHRx4WtKK6IeclbKU=" + }, "lodash.debounce": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", @@ -10073,14 +10065,27 @@ "lodash.flatten": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz", - "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8=", - "dev": true + "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8=" }, "lodash.flattendeep": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz", - "integrity": "sha1-+wMJF/hqMTTlvJvsDWngAT3f7bI=", - "dev": true + "integrity": "sha1-+wMJF/hqMTTlvJvsDWngAT3f7bI=" + }, + "lodash.flow": { + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/lodash.flow/-/lodash.flow-3.5.0.tgz", + "integrity": "sha1-h79AKSuM+D5OjOGjrkIJ4gBxZ1o=" + }, + "lodash.flowright": { + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/lodash.flowright/-/lodash.flowright-3.5.0.tgz", + "integrity": "sha1-K1//OZcW1+fcVyT+k0n2cGUYTWc=" + }, + "lodash.forin": { + "version": "4.4.0", + "resolved": "https://registry.npmjs.org/lodash.forin/-/lodash.forin-4.4.0.tgz", + "integrity": "sha1-XT8grlZAEfvog4H32YlJyclRlzE=" }, "lodash.get": { "version": "4.4.2", @@ -10091,8 +10096,12 @@ "lodash.isequal": { "version": "4.5.0", "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz", - "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA=", - "dev": true + "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA=" + }, + "lodash.isfinite": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/lodash.isfinite/-/lodash.isfinite-3.3.2.tgz", + "integrity": "sha1-+4m2WpqAKBgz8LdHizpRBPiY67M=" }, "lodash.islength": { "version": "4.0.1", @@ -10106,11 +10115,30 @@ "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=", "dev": true }, + "lodash.isstring": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz", + "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=" + }, "lodash.merge": { "version": "4.6.1", "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.1.tgz", - "integrity": "sha512-AOYza4+Hf5z1/0Hztxpm2/xiPZgi/cjMqdnKTUWTBSKchJlxXXuUSxCCl8rJlf4g6yww/j6mA8nC8Hw/EZWxKQ==", - "dev": true + "integrity": "sha512-AOYza4+Hf5z1/0Hztxpm2/xiPZgi/cjMqdnKTUWTBSKchJlxXXuUSxCCl8rJlf4g6yww/j6mA8nC8Hw/EZWxKQ==" + }, + "lodash.pick": { + "version": "4.4.0", + "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz", + "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM=" + }, + "lodash.pickby": { + "version": "4.6.0", + "resolved": "https://registry.npmjs.org/lodash.pickby/-/lodash.pickby-4.6.0.tgz", + "integrity": "sha1-feoh2MGNdwOifHBMFdO4SmfjOv8=" + }, + "lodash.range": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/lodash.range/-/lodash.range-3.2.0.tgz", + "integrity": "sha1-9GHliPZmg/fq3q3lE+OKaaVloV0=" }, "lodash.some": { "version": "4.6.0", @@ -10124,6 +10152,16 @@ "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=", "dev": true }, + "lodash.union": { + "version": "4.6.0", + "resolved": "https://registry.npmjs.org/lodash.union/-/lodash.union-4.6.0.tgz", + "integrity": "sha1-SLtQiECfFvGCFmZkHETdGqrjzYg=" + }, + "lodash.uniq": { + "version": "4.5.0", + "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz", + "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=" + }, "log-symbols": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-2.2.0.tgz", @@ -12581,17 +12619,36 @@ } }, "react-redux": { - "version": "5.1.1", - "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-5.1.1.tgz", - "integrity": "sha512-LE7Ned+cv5qe7tMV5BPYkGQ5Lpg8gzgItK07c67yHvJ8t0iaD9kPFPAli/mYkiyJYrs2pJgExR2ZgsGqlrOApg==", + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.1.0.tgz", + "integrity": "sha512-hyu/PoFK3vZgdLTg9ozbt7WF3GgX5+Yn3pZm5/96/o4UueXA+zj08aiSC9Mfj2WtD1bvpIb3C5yvskzZySzzaw==", "requires": { - "@babel/runtime": "^7.1.2", - "hoist-non-react-statics": "^3.1.0", + "@babel/runtime": "^7.4.5", + "hoist-non-react-statics": "^3.3.0", "invariant": "^2.2.4", - "loose-envify": "^1.1.0", - "prop-types": "^15.6.1", - "react-is": "^16.6.0", - "react-lifecycles-compat": "^3.0.0" + "loose-envify": "^1.4.0", + "prop-types": "^15.7.2", + "react-is": "^16.8.6" + }, + "dependencies": { + "@babel/runtime": { + "version": "7.5.4", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.5.4.tgz", + "integrity": "sha512-Na84uwyImZZc3FKf4aUF1tysApzwf3p2yuFBIyBfbzT5glzKTdvYI4KVW4kcgjrzoGUjC7w3YyCHcJKaRxsr2Q==", + "requires": { + "regenerator-runtime": "^0.13.2" + } + }, + "react-is": { + "version": "16.8.6", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.8.6.tgz", + "integrity": "sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA==" + }, + "regenerator-runtime": { + "version": "0.13.2", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.2.tgz", + "integrity": "sha512-S/TQAZJO+D3m9xeN1WTI8dLKBBiRgXBlTJvbWjCThHWZj9EvHK70Ff50/tYj2J/fvBY6JtFVwRuazHN2E7M9BA==" + } } }, "react-split-pane": { diff --git a/src/index.js b/src/index.js index 1cb1ce0f..043e4c87 100644 --- a/src/index.js +++ b/src/index.js @@ -5,7 +5,7 @@ import { applyMiddleware, compose } from 'redux'; -import { createProvider } from 'react-redux'; +import { Provider } from 'react-redux'; import React, { Component } from 'react'; import PropTypes from 'prop-types'; import forIn from 'lodash.forin'; @@ -22,14 +22,13 @@ class Griddle extends Component { settingsComponentObjects: PropTypes.object, events: PropTypes.object, selectors: PropTypes.object, - storeKey: PropTypes.string, storeListener: PropTypes.object }; constructor(props) { super(props); - const { core = corePlugin, storeKey = Griddle.storeKey || 'store' } = props; + const { core = corePlugin } = props; const { initialState, reducer, reduxMiddleware } = init.call(this, core); @@ -43,8 +42,6 @@ class Griddle extends Component { composeEnhancers(applyMiddleware(...reduxMiddleware)) ); - this.provider = createProvider(storeKey); - this.storeListener = new StoreListener(this.store); forIn(this.listeners, (listener, name) => { this.storeListener.addListener(listener, name, { @@ -71,17 +68,12 @@ class Griddle extends Component { return false; } - getStoreKey = () => { - return this.props.storeKey || Griddle.storeKey || 'store'; - }; - getChildContext() { return { components: this.components, settingsComponentObjects: this.settingsComponentObjects, events: this.events, selectors: this.selectors, - storeKey: this.getStoreKey(), storeListener: this.storeListener }; } @@ -92,13 +84,11 @@ class Griddle extends Component { } return ( - + - + ); } } -Griddle.storeKey = 'store'; - export default Griddle; diff --git a/src/module.d.ts b/src/module.d.ts index 6d575f38..92a0a0fc 100644 --- a/src/module.d.ts +++ b/src/module.d.ts @@ -4,14 +4,14 @@ import { connect as originalConnect } from 'react-redux'; import { ActionCreator, Middleware } from 'redux'; interface PropertyBag { - [propName: string]: T; + [propName: string]: T; } type GriddleComponent = React.ComponentClass | React.StatelessComponent; export namespace components { -export interface RowDefinitionProps { + export interface RowDefinitionProps { //The column value that should be used as the key for the row //if this is not set it will make one up (not efficient) rowKey?: string; @@ -25,12 +25,12 @@ export interface RowDefinitionProps { // Allow custom plugin props [x: string]: any, -} + } -export class RowDefinition extends React.Component { -} + export class RowDefinition extends React.Component { + } -export interface ColumnDefinitionProps { + export interface ColumnDefinitionProps { //The name of the column that this definition applies to. id: string, @@ -73,7 +73,7 @@ export interface ColumnDefinitionProps { extraData?: any, //The width of this column -- this is string so things like % can be specified - width?: number|string, + width?: number | string, // TODO: Unused? //The number of cells this column should extend. Default is 1. @@ -87,12 +87,12 @@ export interface ColumnDefinitionProps { // Allow custom plugin props [x: string]: any, -} + } -export class ColumnDefinition extends React.Component { -} + export class ColumnDefinition extends React.Component { + } -export interface CellProps { + export interface CellProps { griddleKey?: number; columnId?: string; value?: any; @@ -101,12 +101,12 @@ export interface CellProps { onMouseLeave?: React.MouseEventHandler; className?: string; style?: React.CSSProperties; -} + } -class Cell extends React.Component { -} + class Cell extends React.Component { + } -export interface RowProps { + export interface RowProps { Cell?: any; griddleKey?: string; columnIds?: number[]; @@ -115,41 +115,41 @@ export interface RowProps { onMouseLeave?: React.MouseEventHandler; className?: string; style?: React.CSSProperties; -} + } -class Row extends React.Component { -} + class Row extends React.Component { + } -export interface TableProps { + export interface TableProps { visibleRows?: number, TableHeading?: any, TableBody?: any, NoResults?: any, -} + } -class Table extends React.Component { -} + class Table extends React.Component { + } -export interface TableBodyProps { + export interface TableBodyProps { rowIds?: number[]; Row?: any; style?: React.CSSProperties; className?: string; -} + } -class TableBody extends React.Component { -} + class TableBody extends React.Component { + } -export interface TableHeadingProps { + export interface TableHeadingProps { columnIds?: number[]; columnTitles?: string[]; TableHeadingCell: any; -} + } -class TableHeading extends React.Component { -} + class TableHeading extends React.Component { + } -export interface TableHeadingCellProps { + export interface TableHeadingCellProps { title?: string; columnId?: number; onClick?: React.MouseEventHandler; @@ -158,213 +158,213 @@ export interface TableHeadingCellProps { icon?: any; className?: string; style?: React.CSSProperties; -} + } -class TableHeadingCell extends React.Component { -} + class TableHeadingCell extends React.Component { + } -const TableContainer: (OriginalComponent: any) => any; + const TableContainer: (OriginalComponent: any) => any; -export interface SettingsWrapperProps { + export interface SettingsWrapperProps { SettingsToggle?: GriddleComponent; Settings?: GriddleComponent; isEnabled?: boolean; isVisible?: boolean; className?: string; style?: React.CSSProperties; -} + } -class SettingsWrapper extends React.Component { -} + class SettingsWrapper extends React.Component { + } -const SettingsWrapperContainer: (OriginalComponent: any) => any; + const SettingsWrapperContainer: (OriginalComponent: any) => any; -export interface SettingsToggleProps { + export interface SettingsToggleProps { onClick?: React.MouseEventHandler; text?: any; className?: string; style?: React.CSSProperties; -} + } -class SettingsToggle extends React.Component { -} + class SettingsToggle extends React.Component { + } -const SettingsToggleContainer: (OriginalComponent: any) => any; + const SettingsToggleContainer: (OriginalComponent: any) => any; -export interface SettingsProps { + export interface SettingsProps { settingsComponents?: GriddleComponent[]; className?: string; style?: React.CSSProperties; -} + } -class Settings extends React.Component { -} + class Settings extends React.Component { + } -const SettingsContainer: (OriginalComponent: any) => any; + const SettingsContainer: (OriginalComponent: any) => any; -const SettingsComponents: PropertyBag>; + const SettingsComponents: PropertyBag>; -export interface FilterProps { + export interface FilterProps { setFilter?: (filter: GriddleFilter) => void; placeholder?: string; className?: string; style?: React.CSSProperties; [x: string]: any; -} + } -class Filter extends React.Component { -} + class Filter extends React.Component { + } } // namespace components export interface GriddleComponents { - Layout?: GriddleComponent; - LayoutEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - LayoutContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - LayoutContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - Style?: GriddleComponent; - StyleEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - StyleContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - StyleContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - Filter?: GriddleComponent; - FilterEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - FilterContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - FilterContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - SettingsWrapper?: GriddleComponent; - SettingsWrapperEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - SettingsWrapperContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - SettingsWrapperContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - SettingsToggle?: GriddleComponent; - SettingsToggleEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - SettingsToggleContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - SettingsToggleContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - Settings?: GriddleComponent; - SettingsEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - SettingsContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - SettingsContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - SettingsComponents?: PropertyBag>; - - Table?: GriddleComponent; - TableEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - TableContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - TableContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - TableHeading?: GriddleComponent; - TableHeadingEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - TableHeadingContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - TableHeadingContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - TableHeadingCell?: GriddleComponent; - TableHeadingCellEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - TableHeadingCellContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - TableHeadingCellContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - TableBody?: GriddleComponent; - TableBodyEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - TableBodyContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - TableBodyContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - Row?: GriddleComponent; - RowEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - RowContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - RowContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - Cell?: GriddleComponent; - CellEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - CellContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - CellContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - NoResults?: GriddleComponent; - NoResultsEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - NoResultsContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - NoResultsContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - Pagination?: GriddleComponent; - PaginationEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - PaginationContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - PaginationContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - NextButton?: GriddleComponent; - NextButtonEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - NextButtonContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - NextButtonContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - PageDropdown?: GriddleComponent; - PageDropdownEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - PageDropdownContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - PageDropdownContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - - PreviousButton?: GriddleComponent; - PreviousButtonEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - PreviousButtonContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; - PreviousButtonContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + Layout?: GriddleComponent; + LayoutEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + LayoutContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + LayoutContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + Style?: GriddleComponent; + StyleEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + StyleContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + StyleContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + Filter?: GriddleComponent; + FilterEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + FilterContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + FilterContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + SettingsWrapper?: GriddleComponent; + SettingsWrapperEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + SettingsWrapperContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + SettingsWrapperContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + SettingsToggle?: GriddleComponent; + SettingsToggleEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + SettingsToggleContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + SettingsToggleContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + Settings?: GriddleComponent; + SettingsEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + SettingsContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + SettingsContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + SettingsComponents?: PropertyBag>; + + Table?: GriddleComponent; + TableEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + TableContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + TableContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + TableHeading?: GriddleComponent; + TableHeadingEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + TableHeadingContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + TableHeadingContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + TableHeadingCell?: GriddleComponent; + TableHeadingCellEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + TableHeadingCellContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + TableHeadingCellContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + TableBody?: GriddleComponent; + TableBodyEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + TableBodyContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + TableBodyContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + Row?: GriddleComponent; + RowEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + RowContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + RowContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + Cell?: GriddleComponent; + CellEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + CellContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + CellContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + NoResults?: GriddleComponent; + NoResultsEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + NoResultsContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + NoResultsContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + Pagination?: GriddleComponent; + PaginationEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + PaginationContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + PaginationContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + NextButton?: GriddleComponent; + NextButtonEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + NextButtonContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + NextButtonContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + PageDropdown?: GriddleComponent; + PageDropdownEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + PageDropdownContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + PageDropdownContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + + PreviousButton?: GriddleComponent; + PreviousButtonEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + PreviousButtonContainer?: (OriginalComponent: GriddleComponent) => GriddleComponent; + PreviousButtonContainerEnhancer?: (OriginalComponent: GriddleComponent) => GriddleComponent; } export type RowFilter = (row: any, index: number, data: Immutable.List) => boolean; export type GriddleFilter = string | RowFilter | PropertyBag; export interface GriddleActions extends PropertyBag | undefined> { - onSort?: (sortProperties: any) => void; - onNext?: () => void; - onPrevious?: () => void; - onGetPage?: (pageNumber: number) => void; - setFilter?: (filter: GriddleFilter) => void; + onSort?: (sortProperties: any) => void; + onNext?: () => void; + onPrevious?: () => void; + onGetPage?: (pageNumber: number) => void; + setFilter?: (filter: GriddleFilter) => void; } export interface GriddleEvents extends GriddleActions { - onFilter?: (filterText: string) => void; - setSortProperties?: (sortProperties: utils.SortProperties) => () => void; + onFilter?: (filterText: string) => void; + setSortProperties?: (sortProperties: utils.SortProperties) => () => void; } export interface GriddleSortKey { - id: string; - sortAscending: boolean; + id: string; + sortAscending: boolean; } export interface GriddleStyleElements { - Cell?: T; - Filter?: T; - Layout?: T; - Loading?: T; - NextButton?: T; - NoResults?: T; - PageDropdown?: T; - Pagination?: T; - PreviousButton?: T; - Row?: T; - RowDefinition?: T; - Settings?: T; - SettingsToggle?: T; - Table?: T; - TableBody?: T; - TableHeading?: T; - TableHeadingCell?: T; - TableHeadingCellAscending?: T; - TableHeadingCellDescending?: T; + Cell?: T; + Filter?: T; + Layout?: T; + Loading?: T; + NextButton?: T; + NoResults?: T; + PageDropdown?: T; + Pagination?: T; + PreviousButton?: T; + Row?: T; + RowDefinition?: T; + Settings?: T; + SettingsToggle?: T; + Table?: T; + TableBody?: T; + TableHeading?: T; + TableHeadingCell?: T; + TableHeadingCellAscending?: T; + TableHeadingCellDescending?: T; } export interface GriddleStyleIcons { - sortAscendingIcon?: any; - sortDescendingIcon?: any; + sortAscendingIcon?: any; + sortDescendingIcon?: any; } export interface GriddleStyleConfig { - classNames?: GriddleStyleElements; - icons?: GriddleStyleElements; - styles?: GriddleStyleElements; + classNames?: GriddleStyleElements; + icons?: GriddleStyleElements; + styles?: GriddleStyleElements; } export interface GriddlePageProperties { - currentPage?: number; - pageSize?: number; - recordCount?: number; + currentPage?: number; + pageSize?: number; + recordCount?: number; } interface RowRenderProperties extends components.RowDefinitionProps { @@ -374,8 +374,8 @@ interface ColumnRenderProperties extends components.ColumnDefinitionProps { } export interface GriddleRenderProperties { - rowProperties?: RowRenderProperties; - columnProperties?: PropertyBag; + rowProperties?: RowRenderProperties; + columnProperties?: PropertyBag; } type Reducer = (state: any, action?: any) => void; @@ -383,50 +383,48 @@ type Selector = (state: any, props?: any) => any; type Listener = (prevState: any, nextState: any, otherArgs?: any) => any; interface SettingsComponentObject { - order: number; - component?: GriddleComponent; + order: number; + component?: GriddleComponent; } interface GriddleExtensibility { - components?: GriddleComponents, - events?: GriddleEvents; - reducer?: PropertyBag, - renderProperties?: GriddleRenderProperties; - selectors?: PropertyBag, - settingsComponentObjects?: PropertyBag, - styleConfig?: GriddleStyleConfig, - listeners?: PropertyBag, + components?: GriddleComponents, + events?: GriddleEvents; + reducer?: PropertyBag, + renderProperties?: GriddleRenderProperties; + selectors?: PropertyBag, + settingsComponentObjects?: PropertyBag, + styleConfig?: GriddleStyleConfig, + listeners?: PropertyBag, } interface GriddleInitialState { - enableSettings?: boolean; - pageProperties?: GriddlePageProperties; - sortMethod?: (data: any[], column: string, sortAscending?: boolean) => number; - sortProperties?: GriddleSortKey[]; - textProperties?: { - next?: string, - previous?: string, - settingsToggle?: string, - filterPlaceholder?: string, - } + enableSettings?: boolean; + pageProperties?: GriddlePageProperties; + sortMethod?: (data: any[], column: string, sortAscending?: boolean) => number; + sortProperties?: GriddleSortKey[]; + textProperties?: { + next?: string, + previous?: string, + settingsToggle?: string, + filterPlaceholder?: string, + } - [x: string]: any; + [x: string]: any; } export interface GriddlePlugin extends GriddleExtensibility { - initialState?: GriddleInitialState; - reduxMiddleware?: Middleware[]; + initialState?: GriddleInitialState; + reduxMiddleware?: Middleware[]; } export interface GriddleProps extends GriddlePlugin, GriddleInitialState { - core?: GriddlePlugin; - plugins?: GriddlePlugin[]; - data?: T[]; - storeKey?: string; + core?: GriddlePlugin; + plugins?: GriddlePlugin[]; + data?: T[]; } declare class Griddle extends React.Component, any> { - static storeKey: string; } export const actions: GriddleActions; @@ -437,61 +435,61 @@ export const selectors: PropertyBag; export const settingsComponentObjects: PropertyBag; -export const connect : typeof originalConnect; +export const connect: typeof originalConnect; export namespace utils { - const columnUtils: PropertyBag; - const compositionUtils: PropertyBag; - const dataUtils: PropertyBag; - const rowUtils: PropertyBag; - - const connect : typeof originalConnect; - - interface SortProperties{ - setSortColumn(sortProperties: ((key : GriddleSortKey) => void)) : void; - sortProperty: GriddleSortKey; - columnId: string; - } - - namespace sortUtils { - function defaultSort(data: any[], column: string, sortAscending?: boolean) : number; - function setSortProperties(sortProperties: SortProperties) : () => void; - } + const columnUtils: PropertyBag; + const compositionUtils: PropertyBag; + const dataUtils: PropertyBag; + const rowUtils: PropertyBag; + + const connect: typeof originalConnect; + + interface SortProperties { + setSortColumn(sortProperties: ((key: GriddleSortKey) => void)): void; + sortProperty: GriddleSortKey; + columnId: string; + } + + namespace sortUtils { + function defaultSort(data: any[], column: string, sortAscending?: boolean): number; + function setSortProperties(sortProperties: SortProperties): () => void; + } } export namespace plugins { - var CorePlugin : GriddlePlugin; + var CorePlugin: GriddlePlugin; - var LegacyStylePlugin : GriddlePlugin; + var LegacyStylePlugin: GriddlePlugin; - var LocalPlugin : GriddlePlugin; + var LocalPlugin: GriddlePlugin; - interface PositionSettings { - // The height of the table - tableHeight?: number|string; + interface PositionSettings { + // The height of the table + tableHeight?: number | string; - // The width of the table - tableWidth?: number|string; + // The width of the table + tableWidth?: number | string; - // The minimum row height - rowHeight?: number|string; + // The minimum row height + rowHeight?: number | string; - // TODO: Unused? - // The minimum column width - defaultColumnWidth?: number|string; + // TODO: Unused? + // The minimum column width + defaultColumnWidth?: number | string; - // TODO: Unused? - // Whether or not the header should be fixed - fixedHeader?: boolean; + // TODO: Unused? + // Whether or not the header should be fixed + fixedHeader?: boolean; - // TODO: Unused? - // Disable pointer events while scrolling to improve performance - disablePointerEvents?: boolean; - } - var PositionPlugin : (settings: PositionSettings) => GriddlePlugin; + // TODO: Unused? + // Disable pointer events while scrolling to improve performance + disablePointerEvents?: boolean; + } + var PositionPlugin: (settings: PositionSettings) => GriddlePlugin; } -export const ColumnDefinition : typeof components.ColumnDefinition; -export const RowDefinition : typeof components.RowDefinition; +export const ColumnDefinition: typeof components.ColumnDefinition; +export const RowDefinition: typeof components.RowDefinition; export default Griddle; diff --git a/src/utils/griddleConnect.js b/src/utils/griddleConnect.js index c19f4007..02405def 100644 --- a/src/utils/griddleConnect.js +++ b/src/utils/griddleConnect.js @@ -24,14 +24,11 @@ export const mergeConnectParametersWithOptions = ( const griddleConnect = (...connectOptions) => OriginalComponent => class extends React.Component { - static contextTypes = { - storeKey: PropTypes.string - }; + static contextTypes = {}; constructor(props, context) { super(props, context); const newOptions = mergeConnectParametersWithOptions(connectOptions, { - storeKey: context.storeKey }); this.ConnectedComponent = connect(...newOptions)(OriginalComponent); } diff --git a/stories/index.tsx b/stories/index.tsx index 4732dacf..00250ebf 100644 --- a/stories/index.tsx +++ b/stories/index.tsx @@ -127,7 +127,7 @@ storiesOf('Griddle main', module) n: state.get('n'), addTen: state.get('addTen') }), - () => {} + () => { } )(({ n, addTen }) => (

@@ -181,7 +181,7 @@ storiesOf('Griddle main', module) class DeferredGriddle extends React.Component< GriddleProps, { data?: FakeData[] } - > { + > { private timeout; constructor(props) { @@ -361,7 +361,7 @@ storiesOf('Griddle main', module) setSortProperties: sortProperties => { const { columnId } = sortProperties; if (columnsWithSortDisabled.findIndex(c => c === columnId) >= 0) { - return () => {}; + return () => { }; } return setSortProperties(sortProperties); @@ -1406,7 +1406,7 @@ storiesOf('Redux', module) ]; const SomePage = props => (

- + Component outside of Griddle that's sharing state
@@ -1416,10 +1416,10 @@ storiesOf('Redux', module) data: !state.searchString ? state.data : state.data.filter(r => - Object.keys(r).some( - k => r[k] && r[k].toString().indexOf(state.searchString) > -1 - ) + Object.keys(r).some( + k => r[k] && r[k].toString().indexOf(state.searchString) > -1 ) + ) }))(SomePage); testStore.dispatch({ type: 'SET_DATA', data: fakeData }); @@ -1540,7 +1540,7 @@ storiesOf('Redux', module) ); }) .add( - 'with custom storeKey and child connected to another Redux store', + 'with child connected to another Redux store', () => { // basically the demo redux stuff const countSelector = state => state.count; @@ -1587,7 +1587,6 @@ storiesOf('Redux', module) diff --git a/webpack.config.js b/webpack.config.js index 34ea45ef..4472d631 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -20,7 +20,10 @@ module.exports = { use: { loader: 'babel-loader?cacheDirectory', options: { - presets: ['@babel/preset-env', '@babel/preset-react'] + presets: ['@babel/preset-env', '@babel/preset-react'], + plugins: [ + '@babel/plugin-proposal-class-properties' + ] } }, exclude: ['/node_modules/', '/stories/', '/storybook-static/']