scorer-ui-kit 3.0.2 → 3.0.3

package/dist/index.modern.js

@@ -1,7 +1,7 @@
 import { a as Icon, c as animation, d as dimensions, f as fontFamily, i as Spinner, l as deviceMediaQuery, n as LineSet, o as IconSVGs, r as LineSetContext, s as IconWrapper$4, t as LineUIVideoBase, u as deviceSize } from "./LineUIVideoBase-CJ61ZqPJ.mjs";
 import styled, { createGlobalStyle, css, keyframes } from "styled-components";
-import React, { Fragment, useCallback, useContext, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useReducer, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import React, { Children, Fragment, cloneElement, isValidElement, useCallback, useContext, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useReducer, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import ReactDom from "react-dom";
 import { add, addMonths, eachDayOfInterval, eachWeekOfInterval, endOfDay, endOfMonth, endOfWeek, format, intervalToDuration, isAfter, isEqual, isSameDay, isSameMonth, isToday, isWithinInterval, min, set, startOfDay, startOfMonth } from "date-fns";
 import { Link, useLocation, useNavigate } from "react-router-dom";
@@ -12392,6 +12392,366 @@ var TagList = ({ tagsConfig }) => {
 	}) });
 };
 //#endregion
+//#region src/Chips/atoms/ChipButton.tsx
+var collapse = keyframes`
+  to {
+    width: 0;
+    opacity: 0;
+    border-left-width: 0;
+  }
+`;
+var StyledChip = styled.button`
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 56px;
+  height: 56px;
+  padding: 0;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  outline: none;
+  box-sizing: border-box;
+  font-family: var(--font-ui);
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 20px;
+  color: var(--grey-12);
+  transition:
+    color var(--speed-normal) var(--easing-primary-in-out),
+    background-color var(--speed-normal) var(--easing-primary-in-out);
+
+  ${({ $showDivider }) => $showDivider && css`border-left: 1px solid var(--grey-4);`}
+
+  & svg [stroke] { stroke: var(--grey-12); }
+
+  &::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: -1px;
+    right: -1px;
+    height: 4px;
+    background-color: transparent;
+    transition: background-color var(--speed-normal) var(--easing-primary-in-out);
+  }
+  &:hover:enabled::after { background-color: var(--primary-6); }
+
+  &:focus-visible {
+    outline: 2px solid var(--primary-9);
+    outline-offset: -2px;
+  }
+
+  ${({ $selected }) => $selected && css`
+    background-color: var(--primary-a3);
+    color: var(--primary-11);
+    & svg [stroke] { stroke: var(--primary-11); }
+    &::after { background-color: var(--primary-9); }
+    &:hover:enabled::after { background-color: var(--primary-9); }
+  `}
+
+  &:disabled { cursor: not-allowed; opacity: 0.5; }
+
+  ${({ $leaving }) => $leaving && css`
+    overflow: hidden;
+    min-width: 0;
+    pointer-events: none;
+    animation: ${collapse} var(--speed-fast) var(--easing-primary-in-out) forwards;
+
+    @media (prefers-reduced-motion: reduce) { animation: none; }
+  `}
+`;
+var ChipButton = ({ variant = "text", icon, label, selected = false, noDivider = false, leaving = false, onLeaveEnd, onAnimationEnd, children, ...props }) => {
+	const showDivider = !noDivider;
+	const isMenuButton = props["aria-haspopup"] !== void 0;
+	const hasFired = useRef(false);
+	const fireLeaveEnd = useCallback(() => {
+		if (hasFired.current) return;
+		hasFired.current = true;
+		onLeaveEnd?.();
+	}, [onLeaveEnd]);
+	useEffect(() => {
+		if (!leaving) {
+			hasFired.current = false;
+			return;
+		}
+		if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) fireLeaveEnd();
+	}, [leaving, fireLeaveEnd]);
+	const handleAnimationEnd = useCallback((e) => {
+		onAnimationEnd?.(e);
+		if (leaving && e.target === e.currentTarget) fireLeaveEnd();
+	}, [
+		leaving,
+		fireLeaveEnd,
+		onAnimationEnd
+	]);
+	return /* @__PURE__ */ jsx(StyledChip, {
+		type: "button",
+		"aria-pressed": isMenuButton ? void 0 : selected,
+		$selected: selected,
+		$showDivider: showDivider,
+		$leaving: leaving,
+		...props,
+		onAnimationEnd: handleAnimationEnd,
+		children: variant === "icon" && icon ? /* @__PURE__ */ jsx(Icon, {
+			icon,
+			size: 16
+		}) : label ?? children
+	});
+};
+//#endregion
+//#region src/Chips/atoms/ChipZoneBreak.tsx
+var Break = styled.div`
+  box-sizing: border-box;
+  flex-shrink: 0;
+  width: 12px;
+  height: 56px;
+  background-color: var(--grey-3);
+  border-left: 1px solid var(--grey-4);
+  border-right: 1px solid var(--grey-4);
+`;
+var ChipZoneBreak = (props) => /* @__PURE__ */ jsx(Break, {
+	"aria-hidden": "true",
+	...props
+});
+//#endregion
+//#region src/Chips/molecules/ChipDropdown.tsx
+var Wrapper = styled.div`
+  position: relative;
+  display: inline-flex;
+`;
+var Trigger = styled(ChipButton)`
+  && {
+    background-color: transparent;
+
+    ${({ $labelled }) => $labelled && css`
+      width: auto;
+      padding: 0 16px 0 14px;
+      gap: 8px;
+      justify-content: flex-start;
+      white-space: nowrap;
+      color: var(--grey-12);
+      & svg [stroke] { stroke: var(--grey-12); }
+    `}
+  }
+`;
+var Menu = styled.div`
+  position: absolute;
+  top: calc(100% + 8px);
+  left: -1px;
+  z-index: 100;
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  min-width: 216px;
+  padding: 4px 0;
+  background: var(--grey-1);
+  border: 1px solid var(--grey-4);
+  border-radius: 4px;
+  box-shadow: 0px 5px 25px 0px var(--filter-button-shadow-color);
+`;
+var MenuItem = styled.button`
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  width: 100%;
+  height: var(--button-height, 32px);
+  padding: 3px 8px;
+  border: none;
+  border-bottom: 1px solid var(--grey-7);
+  background: transparent;
+  cursor: pointer;
+  font-family: var(--font-ui);
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 20px;
+  color: var(--grey-12);
+  text-align: left;
+  transition: background-color var(--speed-fast) var(--easing-primary-in-out);
+
+  & svg [stroke] { stroke: var(--grey-12); }
+
+  &:last-child { border-bottom: none; }
+  &:hover:enabled { background-color: var(--grey-3); }
+  &:disabled { cursor: not-allowed; opacity: 0.5; }
+
+  ${({ $current }) => $current && css`
+    background-color: var(--grey-4);
+    &:hover:enabled { background-color: var(--grey-5); }
+  `}
+`;
+var CheckSlot = styled.span`
+  display: flex;
+  margin-left: auto;
+`;
+var ChipDropdown = ({ items, icon = "FilterEllipsis", label, selectedId, checkIcon = "Success", triggerLabel, noDivider = false, disabled = false, onOpenChange, onKeyDown, ...props }) => {
+	const [isOpen, setIsOpen] = useState(false);
+	const wrapperRef = useRef(null);
+	const isLabelled = Boolean(label);
+	const marksCurrent = selectedId !== void 0;
+	const ariaLabel = triggerLabel ?? (isLabelled ? void 0 : "Space actions");
+	const setOpen = useCallback((next) => {
+		setIsOpen(next);
+		onOpenChange?.(next);
+	}, [onOpenChange]);
+	const close = useCallback(() => setOpen(false), [setOpen]);
+	const toggle = useCallback(() => setOpen(!isOpen), [isOpen, setOpen]);
+	useClickOutside(wrapperRef, useCallback(() => {
+		if (isOpen) close();
+	}, [isOpen, close]));
+	useEffect(() => {
+		if (disabled && isOpen) close();
+	}, [
+		disabled,
+		isOpen,
+		close
+	]);
+	const handleKeyDown = useCallback((e) => {
+		onKeyDown?.(e);
+		if (e.key === "Escape" && isOpen) close();
+	}, [
+		isOpen,
+		close,
+		onKeyDown
+	]);
+	return /* @__PURE__ */ jsxs(Wrapper, {
+		ref: wrapperRef,
+		...props,
+		onKeyDown: handleKeyDown,
+		children: [/* @__PURE__ */ jsx(Trigger, {
+			$labelled: isLabelled,
+			variant: isLabelled ? void 0 : "icon",
+			icon: isLabelled ? void 0 : icon,
+			selected: isOpen,
+			noDivider,
+			disabled,
+			"aria-label": ariaLabel,
+			"aria-haspopup": "menu",
+			"aria-expanded": isOpen,
+			onClick: toggle,
+			children: isLabelled ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
+				icon ? /* @__PURE__ */ jsx(Icon, {
+					icon,
+					size: 18
+				}) : null,
+				label,
+				/* @__PURE__ */ jsx(Icon, {
+					icon: "Down",
+					size: 12
+				})
+			] }) : null
+		}), isOpen && !disabled ? /* @__PURE__ */ jsx(Menu, {
+			role: "menu",
+			children: items.map((item) => {
+				const isCurrent = marksCurrent && item.id === selectedId;
+				return /* @__PURE__ */ jsxs(MenuItem, {
+					type: "button",
+					role: marksCurrent ? "menuitemradio" : "menuitem",
+					"aria-checked": marksCurrent ? isCurrent : void 0,
+					$current: isCurrent,
+					disabled: item.disabled,
+					onClick: () => {
+						item.onClick?.();
+						close();
+					},
+					children: [
+						item.icon ? /* @__PURE__ */ jsx(Icon, {
+							icon: item.icon,
+							size: 14
+						}) : null,
+						item.label,
+						isCurrent ? /* @__PURE__ */ jsx(CheckSlot, {
+							"aria-hidden": "true",
+							children: /* @__PURE__ */ jsx(Icon, {
+								icon: checkIcon,
+								size: 14,
+								weight: "light"
+							})
+						}) : null
+					]
+				}, item.id);
+			})
+		}) : null]
+	});
+};
+//#endregion
+//#region src/Chips/organisms/ChipBar.tsx
+var Bar = styled.div`
+  display: flex;
+  align-items: center;
+  height: 56px;
+
+  & > * {
+    flex-shrink: 0;
+  }
+`;
+var NAV_KEYS = [
+	"ArrowLeft",
+	"ArrowRight",
+	"Home",
+	"End"
+];
+var ChipBar = ({ children, onKeyDown, onFocus, ...props }) => {
+	const barRef = useRef(null);
+	const [activeIndex, setActiveIndex] = useState(0);
+	const getCells = useCallback(() => {
+		const root = barRef.current;
+		if (!root) return [];
+		return Array.from(root.querySelectorAll("button:not(:disabled)")).filter((el) => !el.closest("[role=\"menu\"]"));
+	}, []);
+	useEffect(() => {
+		const root = barRef.current;
+		if (!root) return;
+		const sync = () => {
+			const focusables = getCells();
+			const index = Math.min(activeIndex, focusables.length - 1);
+			focusables.forEach((cell, i) => {
+				cell.tabIndex = i === index ? 0 : -1;
+			});
+		};
+		sync();
+		const observer = new MutationObserver(sync);
+		observer.observe(root, {
+			childList: true,
+			subtree: true,
+			attributes: true,
+			attributeFilter: ["disabled"]
+		});
+		return () => observer.disconnect();
+	}, [activeIndex, getCells]);
+	const cells = Children.toArray(children).filter(isValidElement);
+	const handleFocus = useCallback((e) => {
+		onFocus?.(e);
+		const index = getCells().indexOf(e.target);
+		if (index >= 0) setActiveIndex(index);
+	}, [getCells, onFocus]);
+	const handleKeyDown = useCallback((e) => {
+		onKeyDown?.(e);
+		if (!NAV_KEYS.includes(e.key)) return;
+		if (barRef.current?.querySelector("[role=\"menu\"]")) return;
+		const focusables = getCells();
+		const current = focusables.indexOf(document.activeElement);
+		if (focusables.length === 0 || current < 0) return;
+		e.preventDefault();
+		let next = current;
+		if (e.key === "ArrowLeft") next = (current - 1 + focusables.length) % focusables.length;
+		if (e.key === "ArrowRight") next = (current + 1) % focusables.length;
+		if (e.key === "Home") next = 0;
+		if (e.key === "End") next = focusables.length - 1;
+		focusables[next]?.focus();
+	}, [getCells, onKeyDown]);
+	return /* @__PURE__ */ jsx(Bar, {
+		ref: barRef,
+		role: "toolbar",
+		"aria-label": "Chip bar",
+		...props,
+		onFocus: handleFocus,
+		onKeyDown: handleKeyDown,
+		children: cells.map((child, i) => i === 0 && typeof child.type !== "string" ? cloneElement(child, { noDivider: true }) : child)
+	});
+};
+//#endregion
 //#region src/Modals/ConfirmationModal.tsx
 var Container$20 = styled.div``;
 var Title$3 = styled.div`
@@ -13203,7 +13563,7 @@ var Container$17 = styled.div`
   width: 100%;
   display: flex;
 `;
-var LeftArea = styled.div`
+var LeftArea$1 = styled.div`
   display: flex;
   align-items: center;
   gap: var(--columnPadding, 16px);
@@ -13288,7 +13648,7 @@ var UtilityHeader = ({ showBreadcrumbs = true, breadcrumbs = [], showHomeIcon =
 	const { isLarge } = useBreakpoints();
 	const iconInGutter = $iconInGutter !== void 0 ? $iconInGutter : isLarge;
 	const hasBreadcrumbs = showBreadcrumbs && breadcrumbs.length > 0;
-	return /* @__PURE__ */ jsxs(Container$17, { children: [/* @__PURE__ */ jsxs(LeftArea, { children: [back && /* @__PURE__ */ jsx(UtilityHeaderBack, {
+	return /* @__PURE__ */ jsxs(Container$17, { children: [/* @__PURE__ */ jsxs(LeftArea$1, { children: [back && /* @__PURE__ */ jsx(UtilityHeaderBack, {
 		$showDivider: hasBreadcrumbs,
 		$iconInGutter: iconInGutter,
 		...back
@@ -14083,6 +14443,11 @@ var NotificationsHistory = ({ read, unread, noNotificationsText = "No new notifi
 };
 //#endregion
 //#region src/Global/molecules/TopBar.tsx
+var RESERVED_DRAWER_IDS = [
+	"user",
+	"notifications",
+	"custom"
+];
 var Container$10 = styled.div`
   z-index: 9;
   position: sticky;
