@koine/react 2.0.0-beta.5 → 2.0.0-beta.51

package/Buttons/Button.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-/**
- * Prevent 300ms delay with `touch-action` performance optimization,
- * @see https://twitter.com/argyleink/status/1405881231695302659
- */
-export declare const btnStyleUndo: import("styled-components").FlattenSimpleInterpolation;
-export declare const btnStyleReset: import("styled-components").FlattenSimpleInterpolation;
-export declare const btnStyleBase: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<KoineButtonUiProps, import("styled-components").DefaultTheme>>;
-export declare const btnStyleContained: import("styled-components").FlattenSimpleInterpolation;
-export declare const btnStyleOutlined: import("styled-components").FlattenSimpleInterpolation;
-export declare const KoineButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, KoineButtonUiProps, never>;
-export type KoineButtonUiProps = {
-    disabled?: boolean;
-    $variant?: "contained" | "outlined";
-    $noGutter?: boolean;
-    $block?: boolean;
-};
-export type KoineButtonProps = KoineButtonUiProps & React.ComponentPropsWithRef<"button">;

package/Buttons/Button.js

@@ -1,106 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    btnStyleUndo: function() {
-        return btnStyleUndo;
-    },
-    btnStyleReset: function() {
-        return btnStyleReset;
-    },
-    btnStyleBase: function() {
-        return btnStyleBase;
-    },
-    btnStyleContained: function() {
-        return btnStyleContained;
-    },
-    btnStyleOutlined: function() {
-        return btnStyleOutlined;
-    },
-    KoineButton: function() {
-        return KoineButton;
-    }
-});
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard._(require("styled-components"));
-const _styled = require("../styles/styled");
-const btnStyleUndo = (0, _styledcomponents.css)`
-  appearance: none;
-  -webkit-appearance: none;
-  -webkit-touch-callout: none;
-  user-select: none;
-  touch-action: manipulation;
-  outline: 0px;
-  color: var(--bodyColor);
-`;
-const btnStyleReset = (0, _styledcomponents.css)`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  background: transparent;
-  border-width: 1px;
-  border-style: solid;
-  border-color: transparent;
-  cursor: pointer;
-  ${btnStyleUndo}
-
-  &[disabled] {
-    cursor: default;
-    opacity: 0.7;
-  }
-`;
-const btnStyleBase = (0, _styledcomponents.css)`
-  ${btnStyleReset}
-
-  min-width: ${(p)=>p.$noGutter ? "0" : "150px"};
-  padding: ${(p)=>p.$noGutter ? "0" : "10px 30px"};
-  border-radius: 0;
-  text-align: center;
-  text-transform: uppercase;
-  font-weight: 600;
-  ${(p)=>p.$block && `width: 100%; display: flex;`}
-
-  &:focus,
-  &:active,
-  &:visited {
-    ${_styled.stateFocus}
-  }
-
-  /* This targets icons within a button */
-  & svg {
-    margin: 0 1em 0 0;
-    font-size: 1.25em;
-  }
-`;
-const btnStyleContained = (0, _styledcomponents.css)`
-  color: white;
-  background: var(--accent200);
-  border-color: var(--accent200);
-
-  &:hover:not([disabled]) {
-    background: var(--accent300);
-    border-color: var(--accent300);
-  }
-`;
-const btnStyleOutlined = (0, _styledcomponents.css)`
-  color: var(--accent200);
-  border-color: var(--accent200);
-
-  &:hover:not([disabled]) {
-    background: var(--accent300);
-    border-color: var(--accent300);
-    color: white;
-  }
-`;
-const KoineButton = _styledcomponents.default.button`
-  ${btnStyleBase}
-  ${(p)=>p.$variant === "outlined" && btnStyleOutlined}
-  ${(p)=>p.$variant === "contained" && btnStyleContained}
-`;

package/Buttons/Button.mjs

