initial commit

LICENSE

@@ -0,0 +1,27 @@
+Custom License - All Rights Reserved
+
+Copyright (c) 2022 Karol Kozer
+
+Operator hereby grants a non-exclusive, non-transferable license i.e. without the right to grant sublicense to use the Platform.
+The license does not authorize the Company or the User to use the Platform for purposes other than use the Platform with intended purpose.
+
+The Company and the User has no right to reproduce, sell or otherwise market or distribute the Platform in whole or in part, in any form, in particular, transmit or make available in computer systems and networks, or any other communication.
+
+It’s not allowed:
+1. repeated and systematic downloading or re-using of information from the Platform, contrary to normal use and resulting in an unjustified violation of the Operator’s legitimate interests;
+2. repeated and systematic downloading or re-using contrary to normal use and resulting in an unjustified violation of the legitimate interests of the Operator;
+3. copying parts of the database beyond normal personal use.
+
+THE PLATFORM IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE PLATFORM OR THE USE OR OTHER DEALINGS IN THE
+PLATFORM.
+
+The above note is only a shortened version. Its full version is presented in the Terms & Conditions and should be interpreted and applied in accordance with their content.
+
+This license does not grant you any rights to trademarks, service marks, or
+any other intellectual property of the author. For any specific licensing
+needs or questions regarding this license, please contact the author.

dist/Epg/Epg.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+import { Theme } from "./helpers/interfaces";
+interface EpgProps {
+    width?: number;
+    height?: number;
+    isVerticalMode?: boolean;
+    isRTL?: boolean;
+    isSidebar: boolean;
+    isTimeline?: boolean;
+    isLoading?: boolean;
+    children: React.ReactNode;
+    loader?: React.ReactNode;
+    theme: Theme;
+    globalStyles?: string;
+    sidebarWidth: number;
+    timelineHeight: number;
+}
+export declare const Epg: React.ForwardRefExoticComponent<EpgProps & React.RefAttributes<HTMLDivElement>>;
+export {};

dist/Epg/components/Areas.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { Area } from "../helpers/interfaces";
+import { DateTime } from "../helpers/types";
+interface AreasProps {
+    isVerticalMode: boolean;
+    areas: Area[];
+    height: number;
+    hourWidth: number;
+    sidebarWidth: number;
+    timelineHeight: number;
+    startDate: DateTime;
+    endDate: DateTime;
+}
+export declare function Areas({ isVerticalMode, ...props }: AreasProps): React.JSX.Element;
+export {};

dist/Epg/components/Channel.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { ChannelWithPosition } from "../helpers/types";
+interface ChannelProps<T> {
+    isVerticalMode: boolean;
+    channel: T;
+    onOpenGroupTree?: (data: ChannelWithPosition) => void;
+    onClick?: (v: ChannelWithPosition) => void;
+}
+export declare function Channel<T extends ChannelWithPosition>({ isVerticalMode, channel, onOpenGroupTree, onClick, ...rest }: ChannelProps<T>): React.JSX.Element;
+export {};

dist/Epg/components/Channels.d.ts

@@ -0,0 +1,17 @@
+import * as React from "react";
+import { ChannelItem, ChannelWithPosition } from "../helpers/types";
+interface ChannelsProps {
+    isVerticalMode: boolean;
+    isTimeline: boolean;
+    isRTL: boolean;
+    isChannelVisible: (position: any) => boolean;
+    channels: ChannelWithPosition[];
+    contentHeight: number;
+    sidebarWidth: number;
+    timelineHeight: number;
+    scrollY: number;
+    openChannelGroupTree: (data: ChannelWithPosition) => void;
+    renderChannel?: (v: ChannelItem) => React.ReactNode;
+}
+export declare function Channels(props: ChannelsProps): React.JSX.Element;
+export {};

dist/Epg/components/CurrentTime.d.ts

@@ -0,0 +1,21 @@
+import * as React from "react";
+import { CurrentTimeIndicator, HoursInDayDiffTime, Mode, Timezone } from "../helpers/interfaces";
+import { DateTime } from "../helpers/types";
+interface CurrentTimeProps {
+    isBaseTimeFormat?: boolean;
+    isVerticalMode?: boolean;
+    isRTL?: boolean;
+    timezone: Timezone;
+    mode: Mode;
+    startDate: DateTime;
+    endDate: DateTime;
+    hoursInDays: HoursInDayDiffTime[];
+    dayWidth: number;
+    timelineHeight: number;
+    hourWidth: number;
+    sidebarWidth: number;
+    liveRefreshTime: number;
+    renderCurrentTime?: (v: CurrentTimeIndicator) => React.ReactElement;
+}
+export declare function CurrentTime(props: CurrentTimeProps): React.JSX.Element | null;
+export {};

dist/Epg/components/Grid.d.ts

@@ -0,0 +1,30 @@
+import * as React from "react";
+import { Mode, Grid as IGrid, HoursInDayDiffTime, GridCell } from "../helpers/interfaces";
+import { BaseTimeFormat, ChannelWithPosition, Position } from "../helpers/types";
+interface GridProps {
+    isVerticalMode: boolean;
+    isProgramVisible: (position: Position, overlapsCount: number) => boolean;
+    isBaseTimeFormat: BaseTimeFormat;
+    channelOverlapsCount: Record<string, number>;
+    hourWidth: number;
+    dayWidth: number;
+    days: string[];
+    hoursInDays: HoursInDayDiffTime[];
+    months: string[];
+    numberOfDays: number;
+    numberOfHoursInDay: number;
+    numberOfMonths: number;
+    offsetStartHoursRange: number;
+    gridItems: {
+        position: Position;
+        channel: ChannelWithPosition;
+    }[];
+    grid: IGrid;
+    mode: Mode;
+    sidebarWidth: number;
+    timelineHeight: number;
+    timelineDividers: number;
+    renderGridCell?: (props: GridCell) => React.ReactNode;
+}
+export declare function Grid({ isVerticalMode, isProgramVisible, channelOverlapsCount, grid, gridItems, mode, hourWidth, timelineDividers, renderGridCell, ...rest }: GridProps): React.JSX.Element;
+export {};

dist/Epg/components/GridCellItem.d.ts

@@ -0,0 +1,23 @@
+import * as React from "react";
+import { GridCell } from "../helpers/interfaces";
+import { ChannelWithPosition, GridEvent, Position } from "../helpers/types";
+interface GridCellItemProps {
+    isVerticalMode: boolean;
+    isHoverHighlight: boolean | undefined;
+    isProgramVisible: (position: Position, overlapsCount: number) => boolean;
+    isItemClickable: boolean;
+    isDayMode: boolean;
+    item: {
+        position: Position;
+        channel: ChannelWithPosition;
+    };
+    index: number;
+    channelOverlapsCount: Record<string, number>;
+    hourWidth: number;
+    timelineDividers: number;
+    renderGridCell?: (props: GridCell) => React.ReactNode;
+    onItemClick: GridEvent;
+    onItemDrop: GridEvent;
+}
+export declare function GridCellItem({ isVerticalMode, isProgramVisible, isHoverHighlight, isDayMode, isItemClickable, item, index, channelOverlapsCount, hourWidth, timelineDividers, renderGridCell, onItemClick, onItemDrop, }: GridCellItemProps): {} | null | undefined;
+export {};

dist/Epg/components/GridDividerItem.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { GridDividerItemProps } from "../helpers/interfaces";
+export declare function GridDividerItem({ index, item, dividerProps, }: GridDividerItemProps): React.JSX.Element;

dist/Epg/components/Layout.d.ts

@@ -0,0 +1,87 @@
+import React from "react";
+import { Area, Grid as IGrid, HoursInDayDiffTime, Line as ILine, Mode, Overlap, ProgramOverlaps, DragAndDrop, Timezone, Snap, GridCell } from "../helpers/interfaces";
+import { Timeline as ITimeline, CurrentTimeIndicator } from "../helpers/interfaces";
+import { ProgramItem, ChannelWithPosition, DateTime, Position, BaseTimeFormat, DragMouseUp } from "../helpers/types";
+interface LayoutProps {
+    isToday: boolean;
+    isVerticalMode?: boolean;
+    isRTL?: boolean;
+    isBaseTimeFormat?: BaseTimeFormat;
+    isSidebar?: boolean;
+    isTimeline?: boolean;
+    isLine?: boolean;
+    isCurrentTime?: boolean;
+    isResize?: boolean;
+    programs: ProgramItem[];
+    programOverlaps: ProgramOverlaps;
+    layerOverlapLevel: number;
+    channels: ChannelWithPosition[];
+    channelOverlapsCount: Record<string, number>;
+    startDate: DateTime;
+    endDate: DateTime;
+    hoursInDays: HoursInDayDiffTime[];
+    scrollY: number;
+    dayWidth: number;
+    hourWidth: number;
+    days: string[];
+    months: string[];
+    currentDate: string;
+    numberOfDays: number;
+    numberOfHoursInDay: number;
+    numberOfMonths: number;
+    monthWidth: number;
+    offsetStartHoursRange: number;
+    sidebarWidth: number;
+    timelineHeight: number;
+    itemHeight: number;
+    liveRefreshTime: number;
+    snap?: Snap;
+    mode: Mode;
+    dnd: DragAndDrop;
+    overlapMode: Overlap["mode"];
+    timelineDividers: number;
+    timezone: Timezone;
+    areas: Area[];
+    gridItems: {
+        position: Position;
+        channel: ChannelWithPosition;
+    }[];
+    grid: IGrid;
+    overlap: Overlap;
+    isProgramVisible: (position: Position, overlapsCount: number) => boolean;
+    isChannelVisible: (position: Pick<Position, "top" | "height">) => boolean;
+    isTimelineVisible: (position: Pick<Position, "left" | "width">) => boolean;
+    dragMouseUp: (position: DragMouseUp) => void;
+    resizeMouseUp: (data: any) => void;
+    openChannelGroupTree: (data: ChannelWithPosition) => void;
+    onScroll: (e: React.UIEvent<HTMLDivElement, UIEvent> & {
+        target: Element;
+    }) => void;
+    onLayoutBgClick?: () => void;
+    renderProgram?: (v: {
+        program: ProgramItem;
+        isRTL: boolean;
+        isVerticalMode: boolean;
+        isBaseTimeFormat: BaseTimeFormat;
+        startDate: DateTime;
+        liveRefreshTime: number;
+        dayWidth: number;
+        hourWidth: number;
+        itemHeight: number;
+        contentHeight: number;
+        snap?: Snap;
+        mode: Mode;
+        dnd: DragAndDrop;
+        dragMouseUp: (data: DragMouseUp) => void;
+        resizeMouseUp: (data: any) => void;
+    }) => React.ReactNode;
+    renderChannel?: (v: {
+        channel: ChannelWithPosition;
+    }) => React.ReactNode;
+    renderTimeline?: (v: ITimeline) => React.ReactNode;
+    renderLine?: (v: ILine) => React.ReactNode;
+    renderCurrentTime?: (v: CurrentTimeIndicator) => React.ReactElement;
+    renderGridCell?: (v: GridCell) => React.ReactElement;
+}
+export declare const Layout: React.ForwardRefExoticComponent<LayoutProps & React.RefAttributes<HTMLDivElement>>;
+export {};

