@wistia/vhs 5.0.5 → 6.0.0

package/dist/index.js

@@ -1,32 +1,31 @@
 
 /*
- * @license @wistia/vhs v5.0.5
+ * @license @wistia/vhs v6.0.0
  *
  * Copyright (c) 2021-2026, Wistia, Inc. and its affiliates.
  *
  * This source code is unlicensed, all rights reserved.
  */
 
-import { hasKey, isArray, isBoolean, isEmptyString, isFunction, isNil, isNonEmptyArray, isNonEmptyString, isNotNil, isNotUndefined, isNumber, isString as isString$1, isUndefined } from "@wistia/type-guards";
-import { addDays, addMonths, addYears, compareAsc, differenceInCalendarDays, differenceInDays, eachDayOfInterval, eachMonthOfInterval, endOfDay, endOfMonth, getDay, getDaysInMonth, getYear, isAfter, isBefore, isEqual, isFuture, isSameDay, isValid, isWithinInterval, startOfDay, startOfMonth } from "date-fns";
-import { daysInWeek } from "date-fns/constants";
-import { ThemeProvider, createGlobalStyle, css, keyframes, styled, useTheme as useTheme$1 } from "styled-components";
-import { darken, getValueAndUnit, transparentize } from "polished";
 import { LiveAnnouncer, LiveMessage } from "react-aria-live";
 import { AnimatePresence, MotionConfig, motion } from "motion/react";
+import { ThemeProvider, createGlobalStyle, css, keyframes, styled, useTheme as useTheme$1 } from "styled-components";
 import { designTokens } from "@wistia/vhs-design-tokens";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Children, Fragment as Fragment$1, cloneElement, createContext, forwardRef, isValidElement, memo, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { createPortal } from "react-dom";
+import { hasKey, isArray, isBoolean, isEmptyString, isFunction, isNil, isNonEmptyArray, isNonEmptyString, isNotNil, isNotUndefined, isNumber, isString, isUndefined } from "@wistia/type-guards";
 import { debounce } from "throttle-debounce";
+import { darken, getValueAndUnit, transparentize } from "polished";
 import { Field, Form as Form$1, Formik, useFormikContext, useFormikContext as useFormikContext$1 } from "formik";
-import isEqual$1 from "react-fast-compare";
+import isEqual from "react-fast-compare";
 import { Editable, ReactEditor, Slate, useFocused, useSelected, useSlate, withReact } from "slate-react";
 import { Editor, Element, Node, Path, Range, Text as Text$1, Transforms, createEditor } from "slate";
 import { withHistory } from "slate-history";
 import { isHotkey } from "is-hotkey";
 import { jsx as jsx$1 } from "slate-hyperscript";
 import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuItemIndicator, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup as MenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "@radix-ui/react-dropdown-menu";
+import { addDays, addMonths, addYears, compareAsc, differenceInDays, eachDayOfInterval, eachMonthOfInterval, endOfDay, endOfMonth, getDay, getDaysInMonth, getYear, isAfter, isBefore, isEqual as isEqual$1, isFuture, isSameDay, isValid, isWithinInterval, startOfDay, startOfMonth } from "date-fns";
 import ReactSlider from "react-slider";
 //#region \0rolldown/runtime.js
 var __defProp = Object.defineProperty;
@@ -40,1513 +39,676 @@ var __exportAll = (all, no_symbols) => {
 	return target;
 };
 //#endregion