@@ -1,78 +0,0 @@
-import styled, { css } from "styled-components";
-import { stateFocus } from "../styles/styled";
-/**
- * Prevent 300ms delay with `touch-action` performance optimization,
- * @see https://twitter.com/argyleink/status/1405881231695302659
- */ export const btnStyleUndo = css`
-  appearance: none;
-  -webkit-appearance: none;
-  -webkit-touch-callout: none;
-  user-select: none;
-  touch-action: manipulation;
-  outline: 0px;
-  color: var(--bodyColor);
-`;
-export const btnStyleReset = css`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  background: transparent;
-  border-width: 1px;
-  border-style: solid;
-  border-color: transparent;
-  cursor: pointer;
-  ${btnStyleUndo}
-
-  &[disabled] {
-    cursor: default;
-    opacity: 0.7;
-  }
-`;
-export const btnStyleBase = css`
-  ${btnStyleReset}
-
-  min-width: ${(p)=>p.$noGutter ? "0" : "150px"};
-  padding: ${(p)=>p.$noGutter ? "0" : "10px 30px"};
-  border-radius: 0;
-  text-align: center;
-  text-transform: uppercase;
-  font-weight: 600;
-  ${(p)=>p.$block && `width: 100%; display: flex;`}
-
-  &:focus,
-  &:active,
-  &:visited {
-    ${stateFocus}
-  }
-
-  /* This targets icons within a button */
-  & svg {
-    margin: 0 1em 0 0;
-    font-size: 1.25em;
-  }
-`;
-export const btnStyleContained = css`
-  color: white;
-  background: var(--accent200);
-  border-color: var(--accent200);
-
-  &:hover:not([disabled]) {
-    background: var(--accent300);
-    border-color: var(--accent300);
-  }
-`;
-export const btnStyleOutlined = css`
-  color: var(--accent200);
-  border-color: var(--accent200);
-
-  &:hover:not([disabled]) {
-    background: var(--accent300);
-    border-color: var(--accent300);
-    color: white;
-  }
-`;
-export const KoineButton = styled.button`
-  ${btnStyleBase}
-  ${(p)=>p.$variant === "outlined" && btnStyleOutlined}
-  ${(p)=>p.$variant === "contained" && btnStyleContained}
-`;

package/Buttons/ButtonComposite.d.ts

@@ -1,23 +0,0 @@
-/// <reference types="react" />
-import { IconBaseProps, IconType } from "react-icons/lib";
-import { KoineComponent, KoineComponentProps } from "../types";
-import { KoineButtonProps } from "./Button";
-import { ButtonLinkProps } from "./ButtonLink";
-export type KoineButtonCompositeProps = KoineButtonProps & Omit<ButtonLinkProps, "Koine"> & {
-    Icon?: IconType | React.ElementType;
-    iconProps?: IconBaseProps;
-    textMain?: string;
-    textSub?: string;
-    text?: string;
-    textReverse?: boolean;
-};
-export type ButtonCompositeStyledProps = {
-    $twoLines?: boolean;
-    $reverse?: boolean;
-    $icon?: boolean;
-};
-export type ButtonCompositeProps = KoineComponentProps<KoineButtonCompositeProps, {
-    Button?: KoineComponent;
-    ButtonLink?: KoineComponent;
-}>;
-export declare const KoineButtonComposite: ({ Icon, iconProps, textMain, textSub, textReverse, text, Button, ButtonLink, ...props }: ButtonCompositeProps) => import("react/jsx-runtime").JSX.Element;

package/Buttons/ButtonComposite.js