dist/Epg/components/Line.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+import { HoursInDayDiffTime, Line as ILine, Timezone } from "../helpers/interfaces";
+import { DateTime } from "../helpers/types";
+interface LineProps {
+    isTimeline: boolean;
+    isVerticalMode: boolean;
+    height: number;
+    startDate: DateTime;
+    endDate: DateTime;
+    dayWidth: number;
+    hourWidth: number;
+    sidebarWidth: number;
+    liveRefreshTime: number;
+    hoursInDays: HoursInDayDiffTime[];
+    timezone: Timezone;
+    renderLine?: (v: ILine) => React.ReactNode;
+}
+export declare function Line({ isTimeline, isVerticalMode, height, renderLine, ...rest }: LineProps): React.JSX.Element | null;
+export {};

dist/Epg/components/Loader.d.ts

@@ -0,0 +1,2 @@
+import * as React from "react";
+export declare function Loader(): React.JSX.Element;

dist/Epg/components/Program.d.ts

@@ -0,0 +1,25 @@
+import * as React from "react";
+import { DragAndDrop, Mode, Program as ProgramType, Snap } from "../helpers/interfaces";
+import { BaseTimeFormat, DateTime, DragMouseUp, ResizeMouseUp } from "../helpers/types";
+import { ProgramItem } from "../helpers/types";
+interface ProgramProps<T> {
+    isVerticalMode?: boolean;
+    isRTL?: boolean;
+    isResize?: boolean;
+    isBaseTimeFormat: BaseTimeFormat;
+    startDate: DateTime;
+    program: T;
+    liveRefreshTime: number;
+    snap?: Snap;
+    mode: Mode;
+    dnd: DragAndDrop;
+    contentHeight: number;
+    dayWidth: number;
+    hourWidth: number;
+    itemHeight: number;
+    dragMouseUp: (data: DragMouseUp) => void;
+    resizeMouseUp: (data: ResizeMouseUp) => void;
+    onClick?: (v: ProgramType) => void;
+}
+export declare function Program<T extends ProgramItem>({ isVerticalMode, program, onClick, ...rest }: ProgramProps<T>): React.JSX.Element;
+export {};

dist/Epg/components/Timeline.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+import { Timeline as ITimeline } from "../helpers/interfaces";
+export declare function Timeline(props: ITimeline): React.JSX.Element;

dist/Epg/components/index.d.ts

@@ -0,0 +1,9 @@
+export * from "./Layout";
+export * from "./Program";
+export * from "./Channels";
+export * from "./Channel";
+export * from "./Timeline";
+export * from "./Line";
+export * from "./Loader";
+export * from "./CurrentTime";
+export * from "./Areas";

dist/Epg/helpers/areas.d.ts

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+import { Area } from "./interfaces";
+import { DateTime } from "./types";
+interface AreasData {
+    area: Area;
+    hourWidth: number;
+    sidebarWidth: number;
+    timelineHeight: number;
+    height: number;
+    startDate: DateTime;
+    endDate: DateTime;
+}
+export declare const getAreasFields: ({ area, startDate, endDate, hourWidth, sidebarWidth, timelineHeight, height, }: AreasData) => {
+    showArea: boolean;
+    areaFieldStyles: {
+        positionX: number;
+        width: number;
+        height: number;
+        timelineHeight: number;
+    };
+    areaBgStyles: import("react").CSSProperties;
+    startDate: string;
+    endDate?: string | undefined;
+    styles: import("react").CSSProperties;
+    onClick?: (() => void) | undefined;
+    annotations?: {
+        styles: import("react").CSSProperties;
+        textStart?: string | undefined;
+        textEnd?: string | undefined;
+    } | undefined;
+};
+export {};

dist/Epg/helpers/channels.d.ts

@@ -0,0 +1,15 @@
+import { ChannelWithPosition } from "./types";
+export declare const getChannelVerticalPosition: (channel: ChannelWithPosition, isVerticalMode: boolean) => ChannelWithPosition;
+export declare const getChannelGroupTreeProps: (channel: ChannelWithPosition) => {
+    nestedChildren: string[] | undefined;
+    isFirstNestedChild: boolean;
+    isLastNestedChild: boolean;
+    isOpened?: boolean | undefined;
+    uuid: string;
+    logo: string;
+    groupTree?: boolean | undefined;
+    parentChannelUuid?: string | undefined;
+    isNestedChild: boolean;
+    position: Pick<import("./types").Position, "top" | "height"> & Partial<Pick<import("./types").Position, "left" | "width">>;
+    index: number;
+};

dist/Epg/helpers/common.d.ts

@@ -0,0 +1,56 @@
+import { useLayoutEffect } from "react";
+import { HoursInDayDiffTime, Mode, Overlap, ProgramOverlaps } from "./interfaces";
+import { ProgramItem } from "./types";
+declare type DateTime = string | number | Date;
+declare type OmitObjectType = {
+    [key: string]: any;
+};
+export declare const omit: (obj: OmitObjectType, ...props: string[]) => {
+    [x: string]: any;
+};
+export declare const generateArray: (num: number) => any[];
+interface OverlapProgramOptions {
+    isVerticalMode: boolean;
+    program: ProgramItem;
+    programOverlaps: ProgramOverlaps;
+    layerOverlapLevel: number;
+    overlap: Overlap;
+    overlapMode: Overlap["mode"];
+}
+export declare const getProgramOptions: ({ isVerticalMode, program, overlap, ...rest }: OverlapProgramOptions) => {
+    position: Pick<import("./types").Position, "width" | "height" | "top" | "left">;
+    data: import("./interfaces").Program;
+};
+export declare const useIsomorphicLayoutEffect: () => typeof useLayoutEffect;
+export declare const getHourWidth: (dayWidth: number) => number;
+export declare const getDate: (date: DateTime) => Date;
+interface DayWidth {
+    dayWidth: number;
+    startDate: DateTime;
+    endDate: DateTime;
+    hoursInDays: HoursInDayDiffTime[];
+    modeType: Mode["type"];
+}
+export declare const getDayWidthResources: ({ dayWidth, startDate, endDate, hoursInDays, modeType, }: DayWidth) => {
+    hourWidth: number;
+    dayWidth: number;
+    numberOfMonths: number;
+    numberOfHoursInDay: number;
+    monthWidth: number;
+    offsetStartHoursRange: number;
+};
+export declare const getDayResources: ({ startDate, endDate, modeType, }: Pick<DayWidth, "startDate" | "endDate" | "modeType">) => {
+    isToday: boolean;
+    currentDate: string;
+    numberOfDays: number;
+    days: string[];
+    months: string[];
+};
+export declare const switchPosition: (programPosition: ProgramItem["position"]) => {
+    top: number;
+    left: number;
+    width: number;
+    height: number;
+};
+export declare function generateUUID(): string;
+export {};

dist/Epg/helpers/drag.d.ts

@@ -0,0 +1,19 @@
+import { DateTime, DragMouseUp, ResizeMouseUp } from "./types";
+declare type EventProps = Pick<DragMouseUp | ResizeMouseUp, keyof DragMouseUp & keyof ResizeMouseUp>;
+declare type EventSinceTill = EventProps & {
+    startDate?: DateTime;
+    hourWidth: number;
+    width?: ResizeMouseUp["width"];
+    initialWidth?: ResizeMouseUp["initialWidth"];
+};
+export declare const calculateItemDragSinceTill: (props: EventSinceTill) => {
+    since: string;
+    till: string;
+};
+export declare const getDefaultDragProps: (positionLeft: number) => {
+    currentPositionX: number;
+    dndEvents: {
+        isDragging: boolean;
+    };
+};
+export {};

dist/Epg/helpers/enums.d.ts

@@ -0,0 +1,9 @@
+export declare enum Layers {
+    Sidebar = 9,
+    EpgCornerBox = 10,
+    Line = 9,
+    Loader = 12,
+    Program = 1,
+    Timeline = 9,
+    Area = 2
+}

dist/Epg/helpers/epg.d.ts

@@ -0,0 +1,105 @@
+import { Channel, ChannelWithOmittedUuid, HoursInDayDiffTime, Mode, Program, ProgramWithOmittedUuid } from "./interfaces";
+import { Position, DateTime, ChannelWithPosition } from "./types";
+export declare const getPositionX: (since: DateTime, till: DateTime, startDate: DateTime, endDate: DateTime, hourWidth: number) => number;
+export declare const getChannelPosition: (channelIndex: number, itemHeight: number) => {
+    top: number;
+    height: number;
+};
+export declare const getProgramPosition: (program: Program, channelIndex: number, itemHeight: number, hourWidth: number, startDate: DateTime, endDate: DateTime, isVerticalMode: boolean) => {
+    position: {
+        width: number;
+        height: number;
+        top: number;
+        left: number;
+        edgeEnd: number;
+    };
+    data: {
+        since: string;
+        till: string;
+        channelUuid: string;
+        id: string;
+        index: number;
+        title: string;
+        description: string;
+        image: string;
+        channelIndex: number;
+        channelPosition: Pick<Position, "top" | "height">;
+        fixedVisibility?: boolean | undefined;
+        parentChannelUuid?: string | undefined;
+    };
+};
+interface ConvertedPrograms {
+    isVerticalMode: boolean;
+    isOverlapEnabled: boolean;
+    programChannelMapKey: string;
+    data: ProgramWithOmittedUuid[];
+    channels: Channel[];
+    startDate: DateTime;
+    endDate: DateTime;
+    itemHeight: number;
+    hourWidth: number;
+    hoursInDays: HoursInDayDiffTime[];
+}
+export declare const getConvertedPrograms: ({ isVerticalMode, isOverlapEnabled, programChannelMapKey, data, channels, startDate, endDate, itemHeight, hourWidth, hoursInDays, }: ConvertedPrograms) => {
+    position: {
+        width: number;
+        height: number;
+        top: number;
+        left: number;
+        edgeEnd: number;
+    };
+    data: {
+        since: string;
+        till: string;
+        channelUuid: string;
+        id: string;
+        index: number;
+        title: string;
+        description: string;
+        image: string;
+        channelIndex: number;
+        channelPosition: Pick<Position, "top" | "height">;
+        fixedVisibility?: boolean | undefined;
+        parentChannelUuid?: string | undefined;
+    };
+}[];
+export declare const getConvertedChannels: (isOverlapEnabled: boolean, overlapMode: string, layerOverlapLevel: number, channels: ChannelWithOmittedUuid[], itemHeight: number, channelMapKey: string, channelOverlapsCount: Record<string, number>) => ChannelWithPosition[];
+interface ItemVisibility {
+    position: Position;
+    scrollY: number;
+    scrollX: number;
+    containerHeight: number;
+    containerWidth: number;
+    isVerticalMode: boolean;
+    itemOverscan: number;
+    overlapsCount: number;
+}
+export declare const getItemVisibility: ({ position, scrollY, scrollX, containerHeight, containerWidth, itemOverscan, overlapsCount, isVerticalMode, }: ItemVisibility) => boolean;
+interface SidebarItemVisibility {
+    isVerticalMode: boolean;
+    itemOverscan: number;
+    position: Pick<Position, "top" | "height"> & Partial<Pick<Position, "left">>;
+    scrollX: number;
+    scrollY: number;
+    containerHeight: number;
+    containerWidth: number;
+}
+export declare const getSidebarItemVisibility: ({ position, scrollX, scrollY, containerHeight, containerWidth, itemOverscan, isVerticalMode, }: SidebarItemVisibility) => boolean;
+interface TimelineItemVisibility {
+    position: Pick<Position, "left" | "width">;
+    scrollY: number;
+    scrollX: number;
+    containerWidth: number;
+    containerHeight: number;
+    isVerticalMode: boolean;
+}
+export declare const getTimelineItemVisibility: ({ position, scrollY, scrollX, containerHeight, containerWidth, isVerticalMode, }: TimelineItemVisibility) => boolean;
+export declare const setUpdatedLayoutItem: (data: ProgramWithOmittedUuid, modeType: Mode["type"]) => {
+    since: string;
+    till: string;
+    channelUuid?: string | undefined;
+    id: string;
+    title: string;
+    image: string;
+};
+export {};

