@umami/react-zen 0.200.0 → 0.201.0

package/dist/index.css

@@ -3720,24 +3720,24 @@ body a.Button_button__NGQyO {
 }
 
 /* virtual-css:css:0fb02723d81c5960ed149d3d9f58f1ba */
-.List_list__ZTRlN {
+.List_list__Yzk2Y {
   display: grid;
   outline: none;
   overflow: auto;
   gap: var(--spacing-1);
 }
-.List_separator__ODIwN {
+.List_separator__ODZiZ {
   border-bottom: var(--border);
 }
-.List_section__MzJmN:not(:last-child) {
+.List_section__NTI0O:not(:last-child) {
   margin-bottom: var(--spacing-4);
 }
-.List_header__MzRmM {
+.List_header__MjE1Y {
   font-size: var(--font-size-3);
   font-weight: var(--font-weight-bold);
   padding: var(--padding);
 }
-.List_item__ODM4N {
+.List_item__MzU5Y {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -3750,29 +3750,40 @@ body a.Button_button__NGQyO {
   outline: none;
   border-radius: var(--border-radius);
 }
-.List_item__ODM4N[data-disabled] {
+.List_item__MzU5Y[data-disabled] {
   color: var(--font-color-disabled);
 }
-.List_item__ODM4N[data-focus],
-.List_item__ODM4N[data-focus-visible] {
+.List_item__MzU5Y[data-focus],
+.List_item__MzU5Y[data-focus-visible] {
   background: var(--highlight-color);
 }
-.List_item__ODM4N:hover {
+.List_item__MzU5Y:hover {
   background: var(--highlight-color);
 }
-.List_item__ODM4N[data-selected] {
+.List_item__MzU5Y[data-selected] {
   font-weight: bold;
-  & .List_checkmark__NzY1N {
+  & .List_checkmark__YzRiZ {
     display: flex;
     justify-content: flex-end;
   }
 }
-.List_checkmark__NzY1N {
+.List_checkmark__YzRiZ {
   display: none;
 }
-.List_hideCheckmark__NDhmN .List_checkmark__NzY1N {
+.List_hideCheckmark__NDlhN .List_checkmark__YzRiZ {
   display: none;
 }
+.List_fullscreen__NWMyY {
+  display: block;
+  padding: var(--spacing-3);
+  border: 0;
+  border-radius: 0;
+  position: fixed;
+  inset: 0;
+  overflow: auto;
+  z-index: 9999;
+  background: var(--background-color);
+}
 
 /* virtual-css:css:8ac5a8adaf8e8de9ae56ee4600f2cfaa */
 .ComboBox_combobox__ZDYxZ {
@@ -4516,25 +4527,25 @@ body a.Button_button__NGQyO {
 }
 
 /* virtual-css:css:f94974973c639ccc39a8a6465cbebeb2 */
-.Popover_popover__YmFhM[data-placement=top] {
+.Popover_popover__ZDgwN[data-placement=top] {
   --origin: translateY(8px);
 }
-.Popover_popover__YmFhM[data-placement=bottom] {
+.Popover_popover__ZDgwN[data-placement=bottom] {
   --origin: translateY(-8px);
 }
-.Popover_popover__YmFhM[data-placement=right] {
+.Popover_popover__ZDgwN[data-placement=right] {
   --origin: translateX(-8px);
 }
-.Popover_popover__YmFhM[data-placement=left] {
+.Popover_popover__ZDgwN[data-placement=left] {
   --origin: translateX(8px);
 }
-.Popover_popover__YmFhM[data-entering] {
-  animation: Popover_popover-slide__OGZjY 200ms;
+.Popover_popover__ZDgwN[data-entering] {
+  animation: Popover_popover-slide__NGU0N 200ms;
 }
-.Popover_popover__YmFhM[data-exiting] {
-  animation: Popover_popover-slide__OGZjY 200ms reverse ease-in;
+.Popover_popover__ZDgwN[data-exiting] {
+  animation: Popover_popover-slide__NGU0N 200ms reverse ease-in;
 }
-@keyframes Popover_popover-slide__OGZjY {
+@keyframes Popover_popover-slide__NGU0N {
   from {
     transform: var(--origin);
     opacity: 0;
@@ -4544,6 +4555,15 @@ body a.Button_button__NGQyO {
     opacity: 1;
   }
 }
+.Popover_fullscreen__MTcxY {
+  display: block;
+  border: 0;
+  border-radius: 0;
+  position: fixed;
+  inset: 0;
+  overflow: auto;
+  z-index: 9999;
+}
 
 /* virtual-css:css:0e892dc2f62a700ee33f11aa6f8910ef */
 .ProgressBar_progressbar__YzdlO {

package/dist/index.d.mts

@@ -1,5 +1,5 @@
-import { ButtonProps as ButtonProps$1, DisclosureGroupProps, DisclosureProps, DialogProps as DialogProps$1, BreadcrumbsProps, BreadcrumbProps, CalendarProps as CalendarProps$1, CheckboxProps as CheckboxProps$1, ListBoxProps, ListBoxItemProps, SeparatorProps, ListBoxSectionProps, ComboBoxProps as ComboBoxProps$1, ListBoxRenderProps, PopoverProps, TableProps, TooltipProps as TooltipProps$1, LabelProps as LabelProps$1, MenuProps as MenuProps$1, MenuItemProps as MenuItemProps$1, MenuSectionProps as MenuSectionProps$1, SubmenuTriggerProps as SubmenuTriggerProps$1, ModalOverlayProps, ModalRenderProps, TextFieldProps as TextFieldProps$1, ProgressBarProps as ProgressBarProps$1, RadioProps, RadioGroupProps as RadioGroupProps$1, SearchFieldProps as SearchFieldProps$1, SelectProps as SelectProps$1, SelectValueRenderProps, SliderProps as SliderProps$1, SwitchProps as SwitchProps$1, TableHeaderProps, TableBodyProps, RowProps as RowProps$1, ColumnProps as ColumnProps$1, CellProps, TabsProps, TabListProps, TabProps, TabPanelProps, ToggleButtonProps, TagGroupProps, TagProps } from 'react-aria-components';
-export { BreadcrumbProps, BreadcrumbsProps, DialogTrigger, FileTrigger, Focusable, MenuTrigger, PopoverProps, Pressable, RadioProps, RouterProvider, Selection, SubmenuTrigger, TabListProps, TabPanelProps, TabProps, TableBodyProps, TabsProps, TooltipTrigger } from 'react-aria-components';
+import { ButtonProps as ButtonProps$1, DisclosureGroupProps, DisclosureProps, DialogProps as DialogProps$1, BreadcrumbProps, BreadcrumbsProps, CalendarProps as CalendarProps$1, CheckboxProps as CheckboxProps$1, ListBoxProps, ListBoxItemProps, SeparatorProps, ListBoxSectionProps, ComboBoxProps as ComboBoxProps$1, ListBoxRenderProps, PopoverProps as PopoverProps$1, TableProps, TooltipProps as TooltipProps$1, LabelProps as LabelProps$1, MenuProps as MenuProps$1, MenuItemProps as MenuItemProps$1, MenuSectionProps as MenuSectionProps$1, SubmenuTriggerProps as SubmenuTriggerProps$1, ModalOverlayProps, ModalRenderProps, TextFieldProps as TextFieldProps$1, ProgressBarProps as ProgressBarProps$1, RadioGroupProps as RadioGroupProps$1, RadioProps, SearchFieldProps as SearchFieldProps$1, SelectProps as SelectProps$1, SelectValueRenderProps, SliderProps as SliderProps$1, SwitchProps as SwitchProps$1, TableHeaderProps, TableBodyProps, RowProps as RowProps$1, ColumnProps as ColumnProps$1, CellProps, TabsProps, TabListProps, TabProps, TabPanelProps, ToggleButtonProps, TagGroupProps, TagProps } from 'react-aria-components';
+export { BreadcrumbProps, BreadcrumbsProps, DialogTrigger, FileTrigger, Focusable, MenuTrigger, Pressable, RadioProps, RouterProvider, Selection, SubmenuTrigger, TabListProps, TabPanelProps, TabProps, TableBodyProps, TabsProps, TooltipTrigger } from 'react-aria-components';
 import * as react from 'react';
 import { HTMLAttributes, ReactNode, ReactElement, Dispatch, SetStateAction } from 'react';
 import { UseFormProps, SubmitHandler, UseFormReturn, ControllerProps, ControllerRenderProps, FieldValues, ControllerFieldState, UseFormStateReturn, RegisterOptions } from 'react-hook-form';
@@ -219,6 +219,7 @@ declare function Toaster({ duration, position }: ToasterProps): react.JSX.Elemen
 interface ToastProviderProps extends ToasterProps {
     children: ReactNode;
 }
+declare const ToastContext: react.Context<{}>;
 declare function ToastProvider({ children, ...props }: ToastProviderProps): react.JSX.Element;
 
 declare function useDebounce(value: string, delay: number): string;
@@ -230,6 +231,7 @@ interface ThemeState {
     initTheme: (preferred?: Theme, colorScheme?: 'light' | 'dark' | 'system') => void;
 }
 declare const useTheme: zustand.UseBoundStore<zustand.StoreApi<ThemeState>>;
+declare function useInitTheme(preferred?: Theme, colorScheme?: 'light' | 'dark' | 'system'): void;
 
 type ToastVariant = 'success' | 'error';
 interface ToastOptions {
@@ -245,6 +247,7 @@ interface ToastState extends ToastOptions {
     message: string;
     timestamp: number;
 }
+declare function removeToast(id: string): void;
 declare function useToast(): {
     toast: (message: string, options?: ToastOptions) => void;
     toasts: ToastState[];
@@ -332,11 +335,12 @@ interface ListProps extends ListBoxProps<any> {
     separatorProperty?: string;
     highlightColor?: string;
     showCheckmark?: boolean;
+    isFullscreen?: boolean;
     label?: string;
     value?: string[];
     onChange?: (value: string[]) => void;
 }
-declare function List({ id, items, idProperty, labelProperty, separatorProperty, highlightColor, showCheckmark, label, value, onChange, className, selectedKeys, defaultSelectedKeys, onSelectionChange, style, children, ...props }: ListProps): react.JSX.Element;
+declare function List({ id, items, idProperty, labelProperty, separatorProperty, highlightColor, showCheckmark, isFullscreen, label, value, onChange, className, selectedKeys, defaultSelectedKeys, onSelectionChange, style, children, ...props }: ListProps): react.JSX.Element;
 interface ListItemProps extends ListBoxItemProps<any> {
     showCheckmark?: boolean;
 }
@@ -351,7 +355,7 @@ interface ComboBoxProps extends ComboBoxProps$1<any> {
     items?: any[];
     renderEmptyState?: (props: ListBoxRenderProps) => ReactNode;
     listProps?: ListProps;
-    popoverProps?: PopoverProps;
+    popoverProps?: PopoverProps$1;
 }
 declare function ComboBox({ items, className, renderEmptyState, listProps, popoverProps, children, ...props }: ComboBoxProps): react.JSX.Element;
 
@@ -602,7 +606,10 @@ interface PasswordFieldProps extends TextFieldProps$1 {
 }
 declare function PasswordField({ label, className, ...props }: PasswordFieldProps): react.JSX.Element;
 
-declare function Popover({ children, className, ...props }: PopoverProps): react.JSX.Element;
+interface PopoverProps extends PopoverProps$1 {
+    isFullscreen?: boolean;
+}
+declare function Popover({ children, isFullscreen, className, ...props }: PopoverProps): react.JSX.Element;
 
 interface ProgressBarProps extends ProgressBarProps$1 {
     showPercentage?: boolean;
@@ -642,16 +649,17 @@ interface SelectProps extends SelectProps$1<HTMLSelectElement> {
     allowSearch?: boolean;
     searchValue?: string;
     searchDelay?: number;
+    isFullscreen?: boolean;
     onSearch?: (value: string) => void;
     onChange?: (e: any) => void;
     buttonProps?: ButtonProps;
     listProps?: ListProps;
-    popoverProps?: PopoverProps;
+    popoverProps?: PopoverProps$1;
     renderValue?: ReactNode | ((values: SelectValueRenderProps<object> & {
         defaultChildren: ReactNode;
     }) => ReactNode);
 }
-declare function Select({ items, value, defaultValue, label, isLoading, allowSearch, searchValue, searchDelay, onSearch, onSelectionChange, onChange, buttonProps, listProps, popoverProps, renderValue, className, children, ...props }: SelectProps): react.JSX.Element;
+declare function Select({ items, value, defaultValue, label, isLoading, allowSearch, searchValue, searchDelay, isFullscreen, onSearch, onChange, buttonProps, listProps, popoverProps, renderValue, className, children, ...props }: SelectProps): react.JSX.Element;
 
 interface SidebarProps extends ColumnProps {
     itemBackgroundColor?: string;
@@ -764,4 +772,4 @@ interface ZenProviderProps {
 }
 declare function ZenProvider({ children, theme, colorScheme, toast, }: ZenProviderProps): react.JSX.Element;
 
-export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, AlertBanner, type AlertBannerProps, AlertDialog, type AlertDialogProps, Blockquote, type BlockquoteProps, Box, type BoxProps, Breadcrumb, Breadcrumbs, type BreakpointKey, Button, type ButtonProps, Calendar, type CalendarProps, Checkbox, type CheckboxProps, Code, type CodeProps, Column, type ColumnProps, ComboBox, type ComboBoxProps, ConfirmationDialog, type ConfirmationDialogProps, Container, type ContainerProps, CopyButton, DataCard, DataColumn, type DataColumnProps, DataTable, type DataTableProps, Dialog, type DialogProps, Dots, type DotsProps, Flexbox, type FlexboxProps, FloatingTooltip, type FloatingTooltipProps, Form, FormButtons, type FormButtonsProps, FormController, type FormControllerProps, FormField, FormFieldArray, type FormFieldArrayProps, type FormFieldProps, type FormProps, FormResetButton, type FormResetButtonProps, FormSubmitButton, Grid, type GridProps, Heading, type HeadingProps, type HoverButtonProps, HoverTrigger, Icon, IconLabel, type IconLabelProps, type IconProps, Image, type ImageProps, InlineEditField, type InlineEditFieldProps, Label, type LabelProps, List, ListItem, type ListItemProps, type ListProps, ListSection, type ListSectionProps, ListSeparator, Loading, LoadingButton, type LoadingButtonProps, type LoadingProps, Menu, MenuItem, type MenuItemProps, type MenuProps, MenuSection, type MenuSectionProps, MenuSeparator, Modal, type ModalProps, NavMenu, NavMenuGroup, type NavMenuGroupProps, NavMenuItem, type NavMenuItemProps, type NavMenuProps, Navbar, NavbarContext, NavbarItem, type NavbarItemProps, type NavbarProps, type NavigationContext, PasswordField, type PasswordFieldProps, Popover, ProgressBar, type ProgressBarProps, ProgressCircle, type ProgressCircleProps, Radio, RadioGroup, type RadioGroupProps, Row, type RowProps, SearchField, type SearchFieldProps, Select, type SelectProps, Sidebar, SidebarHeader, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, Slider, type SliderProps, Slot, Spinner, type SpinnerProps, StatusLight, type StatusLightProps, SubMenuTrigger, type SubmenuTriggerProps, Switch, type SwitchProps, Tab, TabList, TabPanel, Table, TableBody, TableCell, type TableCellProps, TableColumn, type TableColumnProps, TableHeader, TableRow, Tabs, Text, TextField, type TextFieldProps, type TextProps, ThemeButton, Toast, type ToastOptions, type ToastProps, ToastProvider, type ToastProviderProps, type ToastState, type ToastVariant, Toaster, type ToasterProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipBubble, type TooltipBubbleProps, type TooltipProps, ZenProvider, type ZenProviderProps, useBreakpoint, useDebounce, useNavigationContext, useTheme, useToast };
+export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, AlertBanner, type AlertBannerProps, AlertDialog, type AlertDialogProps, Blockquote, type BlockquoteProps, Box, type BoxProps, Breadcrumb, Breadcrumbs, type BreakpointKey, Button, type ButtonProps, Calendar, type CalendarProps, Checkbox, type CheckboxProps, Code, type CodeProps, Column, type ColumnProps, ComboBox, type ComboBoxProps, ConfirmationDialog, type ConfirmationDialogProps, Container, type ContainerProps, CopyButton, type CopyButtonProps, DataCard, type DataCardProps, DataColumn, type DataColumnProps, DataTable, type DataTableProps, Dialog, type DialogProps, Dots, type DotsProps, Flexbox, type FlexboxProps, FloatingTooltip, type FloatingTooltipProps, Form, FormButtons, type FormButtonsProps, FormController, type FormControllerProps, FormField, FormFieldArray, type FormFieldArrayProps, type FormFieldProps, type FormProps, FormResetButton, type FormResetButtonProps, FormSubmitButton, Grid, type GridProps, Heading, type HeadingProps, type HoverButtonProps, HoverTrigger, Icon, IconLabel, type IconLabelProps, type IconProps, Image, type ImageProps, InlineEditField, type InlineEditFieldProps, Label, type LabelProps, List, ListItem, type ListItemProps, type ListProps, ListSection, type ListSectionProps, ListSeparator, Loading, LoadingButton, type LoadingButtonProps, type LoadingProps, Menu, MenuItem, type MenuItemProps, type MenuProps, MenuSection, type MenuSectionProps, MenuSeparator, Modal, type ModalProps, NavMenu, NavMenuGroup, type NavMenuGroupProps, NavMenuItem, type NavMenuItemProps, type NavMenuProps, Navbar, NavbarContext, NavbarItem, type NavbarItemProps, type NavbarProps, type NavigationContext, PasswordField, type PasswordFieldProps, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, ProgressCircle, type ProgressCircleProps, Radio, RadioGroup, type RadioGroupProps, Row, type RowProps, SearchField, type SearchFieldProps, Select, type SelectProps, Sidebar, SidebarHeader, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, Slider, type SliderProps, Slot, Spinner, type SpinnerProps, StatusLight, type StatusLightProps, SubMenuTrigger, type SubmenuTriggerProps, Switch, type SwitchProps, Tab, TabList, TabPanel, Table, TableBody, TableCell, type TableCellProps, TableColumn, type TableColumnProps, TableHeader, TableRow, Tabs, Text, TextField, type TextFieldProps, type TextProps, type Theme, ThemeButton, Toast, ToastContext, type ToastOptions, type ToastPosition, type ToastProps, ToastProvider, type ToastProviderProps, type ToastState, type ToastVariant, Toaster, type ToasterProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipBubble, type TooltipBubbleProps, type TooltipProps, ZenProvider, type ZenProviderProps, removeToast, useBreakpoint, useDebounce, useInitTheme, useNavigationContext, useTheme, useToast };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { ButtonProps as ButtonProps$1, DisclosureGroupProps, DisclosureProps, DialogProps as DialogProps$1, BreadcrumbsProps, BreadcrumbProps, CalendarProps as CalendarProps$1, CheckboxProps as CheckboxProps$1, ListBoxProps, ListBoxItemProps, SeparatorProps, ListBoxSectionProps, ComboBoxProps as ComboBoxProps$1, ListBoxRenderProps, PopoverProps, TableProps, TooltipProps as TooltipProps$1, LabelProps as LabelProps$1, MenuProps as MenuProps$1, MenuItemProps as MenuItemProps$1, MenuSectionProps as MenuSectionProps$1, SubmenuTriggerProps as SubmenuTriggerProps$1, ModalOverlayProps, ModalRenderProps, TextFieldProps as TextFieldProps$1, ProgressBarProps as ProgressBarProps$1, RadioProps, RadioGroupProps as RadioGroupProps$1, SearchFieldProps as SearchFieldProps$1, SelectProps as SelectProps$1, SelectValueRenderProps, SliderProps as SliderProps$1, SwitchProps as SwitchProps$1, TableHeaderProps, TableBodyProps, RowProps as RowProps$1, ColumnProps as ColumnProps$1, CellProps, TabsProps, TabListProps, TabProps, TabPanelProps, ToggleButtonProps, TagGroupProps, TagProps } from 'react-aria-components';
-export { BreadcrumbProps, BreadcrumbsProps, DialogTrigger, FileTrigger, Focusable, MenuTrigger, PopoverProps, Pressable, RadioProps, RouterProvider, Selection, SubmenuTrigger, TabListProps, TabPanelProps, TabProps, TableBodyProps, TabsProps, TooltipTrigger } from 'react-aria-components';
+import { ButtonProps as ButtonProps$1, DisclosureGroupProps, DisclosureProps, DialogProps as DialogProps$1, BreadcrumbProps, BreadcrumbsProps, CalendarProps as CalendarProps$1, CheckboxProps as CheckboxProps$1, ListBoxProps, ListBoxItemProps, SeparatorProps, ListBoxSectionProps, ComboBoxProps as ComboBoxProps$1, ListBoxRenderProps, PopoverProps as PopoverProps$1, TableProps, TooltipProps as TooltipProps$1, LabelProps as LabelProps$1, MenuProps as MenuProps$1, MenuItemProps as MenuItemProps$1, MenuSectionProps as MenuSectionProps$1, SubmenuTriggerProps as SubmenuTriggerProps$1, ModalOverlayProps, ModalRenderProps, TextFieldProps as TextFieldProps$1, ProgressBarProps as ProgressBarProps$1, RadioGroupProps as RadioGroupProps$1, RadioProps, SearchFieldProps as SearchFieldProps$1, SelectProps as SelectProps$1, SelectValueRenderProps, SliderProps as SliderProps$1, SwitchProps as SwitchProps$1, TableHeaderProps, TableBodyProps, RowProps as RowProps$1, ColumnProps as ColumnProps$1, CellProps, TabsProps, TabListProps, TabProps, TabPanelProps, ToggleButtonProps, TagGroupProps, TagProps } from 'react-aria-components';
+export { BreadcrumbProps, BreadcrumbsProps, DialogTrigger, FileTrigger, Focusable, MenuTrigger, Pressable, RadioProps, RouterProvider, Selection, SubmenuTrigger, TabListProps, TabPanelProps, TabProps, TableBodyProps, TabsProps, TooltipTrigger } from 'react-aria-components';
 import * as react from 'react';
 import { HTMLAttributes, ReactNode, ReactElement, Dispatch, SetStateAction } from 'react';
 import { UseFormProps, SubmitHandler, UseFormReturn, ControllerProps, ControllerRenderProps, FieldValues, ControllerFieldState, UseFormStateReturn, RegisterOptions } from 'react-hook-form';
@@ -219,6 +219,7 @@ declare function Toaster({ duration, position }: ToasterProps): react.JSX.Elemen
 interface ToastProviderProps extends ToasterProps {
     children: ReactNode;
 }
+declare const ToastContext: react.Context<{}>;
 declare function ToastProvider({ children, ...props }: ToastProviderProps): react.JSX.Element;
 
 declare function useDebounce(value: string, delay: number): string;
@@ -230,6 +231,7 @@ interface ThemeState {
     initTheme: (preferred?: Theme, colorScheme?: 'light' | 'dark' | 'system') => void;
 }
 declare const useTheme: zustand.UseBoundStore<zustand.StoreApi<ThemeState>>;
+declare function useInitTheme(preferred?: Theme, colorScheme?: 'light' | 'dark' | 'system'): void;
 
 type ToastVariant = 'success' | 'error';
 interface ToastOptions {
@@ -245,6 +247,7 @@ interface ToastState extends ToastOptions {
     message: string;
     timestamp: number;
 }
+declare function removeToast(id: string): void;
 declare function useToast(): {
     toast: (message: string, options?: ToastOptions) => void;
     toasts: ToastState[];
@@ -332,11 +335,12 @@ interface ListProps extends ListBoxProps<any> {
     separatorProperty?: string;
     highlightColor?: string;
     showCheckmark?: boolean;
+    isFullscreen?: boolean;
     label?: string;
     value?: string[];
     onChange?: (value: string[]) => void;
 }
-declare function List({ id, items, idProperty, labelProperty, separatorProperty, highlightColor, showCheckmark, label, value, onChange, className, selectedKeys, defaultSelectedKeys, onSelectionChange, style, children, ...props }: ListProps): react.JSX.Element;
+declare function List({ id, items, idProperty, labelProperty, separatorProperty, highlightColor, showCheckmark, isFullscreen, label, value, onChange, className, selectedKeys, defaultSelectedKeys, onSelectionChange, style, children, ...props }: ListProps): react.JSX.Element;
 interface ListItemProps extends ListBoxItemProps<any> {
     showCheckmark?: boolean;
 }
@@ -351,7 +355,7 @@ interface ComboBoxProps extends ComboBoxProps$1<any> {
     items?: any[];
     renderEmptyState?: (props: ListBoxRenderProps) => ReactNode;
     listProps?: ListProps;
-    popoverProps?: PopoverProps;
+    popoverProps?: PopoverProps$1;
 }
 declare function ComboBox({ items, className, renderEmptyState, listProps, popoverProps, children, ...props }: ComboBoxProps): react.JSX.Element;
 
@@ -602,7 +606,10 @@ interface PasswordFieldProps extends TextFieldProps$1 {
 }
 declare function PasswordField({ label, className, ...props }: PasswordFieldProps): react.JSX.Element;
 
-declare function Popover({ children, className, ...props }: PopoverProps): react.JSX.Element;
+interface PopoverProps extends PopoverProps$1 {
+    isFullscreen?: boolean;
+}
+declare function Popover({ children, isFullscreen, className, ...props }: PopoverProps): react.JSX.Element;
 
 interface ProgressBarProps extends ProgressBarProps$1 {
     showPercentage?: boolean;
@@ -642,16 +649,17 @@ interface SelectProps extends SelectProps$1<HTMLSelectElement> {
     allowSearch?: boolean;
     searchValue?: string;
     searchDelay?: number;
+    isFullscreen?: boolean;
     onSearch?: (value: string) => void;
     onChange?: (e: any) => void;
     buttonProps?: ButtonProps;
     listProps?: ListProps;
-    popoverProps?: PopoverProps;
+    popoverProps?: PopoverProps$1;
     renderValue?: ReactNode | ((values: SelectValueRenderProps<object> & {
         defaultChildren: ReactNode;
     }) => ReactNode);
 }
-declare function Select({ items, value, defaultValue, label, isLoading, allowSearch, searchValue, searchDelay, onSearch, onSelectionChange, onChange, buttonProps, listProps, popoverProps, renderValue, className, children, ...props }: SelectProps): react.JSX.Element;
+declare function Select({ items, value, defaultValue, label, isLoading, allowSearch, searchValue, searchDelay, isFullscreen, onSearch, onChange, buttonProps, listProps, popoverProps, renderValue, className, children, ...props }: SelectProps): react.JSX.Element;
 
 interface SidebarProps extends ColumnProps {
     itemBackgroundColor?: string;
@@ -764,4 +772,4 @@ interface ZenProviderProps {
 }
 declare function ZenProvider({ children, theme, colorScheme, toast, }: ZenProviderProps): react.JSX.Element;
 
-export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, AlertBanner, type AlertBannerProps, AlertDialog, type AlertDialogProps, Blockquote, type BlockquoteProps, Box, type BoxProps, Breadcrumb, Breadcrumbs, type BreakpointKey, Button, type ButtonProps, Calendar, type CalendarProps, Checkbox, type CheckboxProps, Code, type CodeProps, Column, type ColumnProps, ComboBox, type ComboBoxProps, ConfirmationDialog, type ConfirmationDialogProps, Container, type ContainerProps, CopyButton, DataCard, DataColumn, type DataColumnProps, DataTable, type DataTableProps, Dialog, type DialogProps, Dots, type DotsProps, Flexbox, type FlexboxProps, FloatingTooltip, type FloatingTooltipProps, Form, FormButtons, type FormButtonsProps, FormController, type FormControllerProps, FormField, FormFieldArray, type FormFieldArrayProps, type FormFieldProps, type FormProps, FormResetButton, type FormResetButtonProps, FormSubmitButton, Grid, type GridProps, Heading, type HeadingProps, type HoverButtonProps, HoverTrigger, Icon, IconLabel, type IconLabelProps, type IconProps, Image, type ImageProps, InlineEditField, type InlineEditFieldProps, Label, type LabelProps, List, ListItem, type ListItemProps, type ListProps, ListSection, type ListSectionProps, ListSeparator, Loading, LoadingButton, type LoadingButtonProps, type LoadingProps, Menu, MenuItem, type MenuItemProps, type MenuProps, MenuSection, type MenuSectionProps, MenuSeparator, Modal, type ModalProps, NavMenu, NavMenuGroup, type NavMenuGroupProps, NavMenuItem, type NavMenuItemProps, type NavMenuProps, Navbar, NavbarContext, NavbarItem, type NavbarItemProps, type NavbarProps, type NavigationContext, PasswordField, type PasswordFieldProps, Popover, ProgressBar, type ProgressBarProps, ProgressCircle, type ProgressCircleProps, Radio, RadioGroup, type RadioGroupProps, Row, type RowProps, SearchField, type SearchFieldProps, Select, type SelectProps, Sidebar, SidebarHeader, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, Slider, type SliderProps, Slot, Spinner, type SpinnerProps, StatusLight, type StatusLightProps, SubMenuTrigger, type SubmenuTriggerProps, Switch, type SwitchProps, Tab, TabList, TabPanel, Table, TableBody, TableCell, type TableCellProps, TableColumn, type TableColumnProps, TableHeader, TableRow, Tabs, Text, TextField, type TextFieldProps, type TextProps, ThemeButton, Toast, type ToastOptions, type ToastProps, ToastProvider, type ToastProviderProps, type ToastState, type ToastVariant, Toaster, type ToasterProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipBubble, type TooltipBubbleProps, type TooltipProps, ZenProvider, type ZenProviderProps, useBreakpoint, useDebounce, useNavigationContext, useTheme, useToast };
+export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, AlertBanner, type AlertBannerProps, AlertDialog, type AlertDialogProps, Blockquote, type BlockquoteProps, Box, type BoxProps, Breadcrumb, Breadcrumbs, type BreakpointKey, Button, type ButtonProps, Calendar, type CalendarProps, Checkbox, type CheckboxProps, Code, type CodeProps, Column, type ColumnProps, ComboBox, type ComboBoxProps, ConfirmationDialog, type ConfirmationDialogProps, Container, type ContainerProps, CopyButton, type CopyButtonProps, DataCard, type DataCardProps, DataColumn, type DataColumnProps, DataTable, type DataTableProps, Dialog, type DialogProps, Dots, type DotsProps, Flexbox, type FlexboxProps, FloatingTooltip, type FloatingTooltipProps, Form, FormButtons, type FormButtonsProps, FormController, type FormControllerProps, FormField, FormFieldArray, type FormFieldArrayProps, type FormFieldProps, type FormProps, FormResetButton, type FormResetButtonProps, FormSubmitButton, Grid, type GridProps, Heading, type HeadingProps, type HoverButtonProps, HoverTrigger, Icon, IconLabel, type IconLabelProps, type IconProps, Image, type ImageProps, InlineEditField, type InlineEditFieldProps, Label, type LabelProps, List, ListItem, type ListItemProps, type ListProps, ListSection, type ListSectionProps, ListSeparator, Loading, LoadingButton, type LoadingButtonProps, type LoadingProps, Menu, MenuItem, type MenuItemProps, type MenuProps, MenuSection, type MenuSectionProps, MenuSeparator, Modal, type ModalProps, NavMenu, NavMenuGroup, type NavMenuGroupProps, NavMenuItem, type NavMenuItemProps, type NavMenuProps, Navbar, NavbarContext, NavbarItem, type NavbarItemProps, type NavbarProps, type NavigationContext, PasswordField, type PasswordFieldProps, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, ProgressCircle, type ProgressCircleProps, Radio, RadioGroup, type RadioGroupProps, Row, type RowProps, SearchField, type SearchFieldProps, Select, type SelectProps, Sidebar, SidebarHeader, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, Slider, type SliderProps, Slot, Spinner, type SpinnerProps, StatusLight, type StatusLightProps, SubMenuTrigger, type SubmenuTriggerProps, Switch, type SwitchProps, Tab, TabList, TabPanel, Table, TableBody, TableCell, type TableCellProps, TableColumn, type TableColumnProps, TableHeader, TableRow, Tabs, Text, TextField, type TextFieldProps, type TextProps, type Theme, ThemeButton, Toast, ToastContext, type ToastOptions, type ToastPosition, type ToastProps, ToastProvider, type ToastProviderProps, type ToastState, type ToastVariant, Toaster, type ToasterProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipBubble, type TooltipBubbleProps, type TooltipProps, ZenProvider, type ZenProviderProps, removeToast, useBreakpoint, useDebounce, useInitTheme, useNavigationContext, useTheme, useToast };

package/dist/index.js

@@ -320,6 +320,7 @@ __export(index_exports, {
   TextField: () => TextField2,
   ThemeButton: () => ThemeButton,
   Toast: () => Toast,
+  ToastContext: () => ToastContext,
   ToastProvider: () => ToastProvider,
   Toaster: () => Toaster,
   Toggle: () => Toggle,
@@ -329,8 +330,10 @@ __export(index_exports, {
   TooltipBubble: () => TooltipBubble,
   TooltipTrigger: () => $4e3b923658d69c60$export$8c610744efcf8a1d,
   ZenProvider: () => ZenProvider,
+  removeToast: () => removeToast,
   useBreakpoint: () => useBreakpoint,
   useDebounce: () => useDebounce,
+  useInitTheme: () => useInitTheme,
   useNavigationContext: () => useNavigationContext,
   useTheme: () => useTheme,
   useToast: () => useToast
@@ -33346,7 +33349,7 @@ function getHighlightColor(color) {
 }
 
 // css-modules:E:\dev\umami-react-zen\src\components\List.module.css
-var List_default = { "list": "List_list__ZTRlN", "separator": "List_separator__ODIwN", "section": "List_section__MzJmN", "header": "List_header__MzRmM", "item": "List_item__ODM4N", "checkmark": "List_checkmark__NzY1N", "hideCheckmark": "List_hideCheckmark__NDhmN" };
+var List_default = { "list": "List_list__Yzk2Y", "separator": "List_separator__ODZiZ", "section": "List_section__NTI0O", "header": "List_header__MjE1Y", "item": "List_item__MzU5Y", "checkmark": "List_checkmark__YzRiZ", "hideCheckmark": "List_hideCheckmark__NDlhN", "fullscreen": "List_fullscreen__NWMyY" };
 
 // src/components/List.tsx
 var import_jsx_runtime34 = require("react/jsx-runtime");
@@ -33355,9 +33358,10 @@ function List({
   items = [],
   idProperty = "id",
   labelProperty = "label",
-  separatorProperty = "separatpr",
+  separatorProperty = "separator",
   highlightColor,
   showCheckmark = true,
+  isFullscreen,
   label,
   value,
   onChange,
@@ -33387,7 +33391,12 @@ function List({
         selectedKeys: value || selectedKeys,
         defaultSelectedKeys: value || defaultSelectedKeys,
         items,
-        className: (0, import_classnames21.default)(List_default.list, className, !showCheckmark && List_default.hideCheckmark),
+        className: (0, import_classnames21.default)(
+          List_default.list,
+          className,
+          !showCheckmark && List_default.hideCheckmark,
+          isFullscreen && List_default.fullscreen
+        ),
         onSelectionChange: handleSelectionChange,
         style: { ...style, ...getHighlightColor(highlightColor) },
         children: children || items?.map((item) => {
@@ -34305,12 +34314,19 @@ function PasswordField({ label, className, ...props }) {
 var import_classnames41 = __toESM(require_classnames());
 
 // css-modules:E:\dev\umami-react-zen\src\components\Popover.module.css
-var Popover_default = { "popover": "Popover_popover__YmFhM", "popover-slide": "Popover_popover-slide__OGZjY" };
+var Popover_default = { "popover": "Popover_popover__ZDgwN", "popover-slide": "Popover_popover-slide__NGU0N", "fullscreen": "Popover_fullscreen__MTcxY" };
 
 // src/components/Popover.tsx
 var import_jsx_runtime58 = require("react/jsx-runtime");
-function Popover2({ children, className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)($07b14b47974efb58$export$5b6b19405a83ff9d, { ...props, className: (0, import_classnames41.default)(Popover_default.popover, className), children });
+function Popover2({ children, isFullscreen, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+    $07b14b47974efb58$export$5b6b19405a83ff9d,
+    {
+      ...props,
+      className: (0, import_classnames41.default)(Popover_default.popover, isFullscreen && Popover_default.fullscreen, className),
+      children
+    }
+  );
 }
 
 // src/components/ProgressBar.tsx
@@ -34466,8 +34482,8 @@ function Select2({
   allowSearch,
   searchValue,
   searchDelay,
+  isFullscreen,
   onSearch,
-  onSelectionChange,
   onChange,
   buttonProps,
   listProps,
@@ -34479,7 +34495,6 @@ function Select2({
 }) {
   const [search, setSearch] = (0, import_react201.useState)("");
   const handleChange = (e) => {
-    onSelectionChange?.(e);
     onChange?.(e);
   };
   const handleSearch = (value2) => {
@@ -34496,9 +34511,9 @@ function Select2({
       "aria-label": "Select",
       ...props,
       className: (0, import_classnames46.default)(Select_default.select, className),
-      selectedKey: value,
-      defaultSelectedKey: defaultValue,
-      onSelectionChange: handleChange,
+      value,
+      defaultValue,
+      onChange: handleChange,
       children: [
         label && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Label2, { children: label }),
         /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
@@ -34513,7 +34528,7 @@ function Select2({
             ] })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Popover2, { ...popoverProps, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: Select_default.list, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Popover2, { ...popoverProps, onOpenChange: handleOpenChange, isFullscreen, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: Select_default.list, children: [
           allowSearch && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
             SearchField2,
             {
@@ -34531,6 +34546,7 @@ function Select2({
             {
               ...listProps,
               items,
+              isFullscreen,
               style: { ...listProps?.style, display: isLoading ? "none" : void 0 },
               children
             }

package/dist/index.mjs

@@ -33224,7 +33224,7 @@ function getHighlightColor(color) {
 }
 
 // css-modules:E:\dev\umami-react-zen\src\components\List.module.css
-var List_default = { "list": "List_list__ZTRlN", "separator": "List_separator__ODIwN", "section": "List_section__MzJmN", "header": "List_header__MzRmM", "item": "List_item__ODM4N", "checkmark": "List_checkmark__NzY1N", "hideCheckmark": "List_hideCheckmark__NDhmN" };
+var List_default = { "list": "List_list__Yzk2Y", "separator": "List_separator__ODZiZ", "section": "List_section__NTI0O", "header": "List_header__MjE1Y", "item": "List_item__MzU5Y", "checkmark": "List_checkmark__YzRiZ", "hideCheckmark": "List_hideCheckmark__NDlhN", "fullscreen": "List_fullscreen__NWMyY" };
 
 // src/components/List.tsx
 import { Fragment as Fragment4, jsx as jsx34, jsxs as jsxs18 } from "react/jsx-runtime";
@@ -33233,9 +33233,10 @@ function List({
   items = [],
   idProperty = "id",
   labelProperty = "label",
-  separatorProperty = "separatpr",
+  separatorProperty = "separator",
   highlightColor,
   showCheckmark = true,
+  isFullscreen,
   label,
   value,
   onChange,
@@ -33265,7 +33266,12 @@ function List({
         selectedKeys: value || selectedKeys,
         defaultSelectedKeys: value || defaultSelectedKeys,
         items,
-        className: (0, import_classnames21.default)(List_default.list, className, !showCheckmark && List_default.hideCheckmark),
+        className: (0, import_classnames21.default)(
+          List_default.list,
+          className,
+          !showCheckmark && List_default.hideCheckmark,
+          isFullscreen && List_default.fullscreen
+        ),
         onSelectionChange: handleSelectionChange,
         style: { ...style, ...getHighlightColor(highlightColor) },
         children: children || items?.map((item) => {
@@ -34187,12 +34193,19 @@ function PasswordField({ label, className, ...props }) {
 var import_classnames41 = __toESM(require_classnames());
 
 // css-modules:E:\dev\umami-react-zen\src\components\Popover.module.css
-var Popover_default = { "popover": "Popover_popover__YmFhM", "popover-slide": "Popover_popover-slide__OGZjY" };
+var Popover_default = { "popover": "Popover_popover__ZDgwN", "popover-slide": "Popover_popover-slide__NGU0N", "fullscreen": "Popover_fullscreen__MTcxY" };
 
 // src/components/Popover.tsx
 import { jsx as jsx58 } from "react/jsx-runtime";
-function Popover2({ children, className, ...props }) {
-  return /* @__PURE__ */ jsx58($07b14b47974efb58$export$5b6b19405a83ff9d, { ...props, className: (0, import_classnames41.default)(Popover_default.popover, className), children });
+function Popover2({ children, isFullscreen, className, ...props }) {
+  return /* @__PURE__ */ jsx58(
+    $07b14b47974efb58$export$5b6b19405a83ff9d,
+    {
+      ...props,
+      className: (0, import_classnames41.default)(Popover_default.popover, isFullscreen && Popover_default.fullscreen, className),
+      children
+    }
+  );
 }
 
 // src/components/ProgressBar.tsx
@@ -34348,8 +34361,8 @@ function Select2({
   allowSearch,
   searchValue,
   searchDelay,
+  isFullscreen,
   onSearch,
-  onSelectionChange,
   onChange,
   buttonProps,
   listProps,
@@ -34361,7 +34374,6 @@ function Select2({
 }) {
   const [search, setSearch] = useState19("");
   const handleChange = (e) => {
-    onSelectionChange?.(e);
     onChange?.(e);
   };
   const handleSearch = (value2) => {
@@ -34378,9 +34390,9 @@ function Select2({
       "aria-label": "Select",
       ...props,
       className: (0, import_classnames46.default)(Select_default.select, className),
-      selectedKey: value,
-      defaultSelectedKey: defaultValue,
-      onSelectionChange: handleChange,
+      value,
+      defaultValue,
+      onChange: handleChange,
       children: [
         label && /* @__PURE__ */ jsx63(Label2, { children: label }),
         /* @__PURE__ */ jsx63(
@@ -34395,7 +34407,7 @@ function Select2({
             ] })
           }
         ),
-        /* @__PURE__ */ jsx63(Popover2, { ...popoverProps, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs38("div", { className: Select_default.list, children: [
+        /* @__PURE__ */ jsx63(Popover2, { ...popoverProps, onOpenChange: handleOpenChange, isFullscreen, children: /* @__PURE__ */ jsxs38("div", { className: Select_default.list, children: [
           allowSearch && /* @__PURE__ */ jsx63(
             SearchField2,
             {
@@ -34413,6 +34425,7 @@ function Select2({
             {
               ...listProps,
               items,
+              isFullscreen,
               style: { ...listProps?.style, display: isLoading ? "none" : void 0 },
               children
             }
@@ -34823,6 +34836,7 @@ export {
   TextField2 as TextField,
   ThemeButton,
   Toast,
+  ToastContext,
   ToastProvider,
   Toaster,
   Toggle,
@@ -34832,8 +34846,10 @@ export {
   TooltipBubble,
   $4e3b923658d69c60$export$8c610744efcf8a1d as TooltipTrigger,
   ZenProvider,
+  removeToast,
   useBreakpoint,
   useDebounce,
+  useInitTheme,
   useNavigationContext,
   useTheme,
   useToast

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umami/react-zen",
-  "version": "0.200.0",
+  "version": "0.201.0",
   "description": "Modern, minimalist React component library",
   "author": "Umami <hello@umami.is>",
   "license": "MIT",

package/styles.css

@@ -4038,24 +4038,24 @@ body a.Button_button__NGQyO {
 }
 
 /* virtual-css:css:0fb02723d81c5960ed149d3d9f58f1ba */
-.List_list__ZTRlN {
+.List_list__Yzk2Y {
   display: grid;
   outline: none;
   overflow: auto;
   gap: var(--spacing-1);
 }
-.List_separator__ODIwN {
+.List_separator__ODZiZ {
   border-bottom: var(--border);
 }
-.List_section__MzJmN:not(:last-child) {
+.List_section__NTI0O:not(:last-child) {
   margin-bottom: var(--spacing-4);
 }
-.List_header__MzRmM {
+.List_header__MjE1Y {
   font-size: var(--font-size-3);
   font-weight: var(--font-weight-bold);
   padding: var(--padding);
 }
-.List_item__ODM4N {
+.List_item__MzU5Y {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -4068,29 +4068,40 @@ body a.Button_button__NGQyO {
   outline: none;
   border-radius: var(--border-radius);
 }
-.List_item__ODM4N[data-disabled] {
+.List_item__MzU5Y[data-disabled] {
   color: var(--font-color-disabled);
 }
-.List_item__ODM4N[data-focus],
-.List_item__ODM4N[data-focus-visible] {
+.List_item__MzU5Y[data-focus],
+.List_item__MzU5Y[data-focus-visible] {
   background: var(--highlight-color);
 }
-.List_item__ODM4N:hover {
+.List_item__MzU5Y:hover {
   background: var(--highlight-color);
 }
-.List_item__ODM4N[data-selected] {
+.List_item__MzU5Y[data-selected] {
   font-weight: bold;
-  & .List_checkmark__NzY1N {
+  & .List_checkmark__YzRiZ {
     display: flex;
     justify-content: flex-end;
   }
 }
-.List_checkmark__NzY1N {
+.List_checkmark__YzRiZ {
   display: none;
 }
-.List_hideCheckmark__NDhmN .List_checkmark__NzY1N {
+.List_hideCheckmark__NDlhN .List_checkmark__YzRiZ {
   display: none;
 }
+.List_fullscreen__NWMyY {
+  display: block;
+  padding: var(--spacing-3);
+  border: 0;
+  border-radius: 0;
+  position: fixed;
+  inset: 0;
+  overflow: auto;
+  z-index: 9999;
+  background: var(--background-color);
+}
 
 /* virtual-css:css:8ac5a8adaf8e8de9ae56ee4600f2cfaa */
 .ComboBox_combobox__ZDYxZ {
@@ -4834,25 +4845,25 @@ body a.Button_button__NGQyO {
 }
 
 /* virtual-css:css:f94974973c639ccc39a8a6465cbebeb2 */
-.Popover_popover__YmFhM[data-placement=top] {
+.Popover_popover__ZDgwN[data-placement=top] {
   --origin: translateY(8px);
 }
-.Popover_popover__YmFhM[data-placement=bottom] {
+.Popover_popover__ZDgwN[data-placement=bottom] {
   --origin: translateY(-8px);
 }
-.Popover_popover__YmFhM[data-placement=right] {
+.Popover_popover__ZDgwN[data-placement=right] {
   --origin: translateX(-8px);
 }
-.Popover_popover__YmFhM[data-placement=left] {
+.Popover_popover__ZDgwN[data-placement=left] {
   --origin: translateX(8px);
 }
-.Popover_popover__YmFhM[data-entering] {
-  animation: Popover_popover-slide__OGZjY 200ms;
+.Popover_popover__ZDgwN[data-entering] {
+  animation: Popover_popover-slide__NGU0N 200ms;
 }
-.Popover_popover__YmFhM[data-exiting] {
-  animation: Popover_popover-slide__OGZjY 200ms reverse ease-in;
+.Popover_popover__ZDgwN[data-exiting] {
+  animation: Popover_popover-slide__NGU0N 200ms reverse ease-in;
 }
-@keyframes Popover_popover-slide__OGZjY {
+@keyframes Popover_popover-slide__NGU0N {
   from {
     transform: var(--origin);
     opacity: 0;
@@ -4862,6 +4873,15 @@ body a.Button_button__NGQyO {
     opacity: 1;
   }
 }
+.Popover_fullscreen__MTcxY {
+  display: block;
+  border: 0;
+  border-radius: 0;
+  position: fixed;
+  inset: 0;
+  overflow: auto;
+  z-index: 9999;
+}
 
 /* virtual-css:css:0e892dc2f62a700ee33f11aa6f8910ef */
 .ProgressBar_progressbar__YzdlO {