-//#region src/helpers/copyToClipboard/copyToClipboard.ts
-/**
-* Copies a string to user's clipboard for easy pasting in another location
-*
-* @param {string} textToCopy - the string that will be copied to users clipboard
-* @returns {Promise} - Promise object that represents the copied string
-*/
-const copyToClipboard = async (textToCopy) => {
-	if (navigator.clipboard) return navigator.clipboard.writeText(textToCopy).catch((error) => {
-		if (error instanceof Error) throw error;
-		throw new DOMException("The clipboard is not accessible", "NotAllowedError");
-	});
-	const span = document.createElement("span");
-	span.textContent = textToCopy;
-	span.style.whiteSpace = "pre";
-	document.body.appendChild(span);
-	const selection = window.getSelection();
-	const range = window.document.createRange();
-	selection?.removeAllRanges();
-	range.selectNode(span);
-	selection?.addRange(range);
-	let success = false;
-	try {
-		success = window.document.execCommand("copy");
-	} catch (error) {
-		console.error("error", error);
+//#region src/theme.ts
+const zIndex1 = 100;
+const zIndex2 = 200;
+const zIndex3 = 300;
+const zIndex5 = 500;
+const theme = {
+	breakpoint: { ...designTokens.breakpoint },
+	color: { ...designTokens.color },
+	duration: { ...designTokens.duration },
+	easing: { ...designTokens.easing },
+	font: {
+		family: {
+			default: "InterVariable, Helvetica, Arial, sans-serif",
+			monospace: designTokens.font.family.monospace
+		},
+		size: designTokens.font.size,
+		weight: Object.fromEntries(Object.entries(designTokens.font.weight).map(([key, value]) => [key, Number(value)]))
+	},
+	shadow: { ...designTokens.shadow },
+	spacing: { ...designTokens.spacing },
+	zIndex: {
+		ModalCloseButton: zIndex1,
+		Backdrop: zIndex2,
+		ActionModal: zIndex3,
+		FullScreenModal: zIndex3,
+		RangeSelector: zIndex5,
+		MenuComponent: zIndex5,
+		Toast: zIndex5,
+		Tooltip: zIndex5,
+		BackdropElevated: zIndex5
+	},
+	button: { borderRadius: "4px" },
+	buttonGroup: { gap: "16px" },
+	headline: {
+		family: designTokens.font.family,
+		headline1: { weight: designTokens.font.weight.bold },
+		headline2: { weight: designTokens.font.weight.medium },
+		headline3: { weight: designTokens.font.weight.bold }
+	},
+	paper: {
+		elevation0: designTokens.shadow.elevation0,
+		elevation1: designTokens.shadow.elevation1,
+		elevation2: designTokens.shadow.elevation2
 	}
-	selection?.removeAllRanges();
-	window.document.body.removeChild(span);
-	if (success) return Promise.resolve();
-	return Promise.reject(new DOMException("The request is not allowed", "NotAllowedError"));
 };
 //#endregion
-//#region src/helpers/datetimeHelpers/datetimeHelpers.ts
-const milisecondsInSecond = 1e3;
-const secondsInMinute = 60;
-const minutesInHour = 60;
-const halfAnHourInMinutes = 30;
-const defaultLocales = ["en-US"];
-const defaultTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone || "UTC";
-/**
-* @param {number} num - pads integer with leading zero
-* @returns {string} - integer with padding as string
-*/
-const padTimeInteger = (num) => num.toString().padStart(2, "0");
-/**
-* @param {*} date - possible date value - unknown type
-* @returns {boolean} - whether it is a date object
-*/
-const isDate = (date) => date instanceof Date;
+//#region src/private/helpers/objectHelpers/isObject.ts
 /**
-* @param {*} date - a Date object - could be unknown though
-* @returns {boolean} - whether it's a valid date
-*/
-const isInvalidDate = (date) => !isDate(date) || date.getTime() === 0;
-/**
-* Converts a Date object into a date only string.
-*
-* e.g. Jun 3, 2021
-* @param {*} date a Date object you want to convert into a string - gracefully handles any input
-* @param {object} options -
-* @param {string} options.timeZone - the timezone you want date displayed in, defaults to current users time zone
-* @returns {string} a formatted date string
-*/
-const dateOnlyString = (date, { timeZone = defaultTimeZone } = {}) => {
-	if (!isDate(date) || isInvalidDate(date)) return "";
-	try {
-		return new Intl.DateTimeFormat(defaultLocales, {
-			dateStyle: "medium",
-			timeZone
-		}).format(date);
-	} catch (error) {
-		console.error(error);
-		return "";
-	}
-};
-/**
-* Converts a Date object into a date only string formatted numerically.
+* Determines if a given value is an object
 *
-* e.g. 06/03/2021
-* @param {*} date a Date object you want to convert into a string - gracefully handles any input
-* @param {object} options -
-* @param {string} options.timeZone - the timezone you want date displayed in, defaults to current users time zone
-* @returns {string} a formatted date string
+* @param {*} value - value of any type
+* @returns {boolean} - whether value is an object
 */
-const dateOnlyStringNumeric = (date, { timeZone = defaultTimeZone } = {}) => {
-	if (!isDate(date) || isInvalidDate(date)) return "";
-	try {
-		return new Intl.DateTimeFormat(defaultLocales, {
-			year: "numeric",
-			month: "2-digit",
-			day: "2-digit",
-			timeZone
-		}).format(date);
-	} catch (error) {
-		console.error(error);
-		return "";
-	}
-};
+const isObject = (value) => value !== null && value !== void 0 && (Object.getPrototypeOf(value) === null || value.constructor === Object);
+//#endregion
+//#region src/private/helpers/objectHelpers/merge.ts
 /**
-* Converts a Date object into a date only string formatted to ISO8601.
+* Merges two or more objects
 *
-* e.g. 2021-06-03
-* @param {*} date a Date object you want to convert into a string - gracefully handles any input
-* @param {object} options -
-* @param {string} options.timeZone - the timezone you want date displayed in, defaults to current users time zone
-* @returns {string} a formatted date string
+* @param {Object} target - object that subsequent objects will be merged into
+* @param {...Object} sources - one or more objects
+* @returns {Object} - new object
 */
-const dateOnlyISOString = (date, { timeZone = defaultTimeZone } = {}) => {
-	if (!isDate(date) || isInvalidDate(date)) return "";
-	try {
-		const partsAsObject = new Intl.DateTimeFormat(defaultLocales, {
-			year: "numeric",
-			month: "2-digit",
-			day: "2-digit",
-			timeZone
-		}).formatToParts(date).reduce((map, obj) => {
-			map[obj.type] = obj.value;
-			return map;
-		}, {});
-		return `${partsAsObject.year}-${partsAsObject.month}-${partsAsObject.day}`;
-	} catch (error) {
-		console.error(error);
-		return "";
-	}
+const merge = (target, ...sources) => {
+	if (!sources.length) return target;
+	const output = { ...target };
+	sources.forEach((source) => {
+		if (isObject(source)) Object.keys(source).forEach((key) => {
+			if (isObject(source[key])) if (output[key] === null || output[key] === void 0) output[key] = { ...source[key] };
+			else output[key] = merge(output[key], source[key]);
+			else output[key] = source[key];
+		});
+	});
+	return output;
 };
-/**
-* Converts a Date object into a month and day string formatted numerically.
-*
-* e.g. 06/03/2021
-* @param {*} date a Date object you want to convert into a string - gracefully handles any value
-* @param {object} options -
-* @param {string} options.timeZone - the timezone you want date displayed in, defaults to current users time zone
-* @returns {string} a formatted date string
-*/
-const monthDayStringNumeric = (date, { timeZone = defaultTimeZone } = {}) => {
-	if (!isDate(date) || isInvalidDate(date)) return "";
-	try {
-		return new Intl.DateTimeFormat(defaultLocales, {
-			month: "2-digit",
-			day: "2-digit",
-			timeZone
-		}).format(date);
-	} catch (error) {
-		console.error(error);
-		return "";
-	}
+//#endregion
+//#region src/providers/VHSThemeProvider.tsx
+const VHSThemeProvider = ({ children, theme: overrideTheme }) => {
+	return /* @__PURE__ */ jsx(ThemeProvider, {
+		theme: merge(theme, overrideTheme),
+		children
+	});
 };
+//#endregion
+//#region src/providers/WrapperProvider.tsx
+const WrapperContext = createContext({});
+const useWrappers = () => useContext(WrapperContext);
+const WrapperProvider = WrapperContext.Provider;
+//#endregion
+//#region src/private/helpers/coerceToBoolean/coerceToBoolean.ts
 /**
-* Converts a Date object into a month and day string formatted numerically.
+* Converts a boolean string value `value` into a boolean. If passed
+* something other than 'true' or 'false' will coerce value to boolean.
 *
-* e.g. Thursday
-* @param {Date} date a Date object you want to convert into a string
-* @param {object} options -
-* @param {string} options.timeZone - the timezone you want date displayed in, defaults to current users time zone
-* @returns {string} a formatted date string
+* @param {*} value - a value of any type
+* @returns {boolean} - that value as a boolean
 */
-const dayOfWeekString = (date, { timeZone = defaultTimeZone } = {}) => {
-	if (date === null) return "";
-	try {
-		return new Intl.DateTimeFormat(defaultLocales, {
-			weekday: "long",
-			timeZone
-		}).format(date);
-	} catch (error) {
-		console.error(error);
-		return "";
-	}
+const coerceToBoolean = (value) => {
+	if (value === "true" || value === "false") return value === "true";
+	return Boolean(value);
 };
+//#endregion
+//#region src/hooks/useTheme/useTheme.ts
+const useTheme = () => useTheme$1();
+//#endregion
+//#region src/private/helpers/isClient/isClient.ts
 /**
-* Converts a Date object into a time only string.
-*
-* e.g. 7:30 AM
-* @param {*} date a Date object you want to convert into a string - gracefully handles any value
-* @param {object} options -
-* @param {string} options.timeZone - the timezone you want date displayed in, defaults to current users time zone
-* @returns {string} a formatted date string
+* @returns {boolean} - whether running in a browser environment
 */
-const timeOnlyString = (date, { timeZone = defaultTimeZone } = {}) => {
-	if (!isDate(date) || isInvalidDate(date)) return "";
-	try {
-		return new Intl.DateTimeFormat(defaultLocales, {
-			timeStyle: "short",
-			timeZone
-		}).format(date);
-	} catch (error) {
-		console.error(error);
-		return "";
-	}
+const isClient = () => typeof window !== "undefined" && typeof document !== "undefined";
+//#endregion
+//#region src/private/hooks/useWindowSize/useWindowSize.ts
+const useWindowSize = (interval = 0) => {
+	const [dimensions, setDimensions] = useState({
+		width: isClient() ? window.innerWidth : 0,
+		height: isClient() ? window.innerHeight : 0
+	});
+	useLayoutEffect(() => {
+		const handleResize = debounce(interval, () => setDimensions({
+			width: window.innerWidth,
+			height: window.innerHeight
+		}));
+		window.addEventListener("resize", handleResize);
+		return () => window.removeEventListener("resize", handleResize);
+	}, [interval]);
+	return dimensions;
 };
-/**
-* Converts a Date object into a date and time string.
-*
-* e.g. Jun 3, 2021, 11:52 AM
-*
-* NOTE: you should probably use timeAgoString when trying to display
-* an updated/created timestamp.
-*
-* @param {*} date - a Date object you want to convert into a string - gracefully handles any value
-* @param {object} options -
-* @param {string} options.timeZone - the timezone you want date displayed in, defaults to current users time zone
-* @returns {string} a formatted date string
-*/
-const dateTimeString = (date, { timeZone = defaultTimeZone, omitYear = false } = {}) => {
-	if (isNil(date)) return "";
-	const formattedDate = new Date(date);
-	if (isInvalidDate(formattedDate)) return "";
-	try {
-		const baseOptions = {
-			month: "short",
-			day: "numeric",
-			hour: "numeric",
-			minute: "2-digit",
-			timeZone
-		};
-		const options = omitYear ? baseOptions : {
-			...baseOptions,
-			year: "numeric"
-		};
-		return formattedDate.toLocaleDateString(defaultLocales, options);
-	} catch (error) {
-		console.error(error);
-		return "";
-	}
+//#endregion
+//#region src/private/hooks/useMq/useMq.ts
+const REM_SIZE = 16;
+const useMq = () => {
+	const viewportWidth = useWindowSize().width / REM_SIZE;
+	const theme = useTheme();
+	return {
+		isXsAndUp: true,
+		isSmAndUp: viewportWidth >= Number.parseFloat(theme.breakpoint.sm),
+		isMdAndUp: viewportWidth >= Number.parseFloat(theme.breakpoint.md),
+		isLgAndUp: viewportWidth >= Number.parseFloat(theme.breakpoint.lg),
+		isXlAndUp: viewportWidth >= Number.parseFloat(theme.breakpoint.xl),
+		isXsAndDown: viewportWidth < Number.parseFloat(theme.breakpoint.sm),
+		isSmAndDown: viewportWidth < Number.parseFloat(theme.breakpoint.md),
+		isMdAndDown: viewportWidth < Number.parseFloat(theme.breakpoint.lg),
+		isLgAndDown: viewportWidth < Number.parseFloat(theme.breakpoint.xl),
+		isXlAndDown: true
+	};
 };
-/**
-* Converts a Date object into a date and time string
-* for use in a sentence.
-*
-* e.g. June 3, 2021, 11:52 AM
-*
-* NOTE: you should probably use timeAgoString when trying to display
-* an updated/created timestamp.
-*
-* @param {*} date - a Date object you want to convert into a string - gracefully handles any value
-* @param {object} options -
-* @param {string} options.timeZone - the timezone you want date displayed in, defaults to current users time zone
-* @returns {string} a formatted date string
-*/
-const dateTimeStringForSentence = (date, { timeZone = defaultTimeZone } = {}) => {
-	if (!isDate(date) || isInvalidDate(date)) return "";
-	try {
-		const { year, month, day, hour, minute, dayPeriod } = new Intl.DateTimeFormat(defaultLocales, {
-			month: "long",
-			day: "numeric",
-			year: "numeric",
-			hour: "numeric",
-			minute: "2-digit",
-			timeZone
-		}).formatToParts(date).reduce((acc, part) => {
-			if (part.type !== "literal") acc[part.type] = part.value;
-			return acc;
-		}, {});
-		return `${month} ${day}, ${year}, ${hour}:${minute} ${dayPeriod}`;
-	} catch (error) {
-		console.error(error);
-		return "";
-	}
+//#endregion
+//#region src/components/Toast/ToastAnimation.tsx
+const toastPositionOffset = 24;
+const toastPositionStyles = {
+	bottom: toastPositionOffset,
+	left: toastPositionOffset,
+	position: "fixed"
 };
-/**
-* Converts a Date object into a date only string
-* for use in a sentence.
-*
-* e.g. June 3, 2021
-*
-* @param {*} date - a Date object you want to convert into a string - gracefully handles any value
-* @param {object} options -
-* @param {string} options.timeZone - the timezone you want date displayed in, defaults to current users time zone
-* @returns {string} a formatted date string
-*/
-const dateOnlyStringForSentence = (date, { timeZone = defaultTimeZone } = {}) => {
-	if (!isDate(date) || isInvalidDate(date)) return "";
-	try {
-		return new Intl.DateTimeFormat(defaultLocales, {
-			dateStyle: "long",
-			timeZone
-		}).format(date);
-	} catch (error) {
-		console.error(error);
-		return "";
-	}
+const toastWidth = {
+	minWidth: "352px",
+	width: "400px"
 };
-/**
-* Shows time ago relative to current time.
-*
-* examples:
-*
-*   < 1 minute ago
-*
-*   33 minutes ago
-*
-*   Today, 3:30 PM
-*
-*   Yesterday, 6:22 AM
-*
-*   Nov 11, 11:32 AM
-*
-*   Feb 23, 2020, 1:55 PM
-*
-*  or when `includeTime` is false:
-*
-*   Today
-*
-*   Yesterday
-*
-*   on Thursday
-*
-*   Nov 11
-*
-*   Feb 23, 2020
-*
-* NOTE: timeAgoString doesn't support multiple time zones since doing so would
-* complicate calculations for whether to use "Today" or "Yesterday".
-* @param {Date} date - the date relative to now
-* @param {object} options -
-* @param {Date} options.nowAnchor - The date used to calculate relative to now. Defaults to current date but can be overwritten for tests.
-* @param {boolean} options.includeTime - Whether to include the time in the output. Defaults to true.
-* @returns {string} - a string representation of the date.
-*/
-const timeAgoString = (date, { nowAnchor = /* @__PURE__ */ new Date(), includeTime = true } = {}) => {
-	if (isInvalidDate(date)) return "";
-	const minutesAgo = (nowAnchor.valueOf() - date.valueOf()) / (secondsInMinute * milisecondsInSecond);
-	const minutesAgoRounded = Math.round(minutesAgo);
-	const differenceInDays = differenceInCalendarDays(nowAnchor, date);
-	const isSameYear = date.getFullYear() === nowAnchor.getFullYear();
-	if (minutesAgo < 0) return dateTimeString(date);
-	if (minutesAgo < 1) return "< 1 minute ago";
-	if (minutesAgoRounded < 2) return "1 minute ago";
-	if (minutesAgoRounded <= minutesInHour) return `${minutesAgoRounded} minutes ago`;
-	if (differenceInDays === 0) return includeTime ? `Today, ${Intl.DateTimeFormat(defaultLocales, {
-		hour: "numeric",
-		minute: "2-digit"
-	}).format(date)}` : "Today";
-	if (differenceInDays === 1) return includeTime ? `Yesterday, ${Intl.DateTimeFormat(defaultLocales, {
-		hour: "numeric",
-		minute: "2-digit"
-	}).format(date)}` : "Yesterday";
-	if (differenceInDays < daysInWeek && !includeTime) return `on ${dayOfWeekString(date)}`;
-	return includeTime ? dateTimeString(date, { omitYear: isSameYear }) : dateOnlyString(date, { omitYear: isSameYear });
-};
-/**
-* Given a date, shows the UTC offset.
-* @param {Date} date a Date object for calculating offset.
-* @returns {string} - string representing the UTC offset
-*/
-const dateUTCOffset = (date) => {
-	const offsetInHours = date.getTimezoneOffset() / minutesInHour * -1;
-	const hours = Math.round(offsetInHours);
-	const minutes = (offsetInHours - hours) * minutesInHour;
-	return `${hours >= 0 ? "+" : ""}${`${hours}`.padStart(2, "0")}:${`${minutes}`.padStart(2, "0")}`;
-};
-/**
-* @typedef {Object} Duration
-* @property {number} seconds - number of seconds
-* @property {number} minutes - number of minutes
-* @property {number} hours - number of hours
-*/
-/**
-* Returns an object representing the duration in seconds, minutes and hours.
-*
-* @param {number} numberOfMilliseconds - number of milliseconds
-* @returns {Duration} -
-*/
-const buildTimeDuration = (numberOfMilliseconds) => {
-	const numberOfSeconds = Math.floor(numberOfMilliseconds / milisecondsInSecond);
-	const numberOfMinutes = Math.floor(numberOfSeconds / secondsInMinute);
-	const numberOfHours = Math.floor(numberOfMinutes / minutesInHour);
-	return {
-		seconds: numberOfSeconds - numberOfMinutes * secondsInMinute,
-		minutes: numberOfMinutes - numberOfHours * minutesInHour,
-		hours: numberOfHours
-	};
-};
-/**
-* A string representation of a duration for a media. Assumes most medias
-* are under an hour so only shows hours if media is over hour.
-*
-* @param {number} numberOfMilliseconds - number of milliseconds
-* @returns {string} - a string representation for duration
-*/
-const mediaDurationString = (numberOfMilliseconds) => {
-	const { hours, minutes, seconds } = buildTimeDuration(numberOfMilliseconds);
-	if (hours < 1) return `${minutes}:${padTimeInteger(seconds)}`;
-	return `${hours}:${padTimeInteger(minutes)}:${padTimeInteger(seconds)}`;
-};
-/**
-* A string representation of a duration for a user session. Assumes that
-* sessions may or may not be more than an hour. To prevent confusion all
-* times show hours, even those that are less than an hour.
-*
-* @param {number} numberOfMilliseconds - number of milliseconds
-* @returns {string} - a string representation of duration
-*/
-const sessionDurationString = (numberOfMilliseconds) => {
-	const { hours, minutes, seconds } = buildTimeDuration(numberOfMilliseconds);
-	return `${hours}:${padTimeInteger(minutes)}:${padTimeInteger(seconds)}`;
-};
-/**
-* @typedef {Object} WistiaDateTimeObject
-* @property {number} minutes - number of minutes
-* @property {number} hours - number of hours
-* @property {number} dayOfMonth - day of the month
-* @property {number} year - year
-* @property {number} month - month
-*/
-/**
-* @param {Date | null | undefined} date - a Date object
-* @returns {WistiaDateTimeObject | null} - replaceMe
-*/
-const dateToDateTime = (date) => {
-	if (!isDate(date)) return null;
-	return {
-		year: date.getFullYear(),
-		month: date.getMonth(),
-		dayOfMonth: date.getDate(),
-		hours: date.getHours(),
-		minutes: date.getMinutes()
-	};
-};
-/**
-* @param {Partial<WistiaDateTimeObject> | null} dateTime - a dateTime object
-* @returns {Date | null} - the converted date or null if anything is missing
-*/
-const dateTimeToDate = (dateTime) => {
-	const { year, month, dayOfMonth, hours, minutes } = dateTime ?? {};
-	if (year !== void 0 && month !== void 0 && dayOfMonth !== void 0) return new Date(year, month, dayOfMonth, hours ?? 0, minutes ?? 0);
-	return null;
-};
-/**
-* @param {Partial<WistiaDateTimeObject>} dateTime - a dateTime object
-* @returns {string | null} - string with the ISO-8601 string or null
-*/
-const dateTimeToISO = (dateTime) => dateTimeToDate(dateTime)?.toISOString() ?? null;
-/**
-* @param {Date} dateTime - a dateTime object
-* @param {boolean} toISOString - whether the return value should be an ISO string
-* @returns {string | Date | null} - string or date depending on if toIsoString is true or false. Could be null if there's an error.
-*/
-const dateTimeRounded = (dateTime, toISOString = true) => {
-	const first30Min = dateTime.getMinutes() <= halfAnHourInMinutes;
-	const hours = first30Min ? dateTime.getHours() : dateTime.getHours() + 1;
-	const minutes = first30Min ? halfAnHourInMinutes : 0;
-	const dateWithTime = {
-		...dateToDateTime(dateTime),
-		hours,
-		minutes
+const toastMobileWidth = { width: `calc(100% - ${toastPositionOffset * 2}px)` };
+const ToastAnimation = ({ children, in: inProp, renderInPlace }) => {
+	const { isSmAndUp } = useMq();
+	const { duration, zIndex } = useTheme();
+	const durationInSeconds = Number.parseInt(duration.expressive.fast, 10) / 1e3;
+	const toastStyle = {
+		...toastPositionStyles,
+		...isSmAndUp ? toastWidth : toastMobileWidth,
+		willChange: "auto",
+		zIndex: zIndex.Toast
 	};
-	if (toISOString) return dateTimeToISO(dateWithTime);
-	return dateTimeToDate(dateWithTime);
-};
-/**
-* Given number of miliseconds, returns the iso8601 string rounded down from
-* number of seconds. Mainly copied from https://github.com/wistia/player-modern/blob/master/src/utilities/iso8601Helper.js#L54
-* but modified to support milliseconds
-*
-* @param {number} numberOfMilliseconds - number of milliseconds
-* @returns {string} an iso8601 string format of duration
-*/
-const millisecondsToDurationISOString = (numberOfMilliseconds) => {
-	const { seconds, minutes, hours } = buildTimeDuration(numberOfMilliseconds);
-	let string = "PT";
-	if (hours) string += `${hours}H`;
-	if (minutes) string += `${minutes}M`;
-	if (seconds) string += `${seconds}S`;
-	if (!(seconds || minutes || hours)) string += "0S";
-	return string;
-};
-//#endregion
-//#region src/helpers/datetimeHelpers/index.ts
-const datetimeHelpers = {
-	isDate,
-	dateOnlyString,
-	dateOnlyStringNumeric,
-	dateOnlyISOString,
-	monthDayStringNumeric,
-	dayOfWeekString,
-	timeOnlyString,
-	dateTimeString,
-	dateTimeStringForSentence,
-	dateOnlyStringForSentence,
-	timeAgoString,
-	dateUTCOffset,
-	buildTimeDuration,
-	mediaDurationString,
-	sessionDurationString,
-	dateToDateTime,
-	dateTimeToDate,
-	dateTimeToISO,
-	dateTimeRounded,
-	millisecondsToDurationISOString
-};
-//#endregion
-//#region src/helpers/getBackgroundGradient/getBackgroundGradient.ts
-const gradients = {
-	defaultDarkOne: css`
-    background-color: #222d66;
-    background-image:
-      radial-gradient(farthest-corner at top right, #222d66, transparent 70%),
-      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 50%),
-      radial-gradient(farthest-corner at bottom left, #6b84ff, transparent 57%),
-      radial-gradient(farthest-corner at top left, #2949e5, transparent 68%);
-  `,
-	defaultDarkTwo: css`
-    background-color: #222d66;
-    background-image:
-      radial-gradient(farthest-corner at top left, #6b84ff, transparent 100%),
-      radial-gradient(farthest-corner at bottom left, #222d66, transparent 57%),
-      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 50%),
-      radial-gradient(farthest-corner at top right, #2949e5, transparent 70%);
-  `,
-	defaultLightOne: css`
-    background-color: #ccd5ff;
-    background-image:
-      radial-gradient(farthest-corner at bottom right, #ccd5ff, transparent 55%),
-      radial-gradient(farthest-corner at top left, #ccd5ff, transparent 65%),
-      radial-gradient(farthest-corner at top right, #6b84ff, transparent 50%),
-      radial-gradient(farthest-corner at bottom left, #f7f8ff, transparent 50%);
-  `,
-	defaultLightTwo: css`
-    background-color: #ccd5ff;
-    background-image:
-      radial-gradient(ellipse at top, #ccd5ff, transparent),
-      radial-gradient(ellipse at bottom, #6b84ff, transparent);
-  `,
-	defaultMidOne: css`
-    background-color: #6b84ff;
-    background-image:
-      radial-gradient(farthest-corner at top right, #2949e5, transparent 70%),
-      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 50%),
-      radial-gradient(farthest-corner at top left, #6b84ff, transparent 80%),
-      radial-gradient(farthest-corner at bottom left, #222d66, transparent 57%);
-  `,
-	defaultMidTwo: css`
-    background-color: #6b84ff;
-    background-image:
-      radial-gradient(ellipse at top, #2949e5, transparent),
-      radial-gradient(ellipse at bottom, #ccd5ff, transparent);
-  `,
-	green: css`
-    background-color: #fafffa;
-    background-image:
-      radial-gradient(farthest-corner at bottom left, #b0e5a5, transparent 50%),
-      radial-gradient(farthest-corner at top right, #268713, transparent 50%),
-      radial-gradient(farthest-corner at top left, #44b62d, transparent 65%),
-      radial-gradient(farthest-corner at bottom right, #44b62d, transparent 55%);
-  `,
-	greenWithPop: css`
-    background-color: #fafffa;
-    background-image:
-      radial-gradient(farthest-corner at bottom left, #b0e5a5, transparent 50%),
-      radial-gradient(farthest-corner at top right, #2949e5, transparent 50%),
-      radial-gradient(farthest-corner at top left, #44b62d, transparent 65%),
-      radial-gradient(farthest-corner at bottom right, #44b62d, transparent 55%);
-  `,
-	pink: css`
-    background-color: #fffff0;
-    background-image:
-      radial-gradient(farthest-corner at bottom left, #ffc7e8, transparent 50%),
-      radial-gradient(farthest-corner at top right, #e0128e, transparent 70%),
-      radial-gradient(farthest-corner at top left, #ff40b3, transparent 65%),
-      radial-gradient(farthest-corner at bottom right, #ff40b3, transparent 55%);
-  `,
-	pinkWithPop: css`
-    background-color: #fffff0;
-    background-image:
-      radial-gradient(farthest-corner at top right, #e0128e, transparent 70%),
-      radial-gradient(farthest-corner at top left, #ff40b3, transparent 65%),
-      radial-gradient(farthest-corner at bottom right, #ff40b3, transparent 55%),
-      radial-gradient(farthest-corner at bottom left, #2949e5, transparent 50%);
-  `,
-	playfulGradientOne: css`
-    background-color: #f7f8ff;
-    background-image:
-      radial-gradient(farthest-corner at top left, #d65cff, transparent 68%),
-      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 50%),
-      radial-gradient(farthest-corner at bottom left, #ffc7e8, transparent 57%),
-      radial-gradient(farthest-corner at top right, #ffcaba, transparent 70%);
-  `,
-	playfulGradientTwo: css`
-    background-color: #f7f8ff;
-    background-image:
-      radial-gradient(farthest-corner at top left, #44b62d, transparent 68%),
-      radial-gradient(farthest-corner at bottom right, #eff18d, transparent 50%),
-      radial-gradient(farthest-corner at bottom left, #ccd5ff, transparent 57%),
-      radial-gradient(farthest-corner at top right, #2949e5, transparent 70%);
-  `,
-	purple: css`
-    background-color: #f2caff;
-    background-image:
-      radial-gradient(ellipse at 0% 100%, #f9e5ff, transparent 50%),
-      radial-gradient(ellipse at 100% 0%, #e093fa, transparent 70%);
-  `,
-	purpleWithPop: css`
-    background-color: #f2caff;
-    background-image:
-      radial-gradient(farthest-corner at bottom left, #f2caff, transparent 50%),
-      radial-gradient(farthest-corner at top left, #d65cff, transparent 65%),
-      radial-gradient(farthest-corner at bottom right, #d65cff, transparent 55%),
-      radial-gradient(farthest-corner at top right, #2949e5, transparent 70%);
-  `,
-	yellow: css`
-    background-color: #fffff0;
-    background-image:
-      radial-gradient(farthest-corner at bottom left, #eff18d, transparent 50%),
-      radial-gradient(farthest-corner at top right, #bcbf19, transparent 70%),
-      radial-gradient(farthest-corner at top left, #e8ec1e, transparent 65%),
-      radial-gradient(farthest-corner at bottom right, #e8ec1e, transparent 55%);
-  `,
-	yellowWithPop: css`
-    background-color: #fffff0;
-    background-image:
-      radial-gradient(farthest-corner at bottom left, #eff18d, transparent 50%),
-      radial-gradient(farthest-corner at top right, #bcbf19, transparent 70%),
-      radial-gradient(farthest-corner at top left, #e8ec1e, transparent 65%),
-      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 55%);
-  `
-};
-const gradientMap = Object.keys(gradients);
-/**
-* Retrieves the CSS background gradient corresponding to the given gradient name.
-* If the specified gradient name is not found, the default gradient ('defaultDarkOne') is returned.
-* @param {GradientName} gradientName - The name of the gradient to retrieve.
-* @returns {FlattenSimpleInterpolation} The CSS string representing the specified gradient.
-*/
-const getBackgroundGradient = (gradientName) => {
-	return isNotNil(gradientName) ? gradients[gradientName] : gradients.defaultDarkOne;
-};
-//#endregion
-//#region src/helpers/getBackgroundGradient/getSemiRandomBackgroundGradient.ts
-const MULTIPLIER = 31;
-/**
-* Retrieves a semi-random background gradient based on the given id.
-*
-* @param {string} id - The id to use to generate the semi-random background gradient.
-* @returns {GradientName} gradientName
-*/
-const getSemiRandomBackgroundGradient = (id) => {
-	if (!(typeof id === "string" && id)) return gradientMap[0];
-	const hashCode = Array.from(id).reduce((num, char) => Math.imul(MULTIPLIER, num) + char.charCodeAt(0) || 0, 0);
-	return gradientMap[Math.abs(hashCode) % gradientMap.length];
+	if (renderInPlace) return /* @__PURE__ */ jsx(Fragment, { children });
+	return /* @__PURE__ */ jsx(AnimatePresence, { children: inProp ? /* @__PURE__ */ jsx(motion.div, {
+		animate: {
+			opacity: 1,
+			y: "0%"
+		},
+		exit: {
+			opacity: 0,
+			y: "100%"
+		},
+		initial: {
+			opacity: 0,
+			y: "100%"
+		},
+		style: toastStyle,
+		transition: { duration: durationInSeconds },
+		children
+	}) : null });
 };
 //#endregion
-//#region src/helpers/mq/mq.ts
-const getMaxWidth = (breakpoint) => {
-	const breakpointBuffer = .0025;
-	const [value, unit] = getValueAndUnit(breakpoint);
-	return `@media (max-width: ${Math.max(value - breakpointBuffer, 0)}${unit})`;
+//#region src/hooks/useThemeColor/useThemeColor.ts
+const getColor = (colors, colorName) => {
+	if (!colors.hasOwnProperty(colorName)) throw new Error(`\`${String(colorName)}\` is not a defined theme color, check argument passed to \`useThemeColor\``);
+	return colors[colorName];
 };
-const xsAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.xs})`;
-const smAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.sm})`;
-const mdAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.md})`;
-const lgAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.lg})`;
-const xlAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.xl})`;
-const xsAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.xs);
-const smAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.sm);
-const mdAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.md);
-const lgAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.lg);
-const xlAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.xl);
-const mq = {
-	xsAndUp,
-	smAndUp,
-	mdAndUp,
-	lgAndUp,
-	xlAndUp,
-	xsAndDown,
-	smAndDown,
-	mdAndDown,
-	lgAndDown,
-	xlAndDown
+const useThemeColor = (colorName = null) => {
+	const colors = useTheme().color;
+	if (!Object.keys({ ...colors }).length) throw new Error("The `useThemeColor` hook could not find any defined colors. A possible cause of this error is that your component is not wrapped in a theme provider such as `<VHSProvider />`");
+	if (colorName === null) return colors;
+	if (Array.isArray(colorName)) return colorName.map((color) => getColor(colors, color));
+	return getColor(colors, colorName);
 };
 //#endregion
-//#region src/helpers/objectHelpers/isObject.ts
-/**
-* Determines if a given value is an object
-*
-* @param {*} value - value of any type
-* @returns {boolean} - whether value is an object
-*/
-const isObject = (value) => value !== null && value !== void 0 && (Object.getPrototypeOf(value) === null || value.constructor === Object);
-//#endregion
-//#region src/helpers/objectHelpers/deepFreeze.ts
-/**
-* Recursively Object.freeze() objects
-*
-* @param {Object} obj - any object to freeze
-* @returns {Object} - new object
-*/
-const deepFreeze = (obj) => {
-	Object.freeze(obj);
-	Object.getOwnPropertyNames(obj).forEach((prop) => {
-		if (Object.prototype.hasOwnProperty.call(obj, prop) && (typeof obj === "function" ? prop !== "caller" && prop !== "callee" && prop !== "arguments" : true) && obj[prop] !== null && (typeof obj[prop] === "object" || typeof obj[prop] === "function") && !Object.isFrozen(obj[prop])) deepFreeze(obj[prop]);
-	});
-	return obj;
+//#region src/components/Icon/iconMap.ts
+const iconMap$1 = {
+	"ab-test": "AbTestIcon",
+	"all-content": "AllContentIcon",
+	archived: "ArchivedIcon",
+	"arrow-down": "ArrowDownIcon",
+	"arrow-left": "ArrowLeftIcon",
+	"arrow-right": "ArrowRightIcon",
+	"arrow-up": "ArrowUpIcon",
+	asterisk: "AsteriskIcon",
+	audience: "AudienceIcon",
+	calendar: "CalendarIcon",
+	camera: "CameraIcon",
+	"caret-down": "CaretDownIcon",
+	"caret-left": "CaretLeftIcon",
+	"caret-right": "CaretRightIcon",
+	"caret-up": "CaretUpIcon",
+	channel: "ChannelIcon",
+	checkmark: "CheckmarkIcon",
+	"checkmark-circle": "CheckmarkCircleIcon",
+	"checkmark-circle-outline": "CheckmarkCircleOutlineIcon",
+	"checkmark-circle-three-quarters": "CheckmarkCircleThreeQuartersIcon",
+	"checkmark-underlined": "CheckmarkUnderlinedIcon",
+	close: "CloseIcon",
+	"close-circle": "CloseCircleIcon",
+	"collect-video": "CollectVideoIcon",
+	collection: "CollectionIcon",
+	comment: "CommentIcon",
+	community: "CommunityIcon",
+	"contact-us": "ContactUsIcon",
+	copy: "CopyIcon",
+	"copy-disabled": "CopyDisabledIcon",
+	create: "CreateIcon",
+	delete: "DeleteIcon",
+	"delete-sm": "DeleteSmIcon",
+	"dottie-clock": "DottieClockIcon",
+	download: "DownloadIcon",
+	draggable: "DraggableIcon",
+	edit: "PencilIcon",
+	ellipsis: "EllipsisIcon",
+	"ellipsis-vertical": "EllipsisVerticalIcon",
+	embed: "EmbedIcon",
+	episodes: "EpisodesIcon",
+	error: "TriangleIcon",
+	expand: "ExpandIcon",
+	export: "DownloadIcon",
+	favorite: "FavoriteIcon",
+	"favorite-outline": "FavoriteOutlineIcon",
+	filter: "FilterIcon",
+	gear: "GearIcon",
+	"getting-started": "GettingStartedIcon",
+	globe: "GlobeIcon",
+	"grid-view": "GridViewIcon",
+	"group-record": "GroupRecordIcon",
+	hamburger: "HamburgerIcon",
+	hazard: "HazardIcon",
+	"help-center": "HelpCenterIcon",
+	hide: "HideIcon",
+	home: "HomeIcon",
+	hourglass: "HourglassIcon",
+	import: "ImportIcon",
+	info: "InfoIcon",
+	integrations: "IntegrationsIcon",
+	invite: "InviteIcon",
+	"invite-to-record": "InviteToRecordIcon",
+	"lightning-bolt": "LightningBoltIcon",
+	link: "LinkIcon",
+	"list-view": "ListViewIcon",
+	live: "LiveIcon",
+	lock: "LockIcon",
+	logout: "LogoutIcon",
+	media: "MediaIcon",
+	megaphone: "MegaphoneIcon",
+	"more-options": "MoreOptionsIcon",
+	"open-new": "OpenNewIcon",
+	overview: "OverviewIcon",
+	paint: "PaintIcon",
+	pencil: "PencilIcon",
+	play: "PlayIcon",
+	playlist: "PlaylistIcon",
+	podcast: "PodcastIcon",
+	preview: "PreviewIcon",
+	"private-user-sessions": "PrivateUserSessionsIcon",
+	project: "ProjectIcon",
+	"question-mark": "QuestionMarkIcon",
+	react: "ReactIcon",
+	record: "RecordIcon",
+	redo: "RedoIcon",
+	"remove-from-channel": "RemoveFromChannelIcon",
+	replace: "ReplaceIcon",
+	reply: "ReplyIcon",
+	"save-copy": "CopyIcon",
+	scissors: "ScissorsIcon",
+	search: "SearchIcon",
+	send: "SendIcon",
+	settings: "SettingsIcon",
+	share: "ShareIcon",
+	soapbox: "SoapboxIcon",
+	sort: "SortIcon",
+	sparkle: "SparkleIcon",
+	spinner: "SpinnerIcon",
+	stats: "StatsIcon",
+	"switch-accounts": "SwitchAccountsIcon",
+	tag: "TagIcon",
+	team: "TeamIcon",
+	"thumbs-down": "ThumbsDownIcon",
+	"thumbs-up": "ThumbsUpIcon",
+	triangle: "TriangleIcon",
+	undo: "UndoIcon",
+	unlock: "UnlockIcon",
+	upload: "UploadIcon",
+	"users-permissions": "UsersPermissionsIcon",
+	"view-stream": "ViewStreamIcon",
+	wand: "WandIcon",
+	"zoom-in": "ZoomInIcon",
+	"zoom-out": "ZoomOutIcon"
 };
 //#endregion
-//#region src/helpers/objectHelpers/merge.ts
-/**
-* Merges two or more objects
-*
-* @param {Object} target - object that subsequent objects will be merged into
-* @param {...Object} sources - one or more objects
-* @returns {Object} - new object
-*/
-const merge = (target, ...sources) => {
-	if (!sources.length) return target;
-	const output = { ...target };
-	sources.forEach((source) => {
-		if (isObject(source)) Object.keys(source).forEach((key) => {
-			if (isObject(source[key])) if (output[key] === null || output[key] === void 0) output[key] = { ...source[key] };
-			else output[key] = merge(output[key], source[key]);
-			else output[key] = source[key];
-		});
-	});
-	return output;
-};
+//#region src/components/Icon/icons/AbTestIcon.tsx
+const AbTestIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "M8.78042 2.11118C6.86612 2.34876 6.94137 3.15354 6.99208 3.69591V3.69599C6.99476 3.72465 6.99738 3.75258 6.99962 3.77965C7.04436 4.31904 7.55048 5.39025 8.78042 5.39025H8.79735L8.79731 5.40433C8.79731 5.40433 9.05197 8.22842 8.79731 9.662C8.63183 10.5935 8.18982 11.2329 7.69474 11.865C8.39927 11.9016 9.14688 11.9764 9.93037 12.0994C10.4699 12.1842 10.8383 12.6879 10.753 13.2246C10.6678 13.7612 10.1613 14.1276 9.62166 14.0428C8.33927 13.8413 7.1731 13.7835 6.16316 13.812C5.48376 14.6589 4.44391 15.9821 3.58432 17.1925C5.12252 17.2343 7.05517 17.2692 9.48309 17.1438C10.0287 17.1157 10.4939 17.5327 10.5222 18.0753C10.5504 18.6178 10.1312 19.0805 9.58566 19.1086C6.78798 19.253 4.53527 19.189 2.90579 19.1426C2.71222 19.1371 2.52744 19.1319 2.35159 19.1273C1.49048 20.8558 2.24968 21.573 4.20714 21.7855C6.33564 22.0165 18.0133 22.1217 19.9478 21.7855C21.8825 21.4493 22.5323 19.9214 21.5397 18.6499C20.547 17.3783 17.7768 13.4113 16.9172 11.9984C16.7004 11.642 16.4948 11.3282 16.3083 11.0435C15.7556 10.1997 15.3708 9.61242 15.36 8.93404L15.3601 5.40433L15.36 5.39025H15.3746C16.8928 5.34284 17.0231 4.6562 17.0231 3.75071C17.0231 2.84523 16.285 2.11118 15.3746 2.11118C15.3746 2.11118 10.7959 1.86103 8.78042 2.11118Z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/objectHelpers/selectKeys.ts
-/**
-* Creates an object composed of the selected keys
-*
-* @param {Object} obj - object we want a sub-selection of
-* @param {string[]} keys - array of keys to be selected from object
-* @returns {Object} - new object with only the selected keys (and their values) present
-*/
-const selectKeys = (obj, keys) => keys.reduce((obj2, key) => {
-	if (Object.prototype.hasOwnProperty.call(obj, key)) obj2[key] = obj[key];
-	return obj2;
-}, {});
+//#region src/components/Icon/icons/AllContentIcon.tsx
+const AllContentIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "m3.09059 3.5023c.5523 0 1 .4477 1 1l-.00092.70188c-.01018 3.93536-.10142 7.15092-.08848 9.77572.0068 1.3587.0426 2.4727.1299 3.3301.071.6968.16857 1.1263.25679 1.3643l.00412.0107.04589.0175c.01953.007.04171.0145.06676.0224l.08404.025c.2655.0742.6435.1409 1.1387.1952.9865.1081 2.3084.1539 3.8524.1644 3.14371.0213 6.85261-.0993 10.44111-.0993l.1166.0067c.4974.0578.8834.4805.8834.9933 0 .5522-.4477 1-1 1l-.738.0017c-3.232.0147-6.8753.1168-9.71671.0976-1.558-.0106-2.9641-.0566-4.0568-.1763-.5444-.0597-1.0437-.141-1.4591-.2571-.3702-.1035-.8555-.2808-1.185-.649l-.05731-.0703-.05079-.0751-.10286-.186c-.29118-.5812-.4296-1.3656-.51294-2.183-.0974-.9568-.1333-2.1494-.1402-3.5229-.0133-2.6853.0894-6.4106.0894-10.4876l.00673-.11652c.05776-.49735.48042-.88338.99327-.88338zm6.5557-1.37637.53051.02595c1.8616.09188 3.7138.19142 3.7138.19142s1.0423-.01829 2.2175-.02072l.4451-.0001c.8957.00155 1.802.01442 2.3355.05302 2.564.2222 2.6272 1.1409 2.7026 2.237.0118.172.024.3485.0461.5273.2722 2.1214.4627 4.9141.4627 6.5213 0 1.6393-.0545 5.1864-.245 5.4757-.2721.4178-.7348.9964-2.6398.8357-1.5154-.1278-7.0949-.2353-9.79337-.2416l-.43309-.0001c-.46931.0011-.80752.0065-.95905.0167-.9525.0643-2.0683-.0643-2.2588-1.125-.17942-.9182-.22215-3.2602-.2137-5.7009l.00427-.7725c.01347-1.80295.04985-3.58372.07493-4.8122.0148-.7225.0256-1.254.0256-1.4866 0-.0124-.0004-.0308-.001-.0543-.0081-.3442-.0425-1.796.8683-1.796.39926 0 1.70989.05778 3.1169.12593zm1.68581 5.01357c-.0356.94577-.0413 3.5445-.0421 5.0123l-.0002.688c0 .1695.1692.2755.3172.1907.9725-.551 3.89-2.2463 4.7145-3.327.0846-.106.0423-.2543-.0634-.3179l-4.6089-2.4156c-.148-.0848-.3171.0212-.3171.1695z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/objectHelpers/index.ts
-const objectHelpers = {
-	isObject,
-	deepFreeze,
-	merge,
-	selectKeys
-};
+//#region src/components/Icon/icons/ArchivedIcon.tsx
+const ArchivedIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		clipRule: "evenodd",
+		d: "m1.73061 4.12674c-.00015-.04078-.00031-.08299-.0006-.12674.00196-.01564.00388-.03112.00579-.04645.14457-1.16135.18151-1.45809 3.76421-1.95355 4.033-.558 11.67499-.278 15.49699.892.433.133 1.003.608 1.003 1.108 0 .63366.0008.64812.0016.66226.0007.01356.0014.02683.0014.58474-.1073.53269-.783.38874-1.8549.16039-.8357-.17804-1.9122-.40739-3.1481-.40739-.9352 0-2.0855-.03207-3.3103-.06622-2.7041-.07539-5.7715-.16091-7.68969.06622-.93175.05647-1.70731.17102-2.3234.26202-.91133.1346-1.47374.21767-1.6766-.01502-.26635-.30625-.26743-.59442-.2694-1.12026zm.38218 9.34776.0002.0065c.027.913.053 1.802.033 2.573l-.01.316-.00009.0031c-.05397 1.901-.10965 3.8622.37509 4.4189.34.39 1.277.743 3.591.743 2.315 0 11.63801.264 12.80501.403 1.168.14 2.548.112 2.739-.836.303-1.4255.306-4.3452.308-6.2904v-.0386c0-.625 0-1.147.01-1.48.031-1.25-.024-1.967-.081-2.702-.021-.266-.042-.534-.059-.83-.005-.146-.008-.281-.01-.406l-.0001-.00311c-.0169-.82786-.0249-1.21719-.8169-1.45989-3.822-1.171-11.46401-1.45-15.49701-.892-3.195.442-3.233.992-3.297 1.935-.00056.00797-.00112.01597-.00168.024-.00848.12097-.01744.24897-.03432.384-.14378 1.1792-.09814 2.6835-.0542 4.1315zm5.0572-1.8505c-.316-.349-.254-1.079-.149-1.376.114-.297 3.05201-.268 5.00901-.214 1.5006.0502 2.997.1864 4.482.408.298.052.613.705.465 1.175l-.023.075c-.037.13-.075.263-.17.274-.36.012-6.747-.068-6.747-.068s-2.55201.074-2.86701-.274z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/camelCase.ts
-/**
-* Converts a string to camel case
-*
-* @param {string} str - the string to convert
-* @returns {string} - the camelcased string
-*/
-const camelCase = (str = "") => str.replace(/(?:^\w|[A-Z]|\b\w|\s+)/g, (match, index) => {
-	if (Number(match) === 0) return "";
-	return index === 0 ? match.toLowerCase() : match.toUpperCase();
+//#region src/components/Icon/icons/ArrowDownIcon.tsx
+const ArrowDownIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "m19.7685 14.8636c.615-.555.6637-1.5035.1087-2.1185-.555-.6151-1.5035-.6637-2.1185-.1088l-4.2587 3.8429v-12.27446c0-.82845-.6716-1.5-1.5-1.5s-1.5.67155-1.5 1.5v12.27446l-4.25874-3.8429c-.615-.555-1.56345-.5063-2.11845.1088-.555.615-.5064 1.5635.10875 2.1185l6.76354 6.1031c.5709.5152 1.4389.5152 2.0098 0z",
+		fill: "currentColor"
+	})
 });
 //#endregion
-//#region src/helpers/stringHelpers/coerceToBoolean.ts
-/**
-* Converts a boolean string value `value` into a boolean. If passed
-* something other than 'true' or 'false' will coerce value to boolean.
-*
-* @param {*} value - a value of any type
-* @returns {boolean} - that value as a boolean
-*/
-const coerceToBoolean = (value) => {
-	if (value === "true" || value === "false") return value === "true";
-	return Boolean(value);
-};
+//#region src/components/Icon/icons/ArrowLeftIcon.tsx
+const ArrowLeftIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "M9.1653 19.7974C9.72028 20.4124 10.6688 20.4611 11.2838 19.9061C11.8989 19.3512 11.9476 18.4027 11.3926 17.7876L7.54974 13.5289L19.8242 13.5289C20.6526 13.5289 21.3242 12.8573 21.3242 12.0289C21.3242 11.2005 20.6526 10.5289 19.8242 10.5289L7.54975 10.5289L11.3926 6.27019C11.9476 5.65519 11.8989 4.70674 11.2838 4.15174C10.6688 3.59674 9.72028 3.64534 9.16529 4.26049L3.06217 11.024C2.54703 11.5949 2.54703 12.4629 3.06217 13.0338L9.1653 19.7974Z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/coerceToString.ts
-/**
-* Coerces a value `value` into a string. If passed a null or undefined
-* value, returns an empty string.
-*
-* @param {*} value - a value of any type
-* @returns {string} - that value as a string
-*/
-const coerceToString = (value) => value === null || value === void 0 ? "" : String(value);
+//#region src/components/Icon/icons/ArrowRightIcon.tsx
+const ArrowRightIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "M14.8347 4.26044C14.2797 3.6454 13.3312 3.59671 12.7162 4.15169C12.1011 4.70668 12.0524 5.65517 12.6074 6.27022L16.4502 10.5289L4.17581 10.5289C3.34736 10.5289 2.67581 11.2005 2.67581 12.0289C2.67581 12.8573 3.34736 13.5289 4.17581 13.5289L16.4502 13.5289L12.6074 17.7877C12.0524 18.4027 12.1011 19.3511 12.7161 19.9061C13.3312 20.4611 14.2797 20.4125 14.8347 19.7974L20.9378 13.0338C21.453 12.4629 21.453 11.5949 20.9378 11.024L14.8347 4.26044Z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/isString.ts
-/**
-* Determines if a given value is a string
-*
-* @param {*} value - a value of any type
-* @returns {boolean} - whether value is a string
-*/
-const isString = (value) => typeof value === "string" || value instanceof String;
+//#region src/components/Icon/icons/ArrowUpIcon.tsx
+const ArrowUpIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "M4.23151 9.19422C3.61647 9.7492 3.56778 10.6977 4.12276 11.3127C4.67775 11.9278 5.62624 11.9765 6.24129 11.4215L10.5 7.57866L10.5 19.8531C10.5 20.6815 11.1716 21.3531 12 21.3531C12.8284 21.3531 13.5 20.6815 13.5 19.8531L13.5 7.57867L17.7587 11.4215C18.3737 11.9765 19.3222 11.9278 19.8772 11.3128C20.4322 10.6977 20.3836 9.7492 19.7684 9.19422L13.0049 3.09109C12.434 2.57595 11.566 2.57595 10.9951 3.09109L4.23151 9.19422",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/isHttpUrl.ts
-/**
-* Validates an http URL string
-*
-* @param {*} str - the url string to validate - could be an unknown type
-* @return {boolean} - whether string is a valid http url
-*/
-const isHttpUrl = (str) => {
-	if (!isString(str)) return false;
-	try {
-		const url = new URL(str);
-		return url.protocol === "http:" || url.protocol === "https:";
-	} catch {
-		return false;
-	}
-};
+//#region src/components/Icon/icons/AsteriskIcon.tsx
+const AsteriskIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "M14.4425 22L13.9358 15.3633L19.5575 19.0908L22 14.9542L15.3642 11.9542L22 9L19.5575 4.86333L13.9358 8.63667L14.4425 2H9.5575L10.0183 8.68167L4.39667 4.90917L2 9.04583L8.4975 12L2 14.9092L4.39667 19L10.0183 15.2725L9.5575 22H14.4425Z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/isUrl.ts
-/**
-* Loosely validates a URL string
-*
-* @param {*} str - a string to validate - could be an unknown type
-* @return {boolean} - whether string appears to be a url
-*/
-const isUrl = (str) => {
-	const protocolAndDomain = /^(?:\w+:)?\/\/(\S+)$/;
-	const localhostDomain = /^localhost[:?\d]*(?:[^:?\d]\S*)?$/;
-	const nonLocalhostDomain = /^[^\s.]+\.\S{2,}$/;
-	if (!isString(str)) return false;
-	const match = protocolAndDomain.exec(str);
-	if (!match) return false;
-	const remaining = match[1];
-	if (remaining === void 0 || !remaining) return false;
-	return localhostDomain.test(remaining) || nonLocalhostDomain.test(remaining);
-};
+//#region src/components/Icon/icons/AudienceIcon.tsx
+const AudienceIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "m11.1744 3.04659c2.6835 2.33688 2.1425 8.06531-2.85234 7.99341-4.99483-.0719-5.03082-5.26362-3.69418-7.27726 1.33665-2.01364 4.64706-2.37021 6.54652-.71615zm8.511 8.47051c1.505 1.3105 1.2016 4.523-1.5995 4.4827-2.8011-.0404-2.8213-2.9519-2.0717-4.0811s2.6061-1.3292 3.6712-.4016zm-16.99799 10.3336c-.32545.0141-.61759-.3577-.6444-.8086-.15145-2.3574.04693-5.2652 1.4129-7.0804 2.86859-3.7922 9.46089-1.5366 10.60059 2.1134.236.7357.4008 1.5352.4961 2.3645.1371-.16.2718-.3099.3984-.4466 1.7601-1.8904 5.8048-.766 6.5041 1.0535.2965.751.4096 1.6354.3492 2.5077-.0098.2438-.2089.4477-.4506.4458h-7.4492-.0132-.0022-.4484c-.0235.0008-.0471-.0016-.0706-.0069z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/lowerFirst.ts
-/**
-* Converts the first character of string to lower case
-*
-* @param {string} str - the string to convert
-* @returns {string} - the lowercased string
-*/
-const lowerFirst = (str = "") => (str[0]?.toLowerCase() ?? "") + str.slice(1);
+//#region src/components/Icon/icons/CalendarIcon.tsx
+const CalendarIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		clipRule: "evenodd",
+		d: "m7.5 2.9895c.82843 0 1.5.67157 1.5 1.5v1.51041l6 .00003c0-.00001 0 .00001 0 0v-1.51044c0-.82843.6716-1.5 1.5-1.5s1.5.67157 1.5 1.5v1.51041c0-.00001 0 .00001 0 0l1.5.00003c.8284 0 1.5.67157 1.5 1.5v1.5c0 .82843-.6716 1.49996-1.5 1.49996h-15c-.82843 0-1.5-.67153-1.5-1.49996v-1.5c0-.82843.67157-1.5 1.5-1.5h1.5v-1.51044c0-.82843.67157-1.5 1.5-1.5zm-3 9.0104c-.82843 0-1.5.6716-1.5 1.5v6c0 .8285.67157 1.5 1.5 1.5h15c.8284 0 1.5-.6715 1.5-1.5v-6c0-.8284-.6716-1.5-1.5-1.5z",
+		fill: "currentColor",
+		fillRule: "evenodd"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/removeNewlines.ts
-/**
-* Removes newlines (\n) from string
-*
-* @param {string} str - string to have new lines removed from
-* @returns {string} - string with newlines removed
-*/
-const removeNewlines = (str) => str.replace(/\n/g, "");
+//#region src/components/Icon/icons/CameraIcon.tsx
+const CameraIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		clipRule: "evenodd",
+		d: "M11.3162 20.979C11.6222 20.9857 11.9282 20.9924 12.2342 21V20.992C12.276 20.992 12.3178 20.9924 12.3595 20.9928C12.443 20.9935 12.5264 20.9942 12.6096 20.992C12.9666 20.9825 13.3235 20.9735 13.6805 20.9645C14.6678 20.9395 15.6552 20.9144 16.6423 20.8803C17.3374 20.8559 18.032 20.8127 18.7251 20.7569C19.3748 20.7048 20.0238 20.6415 20.6727 20.5783C20.9177 20.5544 21.1626 20.5305 21.4076 20.5072C21.8887 20.4612 22.2848 20.0971 22.3749 19.624C22.5973 18.4536 22.7728 17.2761 22.8625 16.0887C22.9258 15.2478 22.9671 14.403 22.9784 13.5597C22.9883 12.8257 22.9578 12.0898 22.9174 11.3563C22.8803 10.6899 22.8278 10.023 22.7433 9.36129C22.6605 8.71089 22.5531 8.06362 22.4457 7.41667C22.4215 7.27097 22.3974 7.12528 22.3735 6.97958C22.2928 6.48916 21.8624 6.12123 21.3663 6.08228C21.0761 6.05955 20.7863 6.03115 20.4965 6.00274C20.2656 5.98012 20.0347 5.9575 19.8036 5.93773C19.2277 5.88845 18.6514 5.84434 18.0747 5.80586C17.9794 5.79929 17.9418 5.76737 17.9151 5.67868L17.8955 5.61308C17.7345 5.07457 17.5734 4.53581 17.3998 4.00139C17.2445 3.5227 16.7784 3.15664 16.3077 3.1313C16.1265 3.12155 15.9453 3.11126 15.7641 3.10098C15.1608 3.06675 14.5575 3.03253 13.9537 3.01773C12.2178 2.97502 10.4823 3.00787 8.75008 3.13365C8.62103 3.14303 8.48634 3.17917 8.36901 3.23455C8.02173 3.39833 7.773 3.66208 7.65567 4.03236C7.56181 4.32848 7.47105 4.62568 7.38028 4.92287C7.3013 5.18146 7.22232 5.44004 7.14131 5.69792C7.12817 5.73922 7.07937 5.79131 7.04041 5.79741C6.95316 5.81131 6.86434 5.81585 6.77551 5.82041C6.73533 5.82246 6.69516 5.82452 6.65512 5.82744C6.53247 5.83652 6.40978 5.84531 6.28709 5.8541C5.96567 5.87712 5.64421 5.90015 5.32324 5.92834C5.07994 5.94972 4.83701 5.97418 4.59413 5.99864C4.29308 6.02896 3.99209 6.05927 3.69053 6.08368C3.21982 6.1217 2.78478 6.49432 2.70453 6.96316C2.66943 7.16876 2.63372 7.37429 2.59802 7.57982C2.47619 8.28117 2.35434 8.98263 2.25634 9.68746C2.15263 10.4327 2.06674 11.1841 2.03202 11.9354C1.99259 12.782 1.9879 13.6329 2.02732 14.479C2.06674 15.3322 2.1545 16.1854 2.26714 17.032C2.35101 17.6614 2.46316 18.287 2.5753 18.9124C2.61877 19.1549 2.66224 19.3973 2.70406 19.64C2.77868 20.0708 3.19542 20.4636 3.61263 20.5044C3.69683 20.5127 3.78099 20.5213 3.86514 20.5298C4.03332 20.5469 4.20149 20.564 4.37008 20.579C4.58912 20.5986 4.80813 20.6188 5.02715 20.639C5.58193 20.6903 6.13681 20.7416 6.69266 20.7813C7.51863 20.8404 8.34601 20.8897 9.17386 20.9207C9.88781 20.9476 10.602 20.9633 11.3162 20.979ZM6.3909 12.7131C6.41718 9.38992 9.19264 6.63089 12.5083 6.64872C15.8811 6.66703 18.5796 9.38664 18.5707 12.7375C18.5618 16.0676 15.807 18.8534 12.4721 18.8328C9.15556 18.8121 6.36462 16.0512 6.3909 12.7131ZM16.2261 12.7248C16.2383 10.658 14.5539 8.99148 12.4754 8.99524L12.4749 8.99571C10.4006 8.99899 8.72848 10.6655 8.73318 12.7243C8.73834 14.7935 10.4217 16.4942 12.4806 16.4867C14.5619 16.4792 16.2139 14.8104 16.2261 12.7248Z",
+		fill: "currentColor",
+		fillRule: "evenodd"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/stripExtension.ts
-/**
-* Removes file extension from string
-*
-* @param {string} str - string to have file extension removed from
-* @returns {string} - string with file extension removed
-*/
-const stripExtension = (str) => (str || "").replace(/\.[^/.]{1,4}$/, "");
+//#region src/components/Icon/icons/CaretDownIcon.tsx
+const CaretDownIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "m2.68581 7.2381c.52393-.57331 1.39057-.64667 2.00074-.19312l.11843.09775 7.19402 6.57527 7.196-6.57527c.5733-.52393 1.443-.51915 2.01-.01262l.1092.10799c.5239.57331.5191 1.44304.0126 2.01l-.108.10918-8.2069 7.50002c-.5348.4887-1.3351.5213-1.9053.0977l-.1185-.0977-8.20691-7.50002c-.61154-.55886-.65424-1.50764-.09538-2.11918z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/truncate.ts
-/**
-* Truncates a string to desired char count and appends an ellipsis on the end
-*
-* @param {string} str - string to be truncated
-* @param {number} maxChars - maximum numbers of characters the string should have
-* @returns {string} - truncated string
-*/
-const truncate = (str, maxChars) => {
-	if (str.length <= maxChars) return str;
-	return `${str.slice(0, maxChars - 3)}...`;
-};
+//#region src/components/Icon/icons/CaretLeftIcon.tsx
+const CaretLeftIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "m16.7619 2.68582c.5733.52393.6467 1.39057.1931 2.00074l-.0977.11844-6.5753 7.194 6.5753 7.196c.5239.5733.5191 1.443.0126 2.01l-.108.1092c-.5733.5239-1.443.5191-2.01.0126l-.1092-.108-7.49998-8.2069c-.48873-.5348-.52131-1.3351-.09775-1.9053l.09775-.1185 7.49998-8.2069c.5589-.61153 1.5077-.65423 2.1192-.09538z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/helpers/stringHelpers/upperFirst.ts
-/**
-* Converts the first character of string to upper case
-* @param {string} str - the string to convert
-* @returns {string} - the uppercased string
-*/
-const upperFirst = (str = "") => (str[0]?.toUpperCase() ?? "") + str.slice(1);
-//#endregion
-//#region src/helpers/stringHelpers/index.ts
-const stringHelpers = {
-	camelCase,
-	coerceToBoolean,
-	coerceToString,
-	isHttpUrl,
-	isString,
-	isUrl,
-	lowerFirst,
-	removeNewlines,
-	stripExtension,
-	truncate,
-	upperFirst
-};
+//#region src/components/Icon/icons/CaretRightIcon.tsx
+const CaretRightIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "m7.23808 21.3142c-.57331-.524-.64667-1.3906-.19312-2.0008l.09774-.1184 6.5753-7.194-6.57529-7.196c-.52393-.57331-.51915-1.44303-.01262-2.01l.10799-.10917c.57331-.52393 1.44303-.51915 2.01-.01262l.10917.10799 7.50005 8.2069c.4887.5348.5213 1.3351.0977 1.9053l-.0977.1185-7.50004 8.2069c-.55886.6115-1.50765.6542-2.11918.0954z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/theme.ts
-const zIndex1 = 100;
-const zIndex2 = 200;
-const zIndex3 = 300;
-const zIndex5 = 500;
-const theme = {
-	breakpoint: { ...designTokens.breakpoint },
-	color: { ...designTokens.color },
-	duration: { ...designTokens.duration },
-	easing: { ...designTokens.easing },
-	font: {
-		family: {
-			default: "InterVariable, Helvetica, Arial, sans-serif",
-			monospace: designTokens.font.family.monospace
-		},
-		size: designTokens.font.size,
-		weight: Object.fromEntries(Object.entries(designTokens.font.weight).map(([key, value]) => [key, Number(value)]))
-	},
-	shadow: { ...designTokens.shadow },
-	spacing: { ...designTokens.spacing },
-	zIndex: {
-		ModalCloseButton: zIndex1,
-		Backdrop: zIndex2,
-		ActionModal: zIndex3,
-		FullScreenModal: zIndex3,
-		RangeSelector: zIndex5,
-		MenuComponent: zIndex5,
-		Toast: zIndex5,
-		Tooltip: zIndex5,
-		BackdropElevated: zIndex5
-	},
-	button: { borderRadius: "4px" },
-	buttonGroup: { gap: "16px" },
-	headline: {
-		family: designTokens.font.family,
-		headline1: { weight: designTokens.font.weight.bold },
-		headline2: { weight: designTokens.font.weight.medium },
-		headline3: { weight: designTokens.font.weight.bold }
-	},
-	paper: {
-		elevation0: designTokens.shadow.elevation0,
-		elevation1: designTokens.shadow.elevation1,
-		elevation2: designTokens.shadow.elevation2
-	}
-};
+//#region src/components/Icon/icons/CaretUpIcon.tsx
+const CaretUpIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "m21.3141 16.7619c-.5239.5733-1.3905.6467-2.0007.1931l-.1184-.0977-7.194-6.5753-7.19602 6.5753c-.57331.5239-1.44304.5191-2.01.0126l-.10918-.108c-.52393-.5733-.51915-1.443-.01261-2.01l.10798-.1092 8.20683-7.49998c.5348-.48873 1.3352-.52131 1.9054-.09775l.1184.09775 8.207 7.49998c.6115.5589.6542 1.5077.0953 2.1192z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/providers/VHSThemeProvider.tsx
-const VHSThemeProvider = ({ children, theme: overrideTheme }) => {
-	return /* @__PURE__ */ jsx(ThemeProvider, {
-		theme: merge(theme, overrideTheme),
-		children
-	});
-};
+//#region src/components/Icon/icons/ChannelIcon.tsx
+const ChannelIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		clipRule: "evenodd",
+		d: "m5.64571 1.19092c-.44678-.324663-1.07216-.225666-1.39682.22112-.32466.44678-.22567 1.07215.22111 1.39682 1.28625.93467 2.48092 2.19849 3.54704 3.39817-1.62947-.00332-2.92814.02027-3.46778.08086-1.98082.22241-2.2359 1.3046-2.45624 2.97122-.22035 1.66659.01731 8.61489.2821 10.20679s1.03019 2.2578 3.23903 2.2185c1.36389-.0243 5.14395.102 8.22435.2049 1.9081.0637 3.5484.1185 4.1789.123l.0126.0001c1.6426.0116 2.973.0211 3.5839-1.2509.6125-1.2752.3643-9.5706.2662-11.15071-.0982-1.58008-.6322-2.71681-1.8871-2.99303-.4032-.08875-1.9372-.17748-3.8995-.24967.9793-1.0846 2.1361-2.34437 3.5284-3.63478.405-.37542.4291-1.00813.0536-1.41319-.3754-.405062-1.0081-.429086-1.4132-.05366-1.61 1.49224-2.9274 2.95491-3.9684 4.11064-.1937.21508-.3778.41955-.5525.61158-.0947.10407-.1859.20373-.2738.29896-.9155-.02314-1.8546-.0422-2.7663-.056-.1596-.18054-.3281-.37314-.5061-.57663l-.1089-.12441c-1.18229-1.35084-2.71275-3.08411-4.44059-4.33968zm9.86039 12.42148c-1.0777 1.4126-4.8912 3.6285-6.16234 4.3486-.19344.1108-.41451-.0277-.41451-.2493 0-1.468 0-5.9827.05527-7.4507 0-.1939.22107-.3324.4145-.2216l6.02418 3.1576c.1382.0831.1934.2769.0829.4154z",
+		fill: "currentColor",
+		fillRule: "evenodd"
+	})
+});
 //#endregion
-//#region src/providers/WrapperProvider.tsx
-const WrapperContext = createContext({});
-const useWrappers = () => useContext(WrapperContext);
-const WrapperProvider = WrapperContext.Provider;
+//#region src/components/Icon/icons/CheckmarkCircleIcon.tsx
+const CheckmarkCircleIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		clipRule: "evenodd",
+		d: "m21.8158 14.5648c3.0982-10.94829-8.8224-15.41821-15.39746-10.85188-4.65388 3.23212-6.673329 10.24658-3.15895 14.34028 3.51439 4.0936 15.45811 7.4598 18.55641-3.4884zm-4.1007-5.8658c.3861-.39496.3788-1.02808-.0161-1.41413-.395-.38604-1.0281-.37882-1.4141.01613l-6.127 6.2684-2.44277-2.4992c-.38605-.3949-1.01917-.4021-1.41413-.0161-.39495.3861-.40217 1.0192-.01612 1.4141l3.15789 3.2308c.18815.1925.44596.301.71513.301.2692 0 .527-.1085.7151-.301z",
+		fill: "currentColor",
+		fillRule: "evenodd"
+	})
+});
 //#endregion
-//#region src/hooks/useTheme/useTheme.ts
-const useTheme = () => useTheme$1();
+//#region src/components/Icon/icons/CheckmarkCircleOutlineIcon.tsx
+const CheckmarkCircleOutlineIcon = ({ ...props }) => /* @__PURE__ */ jsxs("svg", {
+	...props,
+	children: [/* @__PURE__ */ jsx("path", {
+		clipRule: "evenodd",
+		d: "M11.25 2.5C6.41751 2.5 2.5 6.41751 2.5 11.25C2.5 16.0825 6.41751 20 11.25 20C16.0825 20 20 16.0825 20 11.25C20 6.41751 16.0825 2.5 11.25 2.5ZM0 11.25C0 5.0368 5.0368 0 11.25 0C17.4632 0 22.5 5.0368 22.5 11.25C22.5 17.4632 17.4632 22.5 11.25 22.5C5.0368 22.5 0 17.4632 0 11.25Z",
+		fill: "currentColor",
+		fillRule: "evenodd"
+	}), /* @__PURE__ */ jsx("path", {
+		clipRule: "evenodd",
+		d: "M17.1237 7.35609C17.6174 7.83865 17.6265 8.63005 17.1439 9.12374L10.3018 16.1237C10.0666 16.3644 9.74436 16.5 9.4079 16.5C9.07143 16.5 8.74918 16.3644 8.51399 16.1237L5.35609 12.893C4.87354 12.3993 4.88256 11.6079 5.37626 11.1253C5.86995 10.6428 6.66135 10.6518 7.14391 11.1455L9.4079 13.4617L15.3561 7.37626C15.8386 6.88256 16.6301 6.87354 17.1237 7.35609Z",
+		fill: "currentColor",
+		fillRule: "evenodd"
+	})]
+});
 //#endregion
-//#region src/private/helpers/isClient/isClient.ts
-/**
-* @returns {boolean} - whether running in a browser environment
-*/
-const isClient = () => typeof window !== "undefined" && typeof document !== "undefined";
+//#region src/components/Icon/icons/CheckmarkCircleThreeQuartersIcon.tsx
+const CheckmarkCircleThreeQuartersIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "m5.06066 10.1406c1.02693-3.83255 4.96634-6.10695 8.79884-5.08003.8844.23699 1.7935-.28787 2.0305-1.1723.237-.88444-.2879-1.79352-1.1723-2.0305-5.60142-1.500892-11.35896 1.82322-12.85985 7.42462-1.500884 5.60141 1.82323 11.35891 7.42463 12.85981 5.60142 1.5009 11.35892-1.8232 12.85982-7.4246.237-.8844-.2879-1.7935-1.1723-2.0305s-1.7935.2879-2.0305 1.1723c-1.0269 3.8325-4.9663 6.1069-8.7988 5.08-3.83257-1.0269-6.10696-4.9663-5.08004-8.7988zm16.57534-2.98696c.6582-.63651.6758-1.68609.0392-2.34429-.6365-.65821-1.686-.67579-2.3442-.03928l-7.5698 7.32023-2.17928-2.46975c-.60581-.68657-1.65349-.75203-2.34005-.14621-.68656.60576-.75202 1.65346-.14621 2.34006l2.94474 3.3372c.8339.9451 2.2881 1.0027 3.1942.1265z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/hooks/useWindowSize/useWindowSize.ts
-const useWindowSize = (interval = 0) => {
-	const [dimensions, setDimensions] = useState({
-		width: isClient() ? window.innerWidth : 0,
-		height: isClient() ? window.innerHeight : 0
-	});
-	useLayoutEffect(() => {
-		const handleResize = debounce(interval, () => setDimensions({
-			width: window.innerWidth,
-			height: window.innerHeight
-		}));
-		window.addEventListener("resize", handleResize);
-		return () => window.removeEventListener("resize", handleResize);
-	}, [interval]);
-	return dimensions;
-};
+//#region src/components/Icon/icons/CheckmarkIcon.tsx
+const CheckmarkIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "m8.79289 18.7054-6.50001-6.5374c-.39051-.3927-.39051-1.0295 0-1.4223l1.41418-1.42238c.39051-.39279 1.02371-.39279 1.41422 0l4.37872 4.40388 9.3787-9.43263c.3905-.39276 1.0237-.39276 1.4142 0l1.4142 1.42235c.3905.39275.3905 1.02956 0 1.42235l-11.5 11.56613c-.39054.3928-1.0237.3928-1.41421 0z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/hooks/useMq/useMq.ts
-const REM_SIZE = 16;
-const useMq = () => {
-	const viewportWidth = useWindowSize().width / REM_SIZE;
-	const theme = useTheme();
-	return {
-		isXsAndUp: true,
-		isSmAndUp: viewportWidth >= Number.parseFloat(theme.breakpoint.sm),
-		isMdAndUp: viewportWidth >= Number.parseFloat(theme.breakpoint.md),
-		isLgAndUp: viewportWidth >= Number.parseFloat(theme.breakpoint.lg),
-		isXlAndUp: viewportWidth >= Number.parseFloat(theme.breakpoint.xl),
-		isXsAndDown: viewportWidth < Number.parseFloat(theme.breakpoint.sm),
-		isSmAndDown: viewportWidth < Number.parseFloat(theme.breakpoint.md),
-		isMdAndDown: viewportWidth < Number.parseFloat(theme.breakpoint.lg),
-		isLgAndDown: viewportWidth < Number.parseFloat(theme.breakpoint.xl),
-		isXlAndDown: true
-	};
-};
+//#region src/components/Icon/icons/CheckmarkUnderlinedIcon.tsx
+const CheckmarkUnderlinedIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		d: "M9.54401 12.95L17.994 4.49995C18.194 4.29995 18.4315 4.19995 18.7065 4.19995C18.9815 4.19995 19.219 4.29995 19.419 4.49995C19.619 4.69995 19.719 4.93745 19.719 5.21245C19.719 5.48745 19.619 5.72495 19.419 5.92495L10.244 15.1C10.044 15.3 9.81067 15.4 9.54401 15.4C9.27734 15.4 9.04401 15.3 8.84401 15.1L4.56901 10.825C4.36901 10.625 4.27317 10.3875 4.28151 10.1125C4.28984 9.83745 4.39401 9.59995 4.59401 9.39995C4.79401 9.19995 5.03151 9.09995 5.30651 9.09995C5.58151 9.09995 5.81901 9.19995 6.01901 9.39995L9.54401 12.95ZM5.99401 19.8C5.71067 19.8 5.47317 19.7041 5.28151 19.5125C5.08984 19.3208 4.99401 19.0833 4.99401 18.8C4.99401 18.5166 5.08984 18.2791 5.28151 18.0875C5.47317 17.8958 5.71067 17.8 5.99401 17.8H17.994C18.2773 17.8 18.5148 17.8958 18.7065 18.0875C18.8982 18.2791 18.994 18.5166 18.994 18.8C18.994 19.0833 18.8982 19.3208 18.7065 19.5125C18.5148 19.7041 18.2773 19.8 17.994 19.8H5.99401Z",
+		fill: "currentColor"
+	})
+});
 //#endregion
-//#region src/components/Toast/ToastAnimation.tsx
-const toastPositionOffset = 24;
-const toastPositionStyles = {
-	bottom: toastPositionOffset,
-	left: toastPositionOffset,
-	position: "fixed"
-};
-const toastWidth = {
-	minWidth: "352px",
-	width: "400px"
-};
-const toastMobileWidth = { width: `calc(100% - ${toastPositionOffset * 2}px)` };
-const ToastAnimation = ({ children, in: inProp, renderInPlace }) => {
-	const { isSmAndUp } = useMq();
-	const { duration, zIndex } = useTheme();
-	const durationInSeconds = Number.parseInt(duration.expressive.fast, 10) / 1e3;
-	const toastStyle = {
-		...toastPositionStyles,
-		...isSmAndUp ? toastWidth : toastMobileWidth,
-		willChange: "auto",
-		zIndex: zIndex.Toast
-	};
-	if (renderInPlace) return /* @__PURE__ */ jsx(Fragment, { children });
-	return /* @__PURE__ */ jsx(AnimatePresence, { children: inProp ? /* @__PURE__ */ jsx(motion.div, {
-		animate: {
-			opacity: 1,
-			y: "0%"
-		},
-		exit: {
-			opacity: 0,
-			y: "100%"
-		},
-		initial: {
-			opacity: 0,
-			y: "100%"
-		},
-		style: toastStyle,
-		transition: { duration: durationInSeconds },
-		children
-	}) : null });
-};
-//#endregion
-//#region src/hooks/useThemeColor/useThemeColor.ts
-const getColor = (colors, colorName) => {
-	if (!colors.hasOwnProperty(colorName)) throw new Error(`\`${String(colorName)}\` is not a defined theme color, check argument passed to \`useThemeColor\``);
-	return colors[colorName];
-};
-const useThemeColor = (colorName = null) => {
-	const colors = useTheme().color;
-	if (!Object.keys({ ...colors }).length) throw new Error("The `useThemeColor` hook could not find any defined colors. A possible cause of this error is that your component is not wrapped in a theme provider such as `<VHSProvider />`");
-	if (colorName === null) return colors;
-	if (Array.isArray(colorName)) return colorName.map((color) => getColor(colors, color));
-	return getColor(colors, colorName);
-};
-//#endregion
-//#region src/components/Icon/iconMap.ts
-const iconMap$1 = {
-	"ab-test": "AbTestIcon",
-	"all-content": "AllContentIcon",
-	archived: "ArchivedIcon",
-	"arrow-down": "ArrowDownIcon",
-	"arrow-left": "ArrowLeftIcon",
-	"arrow-right": "ArrowRightIcon",
-	"arrow-up": "ArrowUpIcon",
-	asterisk: "AsteriskIcon",
-	audience: "AudienceIcon",
-	calendar: "CalendarIcon",
-	camera: "CameraIcon",
-	"caret-down": "CaretDownIcon",
-	"caret-left": "CaretLeftIcon",
-	"caret-right": "CaretRightIcon",
-	"caret-up": "CaretUpIcon",
-	channel: "ChannelIcon",
-	checkmark: "CheckmarkIcon",
-	"checkmark-circle": "CheckmarkCircleIcon",
-	"checkmark-circle-outline": "CheckmarkCircleOutlineIcon",
-	"checkmark-circle-three-quarters": "CheckmarkCircleThreeQuartersIcon",
-	"checkmark-underlined": "CheckmarkUnderlinedIcon",
-	close: "CloseIcon",
-	"close-circle": "CloseCircleIcon",
-	"collect-video": "CollectVideoIcon",
-	collection: "CollectionIcon",
-	comment: "CommentIcon",
-	community: "CommunityIcon",
-	"contact-us": "ContactUsIcon",
-	copy: "CopyIcon",
-	"copy-disabled": "CopyDisabledIcon",
-	create: "CreateIcon",
-	delete: "DeleteIcon",
-	"delete-sm": "DeleteSmIcon",
-	"dottie-clock": "DottieClockIcon",
-	download: "DownloadIcon",
-	draggable: "DraggableIcon",
-	edit: "PencilIcon",
-	ellipsis: "EllipsisIcon",
-	"ellipsis-vertical": "EllipsisVerticalIcon",
-	embed: "EmbedIcon",
-	episodes: "EpisodesIcon",
-	error: "TriangleIcon",
-	expand: "ExpandIcon",
-	export: "DownloadIcon",
-	favorite: "FavoriteIcon",
-	"favorite-outline": "FavoriteOutlineIcon",
-	filter: "FilterIcon",
-	gear: "GearIcon",
-	"getting-started": "GettingStartedIcon",
-	globe: "GlobeIcon",
-	"grid-view": "GridViewIcon",
-	"group-record": "GroupRecordIcon",
-	hamburger: "HamburgerIcon",
-	hazard: "HazardIcon",
-	"help-center": "HelpCenterIcon",
-	hide: "HideIcon",
-	home: "HomeIcon",
-	hourglass: "HourglassIcon",
-	import: "ImportIcon",
-	info: "InfoIcon",
-	integrations: "IntegrationsIcon",
-	invite: "InviteIcon",
-	"invite-to-record": "InviteToRecordIcon",
-	"lightning-bolt": "LightningBoltIcon",
-	link: "LinkIcon",
-	"list-view": "ListViewIcon",
-	live: "LiveIcon",
-	lock: "LockIcon",
-	logout: "LogoutIcon",
-	media: "MediaIcon",
-	megaphone: "MegaphoneIcon",
-	"more-options": "MoreOptionsIcon",
-	"open-new": "OpenNewIcon",
-	overview: "OverviewIcon",
-	paint: "PaintIcon",
-	pencil: "PencilIcon",
-	play: "PlayIcon",
-	playlist: "PlaylistIcon",
-	podcast: "PodcastIcon",
-	preview: "PreviewIcon",
-	"private-user-sessions": "PrivateUserSessionsIcon",
-	project: "ProjectIcon",
-	"question-mark": "QuestionMarkIcon",
-	react: "ReactIcon",
-	record: "RecordIcon",
-	redo: "RedoIcon",
-	"remove-from-channel": "RemoveFromChannelIcon",
-	replace: "ReplaceIcon",
-	reply: "ReplyIcon",
-	"save-copy": "CopyIcon",
-	scissors: "ScissorsIcon",
-	search: "SearchIcon",
-	send: "SendIcon",
-	settings: "SettingsIcon",
-	share: "ShareIcon",
-	soapbox: "SoapboxIcon",
-	sort: "SortIcon",
-	sparkle: "SparkleIcon",
-	spinner: "SpinnerIcon",
-	stats: "StatsIcon",
-	"switch-accounts": "SwitchAccountsIcon",
-	tag: "TagIcon",
-	team: "TeamIcon",
-	"thumbs-down": "ThumbsDownIcon",
-	"thumbs-up": "ThumbsUpIcon",
-	triangle: "TriangleIcon",
-	undo: "UndoIcon",
-	unlock: "UnlockIcon",
-	upload: "UploadIcon",
-	"users-permissions": "UsersPermissionsIcon",
-	"view-stream": "ViewStreamIcon",
-	wand: "WandIcon",
-	"zoom-in": "ZoomInIcon",
-	"zoom-out": "ZoomOutIcon"
-};
+//#region src/components/Icon/icons/CloseCircleIcon.tsx
+const CloseCircleIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		clipRule: "evenodd",
+		d: "M13.8186 20.4731C4.60239 22.893 -2.98829 15.5818 3.31523 6.74072C9.6261 -2.10038 19.5705 4.8504 21.402 9.84467C23.2334 14.8389 19.0556 19.105 13.8186 20.4731Z \n       M15.0413 8.87414C15.4318 8.48355 15.4318 7.85028 15.0413 7.45969C14.6508 7.0691 14.0178 7.0691 13.6273 7.45969L11.0001 10.0878L8.37284 7.4597C7.98238 7.06911 7.34932 7.06911 6.95886 7.4597C6.5684 7.85029 6.5684 8.48356 6.95886 8.87415L9.5861 11.5023L6.95886 14.1304C6.5684 14.5209 6.5684 15.1542 6.95886 15.5448C7.34932 15.9354 7.98238 15.9354 8.37284 15.5448L11.0001 12.9167L13.6273 15.5448C14.0178 15.9354 14.6508 15.9354 15.0413 15.5448C15.4318 15.1542 15.4318 14.521 15.0413 14.1304L12.4141 11.5023L15.0413 8.87414Z",
+		fill: "currentColor",
+		fillRule: "evenodd"
+	})
+});
 //#endregion