dist/Epg/helpers/grid.d.ts

@@ -0,0 +1,59 @@
+import { Mode, Grid as IGrid, HoursInDayDiffTime } from "../helpers/interfaces";
+import { BaseTimeFormat, ChannelWithPosition, Position } from "./types";
+interface ConvertedGridItems {
+    isVerticalMode: boolean;
+    channels: ChannelWithPosition[];
+    mode: Mode;
+    dayWidth: number;
+    hourWidth: number;
+    timelineHeight: number;
+    sidebarWidth: number;
+    dayWidthResources: {
+        numberOfMonths: number;
+        numberOfHoursInDay: number;
+        monthWidth: number;
+        offsetStartHoursRange: number;
+    };
+    daysResources: {
+        numberOfDays: number;
+        days: string[];
+        months: string[];
+    };
+}
+export declare const getConvertedGridItems: ({ isVerticalMode, channels, dayWidth, hourWidth, timelineHeight, sidebarWidth, mode, dayWidthResources, daysResources, }: ConvertedGridItems) => {
+    position: {
+        top: number;
+        left: number;
+        width: number;
+        height: number;
+        edgeEnd: number;
+    };
+    channel: ChannelWithPosition;
+}[];
+interface ClickGridItem {
+    isDrop?: boolean;
+    isVerticalMode: boolean;
+    isBaseTimeFormat: BaseTimeFormat;
+    index: number | undefined;
+    item: {
+        position: Position;
+        channel: ChannelWithPosition;
+    };
+    grid: IGrid;
+    mode: Mode;
+    dayWidth: number;
+    hourWidth: number;
+    timelineHeight: number;
+    sidebarWidth: number;
+    days: string[];
+    hoursInDays: HoursInDayDiffTime[];
+    months: string[];
+    numberOfDays: number;
+    numberOfHoursInDay: number;
+    numberOfMonths: number;
+    offsetStartHoursRange: number;
+    timelineDividers: number;
+    dataAttributes?: Record<string, string>;
+}
+export declare const getClickGridItemData: ({ isDrop, isVerticalMode, isBaseTimeFormat, index, item, grid, mode, dayWidth, hourWidth, sidebarWidth, days, hoursInDays, months, numberOfDays, numberOfHoursInDay, numberOfMonths, offsetStartHoursRange, timelineDividers, dataAttributes, }: ClickGridItem) => void;
+export {};

dist/Epg/helpers/index.d.ts

@@ -0,0 +1,13 @@
+export * from "./interfaces";
+export * from "./enums";
+export * from "./variables";
+export * from "./common";
+export * from "./time";
+export * from "./epg";
+export * from "./timeline";
+export * from "./line";
+export * from "./channels";
+export * from "./layout";
+export * from "./overlaps";
+export * from "./drag";
+export * from "./grid";

dist/Epg/helpers/interfaces.d.ts

@@ -0,0 +1,286 @@
+import { CSSProperties } from "react";
+import { Layers } from "./enums";
+import { BaseTimeFormat, ChannelWithPosition, DateTime, DragMouseUp, GridEvent, Position, ProgramItem } from "./types";
+export interface Program {
+    channelUuid: string;
+    id: string;
+    index: number;
+    title: string;
+    description: string;
+    since: string | number | Date;
+    till: string | number | Date;
+    image: string;
+    channelIndex: number;
+    channelPosition: Pick<Position, "top" | "height">;
+    fixedVisibility?: boolean;
+    parentChannelUuid?: string;
+    [key: string]: any;
+}
+export interface ProgramWithOmittedUuid extends Omit<Program, "id"> {
+    channelUuid?: string;
+}
+export interface Channel {
+    isOpened?: boolean;
+    uuid: string;
+    logo: string;
+    groupTree?: boolean;
+    parentChannelUuid?: string;
+    nestedChildren?: string[];
+    isNestedChild: boolean;
+    isFirstNestedChild?: boolean;
+    isLastNestedChild?: boolean;
+    [key: string]: any;
+}
+export interface ChannelWithOmittedUuid extends Omit<Channel, "uuid"> {
+    uuid?: string;
+}
+export interface ProgramOverlaps {
+    [key: string]: ProgramItem[];
+}
+export interface Overlap {
+    enabled: boolean;
+    mode: "stack" | "layer";
+    layerOverlapLevel?: number;
+}
+export interface Snap {
+    x?: number;
+    y?: number;
+}
+export interface GridDataAttributes {
+    [key: string]: string;
+}
+export interface GridItemProps {
+    since: string;
+    till: string;
+    date: string;
+    channelUuid: string;
+}
+export interface GridDividerItemProps {
+    index: number;
+    item: {
+        position: Position;
+        channel: ChannelWithPosition;
+    };
+    dividerProps: {
+        styles: {
+            left: (index: number) => number;
+            width: number;
+        };
+        props: {
+            isVerticalMode: boolean;
+            isHoverHighlight: boolean;
+            isItemClickable: boolean;
+            onItemClick: GridEvent;
+            onItemDrop?: GridEvent;
+        };
+    };
+}
+export interface GridDropItemProps extends GridItemProps {
+    [key: string]: string;
+}
+export interface Grid {
+    enabled: boolean;
+    hoverHighlight?: boolean;
+    onGridItemClick?: (props: GridItemProps) => void;
+    onGridItemDrop?: (props: GridItemProps) => void;
+}
+export interface GridCell {
+    isDayMode: boolean;
+    isHoverHighlight?: boolean;
+    isDragOver?: boolean;
+    id: string;
+    index: number;
+    item: {
+        position: Position;
+        channel: ChannelWithPosition;
+    };
+    timelineDividers: number;
+    timelineDividerArray: string[];
+    gridDividerProps: {
+        styles: {
+            left: (index: number) => number;
+            width: number;
+        };
+        props: {
+            isVerticalMode: boolean;
+            isHoverHighlight: boolean;
+            isItemClickable: boolean;
+            onItemClick: GridEvent;
+        };
+    };
+    gridItemClickProps: {
+        onClick?: () => void;
+        isItemClickable: boolean;
+    };
+    gridItemDnDProps: {
+        isDragOver?: undefined;
+        onDragEnter?: undefined;
+        onDragLeave?: undefined;
+        onDrop?: undefined;
+    } | {
+        isDragOver: boolean;
+        onDragEnter: (e: React.DragEvent<HTMLDivElement>) => void;
+        onDragLeave: (e: React.DragEvent<HTMLDivElement>) => void;
+        onDrop: (e: React.DragEvent<HTMLDivElement>) => void;
+    };
+}
+export interface DragAndDrop {
+    enabled: boolean;
+    mode: "row" | "multi-rows";
+    onDnDMouseUp?: (event: Pick<DragMouseUp, "since" | "till" | "id">) => void;
+    onDnDSuccess?: (event: ProgramWithOmittedUuid) => void;
+}
+export interface Line {
+    isVerticalMode: boolean;
+    isTimeline: boolean;
+    styles: {
+        position: {
+            top: number;
+            left: number;
+            width: number;
+            height: number;
+            zIndex: Layers;
+        };
+    };
+}
+export interface CurrentTimeIndicator {
+    isVerticalMode?: boolean;
+    isRTL?: boolean;
+    isBaseTimeFormat?: boolean;
+    time: string;
+    styles: {
+        position: Omit<Position, "width" | "edgeEnd"> & {
+            width: string | number;
+        };
+    };
+}
+export interface Timeline {
+    isVerticalMode?: boolean;
+    isRTL?: boolean;
+    isToday: boolean;
+    isBaseTimeFormat: BaseTimeFormat;
+    isCurrentTime: boolean;
+    isSidebar: boolean;
+    isTimelineVisible: (position: Pick<Position, "left" | "width">) => boolean;
+    timezone: Timezone;
+    dayWidth: number;
+    hourWidth: number;
+    days: string[];
+    hoursInDays: HoursInDayDiffTime[];
+    months: string[];
+    numberOfDays: number;
+    numberOfHoursInDay: number;
+    numberOfMonths: number;
+    offsetStartHoursRange: number;
+    monthWidth: number;
+    sidebarWidth: number;
+    timelineHeight: number;
+    startDate: DateTime;
+    endDate: DateTime;
+    liveRefreshTime: number;
+    mode: Mode;
+    timelineDividers: number;
+    renderCurrentTime?: (v: CurrentTimeIndicator) => React.ReactElement;
+}
+export interface Mode {
+    type: "day" | "week" | "month";
+    style?: "default" | "modern";
+}
+export interface Area {
+    startDate: string;
+    endDate?: string;
+    styles: CSSProperties;
+    onClick?: () => void;
+    annotations?: {
+        styles: CSSProperties;
+        textStart?: string;
+        textEnd?: string;
+    };
+}
+export interface AreaItem {
+    showArea: boolean;
+    startDate: Area["startDate"];
+    endDate?: Area["endDate"];
+    areaBgStyles: Area["styles"];
+    onClick?: Area["onClick"];
+    annotations?: {
+        styles: Area["styles"];
+        textStart?: string;
+        textEnd?: string;
+    };
+    areaFieldStyles: {
+        positionX: number;
+        width: number;
+        height: number;
+        timelineHeight: number;
+    };
+}
+export interface HoursInDay {
+    date: string;
+    startTimeHour: string;
+    endTimeHour: string;
+}
+export interface HoursInDayDiffTime extends HoursInDay {
+    diffInHours: number;
+    prevItemDiffInHours: number;
+    diffLeft: number;
+    startTime: number;
+    endTime: number;
+}
+export interface Timezone {
+    enabled: boolean;
+    zone: string;
+    mode: string;
+}
+export interface Theme {
+    primary: {
+        600: string;
+        900: string;
+    };
+    grey: {
+        300: string;
+    };
+    white: string;
+    teal: {
+        100: string;
+    };
+    green: {
+        200: string;
+        300: string;
+    };
+    loader: {
+        teal: string;
+        purple: string;
+        pink: string;
+        bg: string;
+    };
+    scrollbar: {
+        border: string;
+        thumb: {
+            bg: string;
+        };
+    };
+    gradient: {
+        blue: {
+            300: string;
+            600: string;
+            900: string;
+        };
+    };
+    text: {
+        grey: {
+            300: string;
+            500: string;
+        };
+    };
+    timeline: {
+        divider: {
+            bg: string;
+        };
+    };
+    grid: {
+        item: string;
+        divider: string;
+        highlight: string;
+    };
+}

dist/Epg/helpers/layout.d.ts

