/* eslint-disable @typescript-eslint/no-unused-vars */
/**
 * Angular wrapper for Bryntum ResourceView
 */

import { Component, ElementRef, EventEmitter, Output, Input, SimpleChange, SimpleChanges, OnDestroy, OnInit } from '@angular/core';

import WrapperHelper from './wrapper.helper';

import { AlignSpec, Base, BryntumScrollOptions, ButtonConfig, Color, Container, DomConfig, DurationConfig, KeyMapConfig, Layout, MaskConfig, MenuItemConfig, MenuItemEntry, Model, PagingToolbarConfig, Panel, PanelCollapserConfig, PanelCollapserOverlayConfig, PanelHeader, Rectangle, Scroller, ScrollerConfig, StateProvider, TabConfig, Tool, ToolConfig, ToolbarConfig, ToolbarItems, TooltipConfig, Widget } from '@bryntum/core-thin';
import { EventModel, ResourceModel } from '@bryntum/scheduler-thin';
import { CalendarView, CalendarContainerItemConfig, CalendarContainerLayoutConfig, EventBar, ResourceView, ResourceViewListeners } from '@bryntum/calendar-thin';

import { StringHelper } from '@bryntum/core-thin';

export type BryntumResourceViewProps = {
    // Configs
    /**
     * A key to use to activate this view.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-activationKey)
     */
    activationKey ? : string
    /**
     * Element (or element id) to adopt as this Widget's encapsulating element. The widget's
     * content will be placed inside this element.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-adopt)
     */
    adopt ? : HTMLElement|string
    /**
     * *Only valid if this Widget is [floating](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-floating).*
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-align)
     */
    align ? : AlignSpec|string
    /**
     * When this widget is a child of a [Container](https://bryntum.com/products/calendar/docs/api/Core/widget/Container), it will by default be participating in a
     * flexbox layout. This config allows you to set this widget's
     * [align-self](https://developer.mozilla.org/en-US/docs/Web/CSS/align-self) style.
     */
    alignSelf ? : string
    /**
     * Configure this as `false` to disable drag-creating events in this view.
     */
    allowDragCreate ? : boolean
    /**
     * Configure this as `false` to disable drag-moving events in this view.
     */
    allowDragMove ? : boolean
    /**
     * Configure this as `false` to disable drag-resizing events in this view.
     */
    allowDragResize ? : boolean
    /**
     * *Only valid if this Widget is [floating](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-floating) and being shown through [showBy](#Core/widget/Widget#function-showBy).*
     * `true` to show a connector arrow pointing to the align target.
     */
    anchor ? : boolean
    /**
     * By default, when navigating through time, the next time
     * block will be animated in from the appropriate direction.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-animateTimeShift)
     */
    animateTimeShift ? : boolean
    /**
     * Element (or the id of an element) to append this widget's element to. Can be configured, or set once at
     * runtime. To access the element of a rendered widget, see [element](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#property-element).
     */
    appendTo ? : HTMLElement|string
    /**
     * A localizable string (May contain `'L{}'` tokens which resolve in the locale file) to inject
     * into an element which will be linked using the `aria-describedby` attribute.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-ariaDescription)
     */
    ariaDescription ? : string
    /**
     * A localizable string (May contain `'L{}'` tokens which resolve in the locale file) to inject as
     * the `aria-label` attribute.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-ariaLabel)
     */
    ariaLabel ? : string
    /**
     * If this config is set, then the `gesture` configured (which defaults to `dblclick`) creates a
     * new event at the mouse or touch event's time point.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-autoCreate)
     */
    autoCreate ? : {
        gesture?: string
        newName?: Function|string
        step?: string
        snapType?: 'round'|'ceil'|'floor'
        duration?: string
        startHour?: number
    }|string|boolean
    /**
     * A Config object representing the configuration of a [Toolbar](https://bryntum.com/products/calendar/docs/api/Core/widget/Toolbar),
     * or array of config objects representing the child items of a Toolbar. Another way to add a bbar is to use [strips](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-strips).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-bbar)
     */
    bbar ? : (CalendarContainerItemConfig|string)[]|ToolbarConfig|PagingToolbarConfig|null
    /**
     * Custom CSS classes to add to the panel's body element.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-bodyCls)
     */
    bodyCls ? : string|object
    /**
     * Set `true` to add a border to this container's element.
     */
    border ? : boolean
    /**
     * An object where property names with a truthy value indicate which events should bubble up the ownership
     * hierarchy when triggered.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-bubbleEvents)
     */
    bubbleEvents ? : object
    /**
     * Set to `false` to not call onXXX method names (e.g. `onShow`, `onClick`), as an easy way to listen for events.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-callOnFunctions)
     */
    callOnFunctions ? : boolean
    /**
     * By default, if an event handler throws an exception, the error propagates up the stack and the
     * application state is undefined. Code which follows the event handler will *not* be executed.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-catchEventHandlerExceptions)
     */
    catchEventHandlerExceptions ? : boolean
    /**
     * *Only valid if this Widget is [floating](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-floating).*
     * Set to `true` to centre the Widget in browser viewport space.
     */
    centered ? : boolean
    /**
     * Custom CSS classes to add to element.
     * May be specified as a space separated string, or as an object in which property names
     * with truthy values are used as the class names:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-cls)
     */
    cls ? : string|object
    /**
     * Controls whether the panel is collapsed (the body of the panel is hidden while only the header is
     * visible). Only valid if the panel is [collapsible](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-collapsible).
     */
    collapsed ? : boolean
    /**
     * This config enables collapsibility for the panel. See [collapsed](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-collapsed).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-collapsible)
     */
    collapsible ? : boolean|PanelCollapserConfig|PanelCollapserOverlayConfig
    /**
     * Applies the specified color to the widget, by setting the `--b-primary` CSS variable in the widgets
     * `style` block.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-color)
     */
    color ? : Color
    /**
     * Programmatic control over which column to start in when used in a grid layout.
     */
    column ? : number
    config ? : object
    /**
     * *Only valid if this Widget is [floating](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-floating) or [positioned](#Core/widget/Widget#config-positioned).*
     * Element, Widget or Rectangle to which this Widget is constrained.
     */
    constrainTo ? : HTMLElement|Widget|Rectangle
    /**
     * Custom CSS classes to add to the [contentElement](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#property-contentElement).
     * May be specified as a space separated string, or as an object in which property names
     * with truthy values are used as the class names:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-contentElementCls)
     */
    contentElementCls ? : string|object
    /**
     * When this Widget configuration is used in the Grid's RowExpander feature's `widget` config, provide the
     * field on the expanded record to use for populating this widget's store (if applicable)
     */
    dataField ? : string
    /**
     * Object to apply to elements dataset (each key will be used as a data-attribute on the element)
     */
    dataset ? : Record<string, string>
    /**
     * A [DateHelper](https://bryntum.com/products/calendar/docs/api/Core/helper/DateHelper) format string/function to use to create date output for view descriptions.
     * @param {Date} date The date to format.
     * @returns {string} The formatted date.
     */
    dateFormat ? : string|((date: Date) => string)
    /**
     * A string used to separate start and end dates in the [descriptionFormat](https://bryntum.com/products/calendar/docs/api/Scheduler/view/mixin/Describable#config-descriptionFormat).
     */
    dateSeparator ? : string
    /**
     * The name of the property to set when a single value is to be applied to this Widget. Such as when used
     * in a grid WidgetColumn, this is the property to which the column's `field` is applied.
     */
    defaultBindProperty ? : string
    /**
     * A [query](https://bryntum.com/products/calendar/docs/api/Core/widget/Container#function-query) selector function which can identify the descendant widget to which
     * focus should be directed by default.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-defaultFocus)
     * @param {Core.widget.Widget} widget Widget passed to method
     * @returns {boolean} truthy value if widget is the default one
     */
    defaultFocus ? : ((widget: Widget) => boolean)|string
    /**
     * A config object containing default settings to apply to all child widgets.
     */
    defaults ? : CalendarContainerItemConfig
    /**
     * Options to add into scroll options when the [scrollTo](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#function-scrollTo) method is called.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-defaultScrollOptions)
     */
    defaultScrollOptions ? : BryntumScrollOptions
    /**
     * The date format used by the default [descriptionRenderer](https://bryntum.com/products/calendar/docs/api/Scheduler/view/mixin/Describable#config-descriptionRenderer) for rendering the view's description.
     * If this value is `null`, the [dateFormat](https://bryntum.com/products/calendar/docs/api/Scheduler/view/mixin/Describable#config-dateFormat) (and potentially [dateSeparator](#Scheduler/view/mixin/Describable#config-dateSeparator)) will
     * be used.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-descriptionFormat)
     * @param {Date} date The date to format.
     * @returns {string} The formatted date.
     */
    descriptionFormat ? : string|string[]|boolean[]|((date: Date) => string)|Function[]
    /**
     * A function that provides the textual description for this view. If provided, this function overrides the
     * [descriptionFormat](https://bryntum.com/products/calendar/docs/api/Scheduler/view/mixin/Describable#config-descriptionFormat).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-descriptionRenderer)
     * @param {Core.widget.Widget} view The active view in case the function is in another scope.
     * @returns {string} Description string
     */
    descriptionRenderer ? : (view: Widget) => string
    /**
     * Check for CSS compatibility issues when upgrading to v7. Performs the following checks:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-detectCSSCompatibilityIssues)
     */
    detectCSSCompatibilityIssues ? : boolean
    /**
     * Disable or enable the widget. It is similar to [readOnly](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-readOnly) except a disabled widget
     * cannot be focused, uses a different rendition (usually greyish) and does not allow selecting its value.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-disabled)
     */
    disabled ? : boolean|'inert'
    /**
     * Controls the placement of this widget when it is added to a [panel's ](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel)
     * [strips collection](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-strips). Typical values for this config are `'top'`,
     * `'bottom'`, `'left'`, or `'right'`, which cause the widget to be placed on that side of the panel's
     * body. Such widgets are called "edge strips".
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-dock)
     */
    dock ? : 'top'|'bottom'|'left'|'right'|'start'|'end'|'header'|'pre-header'|object
    /**
     * *Only valid if this Widget is [floating](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-floating).*
     * Set to `true` to be able to drag a widget freely on the page. Or set to an object with a ´handleSelector´
     * property which controls when a drag should start.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-draggable)
     */
    draggable ? : boolean|{
        handleSelector?: string
    }
    /**
     * The [durationUnit](https://bryntum.com/products/calendar/docs/api/Scheduler/model/EventModel#field-durationUnit) to use when drag-creating events
     * in this view.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-dragUnit)
     */
    dragUnit ? : string
    /**
     * Make this Panel a docked drawer which slides out from one side of the browser viewport by default.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-drawer)
     * @param {'start','left','end','right','top','bottom'} side The side of the viewport to dock the drawer to.  * `'start'` means the `inline-start` side. * `'end'` means the `inline-end` side.
     * @param {string,number} size The size of the drawer in its collapsible axis.
     * @param {boolean} inline If using the [appendTo](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-appendTo) config to place the drawer inside a host widget, this may be set to `true` to make the drawer inline within that host. Note that, if using this, the layout of the host element must have `flex-direction` set appropriately.
     * @param {boolean,object} autoClose Specifies what user actions should automatically close the drawer. Defaults to closing when the user clicks outside of the drawer or when focus moves outside of the drawer.
     * @param {boolean,string} autoClose.mousedown If the user clicks outside of the drawer, the drawer will automatically be hidden. If the value is a string, it is used as a CSS selector to filter clicks which should close the drawer.
     * @param {boolean,string} autoClose.focusout If focus moves outside of the drawer, the drawer will automatically be hidden.
     * @param {string} autoClose.mouseout Hides the drawer when the mouse leaves the drawer after the `autoCloseDelay` period.
     * @param {number} autoCloseDelay When using `mouseout`, this is the delay in milliseconds
     */
    drawer ? : boolean|{side?: 'start'|'left'|'end'|'right'|'top'|'bottom', size?: string|number, inline?: boolean, autoClose: { mousedown?: boolean|string, focusout?: boolean|string, mouseout?: string }, autoCloseDelay?: number}
    /**
     * An object specifying attributes to assign to the root element of this widget.
     * Set `null` value to attribute to remove it.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-elementAttributes)
     */
    elementAttributes ? : Record<string, string|null>
    /**
     * A function, or the name of a function in the ownership hierarchy which you
     * can specify to customize event DOM content.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-eventHeaderRenderer)
     * @param {object} detail An object that contains data about the event being rendered
     * @param {CalendarView} detail.view The view rendering the event
     * @param {Scheduler.model.EventModel} detail.eventRecord The event record
     * @param {Scheduler.model.ResourceModel} detail.resourceRecord The resource record
     * @param {object} detail.renderData A data object containing properties that will be used to create the event element
     * @param {object} detail.renderData.style The style property is an object containing style properties for the event element
     * @param {object} detail.renderData.cls The cls property is an object whose property names will be added to the event element if the property value is truthy
     * @param {object} detail.renderData.iconStyle The iconStyle property is an object containing style properties for the icon element if an icon element is to be used
     * @param {object} detail.renderData.iconCls The iconCls property is an object whose property names will be added to the icon element. Initially set from the event record's [iconCls](https://bryntum.com/products/calendar/docs/api/Scheduler/model/EventModel#field-iconCls). Can be mutated by the renderer. If null, or no properties are set, no icon will be rendered
     * @param {string} detail.renderData.eventColor Color to be applied to the event
     * @param {object} detail.renderData.dataset An object which produces the `dataset` of the resulting event bar
     * @param {boolean} detail.renderData.solidBar This is valid for views which create event bars. This is set to `true` by default for all day and interday events so that these appear as a solid block of background color. An eventRenderer may mutate this flag to change in what manner the event bar is colored - as a solid bar of color, or using the foreground color (text and icons) such as the MonthView, the CalendarRow (all day events in a DayView), and OverflowPopups
     * @param {string} detail.renderData.bodyColor When used in a [DayView](https://bryntum.com/products/calendar/docs/api/Calendar/widget/DayView), this color is applied to the body of the event element. Note that this must be light enough that the text color (From the SASS variable `$dayview-event-color`) is visible
     * @param {boolean} detail.showBullet If there is no `iconCls`, and the event is not recurring, then by default a "bullet" circular icon is shown if the view's [showBullet](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#config-showBullet) if set. Setting this property in an event renderer overrides this behaviour.
     * @returns {DomConfig,DomConfig[],string,void}
     */
    eventHeaderRenderer ? : ((detail: { view: CalendarView, eventRecord: EventModel, resourceRecord: ResourceModel, renderData: { style: object, cls: object, iconStyle: object, iconCls: object, eventColor: string, dataset: object, solidBar: boolean, bodyColor: string }, showBullet: boolean }) => DomConfig|DomConfig[]|string|void)|string
    /**
     * The height of event bars if this view creates event bars.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-eventHeight)
     */
    eventHeight ? : number|string
    /**
     * A function, or the name of a function in the ownership hierarchy which you
     * can specify to customize event DOM content.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-eventRenderer)
     * @param {object} detail An object that contains data about the event being rendered
     * @param {CalendarView} detail.view The view rendering the event
     * @param {Scheduler.model.EventModel} detail.eventRecord The event record
     * @param {Scheduler.model.ResourceModel} detail.resourceRecord The Resource record
     * @param {object} detail.renderData A data object containing properties that will be used to create the event element
     * @param {object} detail.renderData.style The style property is an object containing style properties for the event element
     * @param {object} detail.renderData.cls The cls property is an object whose property names will be added to the event element if the property value is truthy
     * @param {object} detail.renderData.iconStyle The iconStyle property is an object containing style properties for the icon element if an icon element is to be used
     * @param {object} detail.renderData.iconCls The iconCls property is an object whose property names will be added to the icon element. Initially set from the event record's [iconCls](https://bryntum.com/products/calendar/docs/api/Scheduler/model/EventModel#field-iconCls). Can be mutated by the renderer. If null, or no properties are set, no icon will be rendered
     * @param {string} detail.renderData.eventColor Color to be applied to the event
     * @param {object} detail.renderData.dataset An object which produces the `dataset` of the resulting event bar
     * @param {boolean} detail.renderData.solidBar This is valid for views which create event bars. This is set to `true` by default for all day and interday events so that these appear as a solid block of background color. An eventRenderer may mutate this flag to change in what manner the event bar is coloured - as a solid bar of colour, or using the foreground colour (text and icons) such as the MonthView, the CalendarRow (all day events in a DayView), and OverflowPopups
     * @param {string} detail.renderData.bodyColor When used in a [DayView](https://bryntum.com/products/calendar/docs/api/Calendar/widget/DayView), this color is applied to the body of the event element. Note that this must be light enough that the text colour (From the SASS variable `$dayview-event-color`) is visible
     * @param {boolean} detail.renderData.showBullet If there is no `iconCls`, and the event is not recurring, then by default a "bullet" circular icon is shown if the view's [showBullet](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#config-showBullet) if set. Setting this property in an event renderer overrides this behaviour.
     * @returns {DomConfig,DomConfig[],string,void}
     */
    eventRenderer ? : ((detail: { view: CalendarView, eventRecord: EventModel, resourceRecord: ResourceModel, renderData: { style: object, cls: object, iconStyle: object, iconCls: object, eventColor: string, dataset: object, solidBar: boolean, bodyColor: string, showBullet: boolean } }) => DomConfig|DomConfig[]|string|void)|string
    /**
     * A function which compares events which some views use to decide upon rendering order.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-eventSorter)
     * @param {Scheduler.model.EventModel,EventBar} lhs The left side value to conpare
     * @param {Scheduler.model.EventModel,EventBar} rhs The right side value to conpare
     * @returns {number}
     */
    eventSorter ? : (lhs: EventModel|EventBar, rhs: EventModel|EventBar) => number
    /**
     * By default, the end date of an all day event is displayed in the UI as
     * the last calendar date on which the event falls. For most end users, this is the
     * expected value.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-extendAllDayEndDay)
     */
    extendAllDayEndDay ? : boolean
    extraData ? : any
    /**
     * If this is set to `true`, then when determining which assigned resource of a multi assigned event
     * to use to create the event UI, the first resource which is still selected in the
     * [resourceFilter](https://bryntum.com/products/calendar/docs/api/Calendar/widget/Sidebar#property-resourceFilter) is used.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-filterEventResources)
     */
    filterEventResources ? : boolean
    /**
     * When this widget is a child of a [Container](https://bryntum.com/products/calendar/docs/api/Core/widget/Container), it will by default be participating in a
     * flexbox layout. This config allows you to set this widget's
     * [flex](https://developer.mozilla.org/en-US/docs/Web/CSS/flex) style.
     * This may be configured as a single number or a `&lt;flex-grow&gt; &lt;flex-shrink&gt; &lt;flex-basis&gt;` format string.
     * numeric-only values are interpreted as the `flex-grow` value.
     */
    flex ? : number|string
    /**
     * Set to `true` to move the widget out of the document flow and position it
     * absolutely in browser viewport space.
     */
    floating ? : boolean
    /**
     * Config object of a footer. May contain a `dock`, `html` and a `cls` property. A footer is not a widget,
     * but rather plain HTML that follows the last element of the panel's body and [strips](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-strips).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-footer)
     */
    footer ? : {
        dock?: 'top'|'right'|'bottom'|'left'|'start'|'end'
        html?: string
        cls?: string
    }|string
    /**
     * A Function (or name of a function in the ownership hierarchy) which returns the
     * [resource record](https://bryntum.com/products/calendar/docs/api/Scheduler/model/ResourceModel) to use to create the UI for an event.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-getPrimaryResource)
     * @param {Scheduler.model.EventModel} eventRecord The event from which to extract the primary resource.
     * @returns {Scheduler.model.ResourceModel} The resource to be used to render the event.
     */
    getPrimaryResource ? : ((eventRecord: EventModel) => ResourceModel)|string
    /**
     * A config [object](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#typedef-PanelHeader) for the panel's header or a string in place of a `title`.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-header)
     */
    header ? : string|boolean|PanelHeader
    /**
     * Widget's height, used to set element `style.height`. Either specify a valid height string or a number,
     * which will get 'px' appended. We recommend using CSS as the primary way to control height, but in some
     * cases this config is convenient.
     */
    height ? : string|number
    /**
     * Configure with true to make widget initially hidden.
     */
    hidden ? : boolean
    /**
     * *Only valid if this Widget is [floating](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-floating).*
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-hideAnimation)
     */
    hideAnimation ? : boolean|object
    /**
     * Configure this as `true` to hide child views which have no events.
     */
    hideEmptyResources ? : boolean
    /**
     * Set to `true` to hide non-working days
     */
    hideNonWorkingDays ? : boolean
    /**
     * Specify `true` to make this container hide when it has no visible children (Either empty
     * or all children hidden).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-hideWhenEmpty)
     */
    hideWhenEmpty ? : boolean
    /**
     * An icon to show before the [title](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-title). Either pass a CSS class as a string, or pass a
     * [DomConfig](https://bryntum.com/products/calendar/docs/api/Core/helper/DomHelper#typedef-DomConfig) object describing an element to represent the icon.
     */
    icon ? : string|DomConfig
    /**
     * Widget id, if not specified one will be generated. Also used for lookups through Widget.getById
     */
    id ? : string
    /**
     * Determines if the widgets read-only state should be controlled by its parent.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-ignoreParentReadOnly)
     */
    ignoreParentReadOnly ? : boolean
    /**
     * When [ResourceTimeRangeModel](https://bryntum.com/products/calendar/docs/api/Scheduler/model/ResourceTimeRangeModel)s are included in the data, they
     * are only rendered in subviews of [ResourceView](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView)s and normal
     * [TimeRangeModel](https://bryntum.com/products/calendar/docs/api/Calendar/model/TimeRangeModel)s are <strong>not</strong> rendered in subviews of
     * [ResourceView](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView)s.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-includeTimeRanges)
     */
    includeTimeRanges ? : boolean
    /**
     * Convenience setting to align input fields of child widgets. By default, the Field input element is
     * placed immediately following the `label`. If you prefer to have all input fields aligned to the
     * right, set this config to `'end'`.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-inputFieldAlign)
     */
    inputFieldAlign ? : 'start'|'end'
    /**
     * Element (or element id) to insert this widget before. If provided, [appendTo](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-appendTo) config is ignored.
     */
    insertBefore ? : HTMLElement|string
    /**
     * Element (or element id) to append this widget element to, as a first child. If provided, [appendTo](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-appendTo) config is ignored.
     */
    insertFirst ? : HTMLElement|string
    /**
     * An optional CSS class to add to child items of this container.
     */
    itemCls ? : string
    /**
     * An object containing typed child widget config objects or Widgets. May also be specified
     * as an array.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-items)
     */
    items ? : Record<string, CalendarContainerItemConfig|MenuItemEntry>|(CalendarContainerItemConfig|MenuItemEntry|Widget)[]
    /**
     * An object whose keys are the [key](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key) name
     * and optional modifier prefixes: `'Ctrl+'`, `'Alt+'`, `'Meta+'`, and `'Shift+'` (case-insensitive). The values
     * are the name of the instance method to call when the keystroke is received.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-keyMap)
     */
    keyMap ? : Record<string, KeyMapConfig>
    /**
     * Convenience setting to use same label placement on all child widgets.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-labelPosition)
     */
    labelPosition ? : 'before'|'above'|'align-before'|'auto'|null
    /**
     * The short name of a helper class which manages rendering and styling of child items.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-layout)
     */
    layout ? : string|CalendarContainerLayoutConfig
    /**
     * The CSS style properties to apply to the [contentElement](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#property-contentElement).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-layoutStyle)
     */
    layoutStyle ? : object
    /**
     * An array of [child item](https://bryntum.com/products/calendar/docs/api/Core/widget/Container#config-items) *config objects* which is to be converted into
     * instances only when this Container is rendered, rather than eagerly at construct time.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-lazyItems)
     */
    lazyItems ? : Record<string, CalendarContainerItemConfig>|CalendarContainerItemConfig[]|Widget[]
    /**
     * The listener set for this object.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-listeners)
     */
    listeners ? : ResourceViewListeners
    /**
     * A class translations of which are used for translating this entity.
     * This is often used when translations of an item are defined on its container class.
     * For example:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-localeClass)
     */
    localeClass ? : typeof Base
    /**
     * Set to `false` to disable localization of this object.
     */
    localizable ? : boolean
    /**
     * List of properties which values should be translated automatically upon a locale applying.
     * In case there is a need to localize not typical value (not a String value or a field with re-defined setter/getter),
     * you could use 'localeKey' meta configuration.
     * Example:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-localizableProperties)
     */
    localizableProperties ? : string[]
    /**
     * Widget's margin. This may be configured as a single number or a `TRBL` format string.
     * numeric-only values are interpreted as pixels.
     */
    margin ? : number|string
    /**
     * This config object contains the defaults for the [Mask](https://bryntum.com/products/calendar/docs/api/Core/widget/Mask) created for the
     * [masked](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-masked) config. Any properties specified in the `masked` config will override these
     * values.
     */
    maskDefaults ? : MaskConfig
    /**
     * Set to `true` to apply the default mask to the widget. Alternatively, this can be the mask message or a
     * [Mask](https://bryntum.com/products/calendar/docs/api/Core/widget/Mask) config object.
     */
    masked ? : boolean|string|MaskConfig
    /**
     * The maximum date to which the `endDate` of this view may be navigated.
     */
    maxDate ? : Date|string
    /**
     * The element's maxHeight. Can be either a String or a Number (which will have 'px' appended). Note that
     * like [height](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-height), *reading* the value will return the numeric value in pixels.
     */
    maxHeight ? : string|number
    /**
     * *Only valid if this Widget is [floating](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-floating).*
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-maximizeOnMobile)
     */
    maximizeOnMobile ? : number|string
    /**
     * The elements maxWidth. Can be either a String or a Number (which will have 'px' appended). Note that
     * like [width](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-width), *reading* the value will return the numeric value in pixels.
     */
    maxWidth ? : string|number
    /**
     * A field name or a function returning a string to be displayed below resource name in the resource view
     * headers.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-meta)
     * @param {Scheduler.model.ResourceModel} resource Displayed resource
     * @returns {string} Text to be displayed below resource name
     */
    meta ? : string|((resource: ResourceModel) => string)
    /**
     * The minimum date to which the `startDate` of this view may be navigated.
     */
    minDate ? : Date|string
    /**
     * The element's minHeight. Can be either a String or a Number (which will have 'px' appended). Note that
     * like [height](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-height), *reading* the value will return the numeric value in pixels.
     */
    minHeight ? : string|number
    /**
     * The elements minWidth. Can be either a String or a Number (which will have 'px' appended). Note that
     * like [width](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-width), *reading* the value will return the numeric value in pixels.
     */
    minWidth ? : string|number
    /**
     * When this is configured as `true` a [ResizeObserver](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver)
     * is used to monitor this element for size changes caused by either style manipulation, or by CSS
     * layout.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-monitorResize)
     */
    monitorResize ? : boolean|{
        immediate?: boolean
    }
    /**
     * An object containing default config objects which may be referenced by name in the [items](https://bryntum.com/products/calendar/docs/api/Core/widget/Container#config-items)
     * config. For example, a specialized [Menu](https://bryntum.com/products/calendar/docs/api/Core/widget/Menu) subclass may have a `namedItems` default
     * value defined like this:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-namedItems)
     */
    namedItems ? : Record<string, CalendarContainerItemConfig>
    /**
     * Non-working days as an object where keys are day indices, 0-6 (Sunday-Saturday), and the value is `true`.
     * Defaults to [nonWorkingDays](https://bryntum.com/products/calendar/docs/api/Core/helper/DateHelper#property-nonWorkingDays-static).
     */
    nonWorkingDays ? : Record<number, boolean>
    /**
     * The class name to add to events which have an end date in the past. Defaults to `'b-past-event'`.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-pastEventCls)
     */
    pastEventCls ? : string
    /**
     * Set to `true` when a widget is rendered into another widget's [contentElement](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#property-contentElement), but must
     * not participate in the standard layout of that widget, and must be positioned relatively to that
     * widget's [contentElement](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#property-contentElement).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-positioned)
     */
    positioned ? : boolean
    /**
     * Prevent tooltip from being displayed on touch devices. Useful for example for buttons that display a
     * menu on click etc, since the tooltip would be displayed at the same time.
     */
    preventTooltipOnTouch ? : boolean
    /**
     * <strong>If</strong> the displayed [view](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-view) is a [DateRangeOwner](#Calendar/widget/mixin/DateRangeOwner),
     * this may be used to set the [range](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/DateRangeOwner#config-range)
     * of all child views.
     */
    range ? : string|DurationConfig
    /**
     * Whether this widget is read-only.  This is only valid if the widget is an input
     * field, <strong>or contains input fields at any depth</strong>.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-readOnly)
     */
    readOnly ? : boolean
    relayStoreEvents ? : boolean
    /**
     * Either a default `rendition` to apply to all child widgets, or a map of renditions keyed by child widget
     * `type`.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-rendition)
     */
    rendition ? : string|Record<string, string>|null
    /**
     * Path to load resource images from. Used by the [showResourceAvatars](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#config-showResourceAvatars) config
     * to create URLs using the resource's
     * [image](https://bryntum.com/products/calendar/docs/api/Scheduler/model/ResourceModel#field-image) or
     * [imageUrl](https://bryntum.com/products/calendar/docs/api/Scheduler/model/ResourceModel#field-imageUrl) fields:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-resourceImagePath)
     */
    resourceImagePath ? : string
    /**
     * The width of a resource calendar panel (view always stretches to fill window)
     */
    resourceWidth ? : number|string
    /**
     * Specifies the various responsive state objects keyed by their name. Each key (except `'*'`, see below) in
     * this object is a state name (see [responsiveState](https://bryntum.com/products/calendar/docs/api/Core/widget/mixin/Responsive#config-responsiveState)) and its corresponding value is the
     * associated [ResponsiveState](https://bryntum.com/products/calendar/docs/api/Core/widget/mixin/Responsive#typedef-ResponsiveState) object.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-responsive)
     */
    responsive ? : object
    /**
     * Set to `true` to mark this instance as the default [responsiveTarget](https://bryntum.com/products/calendar/docs/api/Core/widget/mixin/Responsive#config-responsiveTarget) for descendants that do
     * not specify an explicit [responsiveTarget](https://bryntum.com/products/calendar/docs/api/Core/widget/mixin/Responsive#config-responsiveTarget) of their own.
     */
    responsiveRoot ? : boolean
    /**
     * The name of the active state of the [responsive](https://bryntum.com/products/calendar/docs/api/Core/widget/mixin/Responsive#config-responsive) config. This is assigned internally
     * and should not be assigned directly.
     */
    responsiveState ? : string
    /**
     * The widget whose size and other properties drive this object's responsive behavior. If this config is not
     * specified, the closest ancestor that specified [responsiveRoot=true](https://bryntum.com/products/calendar/docs/api/Core/widget/mixin/Responsive#config-responsiveRoot) will be
     * used. If there is no such ancestor, then the instance using this mixin is used.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-responsiveTarget)
     */
    responsiveTarget ? : string|Widget
    /**
     * Configure as `true` to have the component display a translucent ripple when its
     * [focusElement](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#property-focusElement), or [element](#Core/widget/Widget#property-element) is tapped <em>if the
     * current theme supports ripples</em>. Out of the box, only the Material theme supports ripples.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-ripple)
     */
    ripple ? : boolean|{
        delegate?: string
        color?: string
        radius?: number
        clip?: string
    }
    /**
     * If you are rendering this widget to a shadow root inside a web component, set this config to the shadowRoot. If not inside a web component, set it to `document.body`
     */
    rootElement ? : ShadowRoot|HTMLElement
    /**
     * This may be configured as `true` to make the widget's element use the `direction:rtl` style.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-rtl)
     */
    rtl ? : boolean
    /**
     * Specifies whether (and optionally in which axes) a Widget may scroll. `true` means this widget may scroll
     * in both axes. May be an object containing boolean `overflowX` and `overflowY` properties which are
     * applied to CSS style properties `overflowX` and `overflowY`. If they are boolean, they are translated to
     * CSS overflow properties thus:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-scrollable)
     */
    scrollable ? : boolean|ScrollerConfig|Scroller
    /**
     * Defines what to do if document is scrolled while Widget is visible (only relevant when floating is set to `true`).
     * Valid values: ´null´: do nothing, ´hide´: hide the widget or ´realign´: realign to the target if possible.
     */
    scrollAction ? : 'hide'|'realign'|null
    /**
     * A button configuration object to use for the automatically created mode selector button for this mode.
     */
    selectorButton ? : ButtonConfig
    /**
     * A menu item configuration object to use for the automatically created mode selector menu item for this mode.
     */
    selectorMenuItem ? : MenuItemConfig
    /**
     * A [DateHelper](https://bryntum.com/products/calendar/docs/api/Core/helper/DateHelper) format string/function to use to create date output for
     * abbreviated view descriptions.
     * @param {Date} date The date to format.
     * @returns {string} The formatted date.
     */
    shortDateFormat ? : string|((date: Date) => string)
    /**
     * A [DateHelper](https://bryntum.com/products/calendar/docs/api/Core/helper/DateHelper) format string/function to use to create date and time output for
     * abbreviated view descriptions.
     * @param {Date} date The date to format.
     * @returns {string} The formatted date.
     */
    shortDateTimeFormat ? : string|((date: Date) => string)
    /**
     * The class name to add to events which have duration less than or equal to
     * [shortEventDuration](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#config-shortEventDuration).
     */
    shortEventCls ? : string
    /**
     * The duration at which below and equal to this value, an event's encapsulating element gets
     * the [shortEventCls](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#config-shortEventCls) added to it so that small event bars can have style rearrangements.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-shortEventDuration)
     */
    shortEventDuration ? : string|number
    /**
     * *Only valid if this Widget is [floating](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-floating).*
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-showAnimation)
     */
    showAnimation ? : boolean|object
    /**
     * Display an avatar in the resource view headers, either as an image or using resource initials.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-showAvatars)
     */
    showAvatars ? : boolean
    /**
     * <strong>Not applicable in a `DayView`</strong>
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-showBullet)
     * @param {boolean} bar This is `false` by default. Set this to `true` in modes where a solid event bar should show a bullet icon
     * @param {boolean} noBar This is `true` by default. Events with no background colour, use this to show the event's defined `eventColor`
     */
    showBullet ? : boolean|{bar?: boolean, noBar?: boolean}
    /**
     * Configure as `true` to show avatars of the assigned resources (calendars) at the
     * start of the event bar.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-showResourceAvatars)
     */
    showResourceAvatars ? : boolean|string
    /**
     * Set to `false` to not show the tooltip when this widget is [disabled](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#property-disabled)
     */
    showTooltipWhenDisabled ? : boolean
    /**
     * Programmatic control over how many columns to span when used in a grid layout.
     */
    span ? : number
    /**
     * By default, the resource views are displayed in the order that the resources appear
     * in the project's `resourceStore`, so they will appear in a stable position, meaning
     * when a view is filtered out, then filtering it in will replace it in the same position.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-stableResourceOrder)
     */
    stableResourceOrder ? : boolean
    /**
     * This value can be one of the following:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-stateful)
     */
    stateful ? : boolean|object|string[]
    /**
     * The events that, when fired by this component, should trigger it to save its state by calling
     * [saveState](https://bryntum.com/products/calendar/docs/api/Core/mixin/State#function-saveState).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-statefulEvents)
     */
    statefulEvents ? : object|string[]
    /**
     * The key to use when saving this object's state in the [stateProvider](https://bryntum.com/products/calendar/docs/api/Core/mixin/State#config-stateProvider). If this config is
     * not assigned, and [stateful](https://bryntum.com/products/calendar/docs/api/Core/mixin/State#config-stateful) is not set to `false`, the [id](#Core/widget/Widget#config-id)
     * (if explicitly specified) will be used as the `stateId`.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-stateId)
     */
    stateId ? : string
    /**
     * The `StateProvider` to use to save and restore this object's [state](https://bryntum.com/products/calendar/docs/api/Core/mixin/State#property-state). By default, `state`
     * will be saved using the [default state provider](https://bryntum.com/products/calendar/docs/api/Core/state/StateProvider#property-instance-static).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-stateProvider)
     */
    stateProvider ? : StateProvider
    /**
     * Specify `true` to match fields by their `name` property only when assigning a [record](https://bryntum.com/products/calendar/docs/api/Core/widget/Container#config-record),
     * without falling back to `ref`.
     */
    strictRecordMapping ? : boolean
    /**
     * An object containing widgets keyed by name. By default (when no `type` is given), strips are
     * [toolbars](https://bryntum.com/products/calendar/docs/api/Core/widget/Toolbar). If you want to pass an array, you can use
     * the toolbar's [items](https://bryntum.com/products/calendar/docs/api/Core/widget/Container#config-items).
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-strips)
     */
    strips ? : Record<string, CalendarContainerItemConfig>
    /**
     * The converse of [syncViewDate](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#property-syncViewDate)
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-syncCalendarDate)
     */
    syncCalendarDate ? : boolean
    /**
     * The converse of [syncCalendarDate](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#property-syncCalendarDate)
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-syncViewDate)
     */
    syncViewDate ? : boolean
    /**
     * A configuration for the [tab](https://bryntum.com/products/calendar/docs/api/Core/widget/Tab) created for this widget when it is placed in a
     * [TabPanel](https://bryntum.com/products/calendar/docs/api/Core/widget/TabPanel). For example, this config can be used to control the icon of the `tab` for
     * this widget:
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-tab)
     */
    tab ? : boolean|TabConfig
    /**
     * When this container is used as a tab in a TabPanel, these items are added to the
     * [TabBar](https://bryntum.com/products/calendar/docs/api/Core/widget/TabBar) when this container is the active tab.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-tabBarItems)
     */
    tabBarItems ? : ToolbarItems[]|Widget[]
    /**
     * The tag name of this Widget's root element
     */
    tag ? : string
    /**
     * A Config object representing the configuration of a [Toolbar](https://bryntum.com/products/calendar/docs/api/Core/widget/Toolbar),
     * or array of config objects representing the child items of a Toolbar.
     * This creates a toolbar docked to the top of the panel immediately below the header.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-tbar)
     */
    tbar ? : (CalendarContainerItemConfig|string)[]|ToolbarConfig|PagingToolbarConfig|null
    /**
     * Text alignment: 'left', 'center' or 'right'. Also accepts direction neutral 'start' and 'end'.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-textAlign)
     */
    textAlign ? : 'left'|'center'|'right'|'start'|'end'
    /**
     * A [DateHelper](https://bryntum.com/products/calendar/docs/api/Core/helper/DateHelper) format string/function used to format the time displayed in events
     * @param {Date} date The date to format.
     * @returns {string} The formatted date.
     */
    timeFormat ? : string|((date: Date) => string)
    /**
     * A title to display in the header or owning TabPanel. Causes creation and docking of a header
     * to the top if no header is configured.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-title)
     */
    title ? : string
    /**
     * The [tools](https://bryntum.com/products/calendar/docs/api/Core/widget/Tool) to add either before or after the `title` in the Panel header. Each
     * property name is the reference by which an instantiated tool may be retrieved from the live
     * `[tools](https://bryntum.com/products/calendar/docs/api/Core/widget/mixin/Toolable#property-tools)` property.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-tools)
     */
    tools ? : Record<string, ToolConfig>|null
    /**
     * Tooltip for the widget, either as a string or as a Tooltip config object.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-tooltip)
     */
    tooltip ? : string|TooltipConfig|null
    /**
     * By default, tabbing within a Panel is not contained, ie you can TAB out of the Panel
     * forwards or backwards.
     * Configure this as `true` to disallow tabbing out of the Panel, and make tabbing circular within this Panel.
     */
    trapFocus ? : boolean
    type ? : 'resourceview'|'resource'
    /**
     * Custom CSS class name suffixes to apply to the elements rendered by this widget. This may be specified
     * as a space separated string, an array of strings, or as an object in which property names with truthy
     * values are used as the class names.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-ui)
     */
    ui ? : 'plain'|'toolbar'|string|object
    /**
     * A config object used to configure the sub views. The default `type` used is `'weekview'`
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-view)
     */
    view ? : CalendarContainerItemConfig|Record<string, any>
    /**
     * The space to leave between each subview.
     */
    viewGap ? : string|number
    /**
     * The week start day, 0 meaning Sunday, 6 meaning Saturday.
     * Defaults to [weekStartDay](https://bryntum.com/products/calendar/docs/api/Core/helper/DateHelper#property-weekStartDay-static).
     */
    weekStartDay ? : number
    /**
     * A widgets weight determines its position among siblings when added to a [Container](https://bryntum.com/products/calendar/docs/api/Core/widget/Container).
     * Higher weights go further down.
     */
    weight ? : number
    /**
     * Widget's width, used to set element `style.width`. Either specify a valid width string or a number, which
     * will get 'px' appended. We recommend using CSS as the primary way to control width, but in some cases
     * this config is convenient.
     */
    width ? : string|number
    /**
     * The x position for the widget.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-x)
     */
    x ? : number
    /**
     * The y position for the widget.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#config-y)
     */
    y ? : number

}