@@ -1,83 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "KoineButtonComposite", {
-    enumerable: true,
-    get: function() {
-        return KoineButtonComposite;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _react = require("react");
-const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
-const Root = _styledcomponents.default.span`
-  ${(p)=>p.$icon ? `display: flex;` : `display: inline-block; text-align: left;`}
-  min-width: 0;
-
-  & svg {
-    font-size: 2em !important;
-    margin: 0 0.33em 0 0 !important;
-  }
-`;
-const ButtonCompositeIcon = _styledcomponents.default.svg`
-  float: left;
-`;
-const BesidesIcon = _styledcomponents.default.span`
-  text-align: left;
-  line-height: 1.2;
-`;
-const Main = _styledcomponents.default.span`
-  display: block;
-  font-size: 0.9em;
-
-  &:last-child {
-    margin-top: ${(p)=>p.$reverse && !p.$icon ? "0.5em" : "0"};
-  }
-`;
-const Sub = _styledcomponents.default.span`
-  display: block;
-  text-transform: none;
-  font-size: 0.7em;
-  font-weight: 500;
-
-  ${Main} + & {
-    margin-top: ${(p)=>p.$reverse && !p.$icon ? "0.5em" : "0"};
-  }
-`;
-const Text = _styledcomponents.default.span``;
-const Inner = /*#__PURE__*/ (0, _react.memo)(({ textMain, textSub, text, $reverse, $icon })=>/*#__PURE__*/ React.createElement(React.Fragment, null, $reverse ? /*#__PURE__*/ React.createElement(React.Fragment, null, textSub && /*#__PURE__*/ React.createElement(Sub, {
-        $icon: $icon,
-        $reverse: $reverse
-    }, textSub), textMain && /*#__PURE__*/ React.createElement(Main, {
-        $icon: $icon,
-        $reverse: $reverse
-    }, textMain)) : /*#__PURE__*/ React.createElement(React.Fragment, null, textMain && /*#__PURE__*/ React.createElement(Main, {
-        $icon: $icon,
-        $reverse: $reverse
-    }, textMain), textSub && /*#__PURE__*/ React.createElement(Sub, {
-        $icon: $icon,
-        $reverse: $reverse
-    }, textSub)), text && /*#__PURE__*/ React.createElement(Text, null, text)));
-const KoineButtonComposite = ({ Icon, iconProps = {}, textMain, textSub, textReverse, text, Button = "button", ButtonLink = "a", ...props })=>{
-    const Btn = props.href ? ButtonLink : Button;
-    const styledProps = {
-        $icon: !!Icon,
-        $reverse: textReverse,
-        $twoLines: !!(textMain && textSub && !Icon)
-    };
-    const innerProps = {
-        textMain,
-        textSub,
-        text,
-        ...styledProps
-    };
-    return /*#__PURE__*/ React.createElement(Root, {
-        as: Btn,
-        ...props,
-        ...styledProps
-    }, Icon && /*#__PURE__*/ React.createElement(ButtonCompositeIcon, {
-        as: Icon,
-        ...iconProps
-    }), Icon ? /*#__PURE__*/ React.createElement(BesidesIcon, styledProps, /*#__PURE__*/ React.createElement(Inner, innerProps)) : /*#__PURE__*/ React.createElement(Inner, innerProps));
-};

package/Buttons/ButtonComposite.mjs

@@ -1,72 +0,0 @@
-import { memo } from "react";
-import styled from "styled-components";
-const Root = styled.span`
-  ${(p)=>p.$icon ? `display: flex;` : `display: inline-block; text-align: left;`}
-  min-width: 0;
-
-  & svg {
-    font-size: 2em !important;
-    margin: 0 0.33em 0 0 !important;
-  }
-`;
-const ButtonCompositeIcon = styled.svg`
-  float: left;
-`;
-const BesidesIcon = styled.span`
-  text-align: left;
-  line-height: 1.2;
-`;
-const Main = styled.span`
-  display: block;
-  font-size: 0.9em;
-
-  &:last-child {
-    margin-top: ${(p)=>p.$reverse && !p.$icon ? "0.5em" : "0"};
-  }
-`;
-const Sub = styled.span`
-  display: block;
-  text-transform: none;
-  font-size: 0.7em;
-  font-weight: 500;
-
-  ${Main} + & {
-    margin-top: ${(p)=>p.$reverse && !p.$icon ? "0.5em" : "0"};
-  }
-`;
-const Text = styled.span``;
-const Inner = /*#__PURE__*/ memo(({ textMain, textSub, text, $reverse, $icon })=>/*#__PURE__*/ React.createElement(React.Fragment, null, $reverse ? /*#__PURE__*/ React.createElement(React.Fragment, null, textSub && /*#__PURE__*/ React.createElement(Sub, {
-        $icon: $icon,
-        $reverse: $reverse
-    }, textSub), textMain && /*#__PURE__*/ React.createElement(Main, {
-        $icon: $icon,
-        $reverse: $reverse
-    }, textMain)) : /*#__PURE__*/ React.createElement(React.Fragment, null, textMain && /*#__PURE__*/ React.createElement(Main, {
-        $icon: $icon,
-        $reverse: $reverse
-    }, textMain), textSub && /*#__PURE__*/ React.createElement(Sub, {
-        $icon: $icon,
-        $reverse: $reverse
-    }, textSub)), text && /*#__PURE__*/ React.createElement(Text, null, text)));
-export const KoineButtonComposite = ({ Icon, iconProps = {}, textMain, textSub, textReverse, text, Button = "button", ButtonLink = "a", ...props })=>{
-    const Btn = props.href ? ButtonLink : Button;
-    const styledProps = {
-        $icon: !!Icon,
-        $reverse: textReverse,
-        $twoLines: !!(textMain && textSub && !Icon)
-    };
-    const innerProps = {
-        textMain,
-        textSub,
-        text,
-        ...styledProps
-    };
-    return /*#__PURE__*/ React.createElement(Root, {
-        as: Btn,
-        ...props,
-        ...styledProps
-    }, Icon && /*#__PURE__*/ React.createElement(ButtonCompositeIcon, {
-        as: Icon,
-        ...iconProps
-    }), Icon ? /*#__PURE__*/ React.createElement(BesidesIcon, styledProps, /*#__PURE__*/ React.createElement(Inner, innerProps)) : /*#__PURE__*/ React.createElement(Inner, innerProps));
-};

package/Buttons/ButtonFab.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-import { IconButtonProps } from "./IconButton";
-export declare const buttonFab: import("styled-components").FlattenSimpleInterpolation;
-export declare const IconButtonFab: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, import("./Button").KoineButtonUiProps & {
-    disabled?: boolean | undefined;
-}, never>;
-export type IconButtonFabProps = IconButtonProps & React.ComponentPropsWithRef<"button">;

package/Buttons/ButtonFab.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    buttonFab: function() {
-        return buttonFab;
-    },
-    IconButtonFab: function() {
-        return IconButtonFab;
-    }
-});
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard._(require("styled-components"));
-const _IconButton = require("./IconButton");
-const buttonFab = (0, _styledcomponents.css)`
-  box-shadow: 3px 3px 6px -4px rgb(0, 0, 0, 0.5);
-`;
-const IconButtonFab = (0, _styledcomponents.default)(_IconButton.IconButton)`
-  ${buttonFab}
-`;