@@ -0,0 +1,29 @@
+import { ChannelWithOmittedUuid, Timezone } from "./interfaces";
+import { ChannelWithPosition, ProgramWithPosition } from "./types";
+export declare const setLayoutScreenCloneElement: (event: ProgramWithPosition, index: number) => void;
+export declare const deleteLayoutScreenCloneElement: (event: ProgramWithPosition) => void;
+export declare const getLayoutScreenCloneElements: () => Record<string, Record<string, ProgramWithPosition>>;
+export declare const resetLayoutScreenCloneElements: () => void;
+export declare const getChannelsContentHeight: (channels: ChannelWithPosition[]) => number;
+export declare const setChannelEpgIndexes: ({ uuid, first, last, }: {
+    uuid: string;
+    first?: number | undefined;
+    last?: number | undefined;
+}) => void;
+export declare const getChannelEpgIndexes: (uuid: string) => {
+    uuid: string;
+    first: number;
+    last: number;
+};
+export declare const resetChannelsEpgIndexes: () => void;
+export declare const setChannelGroupTree: (channel: ChannelWithOmittedUuid) => void;
+export declare const setChannelGroupTreeNestedChildren: (channelUuid: string, nestedChildUuid: string) => void;
+export declare const getChannelsGroupTree: () => Record<string, {
+    isOpen: boolean;
+    uuid: string;
+    groupTree: boolean;
+    nestedChildren?: string[] | undefined;
+}>;
+export declare const setTimezoneOptionsCache: (props: Timezone) => void;
+export declare const getTimezoneOptionsCache: () => Timezone;
+export declare const resetTimezoneOptionsCache: () => void;

dist/Epg/helpers/line.d.ts

@@ -0,0 +1,26 @@
+import { Layers } from "./enums";
+interface LineStyles {
+    isVerticalMode: boolean;
+    isTimeline: boolean;
+    lineStyles: {
+        position: string;
+        top: number;
+        width: number;
+    };
+    position: {
+        height: number;
+        left: number;
+        zIndex: Layers;
+    };
+}
+export declare const getLineStyles: ({ isVerticalMode, isTimeline, lineStyles, position, }: LineStyles) => {
+    position: {
+        position: string;
+        top: number;
+        left: number;
+        width: number;
+        height: number;
+        zIndex: Layers;
+    };
+};
+export {};

dist/Epg/helpers/overlaps.d.ts

@@ -0,0 +1,13 @@
+import { ProgramItem } from "./types";
+import { ProgramOverlaps } from "./interfaces";
+export declare function getOverlaps(isVerticalMode: boolean, itemOverlaps: ProgramOverlaps, programs: ProgramItem[]): {
+    overlaps: ProgramOverlaps;
+    channelOverlaps: Record<string, number>;
+};
+export declare function checkOverlaps(isMultirowsDnd: boolean, isVerticalMode: boolean, dndChannelUuid: {
+    index: number;
+    uuid: string;
+}, itemOverlaps: ProgramOverlaps, programs: ProgramItem[]): {
+    overlaps: ProgramOverlaps;
+    channelOverlaps: Record<string, number>;
+};

dist/Epg/helpers/time.d.ts

@@ -0,0 +1,33 @@
+import { HoursInDay, HoursInDayDiffTime, Mode } from "./interfaces";
+import { DateTime as DateRangeTime } from "./types";
+declare type DateTime = number | string | Date;
+export declare const getLiveStatus: (since: DateTime, till: DateTime) => boolean;
+export declare const formatTime: (date: DateTime) => string;
+export declare const formatTimeTz: (date: DateTime) => string;
+export declare const roundToMinutes: (date: DateTime) => Date;
+export declare const isYesterday: (since: DateTime, startDate: DateTime) => boolean;
+export declare const isFutureTime: (date: DateTime) => boolean;
+export declare const getTimeRangeDates: (startDate: DateRangeTime, endDate: DateRangeTime) => {
+    startDate: DateRangeTime;
+    endDate: DateRangeTime;
+};
+interface FormatWeekMonthDate {
+    date: string;
+    mode: Mode;
+    isBaseTimeFormat: boolean;
+}
+export declare const getFormattedWeekMonthDate: ({ date, mode, isBaseTimeFormat, }: FormatWeekMonthDate) => string;
+interface NumberOfHoursInDays {
+    startDate: DateRangeTime;
+    customHoursInDays: HoursInDay[];
+}
+export declare const getNumberOfHoursInDays: ({ startDate, customHoursInDays, }: NumberOfHoursInDays) => HoursInDayDiffTime[];
+export declare const getTodayHoursInDays: (hoursInDays: HoursInDayDiffTime[]) => boolean;
+interface HoursInDaysPositionX {
+    hoursInDays: HoursInDayDiffTime[];
+    hourWidth: number;
+    sidebarWidth: number;
+    cb?: (v: boolean) => void;
+}
+export declare const getHoursInDaysPositionX: ({ hoursInDays, hourWidth, sidebarWidth, cb, }: HoursInDaysPositionX) => number;
+export {};

dist/Epg/helpers/timeline.d.ts

@@ -0,0 +1,21 @@
+import { HoursInDayDiffTime, Mode } from "./interfaces";
+interface TimeSlots {
+    isBaseTimeFormat: boolean;
+    days: string[];
+    hoursInDays: HoursInDayDiffTime[];
+    months: string[];
+    numberOfDays: number;
+    numberOfHoursInDay: number;
+    numberOfMonths: number;
+    offsetStartHoursRange: number;
+    weekDayWidth?: number;
+}
+export declare const generateTimelineSlots: (modeType: Mode["type"], options: TimeSlots) => (string | number)[];
+export declare const generateWeekTimelineSlots: ({ days, numberOfDays, }: Pick<TimeSlots, "days" | "numberOfDays">) => string[];
+export declare const generateMonthTimelineSlots: ({ months, numberOfMonths, }: Pick<TimeSlots, "isBaseTimeFormat" | "months" | "numberOfMonths">) => string[];
+export declare const getTimelineMonthsWidth: ({ months, weekDayWidth, }: Pick<TimeSlots, "months" | "weekDayWidth">) => {
+    width: number;
+    left: number;
+}[];
+export declare const getTimelineHeight: (timelineHeight: number, mode: Mode) => number;
+export {};

dist/Epg/helpers/types.d.ts

@@ -0,0 +1,43 @@
+import { Program, Channel, GridDataAttributes } from "./interfaces";
+export declare type Position = {
+    width: number;
+    height: number;
+    top: number;
+    left: number;
+    edgeEnd: number;
+};
+export declare type InitialScrollPositions = Pick<Partial<Position>, "top" | "left">;
+export declare type ProgramWithPosition = {
+    position: Position;
+    data: Program;
+};
+export declare type ProgramItem = {
+    position: Omit<Position, "edgeEnd">;
+    data: Program;
+};
+export declare type ChannelItem = {
+    isVerticalMode?: boolean;
+    isRTL?: boolean;
+    channel: ChannelWithPosition;
+    onOpenGroupTree?: (data: ChannelWithPosition) => void;
+};
+export declare type ChannelWithPosition = Channel & {
+    position: Pick<Position, "top" | "height"> & Partial<Pick<Position, "left" | "width">>;
+    index: number;
+};
+export declare type DateTime = string | Date;
+export declare type BaseTimeFormat = boolean;
+export declare type DragMouseUp = Pick<Program, "id" | "index" | "since" | "till"> & Pick<Position, "left" | "top"> & {
+    initialPositionLeft: Position["left"];
+    initialPositionTop: Position["top"];
+};
+export declare type ResizeMouseUp = Pick<Program, "id" | "index" | "since" | "till"> & Pick<Position, "left" | "top"> & {
+    initialPositionLeft: Position["left"];
+    initialPositionTop: Position["top"];
+    initialWidth: Position["width"];
+    width: Position["width"];
+};
+export declare type GridEvent = (item: {
+    position: Position;
+    channel: ChannelWithPosition;
+}, index?: number | undefined, ataAttributes?: GridDataAttributes) => () => void;

dist/Epg/helpers/variables.d.ts

@@ -0,0 +1,37 @@
+export declare const DAY_WIDTH = 7200;
+export declare const HOURS_IN_DAY = 24;
+export declare const HOUR_IN_MINUTES = 60;
+export declare const SECONDS_IN_MINUTE = 60;
+export declare const TIMELINE_HEIGHT = 60;
+export declare const TIMELINE_HEIGHT_MODERN_STYLE = 80;
+export declare const TIMELINE_WIDTH_VERTICAL = 70;
+export declare const TIMELINE_DIVIDERS = 4;
+export declare const SIDEBAR_WIDTH = 100;
+export declare const ITEM_HEIGHT = 80;
+export declare const ITEM_OVERSCAN = 80;
+export declare const DEBOUNCE_WAIT = 100;
+export declare const DEBOUNCE_WAIT_MAX = 100;
+export declare const LIVE_REFRESH_TIME = 120;
+export declare const THEME_MODE: {
+    DARK: string;
+    LIGHT: string;
+};
+export declare const TIME_FORMAT: {
+    DEFAULT: string;
+    DATE: string;
+    DAY: string;
+    DAY_DATE: string;
+    MONTH: string;
+    DAY_MONTH: string;
+    BASE_DAY_MONTH: string;
+    HOURS_MIN: string;
+    BASE_HOURS_TIME: string;
+    YEAR: string;
+};
+export declare const OVERLAP_MODES: {
+    STACK: string;
+    LAYER: string;
+};
+export declare const TIMEZONE_MODES: {
+    UTC_TO_ZONED_TIME: string;
+};

dist/Epg/hooks/index.d.ts

@@ -0,0 +1,8 @@
+export * from "./useEpg";
+export * from "./useInterval";
+export * from "./useProgram";
+export * from "./useTimeline";
+export * from "./useLine";
+export * from "./useCurrentTime";
+export * from "./useGrid";
+export * from "./useGridExternalDnD";

dist/Epg/hooks/useAreas.d.ts

@@ -0,0 +1,34 @@
+/// <reference types="react" />
+import { Area } from "../helpers/interfaces";
+import { DateTime } from "../helpers/types";
+interface UseAreasProps {
+    areas: Area[];
+    hourWidth: number;
+    sidebarWidth: number;
+    height: number;
+    timelineHeight: number;
+    startDate: DateTime;
+    endDate: DateTime;
+}
+export declare function useAreas(props: UseAreasProps): {
+    data: {
+        showArea: boolean;
+        areaFieldStyles: {
+            positionX: number;
+            width: number;
+            height: number;
+            timelineHeight: number;
+        };
+        areaBgStyles: import("react").CSSProperties;
+        startDate: string;
+        endDate?: string | undefined;
+        styles: import("react").CSSProperties;
+        onClick?: (() => void) | undefined;
+        annotations?: {
+            styles: import("react").CSSProperties;
+            textStart?: string | undefined;
+            textEnd?: string | undefined;
+        } | undefined;
+    }[];
+};
+export {};

dist/Epg/hooks/useCurrentTime.d.ts

@@ -0,0 +1,23 @@
+import { BaseTimeFormat } from "../helpers/types";
+import { Mode } from "../helpers";
+interface useCurrentTimeProps {
+    isVerticalMode?: boolean;
+    isBaseTimeFormat?: BaseTimeFormat;
+    mode: Mode;
+    positionX: number;
+    timelineHeight: number;
+    sidebarWidth: number;
+}
+export declare function useCurrentTime({ isVerticalMode, isBaseTimeFormat, mode, positionX, timelineHeight, sidebarWidth, }: useCurrentTimeProps): {
+    time: string;
+    getCurrentTimeStyles: () => {
+        position: {
+            position: string;
+            width: string | number;
+            height: number;
+            top: number;
+            left: number;
+        };
+    };
+};
+export {};

dist/Epg/hooks/useDrag.d.ts