@Component({
    selector : 'bryntum-resource-view',
    template : ''
})
export class BryntumResourceViewComponent implements OnInit, OnDestroy {

    public static instanceClass = ResourceView;

    public static instanceName = 'ResourceView';

    private static bryntumEvents: string[] = [
        'onBeforeAutoCreate',
        'onBeforeChangeDate',
        'onBeforeDestroy',
        'onBeforeHide',
        'onBeforeResponsiveStateChange',
        'onBeforeSetRecord',
        'onBeforeShow',
        'onBeforeStateApply',
        'onBeforeStateSave',
        'onCatchAll',
        'onCollapse',
        'onDestroy',
        'onDirtyStateChange',
        'onElementCreated',
        'onEventAutoCreated',
        'onExpand',
        'onFocusIn',
        'onFocusOut',
        'onHide',
        'onPaint',
        'onReadOnly',
        'onRecompose',
        'onRefresh',
        'onResize',
        'onResponsiveStateChange',
        'onShow',
        'onToolClick',
        'onViewCreate'
    ];

    private static bryntumFeatureNames: string[] = [

    ];

    private static bryntumConfigs: string[] = BryntumResourceViewComponent.bryntumFeatureNames.concat([
        'activationKey',
        'adopt',
        'align',
        'alignSelf',
        'allowDragCreate',
        'allowDragMove',
        'allowDragResize',
        'anchor',
        'animateTimeShift',
        'appendTo',
        'ariaDescription',
        'ariaLabel',
        'autoCreate',
        'bbar',
        'bodyCls',
        'border',
        'bubbleEvents',
        'callOnFunctions',
        'catchEventHandlerExceptions',
        'centered',
        'cls',
        'collapsed',
        'collapsible',
        'color',
        'column',
        'config',
        'constrainTo',
        'contentElementCls',
        'dataField',
        'dataset',
        'dateFormat',
        'dateSeparator',
        'defaultBindProperty',
        'defaultFocus',
        'defaults',
        'defaultScrollOptions',
        'descriptionFormat',
        'descriptionRenderer',
        'detectCSSCompatibilityIssues',
        'disabled',
        'dock',
        'draggable',
        'dragUnit',
        'drawer',
        'elementAttributes',
        'eventHeaderRenderer',
        'eventHeight',
        'eventRenderer',
        'eventSorter',
        'extendAllDayEndDay',
        'extraData',
        'filterEventResources',
        'flex',
        'floating',
        'footer',
        'getPrimaryResource',
        'header',
        'height',
        'hidden',
        'hideAnimation',
        'hideEmptyResources',
        'hideNonWorkingDays',
        'hideWhenEmpty',
        'icon',
        'id',
        'ignoreParentReadOnly',
        'includeTimeRanges',
        'inputFieldAlign',
        'insertBefore',
        'insertFirst',
        'itemCls',
        'items',
        'keyMap',
        'labelPosition',
        'layout',
        'layoutStyle',
        'lazyItems',
        'listeners',
        'localeClass',
        'localizable',
        'localizableProperties',
        'margin',
        'maskDefaults',
        'masked',
        'maxDate',
        'maxHeight',
        'maximizeOnMobile',
        'maxWidth',
        'meta',
        'minDate',
        'minHeight',
        'minWidth',
        'monitorResize',
        'namedItems',
        'nonWorkingDays',
        'pastEventCls',
        'positioned',
        'preventTooltipOnTouch',
        'range',
        'readOnly',
        'relayStoreEvents',
        'rendition',
        'resourceImagePath',
        'resourceWidth',
        'responsive',
        'responsiveRoot',
        'responsiveState',
        'responsiveTarget',
        'ripple',
        'rootElement',
        'rtl',
        'scrollable',
        'scrollAction',
        'selectorButton',
        'selectorMenuItem',
        'shortDateFormat',
        'shortDateTimeFormat',
        'shortEventCls',
        'shortEventDuration',
        'showAnimation',
        'showAvatars',
        'showBullet',
        'showResourceAvatars',
        'showTooltipWhenDisabled',
        'span',
        'stableResourceOrder',
        'stateful',
        'statefulEvents',
        'stateId',
        'stateProvider',
        'strictRecordMapping',
        'strips',
        'syncCalendarDate',
        'syncViewDate',
        'tab',
        'tabBarItems',
        'tag',
        'tbar',
        'textAlign',
        'timeFormat',
        'title',
        'tools',
        'tooltip',
        'trapFocus',
        'type',
        'ui',
        'view',
        'viewGap',
        'weekStartDay',
        'weight',
        'width',
        'x',
        'y'
    ]);