package/Buttons/ButtonFab.mjs

@@ -1,8 +0,0 @@
-import styled, { css } from "styled-components";
-import { IconButton } from "./IconButton";
-export const buttonFab = css`
-  box-shadow: 3px 3px 6px -4px rgb(0, 0, 0, 0.5);
-`;
-export const IconButtonFab = styled(IconButton)`
-  ${buttonFab}
-`;

package/Buttons/ButtonLink.d.ts

@@ -1,8 +0,0 @@
-import { KoineLinkProps } from "../Link";
-import { KoineComponent, KoineComponentProps } from "../types";
-import { KoineButtonUiProps } from "./Button";
-export type KoineButtonLinkProps = KoineButtonUiProps & KoineLinkProps;
-export type ButtonLinkProps = KoineComponentProps<KoineButtonLinkProps, {
-    Link?: KoineComponent;
-}>;
-export declare const KoineButtonLink: ({ href, Link, ...props }: React.PropsWithChildren<ButtonLinkProps>) => import("react/jsx-runtime").JSX.Element;

package/Buttons/ButtonLink.js

@@ -1,28 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "KoineButtonLink", {
-    enumerable: true,
-    get: function() {
-        return KoineButtonLink;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
-const _Button = require("./Button");
-const Root = (0, _styledcomponents.default)(_Button.KoineButton)`
-  text-decoration: none;
-`;
-const KoineButtonLink = ({ href, Link = "a", ...props })=>{
-    const isRelative = href && href.startsWith("/");
-    return isRelative ? /*#__PURE__*/ React.createElement(Root, {
-        href: href,
-        ...props,
-        as: Link
-    }) : /*#__PURE__*/ React.createElement(Root, {
-        href: href,
-        ...props,
-        as: "a"
-    });
-};

package/Buttons/ButtonLink.mjs

@@ -1,17 +0,0 @@
-import styled from "styled-components";
-import { KoineButton } from "./Button";
-const Root = styled(KoineButton)`
-  text-decoration: none;
-`;
-export const KoineButtonLink = ({ href, Link = "a", ...props })=>{
-    const isRelative = href && href.startsWith("/");
-    return isRelative ? /*#__PURE__*/ React.createElement(Root, {
-        href: href,
-        ...props,
-        as: Link
-    }) : /*#__PURE__*/ React.createElement(Root, {
-        href: href,
-        ...props,
-        as: "a"
-    });
-};

package/Buttons/IconButton.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { KoineButtonUiProps } from "./Button";
-export declare const iconBtnStyleReset: import("styled-components").FlattenSimpleInterpolation;
-export declare const iconBtnStyleBase: import("styled-components").FlattenSimpleInterpolation;
-export declare const IconButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, KoineButtonUiProps & {
-    disabled?: boolean | undefined;
-}, never>;
-export type IconButtonUiProps = KoineButtonUiProps & {
-    disabled?: boolean;
-};
-export type IconButtonProps = IconButtonUiProps & React.ComponentPropsWithRef<"button">;

package/Buttons/IconButton.js

@@ -1,41 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    iconBtnStyleReset: function() {
-        return iconBtnStyleReset;
-    },
-    iconBtnStyleBase: function() {
-        return iconBtnStyleBase;
-    },
-    IconButton: function() {
-        return IconButton;
-    }
-});
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard._(require("styled-components"));
-const _Button = require("./Button");
-const iconBtnStyleReset = (0, _styledcomponents.css)`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 44px;
-  height: 44px;
-  border-radius: 100%;
-  ${_Button.btnStyleReset}
-`;
-const iconBtnStyleBase = (0, _styledcomponents.css)`
-  ${iconBtnStyleReset}
-`;
-const IconButton = _styledcomponents.default.button`
-  ${iconBtnStyleBase}
-  ${(p)=>p.$variant === "outlined" && _Button.btnStyleOutlined}
-  ${(p)=>p.$variant === "contained" && _Button.btnStyleContained}
-`;