-//#region src/components/Icon/icons/AbTestIcon.tsx
-const AbTestIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/CloseIcon.tsx
+const CloseIcon$1 = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "M8.78042 2.11118C6.86612 2.34876 6.94137 3.15354 6.99208 3.69591V3.69599C6.99476 3.72465 6.99738 3.75258 6.99962 3.77965C7.04436 4.31904 7.55048 5.39025 8.78042 5.39025H8.79735L8.79731 5.40433C8.79731 5.40433 9.05197 8.22842 8.79731 9.662C8.63183 10.5935 8.18982 11.2329 7.69474 11.865C8.39927 11.9016 9.14688 11.9764 9.93037 12.0994C10.4699 12.1842 10.8383 12.6879 10.753 13.2246C10.6678 13.7612 10.1613 14.1276 9.62166 14.0428C8.33927 13.8413 7.1731 13.7835 6.16316 13.812C5.48376 14.6589 4.44391 15.9821 3.58432 17.1925C5.12252 17.2343 7.05517 17.2692 9.48309 17.1438C10.0287 17.1157 10.4939 17.5327 10.5222 18.0753C10.5504 18.6178 10.1312 19.0805 9.58566 19.1086C6.78798 19.253 4.53527 19.189 2.90579 19.1426C2.71222 19.1371 2.52744 19.1319 2.35159 19.1273C1.49048 20.8558 2.24968 21.573 4.20714 21.7855C6.33564 22.0165 18.0133 22.1217 19.9478 21.7855C21.8825 21.4493 22.5323 19.9214 21.5397 18.6499C20.547 17.3783 17.7768 13.4113 16.9172 11.9984C16.7004 11.642 16.4948 11.3282 16.3083 11.0435C15.7556 10.1997 15.3708 9.61242 15.36 8.93404L15.3601 5.40433L15.36 5.39025H15.3746C16.8928 5.34284 17.0231 4.6562 17.0231 3.75071C17.0231 2.84523 16.285 2.11118 15.3746 2.11118C15.3746 2.11118 10.7959 1.86103 8.78042 2.11118Z",
+		d: "m17.7742 19.618c.5091.5093 1.3347.5093 1.8439 0 .5091-.5091.5091-1.3347 0-1.8438l-5.7742-5.7742 5.7742-5.77422c.5091-.50918.5091-1.3347 0-1.84387-.5092-.50917-1.3348-.50917-1.8439 0l-5.7742 5.77419-5.77426-5.77422c-.50917-.50917-1.33469-.50917-1.84387 0-.50916.50917-.50916 1.3347 0 1.84386l5.77423 5.77426-5.77421 5.7742c-.50918.5092-.50918 1.3347 0 1.8439.50916.5092 1.33469.5092 1.84385 0l5.77426-5.7742z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/AllContentIcon.tsx
-const AllContentIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/CollectVideoIcon.tsx
+const CollectVideoIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "m3.09059 3.5023c.5523 0 1 .4477 1 1l-.00092.70188c-.01018 3.93536-.10142 7.15092-.08848 9.77572.0068 1.3587.0426 2.4727.1299 3.3301.071.6968.16857 1.1263.25679 1.3643l.00412.0107.04589.0175c.01953.007.04171.0145.06676.0224l.08404.025c.2655.0742.6435.1409 1.1387.1952.9865.1081 2.3084.1539 3.8524.1644 3.14371.0213 6.85261-.0993 10.44111-.0993l.1166.0067c.4974.0578.8834.4805.8834.9933 0 .5522-.4477 1-1 1l-.738.0017c-3.232.0147-6.8753.1168-9.71671.0976-1.558-.0106-2.9641-.0566-4.0568-.1763-.5444-.0597-1.0437-.141-1.4591-.2571-.3702-.1035-.8555-.2808-1.185-.649l-.05731-.0703-.05079-.0751-.10286-.186c-.29118-.5812-.4296-1.3656-.51294-2.183-.0974-.9568-.1333-2.1494-.1402-3.5229-.0133-2.6853.0894-6.4106.0894-10.4876l.00673-.11652c.05776-.49735.48042-.88338.99327-.88338zm6.5557-1.37637.53051.02595c1.8616.09188 3.7138.19142 3.7138.19142s1.0423-.01829 2.2175-.02072l.4451-.0001c.8957.00155 1.802.01442 2.3355.05302 2.564.2222 2.6272 1.1409 2.7026 2.237.0118.172.024.3485.0461.5273.2722 2.1214.4627 4.9141.4627 6.5213 0 1.6393-.0545 5.1864-.245 5.4757-.2721.4178-.7348.9964-2.6398.8357-1.5154-.1278-7.0949-.2353-9.79337-.2416l-.43309-.0001c-.46931.0011-.80752.0065-.95905.0167-.9525.0643-2.0683-.0643-2.2588-1.125-.17942-.9182-.22215-3.2602-.2137-5.7009l.00427-.7725c.01347-1.80295.04985-3.58372.07493-4.8122.0148-.7225.0256-1.254.0256-1.4866 0-.0124-.0004-.0308-.001-.0543-.0081-.3442-.0425-1.796.8683-1.796.39926 0 1.70989.05778 3.1169.12593zm1.68581 5.01357c-.0356.94577-.0413 3.5445-.0421 5.0123l-.0002.688c0 .1695.1692.2755.3172.1907.9725-.551 3.89-2.2463 4.7145-3.327.0846-.106.0423-.2543-.0634-.3179l-4.6089-2.4156c-.148-.0848-.3171.0212-.3171.1695z",
-		fill: "currentColor"
+		clipRule: "evenodd",
+		d: "M12 6.85714H3V4.92857C3 3.864 3.864 3 4.92857 3H8.74072C9.17014 3 9.57257 3.21471 9.81043 3.57214L12 6.85714ZM3 6.85718H19.0714C20.136 6.85718 21 7.72118 21 8.78575V13.1438C20.9149 13.1202 20.8253 13.1077 20.7328 13.1077H13.3066L14.7071 11.7071C15.0976 11.3166 15.0976 10.6834 14.7071 10.2929C14.3166 9.90237 13.6834 9.90237 13.2929 10.2929L10.2929 13.2929C10.1054 13.4804 10 13.7348 10 14C10 14.2652 10.1054 14.5196 10.2929 14.7071L13.2929 17.7071C13.6834 18.0976 14.3166 18.0976 14.7071 17.7071C15.0976 17.3166 15.0976 16.6834 14.7071 16.2929L13.5219 15.1077H20.7328C20.8253 15.1077 20.9149 15.0951 21 15.0716V17.1429C21 19.272 19.272 21 17.1429 21H6.85714C4.728 21 3 19.272 3 17.1429V6.85718Z",
+		fill: "currentColor",
+		fillRule: "evenodd"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/ArchivedIcon.tsx
-const ArchivedIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/CommentIcon.tsx
+const CommentIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
 		clipRule: "evenodd",