    private static bryntumConfigsOnly: string[] = [
        'activationKey',
        'adopt',
        'align',
        'anchor',
        'ariaDescription',
        'ariaLabel',
        'bbar',
        'bodyCls',
        'border',
        'bubbleEvents',
        'centered',
        'collapsible',
        'color',
        'config',
        'constrainTo',
        'contentElementCls',
        'dataField',
        'defaultBindProperty',
        'defaultFocus',
        'defaults',
        'descriptionRenderer',
        'detectCSSCompatibilityIssues',
        'dock',
        'draggable',
        'drawer',
        'elementAttributes',
        'eventHeaderRenderer',
        'eventHeight',
        'eventRenderer',
        'eventSorter',
        'floating',
        'footer',
        'getPrimaryResource',
        'header',
        'hideAnimation',
        'hideWhenEmpty',
        'icon',
        'ignoreParentReadOnly',
        'includeTimeRanges',
        'itemCls',
        'lazyItems',
        'listeners',
        'localeClass',
        'localizable',
        'localizableProperties',
        'maskDefaults',
        'masked',
        'meta',
        'monitorResize',
        'namedItems',
        'positioned',
        'preventTooltipOnTouch',
        'relayStoreEvents',
        'resourceImagePath',
        'responsive',
        'responsiveRoot',
        'responsiveState',
        'responsiveTarget',
        'ripple',
        'rootElement',
        'scrollAction',
        'selectorButton',
        'selectorMenuItem',
        'shortEventCls',
        'shortEventDuration',
        'showAnimation',
        'showAvatars',
        'showBullet',
        'showResourceAvatars',
        'showTooltipWhenDisabled',
        'stableResourceOrder',
        'stateful',
        'statefulEvents',
        'stateId',
        'stateProvider',
        'strips',
        'tab',
        'tabBarItems',
        'tag',
        'tbar',
        'textAlign',
        'timeFormat',
        'trapFocus',
        'type',
        'ui',
        'weekStartDay',
        'weight'
    ];