@@ -0,0 +1,44 @@
+import { MouseEvent } from "react";
+import { Program } from "../helpers/interfaces";
+import { DragMouseUp, Position } from "../helpers/types";
+interface UseDragProps {
+    isVerticalMode: boolean;
+    isDndEnabled: boolean;
+    isDndMutlirows: boolean;
+    initialPosition: Omit<Position, "edgeEnd">;
+    data: Program;
+    dayWidth: number;
+    itemHeight: number;
+    contentHeight: number;
+    dndSnapX?: number;
+    dndSnapY?: number;
+    elementRef: React.RefObject<HTMLDivElement>;
+    mouseUpCb: (props: DragMouseUp) => void;
+    dndMouseUpCb?: (props: DragMouseUp, data: Program) => void;
+}
+export declare function useDrag(props: UseDragProps): {
+    currentPositionX: number;
+    dndEvents: {
+        isDragging: boolean;
+    };
+} | {
+    dndEvents: {
+        onTouchStart: (e: MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>) => void;
+        onTouchEnd: () => Promise<void>;
+        onMouseDown?: undefined;
+        onMouseUp?: undefined;
+        isDragging: boolean;
+        ref: import("react").RefObject<HTMLDivElement>;
+        onClick: (e: MouseEvent<HTMLDivElement>) => void;
+    } | {
+        onMouseDown: (e: MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>) => void;
+        onMouseUp: () => Promise<void>;
+        onTouchStart?: undefined;
+        onTouchEnd?: undefined;
+        isDragging: boolean;
+        ref: import("react").RefObject<HTMLDivElement>;
+        onClick: (e: MouseEvent<HTMLDivElement>) => void;
+    };
+    currentPositionX: number;
+};
+export {};

dist/Epg/hooks/useEpg.d.ts

@@ -0,0 +1,184 @@
+import React from "react";
+import { Area, ChannelWithOmittedUuid, DragAndDrop, Grid, HoursInDay, Mode, Overlap, ProgramOverlaps, ProgramWithOmittedUuid, Snap, Theme, Timezone } from "../helpers/interfaces";
+import { DateTime, BaseTimeFormat, Position, InitialScrollPositions, ProgramItem, DragMouseUp, ResizeMouseUp, ChannelWithPosition } from "../helpers/types";
+interface useEpgProps {
+    isVerticalMode?: boolean;
+    isRTL?: boolean;
+    isBaseTimeFormat?: BaseTimeFormat;
+    isSidebar?: boolean;
+    isTimeline?: boolean;
+    isLine?: boolean;
+    isCurrentTime?: boolean;
+    isInitialScrollToNow?: boolean;
+    isResize?: boolean;
+    initialScrollPositions?: InitialScrollPositions;
+    channels: ChannelWithOmittedUuid[];
+    epg: ProgramWithOmittedUuid[];
+    width?: number;
+    height?: number;
+    startDate?: DateTime;
+    endDate?: DateTime;
+    liveRefreshTime?: number;
+    mode?: Mode;
+    timezone?: Timezone;
+    overlap?: Overlap;
+    timelineDividers?: number;
+    snap?: Snap;
+    grid?: Grid;
+    dnd?: DragAndDrop;
+    areas?: Area[];
+    hoursInDays?: HoursInDay[];
+    theme?: Theme;
+    globalStyles?: string;
+    dayWidth?: number;
+    sidebarWidth?: number;
+    timelineHeight?: number;
+    itemHeight?: number;
+    itemOverscan?: number;
+    channelMapKey?: string;
+    programChannelMapKey?: string;
+}
+export declare function useEpg(props: useEpgProps): {
+    isLayoutBottom: (offset?: number) => boolean;
+    isLayoutRight: (offset?: number) => boolean;
+    getEpgProps: () => {
+        isVerticalMode: boolean;
+        isRTL: boolean;
+        isSidebar: boolean;
+        isLine: boolean;
+        isTimeline: boolean;
+        width: number | undefined;
+        height: number | undefined;
+        sidebarWidth: number;
+        timelineHeight: number;
+        ref: React.RefObject<HTMLDivElement>;
+        theme: Theme;
+        globalStyles: string | undefined;
+    };
+    getLayoutProps: () => {
+        ref: React.RefObject<HTMLDivElement>;
+        numberOfMonths: number;
+        numberOfHoursInDay: number;
+        monthWidth: number;
+        offsetStartHoursRange: number;
+        numberOfDays: number;
+        days: string[];
+        months: string[];
+        isVerticalMode: boolean;
+        isRTL: boolean;
+        isBaseTimeFormat: boolean;
+        isSidebar: boolean;
+        isTimeline: boolean;
+        isLine: boolean;
+        isCurrentTime: boolean;
+        isProgramVisible: (position: Position, overlapsCount: number) => boolean;
+        isChannelVisible: (position: Pick<Position, "top" | "height">) => boolean;
+        isTimelineVisible: (position: Pick<Position, "left" | "width">) => boolean;
+        isToday: boolean;
+        isResize: boolean;
+        programs: {
+            position: {
+                width: number;
+                height: number;
+                top: number;
+                left: number;
+                edgeEnd: number;
+            };
+            data: {
+                since: string;
+                till: string;
+                channelUuid: string;
+                id: string;
+                index: number;
+                title: string;
+                description: string;
+                image: string;
+                channelIndex: number;
+                channelPosition: Pick<Position, "top" | "height">;
+                fixedVisibility?: boolean | undefined;
+                parentChannelUuid?: string | undefined;
+            };
+        }[];
+        programOverlaps: ProgramOverlaps;
+        channels: ChannelWithPosition[];
+        channelOverlapsCount: Record<string, number>;
+        layerOverlapLevel: number;
+        snap: Snap | undefined;
+        grid: Grid;
+        gridItems: {
+            position: {
+                top: number;
+                left: number;
+                width: number;
+                height: number;
+                edgeEnd: number;
+            };
+            channel: ChannelWithPosition;
+        }[];
+        dnd: DragAndDrop;
+        startDate: DateTime;
+        endDate: DateTime;
+        hoursInDays: import("../helpers").HoursInDayDiffTime[];
+        liveRefreshTime: number;
+        scrollY: number;
+        dayWidth: number;
+        hourWidth: number;
+        sidebarWidth: number;
+        timelineHeight: number;
+        itemHeight: number;
+        currentDate: string;
+        mode: {
+            type: "day" | "week" | "month";
+            style?: "default" | "modern" | undefined;
+        };
+        timezone: {
+            enabled: boolean;
+            zone: string;
+            mode: string;
+        };
+        timelineDividers: number;
+        overlapMode: "stack" | "layer";
+        overlap: {
+            enabled: boolean;
+            mode: "stack" | "layer";
+            layerOverlapLevel?: number | undefined;
+        };
+        areas: Area[];
+        openChannelGroupTree: (data: ChannelWithPosition) => void;
+        onScroll: (e: React.UIEvent<HTMLDivElement, UIEvent> & {
+            target: Element;
+        }) => void;
+        dragMouseUp: (props: DragMouseUp) => Promise<void>;
+        resizeMouseUp: (props: ResizeMouseUp) => void;
+    };
+    getLayoutData: (events: ProgramItem[]) => {
+        [x: string]: any;
+        channelUuid: string;
+        id: string;
+        index: number;
+        title: string;
+        description: string;
+        since: string | number | Date;
+        till: string | number | Date;
+        image: string;
+        channelIndex: number;
+        channelPosition: Pick<Position, "top" | "height">;
+        fixedVisibility?: boolean | undefined;
+        parentChannelUuid?: string | undefined;
+    }[];
+    getDropItemData: (data: ProgramWithOmittedUuid) => {
+        since: string;
+        till: string;
+        channelUuid?: string | undefined;
+        id: string;
+        title: string;
+        image: string;
+    };
+    onScrollToNow: () => void;
+    onScrollTop: (value?: number) => void;
+    onScrollLeft: (value?: number) => void;
+    onScrollRight: (value?: number) => void;
+    scrollY: number;
+    scrollX: number;
+};
+export {};

dist/Epg/hooks/useGrid.d.ts

@@ -0,0 +1,31 @@
+import { Mode, Grid as IGrid, HoursInDayDiffTime } from "../helpers/interfaces";
+import { BaseTimeFormat, ChannelWithPosition, Position } from "../helpers/types";
+interface UseGridProps {
+    isVerticalMode: boolean;
+    isBaseTimeFormat: BaseTimeFormat;
+    hourWidth: number;
+    dayWidth: number;
+    days: string[];
+    hoursInDays: HoursInDayDiffTime[];
+    months: string[];
+    numberOfDays: number;
+    numberOfHoursInDay: number;
+    numberOfMonths: number;
+    offsetStartHoursRange: number;
+    grid: IGrid;
+    mode: Mode;
+    sidebarWidth: number;
+    timelineHeight: number;
+    timelineDividers: number;
+}
+export declare function useGrid({ mode, grid, timelineHeight, sidebarWidth, hourWidth, dayWidth, ...rest }: UseGridProps): {
+    onItemClick: (item: {
+        position: Position;
+        channel: ChannelWithPosition;
+    }, index?: number | undefined) => () => void;
+    onItemDrop: (item: {
+        position: Position;
+        channel: ChannelWithPosition;
+    }, index?: number | undefined, dataAttributes?: Record<string, string> | undefined) => () => void;
+};
+export {};