@@ -14103,6 +14468,10 @@ var RightArea = styled.div`
   gap: 24px;
   height: 100%;
 `;
+var LeftArea = styled.div`
+  display: flex;
+  height: 100%;
+`;
 var SearchBar = styled.div`
   flex: 0 1 500px;
   display: flex;
@@ -14248,20 +14617,45 @@ var NotificationsContainer = styled.div`
     overflow-y: scroll;
     margin-right: -17px;
 `;
-var TopBar = ({ hasNotifications = false, hasLanguage = false, selectedLanguageText = "", languageOptionsText, selectedLangAttribute, hasLogout = true, logoutLink = "/logout", logoutText = "Logout", hasSearch = false, hasCurrentUser = true, currentUserText = "Current User", accountOptionText = "Account Options", searchPlaceholder = "Search for devices, analysis tasks, etc.", userSubmenu = [], userDrawerBespoke, loggedInUser, notificationsHistory, customDrawer, hasSwitchTheme = false, isLightMode = true, switchThemeText = "SWITCH THEME", selectedThemeText = "", onLogout = () => {}, onLanguageToggle = () => {}, onThemeToggle = () => {}, userDrawerFooter, userDrawerMeta, onUserDrawerMetaClick = () => {}, hasUserDrawerMeta, copySuccessMessage, includeCopyTitle, hasUserDrawerFooter, badge }) => {
-	const [openDrawer, setOpenDrawer] = useState(null);
+var TopBar = ({ hasNotifications = false, hasLanguage = false, selectedLanguageText = "", languageOptionsText, selectedLangAttribute, hasLogout = true, logoutLink = "/logout", logoutText = "Logout", hasSearch = false, hasCurrentUser = true, currentUserText = "Current User", accountOptionText = "Account Options", searchPlaceholder = "Search for devices, analysis tasks, etc.", userSubmenu = [], userDrawerBespoke, loggedInUser, notificationsHistory, customDrawer, hasSwitchTheme = false, isLightMode = true, switchThemeText = "SWITCH THEME", selectedThemeText = "", onLogout = () => {}, onLanguageToggle = () => {}, onThemeToggle = () => {}, userDrawerFooter, userDrawerMeta, onUserDrawerMetaClick = () => {}, hasUserDrawerMeta, copySuccessMessage, includeCopyTitle, hasUserDrawerFooter, badge, leftAreaElement, sideDrawers, activeDrawer, onActiveDrawerChange }) => {
+	const [internalDrawer, setInternalDrawer] = useState(null);
+	const isControlled = activeDrawer !== void 0;
+	const openDrawer = isControlled ? activeDrawer : internalDrawer;
 	const toggleDrawers = (drawerKey) => {
-		setOpenDrawer((prevDrawer) => {
-			if (prevDrawer === drawerKey) return null;
-			return drawerKey;
-		});
+		const nextDrawer = openDrawer === drawerKey ? null : drawerKey;
+		if (!isControlled) setInternalDrawer(nextDrawer);
+		onActiveDrawerChange?.(nextDrawer);
 	};
+	const { sideDrawersToRender, sideDrawerWarnings } = useMemo(() => {
+		const toRender = [];
+		const warnings = [];
+		const acceptedIds = /* @__PURE__ */ new Set();
+		for (const drawer of sideDrawers ?? []) {
+			if (RESERVED_DRAWER_IDS.includes(drawer.id)) {
+				warnings.push(`the side drawer with id "${drawer.id}" uses a reserved id (${RESERVED_DRAWER_IDS.join(", ")}), so it will not open when its trigger is clicked. Please use a different id.`);
+				continue;
+			}
+			if (acceptedIds.has(drawer.id)) {
+				warnings.push(`a side drawer with id "${drawer.id}" already exists; the duplicate will not open when its trigger is clicked. Please use a unique id.`);
+				continue;
+			}
+			acceptedIds.add(drawer.id);
+			toRender.push(drawer);
+		}
+		return {
+			sideDrawersToRender: toRender,
+			sideDrawerWarnings: warnings
+		};
+	}, [sideDrawers]);
+	useEffect(() => {
+		for (const warning of sideDrawerWarnings) console.warn(`TopBar: ${warning}`);
+	}, []);
 	return /* @__PURE__ */ jsxs(Container$10, { children: [
 		hasSearch ? /* @__PURE__ */ jsxs(SearchBar, { children: [/* @__PURE__ */ jsx(IconWrapper, { children: /* @__PURE__ */ jsx(Icon, {
 			icon: "Search",
 			size: 16,
 			color: "grey-6"
-		}) }), /* @__PURE__ */ jsx(SearchInput, { placeholder: searchPlaceholder })] }) : /* @__PURE__ */ jsx("div", {}),
+		}) }), /* @__PURE__ */ jsx(SearchInput, { placeholder: searchPlaceholder })] }) : leftAreaElement ? /* @__PURE__ */ jsx(LeftArea, { children: leftAreaElement }) : /* @__PURE__ */ jsx("div", {}),
 		/* @__PURE__ */ jsxs(RightArea, { children: [badge && /* @__PURE__ */ jsx(TopBarBadge, { ...badge }), /* @__PURE__ */ jsxs(ButtonArea, { children: [
 			customDrawer && /* @__PURE__ */ jsx(DrawerToggle, {
 				$isActive: openDrawer === "custom",
@@ -14329,7 +14723,12 @@ var TopBar = ({ hasNotifications = false, hasLanguage = false, selectedLanguageT
 				$isOpen: openDrawer === "custom",
 				$baseWidth: customDrawer.width ? customDrawer.width : "200px",
 				children: customDrawer.customComponent
-			})
+			}),
+			sideDrawersToRender.map((drawer) => /* @__PURE__ */ jsx(Drawer, {
+				$isOpen: openDrawer === drawer.id,
+				$baseWidth: drawer.width ? drawer.width : "200px",
+				children: drawer.content
+			}, drawer.id))
 		] }), document.body)
 	] });
 };
@@ -15420,7 +15819,10 @@ var HeaderContainer = styled.div`
     flex-grow: 3;
   }
 `;
-var MobileNavbar = ({ content, home, logoMark, supportUrl, defaultMenuOpen = true, closeText, hasLanguage, hasLogout, logoutLink, hasCurrentUser, hasNotifications, userSubmenu, userDrawerBespoke, loggedInUser, notificationsHistory, customDrawer, supportText, onLogout, onLanguageToggle, ...props }) => {
+var MobileNavbar = ({ content, home, logoMark, supportUrl, defaultMenuOpen = true, closeText, hasLanguage, hasLogout, logoutLink, hasCurrentUser, hasNotifications, userSubmenu, userDrawerBespoke, loggedInUser, notificationsHistory, customDrawer, sideDrawers, supportText, onLogout, onLanguageToggle, ...props }) => {
+	useEffect(() => {
+		if (sideDrawers?.length) console.warn("MobileNavbar: `sideDrawers` are not supported on mobile and will not open. Use `customDrawer` for a drawer that works across breakpoints.");
+	}, []);
 	return /* @__PURE__ */ jsx(Container$1, { children: /* @__PURE__ */ jsxs(Tabs, { children: [/* @__PURE__ */ jsxs(HeaderContainer, { children: [/* @__PURE__ */ jsx(MobileLogoLink, {
 		home,
 		logoMark,
@@ -15622,6 +16024,6 @@ var Sidebar = ({ children, ...props }) => {
 	});
 };
 //#endregion
-export { ActionButtons, ActionsBar, AlertBar, AlertWrapper, AreaUploadManager, AvatarUploader, BackLink, BaseStyles, BasicSearchInput, Button, ButtonWithIcon, ButtonWithLoading, ButtonsStack, CameraPanelWrapper, CameraPanels, Checkbox, ConfirmationModal, Content, ContentLayout, CropTool, DatePicker, DebouncedSearcher, DropArea, DurationSlider, EditCell, FilterBar, FilterButton, FilterDropdown, FilterDropdownContainer, FilterInputs, FilterLayout, FiltersResults, FlexContentPlaceholder, Form, FullWidthContentBlock, GlobalUI, Icon, IconButton, IconSVGs, Input, InputFileButton, IntroductionText, Label, Layout, LineReducer_default as LineReducer, LineSetContext, LineUI, LineUI$1 as LineUIRTC, LineUIVideo, Logo, MainContainer, MainMenu, MediaBox, ModalContext, ModalProvider, MultilineContent, Notification, NotificationProvider, PageHeader, PageTitle, Pagination, PasswordField, PercentageSlider, RadioButton, SelectField, SelectWrapper, Sidebar, SidebarBox, SidebarHeading, SidebarLink, SidebarLinkHeading, SliderInput, SmallInput, SortDropdown, Spinner, SplitButton, SplitLayout, StatusIcon, Switch, Tab, TabContent, TabContext, TabList, TabWithIcon, TableHeaderTitle, TableRowThumbnail, Tabs, TabsWithIconBar, Tag, TagList, TagListWrapper, TextArea, TextAreaField, TextField, ThemeVariables, ToggleButton, Tooltip, TopBar, TypeTable, UtilityHeader, WebRTCPlayer as WebRTCClient, theme_default as defaultTheme, isDateInterval, isFilterItem, resetButtonStyles, useClickOutside, useCopyToClipboard, useInterval, useMediaModal, useModal, useNotification, usePoll, useThemeToggle, useTitle, useTo };
+export { ActionButtons, ActionsBar, AlertBar, AlertWrapper, AreaUploadManager, AvatarUploader, BackLink, BaseStyles, BasicSearchInput, Button, ButtonWithIcon, ButtonWithLoading, ButtonsStack, CameraPanelWrapper, CameraPanels, Checkbox, ChipBar, ChipButton, ChipDropdown, ChipZoneBreak, ConfirmationModal, Content, ContentLayout, CropTool, DatePicker, DebouncedSearcher, DropArea, DurationSlider, EditCell, FilterBar, FilterButton, FilterDropdown, FilterDropdownContainer, FilterInputs, FilterLayout, FiltersResults, FlexContentPlaceholder, Form, FullWidthContentBlock, GlobalUI, Icon, IconButton, IconSVGs, Input, InputFileButton, IntroductionText, Label, Layout, LineReducer_default as LineReducer, LineSetContext, LineUI, LineUI$1 as LineUIRTC, LineUIVideo, Logo, MainContainer, MainMenu, MediaBox, ModalContext, ModalProvider, MultilineContent, Notification, NotificationProvider, PageHeader, PageTitle, Pagination, PasswordField, PercentageSlider, RadioButton, SelectField, SelectWrapper, Sidebar, SidebarBox, SidebarHeading, SidebarLink, SidebarLinkHeading, SliderInput, SmallInput, SortDropdown, Spinner, SplitButton, SplitLayout, StatusIcon, Switch, Tab, TabContent, TabContext, TabList, TabWithIcon, TableHeaderTitle, TableRowThumbnail, Tabs, TabsWithIconBar, Tag, TagList, TagListWrapper, TextArea, TextAreaField, TextField, ThemeVariables, ToggleButton, Tooltip, TopBar, TypeTable, UtilityHeader, WebRTCPlayer as WebRTCClient, theme_default as defaultTheme, isDateInterval, isFilterItem, resetButtonStyles, useClickOutside, useCopyToClipboard, useInterval, useMediaModal, useModal, useNotification, usePoll, useThemeToggle, useTitle, useTo };
 
 //# sourceMappingURL=index.modern.js.map