    private static bryntumProps: string[] = BryntumResourceViewComponent.bryntumFeatureNames.concat([
        'alignSelf',
        'allowDragCreate',
        'allowDragMove',
        'allowDragResize',
        'anchorSize',
        'animateTimeShift',
        'appendTo',
        'autoCreate',
        'callOnFunctions',
        'catchEventHandlerExceptions',
        'cls',
        'collapsed',
        'column',
        'dataset',
        'dateFormat',
        'dateSeparator',
        'dayCellCls',
        'defaultScrollOptions',
        'descriptionFormat',
        'disabled',
        'dragUnit',
        'extendAllDayEndDay',
        'extraData',
        'filterEventResources',
        'firstVisibleCell',
        'firstVisibleDate',
        'flex',
        'focusVisible',
        'hasChanges',
        'height',
        'hidden',
        'hideEmptyResources',
        'hideNonWorkingDays',
        'id',
        'inputFieldAlign',
        'insertBefore',
        'insertFirst',
        'isSettingValues',
        'isValid',
        'items',
        'keyMap',
        'labelPosition',
        'lastVisibleCell',
        'lastVisibleDate',
        'layout',
        'layoutStyle',
        'margin',
        'maxDate',
        'maxHeight',
        'maximizeOnMobile',
        'maxWidth',
        'minDate',
        'minHeight',
        'minWidth',
        'nonWorkingDays',
        'parent',
        'pastEventCls',
        'range',
        'readOnly',
        'record',
        'rendition',
        'resourceWidth',
        'rtl',
        'scrollable',
        'shortDateFormat',
        'shortDateTimeFormat',
        'span',
        'state',
        'strictRecordMapping',
        'syncCalendarDate',
        'syncViewDate',
        'title',
        'tools',
        'tooltip',
        'values',
        'view',
        'viewGap',
        'width',
        'x',
        'y'
    ]);

