added child prop generic to container widgets
This commit is contained in:
parent
b4249df653
commit
f7d310bcda
|
|
@ -5,7 +5,7 @@ import styled from "../constants/DefaultTheme"
|
||||||
|
|
||||||
const Container = styled.div`
|
const Container = styled.div`
|
||||||
background: ${props => props.theme.primaryColor};
|
background: ${props => props.theme.primaryColor};
|
||||||
color: "black";
|
color: ${props => props.theme.primaryColor};
|
||||||
`
|
`
|
||||||
|
|
||||||
class ContainerComponent extends BaseComponent<IContainerProps> {
|
class ContainerComponent extends BaseComponent<IContainerProps> {
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@ import { AppState } from "../../reducers"
|
||||||
import WidgetFactory from "../../utils/WidgetFactory"
|
import WidgetFactory from "../../utils/WidgetFactory"
|
||||||
import { CanvasReduxState } from "../../reducers/uiReducers/canvasReducer"
|
import { CanvasReduxState } from "../../reducers/uiReducers/canvasReducer"
|
||||||
|
|
||||||
class Canvas extends Component<{ canvas: CanvasReduxState }> {
|
class Canvas extends Component<{ canvas: CanvasReduxState<any> }> {
|
||||||
render() {
|
render() {
|
||||||
const canvasWidgetData = this.props.canvas.canvasWidgetProps
|
const canvasWidgetData = this.props.canvas.canvasWidgetProps
|
||||||
if (canvasWidgetData) {
|
if (canvasWidgetData) {
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@ export default appReducer
|
||||||
|
|
||||||
export interface AppState {
|
export interface AppState {
|
||||||
ui: {
|
ui: {
|
||||||
canvas: CanvasReduxState
|
canvas: CanvasReduxState<any>
|
||||||
}
|
}
|
||||||
entities: {
|
entities: {
|
||||||
canvasWidgets: CanvasWidgetsReduxState
|
canvasWidgets: CanvasWidgetsReduxState
|
||||||
|
|
|
||||||
|
|
@ -5,8 +5,10 @@ import {
|
||||||
ReduxAction
|
ReduxAction
|
||||||
} from "../../constants/ActionConstants"
|
} from "../../constants/ActionConstants"
|
||||||
import { IContainerWidgetProps } from "../../widgets/ContainerWidget"
|
import { IContainerWidgetProps } from "../../widgets/ContainerWidget"
|
||||||
|
import { IWidgetProps } from "../../widgets/BaseWidget";
|
||||||
|
import { ITextWidgetProps } from "../../widgets/TextWidget";
|
||||||
|
|
||||||
const initialState: CanvasReduxState = {
|
const initialState: CanvasReduxState<any> = {
|
||||||
canvasWidgetProps: {
|
canvasWidgetProps: {
|
||||||
widgetId: "0",
|
widgetId: "0",
|
||||||
widgetType: "CONTAINER_WIDGET",
|
widgetType: "CONTAINER_WIDGET",
|
||||||
|
|
@ -19,7 +21,8 @@ const initialState: CanvasReduxState = {
|
||||||
bottomRow: 5,
|
bottomRow: 5,
|
||||||
rightColumn: 5,
|
rightColumn: 5,
|
||||||
parentColumnSpace: 100,
|
parentColumnSpace: 100,
|
||||||
parentRowSpace: 100
|
parentRowSpace: 100,
|
||||||
|
text: "whaat"
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
topRow: 0,
|
topRow: 0,
|
||||||
|
|
@ -33,15 +36,15 @@ const initialState: CanvasReduxState = {
|
||||||
|
|
||||||
const canvasReducer = createReducer(initialState, {
|
const canvasReducer = createReducer(initialState, {
|
||||||
[ActionTypes.LOAD_CANVAS]: (
|
[ActionTypes.LOAD_CANVAS]: (
|
||||||
state: CanvasReduxState,
|
state: CanvasReduxState<any>,
|
||||||
action: ReduxAction<LoadCanvasPayload>
|
action: ReduxAction<LoadCanvasPayload>
|
||||||
) => {
|
) => {
|
||||||
return { containerWidget: action.payload }
|
return { containerWidget: action.payload }
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
export interface CanvasReduxState {
|
export interface CanvasReduxState<T extends IWidgetProps> {
|
||||||
canvasWidgetProps?: IContainerWidgetProps
|
canvasWidgetProps?: IContainerWidgetProps<any>
|
||||||
}
|
}
|
||||||
|
|
||||||
export default canvasReducer
|
export default canvasReducer
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
import BaseWidget from "../widgets/BaseWidget"
|
import BaseWidget, { IWidgetProps } from "../widgets/BaseWidget"
|
||||||
import ContainerWidget, {
|
import ContainerWidget, {
|
||||||
IContainerWidgetProps
|
IContainerWidgetProps
|
||||||
} from "../widgets/ContainerWidget"
|
} from "../widgets/ContainerWidget"
|
||||||
|
|
@ -14,8 +14,8 @@ class WidgetBuilderRegistry {
|
||||||
|
|
||||||
WidgetFactory.registerWidgetBuilder("CONTAINER_WIDGET", {
|
WidgetFactory.registerWidgetBuilder("CONTAINER_WIDGET", {
|
||||||
buildWidget(
|
buildWidget(
|
||||||
widgetData: IContainerWidgetProps
|
widgetData: IContainerWidgetProps<IWidgetProps>
|
||||||
): BaseWidget<IContainerWidgetProps, IContainerProps> {
|
): BaseWidget<IContainerWidgetProps<IWidgetProps>, IContainerProps> {
|
||||||
return new ContainerWidget(widgetData)
|
return new ContainerWidget(widgetData)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -7,10 +7,10 @@ import { ContainerOrientation, WidgetType } from "../constants/WidgetConstants"
|
||||||
import WidgetFactory from "../utils/WidgetFactory"
|
import WidgetFactory from "../utils/WidgetFactory"
|
||||||
|
|
||||||
class ContainerWidget extends BaseWidget<
|
class ContainerWidget extends BaseWidget<
|
||||||
IContainerWidgetProps,
|
IContainerWidgetProps<IWidgetProps>,
|
||||||
IContainerProps
|
IContainerProps
|
||||||
> {
|
> {
|
||||||
constructor(widgetProps: IContainerWidgetProps) {
|
constructor(widgetProps: IContainerWidgetProps<IWidgetProps>) {
|
||||||
super(widgetProps)
|
super(widgetProps)
|
||||||
this.widgetData.snapColumns = 13
|
this.widgetData.snapColumns = 13
|
||||||
this.widgetData.snapColumnSpace = this.width / this.widgetData.snapColumns
|
this.widgetData.snapColumnSpace = this.width / this.widgetData.snapColumns
|
||||||
|
|
@ -53,8 +53,8 @@ class ContainerWidget extends BaseWidget<
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface IContainerWidgetProps extends IWidgetProps {
|
export interface IContainerWidgetProps<T extends IWidgetProps> extends IWidgetProps {
|
||||||
children?: IWidgetProps[]
|
children?: T[]
|
||||||
snapColumnSpace?: number
|
snapColumnSpace?: number
|
||||||
snapRowSpace?: number
|
snapRowSpace?: number
|
||||||
snapColumns?: number
|
snapColumns?: number
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user