content/mount arg types

packages/common/src/api-type-deps.ts

@@ -15,19 +15,26 @@ export { BusinessHoursInput } from './structs/business-hours'
 export { LocaleSingularArg, LocaleInput } from './datelib/locale'
 export { OverlapFunc, ConstraintInput, AllowFunc } from './structs/constraint'
 export { PluginDef } from './plugin-system-struct'
-export { ViewComponentType, ViewHookProps } from './structs/view-config'
+export { ViewComponentType, SpecificViewContentArg, SpecificViewMountArg } from './structs/view-config'
 export { ClassNamesGenerator, CustomContentGenerator, DidMountHandler, WillUnmountHandler } from './common/render-hook'
-export { NowIndicatorHookProps } from './common/NowIndicatorRoot'
-export { WeekNumberHookProps } from './common/WeekNumberRoot'
-export { SlotLaneHookProps, SlotLabelHookProps, AllDayHookProps, DayHeaderHookProps } from './render-hook-misc'
-export { DayCellHookProps } from './common/DayCellRoot'
-export { ViewRootHookProps } from './common/ViewRoot'
+export { NowIndicatorContentArg, NowIndicatorMountArg } from './common/NowIndicatorRoot'
+export { WeekNumberContentArg, WeekNumberMountArg } from './common/WeekNumberRoot'
+export {
+  SlotLaneContentArg, SlotLaneMountArg,
+  SlotLabelContentArg, SlotLabelMountArg,
+  AllDayContentArg, AllDayMountArg,
+  DayHeaderContentArg,
+  DayHeaderMountArg
+} from './render-hook-misc'
+export { DayCellContentArg, DayCellMountArg } from './common/DayCellRoot'
+export { ViewContentArg, ViewMountArg } from './common/ViewRoot'
 export { EventClickArg } from './interactions/EventClicking'
 export { EventHoveringArg } from './interactions/EventHovering'
 export { DateSelectArg, DateUnselectArg } from './calendar-utils'
 export { CalendarApi } from './CalendarApi'
 export { VUIEvent } from './vdom'
 export { WeekNumberCalculation } from './datelib/env'
 export { ToolbarInput, CustomButtonInput, ButtonIconsInput, ButtonTextCompoundInput } from './toolbar-struct'
+export { EventContentArg, EventMountArg } from './component/event-rendering'
 export { DatesSetArg } from './dates-set'
 export { EventAddArg, EventChangeArg, EventRemoveArg } from './event-crud'

packages/common/src/common/DayCellRoot.tsx

@@ -4,7 +4,7 @@ import { DateRange } from '../datelib/date-range'
 import { getDateMeta, getDayClassNames, DateMeta } from '../component/date-rendering'
 import { createFormatter } from '../datelib/formatting'
 import { formatDayString } from '../datelib/formatting-utils'
-import { buildClassNameNormalizer, MountHook, ContentHook } from './render-hook'
+import { buildClassNameNormalizer, MountHook, ContentHook, MountArg } from './render-hook'
 import { ViewApi } from '../ViewApi'
 import { BaseComponent } from '../vdom-util'
 import { DateProfile } from '../DateProfileGenerator'
@@ -25,12 +25,13 @@ interface DayCellHookPropsInput {
   extraProps?: Dictionary // so can include a resource
 }
 