-		d: "m1.73061 4.12674c-.00015-.04078-.00031-.08299-.0006-.12674.00196-.01564.00388-.03112.00579-.04645.14457-1.16135.18151-1.45809 3.76421-1.95355 4.033-.558 11.67499-.278 15.49699.892.433.133 1.003.608 1.003 1.108 0 .63366.0008.64812.0016.66226.0007.01356.0014.02683.0014.58474-.1073.53269-.783.38874-1.8549.16039-.8357-.17804-1.9122-.40739-3.1481-.40739-.9352 0-2.0855-.03207-3.3103-.06622-2.7041-.07539-5.7715-.16091-7.68969.06622-.93175.05647-1.70731.17102-2.3234.26202-.91133.1346-1.47374.21767-1.6766-.01502-.26635-.30625-.26743-.59442-.2694-1.12026zm.38218 9.34776.0002.0065c.027.913.053 1.802.033 2.573l-.01.316-.00009.0031c-.05397 1.901-.10965 3.8622.37509 4.4189.34.39 1.277.743 3.591.743 2.315 0 11.63801.264 12.80501.403 1.168.14 2.548.112 2.739-.836.303-1.4255.306-4.3452.308-6.2904v-.0386c0-.625 0-1.147.01-1.48.031-1.25-.024-1.967-.081-2.702-.021-.266-.042-.534-.059-.83-.005-.146-.008-.281-.01-.406l-.0001-.00311c-.0169-.82786-.0249-1.21719-.8169-1.45989-3.822-1.171-11.46401-1.45-15.49701-.892-3.195.442-3.233.992-3.297 1.935-.00056.00797-.00112.01597-.00168.024-.00848.12097-.01744.24897-.03432.384-.14378 1.1792-.09814 2.6835-.0542 4.1315zm5.0572-1.8505c-.316-.349-.254-1.079-.149-1.376.114-.297 3.05201-.268 5.00901-.214 1.5006.0502 2.997.1864 4.482.408.298.052.613.705.465 1.175l-.023.075c-.037.13-.075.263-.17.274-.36.012-6.747-.068-6.747-.068s-2.55201.074-2.86701-.274z",
-		fill: "currentColor"
+		d: "M2.0994 10.6931C2.04002 8.22692 1.96942 5.29509 2.11584 4.25593C2.13365 4.13216 2.14292 4.01528 2.1517 3.90469C2.21613 3.09248 2.25369 2.61894 5.44865 2.23843C9.48199 1.75807 17.1241 1.99825 20.9452 3.007C21.7385 3.21574 21.7461 3.55147 21.7624 4.26645C21.7648 4.37414 21.7675 4.49044 21.773 4.6162C21.8367 5.57691 22.0066 10.2604 21.9641 11.7255C21.9538 12.0123 21.9535 12.4616 21.9532 13.001V13.001C21.9522 14.6749 21.9507 17.2153 21.6457 18.4505C21.4546 19.2671 20.0748 19.2911 18.9073 19.171C18.4972 19.1289 17.0813 19.0734 15.3164 19.0193C14.4586 19.7428 13.2551 20.8268 12.6703 21.669C12.4667 21.9623 12.1951 22 11.9708 22C11.7566 22 11.6986 21.9343 11.3756 21.5684L11.3281 21.5147C10.6506 20.7484 9.58149 19.5267 9.00085 18.8624C7.74516 18.8383 6.69432 18.8234 6.10233 18.8234C3.78846 18.8234 2.85054 18.5199 2.51089 18.1837C2.02619 17.7038 2.08219 16.014 2.13647 14.3759L2.14543 14.1031C2.16606 13.462 2.13471 12.1599 2.0994 10.6931ZM4.33635 7.16713C4.33635 7.16713 3.83065 8.24157 4.01326 8.52809C4.14949 8.74182 8.25659 8.84926 10.9526 8.91979L10.9527 8.91979C11.8709 8.94381 12.6253 8.96354 13.0036 8.98174C14.1695 9.05337 17.7376 8.83848 19.2126 8.74298C19.24 8.74161 19.2672 8.74047 19.2943 8.73935C19.7381 8.72089 20.1152 8.7052 19.943 7.69241C19.9149 7.5014 19.8166 7.38202 19.634 7.38202C19.044 7.38202 9.89913 7.38202 7.90439 7.191L7.64546 7.16615C5.81529 6.99024 4.8063 6.89326 4.33635 7.16713ZM19.8977 11.4732C20.0908 11.7527 19.6254 12.8452 19.6254 12.8452C19.166 13.1363 18.1541 13.0769 16.3186 12.9692C16.2338 12.9642 16.1473 12.9591 16.059 12.9539C14.0586 12.8372 4.92114 13.177 4.33049 13.199L4.33037 13.199C4.14788 13.2058 4.04518 13.0901 4.01001 12.9003C3.80035 11.8946 4.17656 11.8649 4.61942 11.83C4.64638 11.8278 4.67359 11.8257 4.70093 11.8233C6.17134 11.673 9.72893 11.3257 10.8967 11.3539C11.2754 11.3581 12.0301 11.3498 12.9486 11.3396C15.6454 11.3099 19.7536 11.2646 19.8977 11.4732Z",
+		fill: "currentColor",
+		fillRule: "evenodd"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/ArrowDownIcon.tsx
-const ArrowDownIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/CommunityIcon.tsx
+const CommunityIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "m19.7685 14.8636c.615-.555.6637-1.5035.1087-2.1185-.555-.6151-1.5035-.6637-2.1185-.1088l-4.2587 3.8429v-12.27446c0-.82845-.6716-1.5-1.5-1.5s-1.5.67155-1.5 1.5v12.27446l-4.25874-3.8429c-.615-.555-1.56345-.5063-2.11845.1088-.555.615-.5064 1.5635.10875 2.1185l6.76354 6.1031c.5709.5152 1.4389.5152 2.0098 0z",
+		d: "m14.8307 3.14077c.3645.16757.686.31534.9541.40981l.0186.00652c1.2355.43528 5.3747 1.89346 6.0303 4.36204.5612 2.11356-.3999 4.17296-1.3677 6.24656-.1682.3606-.3367.7217-.4975 1.0835-.0379.0854-.0756.1704-.1132.255-1.4657 3.3022-2.6018 5.8617-4.6582 6.3731-2.1092.5247-5.1606-.7312-7.71054-1.9147-.05102-.0244-.10251-.0491-.15441-.0738-1.99154-.951-4.60465-2.1987-5.20489-4.1987-.61588-2.0523 1.14517-6.02627 2.25161-7.92519.20562-.35289.40011-.72469.59807-1.10314.86724-1.65795 1.80113-3.44328 4.02973-4.32392 2.19233-.86633 4.35703.12865 5.82403.80292zm-2.2269 2.13686c-.5027-.24679-1.1143-.04716-1.366.44591l-.6538 1.281-1.30983-.64294c-.50277-.24679-1.11436-.04714-1.36603.44591-.25167.49306-.04812 1.09282.45465 1.33961l1.3098.64293-1.50554 2.94955-1.44199-.7078c-.50276-.2468-1.11435-.0471-1.36602.4459-.25167.4931-.04812 1.0928.45465 1.3396l1.44198.7078-.77998 1.5281c-.25167.4931-.04812 1.0929.45464 1.3396.50277.2468 1.11436.0472 1.36603-.4459l.77999-1.5281 2.98935 1.4674-.7622 1.4931c-.2517.4931-.0481 1.0929.4547 1.3397.5027.2467 1.1143.0471 1.366-.446l.7622-1.4931 1.4413.7075c.5028.2468 1.1144.0471 1.366-.446.2517-.4929.0482-1.0928-.4546-1.3396l-1.4414-.7074 1.5055-2.9496 1.5735.7724c.5028.2468 1.1144.0472 1.3661-.4459.2516-.4931.0481-1.0928-.4546-1.3396l-1.5736-.7724.6717-1.31597c.2518-.49306.0482-1.09282-.4546-1.33961-.5027-.24679-1.1143-.04715-1.366.4459l-.6718 1.31598-2.9892-1.46736.6538-1.281c.2517-.49306.0481-1.09283-.4547-1.33961zm1.8788 5.87347-1.5055 2.9496-2.98937-1.4674 1.50557-2.94954z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/ArrowLeftIcon.tsx
-const ArrowLeftIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/ContactUsIcon.tsx
+const ContactUsIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "M9.1653 19.7974C9.72028 20.4124 10.6688 20.4611 11.2838 19.9061C11.8989 19.3512 11.9476 18.4027 11.3926 17.7876L7.54974 13.5289L19.8242 13.5289C20.6526 13.5289 21.3242 12.8573 21.3242 12.0289C21.3242 11.2005 20.6526 10.5289 19.8242 10.5289L7.54975 10.5289L11.3926 6.27019C11.9476 5.65519 11.8989 4.70674 11.2838 4.15174C10.6688 3.59674 9.72028 3.64534 9.16529 4.26049L3.06217 11.024C2.54703 11.5949 2.54703 12.4629 3.06217 13.0338L9.1653 19.7974Z",
+		d: "m2 7.13053c1.02794.75462 2.30848 1.82137 3.61006 2.90567 0 0 5.06424 3.9629 5.81564 3.9629 1.8549 0 3.7992-1.8146 5.1678-2.8746 1.3176-1.0205 2.7467-2.21282 4.0625-3.31055.1651-.13774.3285-.27408.4895-.40831-.0011.22999.0035.44719.0315.64131.3947 2.63975.4326 8.17435 0 11.09695-.3145.4144-.8493.9882-3.0513.8288s-11.82778-.2869-12.92877-.2231c-1.101.0637-2.39073-.0638-2.61093-1.1158-.40264-1.7682-.5511-8.74247-.586-11.50327zm16.4311-2.99936c1.2812.09529 1.9619.48357 2.322 1.00077-.4574.37757-.9338.77506-1.4207 1.18138-1.2989 1.0838-2.6732 2.23056-3.9636 3.22999-.9655.74789-1.8517 1.38729-2.5896 1.83539-.3691.2242-.6815.3884-.9342.4939-.2367.0989-.3632.1358-.5917.0084-.2306-.1286-.5322-.3283-.8998-.5958-.73248-.5331-1.63926-1.2708-2.61739-2.08202-.26991-.22385-.54604-.45404-.8253-.68686-.21657-.18055-.43504-.36268-.65398-.54466l-.65679-.54374c-1.20143-.98965-2.37365-1.92213-3.27827-2.50838.22838-.42619.59195-.78832 1.14091-.78831 1.57531.00002 3.21902-.03191 4.885-.06428 3.39902-.06604 6.89072-.13388 10.08342.06422z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/ArrowRightIcon.tsx
-const ArrowRightIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/CopyDisabledIcon.tsx
+const CopyDisabledIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "M14.8347 4.26044C14.2797 3.6454 13.3312 3.59671 12.7162 4.15169C12.1011 4.70668 12.0524 5.65517 12.6074 6.27022L16.4502 10.5289L4.17581 10.5289C3.34736 10.5289 2.67581 11.2005 2.67581 12.0289C2.67581 12.8573 3.34736 13.5289 4.17581 13.5289L16.4502 13.5289L12.6074 17.7877C12.0524 18.4027 12.1011 19.3511 12.7161 19.9061C13.3312 20.4611 14.2797 20.4125 14.8347 19.7974L20.9378 13.0338C21.453 12.4629 21.453 11.5949 20.9378 11.024L14.8347 4.26044Z",
+		d: "m23.7071 1.70711c.3905-.39053.3905-1.023692 0-1.414217-.3905-.3905241-1.0237-.3905241-1.4142 0l-22.000007 22.000007c-.3905238.3905-.3905242 1.0237 0 1.4142.390524.3905 1.023687.3905 1.414217 0zm-5.0845.29289c.1737 0 .3443.01298.5109.03803l-3.3066 3.30661h-8.21351c-.93263 0-1.68869-.74873-1.68869-1.67232 0-.92361.75606-1.67232 1.68869-1.67232zm-14.9339 4.94911h10.5338l-12.2225 12.22249v-10.55017c0-.92359.75605-1.67232 1.6887-1.67232zm13.5095 2.68113-12.36977 12.36976h10.68107c.9327 0 1.6887-.7487 1.6887-1.6723zm4.7671-4.76707-3.3427 3.34265v8.10658c0 .9235.756 1.6724 1.6887 1.6724s1.6887-.7489 1.6887-1.6724v-10.96776c0-.1635-.0118-.32425-.0347-.48147z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/ArrowUpIcon.tsx
-const ArrowUpIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/CopyIcon.tsx
+const CopyIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "M4.23151 9.19422C3.61647 9.7492 3.56778 10.6977 4.12276 11.3127C4.67775 11.9278 5.62624 11.9765 6.24129 11.4215L10.5 7.57866L10.5 19.8531C10.5 20.6815 11.1716 21.3531 12 21.3531C12.8284 21.3531 13.5 20.6815 13.5 19.8531L13.5 7.57867L17.7587 11.4215C18.3737 11.9765 19.3222 11.9278 19.8772 11.3128C20.4322 10.6977 20.3836 9.7492 19.7684 9.19422L13.0049 3.09109C12.434 2.57595 11.566 2.57595 10.9951 3.09109L4.23151 9.19422",
+		d: "m18.6226 16.3124c0 .9235.756 1.6724 1.6887 1.6724s1.6887-.7489 1.6887-1.6724v-10.96776c0-1.8472-1.5122-3.34464-3.3774-3.34464h-11.00921c-.93263 0-1.68869.74871-1.68869 1.67232 0 .92359.75606 1.67232 1.68869 1.67232h11.00921zm-3.1131 5.6876c.9327 0 1.6887-.7487 1.6887-1.6723v-11.70627c0-.92359-.756-1.67232-1.6887-1.67232h-11.8208c-.93265 0-1.6887.74873-1.6887 1.67232v11.70627c0 .9236.75605 1.6723 1.6887 1.6723z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/AsteriskIcon.tsx
-const AsteriskIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/CreateIcon.tsx
+const CreateIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "M14.4425 22L13.9358 15.3633L19.5575 19.0908L22 14.9542L15.3642 11.9542L22 9L19.5575 4.86333L13.9358 8.63667L14.4425 2H9.5575L10.0183 8.68167L4.39667 4.90917L2 9.04583L8.4975 12L2 14.9092L4.39667 19L10.0183 15.2725L9.5575 22H14.4425Z",
+		d: "m10.3966 3.60341c0-.88553.7179-1.60341 1.6034-1.60341s1.6034.71788 1.6034 1.60341v6.79319h6.7932c.8856 0 1.6034.7179 1.6034 1.6034 0 .8856-.7178 1.6034-1.6034 1.6034h-6.7932v6.7932c0 .8856-.7179 1.6034-1.6034 1.6034s-1.6034-.7178-1.6034-1.6034v-6.7932h-6.7932c-.88554 0-1.6034-.7178-1.6034-1.6034 0-.8855.71786-1.6034 1.6034-1.6034h6.7932z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/AudienceIcon.tsx
-const AudienceIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/DeleteIcon.tsx
+const DeleteIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "m11.1744 3.04659c2.6835 2.33688 2.1425 8.06531-2.85234 7.99341-4.99483-.0719-5.03082-5.26362-3.69418-7.27726 1.33665-2.01364 4.64706-2.37021 6.54652-.71615zm8.511 8.47051c1.505 1.3105 1.2016 4.523-1.5995 4.4827-2.8011-.0404-2.8213-2.9519-2.0717-4.0811s2.6061-1.3292 3.6712-.4016zm-16.99799 10.3336c-.32545.0141-.61759-.3577-.6444-.8086-.15145-2.3574.04693-5.2652 1.4129-7.0804 2.86859-3.7922 9.46089-1.5366 10.60059 2.1134.236.7357.4008 1.5352.4961 2.3645.1371-.16.2718-.3099.3984-.4466 1.7601-1.8904 5.8048-.766 6.5041 1.0535.2965.751.4096 1.6354.3492 2.5077-.0098.2438-.2089.4477-.4506.4458h-7.4492-.0132-.0022-.4484c-.0235.0008-.0471-.0016-.0706-.0069z",
+		d: "m14.904 2.36857c.6808.18014 1.0637 1.89327 1.3326 3.11843 1.0626.02303 2.1802.06975 3.3652.15126.5509.0379.9669.51528.929 1.06626-.0379.55099-.5153.96692-1.0663.92902-3.2573-.22405-5.9961-.17824-8.5308-.1036-.3474.01023-.6918.02104-1.03385.03178-2.1416.06726-4.18778.13153-6.28166.02989-.55163-.02678-.97711-.49568-.95034-1.04731.02678-.55164.49568-.97712 1.04731-.95034 1.04212.05058 2.0709.0584 3.11959.04482.08961-.94493.83902-2.66045 1.49748-3.27021.72917-.67525 5.56337-.2668 6.57177 0zm-8.53971 18.93913c-.38411-1.7907-1.43613-8.7724-1.60784-10.1112-.01239-.0967-.02523-.1887-.03746-.2764-.1573-1.12763-.21516-1.5424 2.05023-1.84784 2.71293-.36579 9.32588-.45722 11.89608.31093.5336.15895.5387.4146.5496.95901.0017.082.0035.1706.0072.2664 0 2.8358-.6932 5.8331-1.3554 8.6963-.1564.6763-.3112 1.3453-.4546 2.0028-.1285.6219-1.0566.6401-1.842.5487-.7853-.0915-5.4362-.2926-6.99265-.2926-1.55635 0-1.98471 0-2.21316-.2561zm8.97891-9.2246c-.0298-.5515-.501-.9744-1.0525-.9446s-.9744.501-.9446 1.0525c.0309.5711-.027 1.5863-.123 2.7715-.0544.6721-.1166 1.3496-.1763 2.0013-.0459.5008-.0905.9868-.1291 1.4427-.0465.5504.3619 1.0342.9122 1.0807.5503.0466 1.0342-.3618 1.0807-.9122.0351-.4152.0789-.8939.1249-1.3962l.0002-.0017.0001-.0015c.0616-.6734.1271-1.3892.1808-2.0516.094-1.1611.166-2.312.1266-3.0409zm-5.56465 7.4093c.55025.0479 1.03505-.3594 1.08295-.9096.0632-.7272.0291-1.8798-.0269-3.0434-.0319-.6643-.0739-1.3823-.1135-2.0578-.0295-.504-.0576-.985-.0791-1.4014-.0285-.5516-.4987-.9756-1.05025-.9472-.55156.0285-.97562.4987-.94716 1.0502.02358.4571.05217.944.08167 1.4462.03835.653.07827 1.3328.11063 2.006.0571 1.1878.08163 2.2042.03206 2.7741-.04786.5502.3594 1.035.9096 1.0829z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/CalendarIcon.tsx
-const CalendarIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/DeleteSmIcon.tsx
+const DeleteSmIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		clipRule: "evenodd",
-		d: "m7.5 2.9895c.82843 0 1.5.67157 1.5 1.5v1.51041l6 .00003c0-.00001 0 .00001 0 0v-1.51044c0-.82843.6716-1.5 1.5-1.5s1.5.67157 1.5 1.5v1.51041c0-.00001 0 .00001 0 0l1.5.00003c.8284 0 1.5.67157 1.5 1.5v1.5c0 .82843-.6716 1.49996-1.5 1.49996h-15c-.82843 0-1.5-.67153-1.5-1.49996v-1.5c0-.82843.67157-1.5 1.5-1.5h1.5v-1.51044c0-.82843.67157-1.5 1.5-1.5zm-3 9.0104c-.82843 0-1.5.6716-1.5 1.5v6c0 .8285.67157 1.5 1.5 1.5h15c.8284 0 1.5-.6715 1.5-1.5v-6c0-.8284-.6716-1.5-1.5-1.5z",
+	children: /* @__PURE__ */ jsxs("g", {
 		fill: "currentColor",
-		fillRule: "evenodd"
+		children: [/* @__PURE__ */ jsx("path", { d: "m9.05042 2c-.64391 0-1.23256.35667-1.52052.92132l-1.23015 2.41201h-1.59974c-.9389 0-1.70001.74619-1.70001 1.66667 0 .92047.76111 1.66667 1.70001 1.66667h14.59999c.9389 0 1.7-.7462 1.7-1.66667 0-.92048-.7611-1.66667-1.7-1.66667h-1.8003l-1.2301-2.41201c-.288-.56465-.8765-.92132-1.5205-.92132z" }), /* @__PURE__ */ jsx("path", { d: "m6.63212 10c-.9389 0-1.63212.7462-1.63212 1.6667v8.8333c0 .9205.36086 1.5 1.29975 1.5h11.19995c.9389 0 1.5003-.5795 1.5003-1.5l-.1-8.8333c0-.9205-.4611-1.6667-1.4-1.6667z" })]
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/CameraIcon.tsx
-const CameraIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/DottieClockIcon.tsx
+const DottieClockIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
 		clipRule: "evenodd",
-		d: "M11.3162 20.979C11.6222 20.9857 11.9282 20.9924 12.2342 21V20.992C12.276 20.992 12.3178 20.9924 12.3595 20.9928C12.443 20.9935 12.5264 20.9942 12.6096 20.992C12.9666 20.9825 13.3235 20.9735 13.6805 20.9645C14.6678 20.9395 15.6552 20.9144 16.6423 20.8803C17.3374 20.8559 18.032 20.8127 18.7251 20.7569C19.3748 20.7048 20.0238 20.6415 20.6727 20.5783C20.9177 20.5544 21.1626 20.5305 21.4076 20.5072C21.8887 20.4612 22.2848 20.0971 22.3749 19.624C22.5973 18.4536 22.7728 17.2761 22.8625 16.0887C22.9258 15.2478 22.9671 14.403 22.9784 13.5597C22.9883 12.8257 22.9578 12.0898 22.9174 11.3563C22.8803 10.6899 22.8278 10.023 22.7433 9.36129C22.6605 8.71089 22.5531 8.06362 22.4457 7.41667C22.4215 7.27097 22.3974 7.12528 22.3735 6.97958C22.2928 6.48916 21.8624 6.12123 21.3663 6.08228C21.0761 6.05955 20.7863 6.03115 20.4965 6.00274C20.2656 5.98012 20.0347 5.9575 19.8036 5.93773C19.2277 5.88845 18.6514 5.84434 18.0747 5.80586C17.9794 5.79929 17.9418 5.76737 17.9151 5.67868L17.8955 5.61308C17.7345 5.07457 17.5734 4.53581 17.3998 4.00139C17.2445 3.5227 16.7784 3.15664 16.3077 3.1313C16.1265 3.12155 15.9453 3.11126 15.7641 3.10098C15.1608 3.06675 14.5575 3.03253 13.9537 3.01773C12.2178 2.97502 10.4823 3.00787 8.75008 3.13365C8.62103 3.14303 8.48634 3.17917 8.36901 3.23455C8.02173 3.39833 7.773 3.66208 7.65567 4.03236C7.56181 4.32848 7.47105 4.62568 7.38028 4.92287C7.3013 5.18146 7.22232 5.44004 7.14131 5.69792C7.12817 5.73922 7.07937 5.79131 7.04041 5.79741C6.95316 5.81131 6.86434 5.81585 6.77551 5.82041C6.73533 5.82246 6.69516 5.82452 6.65512 5.82744C6.53247 5.83652 6.40978 5.84531 6.28709 5.8541C5.96567 5.87712 5.64421 5.90015 5.32324 5.92834C5.07994 5.94972 4.83701 5.97418 4.59413 5.99864C4.29308 6.02896 3.99209 6.05927 3.69053 6.08368C3.21982 6.1217 2.78478 6.49432 2.70453 6.96316C2.66943 7.16876 2.63372 7.37429 2.59802 7.57982C2.47619 8.28117 2.35434 8.98263 2.25634 9.68746C2.15263 10.4327 2.06674 11.1841 2.03202 11.9354C1.99259 12.782 1.9879 13.6329 2.02732 14.479C2.06674 15.3322 2.1545 16.1854 2.26714 17.032C2.35101 17.6614 2.46316 18.287 2.5753 18.9124C2.61877 19.1549 2.66224 19.3973 2.70406 19.64C2.77868 20.0708 3.19542 20.4636 3.61263 20.5044C3.69683 20.5127 3.78099 20.5213 3.86514 20.5298C4.03332 20.5469 4.20149 20.564 4.37008 20.579C4.58912 20.5986 4.80813 20.6188 5.02715 20.639C5.58193 20.6903 6.13681 20.7416 6.69266 20.7813C7.51863 20.8404 8.34601 20.8897 9.17386 20.9207C9.88781 20.9476 10.602 20.9633 11.3162 20.979ZM6.3909 12.7131C6.41718 9.38992 9.19264 6.63089 12.5083 6.64872C15.8811 6.66703 18.5796 9.38664 18.5707 12.7375C18.5618 16.0676 15.807 18.8534 12.4721 18.8328C9.15556 18.8121 6.36462 16.0512 6.3909 12.7131ZM16.2261 12.7248C16.2383 10.658 14.5539 8.99148 12.4754 8.99524L12.4749 8.99571C10.4006 8.99899 8.72848 10.6655 8.73318 12.7243C8.73834 14.7935 10.4217 16.4942 12.4806 16.4867C14.5619 16.4792 16.2139 14.8104 16.2261 12.7248Z",
+		d: "M10 18.8889C9.54004 18.8889 9.16671 18.5155 9.16671 18.0555C9.16671 17.5955 9.54004 17.2222 10 17.2222C13.9823 17.2222 17.2223 13.9822 17.2223 9.99997C17.2223 6.01775 13.9823 2.77775 10 2.77775C9.54004 2.77775 9.16671 2.40442 9.16671 1.94442C9.16671 1.48442 9.54004 1.11108 10 1.11108C14.9012 1.11108 18.8889 5.09886 18.8889 9.99997C18.8889 14.9011 14.9012 18.8889 10 18.8889ZM13.61 13.3333C13.4478 13.3333 13.2812 13.2855 13.1367 13.1855L9.5256 10.6855C9.30115 10.53 9.16671 10.2733 9.16671 9.99997V5.27775C9.16671 4.81775 9.54004 4.44442 10 4.44442C10.46 4.44442 10.8334 4.81775 10.8334 5.27775V9.56331L14.0856 11.8144C14.4645 12.0766 14.5589 12.5955 14.2956 12.9733C14.1334 13.2066 13.8745 13.3322 13.61 13.3322V13.3333ZM5.13676 15.6966C5.13676 16.1568 4.76366 16.5299 4.30343 16.5299C3.84319 16.5299 3.47009 16.1568 3.47009 15.6966C3.47009 15.2363 3.84319 14.8632 4.30343 14.8632C4.76366 14.8632 5.13676 15.2363 5.13676 15.6966ZM1.94442 10.8333C2.40465 10.8333 2.77775 10.4602 2.77775 9.99994C2.77775 9.5397 2.40465 9.16661 1.94442 9.16661C1.48418 9.16661 1.11108 9.5397 1.11108 9.99994C1.11108 10.4602 1.48418 10.8333 1.94442 10.8333ZM5.13676 4.30332C5.13676 4.76356 4.76366 5.13666 4.30343 5.13666C3.84319 5.13666 3.47009 4.76356 3.47009 4.30332C3.47009 3.84309 3.84319 3.46999 4.30343 3.46999C4.76366 3.46999 5.13676 3.84309 5.13676 4.30332ZM6.91777 18.2755C7.378 18.2755 7.7511 17.9024 7.7511 17.4422C7.7511 16.9819 7.378 16.6088 6.91777 16.6088C6.45753 16.6088 6.08443 16.9819 6.08443 17.4422C6.08443 17.9024 6.45753 18.2755 6.91777 18.2755ZM3.39115 13.0822C3.39115 13.5425 3.01806 13.9155 2.55782 13.9155C2.09758 13.9155 1.72449 13.5425 1.72449 13.0822C1.72449 12.622 2.09758 12.2489 2.55782 12.2489C3.01806 12.2489 3.39115 12.622 3.39115 13.0822ZM2.55782 7.751C3.01806 7.751 3.39115 7.3779 3.39115 6.91766C3.39115 6.45743 3.01806 6.08433 2.55782 6.08433C2.09758 6.08433 1.72449 6.45743 1.72449 6.91766C1.72449 7.3779 2.09758 7.751 2.55782 7.751ZM7.7511 2.55772C7.7511 3.01796 7.378 3.39105 6.91777 3.39105C6.45753 3.39105 6.08443 3.01796 6.08443 2.55772C6.08443 2.09748 6.45753 1.72439 6.91777 1.72439C7.378 1.72439 7.7511 2.09748 7.7511 2.55772Z",
 		fill: "currentColor",
 		fillRule: "evenodd"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/CaretDownIcon.tsx
-const CaretDownIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/DownloadIcon.tsx
+const DownloadIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "m2.68581 7.2381c.52393-.57331 1.39057-.64667 2.00074-.19312l.11843.09775 7.19402 6.57527 7.196-6.57527c.5733-.52393 1.443-.51915 2.01-.01262l.1092.10799c.5239.57331.5191 1.44304.0126 2.01l-.108.10918-8.2069 7.50002c-.5348.4887-1.3351.5213-1.9053.0977l-.1185-.0977-8.20691-7.50002c-.61154-.55886-.65424-1.50764-.09538-2.11918z",
+		d: "m8.60831 3.62342c0-.89747.72755-1.625 1.62499-1.625h3.25c.8974 0 1.6249.72753 1.6249 1.625l-.0733 5.37819h2.169c1.5012 0 2.1996 1.86149 1.0688 2.84899l-5.4188 4.7324c-.6123.5347-1.5256.5347-2.1378 0l-5.41894-4.7324c-1.13072-.9875-.43233-2.84899 1.06891-2.84899h2.16889zm-4.94834 15.12818c-.89747 0-1.625.7275-1.625 1.625s.72753 1.625 1.625 1.625h16.68003c.8975 0 1.625-.7275 1.625-1.625s-.7275-1.625-1.625-1.625z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/CaretLeftIcon.tsx
-const CaretLeftIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/DraggableIcon.tsx
+const DraggableIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "m16.7619 2.68582c.5733.52393.6467 1.39057.1931 2.00074l-.0977.11844-6.5753 7.194 6.5753 7.196c.5239.5733.5191 1.443.0126 2.01l-.108.1092c-.5733.5239-1.443.5191-2.01.0126l-.1092-.108-7.49998-8.2069c-.48873-.5348-.52131-1.3351-.09775-1.9053l.09775-.1185 7.49998-8.2069c.5589-.61153 1.5077-.65423 2.1192-.09538z",
+		d: "m8.4 22c-.66 0-1.225-.2448-1.695-.7344s-.705-1.0781-.705-1.7656.235-1.276.705-1.7656 1.035-.7344 1.695-.7344 1.225.2448 1.695.7344.705 1.0781.705 1.7656-.235 1.276-.705 1.7656-1.035.7344-1.695.7344zm7.2 0c-.66 0-1.225-.2448-1.695-.7344s-.705-1.0781-.705-1.7656.235-1.276.705-1.7656 1.035-.7344 1.695-.7344 1.225.2448 1.695.7344.705 1.0781.705 1.7656-.235 1.276-.705 1.7656-1.035.7344-1.695.7344zm-7.2-7.5c-.66 0-1.225-.2448-1.695-.7344s-.705-1.0781-.705-1.7656.235-1.276.705-1.7656c.47-.48961 1.035-.7344 1.695-.7344s1.225.24479 1.695.7344c.47.4896.705 1.0781.705 1.7656s-.235 1.276-.705 1.7656-1.035.7344-1.695.7344zm7.2 0c-.66 0-1.225-.2448-1.695-.7344s-.705-1.0781-.705-1.7656.235-1.276.705-1.7656c.47-.48961 1.035-.7344 1.695-.7344s1.225.24479 1.695.7344c.47.4896.705 1.0781.705 1.7656s-.235 1.276-.705 1.7656-1.035.7344-1.695.7344zm-7.2-7.5c-.66 0-1.225-.24479-1.695-.73437-.47-.48959-.705-1.07813-.705-1.76563s.235-1.27604.705-1.76562c.47-.48959 1.035-.73438 1.695-.73438s1.225.24479 1.695.73438c.47.48958.705 1.07812.705 1.76562s-.235 1.27604-.705 1.76563c-.47.48958-1.035.73437-1.695.73437zm7.2 0c-.66 0-1.225-.24479-1.695-.73437-.47-.48959-.705-1.07813-.705-1.76563s.235-1.27604.705-1.76562c.47-.48959 1.035-.73438 1.695-.73438s1.225.24479 1.695.73438c.47.48958.705 1.07812.705 1.76562s-.235 1.27604-.705 1.76563c-.47.48958-1.035.73437-1.695.73437z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/CaretRightIcon.tsx
-const CaretRightIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/EllipsisIcon.tsx
+const EllipsisIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
-		d: "m7.23808 21.3142c-.57331-.524-.64667-1.3906-.19312-2.0008l.09774-.1184 6.5753-7.194-6.57529-7.196c-.52393-.57331-.51915-1.44303-.01262-2.01l.10799-.10917c.57331-.52393 1.44303-.51915 2.01-.01262l.10917.10799 7.50005 8.2069c.4887.5348.5213 1.3351.0977 1.9053l-.0977.1185-7.50004 8.2069c-.55886.6115-1.50765.6542-2.11918.0954z",
+		d: "m6.8654 12.0577c0 1.2745-1.03319 2.3077-2.3077 2.3077s-2.3077-1.0332-2.3077-2.3077 1.03319-2.3077 2.3077-2.3077 2.3077 1.0332 2.3077 2.3077zm7.6923 0c0 1.2745-1.0331 2.3077-2.3077 2.3077-1.2745 0-2.30766-1.0332-2.30766-2.3077s1.03316-2.3077 2.30766-2.3077c1.2746 0 2.3077 1.0332 2.3077 2.3077zm5.3846 2.3077c1.2746 0 2.3077-1.0332 2.3077-2.3077s-1.0331-2.3077-2.3077-2.3077c-1.2745 0-2.3077 1.0332-2.3077 2.3077s1.0332 2.3077 2.3077 2.3077z",
 		fill: "currentColor"
 	})
 });
 //#endregion