dist/Epg/hooks/useGridExternalDnD.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import { ChannelWithPosition, GridEvent, Position } from "../helpers/types";
+interface useGridCellItemProps {
+    onItemDrop?: GridEvent;
+}
+export declare function useGridExternalDnD({ onItemDrop }?: useGridCellItemProps): {
+    isDragOver: boolean;
+    dropAreaRef: React.MutableRefObject<null>;
+    onDrop: (item: {
+        position: Position;
+        channel: ChannelWithPosition;
+    }, index: number) => (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragEnter: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragLeave: (e: React.DragEvent<HTMLDivElement>) => void;
+};
+export {};

dist/Epg/hooks/useInterval.d.ts

@@ -0,0 +1 @@
+export declare function useInterval(callback: () => void, delay: number | null): void;

dist/Epg/hooks/useIsTouchDevice.d.ts

@@ -0,0 +1 @@
+export declare function useIsTouchDevice(): boolean;

dist/Epg/hooks/useLayout.d.ts

@@ -0,0 +1,36 @@
+import React from "react";
+import { HoursInDayDiffTime } from "../helpers/interfaces";
+import { DateTime, InitialScrollPositions } from "../helpers/types";
+interface useLayoutProps {
+    isVerticalMode: boolean;
+    isToday: boolean;
+    isInitialScrollToNow: boolean;
+    initialScrollPositions: InitialScrollPositions;
+    height?: number;
+    width?: number;
+    hourWidth: number;
+    sidebarWidth: number;
+    channelsNumber: number;
+    startDate: DateTime;
+    endDate: DateTime;
+    currentDate: string;
+    hoursInDays: HoursInDayDiffTime[];
+}
+export declare function useLayout({ isVerticalMode, isToday, isInitialScrollToNow, initialScrollPositions, height, width, channelsNumber, startDate, endDate, hourWidth, sidebarWidth, hoursInDays, }: useLayoutProps): {
+    containerRef: React.RefObject<HTMLDivElement>;
+    scrollBoxRef: React.RefObject<HTMLDivElement>;
+    scrollX: number;
+    scrollY: number;
+    layoutWidth: number;
+    layoutHeight: number;
+    isLayoutBottom: (offset?: number) => boolean;
+    isLayoutRight: (offset?: number) => boolean;
+    onScroll: (e: React.UIEvent<HTMLDivElement, UIEvent> & {
+        target: Element;
+    }) => void;
+    onScrollToNow: () => void;
+    onScrollTop: (value?: number) => void;
+    onScrollLeft: (value?: number) => void;
+    onScrollRight: (value?: number) => void;
+};
+export {};

dist/Epg/hooks/useLine.d.ts

@@ -0,0 +1,17 @@
+import { HoursInDayDiffTime, Timezone } from "../helpers/interfaces";
+import { DateTime } from "../helpers/types";
+interface useLineProps {
+    timezone: Timezone;
+    startDate: DateTime;
+    endDate: DateTime;
+    dayWidth: number;
+    hourWidth: number;
+    sidebarWidth: number;
+    hoursInDays: HoursInDayDiffTime[];
+    liveRefreshTime: number;
+}
+export declare function useLine({ timezone, startDate, endDate, hoursInDays, dayWidth, hourWidth, sidebarWidth, liveRefreshTime, }: useLineProps): {
+    showLine: boolean;
+    positionX: number;
+};
+export {};

dist/Epg/hooks/useProgram.d.ts

@@ -0,0 +1,139 @@
+import React from "react";
+import { DragAndDrop, Mode, Snap } from "../helpers/interfaces";
+import { ProgramItem, BaseTimeFormat, DragMouseUp, ResizeMouseUp, DateTime } from "../helpers/types";
+interface useProgramProps<T> {
+    isVerticalMode?: boolean;
+    isRTL?: boolean;
+    isBaseTimeFormat: BaseTimeFormat;
+    isResize?: boolean;
+    startDate: DateTime;
+    contentHeight: number;
+    dayWidth: number;
+    hourWidth: number;
+    program: T;
+    liveRefreshTime: number;
+    minWidth?: number;
+    itemHeight: number;
+    snap?: Snap;
+    mode: Mode;
+    dnd: DragAndDrop;
+    dragMouseUp: (data: DragMouseUp) => void;
+    resizeMouseUp: (data: ResizeMouseUp) => void;
+}
+export declare function useProgram<T extends ProgramItem>({ isVerticalMode, isRTL, isResize, isBaseTimeFormat, startDate, contentHeight, dayWidth, itemHeight, hourWidth, minWidth, program, liveRefreshTime, mode, snap, dnd, dragMouseUp, resizeMouseUp, }: useProgramProps<T>): {
+    isMouseEvent: boolean;
+    isLive: boolean;
+    isMinWidth: boolean;
+    isRTL: boolean;
+    resizeEvents: {
+        isResizing: boolean;
+        resources: {
+            ref: React.RefObject<HTMLDivElement>;
+            isResizing: boolean;
+        };
+        eventsLeft: {
+            onTouchStart: (e: React.MouseEvent<Element, MouseEvent> | React.TouchEvent<Element>) => void;
+            onTouchEnd: () => void;
+            onMouseDown?: undefined;
+            onMouseUp?: undefined;
+            isResize: true;
+            isVerticalMode: boolean;
+            left: boolean;
+            onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        } | {
+            onMouseDown: (e: React.MouseEvent<Element, MouseEvent> | React.TouchEvent<Element>) => void;
+            onMouseUp: () => void;
+            onTouchStart?: undefined;
+            onTouchEnd?: undefined;
+            isResize: true;
+            isVerticalMode: boolean;
+            left: boolean;
+            onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        };
+        eventsRight: {
+            onTouchStart: (e: React.MouseEvent<Element, MouseEvent> | React.TouchEvent<Element>) => void;
+            onTouchEnd: () => void;
+            onMouseDown?: undefined;
+            onMouseUp?: undefined;
+            isResize: true;
+            isVerticalMode: boolean;
+            onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        } | {
+            onMouseDown: (e: React.MouseEvent<Element, MouseEvent> | React.TouchEvent<Element>) => void;
+            onMouseUp: () => void;
+            onTouchStart?: undefined;
+            onTouchEnd?: undefined;
+            isResize: true;
+            isVerticalMode: boolean;
+            onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        };
+    } | {
+        isResizing: boolean;
+        resources: {
+            ref?: undefined;
+            isResizing?: undefined;
+        };
+        eventsLeft: {};
+        eventsRight: {};
+    };
+    formatTime: (date: string | number | Date, formatType?: string) => string;
+    set12HoursTimeFormat: () => string;
+    getMouseEvents: () => {
+        isDragging: boolean;
+        ref: React.RefObject<HTMLDivElement>;
+        isResizing: boolean;
+    } | {
+        onTouchStart: (e: React.MouseEvent<HTMLDivElement, MouseEvent> | React.TouchEvent<HTMLDivElement>) => void;
+        onTouchEnd: () => Promise<void>;
+        onMouseDown?: undefined;
+        onMouseUp?: undefined;
+        isDragging: boolean;
+        ref: React.RefObject<HTMLDivElement>;
+        onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        isResizing: boolean;
+    } | {
+        onMouseDown: (e: React.MouseEvent<HTMLDivElement, MouseEvent> | React.TouchEvent<HTMLDivElement>) => void;
+        onMouseUp: () => Promise<void>;
+        onTouchStart?: undefined;
+        onTouchEnd?: undefined;
+        isDragging: boolean;
+        ref: React.RefObject<HTMLDivElement>;
+        onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        isResizing: boolean;
+    } | {
+        isDragging: boolean;
+        ref?: undefined;
+        isResizing?: undefined;
+    } | {
+        onTouchStart: (e: React.MouseEvent<HTMLDivElement, MouseEvent> | React.TouchEvent<HTMLDivElement>) => void;
+        onTouchEnd: () => Promise<void>;
+        onMouseDown?: undefined;
+        onMouseUp?: undefined;
+        isDragging: boolean;
+        ref: React.RefObject<HTMLDivElement>;
+        onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        isResizing?: undefined;
+    } | {
+        onMouseDown: (e: React.MouseEvent<HTMLDivElement, MouseEvent> | React.TouchEvent<HTMLDivElement>) => void;
+        onMouseUp: () => Promise<void>;
+        onTouchStart?: undefined;
+        onTouchEnd?: undefined;
+        isDragging: boolean;
+        ref: React.RefObject<HTMLDivElement>;
+        onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        isResizing?: undefined;
+    };
+    getMouseEventTempTime: () => {
+        since: string;
+        till: string;
+    };
+    getRTLSinceTime: (since: string | number | Date) => string | number | Date;
+    getRTLTillTime: (till: string | number | Date) => string | number | Date;
+    styles: {
+        width: number;
+        position: {
+            [x: string]: any;
+        };
+    };
+};
+export {};

dist/Epg/hooks/useResize.d.ts

@@ -0,0 +1,76 @@
+import React from "react";
+import { Program } from "../helpers/interfaces";
+import { Position, ResizeMouseUp } from "../helpers/types";
+interface UseResizeProps {
+    isVerticalMode: boolean;
+    isResize: boolean;
+    initialPosition: Omit<Position, "edgeEnd">;
+    data: Program;
+    dayWidth: number;
+    contentHeight: number;
+    snapX?: number;
+    elementRef: React.RefObject<HTMLDivElement>;
+    mouseUpCb: (props: ResizeMouseUp) => void;
+}
+export declare function useResize({ isResize, isVerticalMode, data, dayWidth, contentHeight, initialPosition, snapX, elementRef, mouseUpCb, }: UseResizeProps): {
+    width: number;
+    initialWidth: number;
+    currentPositionX: number;
+    resizeEvents: {
+        isResizing: boolean;
+        resources: {
+            ref: React.RefObject<HTMLDivElement>;
+            isResizing: boolean;
+        };
+        eventsLeft: {
+            onTouchStart: (e: React.MouseEvent | React.TouchEvent) => void;
+            onTouchEnd: () => void;
+            onMouseDown?: undefined;
+            onMouseUp?: undefined;
+            isResize: true;
+            isVerticalMode: boolean;
+            left: boolean;
+            onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        } | {
+            onMouseDown: (e: React.MouseEvent | React.TouchEvent) => void;
+            onMouseUp: () => void;
+            onTouchStart?: undefined;
+            onTouchEnd?: undefined;
+            isResize: true;
+            isVerticalMode: boolean;
+            left: boolean;
+            onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        };
+        eventsRight: {
+            onTouchStart: (e: React.MouseEvent | React.TouchEvent) => void;
+            onTouchEnd: () => void;
+            onMouseDown?: undefined;
+            onMouseUp?: undefined;
+            isResize: true;
+            isVerticalMode: boolean;
+            onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        } | {
+            onMouseDown: (e: React.MouseEvent | React.TouchEvent) => void;
+            onMouseUp: () => void;
+            onTouchStart?: undefined;
+            onTouchEnd?: undefined;
+            isResize: true;
+            isVerticalMode: boolean;
+            onClick: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+        };
+    };
+} | {
+    currentPositionX: number;
+    width: number;
+    resizeEvents: {
+        isResizing: boolean;
+        resources: {
+            ref?: undefined;
+            isResizing?: undefined;
+        };
+        eventsLeft: {};
+        eventsRight: {};
+    };
+    initialWidth?: undefined;
+};
+export {};

dist/Epg/hooks/useTimeline.d.ts

@@ -0,0 +1,48 @@
+/// <reference types="react" />
+import { Timeline as ITimeline } from "../helpers/interfaces";
+declare type UseTimelineProps = ITimeline;
+export declare function useTimeline(props: UseTimelineProps): {
+    isWeekMonthMode: boolean;
+    isMonthMode: boolean;
+    isTodayInHoursInDays: boolean;
+    areHoursInDays: boolean;
+    time: (string | number)[];
+    weekDayWidth: number;
+    monthsWidth: {
+        width: number;
+        left: number;
+    }[];
+    timelineHeight: number;
+    dividers: any[];
+    timelineDividers: number;
+    formatWeekMonthDate: (date: string) => string;
+    getTime: (index: number | string) => {
+        time: string;
+        isNewDay: boolean;
+    };
+    getDayMonthName: (date: string) => string;
+    getTimelineProps: () => {
+        isSidebar: boolean;
+        isVerticalMode: boolean | undefined;
+        dayWidth: number;
+        sidebarWidth: number;
+        timelineHeight: number;
+    };
+    getCurrentTimeProps: () => {
+        isBaseTimeFormat: boolean;
+        isVerticalMode: boolean | undefined;
+        isRTL: boolean | undefined;
+        timezone: import("../helpers").Timezone;
+        mode: import("../helpers").Mode;
+        startDate: import("../helpers/types").DateTime;
+        endDate: import("../helpers/types").DateTime;
+        hoursInDays: import("../helpers").HoursInDayDiffTime[];
+        dayWidth: number;
+        timelineHeight: number;
+        hourWidth: number;
+        sidebarWidth: number;
+        liveRefreshTime: number;
+        renderCurrentTime: ((v: import("../helpers").CurrentTimeIndicator) => import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, any> | null) | (new (props: any) => import("react").Component<any, any, any>)>) | undefined;
+    };
+};
+export {};

dist/Epg/index.d.ts