-export interface DayCellHookProps extends DateMeta {
+export interface DayCellContentArg extends DateMeta {
   date: DateMarker // localized
   view: ViewApi
   dayNumberText: string
   [extraProp: string]: any // so can include a resource
 }
+export type DayCellMountArg = MountArg<DayCellContentArg>
 
 
 export interface DayCellRootProps {
@@ -51,7 +52,7 @@ export interface DayCellRootProps {
 export class DayCellRoot extends BaseComponent<DayCellRootProps> {
 
   refineHookProps = memoizeObjArg(refineHookProps)
-  normalizeClassNames = buildClassNameNormalizer<DayCellHookProps>()
+  normalizeClassNames = buildClassNameNormalizer<DayCellContentArg>()
 
 
   render() {
@@ -98,7 +99,7 @@ export interface DayCellContentProps {
   todayRange: DateRange
   showDayNumber?: boolean // defaults to false
   extraHookProps?: Dictionary
-  defaultContent?: (hookProps: DayCellHookProps) => ComponentChildren
+  defaultContent?: (hookProps: DayCellContentArg) => ComponentChildren
   children: (
     innerElRef: Ref<any>,
     innerContent: ComponentChildren
@@ -134,7 +135,7 @@ export class DayCellContent extends BaseComponent<DayCellContentProps> {
 }
 
 
-function refineHookProps(raw: DayCellHookPropsInput): DayCellHookProps {
+function refineHookProps(raw: DayCellHookPropsInput): DayCellContentArg {
   let { date, dateEnv } = raw
   let dayMeta = getDateMeta(date, raw.todayRange, null, raw.dateProfile)
 

packages/common/src/common/EventRoot.tsx

@@ -2,7 +2,7 @@ import { Seg } from '../component/DateComponent'
 import { ComponentChildren, createElement, Ref, createRef } from '../vdom'
 import { EventApi } from '../api/EventApi'
 import { computeSegDraggable, computeSegStartResizable, computeSegEndResizable, setElSeg } from '../component/event-rendering'
-import { EventMeta, getEventClassNames } from '../component/event-rendering'
+import { EventContentArg, getEventClassNames } from '../component/event-rendering'
 import { RenderHook } from './render-hook'
 import { BaseComponent } from '../vdom-util'
 
@@ -22,13 +22,13 @@ export interface EventRootProps extends MinimalEventProps {
   timeText: string
   disableDragging?: boolean
   disableResizing?: boolean
-  defaultContent: (hookProps: EventMeta) => ComponentChildren
+  defaultContent: (hookProps: EventContentArg) => ComponentChildren
   children: (
     rootElRef: Ref<any>,
     classNames: string[],
     innerElRef: Ref<any>,
     innerContent: ComponentChildren,
-    hookProps: EventMeta
+    hookProps: EventContentArg
   ) => ComponentChildren
 }
 
@@ -45,7 +45,7 @@ export class EventRoot extends BaseComponent<EventRootProps> {
     let { eventRange } = seg
     let { ui } = eventRange
 
-    let hookProps: EventMeta = {
+    let hookProps: EventContentArg = {
       event: new EventApi(context, eventRange.def, eventRange.instance),
       view: context.viewApi,
       timeText: props.timeText,

packages/common/src/common/NowIndicatorRoot.tsx

@@ -1,4 +1,4 @@
-import { RenderHook, RenderHookPropsChildren } from './render-hook'
+import { RenderHook, RenderHookPropsChildren, MountArg } from './render-hook'
 import { DateMarker } from '../datelib/marker'
 import { ViewContext, ViewContextType } from '../ViewContext'
 import { createElement } from '../vdom'
@@ -11,18 +11,20 @@ export interface NowIndicatorRootProps {
   children: RenderHookPropsChildren
 }
 
-export interface NowIndicatorHookProps {
+export interface NowIndicatorContentArg {
   isAxis: boolean
   date: Date
   view: ViewApi
 }
 
+export type NowIndicatorMountArg = MountArg<NowIndicatorContentArg>
+
 
 export const NowIndicatorRoot = (props: NowIndicatorRootProps) => (
   <ViewContextType.Consumer>
     {(context: ViewContext) => {
       let { options } = context
-      let hookProps: NowIndicatorHookProps = {
+      let hookProps: NowIndicatorContentArg = {
         isAxis: props.isAxis,
         date: context.dateEnv.toDate(props.date),
         view: context.viewApi

packages/common/src/common/StandardEvent.tsx

@@ -1,7 +1,7 @@
 
 import { ComponentChildren, createElement, Fragment } from '../vdom'
 import { BaseComponent } from '../vdom-util'
-import { buildSegTimeText, EventMeta } from '../component/event-rendering'
+import { buildSegTimeText, EventContentArg } from '../component/event-rendering'
 import { EventRoot, MinimalEventProps } from './EventRoot'
 import { Seg } from '../component/DateComponent'
 import { DateFormatter } from '../datelib/DateFormatter'
@@ -14,7 +14,7 @@ export interface StandardEventProps extends MinimalEventProps {
   defaultDisplayEventEnd?: boolean // default true
   disableDragging?: boolean // default false
   disableResizing?: boolean // default false
-  defaultContent?: (hookProps: EventMeta) => ComponentChildren // not used by anyone yet
+  defaultContent?: (hookProps: EventContentArg) => ComponentChildren // not used by anyone yet
 }
 
 
@@ -76,7 +76,7 @@ export class StandardEvent extends BaseComponent<StandardEventProps> {
 }
 
 
-function renderInnerContent(innerProps: EventMeta) {
+function renderInnerContent(innerProps: EventContentArg) {
   return (
     <Fragment>
       {innerProps.timeText &&

packages/common/src/common/TableDateCell.tsx

@@ -8,7 +8,7 @@ import { BaseComponent } from '../vdom-util'
 import { RenderHook } from './render-hook'
 import { buildNavLinkData } from './nav-link'
 import { DateProfile } from '../DateProfileGenerator'
-import { DayHeaderHookProps } from '../render-hook-misc'
+import { DayHeaderContentArg } from '../render-hook-misc'
 import { Dictionary } from '../options'
 
 
@@ -45,7 +45,7 @@ export class TableDateCell extends BaseComponent<TableDateCellProps> { // BAD na
       ? { 'data-navlink': buildNavLinkData(date), tabIndex: 0 }
       : {}
 
-    let hookProps: DayHeaderHookProps = {
+    let hookProps: DayHeaderContentArg = {
       date: dateEnv.toDate(date),
       view: viewApi,
       ...props.extraHookProps,
@@ -127,7 +127,7 @@ export class TableDowCell extends BaseComponent<TableDowCellProps> {
 
     let text = dateEnv.format(date, props.dayHeaderFormat)
 
-    let hookProps: DayHeaderHookProps = {
+    let hookProps: DayHeaderContentArg = { // TODO: make this public?
       date,
       ...dateMeta,
       view: viewApi,
@@ -171,6 +171,6 @@ export class TableDowCell extends BaseComponent<TableDowCellProps> {
 }
 
 
-function renderInner(hookProps: DayHeaderHookProps) {
+function renderInner(hookProps: DayHeaderContentArg) {
   return hookProps.text
 }

packages/common/src/common/ViewRoot.tsx

@@ -1,5 +1,5 @@
 import { ViewSpec } from '../structs/view-spec'
-import { MountHook, buildClassNameNormalizer } from './render-hook'
+import { MountHook, buildClassNameNormalizer, MountArg } from './render-hook'
 import { ComponentChildren, createElement, Ref } from '../vdom'
 import { BaseComponent } from '../vdom-util'
 import { ViewApi } from '../ViewApi'
@@ -11,20 +11,22 @@ export interface ViewRootProps {
   elRef?: Ref<any>
 }
 
-export interface ViewRootHookProps {
+export interface ViewContentArg {
   view: ViewApi
 }
 
+export type ViewMountArg = MountArg<ViewContentArg>
+
 
 export class ViewRoot extends BaseComponent<ViewRootProps> {
 
-  normalizeClassNames = buildClassNameNormalizer<ViewRootHookProps>()
+  normalizeClassNames = buildClassNameNormalizer<ViewContentArg>()
 
 
   render() {
     let { props, context } = this
     let { options } = context
-    let hookProps: ViewRootHookProps = { view: context.viewApi }
+    let hookProps: ViewContentArg = { view: context.viewApi }
     let customClassNames = this.normalizeClassNames(options.viewClassNames, hookProps)
 
     return (

packages/common/src/common/WeekNumberRoot.tsx

@@ -1,6 +1,6 @@
 import { ViewContext, ViewContextType } from '../ViewContext'
 import { DateMarker } from '../datelib/marker'
-import { RenderHook, RenderHookPropsChildren } from './render-hook'
+import { RenderHook, RenderHookPropsChildren, MountArg } from './render-hook'
 import { createElement } from '../vdom'
 import { DateFormatter } from '../datelib/DateFormatter'
 
@@ -11,11 +11,12 @@ export interface WeekNumberRootProps {
   children: RenderHookPropsChildren
 }
 
-export interface WeekNumberHookProps {
+export interface WeekNumberContentArg {
   num: number
   text: string
   date: Date
 }
+export type WeekNumberMountArg = MountArg<WeekNumberContentArg>
 
 
 export const WeekNumberRoot = (props: WeekNumberRootProps) => (
@@ -26,10 +27,10 @@ export const WeekNumberRoot = (props: WeekNumberRootProps) => (
       let format = options.weekNumberFormat || props.defaultFormat
       let num = dateEnv.computeWeekNumber(date) // TODO: somehow use for formatting as well?
       let text = dateEnv.format(date, format)
-      let hookProps: WeekNumberHookProps = { num, text, date }
+      let hookProps: WeekNumberContentArg = { num, text, date }
 
       return (
-        <RenderHook<WeekNumberHookProps> // why isn't WeekNumberHookProps being auto-detected?
+        <RenderHook<WeekNumberContentArg> // why isn't WeekNumberContentArg being auto-detected?
           hookProps={hookProps}
           classNames={options.weekNumberClassNames}
           content={options.weekNumberContent}

packages/common/src/common/bg-fill.tsx

@@ -1,7 +1,7 @@
 import { createElement } from '../vdom'
 import { EventRoot } from './EventRoot'
 import { Seg } from '../component/DateComponent'
-import { EventMeta } from '../component/event-rendering'
+import { EventContentArg } from '../component/event-rendering'
 
 
 export function renderFill(fillType: string) {
@@ -47,7 +47,7 @@ export const BgEvent = (props: BgEventProps) => (
   </EventRoot>
 )
 
-function renderInnerContent(props: EventMeta) {
+function renderInnerContent(props: EventContentArg) {
   let title = props.event.title
 
   return title && (

packages/common/src/common/render-hook.tsx

@@ -4,13 +4,13 @@ import { isPropsEqual } from '../util/object'
 import { parseClassNames, ClassNamesInput } from '../util/html'
 
 
-export interface RenderHookProps<HookProps> {
-  hookProps: HookProps
-  classNames: ClassNamesGenerator<HookProps>
-  content: CustomContentGenerator<HookProps>
-  defaultContent?: DefaultContentGenerator<HookProps>
-  didMount: DidMountHandler<HookProps>
-  willUnmount: WillUnmountHandler<HookProps>
+export interface RenderHookProps<ContentArg> {
+  hookProps: ContentArg
+  classNames: ClassNamesGenerator<ContentArg>
+  content: CustomContentGenerator<ContentArg>
+  defaultContent?: DefaultContentGenerator<ContentArg>
+  didMount: DidMountHandler<MountArg<ContentArg>>
+  willUnmount: WillUnmountHandler<MountArg<ContentArg>>
   children: RenderHookPropsChildren
   elRef?: Ref<any>
 }
@@ -74,7 +74,7 @@ export interface ObjCustomContent {
 
 export type CustomContent = ComponentChildren | ObjCustomContent
 export type CustomContentGenerator<HookProps> = CustomContent | ((hookProps: HookProps) => CustomContent)
-export type DefaultContentGenerator<HookProps> = (hookProps: HookProps) => ComponentChildren
+export type DefaultContentGenerator<HookProps> = (hookProps: HookProps) => ComponentChildren // TODO: rename to be about function, not default. use in above type
 
 // for forcing rerender of components that use the ContentHook
 export const CustomContentRenderContext = createContext<number>(0)
@@ -177,19 +177,19 @@ export class ContentHook<HookProps> extends BaseComponent<ContentHookProps<HookP
 
 
 
-export type HookPropsWithEl<HookProps> = HookProps & { el: HTMLElement }
-export type DidMountHandler<HookProps> = (hookProps: HookPropsWithEl<HookProps>) => void
-export type WillUnmountHandler<HookProps> = (hookProps: HookPropsWithEl<HookProps>) => void
+export type MountArg<ContentArg> = ContentArg & { el: HTMLElement }
+export type DidMountHandler<MountArg extends { el: HTMLElement }> = (mountArg: MountArg) => void
+export type WillUnmountHandler<MountArg extends { el: HTMLElement }> = (mountArg: MountArg) => void
 
-export interface MountHookProps<HookProps> {
-  hookProps: HookProps
-  didMount: DidMountHandler<HookProps>
-  willUnmount: WillUnmountHandler<HookProps>
+export interface MountHookProps<ContentArg> {
+  hookProps: ContentArg
+  didMount: DidMountHandler<MountArg<ContentArg>>
+  willUnmount: WillUnmountHandler<MountArg<ContentArg>>
   children: (rootElRef: Ref<any>) => ComponentChildren
   elRef?: Ref<any> // maybe get rid of once we have better API for caller to combine refs
 }
 
-export class MountHook<HookProps> extends BaseComponent<MountHookProps<HookProps>> {
+export class MountHook<ContentArg> extends BaseComponent<MountHookProps<ContentArg>> {
 
   rootEl: HTMLElement
 

packages/common/src/component/event-rendering.ts

@@ -13,6 +13,7 @@ import { ViewContext } from '../ViewContext'
 import { DateFormatter } from '../datelib/DateFormatter'
 import { DateMarker } from '../datelib/marker'
 import { ViewApi } from '../ViewApi'
+import { MountArg } from '../common/render-hook'
 
 
 export interface EventRenderRange extends EventTuple {
@@ -204,7 +205,7 @@ export function buildSegCompareObj(seg: Seg) {
 // other stuff
 
 
-export interface EventMeta { // for *Content handlers
+export interface EventContentArg { // for *Content handlers
   event: EventApi
   timeText: string
   backgroundColor: string // TODO: add other EventUi props?
@@ -225,6 +226,8 @@ export interface EventMeta { // for *Content handlers
   view: ViewApi // specifically for the API
 }
 
+export type EventMountArg = MountArg<EventContentArg>
+
 
 export function computeSegDraggable(seg: Seg, context: ViewContext) {
   let { pluginHooks } = context
@@ -300,7 +303,7 @@ export function getSegMeta(seg: Seg, todayRange: DateRange, nowDate?: DateMarker
 }
 
 
-export function getEventClassNames(props: EventMeta) { // weird that we use this interface, but convenient
+export function getEventClassNames(props: EventContentArg) { // weird that we use this interface, but convenient
   let classNames: string[] = [ 'fc-event' ]
 
   if (props.isMirror) {