package/Buttons/IconButton.mjs

@@ -1,19 +0,0 @@
-import styled, { css } from "styled-components";
-import { btnStyleContained, btnStyleOutlined, btnStyleReset } from "./Button";
-export const iconBtnStyleReset = css`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 44px;
-  height: 44px;
-  border-radius: 100%;
-  ${btnStyleReset}
-`;
-export const iconBtnStyleBase = css`
-  ${iconBtnStyleReset}
-`;
-export const IconButton = styled.button`
-  ${iconBtnStyleBase}
-  ${(p)=>p.$variant === "outlined" && btnStyleOutlined}
-  ${(p)=>p.$variant === "contained" && btnStyleContained}
-`;

package/Buttons/index.d.ts

@@ -1,5 +0,0 @@
-export * from "./Button";
-export * from "./ButtonComposite";
-export * from "./ButtonFab";
-export * from "./ButtonLink";
-export * from "./IconButton";

package/Buttons/index.js

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-const _export_star = require("@swc/helpers/_/_export_star");
-_export_star._(require("./Button"), exports);
-_export_star._(require("./ButtonComposite"), exports);
-_export_star._(require("./ButtonFab"), exports);
-_export_star._(require("./ButtonLink"), exports);
-_export_star._(require("./IconButton"), exports);