@@ -0,0 +1,220 @@
+/// <reference types="react" />
+import { Line as ILine, Theme as ITheme, Program as IProgram, Timeline as ITimeline, CurrentTimeIndicator as ICurrentTimeIndicator, Mode, GridItemProps as IGridItemProps, GridDividerItemProps as IGridDividerItemProps, DragAndDrop, Snap, GridCell as IGridCell } from "./helpers/interfaces";
+import { ProgramItem as ProgramItemType, ChannelItem as IChannelItem, ChannelWithPosition, BaseTimeFormat as BaseTimeFormatType, DragMouseUp, ResizeMouseUp, DateTime } from "./helpers/types";
+export declare type Channel = ChannelWithPosition;
+export declare type ChannelItem = IChannelItem;
+export declare type CurrentTimeIndicator = ICurrentTimeIndicator;
+export declare type Line = ILine;
+export declare type Program = IProgram;
+export declare type ProgramItem = {
+    program: ProgramItemType;
+    isRTL: boolean;
+    isVerticalMode: boolean;
+    isBaseTimeFormat: BaseTimeFormatType;
+    liveRefreshTime: number;
+    mode: Mode;
+    startDate: DateTime;
+    snap?: Snap;
+    dnd: DragAndDrop;
+    dayWidth: number;
+    itemHeight: number;
+    contentHeight: number;
+    hourWidth: number;
+    dragMouseUp: (data: DragMouseUp) => void;
+    resizeMouseUp: (data: ResizeMouseUp) => void;
+};
+export declare type GridItemProps = IGridItemProps;
+export declare type GridDividerItemProps = IGridDividerItemProps;
+export declare type Timeline = ITimeline;
+export declare type Theme = ITheme;
+export declare type GridCell = Omit<IGridCell, "id">;
+export { Layout, CurrentTime } from "./components";
+export { Epg } from "./Epg";
+export { useEpg, useProgram, useTimeline, useGridExternalDnD } from "./hooks";
+declare const ChannelBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    top: number;
+    height: number;
+    groupTree?: boolean | undefined;
+    theme?: ITheme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, ChannelLogo: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+declare const CurrentTimeBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    top: number;
+    left: number;
+    width: string | number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, CurrentTimeContent: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isBaseTimeFormat?: boolean | undefined;
+    isRTL?: boolean | undefined;
+    isNewDay?: boolean | undefined;
+    theme?: ITheme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+declare const GridItem: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isDayMode: boolean;
+    isHoverHighlight: boolean;
+    isDragOver?: boolean | undefined;
+    isItemClickable: boolean;
+    top: number;
+    left: number;
+    height: number;
+    width: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, GridDivider: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isHoverHighlight: boolean;
+    isDragOver?: boolean | undefined;
+    isItemClickable?: boolean | undefined;
+    left: number;
+    width: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+declare const ProgramBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isResizing?: boolean | undefined;
+    isDragging?: boolean | undefined;
+    width: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, ProgramContent: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isLive: boolean;
+    width: number;
+    theme?: ITheme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, ProgramFlex: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, ProgramStack: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isRTL?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, ProgramTitle: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    theme?: ITheme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>, ProgramText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    theme?: ITheme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>, ProgramImage: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>, ProgramResizeHandle: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isResize?: boolean | undefined;
+    isVerticalMode?: boolean | undefined;
+    left?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+declare const TimelineWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isSidebar: boolean;
+    dayWidth: number;
+    sidebarWidth: number;
+    timelineHeight: number;
+    theme?: ITheme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, TimelineBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isWeekMonthMode?: boolean | undefined;
+    isToday: boolean;
+    isCurrentTime: boolean;
+    isTodayInHoursInDays?: boolean | undefined;
+    areHoursInDays?: boolean | undefined;
+    width: number;
+    left: number;
+    timelineHeight: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, TimelineTime: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isBaseTimeFormat?: boolean | undefined;
+    isWeekMonthMode?: boolean | undefined;
+    isRTL?: boolean | undefined;
+    isNewDay?: boolean | undefined;
+    theme?: ITheme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>, TimelineDividers: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>, TimelineWeekMonthBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isWeekMonthMode?: boolean | undefined;
+    isToday: boolean;
+    isCurrentTime: boolean;
+    isTodayInHoursInDays?: boolean | undefined;
+    areHoursInDays?: boolean | undefined;
+    width: number;
+    left: number;
+    timelineHeight: number;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isWeekMonthMode?: boolean | undefined;
+    isToday: boolean;
+    isCurrentTime: boolean;
+    isTodayInHoursInDays?: boolean | undefined;
+    areHoursInDays?: boolean | undefined;
+    width: number;
+    left: number;
+    timelineHeight: number;
+    styleType?: "default" | "modern" | undefined;
+}, {}, {}>, TimelineWeekMonthDate: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isRTL?: boolean | undefined;
+    styleType?: "default" | "modern" | undefined;
+    theme?: ITheme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export { ChannelBox, ChannelLogo, CurrentTimeBox, CurrentTimeContent, ProgramBox, ProgramContent, ProgramFlex, ProgramStack, ProgramTitle, ProgramText, ProgramImage, ProgramResizeHandle, TimelineWrapper, TimelineBox, TimelineWeekMonthBox, TimelineWeekMonthDate, TimelineTime, TimelineDividers, GridItem, GridDivider, };
+export declare const TimelineDivider: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isNewDay?: boolean | undefined;
+    theme?: ITheme | undefined;
+    width: number;
+    left: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

dist/Epg/styles/Area.styles.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import { Theme } from "../helpers";
+export declare const AreaFiled: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isClickable?: boolean | undefined;
+    positionX: number;
+    height: number;
+    width: number;
+    timelineHeight: number;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AreaBg: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AreaAnnotation: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode: boolean;
+    isLeft?: boolean | undefined;
+    width: number;
+    timelineHeight: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

dist/Epg/styles/Channel.styles.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { Theme } from "../helpers";
+export declare const ChannelWrapper: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    top: number;
+    height: number;
+    groupTree?: boolean | undefined;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ChannelLogo: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;

dist/Epg/styles/Channels.styles.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { Theme } from "../helpers";
+export declare const Box: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isTimeline: boolean;
+    isRTL: boolean;
+    sidebarWidth: number;
+    timelineHeight: number;
+    contentHeight: number;
+    bottom: number;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

dist/Epg/styles/CurrentTime.styles.d.ts

@@ -0,0 +1,28 @@
+/// <reference types="react" />
+import { Theme } from "../helpers";
+export declare const boxStyles: ({ width }?: {
+    width?: string | number | undefined;
+}) => {
+    position: string;
+    top: number;
+    width: string | number;
+    height: number;
+};
+export declare const CurrentTimeBox: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    top: number;
+    left: number;
+    width: number | string;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CurrentTimeContent: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isBaseTimeFormat?: boolean | undefined;
+    isRTL?: boolean | undefined;
+    isNewDay?: boolean | undefined;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

dist/Epg/styles/Epg.styles.d.ts

@@ -0,0 +1,54 @@
+/// <reference types="react" />
+import { Theme } from "../helpers";
+export declare const Container: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    height?: number | undefined;
+    width?: number | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Wrapper: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ScrollBox: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    theme?: Theme | undefined;
+    isRTL?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Box: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isRTL?: boolean | undefined;
+    left?: number | undefined;
+    top?: number | undefined;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Content: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode: boolean;
+    isSidebar: boolean;
+    isTimeline: boolean;
+    theme?: Theme | undefined;
+    dayWidth: number;
+    contentHeight: number;
+    sidebarWidth: number;
+    timelineHeight: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const LayoutBg: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode: boolean;
+    isTimeline: boolean;
+    isSidebar: boolean;
+    dayWidth: number;
+    contentHeight: number;
+    timelineHeight: number;
+    sidebarWidth: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

dist/Epg/styles/Grid.styles.d.ts

@@ -0,0 +1,39 @@
+/// <reference types="react" />
+export declare const GridContainer: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const GridWrapper: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode: boolean;
+    isSidebar: boolean;
+    isTimeline: boolean;
+    sidebarWidth: number;
+    timelineHeight: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const GridItem: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isDayMode: boolean;
+    isHoverHighlight: boolean;
+    isDragOver?: boolean | undefined;
+    isItemClickable: boolean;
+    top: number;
+    left: number;
+    height: number;
+    width: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const GridDivider: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isHoverHighlight: boolean;
+    isDragOver?: boolean | undefined;
+    isItemClickable?: boolean | undefined;
+    left: number;
+    width: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

dist/Epg/styles/Line.styles.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import { Layers, Theme } from "../helpers";
+export declare const lineStyles: {
+    position: string;
+    top: number;
+    width: number;
+};
+export declare const LineBox: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode: boolean;
+    isTimeline: boolean;
+    height: number;
+    left: number;
+    zIndex: Layers;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

dist/Epg/styles/Loader.styles.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+import { Theme } from "../helpers";
+export declare const Box: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Shape: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    width: number;
+    color: "teal" | "purple" | "pink";
+    marginRight?: number | undefined;
+    transition: {
+        duration: number;
+        ease?: string;
+        delay?: number;
+    };
+    animate: {
+        right: string[];
+    };
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

dist/Epg/styles/Program.styles.d.ts

@@ -0,0 +1,57 @@
+/// <reference types="react" />
+import { Theme } from "../helpers";
+export declare const ProgramContent: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isLive: boolean;
+    width: number;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ProgramFlex: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ProgramTitle: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
+export declare const ProgramText: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const ProgramImage: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+export declare const ProgramStack: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isRTL?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ProgramBox: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isResizing?: boolean | undefined;
+    isDragging?: boolean | undefined;
+    width: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ProgramResizeHandle: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isResize?: boolean | undefined;
+    isVerticalMode?: boolean | undefined;
+    left?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

dist/Epg/styles/Timeline.styles.d.ts

@@ -0,0 +1,92 @@
+/// <reference types="react" />
+import { Theme } from "../helpers";
+export declare const TimelineTime: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isBaseTimeFormat?: boolean | undefined;
+    isWeekMonthMode?: boolean | undefined;
+    isRTL?: boolean | undefined;
+    isNewDay?: boolean | undefined;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const TimelineWeekMonthDate: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isRTL?: boolean | undefined;
+    styleType?: "default" | "modern" | undefined;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TimelineDividers: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TimelineDivider: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isNewDay?: boolean | undefined;
+    theme?: Theme | undefined;
+    width: number;
+    left: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TimelineWrapper: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isSidebar: boolean;
+    dayWidth: number;
+    sidebarWidth: number;
+    timelineHeight: number;
+    theme?: Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TimelineBox: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isWeekMonthMode?: boolean | undefined;
+    isToday: boolean;
+    isCurrentTime: boolean;
+    isTodayInHoursInDays?: boolean | undefined;
+    areHoursInDays?: boolean | undefined;
+    width: number;
+    left: number;
+    timelineHeight: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TimelineWeekMonthBox: import("@emotion/styled/macro").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isWeekMonthMode?: boolean | undefined;
+    isToday: boolean;
+    isCurrentTime: boolean;
+    isTodayInHoursInDays?: boolean | undefined;
+    areHoursInDays?: boolean | undefined;
+    width: number;
+    left: number;
+    timelineHeight: number;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & {
+    isVerticalMode?: boolean | undefined;
+    isWeekMonthMode?: boolean | undefined;
+    isToday: boolean;
+    isCurrentTime: boolean;
+    isTodayInHoursInDays?: boolean | undefined;
+    areHoursInDays?: boolean | undefined;
+    width: number;
+    left: number;
+    timelineHeight: number;
+    styleType?: "default" | "modern" | undefined;
+}, {}, {}>;

dist/Epg/styles/global.styles.d.ts

@@ -0,0 +1 @@
+export declare const globalStyles: import("@emotion/utils").SerializedStyles;

dist/Epg/styles/index.d.ts

@@ -0,0 +1,11 @@
+export * from "./global.styles";
+export * as EpgStyled from "./Epg.styles";
+export * as ChannelsStyled from "./Channels.styles";
+export * as ChannelStyled from "./Channel.styles";
+export * as ProgramStyled from "./Program.styles";
+export * as TimelineStyled from "./Timeline.styles";
+export * as LineStyled from "./Line.styles";
+export * as LoaderStyled from "./Loader.styles";
+export * as CurrentTimeStyled from "./CurrentTime.styles";
+export * as AreaStyled from "./Area.styles";
+export * as GridStyled from "./Grid.styles";