    private elementRef: ElementRef;
    public instance!: ResourceView;

    private bryntumConfig = {
        adopt            : undefined,
        appendTo         : undefined,
        href             : undefined,
        angularComponent : this,
        features         : {},
        listeners        : {}
    };

    constructor(element: ElementRef) {
        this.elementRef = element;
    }

    // Configs only
    @Input() activationKey                ! : string;
    @Input() adopt                        ! : HTMLElement|string;
    @Input() align                        ! : AlignSpec|string;
    @Input() anchor                       ! : boolean;
    @Input() ariaDescription              ! : string;
    @Input() ariaLabel                    ! : string;
    @Input() bbar                         ! : (CalendarContainerItemConfig|string)[]|ToolbarConfig|PagingToolbarConfig|null;
    @Input() bodyCls                      ! : string|object;
    @Input() border                       ! : boolean;
    @Input() bubbleEvents                 ! : object;
    @Input() centered                     ! : boolean;
    @Input() collapsible                  ! : boolean|PanelCollapserConfig|PanelCollapserOverlayConfig;
    @Input() color                        ! : Color;
    @Input() config                       ! : object;
    @Input() constrainTo                  ! : HTMLElement|Widget|Rectangle;
    @Input() contentElementCls            ! : string|object;
    @Input() dataField                    ! : string;
    @Input() defaultBindProperty          ! : string;
    @Input() defaultFocus                 ! : ((widget: Widget) => boolean)|string;
    @Input() defaults                     ! : CalendarContainerItemConfig;
    @Input() descriptionRenderer          ! : (view: Widget) => string;
    @Input() detectCSSCompatibilityIssues ! : boolean;
    @Input() dock                         ! : 'top'|'bottom'|'left'|'right'|'start'|'end'|'header'|'pre-header'|object;
    @Input() draggable                    ! : boolean|{
        handleSelector?: string
    };
    @Input() drawer                       ! : boolean|{side?: 'start'|'left'|'end'|'right'|'top'|'bottom', size?: string|number, inline?: boolean, autoClose: { mousedown?: boolean|string, focusout?: boolean|string, mouseout?: string }, autoCloseDelay?: number};
    @Input() elementAttributes            ! : Record<string, string|null>;
    @Input() eventHeaderRenderer          ! : ((detail: { view: CalendarView, eventRecord: EventModel, resourceRecord: ResourceModel, renderData: { style: object, cls: object, iconStyle: object, iconCls: object, eventColor: string, dataset: object, solidBar: boolean, bodyColor: string }, showBullet: boolean }) => DomConfig|DomConfig[]|string|void)|string;
    @Input() eventHeight                  ! : number|string;
    @Input() eventRenderer                ! : ((detail: { view: CalendarView, eventRecord: EventModel, resourceRecord: ResourceModel, renderData: { style: object, cls: object, iconStyle: object, iconCls: object, eventColor: string, dataset: object, solidBar: boolean, bodyColor: string, showBullet: boolean } }) => DomConfig|DomConfig[]|string|void)|string;
    @Input() eventSorter                  ! : (lhs: EventModel|EventBar, rhs: EventModel|EventBar) => number;
    @Input() floating                     ! : boolean;
    @Input() footer                       ! : {
        dock?: 'top'|'right'|'bottom'|'left'|'start'|'end'
        html?: string
        cls?: string
    }|string;
    @Input() getPrimaryResource           ! : ((eventRecord: EventModel) => ResourceModel)|string;
    @Input() header                       ! : string|boolean|PanelHeader;
    @Input() hideAnimation                ! : boolean|object;
    @Input() hideWhenEmpty                ! : boolean;
    @Input() icon                         ! : string|DomConfig;
    @Input() ignoreParentReadOnly         ! : boolean;
    @Input() includeTimeRanges            ! : boolean;
    @Input() itemCls                      ! : string;
    @Input() lazyItems                    ! : Record<string, CalendarContainerItemConfig>|CalendarContainerItemConfig[]|Widget[];
    @Input() listeners                    ! : ResourceViewListeners;
    @Input() localeClass                  ! : typeof Base;
    @Input() localizable                  ! : boolean;
    @Input() localizableProperties        ! : string[];
    @Input() maskDefaults                 ! : MaskConfig;
    @Input() masked                       ! : boolean|string|MaskConfig;
    @Input() meta                         ! : string|((resource: ResourceModel) => string);
    @Input() monitorResize                ! : boolean|{
        immediate?: boolean
    };
    @Input() namedItems                   ! : Record<string, CalendarContainerItemConfig>;
    @Input() positioned                   ! : boolean;
    @Input() preventTooltipOnTouch        ! : boolean;
    @Input() relayStoreEvents             ! : boolean;
    @Input() resourceImagePath            ! : string;
    @Input() responsive                   ! : object;
    @Input() responsiveRoot               ! : boolean;
    @Input() responsiveState              ! : string;
    @Input() responsiveTarget             ! : string|Widget;
    @Input() ripple                       ! : boolean|{
        delegate?: string
        color?: string
        radius?: number
        clip?: string
    };
    @Input() rootElement                  ! : ShadowRoot|HTMLElement;
    @Input() scrollAction                 ! : 'hide'|'realign'|null;
    @Input() selectorButton               ! : ButtonConfig;
    @Input() selectorMenuItem             ! : MenuItemConfig;
    @Input() shortEventCls                ! : string;
    @Input() shortEventDuration           ! : string|number;
    @Input() showAnimation                ! : boolean|object;
    @Input() showAvatars                  ! : boolean;
    @Input() showBullet                   ! : boolean|{bar?: boolean, noBar?: boolean};
    @Input() showResourceAvatars          ! : boolean|string;
    @Input() showTooltipWhenDisabled      ! : boolean;
    @Input() stableResourceOrder          ! : boolean;
    @Input() stateful                     ! : boolean|object|string[];
    @Input() statefulEvents               ! : object|string[];
    @Input() stateId                      ! : string;
    @Input() stateProvider                ! : StateProvider;
    @Input() strips                       ! : Record<string, CalendarContainerItemConfig>;
    @Input() tab                          ! : boolean|TabConfig;
    @Input() tabBarItems                  ! : ToolbarItems[]|Widget[];
    @Input() tag                          ! : string;
    @Input() tbar                         ! : (CalendarContainerItemConfig|string)[]|ToolbarConfig|PagingToolbarConfig|null;
    @Input() textAlign                    ! : 'left'|'center'|'right'|'start'|'end';
    @Input() timeFormat                   ! : string|((date: Date) => string);
    @Input() trapFocus                    ! : boolean;
    @Input() type                         ! : 'resourceview'|'resource';
    @Input() ui                           ! : 'plain'|'toolbar'|string|object;
    @Input() weekStartDay                 ! : number;
    @Input() weight                       ! : number;