package/Buttons/index.mjs

@@ -1,5 +0,0 @@
-export * from "./Button";
-export * from "./ButtonComposite";
-export * from "./ButtonFab";
-export * from "./ButtonLink";
-export * from "./IconButton";

package/Calendar/CalendarDaygridCell.js

@@ -1,82 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "CalendarDaygridCell", {
-    enumerable: true,
-    get: function() {
-        return CalendarDaygridCell;
-    }
-});
-const _react = require("react");
-const _md = require("react-icons/md");
-const _utils = require("./utils");
-/**
- * Style for button within a event cell
- *
- * Here we might differentiate week/month view where the first does not get
- * ellipsed btn texts, with `Start` as block element and underneath the `Title`
- * on multiple lines, but that would mean that we loose the ability to interweave
- * single-day events among the spaces left by wider multi-days events.
- */ const styleBtn = {
-    overflow: "hidden",
-    whiteSpace: "nowrap",
-    textOverflow: "ellipsis"
-};
-const CalendarDaygridCell = ({ eventClicked, setEventClicked, // eventHovered,
-setEventHovered, view, maxEvents, events, calendarsMap, Cell = "div", CellOverflow = "div", CellEvent = "div", CellEventBtn = "div", CellEventTitle = "span", CellEventStart = "span" })=>{
-    const [isExpanded, expand] = (0, _react.useState)(false);
-    const eventsWithoutPlaceholders = events.filter((event)=>!event.placeholder);
-    return /*#__PURE__*/ React.createElement(Cell, null, events.map((event, i)=>{
-        if (i === maxEvents && !isExpanded) {
-            return /*#__PURE__*/ React.createElement(CellOverflow, {
-                key: "overflowMessage" + i,
-                onClick: ()=>expand(true)
-            }, /*#__PURE__*/ React.createElement(_md.MdAdd, null), eventsWithoutPlaceholders.length - maxEvents);
-        }
-        if (i > maxEvents && !isExpanded) return null;
-        if (event.placeholder) {
-            return /*#__PURE__*/ React.createElement(_react.Fragment, {
-                key: event.key
-            }, /*#__PURE__*/ React.createElement(CellEvent, {
-                $placeholder: true
-            }, /*#__PURE__*/ React.createElement(CellEventBtn, {
-                "aria-hidden": "true",
-                style: {
-                    visibility: "hidden"
-                },
-                $placeholder: true
-            }, /*#__PURE__*/ React.createElement(CellEventTitle, null, "\xa0"))));
-        }
-        const styleEvent = {
-            zIndex: event.firstOfMulti ? 1 : 0,
-            position: "relative",
-            width: event.firstOfMulti ? `${100 * event.width}%` : "100%"
-        };
-        if (!calendarsMap[event.calendar.id].on) {
-            // @ts-expect-error nevermind
-            styleBtn.display = "none";
-        }
-        const styledProps = {
-            $view: view,
-            $selected: eventClicked?.uid === event.uid,
-            $past: event.isPast,
-            $color: event.color,
-            $isOutOfRange: event.$isOutOfRange,
-            $isToday: event.$isToday
-        };
-        return /*#__PURE__*/ React.createElement(_react.Fragment, {
-            key: event.key
-        }, /*#__PURE__*/ React.createElement(CellEvent, {
-            style: styleEvent,
-            ...styledProps
-        }, /*#__PURE__*/ React.createElement(CellEventBtn, {
-            role: "button",
-            style: styleBtn,
-            ...styledProps,
-            onClick: ()=>setEventClicked((prev)=>prev?.uid === event.uid ? null : event),
-            onMouseEnter: ()=>setEventHovered(event),
-            onMouseLeave: ()=>setEventHovered(null)
-        }, event.allDay ? /*#__PURE__*/ React.createElement(CellEventTitle, null, event.title) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(CellEventStart, null, (0, _utils.getDisplayTime)(event.start)), /*#__PURE__*/ React.createElement(CellEventTitle, null, event.title)))));
-    }));
-};