dist/Epg/test/db/channels.d.ts

@@ -0,0 +1,26 @@
+interface BuildChannel {
+    [key: string]: any;
+}
+export declare function buildChannel(overrides?: BuildChannel): {
+    country: any;
+    logo: any;
+    provider: number;
+    title: any;
+    type: any;
+    uuid: string;
+    year: any;
+};
+export declare function buildChannelWithPosition(overrides?: BuildChannel): {
+    position: {
+        top: number;
+        height: number;
+    };
+    country: any;
+    logo: any;
+    provider: number;
+    title: any;
+    type: any;
+    uuid: string;
+    year: any;
+};
+export {};

dist/Epg/test/db/epg.d.ts

@@ -0,0 +1,98 @@
+export declare const sinceAndTillTimes: {
+    since: string;
+    till: string;
+}[];
+interface BuildProgram {
+    [key: string]: any;
+}
+export declare function buildProgram(overrides?: BuildProgram): {
+    id: string;
+    description: any;
+    title: any;
+    since: string;
+    till: string;
+    channelUuid: string;
+    image: any;
+    country: any;
+    genre: any;
+    rating: any;
+};
+export interface BuildProgramWithPosition {
+    overrides?: BuildProgram;
+    program?: BuildProgram;
+}
+export declare function buildProgramWithPosition({ overrides, program, }?: BuildProgramWithPosition): {
+    data: {
+        index: number;
+        channelIndex: number;
+        channelPosition: {
+            top: number;
+            height: number;
+        };
+        id: string;
+        description: any;
+        title: any;
+        since: string;
+        till: string;
+        channelUuid: string;
+        image: any;
+        country: any;
+        genre: any;
+        rating: any;
+    } | {
+        index: number;
+        channelIndex: number;
+        channelPosition: {
+            top: number;
+            height: number;
+        };
+        id: string;
+        description: any;
+        title: any;
+        since: string;
+        till: string;
+        channelUuid: string;
+        image: any;
+        country: any;
+        genre: any;
+        rating: any;
+    };
+    position: {
+        height: any;
+        left: any;
+        top: any;
+        width: any;
+    } | {
+        height: any;
+        left: any;
+        top: any;
+        width: any;
+    };
+};
+export declare function buildEpgWithPosition(): {
+    data: {
+        id: any;
+        description: any;
+        title: any;
+        channelUuid: string;
+        image: any;
+        country: any;
+        genre: any;
+        rating: any;
+        since: string;
+        till: string;
+        index: number;
+        channelIndex: number;
+        channelPosition: {
+            top: number;
+            height: number;
+        };
+    };
+    position: {
+        height: any;
+        left: any;
+        top: any;
+        width: any;
+    };
+}[];
+export {};

dist/Epg/test/db/grid.d.ts

@@ -0,0 +1,26 @@
+interface BuildGridItems {
+    [key: string]: any;
+}
+export declare function buildGridItems(overrides?: BuildGridItems): {
+    channel: {
+        country: any;
+        logo: any;
+        provider: number;
+        title: any;
+        type: any;
+        uuid: string;
+        year: any;
+        position: {
+            top: number;
+            height: number;
+        };
+    };
+    position: {
+        top: number;
+        height: number;
+        left: number;
+        width: number;
+        edgeEnd: number;
+    };
+};
+export {};

dist/Epg/test/db/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./channels";
+export * from "./epg";
+export * from "./grid";

dist/Epg/test/helpers.d.ts

@@ -0,0 +1,132 @@
+import { DragAndDrop, Mode, Overlap } from "../helpers/interfaces";
+declare type Overrides = {
+    [key: string]: any;
+};
+export declare function getLayoutProps(overrides?: Overrides, sliceNumber?: number): {
+    isToday: boolean;
+    isSidebar: boolean;
+    isTimeline: boolean;
+    isLine: boolean;
+    isBaseTimeFormat: boolean;
+    isProgramVisible: () => boolean;
+    isChannelVisible: () => boolean;
+    isTimelineVisible: () => boolean;
+    programs: {
+        data: {
+            id: any;
+            description: any;
+            title: any;
+            channelUuid: string;
+            image: any;
+            country: any;
+            genre: any;
+            rating: any;
+            since: string;
+            till: string;
+            index: number;
+            channelIndex: number;
+            channelPosition: {
+                top: number;
+                height: number;
+            };
+        };
+        position: {
+            height: any;
+            left: any;
+            top: any;
+            width: any;
+        };
+    }[];
+    channels: {
+        position: {
+            top: number;
+            height: number;
+        };
+        country: any;
+        logo: any;
+        provider: number;
+        title: any;
+        type: any;
+        uuid: string;
+        year: any;
+    }[];
+    channelOverlapsCount: {};
+    scrollY: number;
+    startDate: string;
+    endDate: string;
+    currentDate: string;
+    months: string[];
+    numberOfMonths: number;
+    monthWidth: number;
+    mode: Mode;
+    dnd: DragAndDrop;
+    hoursInDays: never[];
+    areas: never[];
+    dayWidth: number;
+    hourWidth: number;
+    liveRefreshTime: number;
+    numberOfHoursInDay: number;
+    offsetStartHoursRange: number;
+    numberOfDays: number;
+    days: string[];
+    sidebarWidth: number;
+    timelineHeight: number;
+    itemHeight: number;
+    programOverlaps: {};
+    layerOverlapLevel: number;
+    overlapMode: "layer" | "stack";
+    grid: {
+        enabled: boolean;
+        hoverHighlight: boolean;
+    };
+    overlap: Overlap;
+    gridItems: {
+        channel: {
+            country: any;
+            logo: any;
+            provider: number;
+            title: any;
+            type: any;
+            uuid: string;
+            year: any;
+            position: {
+                top: number;
+                height: number;
+            };
+        };
+        position: {
+            top: number;
+            height: number;
+            left: number;
+            width: number;
+            edgeEnd: number;
+        };
+    }[];
+    onScroll: () => void;
+    dragMouseUp: () => null;
+};
+export declare const getTimeLineProps: (overrides?: Overrides | undefined) => {
+    isToday: boolean;
+    isCurrentTime: boolean;
+    isSidebar: boolean;
+    isTimelineVisible: () => boolean;
+    isBaseTimeFormat: boolean;
+    numberOfHoursInDay: number;
+    offsetStartHoursRange: number;
+    numberOfDays: number;
+    days: string[];
+    dayWidth: number;
+    hourWidth: number;
+    hoursInDays: never[];
+    months: string[];
+    numberOfMonths: number;
+    monthWidth: number;
+    sidebarWidth: number;
+    timelineHeight: number;
+    startDate: string;
+    endDate: string;
+    liveRefreshTime: number;
+    mode: Mode;
+};
+export declare const getTestTimeDate: (h?: string, m?: string, s?: string) => string;
+export {};

dist/Epg/test/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./db";
+export * from "./helpers";

dist/Epg/test/test-utils.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import userEvent from "@testing-library/user-event";
+declare const customRender: (ui: React.ReactElement, options?: Pick<any, string | number | symbol> | undefined) => any;
+export * from "@testing-library/react";
+export { customRender as render, userEvent };

dist/Epg/theme/index.d.ts

@@ -0,0 +1 @@
+export * from "./theme";

dist/Epg/theme/theme.d.ts

@@ -0,0 +1,52 @@
+export declare const theme: {
+    primary: {
+        600: string;
+        900: string;
+    };
+    grey: {
+        300: string;
+    };
+    white: string;
+    teal: {
+        100: string;
+    };
+    green: {
+        200: string;
+        300: string;
+    };
+    loader: {
+        teal: string;
+        purple: string;
+        pink: string;
+        bg: string;
+    };
+    scrollbar: {
+        border: string;
+        thumb: {
+            bg: string;
+        };
+    };
+    gradient: {
+        blue: {
+            300: string;
+            600: string;
+            900: string;
+        };
+    };
+    text: {
+        grey: {
+            300: string;
+            500: string;
+        };
+    };
+    timeline: {
+        divider: {
+            bg: string;
+        };
+    };
+    grid: {
+        item: string;
+        divider: string;
+        highlight: string;
+    };
+};

dist/Epg/utils/time.d.ts

@@ -0,0 +1,4 @@
+export declare const getNewDateTimeTz: (date: Date | string | number) => number;
+export declare const getNewDateTz: (date?: string | number | Date | undefined) => Date;
+export declare const formatTz: (date: Date | number, formatTime?: string) => string;
+export declare const zonedDateTimeToUtc: (date: Date) => Date;

dist/index.d.ts

@@ -0,0 +1 @@
+export * from "./Epg";

dist/index.js

@@ -0,0 +1,8 @@
+
+'use strict'
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./planby-pro.cjs.production.min.js')
+} else {
+  module.exports = require('./planby-pro.cjs.development.js')
+}

package.json

@@ -0,0 +1,96 @@
+{
+  "name": "@nessprim/planby-pro",
+  "author": "Karol Kozer",
+  "version": "3.10.0",
+  "license": "Custom License",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Nessprim/planby-pro"
+  },
+  "publishConfig": {
+    "registry": "https://npm.pkg.github.com"
+  },
+  "homepage": "https://planby.app",
+  "funding": {
+    "type": "opencollective",
+    "url": "https://opencollective.com/planby"
+  },
+  "main": "dist/index.js",
+  "typings": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "engines": {
+    "node": ">=10"
+  },
+  "scripts": {
+    "start": "tsdx watch",
+    "build": "tsdx build",
+    "test": "tsdx test --passWithNoTests",
+    "lint": "tsdx lint",
+    "prepare": "tsdx build && bundlewatch",
+    "size": "bundlewatch",
+    "test:watch": "jest --watchAll"
+  },
+  "peerDependencies": {
+    "react": ">=16"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "tsdx lint"
+    }
+  },
+  "prettier": {
+    "printWidth": 80,
+    "semi": true,
+    "singleQuote": true,
+    "trailingComma": "es5"
+  },
+  "module": "dist/planby-pro.esm.js",
+  "bundlewatch": {
+    "files": [
+      {
+        "path": "dist/planby-pro.cjs.production.min.js",
+        "maxSize": "26kB"
+      },
+      {
+        "path": "dist/planby-pro.esm.js",
+        "maxSize": "56kB"
+      }
+    ]
+  },
+  "dependencies": {
+    "@emotion/react": "^11.9.0",
+    "@emotion/styled": "^11.8.1",
+    "date-fns": "^2.28.0",
+    "date-fns-tz": "^2.0.0",
+    "use-debounce": "^7.0.1"
+  },
+  "keywords": [
+    "epg",
+    "schedule",
+    "harmongram",
+    "react",
+    "hooks",
+    "electronic",
+    "program",
+    "guide",
+    "timeline",
+    "events"
+  ],
+  "devDependencies": {
+    "@faker-js/faker": "^6.1.2",
+    "@size-limit/preset-small-lib": "^7.0.8",
+    "@types/jest": "^27.4.0",
+    "@types/react": "^17.0.38",
+    "babel-plugin-jsx-remove-data-test-id": "^3.0.0",
+    "bundlewatch": "^0.3.3",
+    "husky": "^7.0.4",
+    "jest": "^27.5.1",
+    "size-limit": "^7.0.8",
+    "ts-jest": "^27.1.3",
+    "tsdx": "^0.14.1",
+    "tslib": "^2.3.1",
+    "typescript": "^4.6.3"
+  }
+}