    // Configs and properties
    @Input() alignSelf                   ! : string;
    @Input() allowDragCreate             ! : boolean;
    @Input() allowDragMove               ! : boolean;
    @Input() allowDragResize             ! : boolean;
    @Input() animateTimeShift            ! : boolean;
    @Input() appendTo                    ! : HTMLElement|string;
    @Input() autoCreate                  ! : {
        gesture?: string
        newName?: Function|string
        step?: string
        snapType?: 'round'|'ceil'|'floor'
        duration?: string
        startHour?: number
    }|string|boolean;
    @Input() callOnFunctions             ! : boolean;
    @Input() catchEventHandlerExceptions ! : boolean;
    @Input() cls                         ! : string|object;
    @Input() collapsed                   ! : boolean;
    @Input() column                      ! : number;
    @Input() dataset                     ! : object|Record<string, string>;
    @Input() dateFormat                  ! : string|((date: Date) => string);
    @Input() dateSeparator               ! : string;
    @Input() defaultScrollOptions        ! : BryntumScrollOptions;
    @Input() descriptionFormat           ! : string|string[]|boolean[]|((date: Date) => string)|Function[];
    @Input() disabled                    ! : boolean|'inert';
    @Input() dragUnit                    ! : string;
    @Input() extendAllDayEndDay          ! : boolean;
    @Input() extraData                   ! : any;
    @Input() filterEventResources        ! : boolean;
    @Input() flex                        ! : number|string;
    @Input() height                      ! : number|string;
    @Input() hidden                      ! : boolean;
    @Input() hideEmptyResources          ! : boolean;
    @Input() hideNonWorkingDays          ! : boolean;
    @Input() id                          ! : string;
    @Input() inputFieldAlign             ! : 'start'|'end';
    @Input() insertBefore                ! : HTMLElement|string;
    @Input() insertFirst                 ! : HTMLElement|string;
    @Input() items                       ! : (CalendarContainerItemConfig|MenuItemConfig|Widget)[]|Record<string, CalendarContainerItemConfig|MenuItemConfig>|Widget[]|Record<string, CalendarContainerItemConfig|MenuItemEntry>|(CalendarContainerItemConfig|MenuItemEntry|Widget)[];
    @Input() keyMap                      ! : Record<string, KeyMapConfig>;
    @Input() labelPosition               ! : 'before'|'above'|'align-before'|'auto'|null;
    @Input() layout                      ! : Layout|string|CalendarContainerLayoutConfig;
    @Input() layoutStyle                 ! : object;
    @Input() margin                      ! : number|string;
    @Input() maxDate                     ! : Date|string;
    @Input() maxHeight                   ! : string|number;
    @Input() maximizeOnMobile            ! : number|string;
    @Input() maxWidth                    ! : string|number;
    @Input() minDate                     ! : Date|string;
    @Input() minHeight                   ! : string|number;
    @Input() minWidth                    ! : string|number;
    @Input() nonWorkingDays              ! : Record<number, boolean>;
    @Input() pastEventCls                ! : string;
    @Input() range                       ! : string|DurationConfig;
    @Input() readOnly                    ! : boolean;
    @Input() rendition                   ! : string|Record<string, string>|null;
    @Input() resourceWidth               ! : number|string;
    @Input() rtl                         ! : boolean;
    @Input() scrollable                  ! : Scroller|boolean|ScrollerConfig;
    @Input() shortDateFormat             ! : string|((date: Date) => string);
    @Input() shortDateTimeFormat         ! : string|((date: Date) => string);
    @Input() span                        ! : number;
    @Input() strictRecordMapping         ! : boolean;
    @Input() syncCalendarDate            ! : boolean;
    @Input() syncViewDate                ! : boolean;
    @Input() title                       ! : string;
    @Input() tools                       ! : Record<string, Tool|ToolConfig>|null|Record<string, Tool>|Record<string, ToolConfig>;
    @Input() tooltip                     ! : string|TooltipConfig|null;
    @Input() view                        ! : CalendarContainerItemConfig|Record<string, any>;
    @Input() viewGap                     ! : string|number;
    @Input() width                       ! : number|string;
    @Input() x                           ! : number;
    @Input() y                           ! : number;