-//#region src/components/Icon/icons/CaretUpIcon.tsx
-const CaretUpIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m21.3141 16.7619c-.5239.5733-1.3905.6467-2.0007.1931l-.1184-.0977-7.194-6.5753-7.19602 6.5753c-.57331.5239-1.44304.5191-2.01.0126l-.10918-.108c-.52393-.5733-.51915-1.443-.01261-2.01l.10798-.1092 8.20683-7.49998c.5348-.48873 1.3352-.52131 1.9054-.09775l.1184.09775 8.207 7.49998c.6115.5589.6542 1.5077.0953 2.1192z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/ChannelIcon.tsx
-const ChannelIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		clipRule: "evenodd",
-		d: "m5.64571 1.19092c-.44678-.324663-1.07216-.225666-1.39682.22112-.32466.44678-.22567 1.07215.22111 1.39682 1.28625.93467 2.48092 2.19849 3.54704 3.39817-1.62947-.00332-2.92814.02027-3.46778.08086-1.98082.22241-2.2359 1.3046-2.45624 2.97122-.22035 1.66659.01731 8.61489.2821 10.20679s1.03019 2.2578 3.23903 2.2185c1.36389-.0243 5.14395.102 8.22435.2049 1.9081.0637 3.5484.1185 4.1789.123l.0126.0001c1.6426.0116 2.973.0211 3.5839-1.2509.6125-1.2752.3643-9.5706.2662-11.15071-.0982-1.58008-.6322-2.71681-1.8871-2.99303-.4032-.08875-1.9372-.17748-3.8995-.24967.9793-1.0846 2.1361-2.34437 3.5284-3.63478.405-.37542.4291-1.00813.0536-1.41319-.3754-.405062-1.0081-.429086-1.4132-.05366-1.61 1.49224-2.9274 2.95491-3.9684 4.11064-.1937.21508-.3778.41955-.5525.61158-.0947.10407-.1859.20373-.2738.29896-.9155-.02314-1.8546-.0422-2.7663-.056-.1596-.18054-.3281-.37314-.5061-.57663l-.1089-.12441c-1.18229-1.35084-2.71275-3.08411-4.44059-4.33968zm9.86039 12.42148c-1.0777 1.4126-4.8912 3.6285-6.16234 4.3486-.19344.1108-.41451-.0277-.41451-.2493 0-1.468 0-5.9827.05527-7.4507 0-.1939.22107-.3324.4145-.2216l6.02418 3.1576c.1382.0831.1934.2769.0829.4154z",
-		fill: "currentColor",
-		fillRule: "evenodd"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CheckmarkCircleIcon.tsx
-const CheckmarkCircleIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		clipRule: "evenodd",
-		d: "m21.8158 14.5648c3.0982-10.94829-8.8224-15.41821-15.39746-10.85188-4.65388 3.23212-6.673329 10.24658-3.15895 14.34028 3.51439 4.0936 15.45811 7.4598 18.55641-3.4884zm-4.1007-5.8658c.3861-.39496.3788-1.02808-.0161-1.41413-.395-.38604-1.0281-.37882-1.4141.01613l-6.127 6.2684-2.44277-2.4992c-.38605-.3949-1.01917-.4021-1.41413-.0161-.39495.3861-.40217 1.0192-.01612 1.4141l3.15789 3.2308c.18815.1925.44596.301.71513.301.2692 0 .527-.1085.7151-.301z",
-		fill: "currentColor",
-		fillRule: "evenodd"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CheckmarkCircleOutlineIcon.tsx
-const CheckmarkCircleOutlineIcon = ({ ...props }) => /* @__PURE__ */ jsxs("svg", {
-	...props,
-	children: [/* @__PURE__ */ jsx("path", {
-		clipRule: "evenodd",
-		d: "M11.25 2.5C6.41751 2.5 2.5 6.41751 2.5 11.25C2.5 16.0825 6.41751 20 11.25 20C16.0825 20 20 16.0825 20 11.25C20 6.41751 16.0825 2.5 11.25 2.5ZM0 11.25C0 5.0368 5.0368 0 11.25 0C17.4632 0 22.5 5.0368 22.5 11.25C22.5 17.4632 17.4632 22.5 11.25 22.5C5.0368 22.5 0 17.4632 0 11.25Z",
-		fill: "currentColor",
-		fillRule: "evenodd"
-	}), /* @__PURE__ */ jsx("path", {
-		clipRule: "evenodd",
-		d: "M17.1237 7.35609C17.6174 7.83865 17.6265 8.63005 17.1439 9.12374L10.3018 16.1237C10.0666 16.3644 9.74436 16.5 9.4079 16.5C9.07143 16.5 8.74918 16.3644 8.51399 16.1237L5.35609 12.893C4.87354 12.3993 4.88256 11.6079 5.37626 11.1253C5.86995 10.6428 6.66135 10.6518 7.14391 11.1455L9.4079 13.4617L15.3561 7.37626C15.8386 6.88256 16.6301 6.87354 17.1237 7.35609Z",
-		fill: "currentColor",
-		fillRule: "evenodd"
-	})]
-});
-//#endregion
-//#region src/components/Icon/icons/CheckmarkCircleThreeQuartersIcon.tsx
-const CheckmarkCircleThreeQuartersIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m5.06066 10.1406c1.02693-3.83255 4.96634-6.10695 8.79884-5.08003.8844.23699 1.7935-.28787 2.0305-1.1723.237-.88444-.2879-1.79352-1.1723-2.0305-5.60142-1.500892-11.35896 1.82322-12.85985 7.42462-1.500884 5.60141 1.82323 11.35891 7.42463 12.85981 5.60142 1.5009 11.35892-1.8232 12.85982-7.4246.237-.8844-.2879-1.7935-1.1723-2.0305s-1.7935.2879-2.0305 1.1723c-1.0269 3.8325-4.9663 6.1069-8.7988 5.08-3.83257-1.0269-6.10696-4.9663-5.08004-8.7988zm16.57534-2.98696c.6582-.63651.6758-1.68609.0392-2.34429-.6365-.65821-1.686-.67579-2.3442-.03928l-7.5698 7.32023-2.17928-2.46975c-.60581-.68657-1.65349-.75203-2.34005-.14621-.68656.60576-.75202 1.65346-.14621 2.34006l2.94474 3.3372c.8339.9451 2.2881 1.0027 3.1942.1265z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CheckmarkIcon.tsx
-const CheckmarkIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m8.79289 18.7054-6.50001-6.5374c-.39051-.3927-.39051-1.0295 0-1.4223l1.41418-1.42238c.39051-.39279 1.02371-.39279 1.41422 0l4.37872 4.40388 9.3787-9.43263c.3905-.39276 1.0237-.39276 1.4142 0l1.4142 1.42235c.3905.39275.3905 1.02956 0 1.42235l-11.5 11.56613c-.39054.3928-1.0237.3928-1.41421 0z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CheckmarkUnderlinedIcon.tsx
-const CheckmarkUnderlinedIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "M9.54401 12.95L17.994 4.49995C18.194 4.29995 18.4315 4.19995 18.7065 4.19995C18.9815 4.19995 19.219 4.29995 19.419 4.49995C19.619 4.69995 19.719 4.93745 19.719 5.21245C19.719 5.48745 19.619 5.72495 19.419 5.92495L10.244 15.1C10.044 15.3 9.81067 15.4 9.54401 15.4C9.27734 15.4 9.04401 15.3 8.84401 15.1L4.56901 10.825C4.36901 10.625 4.27317 10.3875 4.28151 10.1125C4.28984 9.83745 4.39401 9.59995 4.59401 9.39995C4.79401 9.19995 5.03151 9.09995 5.30651 9.09995C5.58151 9.09995 5.81901 9.19995 6.01901 9.39995L9.54401 12.95ZM5.99401 19.8C5.71067 19.8 5.47317 19.7041 5.28151 19.5125C5.08984 19.3208 4.99401 19.0833 4.99401 18.8C4.99401 18.5166 5.08984 18.2791 5.28151 18.0875C5.47317 17.8958 5.71067 17.8 5.99401 17.8H17.994C18.2773 17.8 18.5148 17.8958 18.7065 18.0875C18.8982 18.2791 18.994 18.5166 18.994 18.8C18.994 19.0833 18.8982 19.3208 18.7065 19.5125C18.5148 19.7041 18.2773 19.8 17.994 19.8H5.99401Z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CloseCircleIcon.tsx
-const CloseCircleIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		clipRule: "evenodd",
-		d: "M13.8186 20.4731C4.60239 22.893 -2.98829 15.5818 3.31523 6.74072C9.6261 -2.10038 19.5705 4.8504 21.402 9.84467C23.2334 14.8389 19.0556 19.105 13.8186 20.4731Z \n       M15.0413 8.87414C15.4318 8.48355 15.4318 7.85028 15.0413 7.45969C14.6508 7.0691 14.0178 7.0691 13.6273 7.45969L11.0001 10.0878L8.37284 7.4597C7.98238 7.06911 7.34932 7.06911 6.95886 7.4597C6.5684 7.85029 6.5684 8.48356 6.95886 8.87415L9.5861 11.5023L6.95886 14.1304C6.5684 14.5209 6.5684 15.1542 6.95886 15.5448C7.34932 15.9354 7.98238 15.9354 8.37284 15.5448L11.0001 12.9167L13.6273 15.5448C14.0178 15.9354 14.6508 15.9354 15.0413 15.5448C15.4318 15.1542 15.4318 14.521 15.0413 14.1304L12.4141 11.5023L15.0413 8.87414Z",
-		fill: "currentColor",
-		fillRule: "evenodd"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CloseIcon.tsx
-const CloseIcon$1 = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m17.7742 19.618c.5091.5093 1.3347.5093 1.8439 0 .5091-.5091.5091-1.3347 0-1.8438l-5.7742-5.7742 5.7742-5.77422c.5091-.50918.5091-1.3347 0-1.84387-.5092-.50917-1.3348-.50917-1.8439 0l-5.7742 5.77419-5.77426-5.77422c-.50917-.50917-1.33469-.50917-1.84387 0-.50916.50917-.50916 1.3347 0 1.84386l5.77423 5.77426-5.77421 5.7742c-.50918.5092-.50918 1.3347 0 1.8439.50916.5092 1.33469.5092 1.84385 0l5.77426-5.7742z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CollectVideoIcon.tsx
-const CollectVideoIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		clipRule: "evenodd",
-		d: "M12 6.85714H3V4.92857C3 3.864 3.864 3 4.92857 3H8.74072C9.17014 3 9.57257 3.21471 9.81043 3.57214L12 6.85714ZM3 6.85718H19.0714C20.136 6.85718 21 7.72118 21 8.78575V13.1438C20.9149 13.1202 20.8253 13.1077 20.7328 13.1077H13.3066L14.7071 11.7071C15.0976 11.3166 15.0976 10.6834 14.7071 10.2929C14.3166 9.90237 13.6834 9.90237 13.2929 10.2929L10.2929 13.2929C10.1054 13.4804 10 13.7348 10 14C10 14.2652 10.1054 14.5196 10.2929 14.7071L13.2929 17.7071C13.6834 18.0976 14.3166 18.0976 14.7071 17.7071C15.0976 17.3166 15.0976 16.6834 14.7071 16.2929L13.5219 15.1077H20.7328C20.8253 15.1077 20.9149 15.0951 21 15.0716V17.1429C21 19.272 19.272 21 17.1429 21H6.85714C4.728 21 3 19.272 3 17.1429V6.85718Z",
-		fill: "currentColor",
-		fillRule: "evenodd"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CommentIcon.tsx
-const CommentIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		clipRule: "evenodd",
-		d: "M2.0994 10.6931C2.04002 8.22692 1.96942 5.29509 2.11584 4.25593C2.13365 4.13216 2.14292 4.01528 2.1517 3.90469C2.21613 3.09248 2.25369 2.61894 5.44865 2.23843C9.48199 1.75807 17.1241 1.99825 20.9452 3.007C21.7385 3.21574 21.7461 3.55147 21.7624 4.26645C21.7648 4.37414 21.7675 4.49044 21.773 4.6162C21.8367 5.57691 22.0066 10.2604 21.9641 11.7255C21.9538 12.0123 21.9535 12.4616 21.9532 13.001V13.001C21.9522 14.6749 21.9507 17.2153 21.6457 18.4505C21.4546 19.2671 20.0748 19.2911 18.9073 19.171C18.4972 19.1289 17.0813 19.0734 15.3164 19.0193C14.4586 19.7428 13.2551 20.8268 12.6703 21.669C12.4667 21.9623 12.1951 22 11.9708 22C11.7566 22 11.6986 21.9343 11.3756 21.5684L11.3281 21.5147C10.6506 20.7484 9.58149 19.5267 9.00085 18.8624C7.74516 18.8383 6.69432 18.8234 6.10233 18.8234C3.78846 18.8234 2.85054 18.5199 2.51089 18.1837C2.02619 17.7038 2.08219 16.014 2.13647 14.3759L2.14543 14.1031C2.16606 13.462 2.13471 12.1599 2.0994 10.6931ZM4.33635 7.16713C4.33635 7.16713 3.83065 8.24157 4.01326 8.52809C4.14949 8.74182 8.25659 8.84926 10.9526 8.91979L10.9527 8.91979C11.8709 8.94381 12.6253 8.96354 13.0036 8.98174C14.1695 9.05337 17.7376 8.83848 19.2126 8.74298C19.24 8.74161 19.2672 8.74047 19.2943 8.73935C19.7381 8.72089 20.1152 8.7052 19.943 7.69241C19.9149 7.5014 19.8166 7.38202 19.634 7.38202C19.044 7.38202 9.89913 7.38202 7.90439 7.191L7.64546 7.16615C5.81529 6.99024 4.8063 6.89326 4.33635 7.16713ZM19.8977 11.4732C20.0908 11.7527 19.6254 12.8452 19.6254 12.8452C19.166 13.1363 18.1541 13.0769 16.3186 12.9692C16.2338 12.9642 16.1473 12.9591 16.059 12.9539C14.0586 12.8372 4.92114 13.177 4.33049 13.199L4.33037 13.199C4.14788 13.2058 4.04518 13.0901 4.01001 12.9003C3.80035 11.8946 4.17656 11.8649 4.61942 11.83C4.64638 11.8278 4.67359 11.8257 4.70093 11.8233C6.17134 11.673 9.72893 11.3257 10.8967 11.3539C11.2754 11.3581 12.0301 11.3498 12.9486 11.3396C15.6454 11.3099 19.7536 11.2646 19.8977 11.4732Z",
-		fill: "currentColor",
-		fillRule: "evenodd"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CommunityIcon.tsx
-const CommunityIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m14.8307 3.14077c.3645.16757.686.31534.9541.40981l.0186.00652c1.2355.43528 5.3747 1.89346 6.0303 4.36204.5612 2.11356-.3999 4.17296-1.3677 6.24656-.1682.3606-.3367.7217-.4975 1.0835-.0379.0854-.0756.1704-.1132.255-1.4657 3.3022-2.6018 5.8617-4.6582 6.3731-2.1092.5247-5.1606-.7312-7.71054-1.9147-.05102-.0244-.10251-.0491-.15441-.0738-1.99154-.951-4.60465-2.1987-5.20489-4.1987-.61588-2.0523 1.14517-6.02627 2.25161-7.92519.20562-.35289.40011-.72469.59807-1.10314.86724-1.65795 1.80113-3.44328 4.02973-4.32392 2.19233-.86633 4.35703.12865 5.82403.80292zm-2.2269 2.13686c-.5027-.24679-1.1143-.04716-1.366.44591l-.6538 1.281-1.30983-.64294c-.50277-.24679-1.11436-.04714-1.36603.44591-.25167.49306-.04812 1.09282.45465 1.33961l1.3098.64293-1.50554 2.94955-1.44199-.7078c-.50276-.2468-1.11435-.0471-1.36602.4459-.25167.4931-.04812 1.0928.45465 1.3396l1.44198.7078-.77998 1.5281c-.25167.4931-.04812 1.0929.45464 1.3396.50277.2468 1.11436.0472 1.36603-.4459l.77999-1.5281 2.98935 1.4674-.7622 1.4931c-.2517.4931-.0481 1.0929.4547 1.3397.5027.2467 1.1143.0471 1.366-.446l.7622-1.4931 1.4413.7075c.5028.2468 1.1144.0471 1.366-.446.2517-.4929.0482-1.0928-.4546-1.3396l-1.4414-.7074 1.5055-2.9496 1.5735.7724c.5028.2468 1.1144.0472 1.3661-.4459.2516-.4931.0481-1.0928-.4546-1.3396l-1.5736-.7724.6717-1.31597c.2518-.49306.0482-1.09282-.4546-1.33961-.5027-.24679-1.1143-.04715-1.366.4459l-.6718 1.31598-2.9892-1.46736.6538-1.281c.2517-.49306.0481-1.09283-.4547-1.33961zm1.8788 5.87347-1.5055 2.9496-2.98937-1.4674 1.50557-2.94954z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/ContactUsIcon.tsx
-const ContactUsIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m2 7.13053c1.02794.75462 2.30848 1.82137 3.61006 2.90567 0 0 5.06424 3.9629 5.81564 3.9629 1.8549 0 3.7992-1.8146 5.1678-2.8746 1.3176-1.0205 2.7467-2.21282 4.0625-3.31055.1651-.13774.3285-.27408.4895-.40831-.0011.22999.0035.44719.0315.64131.3947 2.63975.4326 8.17435 0 11.09695-.3145.4144-.8493.9882-3.0513.8288s-11.82778-.2869-12.92877-.2231c-1.101.0637-2.39073-.0638-2.61093-1.1158-.40264-1.7682-.5511-8.74247-.586-11.50327zm16.4311-2.99936c1.2812.09529 1.9619.48357 2.322 1.00077-.4574.37757-.9338.77506-1.4207 1.18138-1.2989 1.0838-2.6732 2.23056-3.9636 3.22999-.9655.74789-1.8517 1.38729-2.5896 1.83539-.3691.2242-.6815.3884-.9342.4939-.2367.0989-.3632.1358-.5917.0084-.2306-.1286-.5322-.3283-.8998-.5958-.73248-.5331-1.63926-1.2708-2.61739-2.08202-.26991-.22385-.54604-.45404-.8253-.68686-.21657-.18055-.43504-.36268-.65398-.54466l-.65679-.54374c-1.20143-.98965-2.37365-1.92213-3.27827-2.50838.22838-.42619.59195-.78832 1.14091-.78831 1.57531.00002 3.21902-.03191 4.885-.06428 3.39902-.06604 6.89072-.13388 10.08342.06422z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CopyDisabledIcon.tsx
-const CopyDisabledIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m23.7071 1.70711c.3905-.39053.3905-1.023692 0-1.414217-.3905-.3905241-1.0237-.3905241-1.4142 0l-22.000007 22.000007c-.3905238.3905-.3905242 1.0237 0 1.4142.390524.3905 1.023687.3905 1.414217 0zm-5.0845.29289c.1737 0 .3443.01298.5109.03803l-3.3066 3.30661h-8.21351c-.93263 0-1.68869-.74873-1.68869-1.67232 0-.92361.75606-1.67232 1.68869-1.67232zm-14.9339 4.94911h10.5338l-12.2225 12.22249v-10.55017c0-.92359.75605-1.67232 1.6887-1.67232zm13.5095 2.68113-12.36977 12.36976h10.68107c.9327 0 1.6887-.7487 1.6887-1.6723zm4.7671-4.76707-3.3427 3.34265v8.10658c0 .9235.756 1.6724 1.6887 1.6724s1.6887-.7489 1.6887-1.6724v-10.96776c0-.1635-.0118-.32425-.0347-.48147z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CopyIcon.tsx
-const CopyIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m18.6226 16.3124c0 .9235.756 1.6724 1.6887 1.6724s1.6887-.7489 1.6887-1.6724v-10.96776c0-1.8472-1.5122-3.34464-3.3774-3.34464h-11.00921c-.93263 0-1.68869.74871-1.68869 1.67232 0 .92359.75606 1.67232 1.68869 1.67232h11.00921zm-3.1131 5.6876c.9327 0 1.6887-.7487 1.6887-1.6723v-11.70627c0-.92359-.756-1.67232-1.6887-1.67232h-11.8208c-.93265 0-1.6887.74873-1.6887 1.67232v11.70627c0 .9236.75605 1.6723 1.6887 1.6723z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/CreateIcon.tsx
-const CreateIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m10.3966 3.60341c0-.88553.7179-1.60341 1.6034-1.60341s1.6034.71788 1.6034 1.60341v6.79319h6.7932c.8856 0 1.6034.7179 1.6034 1.6034 0 .8856-.7178 1.6034-1.6034 1.6034h-6.7932v6.7932c0 .8856-.7179 1.6034-1.6034 1.6034s-1.6034-.7178-1.6034-1.6034v-6.7932h-6.7932c-.88554 0-1.6034-.7178-1.6034-1.6034 0-.8855.71786-1.6034 1.6034-1.6034h6.7932z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/DeleteIcon.tsx
-const DeleteIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m14.904 2.36857c.6808.18014 1.0637 1.89327 1.3326 3.11843 1.0626.02303 2.1802.06975 3.3652.15126.5509.0379.9669.51528.929 1.06626-.0379.55099-.5153.96692-1.0663.92902-3.2573-.22405-5.9961-.17824-8.5308-.1036-.3474.01023-.6918.02104-1.03385.03178-2.1416.06726-4.18778.13153-6.28166.02989-.55163-.02678-.97711-.49568-.95034-1.04731.02678-.55164.49568-.97712 1.04731-.95034 1.04212.05058 2.0709.0584 3.11959.04482.08961-.94493.83902-2.66045 1.49748-3.27021.72917-.67525 5.56337-.2668 6.57177 0zm-8.53971 18.93913c-.38411-1.7907-1.43613-8.7724-1.60784-10.1112-.01239-.0967-.02523-.1887-.03746-.2764-.1573-1.12763-.21516-1.5424 2.05023-1.84784 2.71293-.36579 9.32588-.45722 11.89608.31093.5336.15895.5387.4146.5496.95901.0017.082.0035.1706.0072.2664 0 2.8358-.6932 5.8331-1.3554 8.6963-.1564.6763-.3112 1.3453-.4546 2.0028-.1285.6219-1.0566.6401-1.842.5487-.7853-.0915-5.4362-.2926-6.99265-.2926-1.55635 0-1.98471 0-2.21316-.2561zm8.97891-9.2246c-.0298-.5515-.501-.9744-1.0525-.9446s-.9744.501-.9446 1.0525c.0309.5711-.027 1.5863-.123 2.7715-.0544.6721-.1166 1.3496-.1763 2.0013-.0459.5008-.0905.9868-.1291 1.4427-.0465.5504.3619 1.0342.9122 1.0807.5503.0466 1.0342-.3618 1.0807-.9122.0351-.4152.0789-.8939.1249-1.3962l.0002-.0017.0001-.0015c.0616-.6734.1271-1.3892.1808-2.0516.094-1.1611.166-2.312.1266-3.0409zm-5.56465 7.4093c.55025.0479 1.03505-.3594 1.08295-.9096.0632-.7272.0291-1.8798-.0269-3.0434-.0319-.6643-.0739-1.3823-.1135-2.0578-.0295-.504-.0576-.985-.0791-1.4014-.0285-.5516-.4987-.9756-1.05025-.9472-.55156.0285-.97562.4987-.94716 1.0502.02358.4571.05217.944.08167 1.4462.03835.653.07827 1.3328.11063 2.006.0571 1.1878.08163 2.2042.03206 2.7741-.04786.5502.3594 1.035.9096 1.0829z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/DeleteSmIcon.tsx
-const DeleteSmIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsxs("g", {
-		fill: "currentColor",
-		children: [/* @__PURE__ */ jsx("path", { d: "m9.05042 2c-.64391 0-1.23256.35667-1.52052.92132l-1.23015 2.41201h-1.59974c-.9389 0-1.70001.74619-1.70001 1.66667 0 .92047.76111 1.66667 1.70001 1.66667h14.59999c.9389 0 1.7-.7462 1.7-1.66667 0-.92048-.7611-1.66667-1.7-1.66667h-1.8003l-1.2301-2.41201c-.288-.56465-.8765-.92132-1.5205-.92132z" }), /* @__PURE__ */ jsx("path", { d: "m6.63212 10c-.9389 0-1.63212.7462-1.63212 1.6667v8.8333c0 .9205.36086 1.5 1.29975 1.5h11.19995c.9389 0 1.5003-.5795 1.5003-1.5l-.1-8.8333c0-.9205-.4611-1.6667-1.4-1.6667z" })]
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/DottieClockIcon.tsx
-const DottieClockIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		clipRule: "evenodd",
-		d: "M10 18.8889C9.54004 18.8889 9.16671 18.5155 9.16671 18.0555C9.16671 17.5955 9.54004 17.2222 10 17.2222C13.9823 17.2222 17.2223 13.9822 17.2223 9.99997C17.2223 6.01775 13.9823 2.77775 10 2.77775C9.54004 2.77775 9.16671 2.40442 9.16671 1.94442C9.16671 1.48442 9.54004 1.11108 10 1.11108C14.9012 1.11108 18.8889 5.09886 18.8889 9.99997C18.8889 14.9011 14.9012 18.8889 10 18.8889ZM13.61 13.3333C13.4478 13.3333 13.2812 13.2855 13.1367 13.1855L9.5256 10.6855C9.30115 10.53 9.16671 10.2733 9.16671 9.99997V5.27775C9.16671 4.81775 9.54004 4.44442 10 4.44442C10.46 4.44442 10.8334 4.81775 10.8334 5.27775V9.56331L14.0856 11.8144C14.4645 12.0766 14.5589 12.5955 14.2956 12.9733C14.1334 13.2066 13.8745 13.3322 13.61 13.3322V13.3333ZM5.13676 15.6966C5.13676 16.1568 4.76366 16.5299 4.30343 16.5299C3.84319 16.5299 3.47009 16.1568 3.47009 15.6966C3.47009 15.2363 3.84319 14.8632 4.30343 14.8632C4.76366 14.8632 5.13676 15.2363 5.13676 15.6966ZM1.94442 10.8333C2.40465 10.8333 2.77775 10.4602 2.77775 9.99994C2.77775 9.5397 2.40465 9.16661 1.94442 9.16661C1.48418 9.16661 1.11108 9.5397 1.11108 9.99994C1.11108 10.4602 1.48418 10.8333 1.94442 10.8333ZM5.13676 4.30332C5.13676 4.76356 4.76366 5.13666 4.30343 5.13666C3.84319 5.13666 3.47009 4.76356 3.47009 4.30332C3.47009 3.84309 3.84319 3.46999 4.30343 3.46999C4.76366 3.46999 5.13676 3.84309 5.13676 4.30332ZM6.91777 18.2755C7.378 18.2755 7.7511 17.9024 7.7511 17.4422C7.7511 16.9819 7.378 16.6088 6.91777 16.6088C6.45753 16.6088 6.08443 16.9819 6.08443 17.4422C6.08443 17.9024 6.45753 18.2755 6.91777 18.2755ZM3.39115 13.0822C3.39115 13.5425 3.01806 13.9155 2.55782 13.9155C2.09758 13.9155 1.72449 13.5425 1.72449 13.0822C1.72449 12.622 2.09758 12.2489 2.55782 12.2489C3.01806 12.2489 3.39115 12.622 3.39115 13.0822ZM2.55782 7.751C3.01806 7.751 3.39115 7.3779 3.39115 6.91766C3.39115 6.45743 3.01806 6.08433 2.55782 6.08433C2.09758 6.08433 1.72449 6.45743 1.72449 6.91766C1.72449 7.3779 2.09758 7.751 2.55782 7.751ZM7.7511 2.55772C7.7511 3.01796 7.378 3.39105 6.91777 3.39105C6.45753 3.39105 6.08443 3.01796 6.08443 2.55772C6.08443 2.09748 6.45753 1.72439 6.91777 1.72439C7.378 1.72439 7.7511 2.09748 7.7511 2.55772Z",
-		fill: "currentColor",
-		fillRule: "evenodd"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/DownloadIcon.tsx
-const DownloadIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m8.60831 3.62342c0-.89747.72755-1.625 1.62499-1.625h3.25c.8974 0 1.6249.72753 1.6249 1.625l-.0733 5.37819h2.169c1.5012 0 2.1996 1.86149 1.0688 2.84899l-5.4188 4.7324c-.6123.5347-1.5256.5347-2.1378 0l-5.41894-4.7324c-1.13072-.9875-.43233-2.84899 1.06891-2.84899h2.16889zm-4.94834 15.12818c-.89747 0-1.625.7275-1.625 1.625s.72753 1.625 1.625 1.625h16.68003c.8975 0 1.625-.7275 1.625-1.625s-.7275-1.625-1.625-1.625z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/DraggableIcon.tsx
-const DraggableIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m8.4 22c-.66 0-1.225-.2448-1.695-.7344s-.705-1.0781-.705-1.7656.235-1.276.705-1.7656 1.035-.7344 1.695-.7344 1.225.2448 1.695.7344.705 1.0781.705 1.7656-.235 1.276-.705 1.7656-1.035.7344-1.695.7344zm7.2 0c-.66 0-1.225-.2448-1.695-.7344s-.705-1.0781-.705-1.7656.235-1.276.705-1.7656 1.035-.7344 1.695-.7344 1.225.2448 1.695.7344.705 1.0781.705 1.7656-.235 1.276-.705 1.7656-1.035.7344-1.695.7344zm-7.2-7.5c-.66 0-1.225-.2448-1.695-.7344s-.705-1.0781-.705-1.7656.235-1.276.705-1.7656c.47-.48961 1.035-.7344 1.695-.7344s1.225.24479 1.695.7344c.47.4896.705 1.0781.705 1.7656s-.235 1.276-.705 1.7656-1.035.7344-1.695.7344zm7.2 0c-.66 0-1.225-.2448-1.695-.7344s-.705-1.0781-.705-1.7656.235-1.276.705-1.7656c.47-.48961 1.035-.7344 1.695-.7344s1.225.24479 1.695.7344c.47.4896.705 1.0781.705 1.7656s-.235 1.276-.705 1.7656-1.035.7344-1.695.7344zm-7.2-7.5c-.66 0-1.225-.24479-1.695-.73437-.47-.48959-.705-1.07813-.705-1.76563s.235-1.27604.705-1.76562c.47-.48959 1.035-.73438 1.695-.73438s1.225.24479 1.695.73438c.47.48958.705 1.07812.705 1.76562s-.235 1.27604-.705 1.76563c-.47.48958-1.035.73437-1.695.73437zm7.2 0c-.66 0-1.225-.24479-1.695-.73437-.47-.48959-.705-1.07813-.705-1.76563s.235-1.27604.705-1.76562c.47-.48959 1.035-.73438 1.695-.73438s1.225.24479 1.695.73438c.47.48958.705 1.07812.705 1.76562s-.235 1.27604-.705 1.76563c-.47.48958-1.035.73437-1.695.73437z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/EllipsisIcon.tsx
-const EllipsisIcon = (props) => /* @__PURE__ */ jsx("svg", {
-	...props,
-	children: /* @__PURE__ */ jsx("path", {
-		d: "m6.8654 12.0577c0 1.2745-1.03319 2.3077-2.3077 2.3077s-2.3077-1.0332-2.3077-2.3077 1.03319-2.3077 2.3077-2.3077 2.3077 1.0332 2.3077 2.3077zm7.6923 0c0 1.2745-1.0331 2.3077-2.3077 2.3077-1.2745 0-2.30766-1.0332-2.30766-2.3077s1.03316-2.3077 2.30766-2.3077c1.2746 0 2.3077 1.0332 2.3077 2.3077zm5.3846 2.3077c1.2746 0 2.3077-1.0332 2.3077-2.3077s-1.0331-2.3077-2.3077-2.3077c-1.2745 0-2.3077 1.0332-2.3077 2.3077s1.0332 2.3077 2.3077 2.3077z",
-		fill: "currentColor"
-	})
-});
-//#endregion
-//#region src/components/Icon/icons/EllipsisVerticalIcon.tsx
-const EllipsisVerticalIcon = (props) => /* @__PURE__ */ jsx("svg", {
+//#region src/components/Icon/icons/EllipsisVerticalIcon.tsx
+const EllipsisVerticalIcon = (props) => /* @__PURE__ */ jsx("svg", {
 	...props,
 	children: /* @__PURE__ */ jsx("path", {
 		d: "m12.25 6.67311c-1.2745 0-2.30769-1.03319-2.30769-2.30771 0-1.27451 1.03319-2.3077 2.30769-2.3077s2.3077 1.03319 2.3077 2.3077c0 1.27452-1.0332 2.30771-2.3077 2.30771zm0 7.69229c-1.2745 0-2.30769-1.0331-2.30769-2.3077 0-1.2745 1.03319-2.30766 2.30769-2.30766s2.3077 1.03316 2.3077 2.30766c0 1.2746-1.0332 2.3077-2.3077 2.3077zm-2.30769 5.3846c0 1.2746 1.03319 2.3077 2.30769 2.3077s2.3077-1.0331 2.3077-2.3077c0-1.2745-1.0332-2.3077-2.3077-2.3077s-2.30769 1.0332-2.30769 2.3077z",
@@ -3398,522 +2560,90 @@ const GlobalStyle$1 = createGlobalStyle`
     ========================================================================== */
 
   /*
-  * Add the correct display in Edge, IE 10+, and Firefox.
-  */
-
-  details {
-    display: block;
-  }
-
-  /*
-  * Add the correct display in all browsers.
-  */
-
-  summary {
-    display: list-item;
-  }
-
-  /* Misc
-    ========================================================================== */
-
-  /**
-  * Add the correct display in IE 10+.
-  */
-
-  template {
-    display: none;
-  }
-
-  /**
-  * Add the correct display in IE 10.
-  */
-
-  [hidden] {
-    display: none;
-  }
-`}
-  ${css`
-  /**
-  * 1. Change from 'content-box' so that 'width' calculations are unaffected by 'padding' or 'border'
-  * 2. Ensure the iOS tap highlight is transparent
-  */
-  html {
-    box-sizing: border-box; /* 1 */
-    -webkit-tap-highlight-color: rgb(0 0 0 / 0%); /* 2 */
-  }
-
-  /**
-  * 1. See: https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/
-  */
-  *,
-  *::before,
-  *::after {
-    box-sizing: inherit; /* 1 */
-  }
-
-  /**
-  * 1. Without this fonts are too heavy weight in OS X Firefox
-  * 2. Design decision
-  * 3. Preferable for the body to fill viewport, even when empty
-  */
-  body {
-    -moz-osx-font-smoothing: grayscale; /* 1 */
-    -webkit-font-smoothing: antialiased; /* 2 */
-    color: ${({ theme }) => theme.color.grey900};
-    font-family: ${({ theme }) => theme.font.family.default};
-    font-size: ${({ theme }) => theme.font.size.default};
-    font-weight: ${({ theme }) => theme.font.weight.regular};
-    line-height: 1.5;
-    min-height: 100vh; /* 3 */
-  }
-`}
-`;
-//#endregion
-//#region src/providers/VHSProvider.tsx
-const VHSProvider = ({ children, theme = {}, globalStylesIncluded = true, skipAnimations = false, Link }) => {
-	return /* @__PURE__ */ jsxs(VHSThemeProvider, {
-		theme,
-		children: [globalStylesIncluded ? /* @__PURE__ */ jsx(GlobalStyle$1, {}) : null, /* @__PURE__ */ jsx(LiveAnnouncer, { children: /* @__PURE__ */ jsx(MotionConfig, {
-			reducedMotion: skipAnimations ? "always" : "user",
-			children: /* @__PURE__ */ jsx(WrapperProvider, {
-				value: { Link },
-				children: /* @__PURE__ */ jsx(ModalProvider, { children: /* @__PURE__ */ jsx(ToastProvider, { children }) })
-			})
-		}) })]
-	});
-};
-//#endregion
-//#region src/hooks/useBoolean/useBoolean.ts
-const useBoolean = (initialValue = false) => {
-	const [value, setValue] = useState(initialValue);
-	return [
-		value,
-		useCallback(() => setValue((val) => !val), []),
-		useCallback(() => setValue(true), []),
-		useCallback(() => setValue(false), []),
-		setValue
-	];
-};
-//#endregion
-//#region src/private/hooks/useTimedToggle/useTimedToggle.ts
-const useTimedToggle = (initialValue) => {
-	const [value, setValue] = useState(false);
-	const timeoutRef = useRef(void 0);
-	const initialValueRef = useRef(initialValue);
-	const toggleValue = (timeout) => {
-		clearTimeout(timeoutRef.current);
-		setValue(!initialValueRef.current);
-		timeoutRef.current = window.setTimeout(() => setValue(initialValueRef.current), timeout);
-	};
-	useEffect(() => () => clearTimeout(timeoutRef.current), []);
-	return [value, toggleValue];
-};
-//#endregion
-//#region src/hooks/useClipboard/useClipboard.ts
-const useClipboard = (textToCopy, timeout = 1500) => {
-	const [hasCopied, toggleHasCopied] = useTimedToggle(false);
-	const [failedToCopy, toggleFailedToCopy] = useTimedToggle(false);
-	return [
-		useCallback(async () => {
-			try {
-				await copyToClipboard(textToCopy);
-				if (timeout && timeout > 0) toggleHasCopied(timeout);
-			} catch (error) {
-				if (error instanceof Error) toggleFailedToCopy(timeout);
-			}
-		}, [
-			textToCopy,
-			timeout,
-			toggleHasCopied,
-			toggleFailedToCopy
-		]),
-		hasCopied,
-		failedToCopy
-	];
-};
-//#endregion
-//#region src/hooks/useElementObserver/useElementObserver.ts
-const initialRect = {
-	width: 0,
-	height: 0,
-	top: 0,
-	left: 0,
-	bottom: 0,
-	right: 0,
-	x: 0,
-	y: 0
-};
-const useElementObserver = () => {
-	const ref = useRef(null);
-	const [rect, setRect] = useState(initialRect);
-	useLayoutEffect(() => {
-		if (!ref.current) return;
-		const observer = new window.ResizeObserver((entries) => {
-			if (entries[0]) {
-				const { width, height, top, left, bottom, right, x, y } = entries[0].contentRect;
-				setRect({
-					width,
-					height,
-					top,
-					left,
-					bottom,
-					right,
-					x,
-					y
-				});
-			}
-		});
-		observer.observe(ref.current);
-		return () => {
-			observer.disconnect();
-		};
-	}, []);
-	return [ref, rect];
-};
-//#endregion
-//#region src/hooks/useEvent/useEvent.ts
-const isEventTargetSupported = (eventTarget) => Boolean(typeof eventTarget === "object" && eventTarget?.addEventListener);
-const useEvent = (eventName, eventHandler, eventTarget = window, eventOptions = {}) => {
-	const savedEventHandler = useRef(void 0);
-	const savedEventOptions = useRef(void 0);
-	useEffect(() => {
-		savedEventHandler.current = eventHandler;
-	}, [eventHandler]);
-	useEffect(() => {
-		savedEventOptions.current = eventOptions;
-	}, [eventOptions]);
-	useEffect(() => {
-		if (!eventName || !isEventTargetSupported(eventTarget)) return;
-		const eventListener = (event) => {
-			if (savedEventHandler.current !== void 0) return savedEventHandler.current(event);
-			return () => {};
-		};
-		eventTarget.addEventListener(eventName, eventListener, savedEventOptions.current);
-		return () => {
-			eventTarget.removeEventListener(eventName, eventListener, savedEventOptions.current);
-		};
-	}, [
-		eventName,
-		eventTarget,
-		savedEventOptions
-	]);
-};
-//#endregion
-//#region src/hooks/useFocusTrap/helpers.ts
-const FOCUSABLE_ELEMENT_SELECTORS = "a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, [tabindex=\"0\"], [contenteditable]";
-const isHiddenElement = (element) => {
-	const { display, visibility } = window.getComputedStyle(element);
-	const isHidden = display === "none" || element.style.display === "none" || visibility === "none" || element.style.visibility === "hidden";
-	return element.offsetWidth <= 0 && element.offsetHeight <= 0 || isHidden;
-};
-const isVisibleElement = (element) => {
-	let parentElement = element;
-	while (parentElement) {
-		if (parentElement === document.body) break;
-		if (isHiddenElement(parentElement)) return false;
-		parentElement = parentElement.parentNode;
-	}
-	return true;
-};
-const getElementTabIndex = (element) => {
-	const tabIndex = element.getAttribute("tabindex");
-	return Number.parseInt(tabIndex ?? void 0, 10);
-};
-const isTabIndexNaN = (element) => {
-	const tabIndex = getElementTabIndex(element);
-	return Number.isNaN(tabIndex);
-};
-const isFocusableElement = (element) => {
-	const tabbableNodeRegEx = /input|select|textarea|button|object/;
-	const nodeName = element.nodeName.toLowerCase();
-	const isTabIndexNotNaN = !isTabIndexNaN(element);
-	const isFocusable = tabbableNodeRegEx.test(nodeName) && !element.disabled || (element instanceof HTMLAnchorElement ? element.href || isTabIndexNotNaN : isTabIndexNotNaN);
-	return Boolean(isFocusable) && isVisibleElement(element);
-};
-const isTabbableElement = (element) => {
-	const tabIndex = getElementTabIndex(element);
-	return (isTabIndexNaN(element) || tabIndex >= 0) && isFocusableElement(element);
-};
-const findTabbableDescendants = (element) => Array.from(element.querySelectorAll(FOCUSABLE_ELEMENT_SELECTORS)).filter(isTabbableElement);
-const focusLaterElements = [];
-let focusElement = null;
-let needToFocus = false;
-const handleBlur = () => {
-	needToFocus = true;
-};
-const handleFocus = () => {
-	if (needToFocus) {
-		needToFocus = false;
-		if (!focusElement) return;
-		if (focusElement.contains(document.activeElement)) return;
-		(findTabbableDescendants(focusElement)[0] ?? focusElement).focus();
-	}
-};
-const markForFocusLater = () => {
-	const element = document.activeElement;
-	if (element !== null) focusLaterElements.push(element);
-};
-const returnFocus = () => {
-	let toFocus = null;
-	try {
-		toFocus = focusLaterElements.pop();
-		if (toFocus) toFocus.focus();
-	} catch {
-		console.warn(`You tried to return focus to ${coerceToString(toFocus)} but it is not in the DOM anymore`);
-	}
-};
-const setupScopedFocus = (element) => {
-	focusElement = element;
-	document.addEventListener("focusout", handleBlur, false);
-	document.addEventListener("focusin", handleFocus, true);
-};
-const teardownScopedFocus = () => {
-	focusElement = null;
-	document.removeEventListener("focusout", handleBlur);
-	document.removeEventListener("focusin", handleFocus);
-};
-const scopeTab = (node, event) => {
-	const tabbable = findTabbableDescendants(node);
-	if (!tabbable.length) {
-		event.preventDefault();
-		return;
-	}
-	if (!(tabbable[event.shiftKey ? 0 : tabbable.length - 1] === document.activeElement || node === document.activeElement)) return;
-	event.preventDefault();
-	const target = tabbable[event.shiftKey ? tabbable.length - 1 : 0];
-	if (target) target.focus();
-};
-const createAriaHider = (containerNode, selector) => {
-	selector ??= "body > :not(script)";
-	const rootNodes = Array.from(document.querySelectorAll(selector)).map((node) => {
-		if (node.contains(containerNode)) return;
-		const ariaHidden = node.getAttribute("aria-hidden");
-		if (ariaHidden === null || ariaHidden === "false") node.setAttribute("aria-hidden", "true");
-		return {
-			node,
-			ariaHidden
-		};
-	});
-	return () => {
-		rootNodes.forEach((item) => {
-			if (!item) return;
-			if (item.ariaHidden === null) item.node.removeAttribute("aria-hidden");
-			else item.node.setAttribute("aria-hidden", item.ariaHidden);
-		});
-	};
-};
-//#endregion
-//#region src/hooks/useFocusTrap/useFocusTrap.ts
-const isRef = (val) => {
-	return val !== null && typeof val === "object" && "current" in val;
-};
-const useFocusTrap = (active = true, options = {}) => {
-	const ref = useRef(null);
-	const restoreAriaRef = useRef(null);
-	const setRef = useCallback((node) => {
-		if (restoreAriaRef.current !== null) restoreAriaRef.current();
-		if (ref.current) {
-			returnFocus();
-			teardownScopedFocus();
-		}
-		if (active && node !== null && node !== void 0) {
-			setupScopedFocus(node);
-			markForFocusLater();
-			const processNode = (node2) => {
-				restoreAriaRef.current = !(options.disableAriaHider ?? false) ? createAriaHider(node2) : null;
-				let focusElement = null;
-				if (isNotUndefined(options.focusSelector)) if (isRef(options.focusSelector)) focusElement = options.focusSelector.current;
-				else focusElement = typeof options.focusSelector === "string" ? node2.querySelector(options.focusSelector) : options.focusSelector;
-				if (!focusElement) {
-					const children = Array.from(node2.querySelectorAll(FOCUSABLE_ELEMENT_SELECTORS));
-					focusElement = children.find(isTabbableElement) ?? children.find(isFocusableElement) ?? null;
-					if (!focusElement && isFocusableElement(node2)) focusElement = node2;
-				}
-				if (focusElement) focusElement.focus();
-				if (!focusElement) console.warn("[useFocusTrap]: Failed to find a focusable element after activating the focus trap. Make sure to include at an element that can recieve focus. As a fallback, you can also set \"tabIndex={-1}\" on the focus trap node.", node2);
-			};
-			setTimeout(() => {
-				if (node.ownerDocument) processNode(node);
-				if (!node.ownerDocument) console.warn("[useFocusTrap]: The focus trap is not part of the DOM yet, so it is unable to correctly set focus. Make sure to render the ref node.", node);
-			});
-			ref.current = node;
-		} else ref.current = null;
-	}, [
-		active,
-		options.focusSelector,
-		options.disableAriaHider
-	]);
-	useEffect(() => {
-		if (!active) return;
-		const handleKeyDown = (event) => {
-			if (event.key === "Tab" && ref.current) scopeTab(ref.current, event);
-		};
-		document.addEventListener("keydown", handleKeyDown);
-		return () => {
-			document.removeEventListener("keydown", handleKeyDown);
-		};
-	}, [active]);
-	return setRef;
-};
-//#endregion
-//#region src/hooks/useForceUpdate/useForceUpdate.ts
-const useForceUpdate = () => {
-	const [, dispatch] = useState(Object.create(null));
-	return useCallback(() => {
-		dispatch(Object.create(null));
-	}, [dispatch]);
-};
-//#endregion
-//#region src/hooks/useIsHovered/useIsHovered.ts
-const useIsHovered = () => {
-	const [isHovered, setIsHovered] = useState(false);
-	const onFocus = () => setIsHovered(true);
-	const onMouseEnter = () => setIsHovered(true);
-	const onMouseMove = () => setIsHovered(true);
-	const onBlur = () => setIsHovered(false);
-	const onMouseLeave = () => setIsHovered(false);
-	const hoverProps = {
-		onFocus,
-		onMouseEnter,
-		onBlur,
-		onMouseLeave
-	};
-	if (!isHovered) hoverProps.onMouseMove = onMouseMove;
-	return [
-		isHovered,
-		hoverProps,
-		setIsHovered
-	];
-};
-//#endregion
-//#region src/hooks/useKey/useKey.ts
-const createKeyPredicate = (keyFilter) => {
-	if (typeof keyFilter === "function") return keyFilter;
-	if (typeof keyFilter === "string") return (event) => event.key === keyFilter;
-	if (keyFilter !== null && keyFilter !== void 0 && keyFilter) return () => true;
-	return () => false;
-};
-const useKey = (key, eventHandler, options = {}, dependencies = [key]) => {
-	const { eventName = "keydown", eventTarget, eventOptions } = options;
-	useEvent(eventName, useMemo(() => {
-		const predicate = createKeyPredicate(key);
-		return (handlerEvent) => {
-			if ([
-				"INPUT",
-				"TEXTAREA",
-				"SELECT"
-			].includes(document.activeElement?.nodeName ?? "") || document.activeElement?.isContentEditable) return;
-			if (predicate(handlerEvent)) return eventHandler(handlerEvent);
-		};
-	}, dependencies), eventTarget, eventOptions);
-};
-//#endregion
-//#region src/hooks/useKeyPress/useKeyPress.ts
-const useKeyPress = (keyFilter) => {
-	const [state, setState] = useState([false, null]);
-	useKey(keyFilter, (event) => setState([true, event]), { eventName: "keydown" }, [state]);
-	useKey(keyFilter, (event) => setState([false, event]), { eventName: "keyup" }, [state]);
-	return state;
-};
-//#endregion
-//#region src/private/hooks/useUpdateEffect/useUpdateEffect.ts
-const useUpdateEffect = (effect, dependencies) => {
-	const isInitialMount = useRef(true);
-	useEffect(() => {
-		if (isInitialMount.current) {
-			isInitialMount.current = false;
-			return () => {};
-		}
-		return effect();
-	}, dependencies);
-};
-//#endregion
-//#region src/hooks/useKeyPressOnce/useKeyPressOnce.ts
-const useKeyPressOnce = (key, keydownHandler, keyupHandler) => {
-	const [pressed, event] = useKeyPress(key);
-	useUpdateEffect(() => {
-		if (!pressed && keyupHandler && event !== null) keyupHandler(event);
-		else if (pressed && keydownHandler && event !== null) keydownHandler(event);
-		return () => {};
-	}, [pressed]);
-};
-//#endregion
-//#region src/hooks/useLocalStorage/useLocalStorage.ts
-const useLocalStorage = (key, initialValue, storage = window.localStorage) => {
-	const [storedValue, setStoredValue] = useState(() => {
-		try {
-			const item = storage.getItem(key);
-			return item !== null && Boolean(item) ? JSON.parse(item) : initialValue;
-		} catch (error) {
-			console.log(error);
-			return initialValue;
-		}
-	});
-	const setValue = (value) => {
-		try {
-			const valueToStore = value instanceof Function ? value(storedValue) : value;
-			setStoredValue(valueToStore);
-			storage.setItem(key, JSON.stringify(valueToStore));
-		} catch (error) {
-			console.error(error);
-		}
-	};
-	const removeValue = () => {
-		storage.removeItem(key);
-		setStoredValue(void 0);
-	};
-	return [
-		storedValue,
-		setValue,
-		removeValue
-	];
-};
-//#endregion
-//#region src/hooks/useMergedRefs/useMergedRefs.ts
-const useMergedRefs = (refs) => (element) => {
-	refs.forEach((ref) => {
-		if (typeof ref === "function") ref(element);
-		else if (ref != null) ref.current = element;
-	});
-};
-//#endregion
-//#region src/hooks/useOnClickOutside/useOnClickOutside.ts
-const useOnClickOutside = (ref, handler) => {
-	useEffect(() => {
-		const listener = (event) => {
-			if (!ref.current || ref.current.contains(event.target)) return;
-			handler(event);
-		};
-		document.addEventListener("mousedown", listener);
-		document.addEventListener("touchstart", listener);
-		return () => {
-			document.removeEventListener("mousedown", listener);
-			document.removeEventListener("touchstart", listener);
-		};
-	}, [ref, handler]);
-};
-//#endregion
-//#region src/hooks/usePreventScroll/usePreventScroll.ts
-const usePreventScroll = (locked) => {
-	useLayoutEffect(() => {
-		if (locked) {
-			const originalStyle = window.getComputedStyle(document.body).overflow;
-			document.body.style.overflow = "hidden";
-			return () => {
-				document.body.style.overflow = originalStyle;
-			};
-		}
-		return () => {};
-	}, [locked]);
-};
+  * Add the correct display in Edge, IE 10+, and Firefox.
+  */
+
+  details {
+    display: block;
+  }
+
+  /*
+  * Add the correct display in all browsers.
+  */
+
+  summary {
+    display: list-item;
+  }
+
+  /* Misc
+    ========================================================================== */
+
+  /**
+  * Add the correct display in IE 10+.
+  */
+
+  template {
+    display: none;
+  }
+
+  /**
+  * Add the correct display in IE 10.
+  */
+
+  [hidden] {
+    display: none;
+  }
+`}
+  ${css`
+  /**
+  * 1. Change from 'content-box' so that 'width' calculations are unaffected by 'padding' or 'border'
+  * 2. Ensure the iOS tap highlight is transparent
+  */
+  html {
+    box-sizing: border-box; /* 1 */
+    -webkit-tap-highlight-color: rgb(0 0 0 / 0%); /* 2 */
+  }
+
+  /**
+  * 1. See: https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/
+  */
+  *,
+  *::before,
+  *::after {
+    box-sizing: inherit; /* 1 */
+  }
+
+  /**
+  * 1. Without this fonts are too heavy weight in OS X Firefox
+  * 2. Design decision
+  * 3. Preferable for the body to fill viewport, even when empty
+  */
+  body {
+    -moz-osx-font-smoothing: grayscale; /* 1 */
+    -webkit-font-smoothing: antialiased; /* 2 */
+    color: ${({ theme }) => theme.color.grey900};
+    font-family: ${({ theme }) => theme.font.family.default};
+    font-size: ${({ theme }) => theme.font.size.default};
+    font-weight: ${({ theme }) => theme.font.weight.regular};
+    line-height: 1.5;
+    min-height: 100vh; /* 3 */
+  }
+`}
+`;
 //#endregion
-//#region src/hooks/usePreviousValue/usePreviousValue.ts
-const usePreviousValue = (value) => {
-	const ref = useRef(void 0);
-	useEffect(() => {
-		ref.current = value;
+//#region src/providers/VHSProvider.tsx
+const DEFAULT_THEME = {};
+const VHSProvider = ({ children, theme = DEFAULT_THEME, globalStylesIncluded = true, skipAnimations = false, Link }) => {
+	return /* @__PURE__ */ jsxs(VHSThemeProvider, {
+		theme,
+		children: [globalStylesIncluded ? /* @__PURE__ */ jsx(GlobalStyle$1, {}) : null, /* @__PURE__ */ jsx(LiveAnnouncer, { children: /* @__PURE__ */ jsx(MotionConfig, {
+			reducedMotion: skipAnimations ? "always" : "user",
+			children: /* @__PURE__ */ jsx(WrapperProvider, {
+				value: { Link },
+				children: /* @__PURE__ */ jsx(ModalProvider, { children: /* @__PURE__ */ jsx(ToastProvider, { children }) })
+			})
+		}) })]
 	});
-	return ref.current;
 };
 //#endregion
 //#region src/private/components/ModalAnimation/ModalAnimation.tsx
@@ -3930,6 +2660,15 @@ const ModalAnimation = ({ children }) => {
 	}, child.key)) : null });
 };
 //#endregion
+//#region src/private/hooks/usePreviousValue/usePreviousValue.ts
+const usePreviousValue = (value) => {
+	const ref = useRef(void 0);
+	useEffect(() => {
+		ref.current = value;
+	});
+	return ref.current;
+};
+//#endregion
 //#region src/components/ModalBase/ModalBase.tsx
 const LOCKED_SCROLL_CLASSNAME = "is-scroll-locked";
 const GlobalStyle = createGlobalStyle`
@@ -4056,11 +2795,40 @@ const ModalBaseContent = ({ className, initialShownState = false, isDismissible
 	] });
 };
 const ModalBase = (props) => {
-	if (!isEqual$1(useModalProviderContext(), {})) return /* @__PURE__ */ jsx(ModalBaseContent, { ...props });
+	if (!isEqual(useModalProviderContext(), {})) return /* @__PURE__ */ jsx(ModalBaseContent, { ...props });
 	return /* @__PURE__ */ jsx(ModalProvider, { children: /* @__PURE__ */ jsx(ModalBaseContent, { ...props }) });
 };
 ModalBase.displayName = "ModalBase_VHS";
 //#endregion
+//#region src/private/helpers/mq/mq.ts
+const getMaxWidth = (breakpoint) => {
+	const breakpointBuffer = .0025;
+	const [value, unit] = getValueAndUnit(breakpoint);
+	return `@media (max-width: ${Math.max(value - breakpointBuffer, 0)}${unit})`;
+};
+const xsAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.xs})`;
+const smAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.sm})`;
+const mdAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.md})`;
+const lgAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.lg})`;
+const xlAndUp = ({ theme }) => `@media (min-width: ${theme.breakpoint.xl})`;
+const xsAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.xs);
+const smAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.sm);
+const mdAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.md);
+const lgAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.lg);
+const xlAndDown = ({ theme }) => getMaxWidth(theme.breakpoint.xl);
+const mq = {
+	xsAndUp,
+	smAndUp,
+	mdAndUp,
+	lgAndUp,
+	xlAndUp,
+	xsAndDown,
+	smAndDown,
+	mdAndDown,
+	lgAndDown,
+	xlAndDown
+};
+//#endregion
 //#region src/components/ButtonGroup/ButtonGroup.tsx
 const getAlignment = (align) => {
 	if (align === "center") return "center";
@@ -4454,7 +3222,7 @@ const TooltipContent = ({ id, active, direction, children, forceState, shouldWra
 const Truncate = ({ children, maxChars, terminator = "...", breakOnWords = false }) => {
 	if (isNil(children)) return null;
 	const canBeTruncated = children.length + terminator.length >= maxChars;
-	if (!isString$1(children) || maxChars <= 0 || !canBeTruncated) return /* @__PURE__ */ jsx(Fragment, { children });
+	if (!isString(children) || maxChars <= 0 || !canBeTruncated) return /* @__PURE__ */ jsx(Fragment, { children });
 	let truncatedChild = children.slice(0, maxChars - terminator.length);
 	if (breakOnWords) {
 		const index = Math.max(truncatedChild.lastIndexOf(" "), truncatedChild.lastIndexOf("\n"));
@@ -4511,7 +3279,7 @@ const Tooltip = ({ label, direction = "top", duration = 2e3, eventType = "hover"
 		timer,
 		duration
 	]);
-	if (isString$1(label) && !label.length) return /* @__PURE__ */ jsx(Fragment, { children });
+	if (isString(label) && !label.length) return /* @__PURE__ */ jsx(Fragment, { children });
 	let tooltipLabel = label;
 	if (maxChars !== null) tooltipLabel = /* @__PURE__ */ jsx(Truncate, {
 		breakOnWords: true,
@@ -4602,7 +3370,7 @@ const disabledStyle$6 = css`
   &:focus {
     background-color: transparent;
 
-    svg {
+    & svg {
       color: ${({ $iconButtonColor }) => transparentize(.5, $iconButtonColor)};
     }
   }
@@ -4619,7 +3387,7 @@ const iconButtonStyle = css`
   &:focus-visible {
     background-color: ${({ $iconButtonColor }) => transparentize(.8, $iconButtonColor)};
 
-    svg {
+    & svg {
       color: ${({ $iconButtonColor }) => $iconButtonColor};
     }
   }
@@ -4627,7 +3395,7 @@ const iconButtonStyle = css`
   &:active {
     background-color: ${({ $iconButtonColor }) => transparentize(.6, $iconButtonColor)};
 
-    svg {
+    & svg {
       color: ${({ $iconButtonColor }) => $iconButtonColor};
     }
   }
@@ -4637,66 +3405,201 @@ const getIconButtonColor = (colorOverride, componentStyle, allThemeColors) => {
 	if (componentStyle === "dark") return allThemeColors.grey700;
 	return "#fff";
 };
-const IconButtonComponent = styled.button`
-  ${buttonResetStyle}
-  ${iconButtonStyle}
-  transition: all ${({ theme }) => theme.duration.productive.moderate};
-  ${({ disabled }) => disabled ? disabledStyle$6 : void 0}
-  ${({ size }) => {
-	if (size === "sm") return smSizeStyle;
-	if (size === "md") return mdSizeStyle;
-	return lgSizeStyle;
-}};
-`;
-const IconButton = forwardRef(({ colorOverride, componentStyle = "dark", disabled = false, icon, label, onClick, preventTooltip = false, size = "md", tooltipDirection = "top", ...otherProps }, ref) => {
-	const iconButtonColor = getIconButtonColor(colorOverride, componentStyle, useThemeColor());
-	const Button = useMemo(() => /* @__PURE__ */ jsxs(IconButtonComponent, {
-		ref,
-		$componentStyle: componentStyle,
-		$iconButtonColor: iconButtonColor,
-		disabled,
-		onClick,
-		size,
-		...otherProps,
-		children: [/* @__PURE__ */ jsx(Fragment, { children: icon }), /* @__PURE__ */ jsx(ScreenReaderOnly, { children: label })]
-	}), [
-		componentStyle,
-		disabled,
-		icon,
-		iconButtonColor,
-		label,
-		onClick,
-		otherProps,
-		ref,
-		size
-	]);
-	if (preventTooltip) return Button;
-	return /* @__PURE__ */ jsx(Tooltip, {
-		direction: tooltipDirection,
-		label,
-		children: Button
-	});
-});
-IconButton.displayName = "IconButton_VHS";
-//#endregion
-//#region src/private/components/ModalCloseButton/ModalCloseButton.tsx
-const ModalCloseButton$1 = ({ onClick, closeIconColorOverride }) => /* @__PURE__ */ jsx(IconButton, {
-	"aria-label": "Close",
-	colorOverride: closeIconColorOverride,
-	icon: /* @__PURE__ */ jsx(Icon, {
-		size: "sm",
-		type: "close"
-	}),
-	onClick,
-	preventTooltip: true,
-	style: {
-		position: "absolute",
-		right: "16px",
-		top: "16px",
-		zIndex: 1
-	}
-});
-ModalCloseButton$1.displayName = "ModalCloseButton";
+const IconButtonComponent = styled.button`
+  ${buttonResetStyle}
+  ${iconButtonStyle}
+  transition: all ${({ theme }) => theme.duration.productive.moderate};
+  ${({ disabled }) => disabled ? disabledStyle$6 : void 0}
+  ${({ size }) => {
+	if (size === "sm") return smSizeStyle;
+	if (size === "md") return mdSizeStyle;
+	return lgSizeStyle;
+}};
+`;
+const IconButton = forwardRef(({ colorOverride, componentStyle = "dark", disabled = false, icon, label, onClick, preventTooltip = false, size = "md", tooltipDirection = "top", ...otherProps }, ref) => {
+	const iconButtonColor = getIconButtonColor(colorOverride, componentStyle, useThemeColor());
+	const Button = useMemo(() => /* @__PURE__ */ jsxs(IconButtonComponent, {
+		ref,
+		$componentStyle: componentStyle,
+		$iconButtonColor: iconButtonColor,
+		disabled,
+		onClick,
+		size,
+		...otherProps,
+		children: [/* @__PURE__ */ jsx(Fragment, { children: icon }), /* @__PURE__ */ jsx(ScreenReaderOnly, { children: label })]
+	}), [
+		componentStyle,
+		disabled,
+		icon,
+		iconButtonColor,
+		label,
+		onClick,
+		otherProps,
+		ref,
+		size
+	]);
+	if (preventTooltip) return Button;
+	return /* @__PURE__ */ jsx(Tooltip, {
+		direction: tooltipDirection,
+		label,
+		children: Button
+	});
+});
+IconButton.displayName = "IconButton_VHS";
+//#endregion
+//#region src/private/components/ModalCloseButton/ModalCloseButton.tsx
+const ModalCloseButton$1 = ({ onClick, closeIconColorOverride }) => /* @__PURE__ */ jsx(IconButton, {
+	"aria-label": "Close",
+	colorOverride: closeIconColorOverride,
+	icon: /* @__PURE__ */ jsx(Icon, {
+		size: "sm",
+		type: "close"
+	}),
+	onClick,
+	preventTooltip: true,
+	style: {
+		position: "absolute",
+		right: "16px",
+		top: "16px",
+		zIndex: 1
+	}
+});
+ModalCloseButton$1.displayName = "ModalCloseButton";
+//#endregion
+//#region src/private/helpers/getBackgroundGradient/getBackgroundGradient.ts
+const gradients = {
+	defaultDarkOne: css`
+    background-color: #222d66;
+    background-image:
+      radial-gradient(farthest-corner at top right, #222d66, transparent 70%),
+      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 50%),
+      radial-gradient(farthest-corner at bottom left, #6b84ff, transparent 57%),
+      radial-gradient(farthest-corner at top left, #2949e5, transparent 68%);
+  `,
+	defaultDarkTwo: css`
+    background-color: #222d66;
+    background-image:
+      radial-gradient(farthest-corner at top left, #6b84ff, transparent 100%),
+      radial-gradient(farthest-corner at bottom left, #222d66, transparent 57%),
+      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 50%),
+      radial-gradient(farthest-corner at top right, #2949e5, transparent 70%);
+  `,
+	defaultLightOne: css`
+    background-color: #ccd5ff;
+    background-image:
+      radial-gradient(farthest-corner at bottom right, #ccd5ff, transparent 55%),
+      radial-gradient(farthest-corner at top left, #ccd5ff, transparent 65%),
+      radial-gradient(farthest-corner at top right, #6b84ff, transparent 50%),
+      radial-gradient(farthest-corner at bottom left, #f7f8ff, transparent 50%);
+  `,
+	defaultLightTwo: css`
+    background-color: #ccd5ff;
+    background-image:
+      radial-gradient(ellipse at top, #ccd5ff, transparent),
+      radial-gradient(ellipse at bottom, #6b84ff, transparent);
+  `,
+	defaultMidOne: css`
+    background-color: #6b84ff;
+    background-image:
+      radial-gradient(farthest-corner at top right, #2949e5, transparent 70%),
+      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 50%),
+      radial-gradient(farthest-corner at top left, #6b84ff, transparent 80%),
+      radial-gradient(farthest-corner at bottom left, #222d66, transparent 57%);
+  `,
+	defaultMidTwo: css`
+    background-color: #6b84ff;
+    background-image:
+      radial-gradient(ellipse at top, #2949e5, transparent),
+      radial-gradient(ellipse at bottom, #ccd5ff, transparent);
+  `,
+	green: css`
+    background-color: #fafffa;
+    background-image:
+      radial-gradient(farthest-corner at bottom left, #b0e5a5, transparent 50%),
+      radial-gradient(farthest-corner at top right, #268713, transparent 50%),
+      radial-gradient(farthest-corner at top left, #44b62d, transparent 65%),
+      radial-gradient(farthest-corner at bottom right, #44b62d, transparent 55%);
+  `,
+	greenWithPop: css`
+    background-color: #fafffa;
+    background-image:
+      radial-gradient(farthest-corner at bottom left, #b0e5a5, transparent 50%),
+      radial-gradient(farthest-corner at top right, #2949e5, transparent 50%),
+      radial-gradient(farthest-corner at top left, #44b62d, transparent 65%),
+      radial-gradient(farthest-corner at bottom right, #44b62d, transparent 55%);
+  `,
+	pink: css`
+    background-color: #fffff0;
+    background-image:
+      radial-gradient(farthest-corner at bottom left, #ffc7e8, transparent 50%),
+      radial-gradient(farthest-corner at top right, #e0128e, transparent 70%),
+      radial-gradient(farthest-corner at top left, #ff40b3, transparent 65%),
+      radial-gradient(farthest-corner at bottom right, #ff40b3, transparent 55%);
+  `,
+	pinkWithPop: css`
+    background-color: #fffff0;
+    background-image:
+      radial-gradient(farthest-corner at top right, #e0128e, transparent 70%),
+      radial-gradient(farthest-corner at top left, #ff40b3, transparent 65%),
+      radial-gradient(farthest-corner at bottom right, #ff40b3, transparent 55%),
+      radial-gradient(farthest-corner at bottom left, #2949e5, transparent 50%);
+  `,
+	playfulGradientOne: css`
+    background-color: #f7f8ff;
+    background-image:
+      radial-gradient(farthest-corner at top left, #d65cff, transparent 68%),
+      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 50%),
+      radial-gradient(farthest-corner at bottom left, #ffc7e8, transparent 57%),
+      radial-gradient(farthest-corner at top right, #ffcaba, transparent 70%);
+  `,
+	playfulGradientTwo: css`
+    background-color: #f7f8ff;
+    background-image:
+      radial-gradient(farthest-corner at top left, #44b62d, transparent 68%),
+      radial-gradient(farthest-corner at bottom right, #eff18d, transparent 50%),
+      radial-gradient(farthest-corner at bottom left, #ccd5ff, transparent 57%),
+      radial-gradient(farthest-corner at top right, #2949e5, transparent 70%);
+  `,
+	purple: css`
+    background-color: #f2caff;
+    background-image:
+      radial-gradient(ellipse at 0% 100%, #f9e5ff, transparent 50%),
+      radial-gradient(ellipse at 100% 0%, #e093fa, transparent 70%);
+  `,
+	purpleWithPop: css`
+    background-color: #f2caff;
+    background-image:
+      radial-gradient(farthest-corner at bottom left, #f2caff, transparent 50%),
+      radial-gradient(farthest-corner at top left, #d65cff, transparent 65%),
+      radial-gradient(farthest-corner at bottom right, #d65cff, transparent 55%),
+      radial-gradient(farthest-corner at top right, #2949e5, transparent 70%);
+  `,
+	yellow: css`
+    background-color: #fffff0;
+    background-image:
+      radial-gradient(farthest-corner at bottom left, #eff18d, transparent 50%),
+      radial-gradient(farthest-corner at top right, #bcbf19, transparent 70%),
+      radial-gradient(farthest-corner at top left, #e8ec1e, transparent 65%),
+      radial-gradient(farthest-corner at bottom right, #e8ec1e, transparent 55%);
+  `,
+	yellowWithPop: css`
+    background-color: #fffff0;
+    background-image:
+      radial-gradient(farthest-corner at bottom left, #eff18d, transparent 50%),
+      radial-gradient(farthest-corner at top right, #bcbf19, transparent 70%),
+      radial-gradient(farthest-corner at top left, #e8ec1e, transparent 65%),
+      radial-gradient(farthest-corner at bottom right, #2949e5, transparent 55%);
+  `
+};
+/**
+* Retrieves the CSS background gradient corresponding to the given gradient name.
+* If the specified gradient name is not found, the default gradient ('defaultDarkOne') is returned.
+* @param {GradientName} gradientName - The name of the gradient to retrieve.
+* @returns {FlattenSimpleInterpolation} The CSS string representing the specified gradient.
+*/
+const getBackgroundGradient = (gradientName) => {
+	return isNotNil(gradientName) ? gradients[gradientName] : gradients.defaultDarkOne;
+};
 //#endregion
 //#region src/components/ActionModal/getModalBackgroundGradient.ts
 const getModalBackgroundGradient = (illustrationBackgroundColor) => {
@@ -4907,7 +3810,7 @@ const containsEmojiCharacter = (char) => {
 	return /<a?:.+?:\d{18}>|\p{Extended_Pictographic}/gu.test(char);
 };
 const formatInitialsForDisplay = (initials) => {
-	if (isNil(initials) || isEmptyString(initials) || isString$1(initials) && containsEmojiCharacter(initials)) return "U";
+	if (isNil(initials) || isEmptyString(initials) || isString(initials) && containsEmojiCharacter(initials)) return "U";
 	if (typeof initials !== "string") return "U";
 	return initials.substring(0, 1).toUpperCase();
 };
@@ -5020,7 +3923,7 @@ const shouldWrap = (src) => {
 };
 const getBackgroundImageValue = (src) => {
 	if (src !== void 0 && Array.isArray(src)) return src.map((imageSrc) => shouldWrap(imageSrc) ? `url('${imageSrc}')` : imageSrc).join(", ");
-	if (src !== void 0 && src !== "" && isString$1(src)) return shouldWrap(src) ? `url('${src}')` : src;
+	if (src !== void 0 && src !== "" && isString(src)) return shouldWrap(src) ? `url('${src}')` : src;
 };
 const getOverflowStyle = (overflow) => {
 	if (overflow !== "") {
@@ -5750,7 +4653,8 @@ LabelDescription.displayName = "LabelDescription_VHS";
 const StyledFormFieldWrapper = styled.div`
   width: 100%;
 `;
-const FormFieldWrapper = ({ disabled = false, error = null, label = null, labelDescription = null, labelProps = {}, labelType = "label", name, children, labelId = null, ...otherProps }) => {
+const DEFAULT_LABEL_PROPS$8 = {};
+const FormFieldWrapper = ({ disabled = false, error = null, label = null, labelDescription = null, labelProps = DEFAULT_LABEL_PROPS$8, labelType = "label", name, children, labelId = null, ...otherProps }) => {
 	const computedId = labelId ?? `group-id-${name}`;
 	const computedAriaLabelledby = labelType === "legend" ? computedId : null;
 	const combinedLabelProps = {
@@ -5788,7 +4692,8 @@ const StyledOptionContainer$1 = styled.div`
   flex-direction: ${({ direction }) => direction === "row" ? "row" : "column"};
   gap: ${({ direction, theme }) => direction === "row" ? theme.spacing.space04 : theme.spacing.space01};
 `;
-const CheckboxGroup = ({ direction = "column", disabled = false, error, label, labelDescription, labelProps = {}, name, onChange, options, value = false, ...otherProps }) => /* @__PURE__ */ jsx(FormFieldWrapper, {
+const DEFAULT_LABEL_PROPS$7 = {};
+const CheckboxGroup = ({ direction = "column", disabled = false, error, label, labelDescription, labelProps = DEFAULT_LABEL_PROPS$7, name, onChange, options, value = false, ...otherProps }) => /* @__PURE__ */ jsx(FormFieldWrapper, {
 	disabled,
 	error,
 	label,
@@ -5903,6 +4808,45 @@ const CloseButton = ({ onClick, ...otherProps }) => /* @__PURE__ */ jsx(Button$1
 });
 CloseButton.displayName = "CloseButton_VHS";
 //#endregion
+//#region src/private/hooks/useElementObserver/useElementObserver.ts
+const initialRect = {
+	width: 0,
+	height: 0,
+	top: 0,
+	left: 0,
+	bottom: 0,
+	right: 0,
+	x: 0,
+	y: 0
+};
+const useElementObserver = () => {
+	const ref = useRef(null);
+	const [rect, setRect] = useState(initialRect);
+	useLayoutEffect(() => {
+		if (!ref.current) return;
+		const observer = new window.ResizeObserver((entries) => {
+			if (entries[0]) {
+				const { width, height, top, left, bottom, right, x, y } = entries[0].contentRect;
+				setRect({
+					width,
+					height,
+					top,
+					left,
+					bottom,
+					right,
+					x,
+					y
+				});
+			}
+		});
+		observer.observe(ref.current);
+		return () => {
+			observer.disconnect();
+		};
+	}, []);
+	return [ref, rect];
+};
+//#endregion
 //#region src/components/CollapsibleGroup/CollapsibleGroup.tsx
 const DARKENING_AMOUNT = .08;
 const BAR_HEIGHT = 48;
@@ -5915,6 +4859,10 @@ const CARET_DIRECTION_UP = "up";
 const CARET_DIRECTION_DOWN = "down";
 const CARET_DIRECTION_LEFT = "left";
 const CARET_DIRECTION_RIGHT = "right";
+const DEFAULT_CARET_DIRECTION = {
+	open: CARET_DIRECTION_DOWN,
+	closed: CARET_DIRECTION_RIGHT
+};
 const StyledCollapsibleGroup = styled.div`
   & + & {
     margin-top: ${({ theme }) => theme.spacing.space01};
@@ -6041,10 +4989,7 @@ const ActionControl = ({ children, showActionsOnHover }) => {
 		children
 	});
 };
-const CollapsibleGroup = ({ actions, backgroundColor, caretDirection = {
-	open: CARET_DIRECTION_DOWN,
-	closed: CARET_DIRECTION_RIGHT
-}, children = null, contentPadding = null, hideCaret = false, id, isOpen, label, layout = "leading", onOpenChange, showActionsOnHover = true, showTransition = false, variant, ...otherProps }) => {
+const CollapsibleGroup = ({ actions, backgroundColor, caretDirection = DEFAULT_CARET_DIRECTION, children = null, contentPadding = null, hideCaret = false, id, isOpen, label, layout = "leading", onOpenChange, showActionsOnHover = true, showTransition = false, variant, ...otherProps }) => {
 	const [open, setOpen] = useState(isOpen ?? false);
 	const [dimensions, setDimensions] = useState({
 		width: void 0,
@@ -6259,7 +5204,8 @@ const errorsTitle = (count) => {
 const scrollToField = (fieldName) => {
 	document.getElementById(`fieldset-${fieldName}`)?.scrollIntoView({ behavior: "smooth" });
 };
-const FieldErrorsList = ({ errors = {}, statusError }) => /* @__PURE__ */ jsxs(ErrorOrderedList, { children: [isNonEmptyString(statusError) ? /* @__PURE__ */ jsx(ErrorText, { children: statusError }) : null, Object.keys(errors).map((field) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(ErrorLink, {
+const DEFAULT_ERRORS = {};
+const FieldErrorsList = ({ errors = DEFAULT_ERRORS, statusError }) => /* @__PURE__ */ jsxs(ErrorOrderedList, { children: [isNonEmptyString(statusError) ? /* @__PURE__ */ jsx(ErrorText, { children: statusError }) : null, Object.keys(errors).map((field) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(ErrorLink, {
 	"data-testid": `form-global-error-${field}`,
 	onClick: (event) => {
 		event.preventDefault();
@@ -6514,7 +5460,9 @@ const inputTypeMap = {
 };
 //#endregion
 //#region src/private/components/FormConnectorCheckboxGroup/FormConnectorCheckboxGroup.tsx
-const FormConnectorCheckboxGroup = ({ direction = "column", disabled = false, field: { name, value }, form: { errors, setFieldValue }, label, labelDescription, labelProps = {}, onChangeCustom, options = [] }) => {
+const DEFAULT_LABEL_PROPS$6 = {};
+const DEFAULT_OPTIONS = [];
+const FormConnectorCheckboxGroup = ({ direction = "column", disabled = false, field: { name, value }, form: { errors, setFieldValue }, label, labelDescription, labelProps = DEFAULT_LABEL_PROPS$6, onChangeCustom, options = DEFAULT_OPTIONS }) => {
 	const onChangeSingle = (event, optionValue) => {
 		setFieldValue(optionValue, event.target.checked);
 	};
@@ -6548,7 +5496,8 @@ const FormConnectorCheckboxGroup = ({ direction = "column", disabled = false, fi
 FormConnectorCheckboxGroup.displayName = "FormConnectorCheckboxGroup";
 //#endregion
 //#region src/private/components/FormConnectorCustomField/FormConnectorCustomField.tsx
-const FormConnectorCustomField = ({ customComponent: Element, field, form, label = "", labelDescription, labelProps = {}, ...otherProps }) => {
+const DEFAULT_LABEL_PROPS$5 = {};
+const FormConnectorCustomField = ({ customComponent: Element, field, form, label = "", labelDescription, labelProps = DEFAULT_LABEL_PROPS$5, ...otherProps }) => {
 	const { name } = field;
 	const { errors } = form;
 	return /* @__PURE__ */ jsx(FormFieldWrapper, {
@@ -6566,6 +5515,16 @@ const FormConnectorCustomField = ({ customComponent: Element, field, form, label
 };
 FormConnectorCustomField.displayName = "FormConnectorCustomField";
 //#endregion
+//#region src/private/helpers/coerceToString/coerceToString.ts
+/**
+* Coerces a value `value` into a string. If passed a null or undefined
+* value, returns an empty string.
+*
+* @param {*} value - a value of any type
+* @returns {string} - that value as a string
+*/
+const coerceToString = (value) => value === null || value === void 0 ? "" : String(value);
+//#endregion
 //#region src/components/Input/InputStyledComponent.tsx
 const focusStyle$1 = css`
   border-color: ${({ theme }) => theme.color.brandBlue500};
@@ -6670,6 +5629,39 @@ const InputStyledComponent = styled.input`
     ${({ readOnly }) => readOnly && readOnlyStyle};
   `;
 //#endregion
+//#region src/private/helpers/copyToClipboard/copyToClipboard.ts
+/**
+* Copies a string to user's clipboard for easy pasting in another location
+*
+* @param {string} textToCopy - the string that will be copied to users clipboard
+* @returns {Promise} - Promise object that represents the copied string
+*/
+const copyToClipboard = async (textToCopy) => {
+	if (navigator.clipboard) return navigator.clipboard.writeText(textToCopy).catch((error) => {
+		if (error instanceof Error) throw error;
+		throw new DOMException("The clipboard is not accessible", "NotAllowedError");
+	});
+	const span = document.createElement("span");
+	span.textContent = textToCopy;
+	span.style.whiteSpace = "pre";
+	document.body.appendChild(span);
+	const selection = window.getSelection();
+	const range = window.document.createRange();
+	selection?.removeAllRanges();
+	range.selectNode(span);
+	selection?.addRange(range);
+	let success = false;
+	try {
+		success = window.document.execCommand("copy");
+	} catch (error) {
+		console.error("error", error);
+	}
+	selection?.removeAllRanges();
+	window.document.body.removeChild(span);
+	if (success) return Promise.resolve();
+	return Promise.reject(new DOMException("The request is not allowed", "NotAllowedError"));
+};
+//#endregion
 //#region src/components/Input/ClickToCopy.tsx
 const clickToCopyWrapperEnabledStyles = css`
   input {
@@ -6794,10 +5786,18 @@ const formatString = (string) => {
 	return timeUnitsToString(seconds, minutes, hours);
 };
 const timePositionFormat = (value) => {
-	if (isNil(value) || !isString$1(value)) return "0:00";
+	if (isNil(value) || !isString(value)) return "0:00";
 	return formatString(stripInvalidCharacters(value));
 };
 //#endregion
+//#region src/private/hooks/useMergedRefs/useMergedRefs.ts
+const useMergedRefs = (refs) => (element) => {
+	refs.forEach((ref) => {
+		if (typeof ref === "function") ref(element);
+		else if (ref != null) ref.current = element;
+	});
+};
+//#endregion
 //#region src/components/Input/Input.tsx
 const INPUT_TYPES_WITH_ICONS = new Set(["search"]);
 const InputWrapper = styled.div`
@@ -6970,7 +5970,8 @@ const StyledOptionContainer = styled.div`
   flex-direction: ${({ direction }) => direction === "row" ? "row" : "column"};
   gap: ${({ direction, theme }) => direction === "row" ? theme.spacing.space04 : theme.spacing.space01};
 `;
-const RadioGroup = ({ direction = "column", disabled = false, error, label, labelDescription, labelProps = {}, name, onChange, options, value, ...otherProps }) => /* @__PURE__ */ jsx(FormFieldWrapper, {
+const DEFAULT_LABEL_PROPS$4 = {};
+const RadioGroup = ({ direction = "column", disabled = false, error, label, labelDescription, labelProps = DEFAULT_LABEL_PROPS$4, name, onChange, options, value, ...otherProps }) => /* @__PURE__ */ jsx(FormFieldWrapper, {
 	disabled,
 	error,
 	label,
@@ -6996,7 +5997,8 @@ const RadioGroup = ({ direction = "column", disabled = false, error, label, labe
 RadioGroup.displayName = "RadioGroup_VHS";
 //#endregion
 //#region src/private/components/FormConnectorRadioGroup/FormConnectorRadioGroup.tsx
-const FormConnectorRadioGroup = ({ direction = "column", disabled = false, field: { name }, form: { errors, values, setFieldValue }, label = "", labelDescription, labelProps = {}, onChangeCustom, options }) => {
+const DEFAULT_LABEL_PROPS$3 = {};
+const FormConnectorRadioGroup = ({ direction = "column", disabled = false, field: { name }, form: { errors, values, setFieldValue }, label = "", labelDescription, labelProps = DEFAULT_LABEL_PROPS$3, onChangeCustom, options }) => {
 	const handleOnChange = useCallback((_event, optionValue) => {
 		setFieldValue(name, optionValue);
 		if (onChangeCustom) onChangeCustom(optionValue);
@@ -7164,7 +6166,8 @@ const Select = forwardRef(({ ariaLabel, disabled = false, forceState, fullWidth
 Select.displayName = "Select_VHS";
 //#endregion
 //#region src/private/components/FormConnectorSelect/FormConnectorSelect.tsx
-const FormConnectorSelect = ({ disabled = false, field: { name, value, onChange, onBlur }, form: { errors }, label, labelDescription, labelProps = {}, options, placeholder, onChangeCustom, ...otherProps }) => {
+const DEFAULT_LABEL_PROPS$2 = {};
+const FormConnectorSelect = ({ disabled = false, field: { name, value, onChange, onBlur }, form: { errors }, label, labelDescription, labelProps = DEFAULT_LABEL_PROPS$2, options, placeholder, onChangeCustom, ...otherProps }) => {
 	const getValue = (val) => {
 		if (isNil(val)) return "";
 		if (isBoolean(val)) return coerceToString(value);
@@ -7196,7 +6199,8 @@ const FormConnectorSelect = ({ disabled = false, field: { name, value, onChange,
 FormConnectorSelect.displayName = "FormConnectorSelect";
 //#endregion
 //#region src/private/components/FormConnectorHidden/FormConnectorHidden.tsx
-const FormConnectorHidden = ({ field: { name, value, onChange }, form: { setFieldValue } = {}, onChangeCustom, valueState = "", ...otherProps }) => {
+const DEFAULT_FORM = {};
+const FormConnectorHidden = ({ field: { name, value, onChange }, form: { setFieldValue } = DEFAULT_FORM, onChangeCustom, valueState = "", ...otherProps }) => {
 	useEffect(() => {
 		if (!valueState && isNil(value)) return;
 		if (valueState !== value && isNotUndefined(setFieldValue)) setFieldValue(name, valueState);
@@ -7366,17 +6370,17 @@ const isCodeBlock = (element) => element.nodeName === "CODE";
 const isInlineCodeBlock = (element, elementChildren) => isCodeBlock(element) && isNotNil(elementChildren[0]) && !elementChildren[0].match(/\n/g);
 const shouldCreateBlock = (el, children) => !isInlineCodeBlock(el, children) && isNotNil(ELEMENT_TAGS[el.nodeName]);
 const shouldCreateText = (el, children) => isInlineCodeBlock(el, children) || isNotNil(TEXT_TAGS[el.nodeName]);
-const htmlChildIsEmptyText = (child) => isNotNil(child) && !isString$1(child) && child.text?.trim() === "";
+const htmlChildIsEmptyText = (child) => isNotNil(child) && !isString(child) && child.text?.trim() === "";
 const createEditorBlockElements = (children, el) => {
 	const { nodeName } = el;
-	if (nodeName !== "IMG" && children.length === 1 && !isString$1(children[0]) && isNotNil(children[0].text) && children[0].text?.trim() === "") return jsx$1("element", ELEMENT_TAGS.P(), emptyTextNode$1);
+	if (nodeName !== "IMG" && children.length === 1 && !isString(children[0]) && isNotNil(children[0].text) && children[0].text?.trim() === "") return jsx$1("element", ELEMENT_TAGS.P(), emptyTextNode$1);
 	return jsx$1("element", ELEMENT_TAGS[nodeName](el), children);
 };
 const createEditorTextElements = (children, el) => {
 	const { nodeName } = el;
 	const attrs = TEXT_TAGS[nodeName]();
 	return children.map((child) => {
-		if (!isString$1(child) && isNotNil(child) && isNotNil(child.children)) return addAttrsToChildren(child, attrs);
+		if (!isString(child) && isNotNil(child) && isNotNil(child.children)) return addAttrsToChildren(child, attrs);
 		if (htmlChildIsEmptyText(child)) return jsx$1("text", {}, emptyTextNode$1);
 		return jsx$1("text", attrs, child);
 	});
@@ -7589,6 +6593,25 @@ const toggleMark = (editor, format) => {
 	else Editor.addMark(editor, format, true);
 };
 //#endregion
+//#region src/private/helpers/isUrl/isUrl.ts
+/**
+* Loosely validates a URL string
+*
+* @param {*} str - a string to validate - could be an unknown type
+* @return {boolean} - whether string appears to be a url
+*/
+const isUrl = (str) => {
+	const protocolAndDomain = /^(?:\w+:)?\/\/(\S+)$/;
+	const localhostDomain = /^localhost[:?\d]*(?:[^:?\d]\S*)?$/;
+	const nonLocalhostDomain = /^[^\s.]+\.\S{2,}$/;
+	if (!isString(str)) return false;
+	const match = protocolAndDomain.exec(str);
+	if (!match) return false;
+	const remaining = match[1];
+	if (remaining === void 0 || !remaining) return false;
+	return localhostDomain.test(remaining) || nonLocalhostDomain.test(remaining);
+};
+//#endregion
 //#region src/components/RichTextEditor/utilities/withImagesPlugin.ts
 const emptyTextNode = { text: "" };
 const imageExtensions = [
@@ -7966,14 +6989,15 @@ const getSelectedText = (editor) => {
 const noTextSelected = (editor) => {
 	return getSelectedText(editor).trim() === "";
 };
-const EditorButtons = ({ enabledFormats = [
+const DEFAULT_ENABLED_FORMATS = [
 	"BOLD",
 	"ITALIC",
 	"HEADING_1",
 	"LINK",
 	"BULLETED_LIST",
 	"IMAGE"
-], disabled = false }) => {
+];
+const EditorButtons = ({ enabledFormats = DEFAULT_ENABLED_FORMATS, disabled = false }) => {
 	const editor = useSlate();
 	return /* @__PURE__ */ jsxs(ButtonContainer, { children: [
 		enabledFormats.includes(rteFormatTypes.BOLD) && /* @__PURE__ */ jsx(EditorButton, {
@@ -8103,7 +7127,7 @@ const RichTextEditor = ({ enabledFormats = Object.values(rteFormatTypes), value
 		return isNonEmptyString(text);
 	};
 	useEffect(() => {
-		const isDefaultValue = isEqual$1(value, defaultValue);
+		const isDefaultValue = isEqual(value, defaultValue);
 		const valueString = rteSerializeToHTML(value);
 		const editorChildrenString = rteSerializeToHTML(editor.children);
 		/** if we have an external value and the text editor is not empty (and therefore valid) and the value string and children string is not equal to one another, we can safely update the editor. */
@@ -8182,7 +7206,8 @@ RichTextEditor.displayName = "RichTextEditor_VHS";
 const Wrapper = styled.div`
   margin-top: ${({ theme }) => theme.spacing.space02};
 `;
-const FormConnectorRichTextEditor = ({ field: { name, value, onChange }, form: { errors }, label, labelDescription, labelProps = {}, placeholder = "", disabled = false, enabledFormats = Object.values(rteFormatTypes), useExternalValue = false, height, ...otherProps }) => {
+const DEFAULT_LABEL_PROPS$1 = {};
+const FormConnectorRichTextEditor = ({ field: { name, value, onChange }, form: { errors }, label, labelDescription, labelProps = DEFAULT_LABEL_PROPS$1, placeholder = "", disabled = false, enabledFormats = Object.values(rteFormatTypes), useExternalValue = false, height, ...otherProps }) => {
 	const [rteValue, setRTEValue] = useState(rteDeserializeHTML(coerceToString(value)));
 	const labelId = isNotUndefined(label) ? `${name}-label-id` : void 0;
 	useEffect(() => {
@@ -8227,7 +7252,7 @@ const FormFieldSet = styled.fieldset`
   padding: 0;
 
   &[disabled] {
-    label {
+    & label {
       pointer-events: none;
     }
   }
@@ -8235,6 +7260,7 @@ const FormFieldSet = styled.fieldset`
 const FieldWrapper = styled(Field)`
   resize: ${({ $resize }) => $resize};
 `;
+const DEFAULT_LABEL_PROPS = {};
 const fieldsMap = {
 	FormConnectorCheckboxGroup,
 	FormConnectorCustomField,
@@ -8244,7 +7270,7 @@ const fieldsMap = {
 	FormConnectorHidden,
 	FormConnectorRichTextEditor
 };
-const FormField = forwardRef(({ resize = "vertical", customComponent, direction = "column", disabled = false, label, labelDescription, labelProps = {}, name = "", onChangeCustom, options, placeholder = null, type, ...otherProps }, ref) => /* @__PURE__ */ jsx(FormFieldSet, {
+const FormField = forwardRef(({ resize = "vertical", customComponent, direction = "column", disabled = false, label, labelDescription, labelProps = DEFAULT_LABEL_PROPS, name = "", onChangeCustom, options, placeholder = null, type, ...otherProps }, ref) => /* @__PURE__ */ jsx(FormFieldSet, {
 	disabled,
 	id: `fieldset-${name}`,
 	children: /* @__PURE__ */ jsx(FieldWrapper, {
@@ -8634,7 +7660,8 @@ const menuContentCss = css`
 const MenuContent = styled(DropdownMenuContent)`
   ${menuContentCss}
 `;
-const Menu = ({ align = "start", children, trigger, label, isOpen, triggerProps = {}, onOpenChange, onInteractOutside, ...props }) => {
+const DEFAULT_TRIGGER_PROPS = {};
+const Menu = ({ align = "start", children, trigger, label, isOpen, triggerProps = DEFAULT_TRIGGER_PROPS, onOpenChange, onInteractOutside, ...props }) => {
 	return /* @__PURE__ */ jsxs(DropdownMenu, {
 		modal: false,
 		...isNotNil(onOpenChange) && isNotNil(isOpen) ? {
@@ -8754,6 +7781,10 @@ const NoIconContainer = styled.div`
   text-align: center;
   width: 0;
 `;
+const DEFAULT_INDICATOR = /* @__PURE__ */ jsx(Icon, {
+	size: "sm",
+	type: "checkmark"
+});
 const MenuItem = ({ children, label, description, badge, icon, renderAs, href, target, variant = "primary", ...props }) => {
 	const as = renderAs ?? (isNotUndefined(href) ? "a" : "div");
 	const targetProp = as === "a" && isNonEmptyString(target) ? { target } : {};
@@ -8781,10 +7812,7 @@ const MenuItem = ({ children, label, description, badge, icon, renderAs, href, t
 		})
 	});
 };
-const CheckboxMenuItem = ({ children, label, description, badge, icon, indicator = /* @__PURE__ */ jsx(Icon, {
-	size: "sm",
-	type: "checkmark"
-}), ...props }) => {
+const CheckboxMenuItem = ({ children, label, description, badge, icon, indicator = DEFAULT_INDICATOR, ...props }) => {
 	return /* @__PURE__ */ jsx(DropdownMenuCheckboxItem, {
 		...props,
 		asChild: true,
@@ -8802,10 +7830,7 @@ const CheckboxMenuItem = ({ children, label, description, badge, icon, indicator
 		] }), /* @__PURE__ */ jsx(DropdownMenuItemIndicator, { children: indicator })] })
 	});
 };
-const RadioMenuItem = ({ children, label, badge, description, icon, indicator = /* @__PURE__ */ jsx(Icon, {
-	size: "sm",
-	type: "checkmark"
-}), ...props }) => {
+const RadioMenuItem = ({ children, label, badge, description, icon, indicator = DEFAULT_INDICATOR, ...props }) => {
 	return /* @__PURE__ */ jsx(DropdownMenuRadioItem, {
 		...props,
 		asChild: true,
@@ -8902,6 +7927,22 @@ const SubMenu = ({ label, icon, description, children }) => {
 	}), /* @__PURE__ */ jsx(StyledMobileSubMenuItems, { children: isExpanded ? children : null })] });
 };
 //#endregion
+//#region src/private/hooks/useOnClickOutside/useOnClickOutside.ts
+const useOnClickOutside = (ref, handler) => {
+	useEffect(() => {
+		const listener = (event) => {
+			if (!ref.current || ref.current.contains(event.target)) return;
+			handler(event);
+		};
+		document.addEventListener("mousedown", listener);
+		document.addEventListener("touchstart", listener);
+		return () => {
+			document.removeEventListener("mousedown", listener);
+			document.removeEventListener("touchstart", listener);
+		};
+	}, [ref, handler]);
+};
+//#endregion
 //#region src/private/components/Menu/Menu.tsx
 const MENU_WIDTH_OPTIONS = ["fullWidth", "maxItem"];
 const GUTTER_WIDTH = "8px";
@@ -8991,8 +8032,8 @@ const MenuItem$1 = styled.div`
     }
 
     /* support FileSelect; this prevents an inner button or link from inheriting unwanted space */
-    button,
-    a {
+    & button,
+    & a {
       padding: 0;
     }
 
@@ -9059,6 +8100,18 @@ const Menu$1 = forwardRef(({ items, menuHeader, width = "fullWidth", onClick, on
 });
 Menu$1.displayName = "Menu";
 //#endregion
+//#region src/private/hooks/useBoolean/useBoolean.ts
+const useBoolean = (initialValue = false) => {
+	const [value, setValue] = useState(initialValue);
+	return [
+		value,
+		useCallback(() => setValue((val) => !val), []),
+		useCallback(() => setValue(true), []),
+		useCallback(() => setValue(false), []),
+		setValue
+	];
+};
+//#endregion
 //#region src/components/MenuButton/MenuHeader.tsx
 const HeaderAndButton = styled.div`
   align-items: center;
@@ -9188,6 +8241,257 @@ const MenuButton = ({ label, menuAlignment = "right", menuItems, menuPosition =
 };
 MenuButton.displayName = "MenuButton_VHS";
 //#endregion
+//#region src/private/hooks/useEvent/useEvent.ts
+const isEventTargetSupported = (eventTarget) => Boolean(typeof eventTarget === "object" && eventTarget?.addEventListener);
+const useEvent = (eventName, eventHandler, eventTarget = window, eventOptions = {}) => {
+	const savedEventHandler = useRef(void 0);
+	const savedEventOptions = useRef(void 0);
+	useEffect(() => {
+		savedEventHandler.current = eventHandler;
+	}, [eventHandler]);
+	useEffect(() => {
+		savedEventOptions.current = eventOptions;
+	}, [eventOptions]);
+	useEffect(() => {
+		if (!eventName || !isEventTargetSupported(eventTarget)) return;
+		const eventListener = (event) => {
+			if (savedEventHandler.current !== void 0) return savedEventHandler.current(event);
+			return () => {};
+		};
+		eventTarget.addEventListener(eventName, eventListener, savedEventOptions.current);
+		return () => {
+			eventTarget.removeEventListener(eventName, eventListener, savedEventOptions.current);
+		};
+	}, [
+		eventName,
+		eventTarget,
+		savedEventOptions
+	]);
+};
+//#endregion
+//#region src/private/hooks/useKey/useKey.ts
+const createKeyPredicate = (keyFilter) => {
+	if (typeof keyFilter === "function") return keyFilter;
+	if (typeof keyFilter === "string") return (event) => event.key === keyFilter;
+	if (keyFilter !== null && keyFilter !== void 0 && keyFilter) return () => true;
+	return () => false;
+};
+const useKey = (key, eventHandler, options = {}, dependencies = [key]) => {
+	const { eventName = "keydown", eventTarget, eventOptions } = options;
+	useEvent(eventName, useMemo(() => {
+		const predicate = createKeyPredicate(key);
+		return (handlerEvent) => {
+			if ([
+				"INPUT",
+				"TEXTAREA",
+				"SELECT"
+			].includes(document.activeElement?.nodeName ?? "") || document.activeElement?.isContentEditable) return;
+			if (predicate(handlerEvent)) return eventHandler(handlerEvent);
+		};
+	}, dependencies), eventTarget, eventOptions);
+};
+//#endregion
+//#region src/private/hooks/useKeyPress/useKeyPress.ts
+const useKeyPress = (keyFilter) => {
+	const [state, setState] = useState([false, null]);
+	useKey(keyFilter, (event) => setState([true, event]), { eventName: "keydown" }, [state]);
+	useKey(keyFilter, (event) => setState([false, event]), { eventName: "keyup" }, [state]);
+	return state;
+};
+//#endregion
+//#region src/private/hooks/useUpdateEffect/useUpdateEffect.ts
+const useUpdateEffect = (effect, dependencies) => {
+	const isInitialMount = useRef(true);
+	useEffect(() => {
+		if (isInitialMount.current) {
+			isInitialMount.current = false;
+			return () => {};
+		}
+		return effect();
+	}, dependencies);
+};
+//#endregion
+//#region src/private/hooks/useKeyPressOnce/useKeyPressOnce.ts
+const useKeyPressOnce = (key, keydownHandler, keyupHandler) => {
+	const [pressed, event] = useKeyPress(key);
+	useUpdateEffect(() => {
+		if (!pressed && keyupHandler && event !== null) keyupHandler(event);
+		else if (pressed && keydownHandler && event !== null) keydownHandler(event);
+		return () => {};
+	}, [pressed]);
+};
+//#endregion
+//#region src/private/hooks/usePreventScroll/usePreventScroll.ts
+const usePreventScroll = (locked) => {
+	useLayoutEffect(() => {
+		if (locked) {
+			const originalStyle = window.getComputedStyle(document.body).overflow;
+			document.body.style.overflow = "hidden";
+			return () => {
+				document.body.style.overflow = originalStyle;
+			};
+		}
+		return () => {};
+	}, [locked]);
+};
+//#endregion
+//#region src/private/hooks/useFocusTrap/helpers.ts
+const FOCUSABLE_ELEMENT_SELECTORS = "a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, [tabindex=\"0\"], [contenteditable]";
+const isHiddenElement = (element) => {
+	const { display, visibility } = window.getComputedStyle(element);
+	const isHidden = display === "none" || element.style.display === "none" || visibility === "none" || element.style.visibility === "hidden";
+	return element.offsetWidth <= 0 && element.offsetHeight <= 0 || isHidden;
+};
+const isVisibleElement = (element) => {
+	let parentElement = element;
+	while (parentElement) {
+		if (parentElement === document.body) break;
+		if (isHiddenElement(parentElement)) return false;
+		parentElement = parentElement.parentNode;
+	}
+	return true;
+};
+const getElementTabIndex = (element) => {
+	const tabIndex = element.getAttribute("tabindex");
+	return Number.parseInt(tabIndex ?? void 0, 10);
+};
+const isTabIndexNaN = (element) => {
+	const tabIndex = getElementTabIndex(element);
+	return Number.isNaN(tabIndex);
+};
+const isFocusableElement = (element) => {
+	const tabbableNodeRegEx = /input|select|textarea|button|object/;
+	const nodeName = element.nodeName.toLowerCase();
+	const isTabIndexNotNaN = !isTabIndexNaN(element);
+	const isFocusable = tabbableNodeRegEx.test(nodeName) && !element.disabled || (element instanceof HTMLAnchorElement ? element.href || isTabIndexNotNaN : isTabIndexNotNaN);
+	return Boolean(isFocusable) && isVisibleElement(element);
+};
+const isTabbableElement = (element) => {
+	const tabIndex = getElementTabIndex(element);
+	return (isTabIndexNaN(element) || tabIndex >= 0) && isFocusableElement(element);
+};
+const findTabbableDescendants = (element) => Array.from(element.querySelectorAll(FOCUSABLE_ELEMENT_SELECTORS)).filter(isTabbableElement);
+const focusLaterElements = [];
+let focusElement = null;
+let needToFocus = false;
+const handleBlur = () => {
+	needToFocus = true;
+};
+const handleFocus = () => {
+	if (needToFocus) {
+		needToFocus = false;
+		if (!focusElement) return;
+		if (focusElement.contains(document.activeElement)) return;
+		(findTabbableDescendants(focusElement)[0] ?? focusElement).focus();
+	}
+};
+const markForFocusLater = () => {
+	const element = document.activeElement;
+	if (element !== null) focusLaterElements.push(element);
+};
+const returnFocus = () => {
+	let toFocus = null;
+	try {
+		toFocus = focusLaterElements.pop();
+		if (toFocus) toFocus.focus();
+	} catch {
+		console.warn(`You tried to return focus to ${coerceToString(toFocus)} but it is not in the DOM anymore`);
+	}
+};
+const setupScopedFocus = (element) => {
+	focusElement = element;
+	document.addEventListener("focusout", handleBlur, false);
+	document.addEventListener("focusin", handleFocus, true);
+};
+const teardownScopedFocus = () => {
+	focusElement = null;
+	document.removeEventListener("focusout", handleBlur);
+	document.removeEventListener("focusin", handleFocus);
+};
+const scopeTab = (node, event) => {
+	const tabbable = findTabbableDescendants(node);
+	if (!tabbable.length) {
+		event.preventDefault();
+		return;
+	}
+	if (!(tabbable[event.shiftKey ? 0 : tabbable.length - 1] === document.activeElement || node === document.activeElement)) return;
+	event.preventDefault();
+	const target = tabbable[event.shiftKey ? tabbable.length - 1 : 0];
+	if (target) target.focus();
+};
+const createAriaHider = (containerNode, selector) => {
+	selector ??= "body > :not(script)";
+	const rootNodes = Array.from(document.querySelectorAll(selector)).map((node) => {
+		if (node.contains(containerNode)) return;
+		const ariaHidden = node.getAttribute("aria-hidden");
+		if (ariaHidden === null || ariaHidden === "false") node.setAttribute("aria-hidden", "true");
+		return {
+			node,
+			ariaHidden
+		};
+	});
+	return () => {
+		rootNodes.forEach((item) => {
+			if (!item) return;
+			if (item.ariaHidden === null) item.node.removeAttribute("aria-hidden");
+			else item.node.setAttribute("aria-hidden", item.ariaHidden);
+		});
+	};
+};
+//#endregion
+//#region src/private/hooks/useFocusTrap/useFocusTrap.ts
+const isRef = (val) => {
+	return val !== null && typeof val === "object" && "current" in val;
+};
+const useFocusTrap = (active = true, options = {}) => {
+	const ref = useRef(null);
+	const restoreAriaRef = useRef(null);
+	const setRef = useCallback((node) => {
+		if (restoreAriaRef.current !== null) restoreAriaRef.current();
+		if (ref.current) {
+			returnFocus();
+			teardownScopedFocus();
+		}
+		if (active && node !== null && node !== void 0) {
+			setupScopedFocus(node);
+			markForFocusLater();
+			const processNode = (node2) => {
+				restoreAriaRef.current = !(options.disableAriaHider ?? false) ? createAriaHider(node2) : null;
+				let focusElement = null;
+				if (isNotUndefined(options.focusSelector)) if (isRef(options.focusSelector)) focusElement = options.focusSelector.current;
+				else focusElement = typeof options.focusSelector === "string" ? node2.querySelector(options.focusSelector) : options.focusSelector;
+				if (!focusElement) {
+					const children = Array.from(node2.querySelectorAll(FOCUSABLE_ELEMENT_SELECTORS));
+					focusElement = children.find(isTabbableElement) ?? children.find(isFocusableElement) ?? null;
+					if (!focusElement && isFocusableElement(node2)) focusElement = node2;
+				}
+				if (focusElement) focusElement.focus();
+				if (!focusElement) console.warn("[useFocusTrap]: Failed to find a focusable element after activating the focus trap. Make sure to include at an element that can recieve focus. As a fallback, you can also set \"tabIndex={-1}\" on the focus trap node.", node2);
+			};
+			setTimeout(() => {
+				if (node.ownerDocument) processNode(node);
+				if (!node.ownerDocument) console.warn("[useFocusTrap]: The focus trap is not part of the DOM yet, so it is unable to correctly set focus. Make sure to render the ref node.", node);
+			});
+			ref.current = node;
+		} else ref.current = null;
+	}, [
+		active,
+		options.focusSelector,
+		options.disableAriaHider
+	]);
+	useEffect(() => {
+		if (!active) return;
+		const handleKeyDown = (event) => {
+			if (event.key === "Tab" && ref.current) scopeTab(ref.current, event);
+		};
+		document.addEventListener("keydown", handleKeyDown);
+		return () => {
+			document.removeEventListener("keydown", handleKeyDown);
+		};
+	}, [active]);
+	return setRef;
+};
+//#endregion
 //#region src/components/Modal/Dialog.tsx
 const Dialog = styled.div`
   background-color: white;
@@ -9745,10 +9049,12 @@ const useRange = (firstDate, secondDate) => {
 	]);
 	return range;
 };
-const RangeSelectorCalendar = ({ range = {
+const DEFAULT_RANGE$1 = {
 	end: /* @__PURE__ */ new Date(),
 	start: /* @__PURE__ */ new Date()
-}, rangePartToShow = "", onChange, onIsValidChange = () => {}, earliestDate, latestDate, shouldPreventFuture = false }) => {
+};
+const NOOP = () => {};
+const RangeSelectorCalendar = ({ range = DEFAULT_RANGE$1, rangePartToShow = "", onChange, onIsValidChange = NOOP, earliestDate, latestDate, shouldPreventFuture = false }) => {
 	const thisMonth = useMemo(() => startOfMonth(/* @__PURE__ */ new Date()), []);
 	const [displayDate, setDisplayDate] = useState(isNotNil(range.end) ? range.end : thisMonth);
 	const [{ firstDate, secondDate }, setDates] = useState({});
@@ -9782,8 +9088,8 @@ const RangeSelectorCalendar = ({ range = {
 	useEffect(() => {
 		if (isValidRange$1(range)) {
 			let date = void 0;
-			if (priorInternalRange && !isEqual(range.start, priorInternalRange.start)) date = range.start;
-			if (priorInternalRange && !isEqual(range.end, priorInternalRange.end)) date = range.end;
+			if (priorInternalRange && !isEqual$1(range.start, priorInternalRange.start)) date = range.start;
+			if (priorInternalRange && !isEqual$1(range.end, priorInternalRange.end)) date = range.end;
 			if (date) setDisplayDateDebounced(date);
 			setDates({
 				firstDate: range.start,
@@ -9863,7 +9169,8 @@ const ErrorMessage = styled.li`
   color: ${({ theme }) => theme.color.error600};
   font-size: 12px;
 `;
-const ErrorMessages = ({ messages = [] }) => /* @__PURE__ */ jsx(ErrorMessagesList, { children: messages.map((message) => /* @__PURE__ */ jsx(ErrorMessage, { children: message }, message)) });
+const DEFAULT_MESSAGES = [];
+const ErrorMessages = ({ messages = DEFAULT_MESSAGES }) => /* @__PURE__ */ jsx(ErrorMessagesList, { children: messages.map((message) => /* @__PURE__ */ jsx(ErrorMessage, { children: message }, message)) });
 //#endregion
 //#region src/private/components/RangeSelectorInput/constants.ts
 const DIVIDER_STRING = "       -       ";
@@ -9958,7 +9265,7 @@ const getValueParts = (value) => {
 		year2: isNonEmptyString(year2Val) ? year2Val : ""
 	};
 };
-const dateOnlyStringNumeric$1 = (date) => {
+const dateOnlyStringNumeric = (date) => {
 	if (!isValid(date)) return "";
 	try {
 		return new Intl.DateTimeFormat(["en-US"], {
@@ -10036,16 +9343,16 @@ const getMaxValue = (valueParts, part) => {
 	}
 };
 const getErrors = ({ range, maxDate, minDate }) => {
-	const startString = dateOnlyStringNumeric$1(range.start);
-	const endString = dateOnlyStringNumeric$1(range.end);
+	const startString = dateOnlyStringNumeric(range.start);
+	const endString = dateOnlyStringNumeric(range.end);
 	const errorMessages = [];
 	if (isNotNil(maxDate)) {
-		const maxString = dateOnlyStringNumeric$1(maxDate);
+		const maxString = dateOnlyStringNumeric(maxDate);
 		if (isBefore(maxDate, range.start)) errorMessages.push(`${startString} is after maximum of ${maxString}`);
 		if (isBefore(maxDate, range.end)) errorMessages.push(`${endString} is after maximum of ${maxString}`);
 	}
 	if (minDate) {
-		const minString = dateOnlyStringNumeric$1(minDate);
+		const minString = dateOnlyStringNumeric(minDate);
 		if (isBefore(range.start, minDate)) errorMessages.push(`${startString} is before minimum of ${minString}`);
 		if (isBefore(range.end, minDate)) errorMessages.push(`${endString} is before minimum of ${minString}`);
 	}
@@ -10197,11 +9504,11 @@ const getNextSelection = ({ event, currentSelection }) => {
 	let nextSelection = void 0;
 	if (isMoveRightChar(event)) {
 		nextSelection = getSelectionFromMove(currentSelection, 1, DATE_PART_POSITIONS);
-		if (!isEqual$1(nextSelection, currentSelection)) event.preventDefault();
+		if (!isEqual(nextSelection, currentSelection)) event.preventDefault();
 	}
 	if (isMoveLeftChar(event)) {
 		nextSelection = getSelectionFromMove(currentSelection, -1, DATE_PART_POSITIONS);
-		if (!isEqual$1(nextSelection, currentSelection)) event.preventDefault();
+		if (!isEqual(nextSelection, currentSelection)) event.preventDefault();
 	}
 	return {
 		nextSelection,
@@ -10365,6 +9672,11 @@ const formatDate = (date) => date.toLocaleDateString("en-US", {
 });
 const formatFunc = ({ start, end }) => `${formatDate(start)} - ${formatDate(end)}`;
 const isSameRange = (r1, r2) => isSameDay(r1.start, r2.start) && isSameDay(r1.end, r2.end);
+const DEFAULT_PRESETS = [];
+const DEFAULT_RANGE = {
+	end: /* @__PURE__ */ new Date(),
+	start: /* @__PURE__ */ new Date()
+};
 const CalendarPadding = styled.div`
   padding: ${({ theme }) => `0 ${theme.spacing.space03}`};
 `;
@@ -10460,10 +9772,7 @@ const Label$1 = styled.span`
     width: calc(100% + 40px);
   }
 `;
-const RangeSelector = ({ align = "left", buttonVariant = "secondary", earliestDate, latestDate, format = formatFunc, fullWidth = false, footerText, onChange, presets = [], range = {
-	end: /* @__PURE__ */ new Date(),
-	start: /* @__PURE__ */ new Date()
-}, shouldPreventFuture = false, customTriggerComponent, width, ...props }) => {
+const RangeSelector = ({ align = "left", buttonVariant = "secondary", earliestDate, latestDate, format = formatFunc, fullWidth = false, footerText, onChange, presets = DEFAULT_PRESETS, range = DEFAULT_RANGE, shouldPreventFuture = false, customTriggerComponent, width, ...props }) => {
 	const [internalRange, setInternalRange] = useState(range);
 	const [isOpen, setIsOpen] = useState(false);
 	const [isCurrentCalendarValid, setIsCurrentCalendarValid] = useState(true);
@@ -10648,10 +9957,10 @@ const Slider = ({ ariaLabel, ariaLabelledby, ariaValuetext, disabled = false, in
 		"data-testid": dataTestId,
 		disabled,
 		children: /* @__PURE__ */ jsx(ReactSlider, {
-			...isString$1(ariaLabel) || isNonEmptyArray(ariaLabel) ? { ariaLabel } : {},
-			...isString$1(ariaLabelledby) || isNonEmptyArray(ariaLabelledby) ? { ariaLabelledby } : {},
+			...isString(ariaLabel) || isNonEmptyArray(ariaLabel) ? { ariaLabel } : {},
+			...isString(ariaLabelledby) || isNonEmptyArray(ariaLabelledby) ? { ariaLabelledby } : {},
 			...isFunction(ariaValuetext) && { ariaValuetext: (state) => ariaValuetext(state) },
-			...isString$1(ariaValuetext) && { ariaValuetext },
+			...isString(ariaValuetext) && { ariaValuetext },
 			...isNumber(initialValue) || isNonEmptyArray(initialValue) ? { defaultValue: initialValue } : {},
 			disabled,
 			marks: step,
@@ -11007,7 +10316,7 @@ const WistiaLogoComponent = styled.svg`
   max-width: 100%;
 
   &:hover {
-    path {
+    & path {
       ${({ $hoverColor }) => $hoverColor !== void 0 ? `fill: ${$hoverColor}` : null};
     }
   }
@@ -11053,6 +10362,6 @@ const WistiaLogo = ({ description, height = 100, hoverColor, href, iconOnly = fa
 };
 WistiaLogo.displayName = "WistiaLogo_VHS";
 //#endregion
-export { ActionModal, Avatar, Backdrop, BackgroundImage, Badge, Banner, Box, Button, ButtonGroup, ButtonLink, Checkbox, CheckboxGroup, CheckboxMenuItem, ClickArea, CloseButton, CollapsibleGroup, Divider, Ellipsis, FileSelect, Form, FormButtons, FormField, FormFieldError, FormGlobalError, FullScreenModal, Icon, IconButton, Image, Input, KeyboardShortcut, Label, LabelDescription, Link, LinkButton, List, ListItem, Menu, MenuButton, MenuItem, MenuLabel, MenuRadioGroup, Modal, ModalBase, ModalBody, ModalCloseButton, ModalFooter, ModalHeader, Paper, ProgressBar, Radio, RadioGroup, RadioMenuItem, RangeSelector, RichTextEditor, ScreenReaderOnly, Select, Slider, Stack, SubMenu, Switch, Text, Thumbnail, ThumbnailCollage, Toast, ToastProvider, Tooltip, Truncate, VHSProvider, WistiaLogo, buildTimeDuration, camelCase, coerceToBoolean, coerceToString, copyToClipboard, dateOnlyISOString, dateOnlyString, dateOnlyStringForSentence, dateOnlyStringNumeric, dateTimeRounded, dateTimeString, dateTimeStringForSentence, dateTimeToDate, dateTimeToISO, dateToDateTime, dateUTCOffset, datetimeHelpers, dayOfWeekString, deepFreeze, ellipsisFlexParentStyle, ellipsisStyle, getBackgroundGradient, getSemiRandomBackgroundGradient, iconSizeMap, isDate, isHttpUrl, isObject, isString, isUrl, lowerFirst, mediaDurationString, merge, millisecondsToDurationISOString, monthDayStringNumeric, mq, objectHelpers, removeNewlines, rteDeserializeHTML, rteFormatTypes, rteSerializeToHTML, screenReaderOnlyStyle, selectKeys, sessionDurationString, stringHelpers, stripExtension, timeAgoString, timeOnlyString, truncate, upperFirst, useBoolean, useClipboard, useElementObserver, useEvent, useFocusTrap, useForceUpdate, useFormikContext, useIsHovered, useKey, useKeyPress, useKeyPressOnce, useLocalStorage, useMergedRefs, useMq, useOnClickOutside, usePreventScroll, usePreviousValue, useTheme, useThemeColor, useToast, useWindowSize };
+export { ActionModal, Avatar, Backdrop, BackgroundImage, Badge, Banner, Box, Button, ButtonGroup, ButtonLink, Checkbox, CheckboxGroup, CheckboxMenuItem, ClickArea, CloseButton, CollapsibleGroup, Divider, Ellipsis, FileSelect, Form, FormButtons, FormField, FormFieldError, FormGlobalError, FullScreenModal, Icon, IconButton, Image, Input, KeyboardShortcut, Label, LabelDescription, Link, LinkButton, List, ListItem, Menu, MenuButton, MenuItem, MenuLabel, MenuRadioGroup, Modal, ModalBase, ModalBody, ModalCloseButton, ModalFooter, ModalHeader, Paper, ProgressBar, Radio, RadioGroup, RadioMenuItem, RangeSelector, RichTextEditor, ScreenReaderOnly, Select, Slider, Stack, SubMenu, Switch, Text, Thumbnail, ThumbnailCollage, Toast, ToastProvider, Tooltip, Truncate, VHSProvider, WistiaLogo, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, rteDeserializeHTML, rteFormatTypes, rteSerializeToHTML, screenReaderOnlyStyle, useFormikContext, useTheme, useThemeColor, useToast };
 
 //# sourceMappingURL=index.js.map