    // Properties only
    @Input() anchorSize       ! : number[];
    @Input() dayCellCls       ! : string;
    @Input() firstVisibleCell ! : HTMLElement;
    @Input() firstVisibleDate ! : Date;
    @Input() focusVisible     ! : boolean;
    @Input() hasChanges       ! : boolean;
    @Input() isSettingValues  ! : boolean;
    @Input() isValid          ! : boolean;
    @Input() lastVisibleCell  ! : HTMLElement;
    @Input() lastVisibleDate  ! : Date;
    @Input() parent           ! : Widget;
    @Input() record           ! : Model;
    @Input() state            ! : any;
    @Input() values           ! : Record<string, object>;

    // Events emitters
    /**
     * This event fires whenever the [autoCreate gesture](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#config-autoCreate) is detected
     * and also when a [drag-create](https://bryntum.com/products/calendar/docs/api/Calendar/feature/CalendarDrag) gesture is detected.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#event-beforeAutoCreate)
     * @param {object} event Event object
     * @param {Event} event.domEvent The DOM event which initiated the creation.
     * @param {Date} event.date *DEPRECATED in favour of `startDate`.* The starting time of the event to be created. If this is in a `DayView`, this will be snapped according to the specification in [autoCreate](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#config-autoCreate)
     * @param {Date} event.startDate The starting time of the event to be created. If this is in a `DayView`, this will be snapped according to the specification in [autoCreate](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#config-autoCreate)
     * @param {Date} event.endDate The ending time of the event to be created.
     * @param {Scheduler.model.ResourceModel} event.resourceRecord The resource if the UI includes a resource.
     * @param {CalendarView} event.view This view.
     */
    @Output() onBeforeAutoCreate: any = new EventEmitter<((event: { domEvent: Event, date: Date, startDate: Date, endDate: Date, resourceRecord: ResourceModel, view: CalendarView }) => Promise<boolean>|boolean|void)|string>();
    /**
     * Triggered before a view's orientating date changes.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#event-beforeChangeDate)
     * @param {object} event Event object
     * @param {Date} event.oldDate The current orientating date of this view.
     * @param {Date} event.date The new date to which this view is to be orientated.
     */
    @Output() onBeforeChangeDate: any = new EventEmitter<((event: { oldDate: Date, date: Date }) => Promise<boolean>|boolean|void)|string>();
    /**
     * Fires before an object is destroyed.
     * @param {object} event Event object
     * @param {Core.Base} event.source The Object that is being destroyed.
     */
    @Output() onBeforeDestroy: any = new EventEmitter<((event: { source: Base }) => void)|string>();
    /**
     * Triggered before a widget is hidden. Return `false` to prevent the action.
     * @param {object} event Event object
     * @param {Core.widget.Widget} event.source The widget being hidden.
     */
    @Output() onBeforeHide: any = new EventEmitter<((event: { source: Widget }) => Promise<boolean>|boolean|void)|string>();
    /**
     * Triggered before a new [responsiveState](https://bryntum.com/products/calendar/docs/api/Core/widget/mixin/Responsive#config-responsiveState) is applied.
     * @param {object} event Event object
     * @param {Core.widget.Widget} event.source The widget whose `responsiveState` is to be changed
     * @param {string} event.state The new value for the widget's `responsiveState`
     * @param {string} event.oldState The previous value for the widget's `responsiveState`
     */
    @Output() onBeforeResponsiveStateChange: any = new EventEmitter<((event: { source: Widget, state: string, oldState: string }) => void)|string>();
    /**
     * Fired before this container will load record values into its child fields. This is useful if you
     * want to modify the UI before data is loaded (e.g. set some input field to be readonly)
     * @param {object} event Event object
     * @param {Core.widget.Container} event.source The container
     * @param {Core.data.Model} event.record The record
     */
    @Output() onBeforeSetRecord: any = new EventEmitter<((event: { source: Container, record: Model }) => void)|string>();
    /**
     * Triggered before a widget is shown. Return `false` to prevent the action.
     * @param {object} event Event object
     * @param {Core.widget.Widget,any} event.source The widget being shown
     */
    @Output() onBeforeShow: any = new EventEmitter<((event: { source: Widget|any }) => Promise<boolean>|boolean|void)|string>();
    /**
     * Fired before state is applied to the source. Allows editing the state object or preventing the operation.
     * @param {object} event Event object
     * @param {any} event.state State object config
     */
    @Output() onBeforeStateApply: any = new EventEmitter<((event: { state: any }) => Promise<boolean>|boolean|void)|string>();
    /**
     * Fired before state is saved by the StateProvider. Allows editing the state object or preventing the operation.
     * @param {object} event Event object
     * @param {any} event.state State object config
     */
    @Output() onBeforeStateSave: any = new EventEmitter<((event: { state: any }) => Promise<boolean>|boolean|void)|string>();
    /**
     * Fires when any other event is fired from the object.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#event-catchAll)
     * @param {object} event Event object
     * @param {{[key: string]: any, type: string}} event.event The Object that contains event details
     * @param {string} event.event.type The type of the event which is caught by the listener
     */
    @Output() onCatchAll: any = new EventEmitter<((event: {[key: string]: any, type: string}) => void)|string>();
    /**
     * Fires when a Panel is collapsed using the [collapsible](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-collapsible) setting.
     * @param {object} event Event object
     * @param {Core.widget.Panel} event.source This Panel.
     */
    @Output() onCollapse: any = new EventEmitter<((event: { source: Panel }) => void)|string>();
    /**
     * Fires when an object is destroyed.
     * @param {object} event Event object
     * @param {Core.Base} event.source The Object that is being destroyed.
     */
    @Output() onDestroy: any = new EventEmitter<((event: { source: Base }) => void)|string>();
    /**
     * Fires when a field is mutated and the state of the [hasChanges](https://bryntum.com/products/calendar/docs/api/Core/widget/Container#property-hasChanges) property changes
     * @param {object} event Event object
     * @param {Core.widget.Container} event.source The container.
     * @param {boolean} event.dirty The dirty state of the Container - `true` if there are any fields which have been changed since initial load.
     */
    @Output() onDirtyStateChange: any = new EventEmitter<((event: { source: Container, dirty: boolean }) => void)|string>();
    /**
     * Triggered when a widget's [element](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#property-element) is available.
     * @param {object} event Event object
     * @param {HTMLElement} event.element The Widget's element.
     */
    @Output() onElementCreated: any = new EventEmitter<((event: { element: HTMLElement }) => void)|string>();
    /**
     * Fired when an [autoCreate](https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#config-autoCreate) gesture has created a new event
     * and added it to the event store.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#event-eventAutoCreated)
     * @param {object} event Event object
     * @param {CalendarView} event.source This Calendar view instance.
     * @param {Scheduler.model.EventModel} event.eventRecord The new event record.
     */
    @Output() onEventAutoCreated: any = new EventEmitter<((event: { source: CalendarView, eventRecord: EventModel }) => void)|string>();
    /**
     * Fires when a Panel is expanded using the [collapsible](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-collapsible) setting.
     * @param {object} event Event object
     * @param {Core.widget.Panel} event.source This Panel.
     */
    @Output() onExpand: any = new EventEmitter<((event: { source: Panel }) => void)|string>();
    /**
     * Fired when focus enters this Widget.
     * @param {object} event Event object
     * @param {Core.widget.Widget} event.source This Widget
     * @param {HTMLElement} event.fromElement The element which lost focus.
     * @param {HTMLElement} event.toElement The element which gained focus.
     * @param {Core.widget.Widget} event.fromWidget The widget which lost focus.
     * @param {Core.widget.Widget} event.toWidget The widget which gained focus.
     * @param {boolean} event.backwards `true` if the `toElement` is before the `fromElement` in document order.
     */
    @Output() onFocusIn: any = new EventEmitter<((event: { source: Widget, fromElement: HTMLElement, toElement: HTMLElement, fromWidget: Widget, toWidget: Widget, backwards: boolean }) => void)|string>();
    /**
     * Fired when focus exits this Widget's ownership tree. This is different from a `blur` event.
     * focus moving from within this Widget's ownership tree, even if there are floating widgets
     * will not trigger this event. This is when focus exits this widget completely.
     * @param {object} event Event object
     * @param {Core.widget.Widget} event.source This Widget
     * @param {HTMLElement} event.fromElement The element which lost focus.
     * @param {HTMLElement} event.toElement The element which gained focus.
     * @param {Core.widget.Widget} event.fromWidget The widget which lost focus.
     * @param {Core.widget.Widget} event.toWidget The widget which gained focus.
     * @param {boolean} event.backwards `true` if the `toElement` is before the `fromElement` in document order.
     */
    @Output() onFocusOut: any = new EventEmitter<((event: { source: Widget, fromElement: HTMLElement, toElement: HTMLElement, fromWidget: Widget, toWidget: Widget, backwards: boolean }) => void)|string>();
    /**
     * Triggered after a widget was hidden
     * @param {object} event Event object
     * @param {Core.widget.Widget} event.source The widget
     */
    @Output() onHide: any = new EventEmitter<((event: { source: Widget }) => void)|string>();
    /**
     * Triggered when a widget which had been in a non-visible state for any reason
     * achieves visibility.
     * ...
     * [View online docs...](https://bryntum.com/products/calendar/docs/api/Calendar/widget/ResourceView#event-paint)
     * @param {object} event Event object
     * @param {Core.widget.Widget} event.source The widget being painted.
     * @param {boolean} event.firstPaint `true` if this is the first paint.
     */
    @Output() onPaint: any = new EventEmitter<((event: { source: Widget, firstPaint: boolean }) => void)|string>();
    /**
     * Fired when a Widget's read only state is toggled
     * @param {object} event Event object
     * @param {boolean} event.readOnly Read only or not
     */
    @Output() onReadOnly: any = new EventEmitter<((event: { readOnly: boolean }) => void)|string>();
    /**
     * This event is fired after a widget's elements have been synchronized due to a direct or indirect call
     * to [recompose](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#function-recompose), if this results in some change to the widget's rendered DOM elements.
     */
    @Output() onRecompose: any = new EventEmitter<(() => void)|string>();
    /**
     * Fires when this ResourceView refreshes.
     * @param {object} event Event object
     * @param {Calendar.widget.ResourceView} event.source The triggering instance.
     */
    @Output() onRefresh: any = new EventEmitter<((event: { source: ResourceView }) => void)|string>();
    /**
     * Fired when the encapsulating element of a Widget resizes *only when [monitorResize](https://bryntum.com/products/calendar/docs/api/Core/widget/Widget#config-monitorResize) is `true`*.
     * @param {object} event Event object
     * @param {Core.widget.Widget} event.source This Widget
     * @param {number} event.width The new width
     * @param {number} event.height The new height
     * @param {number} event.oldWidth The old width
     * @param {number} event.oldHeight The old height
     */
    @Output() onResize: any = new EventEmitter<((event: { source: Widget, width: number, height: number, oldWidth: number, oldHeight: number }) => void)|string>();
    /**
     * Triggered when a new [responsiveState](https://bryntum.com/products/calendar/docs/api/Core/widget/mixin/Responsive#config-responsiveState) is applied.
     * @param {object} event Event object
     * @param {Core.widget.Widget} event.source The widget whose `responsiveState` has changed
     * @param {string} event.state The new value for the widget's `responsiveState`
     * @param {string} event.oldState The previous value for the widget's `responsiveState`
     */
    @Output() onResponsiveStateChange: any = new EventEmitter<((event: { source: Widget, state: string, oldState: string }) => void)|string>();
    /**
     * Triggered after a widget is shown.
     * @param {object} event Event object
     * @param {Core.widget.Widget} event.source The widget
     */
    @Output() onShow: any = new EventEmitter<((event: { source: Widget }) => void)|string>();
    /**
     * A header [tool](https://bryntum.com/products/calendar/docs/api/Core/widget/Panel#config-tools) has been clicked.
     * @param {object} event Event object
     * @param {Core.widget.Tool} event.source This Panel.
     * @param {Core.widget.Tool} event.tool The tool which is being clicked.
     */
    @Output() onToolClick: any = new EventEmitter<((event: { source: Tool, tool: Tool }) => void)|string>();
    /**
     * Fires when a new sub view is created.
     * @param {object} event Event object
     * @param {Calendar.widget.ResourceView} event.source The triggering instance.
     * @param {CalendarView} event.view The newly created sub view.
     */
    @Output() onViewCreate: any = new EventEmitter<((event: { source: ResourceView, view: CalendarView }) => void)|string>();

    /**
     * Create and append the underlying widget
     */
    ngOnInit(): void {
        const
            me = this,
            {
                elementRef,
                bryntumConfig
            } = me,
            {
                instanceClass,
                instanceName,
                bryntumConfigs,
                bryntumEvents
            } = BryntumResourceViewComponent;

        bryntumConfigs.filter(prop => prop in this).forEach(prop => {
            // @ts-ignore
            WrapperHelper.applyPropValue(bryntumConfig, prop, this[prop]);
            if (['features', 'config'].includes(prop)) {
                WrapperHelper.devWarningConfigProp(instanceName, prop);
            }
        });
        // @ts-ignore
        bryntumEvents.filter(event => this[event] && this[event].observers.length > 0).forEach(event => {
            const
                uncapitalize = (str: string) => str.charAt(0).toLowerCase() + str.slice(1),
                eventName = (str: string) => uncapitalize(str.slice(2));

            // @ts-ignore
            bryntumConfig.listeners[eventName(event)] = e => {
                // @ts-ignore
                me[event].emit(e);
                // EventEmitter does not return values in the normal way, work around it by setting `returnValue` flag
                // in Angular listeners
                return e.returnValue;
            };
        });

        // If component has no container specified in config then use adopt to Wrapper's element
        const
            containerParam = [
                'adopt',
                'appendTo',
                'insertAfter',
                'insertBefore'
                // @ts-ignore
            ].find(prop => bryntumConfig[prop]);
        if (!containerParam) {
            if (instanceName === 'Button' || elementRef.nativeElement.getRootNode() instanceof ShadowRoot) {
                // Button should always be <a> or <button> inside owner element
                bryntumConfig.appendTo = elementRef.nativeElement;
            }
            else {
                bryntumConfig.adopt = elementRef.nativeElement;
            }
        }
        else {
            WrapperHelper.devWarningContainer(instanceName, containerParam);
        }

        // @ts-ignore
        me.instance = instanceName === 'Widget' ? Widget.create(bryntumConfig) : new instanceClass(bryntumConfig);

    }

    /**
     * Watch for changes
     * @param changes
     */
    ngOnChanges(changes: SimpleChanges): void {
        const
            { instance } = this,
            { instanceName } = BryntumResourceViewComponent;
        if (!instance) {
            return;
        }
        // Iterate over all changes
        Object.entries(changes).forEach(([prop, change]) => {
            const
                newValue = (change as SimpleChange).currentValue,
                { instance } = this,
                { bryntumConfigsOnly, bryntumProps } = BryntumResourceViewComponent;
            if (bryntumProps.includes(prop)) {
                WrapperHelper.applyPropValue(instance, prop, newValue, false);
                if (bryntumConfigsOnly.includes(prop)) {
                    WrapperHelper.devWarningUpdateProp(instanceName, prop);
                }
            }
        });
    }

    /**
     * Destroy the component
     */
    ngOnDestroy(): void {
        // @ts-ignore
        if (this.instance && this.instance.destroy) {
            this.instance.destroy();
        }
    }
}
