@pega/cosmos-react-core 3.0.0-dev.5.0 → 3.0.0-dev.8.0

package/lib/components/SearchInput/SearchInput.js

@@ -1,132 +1,107 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { forwardRef, useState, useCallback, useEffect, useRef } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useState, useCallback, useEffect } from 'react';
+import styled, { css } from 'styled-components';
+import { transparentize } from 'polished';
+import { defaultThemeProp } from '../../theme';
+import Input from '../Input';
 import Icon, { registerIcon } from '../Icon';
 import * as searchIcon from '../Icon/icons/search.icon';
-import { useAfterInitialEffect, useConsolidatedRef, useI18n, useOuterEvent } from '../../hooks';
+import { useAfterInitialEffect, useConsolidatedRef, useI18n } from '../../hooks';
 import Flex from '../Flex';
-import Popover from '../Popover';
-import { sameWidth } from '../Popover/modifiers';
-import Menu from '../Menu';
-import Link from '../Link';
-import Text from '../Text';
-import { StyledCancelButton, StyledSearchButton, StyledSearchFilterText, StyledSearchInput, StyledSearchMenu, StyledSearchTextInput } from './SearchInput.styles';
+import { tryCatch } from '../../utils';
 registerIcon(searchIcon);
+export const StyledSearchIcon = styled.div(props => {
+    const { theme: { base, components: { 'search-input': searchInput, 'form-control': formControl } } } = props;
+    const iconColor = tryCatch(() => transparentize(0.75, base.palette['foreground-color']));
+    return css `
+    position: absolute;
+    z-index: 1;
+    inset-inline-start: 0.0625rem;
+    top: 0.0625rem;
+    width: calc(${base['hit-area']['mouse-min']} - 0.125rem);
+    height: calc(${base['hit-area']['mouse-min']} - 0.125rem);
+    border-radius: calc(${base['border-radius']} * ${searchInput['border-radius']});
+    padding: 0;
+    background: ${formControl['background-color']};
+    color: ${iconColor};
+    cursor: text;
+    line-height: 1;
+  `;
+});
+StyledSearchIcon.defaultProps = defaultThemeProp;
+export const StyledSearchTextInput = styled(Input)(props => {
+    const { theme } = props;
+    const comp = theme.components['search-input'];
+    return css `
+    position: relative;
+    width: 100%;
+    height: ${theme.base['hit-area']['mouse-min']};
+    min-height: ${theme.base['hit-area']['mouse-min']};
+    padding-inline-start: 0;
+    padding-inline-end: calc(${theme.base['hit-area']['mouse-min']} - 0.125rem);
+    text-indent: calc(${theme.base['hit-area']['mouse-min']} - 0.125rem);
+    border-radius: calc(${comp['border-radius']} * ${theme.base['border-radius']});
+    &::-ms-clear {
+      display: none;
+    }
+    &::-webkit-search-cancel-button {
+      display: none;
+    }
+    ::-webkit-search-decoration {
+      -webkit-appearance: none;
+    }
+
+    &:focus:not([disabled]) {
+      box-shadow: none;
+    }
+  `;
+});
+StyledSearchTextInput.defaultProps = defaultThemeProp;
+export const StyledSearchInput = styled.div(({ theme: { base, components } }) => {
+    const iconColor = tryCatch(() => transparentize(0.3, base.palette['foreground-color']));
+    return css `
+    position: relative;
+    height: ${base['hit-area']['mouse-min']};
+    border-radius: calc(${components['search-input']['border-radius']} * ${base['border-radius']});
+
+    &:focus-within {
+      box-shadow: ${base.shadow.focus};
+
+      ${StyledSearchIcon} {
+        color: ${iconColor};
+      }
+    }
+  `;
+});
+StyledSearchInput.defaultProps = defaultThemeProp;
 const SearchInput = forwardRef((props, ref) => {
     const t = useI18n();
-    const { defaultValue, value, defaultFilter, filters, onFilterChange, searchResults, recentSearches, loading, advancedSearchHref, placeholder = t('search_placeholder_default'), onSearchChange, onSearchSubmit, searchInputAriaLabel, ...restProps } = props;
+    const { defaultValue, value, placeholder = t('search_placeholder_default'), onSearchChange, onSearchSubmit, searchInputAriaLabel, ...restProps } = props;
     const [searchInputValue, setValue] = useState(value || defaultValue || '');
-    const [searchMenuOpen, setSearchMenuOpen] = useState(false);
-    const [filterMenuOpen, setFilterMenuOpen] = useState(false);
     const innerRef = useConsolidatedRef(ref);
-    const createDefaultFilters = useCallback(() => {
-        if (filters && filters.length) {
-            return [t('all'), ...filters];
-        }
-        return [];
-    }, [filters]);
-    const filterRef = useRef(null);
-    const [selectedFilter, setSelectedFilter] = useState(() => defaultFilter || '');
-    const [completeFilters, setCompleteFilters] = useState(createDefaultFilters);
-    const hasFilters = !!completeFilters.length;
-    const [searchResultItems, setSearchResultItems] = useState(undefined);
-    const [downPressed, setDownPressed] = useState(false);
-    const hasSearchResults = !!(searchResults && searchResults.length);
-    const hasRecentSearches = !!(recentSearches && recentSearches.length);
-    useOuterEvent('click', [filterRef], () => {
-        setFilterMenuOpen(false);
-    });
     useEffect(() => {
         if (typeof value === 'string' && value !== searchInputValue) {
             setValue(value);
         }
     }, [value]);
-    useEffect(() => {
-        setDownPressed(false);
-    }, [searchInputValue]);
-    useEffect(() => {
-        setCompleteFilters(createDefaultFilters());
-    }, [filters]);
     const onChange = useCallback((e) => {
         setValue(e.target.value);
     }, [searchInputValue]);
-    const onSubmit = () => {
+    const onSubmit = useCallback(() => {
         onSearchSubmit?.(searchInputValue);
-    };
+    }, [searchInputValue]);
     const onKeyDown = useCallback((e) => {
         if (e.key === 'Enter') {
             onSubmit();
         }
-        if (e.key === 'ArrowDown') {
-            setDownPressed(true);
-        }
-    }, []);
+    }, [searchInputValue]);
     useAfterInitialEffect(() => {
         if (onSearchChange)
             onSearchChange(searchInputValue);
     }, [searchInputValue]);
-    useEffect(() => {
-        let items = [];
-        if (hasSearchResults && searchInputValue) {
-            items = searchResults.map(res => ({
-                id: res.id,
-                primary: res.primary,
-                secondary: res.secondary,
-                href: res.href,
-                onClick: res.onClick
-            }));
-        }
-        else if (hasRecentSearches && !searchInputValue) {
-            items = recentSearches.map(recentSearch => ({
-                id: recentSearch.primary,
-                primary: recentSearch.primary,
-                href: recentSearch.href,
-                onClick: recentSearch.onClick
-            }));
-        }
-        else if (!searchResults && (!recentSearches || recentSearches.length === 0)) {
-            items = undefined;
-        }
-        setSearchResultItems(items);
-    }, [searchResults, recentSearches, searchMenuOpen]);
-    return (_jsxs(_Fragment, { children: [_jsxs(Flex, { container: true, as: StyledSearchInput, hasFilters: hasFilters, children: [_jsxs(Flex, { as: StyledSearchButton, ref: filterRef, forwardedAs: filters && filters.length ? undefined : 'div', container: {
-                            justify: 'center',
-                            alignItems: 'center',
-                            gap: selectedFilter ? 0.5 : undefined
-                        }, onClick: () => {
-                            if (hasFilters) {
-                                setFilterMenuOpen(true);
-                            }
-                            else {
-                                innerRef.current?.focus();
-                            }
-                        }, decoupled: hasFilters, "aria-label": t('select_search_filter'), children: [_jsx(Icon, { name: 'search' }), selectedFilter && _jsx(StyledSearchFilterText, { children: selectedFilter }), hasFilters && _jsx(Icon, { name: 'arrow-micro-down' })] }), _jsx(StyledSearchTextInput, { ref: innerRef, type: 'search', "aria-label": searchInputAriaLabel, placeholder: placeholder, ...restProps, value: searchInputValue, onChange: onChange, onKeyDown: onKeyDown, onFocus: () => setSearchMenuOpen(true), decoupled: hasFilters, onBlur: () => {
-                            setDownPressed(false);
-                            setSearchMenuOpen(false);
-                        } }), searchInputValue && (_jsx(StyledCancelButton, { icon: true, onClick: () => {
-                            setValue('');
-                        }, variant: 'text', tabIndex: 0, "aria-label": t('clear_search'), children: _jsx(Icon, { name: 'times' }) }))] }), (searchResultItems || loading) && (_jsx(Popover, { target: innerRef.current, show: searchMenuOpen, placement: 'bottom-start', modifiers: [
-                    {
-                        name: 'flip',
-                        options: {
-                            fallbackPlacements: ['top-start']
-                        }
-                    },
-                    sameWidth
-                ], children: _jsx(Menu, { as: StyledSearchMenu, header: recentSearches && !value ? (_jsx(Text, { variant: 'secondary', children: t('recent_searches') })) : undefined, mode: 'action', items: searchResultItems ?? [], loading: hasRecentSearches && !value ? false : loading, footer: advancedSearchHref ? (_jsx(Link, { href: advancedSearchHref, children: t('advanced_search') })) : undefined, accent: hasSearchResults ? new RegExp(value || '', 'g') : undefined, focusControlEl: (downPressed && innerRef.current) || undefined, focusElOnClose: true }) })), hasFilters ? (_jsx(Popover, { target: filterRef.current, show: filterMenuOpen, placement: 'bottom-start', modifiers: [
-                    {
-                        name: 'flip',
-                        options: {
-                            fallbackPlacements: ['top-start']
-                        }
-                    }
-                ], children: _jsx(Menu, { mode: 'single-select', items: completeFilters.map(filter => ({
-                        primary: filter,
-                        id: filter,
-                        selected: filter === 'All' ? selectedFilter === '' : selectedFilter === filter
-                    })), onItemClick: id => {
-                        setSelectedFilter(id === 'All' ? '' : id);
-                        onFilterChange?.(id);
-                    }, focusControlEl: filterRef.current || undefined }) })) : undefined] }));
+    return (_jsxs(Flex, { container: true, as: StyledSearchInput, children: [_jsx(StyledSearchTextInput, { ref: innerRef, type: 'search', "aria-label": searchInputAriaLabel, placeholder: placeholder, ...restProps, value: searchInputValue, onChange: onChange, onKeyDown: onKeyDown }), _jsx(Flex, { as: StyledSearchIcon, container: { justify: 'center', alignItems: 'center' }, onClick: () => {
+                    innerRef.current?.focus();
+                }, children: _jsx(Icon, { name: 'search' }) })] }));
 });
 export default SearchInput;
 //# sourceMappingURL=SearchInput.js.map

package/lib/components/SearchInput/SearchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  forwardRef,\n  useState,\n  ChangeEvent,\n  useCallback,\n  KeyboardEvent,\n  useEffect,\n  useRef\n} from 'react';\n\nimport { ForwardProps, NoChildrenProp } from '../../types';\nimport Icon, { registerIcon } from '../Icon';\nimport * as searchIcon from '../Icon/icons/search.icon';\nimport { FormControlProps } from '../FormControl';\nimport { useAfterInitialEffect, useConsolidatedRef, useI18n, useOuterEvent } from '../../hooks';\nimport Flex from '../Flex';\nimport Popover from '../Popover';\nimport { sameWidth } from '../Popover/modifiers';\nimport Menu, { MenuItemProps } from '../Menu';\nimport Link from '../Link';\nimport Text from '../Text';\n\nimport {\n  StyledCancelButton,\n  StyledSearchButton,\n  StyledSearchFilterText,\n  StyledSearchInput,\n  StyledSearchMenu,\n  StyledSearchTextInput\n} from './SearchInput.styles';\n\nregisterIcon(searchIcon);\n\nexport type SearchResult = Pick<MenuItemProps, 'id' | 'primary' | 'secondary' | 'href' | 'onClick'>;\n\nexport type RecentSearch = Pick<MenuItemProps, 'primary' | 'href' | 'onClick'>;\n\nexport interface SearchInputProps extends NoChildrenProp {\n  /**\n   * Placeholder text. The default value is a locale translation of 'Search…'\n   * @default \"Search…\"\n   */\n  placeholder?: FormControlProps['placeholder'];\n  /**\n   * Creates a controlled input and sets the value. Requires an onChange handler to update value.\n   * value + onChange is the recommended method per React team.\n   */\n  value?: FormControlProps['value'];\n  /**\n   * If you wish to use an [uncontrolled input](https://reactjs.org/docs/uncontrolled-components.html), pass a defaultValue prop and a ref to access the input's native value prop or by other DOM ref means.\n   */\n  defaultValue?: FormControlProps['defaultValue'];\n  /** Called when the SearchInput value changes. */\n  onSearchChange?: (value: string) => void;\n  /**\n   * Called when the SearchButton is clicked or when the Enter key is pressed while SearchInput is in focus.\n   * NOTE: this does not trigger an actual form submit event. It simply represents an explicit action by the user to search as opposed to onSearchChange.\n   */\n  onSearchSubmit?: (value: string) => void;\n  defaultFilter?: string;\n  filters?: string[];\n  onFilterChange?: (value: string) => void;\n  searchResults?: SearchResult[];\n  recentSearches?: RecentSearch[];\n  loading?: boolean;\n  advancedSearchHref?: string;\n  /** Aria label for search input, used by screen readers. */\n  searchInputAriaLabel?: string;\n}\n\nconst SearchInput: FunctionComponent<SearchInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<SearchInputProps>, ref: Ref<HTMLInputElement>) => {\n    const t = useI18n();\n\n    const {\n      defaultValue,\n      value,\n      defaultFilter,\n      filters,\n      onFilterChange,\n      searchResults,\n      recentSearches,\n      loading,\n      advancedSearchHref,\n      placeholder = t('search_placeholder_default'),\n      onSearchChange,\n      onSearchSubmit,\n      searchInputAriaLabel,\n      ...restProps\n    } = props;\n\n    const [searchInputValue, setValue] = useState<string>(value || defaultValue || '');\n    const [searchMenuOpen, setSearchMenuOpen] = useState(false);\n    const [filterMenuOpen, setFilterMenuOpen] = useState(false);\n\n    const innerRef = useConsolidatedRef(ref);\n\n    const createDefaultFilters = useCallback(() => {\n      if (filters && filters.length) {\n        return [t('all'), ...filters];\n      }\n      return [];\n    }, [filters]);\n\n    const filterRef = useRef<HTMLButtonElement | HTMLDivElement>(null);\n    const [selectedFilter, setSelectedFilter] = useState(() => defaultFilter || '');\n    const [completeFilters, setCompleteFilters] = useState(createDefaultFilters);\n    const hasFilters = !!completeFilters.length;\n\n    const [searchResultItems, setSearchResultItems] = useState<MenuItemProps[] | undefined>(\n      undefined\n    );\n    const [downPressed, setDownPressed] = useState(false);\n    const hasSearchResults = !!(searchResults && searchResults.length);\n    const hasRecentSearches = !!(recentSearches && recentSearches.length);\n\n    useOuterEvent('click', [filterRef], () => {\n      setFilterMenuOpen(false);\n    });\n\n    useEffect(() => {\n      if (typeof value === 'string' && value !== searchInputValue) {\n        setValue(value);\n      }\n    }, [value]);\n\n    useEffect(() => {\n      setDownPressed(false);\n    }, [searchInputValue]);\n\n    useEffect(() => {\n      setCompleteFilters(createDefaultFilters());\n    }, [filters]);\n\n    const onChange = useCallback(\n      (e: ChangeEvent<HTMLInputElement>) => {\n        setValue(e.target.value);\n      },\n      [searchInputValue]\n    );\n\n    const onSubmit = () => {\n      onSearchSubmit?.(searchInputValue);\n    };\n\n    const onKeyDown = useCallback((e: KeyboardEvent<HTMLInputElement>) => {\n      if (e.key === 'Enter') {\n        onSubmit();\n      }\n      if (e.key === 'ArrowDown') {\n        setDownPressed(true);\n      }\n    }, []);\n\n    useAfterInitialEffect(() => {\n      if (onSearchChange) onSearchChange(searchInputValue);\n    }, [searchInputValue]);\n\n    useEffect(() => {\n      let items: MenuItemProps[] | undefined = [];\n      if (hasSearchResults && searchInputValue) {\n        items = searchResults.map(res => ({\n          id: res.id,\n          primary: res.primary,\n          secondary: res.secondary,\n          href: res.href,\n          onClick: res.onClick\n        }));\n      } else if (hasRecentSearches && !searchInputValue) {\n        items = recentSearches.map(recentSearch => ({\n          id: recentSearch.primary,\n          primary: recentSearch.primary,\n          href: recentSearch.href,\n          onClick: recentSearch.onClick\n        }));\n      } else if (!searchResults && (!recentSearches || recentSearches.length === 0)) {\n        items = undefined;\n      }\n      setSearchResultItems(items);\n    }, [searchResults, recentSearches, searchMenuOpen]);\n\n    return (\n      <>\n        <Flex container as={StyledSearchInput} hasFilters={hasFilters}>\n          <Flex\n            as={StyledSearchButton}\n            ref={filterRef}\n            forwardedAs={filters && filters.length ? undefined : 'div'}\n            container={{\n              justify: 'center',\n              alignItems: 'center',\n              gap: selectedFilter ? 0.5 : undefined\n            }}\n            onClick={() => {\n              if (hasFilters) {\n                setFilterMenuOpen(true);\n              } else {\n                innerRef.current?.focus();\n              }\n            }}\n            decoupled={hasFilters}\n            aria-label={t('select_search_filter')}\n          >\n            <Icon name='search' />\n            {selectedFilter && <StyledSearchFilterText>{selectedFilter}</StyledSearchFilterText>}\n            {hasFilters && <Icon name='arrow-micro-down' />}\n          </Flex>\n          <StyledSearchTextInput\n            ref={innerRef}\n            type='search'\n            aria-label={searchInputAriaLabel}\n            placeholder={placeholder}\n            {...restProps}\n            value={searchInputValue}\n            onChange={onChange}\n            onKeyDown={onKeyDown}\n            onFocus={() => setSearchMenuOpen(true)}\n            decoupled={hasFilters}\n            onBlur={() => {\n              setDownPressed(false);\n              setSearchMenuOpen(false);\n            }}\n          />\n          {searchInputValue && (\n            <StyledCancelButton\n              icon\n              onClick={() => {\n                setValue('');\n              }}\n              variant='text'\n              tabIndex={0}\n              aria-label={t('clear_search')}\n            >\n              <Icon name='times' />\n            </StyledCancelButton>\n          )}\n        </Flex>\n        {(searchResultItems || loading) && (\n          <Popover\n            target={innerRef.current}\n            show={searchMenuOpen}\n            placement='bottom-start'\n            modifiers={[\n              {\n                name: 'flip',\n                options: {\n                  fallbackPlacements: ['top-start']\n                }\n              },\n              sameWidth\n            ]}\n          >\n            <Menu\n              as={StyledSearchMenu}\n              header={\n                recentSearches && !value ? (\n                  <Text variant='secondary'>{t('recent_searches')}</Text>\n                ) : undefined\n              }\n              mode='action'\n              items={searchResultItems ?? []}\n              loading={hasRecentSearches && !value ? false : loading}\n              footer={\n                advancedSearchHref ? (\n                  <Link href={advancedSearchHref}>{t('advanced_search')}</Link>\n                ) : undefined\n              }\n              accent={hasSearchResults ? new RegExp(value || '', 'g') : undefined}\n              focusControlEl={(downPressed && innerRef.current) || undefined}\n              focusElOnClose\n            />\n          </Popover>\n        )}\n        {hasFilters ? (\n          <Popover\n            target={filterRef.current}\n            show={filterMenuOpen}\n            placement='bottom-start'\n            modifiers={[\n              {\n                name: 'flip',\n                options: {\n                  fallbackPlacements: ['top-start']\n                }\n              }\n            ]}\n          >\n            <Menu\n              mode='single-select'\n              items={completeFilters.map(filter => ({\n                primary: filter,\n                id: filter,\n                selected: filter === 'All' ? selectedFilter === '' : selectedFilter === filter\n              }))}\n              onItemClick={id => {\n                setSelectedFilter(id === 'All' ? '' : id);\n                onFilterChange?.(id);\n              }}\n              focusControlEl={filterRef.current || undefined}\n            />\n          </Popover>\n        ) : undefined}\n      </>\n    );\n  }\n);\n\nexport default SearchInput;\n"]}
+{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  forwardRef,\n  useState,\n  ChangeEvent,\n  useCallback,\n  KeyboardEvent,\n  useEffect\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { transparentize } from 'polished';\n\nimport { ForwardProps, NoChildrenProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Input from '../Input';\nimport Icon, { registerIcon } from '../Icon';\nimport * as searchIcon from '../Icon/icons/search.icon';\nimport { FormControlProps } from '../FormControl';\nimport { useAfterInitialEffect, useConsolidatedRef, useI18n } from '../../hooks';\nimport Flex from '../Flex';\nimport { tryCatch } from '../../utils';\n\nregisterIcon(searchIcon);\n\nexport interface SearchInputProps extends NoChildrenProp {\n  /**\n   * Placeholder text. The default value is a locale translation of 'Search…'\n   * @default \"Search…\"\n   */\n  placeholder?: FormControlProps['placeholder'];\n  /**\n   * Creates a controlled input and sets the value. Requires an onChange handler to update value.\n   * value + onChange is the recommended method per React team.\n   */\n  value?: FormControlProps['value'];\n  /**\n   * If you wish to use an [uncontrolled input](https://reactjs.org/docs/uncontrolled-components.html), pass a defaultValue prop and a ref to access the input's native value prop or by other DOM ref means.\n   */\n  defaultValue?: FormControlProps['defaultValue'];\n  /** Called when the SearchInput value changes. */\n  onSearchChange?: (value: string) => void;\n  /**\n   * Called when the SearchButton is clicked or when the Enter key is pressed while SearchInput is in focus.\n   * NOTE: this does not trigger an actual form submit event. It simply represents an explicit action by the user to search as opposed to onSearchChange.\n   */\n  onSearchSubmit?: (value: string) => void;\n  /** Aria label for search input, used by screen readers. */\n  searchInputAriaLabel?: string;\n}\n\nexport const StyledSearchIcon = styled.div(props => {\n  const {\n    theme: {\n      base,\n      components: { 'search-input': searchInput, 'form-control': formControl }\n    }\n  } = props;\n  const iconColor = tryCatch(() => transparentize(0.75, base.palette['foreground-color']));\n  return css`\n    position: absolute;\n    z-index: 1;\n    inset-inline-start: 0.0625rem;\n    top: 0.0625rem;\n    width: calc(${base['hit-area']['mouse-min']} - 0.125rem);\n    height: calc(${base['hit-area']['mouse-min']} - 0.125rem);\n    border-radius: calc(${base['border-radius']} * ${searchInput['border-radius']});\n    padding: 0;\n    background: ${formControl['background-color']};\n    color: ${iconColor};\n    cursor: text;\n    line-height: 1;\n  `;\n});\n\nStyledSearchIcon.defaultProps = defaultThemeProp;\n\nexport const StyledSearchTextInput = styled(Input)(props => {\n  const { theme } = props;\n  const comp = theme.components['search-input'];\n  return css`\n    position: relative;\n    width: 100%;\n    height: ${theme.base['hit-area']['mouse-min']};\n    min-height: ${theme.base['hit-area']['mouse-min']};\n    padding-inline-start: 0;\n    padding-inline-end: calc(${theme.base['hit-area']['mouse-min']} - 0.125rem);\n    text-indent: calc(${theme.base['hit-area']['mouse-min']} - 0.125rem);\n    border-radius: calc(${comp['border-radius']} * ${theme.base['border-radius']});\n    &::-ms-clear {\n      display: none;\n    }\n    &::-webkit-search-cancel-button {\n      display: none;\n    }\n    ::-webkit-search-decoration {\n      -webkit-appearance: none;\n    }\n\n    &:focus:not([disabled]) {\n      box-shadow: none;\n    }\n  `;\n});\n\nStyledSearchTextInput.defaultProps = defaultThemeProp;\n\nexport const StyledSearchInput = styled.div(({ theme: { base, components } }) => {\n  const iconColor = tryCatch(() => transparentize(0.3, base.palette['foreground-color']));\n\n  return css`\n    position: relative;\n    height: ${base['hit-area']['mouse-min']};\n    border-radius: calc(${components['search-input']['border-radius']} * ${base['border-radius']});\n\n    &:focus-within {\n      box-shadow: ${base.shadow.focus};\n\n      ${StyledSearchIcon} {\n        color: ${iconColor};\n      }\n    }\n  `;\n});\n\nStyledSearchInput.defaultProps = defaultThemeProp;\n\nconst SearchInput: FunctionComponent<SearchInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<SearchInputProps>, ref: Ref<HTMLInputElement>) => {\n    const t = useI18n();\n\n    const {\n      defaultValue,\n      value,\n      placeholder = t('search_placeholder_default'),\n      onSearchChange,\n      onSearchSubmit,\n      searchInputAriaLabel,\n      ...restProps\n    } = props;\n\n    const [searchInputValue, setValue] = useState<string>(value || defaultValue || '');\n\n    const innerRef = useConsolidatedRef(ref);\n\n    useEffect(() => {\n      if (typeof value === 'string' && value !== searchInputValue) {\n        setValue(value);\n      }\n    }, [value]);\n\n    const onChange = useCallback(\n      (e: ChangeEvent<HTMLInputElement>) => {\n        setValue(e.target.value);\n      },\n      [searchInputValue]\n    );\n\n    const onSubmit = useCallback(() => {\n      onSearchSubmit?.(searchInputValue);\n    }, [searchInputValue]);\n\n    const onKeyDown = useCallback(\n      (e: KeyboardEvent<HTMLInputElement>) => {\n        if (e.key === 'Enter') {\n          onSubmit();\n        }\n      },\n      [searchInputValue]\n    );\n\n    useAfterInitialEffect(() => {\n      if (onSearchChange) onSearchChange(searchInputValue);\n    }, [searchInputValue]);\n\n    return (\n      <Flex container as={StyledSearchInput}>\n        <StyledSearchTextInput\n          ref={innerRef}\n          type='search'\n          aria-label={searchInputAriaLabel}\n          placeholder={placeholder}\n          {...restProps}\n          value={searchInputValue}\n          onChange={onChange}\n          onKeyDown={onKeyDown}\n        />\n        <Flex\n          as={StyledSearchIcon}\n          container={{ justify: 'center', alignItems: 'center' }}\n          onClick={() => {\n            innerRef.current?.focus();\n          }}\n        >\n          <Icon name='search' />\n        </Flex>\n      </Flex>\n    );\n  }\n);\n\nexport default SearchInput;\n"]}

package/lib/components/SearchInput/index.d.ts

@@ -1,4 +1,4 @@
 export { default } from './SearchInput';
 export { SearchInputProps } from './SearchInput';
-export { StyledSearchInput } from './SearchInput.styles';
+export { StyledSearchInput } from './SearchInput';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/SearchInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC"}

package/lib/components/SearchInput/index.js

@@ -1,3 +1,3 @@
 export { default } from './SearchInput';
-export { StyledSearchInput } from './SearchInput.styles';
+export { StyledSearchInput } from './SearchInput';
 //# sourceMappingURL=index.js.map

package/lib/components/SearchInput/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SearchInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAExC,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC","sourcesContent":["export { default } from './SearchInput';\nexport { SearchInputProps } from './SearchInput';\nexport { StyledSearchInput } from './SearchInput.styles';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SearchInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAExC,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC","sourcesContent":["export { default } from './SearchInput';\nexport { SearchInputProps } from './SearchInput';\nexport { StyledSearchInput } from './SearchInput';\n"]}

package/lib/components/Tabs/TabPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/TabPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAE,SAAS,EAAE,GAAG,EAAmB,MAAM,OAAO,CAAC;AAGvF,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,UAAU,aAAa;IACrB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,CAAC;IACd;;;SAGK;IACL,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gCAAgC;IAChC,QAAQ,EAAE,SAAS,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAMD,eAAO,MAAM,cAAc;aAChB,OAAO;SAgBhB,CAAC;AAEH,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CAyB7D,CAAC;AAIF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"TabPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/TabPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAE,SAAS,EAAE,GAAG,EAAmB,MAAM,OAAO,CAAC;AAGvF,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,UAAU,aAAa;IACrB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,CAAC;IACd;;;SAGK;IACL,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gCAAgC;IAChC,QAAQ,EAAE,SAAS,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAMD,eAAO,MAAM,cAAc;aAChB,OAAO;SAehB,CAAC;AAEH,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CAyB7D,CAAC;AAIF,eAAe,QAAQ,CAAC"}

package/lib/components/Tabs/TabPanel.js

@@ -8,7 +8,6 @@ export const StyledTabPanel = styled.div(({ current }) => {
     return css `
     min-width: 0;
     max-width: 100%;
-    height: 100%;
 
     :focus {
       outline: none;

package/lib/components/Tabs/TabPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabPanel.js","sourceRoot":"","sources":["../../../src/components/Tabs/TabPanel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAsD,MAAM,OAAO,CAAC;AACvF,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAkBhD,MAAM,YAAY,GAA2B;IAC3C,KAAK,EAAE,EAAE;CACV,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAErC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;IACjB,OAAO,GAAG,CAAA;;;;;;;;;MASN,CAAC,OAAO;QACV,GAAG,CAAA;;KAEF;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,QAAQ,GAAoD,UAAU,CAC1E,CACE,EAAE,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAkC,EAC/E,GAAyB,EACzB,EAAE;IACF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,YAAY,IAAI,KAAK,EAAE;YACzB,OAAO,YAAY,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;SAC/C;QACD,OAAO,CAAC,CAAC;IACX,CAAC,CAAC;IACF,OAAO,CACL,KAAC,cAAc,OACT,SAAS,EACb,OAAO,EAAE,YAAY,IAAI,KAAK,CAAC,CAAC,CAAC,YAAY,KAAK,KAAK,CAAC,CAAC,CAAC,IAAI,EAC9D,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,WAAW,EAAE,qBACN,GAAG,KAAK,EAAE,EAC3B,EAAE,EAAE,GAAG,KAAK,QAAQ,EACpB,GAAG,EAAE,GAAG,YAEP,QAAQ,GACM,CAClB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,QAAQ,CAAC,YAAY,GAAG,YAAY,CAAC;AAErC,eAAe,QAAQ,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, ReactNode, Ref, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { ForwardProps } from '../../types';\n\ninterface TabPanelProps {\n  /** The id of the Tab that the tab panel is related to. */\n  tabId: string;\n  /**\n   * The current selected value of the tabs. Controls the visibility of the tab panel.\n   * The tabsValue must match the tabId in order for the TabPanel to show itself.\n   * */\n  currentTabId?: string;\n  /** Content of the tab panel. */\n  children: ReactNode;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst defaultProps: Partial<TabPanelProps> = {\n  tabId: ''\n};\n\nexport const StyledTabPanel = styled.div<{\n  current: boolean;\n}>(({ current }) => {\n  return css`\n    min-width: 0;\n    max-width: 100%;\n    height: 100%;\n\n    :focus {\n      outline: none;\n    }\n\n    ${!current &&\n    css`\n      display: none;\n    `}\n  `;\n});\n\nconst TabPanel: FunctionComponent<TabPanelProps & ForwardProps> = forwardRef(\n  (\n    { tabId, currentTabId, children, ...restProps }: PropsWithoutRef<TabPanelProps>,\n    ref: TabPanelProps['ref']\n  ) => {\n    const getTabIndex = () => {\n      if (currentTabId && tabId) {\n        return currentTabId === tabId ? 0 : undefined;\n      }\n      return 0;\n    };\n    return (\n      <StyledTabPanel\n        {...restProps}\n        current={currentTabId && tabId ? currentTabId === tabId : true}\n        role='tabpanel'\n        tabIndex={getTabIndex()}\n        aria-labelledby={`${tabId}`}\n        id={`${tabId}-panel`}\n        ref={ref}\n      >\n        {children}\n      </StyledTabPanel>\n    );\n  }\n);\n\nTabPanel.defaultProps = defaultProps;\n\nexport default TabPanel;\n"]}
+{"version":3,"file":"TabPanel.js","sourceRoot":"","sources":["../../../src/components/Tabs/TabPanel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAsD,MAAM,OAAO,CAAC;AACvF,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAkBhD,MAAM,YAAY,GAA2B;IAC3C,KAAK,EAAE,EAAE;CACV,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAErC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;IACjB,OAAO,GAAG,CAAA;;;;;;;;MAQN,CAAC,OAAO;QACV,GAAG,CAAA;;KAEF;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,QAAQ,GAAoD,UAAU,CAC1E,CACE,EAAE,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAkC,EAC/E,GAAyB,EACzB,EAAE;IACF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,YAAY,IAAI,KAAK,EAAE;YACzB,OAAO,YAAY,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;SAC/C;QACD,OAAO,CAAC,CAAC;IACX,CAAC,CAAC;IACF,OAAO,CACL,KAAC,cAAc,OACT,SAAS,EACb,OAAO,EAAE,YAAY,IAAI,KAAK,CAAC,CAAC,CAAC,YAAY,KAAK,KAAK,CAAC,CAAC,CAAC,IAAI,EAC9D,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,WAAW,EAAE,qBACN,GAAG,KAAK,EAAE,EAC3B,EAAE,EAAE,GAAG,KAAK,QAAQ,EACpB,GAAG,EAAE,GAAG,YAEP,QAAQ,GACM,CAClB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,QAAQ,CAAC,YAAY,GAAG,YAAY,CAAC;AAErC,eAAe,QAAQ,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, ReactNode, Ref, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { ForwardProps } from '../../types';\n\ninterface TabPanelProps {\n  /** The id of the Tab that the tab panel is related to. */\n  tabId: string;\n  /**\n   * The current selected value of the tabs. Controls the visibility of the tab panel.\n   * The tabsValue must match the tabId in order for the TabPanel to show itself.\n   * */\n  currentTabId?: string;\n  /** Content of the tab panel. */\n  children: ReactNode;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst defaultProps: Partial<TabPanelProps> = {\n  tabId: ''\n};\n\nexport const StyledTabPanel = styled.div<{\n  current: boolean;\n}>(({ current }) => {\n  return css`\n    min-width: 0;\n    max-width: 100%;\n\n    :focus {\n      outline: none;\n    }\n\n    ${!current &&\n    css`\n      display: none;\n    `}\n  `;\n});\n\nconst TabPanel: FunctionComponent<TabPanelProps & ForwardProps> = forwardRef(\n  (\n    { tabId, currentTabId, children, ...restProps }: PropsWithoutRef<TabPanelProps>,\n    ref: TabPanelProps['ref']\n  ) => {\n    const getTabIndex = () => {\n      if (currentTabId && tabId) {\n        return currentTabId === tabId ? 0 : undefined;\n      }\n      return 0;\n    };\n    return (\n      <StyledTabPanel\n        {...restProps}\n        current={currentTabId && tabId ? currentTabId === tabId : true}\n        role='tabpanel'\n        tabIndex={getTabIndex()}\n        aria-labelledby={`${tabId}`}\n        id={`${tabId}-panel`}\n        ref={ref}\n      >\n        {children}\n      </StyledTabPanel>\n    );\n  }\n);\n\nTabPanel.defaultProps = defaultProps;\n\nexport default TabPanel;\n"]}

package/lib/components/VisuallyHiddenText/VisuallyHiddenText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VisuallyHiddenText.d.ts","sourceRoot":"","sources":["../../../src/components/VisuallyHiddenText/VisuallyHiddenText.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAc,GAAG,EAAmB,MAAM,OAAO,CAAC;AAI5E,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,GAAG,CAAC,eAAe,CAAC,CAAC;CAC5B;AAED,eAAO,MAAM,wBAAwB,0GAEpC,CAAC;AAEF,QAAA,MAAM,kBAAkB,EAAE,iBAAiB,CAAC,uBAAuB,GAAG,YAAY,CAIjF,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"VisuallyHiddenText.d.ts","sourceRoot":"","sources":["../../../src/components/VisuallyHiddenText/VisuallyHiddenText.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAc,GAAG,EAAmB,MAAM,OAAO,CAAC;AAI5E,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,GAAG,CAAC,eAAe,CAAC,CAAC;CAC5B;AAED,eAAO,MAAM,wBAAwB,0GAIpC,CAAC;AAEF,QAAA,MAAM,kBAAkB,EAAE,iBAAiB,CAAC,uBAAuB,GAAG,YAAY,CAIjF,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/lib/components/VisuallyHiddenText/VisuallyHiddenText.js

@@ -4,6 +4,8 @@ import styled from 'styled-components';
 import { hideVisually } from 'polished';
 export const StyledVisuallyHiddenText = styled.span `
   ${hideVisually}
+  -webkit-user-select: none;
+  user-select: none;
 `;
 const VisuallyHiddenText = forwardRef((props, ref) => (_jsx(StyledVisuallyHiddenText, { ...props, ref: ref })));
 export default VisuallyHiddenText;

package/lib/components/VisuallyHiddenText/VisuallyHiddenText.js.map

@@ -1 +1 @@
-{"version":3,"file":"VisuallyHiddenText.js","sourceRoot":"","sources":["../../../src/components/VisuallyHiddenText/VisuallyHiddenText.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,UAAU,EAAwB,MAAM,OAAO,CAAC;AAC5E,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AASxC,MAAM,CAAC,MAAM,wBAAwB,GAAG,MAAM,CAAC,IAAI,CAAA;IAC/C,YAAY;CACf,CAAC;AAEF,MAAM,kBAAkB,GAA8D,UAAU,CAC9F,CAAC,KAA+C,EAAE,GAAmC,EAAE,EAAE,CAAC,CACxF,KAAC,wBAAwB,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,GAAI,CAClD,CACF,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import { FunctionComponent, forwardRef, Ref, PropsWithoutRef } from 'react';\nimport styled from 'styled-components';\nimport { hideVisually } from 'polished';\n\nimport { ForwardProps } from '../../types';\n\ninterface VisuallyHiddenTextProps {\n  children: string;\n  ref?: Ref<HTMLSpanElement>;\n}\n\nexport const StyledVisuallyHiddenText = styled.span`\n  ${hideVisually}\n`;\n\nconst VisuallyHiddenText: FunctionComponent<VisuallyHiddenTextProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<VisuallyHiddenTextProps>, ref: VisuallyHiddenTextProps['ref']) => (\n    <StyledVisuallyHiddenText {...props} ref={ref} />\n  )\n);\n\nexport default VisuallyHiddenText;\n"]}
+{"version":3,"file":"VisuallyHiddenText.js","sourceRoot":"","sources":["../../../src/components/VisuallyHiddenText/VisuallyHiddenText.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,UAAU,EAAwB,MAAM,OAAO,CAAC;AAC5E,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AASxC,MAAM,CAAC,MAAM,wBAAwB,GAAG,MAAM,CAAC,IAAI,CAAA;IAC/C,YAAY;;;CAGf,CAAC;AAEF,MAAM,kBAAkB,GAA8D,UAAU,CAC9F,CAAC,KAA+C,EAAE,GAAmC,EAAE,EAAE,CAAC,CACxF,KAAC,wBAAwB,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,GAAI,CAClD,CACF,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import { FunctionComponent, forwardRef, Ref, PropsWithoutRef } from 'react';\nimport styled from 'styled-components';\nimport { hideVisually } from 'polished';\n\nimport { ForwardProps } from '../../types';\n\ninterface VisuallyHiddenTextProps {\n  children: string;\n  ref?: Ref<HTMLSpanElement>;\n}\n\nexport const StyledVisuallyHiddenText = styled.span`\n  ${hideVisually}\n  -webkit-user-select: none;\n  user-select: none;\n`;\n\nconst VisuallyHiddenText: FunctionComponent<VisuallyHiddenTextProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<VisuallyHiddenTextProps>, ref: VisuallyHiddenTextProps['ref']) => (\n    <StyledVisuallyHiddenText {...props} ref={ref} />\n  )\n);\n\nexport default VisuallyHiddenText;\n"]}

package/lib/hooks/useAutoResize.d.ts

@@ -1,4 +1,4 @@
-import { RefObject } from 'react';
+import { MutableRefObject } from 'react';
 /**
  * @example const [ref, resizeFunction] = useAutoResize();
  * maxHeight should be provided in pixels without units
@@ -7,6 +7,6 @@ import { RefObject } from 'react';
  *          * resizeFunction:: The function to call to automatically resize the element.
  * element refers to auto resizable element
  */
-declare const useAutoResize: <T extends HTMLElement = HTMLElement>(maxHeight?: number | undefined, minHeightProp?: number | undefined) => [RefObject<T>, () => void];
+declare const useAutoResize: <T extends HTMLElement = HTMLElement>(maxHeight?: number | undefined, minHeightProp?: number | undefined) => [MutableRefObject<T | null>, () => void];
 export default useAutoResize;
 //# sourceMappingURL=useAutoResize.d.ts.map

package/lib/hooks/useAutoResize.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAutoResize.d.ts","sourceRoot":"","sources":["../../src/hooks/useAutoResize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,SAAS,EAAE,MAAM,OAAO,CAAC;AAIpD;;;;;;;GAOG;AACH,QAAA,MAAM,aAAa,oIAGK,IAAI,CA4B3B,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"useAutoResize.d.ts","sourceRoot":"","sources":["../../src/hooks/useAutoResize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,gBAAgB,EAAE,MAAM,OAAO,CAAC;AAI3D;;;;;;;GAOG;AACH,QAAA,MAAM,aAAa,kJAGmB,IAAI,CAkCzC,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/hooks/useAutoResize.js

@@ -12,10 +12,14 @@ const useAutoResize = (maxHeight, minHeightProp) => {
     const element = useRef(null);
     const [minHeight, setMinHeight] = useState(minHeightProp || 0);
     const autoResize = () => {
+        let scrollHeightElement = element.current;
+        if (element.current?.tagName === 'IFRAME')
+            scrollHeightElement =
+                element.current.contentDocument?.querySelector('body') ?? element.current;
         if (element.current) {
             let newMinHeight = minHeight;
             if (!minHeight) {
-                newMinHeight = element.current.scrollHeight;
+                newMinHeight = scrollHeightElement.scrollHeight;
                 setMinHeight(newMinHeight);
             }
             // Reset the heights to the base height so there is an overflow / or none to calculate the new height
@@ -23,10 +27,10 @@ const useAutoResize = (maxHeight, minHeightProp) => {
             if (maxHeight) {
                 element.current.style.overflowY =
                     element.current.scrollHeight > maxHeight ? 'auto' : 'hidden';
-                element.current.style.height = `${Math.min(element.current.scrollHeight, maxHeight)}px`;
+                element.current.style.height = `${Math.min(scrollHeightElement.scrollHeight, maxHeight)}px`;
             }
             else {
-                element.current.style.height = `${element.current.scrollHeight}px`;
+                element.current.style.height = `${scrollHeightElement.scrollHeight}px`;
             }
         }
     };

package/lib/hooks/useAutoResize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAutoResize.js","sourceRoot":"","sources":["../../src/hooks/useAutoResize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAa,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEpC;;;;;;;GAOG;AACH,MAAM,aAAa,GAAG,CACpB,SAAkB,EAClB,aAAsB,EACM,EAAE;IAC9B,MAAM,OAAO,GAAG,MAAM,CAAI,IAAI,CAAC,CAAC;IAEhC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,aAAa,IAAI,CAAC,CAAC,CAAC;IAE/D,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,IAAI,OAAO,CAAC,OAAO,EAAE;YACnB,IAAI,YAAY,GAAG,SAAS,CAAC;YAC7B,IAAI,CAAC,SAAS,EAAE;gBACd,YAAY,GAAG,OAAO,CAAC,OAAO,CAAC,YAAY,CAAC;gBAC5C,YAAY,CAAC,YAAY,CAAC,CAAC;aAC5B;YACD,qGAAqG;YACrG,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,YAAY,IAAI,CAAC;YAEnD,IAAI,SAAS,EAAE;gBACb,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS;oBAC7B,OAAO,CAAC,OAAO,CAAC,YAAY,GAAG,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC;gBAC/D,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC,IAAI,CAAC;aACzF;iBAAM;gBACL,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,OAAO,CAAC,OAAO,CAAC,YAAY,IAAI,CAAC;aACpE;SACF;IACH,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,QAAQ,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;IAEtD,OAAO,CAAC,OAAO,EAAE,mBAAmB,CAAC,CAAC;AACxC,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useRef, useState, RefObject } from 'react';\n\nimport { debounce } from '../utils';\n\n/**\n * @example const [ref, resizeFunction] = useAutoResize();\n * maxHeight should be provided in pixels without units\n * minHeight should be provided in pixels without units\n * @returns * ref:: A reference for the element that the resize functionality should be applied to. [React RefObject](https://reactjs.org/docs/refs-and-the-dom.html)\n *          * resizeFunction:: The function to call to automatically resize the element.\n * element refers to auto resizable element\n */\nconst useAutoResize = <T extends HTMLElement = HTMLElement>(\n  maxHeight?: number,\n  minHeightProp?: number\n): [RefObject<T>, () => void] => {\n  const element = useRef<T>(null);\n\n  const [minHeight, setMinHeight] = useState(minHeightProp || 0);\n\n  const autoResize = () => {\n    if (element.current) {\n      let newMinHeight = minHeight;\n      if (!minHeight) {\n        newMinHeight = element.current.scrollHeight;\n        setMinHeight(newMinHeight);\n      }\n      // Reset the heights to the base height so there is an overflow / or none to calculate the new height\n      element.current.style.height = `${newMinHeight}px`;\n\n      if (maxHeight) {\n        element.current.style.overflowY =\n          element.current.scrollHeight > maxHeight ? 'auto' : 'hidden';\n        element.current.style.height = `${Math.min(element.current.scrollHeight, maxHeight)}px`;\n      } else {\n        element.current.style.height = `${element.current.scrollHeight}px`;\n      }\n    }\n  };\n\n  const debouncedAutoResize = debounce(autoResize, 100);\n\n  return [element, debouncedAutoResize];\n};\n\nexport default useAutoResize;\n"]}
+{"version":3,"file":"useAutoResize.js","sourceRoot":"","sources":["../../src/hooks/useAutoResize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAoB,MAAM,OAAO,CAAC;AAE3D,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEpC;;;;;;;GAOG;AACH,MAAM,aAAa,GAAG,CACpB,SAAkB,EAClB,aAAsB,EACoB,EAAE;IAC5C,MAAM,OAAO,GAAG,MAAM,CAAW,IAAI,CAAC,CAAC;IAEvC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,aAAa,IAAI,CAAC,CAAC,CAAC;IAE/D,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,IAAI,mBAAmB,GAAgB,OAAO,CAAC,OAAsB,CAAC;QACtE,IAAI,OAAO,CAAC,OAAO,EAAE,OAAO,KAAK,QAAQ;YACvC,mBAAmB;gBAChB,OAAO,CAAC,OAA4C,CAAC,eAAe,EAAE,aAAa,CAClF,MAAM,CACP,IAAI,OAAO,CAAC,OAAO,CAAC;QACzB,IAAI,OAAO,CAAC,OAAO,EAAE;YACnB,IAAI,YAAY,GAAG,SAAS,CAAC;YAC7B,IAAI,CAAC,SAAS,EAAE;gBACd,YAAY,GAAG,mBAAmB,CAAC,YAAY,CAAC;gBAChD,YAAY,CAAC,YAAY,CAAC,CAAC;aAC5B;YACD,qGAAqG;YACrG,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,YAAY,IAAI,CAAC;YAEnD,IAAI,SAAS,EAAE;gBACb,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS;oBAC7B,OAAO,CAAC,OAAO,CAAC,YAAY,GAAG,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC;gBAC/D,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,mBAAmB,CAAC,YAAY,EAAE,SAAS,CAAC,IAAI,CAAC;aAC7F;iBAAM;gBACL,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,mBAAmB,CAAC,YAAY,IAAI,CAAC;aACxE;SACF;IACH,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,QAAQ,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;IAEtD,OAAO,CAAC,OAAO,EAAE,mBAAmB,CAAC,CAAC;AACxC,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useRef, useState, MutableRefObject } from 'react';\n\nimport { debounce } from '../utils';\n\n/**\n * @example const [ref, resizeFunction] = useAutoResize();\n * maxHeight should be provided in pixels without units\n * minHeight should be provided in pixels without units\n * @returns * ref:: A reference for the element that the resize functionality should be applied to. [React RefObject](https://reactjs.org/docs/refs-and-the-dom.html)\n *          * resizeFunction:: The function to call to automatically resize the element.\n * element refers to auto resizable element\n */\nconst useAutoResize = <T extends HTMLElement = HTMLElement>(\n  maxHeight?: number,\n  minHeightProp?: number\n): [MutableRefObject<T | null>, () => void] => {\n  const element = useRef<T | null>(null);\n\n  const [minHeight, setMinHeight] = useState(minHeightProp || 0);\n\n  const autoResize = () => {\n    let scrollHeightElement: HTMLElement = element.current as HTMLElement;\n    if (element.current?.tagName === 'IFRAME')\n      scrollHeightElement =\n        (element.current as HTMLElement as HTMLIFrameElement).contentDocument?.querySelector(\n          'body'\n        ) ?? element.current;\n    if (element.current) {\n      let newMinHeight = minHeight;\n      if (!minHeight) {\n        newMinHeight = scrollHeightElement.scrollHeight;\n        setMinHeight(newMinHeight);\n      }\n      // Reset the heights to the base height so there is an overflow / or none to calculate the new height\n      element.current.style.height = `${newMinHeight}px`;\n\n      if (maxHeight) {\n        element.current.style.overflowY =\n          element.current.scrollHeight > maxHeight ? 'auto' : 'hidden';\n        element.current.style.height = `${Math.min(scrollHeightElement.scrollHeight, maxHeight)}px`;\n      } else {\n        element.current.style.height = `${scrollHeightElement.scrollHeight}px`;\n      }\n    }\n  };\n\n  const debouncedAutoResize = debounce(autoResize, 100);\n\n  return [element, debouncedAutoResize];\n};\n\nexport default useAutoResize;\n"]}

package/lib/hooks/useEscape.d.ts

@@ -1,10 +1,10 @@
-import { DependencyList } from 'react';
+import { DependencyList, RefObject } from 'react';
 /**
  * @example useEscape((event) => { do something });
  * @param cb The function that should be executed on keydown keyevent.
  * @param target To which esc event to be attached - Defaults to document
  * @param dependencies List of dependencies
  */
-declare const useEscape: (cb: (e: KeyboardEvent) => void, target?: HTMLElement | Document | null, dependencies?: DependencyList) => void;
+declare const useEscape: (cb: (e: KeyboardEvent) => void, target?: HTMLElement | RefObject<HTMLElement> | Document | null, dependencies?: DependencyList) => void;
 export default useEscape;
 //# sourceMappingURL=useEscape.d.ts.map

package/lib/hooks/useEscape.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useEscape.d.ts","sourceRoot":"","sources":["../../src/hooks/useEscape.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAe,MAAM,OAAO,CAAC;AAIpD;;;;;GAKG;AAEH,QAAA,MAAM,SAAS,WACL,aAAa,KAAK,IAAI,WACtB,WAAW,GAAG,QAAQ,GAAG,IAAI,wCAWtC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"useEscape.d.ts","sourceRoot":"","sources":["../../src/hooks/useEscape.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAI/D;;;;;GAKG;AAEH,QAAA,MAAM,SAAS,WACL,aAAa,KAAK,IAAI,WACtB,WAAW,GAAG,UAAU,WAAW,CAAC,GAAG,QAAQ,GAAG,IAAI,wCAW/D,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/hooks/useEscape.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEscape.js","sourceRoot":"","sources":["../../src/hooks/useEscape.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC;;;;;GAKG;AAEH,MAAM,SAAS,GAAG,CAChB,EAA8B,EAC9B,SAAwC,QAAQ,EAChD,eAA+B,EAAE,EACjC,EAAE;IACF,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,CAAgB,EAAE,EAAE;QACnB,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ;YAAE,EAAE,CAAC,CAAC,CAAC,CAAC;IAChC,CAAC,EACD,CAAC,EAAE,EAAE,GAAG,YAAY,CAAC,CACtB,CAAC;IAEF,QAAQ,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC;AAC7C,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { DependencyList, useCallback } from 'react';\n\nimport useEvent from './useEvent';\n\n/**\n * @example useEscape((event) => { do something });\n * @param cb The function that should be executed on keydown keyevent.\n * @param target To which esc event to be attached - Defaults to document\n * @param dependencies List of dependencies\n */\n\nconst useEscape = (\n  cb: (e: KeyboardEvent) => void,\n  target: HTMLElement | Document | null = document,\n  dependencies: DependencyList = []\n) => {\n  const onKeydown = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.key === 'Escape') cb(e);\n    },\n    [cb, ...dependencies]\n  );\n\n  useEvent('keydown', onKeydown, { target });\n};\n\nexport default useEscape;\n"]}
+{"version":3,"file":"useEscape.js","sourceRoot":"","sources":["../../src/hooks/useEscape.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,WAAW,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC;;;;;GAKG;AAEH,MAAM,SAAS,GAAG,CAChB,EAA8B,EAC9B,SAAiE,QAAQ,EACzE,eAA+B,EAAE,EACjC,EAAE;IACF,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,CAAgB,EAAE,EAAE;QACnB,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ;YAAE,EAAE,CAAC,CAAC,CAAC,CAAC;IAChC,CAAC,EACD,CAAC,EAAE,EAAE,GAAG,YAAY,CAAC,CACtB,CAAC;IAEF,QAAQ,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC;AAC7C,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { DependencyList, RefObject, useCallback } from 'react';\n\nimport useEvent from './useEvent';\n\n/**\n * @example useEscape((event) => { do something });\n * @param cb The function that should be executed on keydown keyevent.\n * @param target To which esc event to be attached - Defaults to document\n * @param dependencies List of dependencies\n */\n\nconst useEscape = (\n  cb: (e: KeyboardEvent) => void,\n  target: HTMLElement | RefObject<HTMLElement> | Document | null = document,\n  dependencies: DependencyList = []\n) => {\n  const onKeydown = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.key === 'Escape') cb(e);\n    },\n    [cb, ...dependencies]\n  );\n\n  useEvent('keydown', onKeydown, { target });\n};\n\nexport default useEscape;\n"]}

package/lib/hooks/useEvent.d.ts

@@ -1,4 +1,4 @@
-import { DependencyList } from 'react';
+import { DependencyList, RefObject } from 'react';
 declare type EventMapForTarget<Target extends EventTarget> = Target extends HTMLElement ? HTMLElementEventMap : Target extends SVGElement ? SVGElementEventMap : Target extends Document ? DocumentEventMap : Target extends Window ? WindowEventMap : {
     [eventType: string]: Event;
 };
@@ -14,12 +14,12 @@ declare function useEvent<Target extends Document, EventName extends EventNamesF
     dependencies: DependencyList;
 }): void;
 declare function useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target>>(eventName: EventName, cb: (e: EventMapForTarget<Target>[EventName]) => void, opts: {
-    target: Target | null;
+    target: Target | RefObject<Target> | null;
     eventOptions?: AddEventListenerOptions | boolean;
     dependencies?: DependencyList;
 }): void;
 declare function useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target | Document>>(eventName: EventName, cb: (e: EventMapForTarget<Target | Document>[EventName]) => void, opts: {
-    target?: Target | null | undefined;
+    target?: Target | RefObject<Target> | null | undefined;
     eventOptions?: AddEventListenerOptions | boolean;
     dependencies?: DependencyList;
 }): void;

package/lib/hooks/useEvent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useEvent.d.ts","sourceRoot":"","sources":["../../src/hooks/useEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAa,MAAM,OAAO,CAAC;AAGlD,aAAK,iBAAiB,CAAC,MAAM,SAAS,WAAW,IAAI,MAAM,SAAS,WAAW,GAC3E,mBAAmB,GACnB,MAAM,SAAS,UAAU,GACzB,kBAAkB,GAClB,MAAM,SAAS,QAAQ,GACvB,gBAAgB,GAChB,MAAM,SAAS,MAAM,GACrB,cAAc,GACd;IACE,CAAC,SAAS,EAAE,MAAM,GAAG,KAAK,CAAC;CAC5B,CAAC;AACN,aAAK,mBAAmB,CAAC,CAAC,SAAS,WAAW,IAAI,MAAM,iBAAiB,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC;AAEtF;;;;GAIG;AACH,iBAAS,QAAQ,CAAC,MAAM,SAAS,QAAQ,EAAE,SAAS,SAAS,mBAAmB,CAAC,MAAM,CAAC,EACtF,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE,CAAC,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,EACrD,IAAI,CAAC,EAAE;IACL,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,YAAY,CAAC,EAAE,uBAAuB,GAAG,OAAO,CAAC;IACjD,YAAY,EAAE,cAAc,CAAC;CAC9B,GACA,IAAI,CAAC;AAER,iBAAS,QAAQ,CAAC,MAAM,SAAS,WAAW,EAAE,SAAS,SAAS,mBAAmB,CAAC,MAAM,CAAC,EACzF,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE,CAAC,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,EACrD,IAAI,EAAE;IACJ,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,YAAY,CAAC,EAAE,uBAAuB,GAAG,OAAO,CAAC;IACjD,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B,GACA,IAAI,CAAC;AAER,iBAAS,QAAQ,CACf,MAAM,SAAS,WAAW,EAC1B,SAAS,SAAS,mBAAmB,CAAC,MAAM,GAAG,QAAQ,CAAC,EAExD,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE,CAAC,CAAC,EAAE,iBAAiB,CAAC,MAAM,GAAG,QAAQ,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,EAChE,IAAI,EAAE;IACJ,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACnC,YAAY,CAAC,EAAE,uBAAuB,GAAG,OAAO,CAAC;IACjD,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B,GACA,IAAI,CAAC;AAyBR,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"useEvent.d.ts","sourceRoot":"","sources":["../../src/hooks/useEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAK7D,aAAK,iBAAiB,CAAC,MAAM,SAAS,WAAW,IAAI,MAAM,SAAS,WAAW,GAC3E,mBAAmB,GACnB,MAAM,SAAS,UAAU,GACzB,kBAAkB,GAClB,MAAM,SAAS,QAAQ,GACvB,gBAAgB,GAChB,MAAM,SAAS,MAAM,GACrB,cAAc,GACd;IACE,CAAC,SAAS,EAAE,MAAM,GAAG,KAAK,CAAC;CAC5B,CAAC;AACN,aAAK,mBAAmB,CAAC,CAAC,SAAS,WAAW,IAAI,MAAM,iBAAiB,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC;AAEtF;;;;GAIG;AACH,iBAAS,QAAQ,CAAC,MAAM,SAAS,QAAQ,EAAE,SAAS,SAAS,mBAAmB,CAAC,MAAM,CAAC,EACtF,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE,CAAC,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,EACrD,IAAI,CAAC,EAAE;IACL,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,YAAY,CAAC,EAAE,uBAAuB,GAAG,OAAO,CAAC;IACjD,YAAY,EAAE,cAAc,CAAC;CAC9B,GACA,IAAI,CAAC;AAER,iBAAS,QAAQ,CAAC,MAAM,SAAS,WAAW,EAAE,SAAS,SAAS,mBAAmB,CAAC,MAAM,CAAC,EACzF,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE,CAAC,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,EACrD,IAAI,EAAE;IACJ,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC;IAC1C,YAAY,CAAC,EAAE,uBAAuB,GAAG,OAAO,CAAC;IACjD,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B,GACA,IAAI,CAAC;AAER,iBAAS,QAAQ,CACf,MAAM,SAAS,WAAW,EAC1B,SAAS,SAAS,mBAAmB,CAAC,MAAM,GAAG,QAAQ,CAAC,EAExD,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE,CAAC,CAAC,EAAE,iBAAiB,CAAC,MAAM,GAAG,QAAQ,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,EAChE,IAAI,EAAE;IACJ,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IACvD,YAAY,CAAC,EAAE,uBAAuB,GAAG,OAAO,CAAC;IACjD,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B,GACA,IAAI,CAAC;AA2BR,eAAe,QAAQ,CAAC"}

package/lib/hooks/useEvent.js

@@ -1,11 +1,13 @@
 import { useEffect } from 'react';
+import { normalizeElements } from '../utils';
 function useEvent(eventName, cb, { target = document, eventOptions, dependencies = [] } = {}) {
     useEffect(() => {
-        if (!target)
+        const [element] = normalizeElements([target]);
+        if (!element)
             return;
-        target.addEventListener(eventName, cb, eventOptions);
+        element.addEventListener(eventName, cb, eventOptions);
         return () => {
-            target.removeEventListener(eventName, cb, eventOptions);
+            element.removeEventListener(eventName, cb, eventOptions);
         };
     }, [eventName, target, cb, eventOptions, ...dependencies]);
 }

package/lib/hooks/useEvent.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEvent.js","sourceRoot":"","sources":["../../src/hooks/useEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,SAAS,EAAE,MAAM,OAAO,CAAC;AAsDlD,SAAS,QAAQ,CACf,SAAoB,EACpB,EAAqD,EACrD,EACE,MAAM,GAAG,QAA6B,EACtC,YAAY,EACZ,YAAY,GAAG,EAAE,KAKf,EAAE;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,MAAM;YAAE,OAAO;QAEpB,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,EAAmB,EAAE,YAAY,CAAC,CAAC;QAEtE,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,EAAmB,EAAE,YAAY,CAAC,CAAC;QAC3E,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE,YAAY,EAAE,GAAG,YAAY,CAAC,CAAC,CAAC;AAC7D,CAAC;AACD,eAAe,QAAQ,CAAC","sourcesContent":["import { DependencyList, useEffect } from 'react';\n\n//  Based on https://github.com/microsoft/TypeScript/issues/33047#issuecomment-704005614\ntype EventMapForTarget<Target extends EventTarget> = Target extends HTMLElement\n  ? HTMLElementEventMap\n  : Target extends SVGElement\n  ? SVGElementEventMap\n  : Target extends Document\n  ? DocumentEventMap\n  : Target extends Window\n  ? WindowEventMap\n  : {\n      [eventType: string]: Event;\n    };\ntype EventNamesForTarget<T extends EventTarget> = keyof EventMapForTarget<T> & string;\n\n/**\n * @example useEvent('keydown', (event) => { do something });\n * @param cb The function that should be executed on keydown keyevent.\n * @param options\n */\nfunction useEvent<Target extends Document, EventName extends EventNamesForTarget<Target>>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target>[EventName]) => void,\n  opts?: {\n    target?: undefined;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies: DependencyList;\n  }\n): void;\n\nfunction useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target>>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target>[EventName]) => void,\n  opts: {\n    target: Target | null;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies?: DependencyList;\n  }\n): void;\n\nfunction useEvent<\n  Target extends EventTarget,\n  EventName extends EventNamesForTarget<Target | Document>\n>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target | Document>[EventName]) => void,\n  opts: {\n    target?: Target | null | undefined;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies?: DependencyList;\n  }\n): void;\n\nfunction useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target>>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target>[EventName]) => void,\n  {\n    target = document as unknown as Target,\n    eventOptions,\n    dependencies = []\n  }: {\n    target?: Target | null;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies?: DependencyList;\n  } = {}\n) {\n  useEffect(() => {\n    if (!target) return;\n\n    target.addEventListener(eventName, cb as EventListener, eventOptions);\n\n    return () => {\n      target.removeEventListener(eventName, cb as EventListener, eventOptions);\n    };\n  }, [eventName, target, cb, eventOptions, ...dependencies]);\n}\nexport default useEvent;\n"]}
+{"version":3,"file":"useEvent.js","sourceRoot":"","sources":["../../src/hooks/useEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAsD7C,SAAS,QAAQ,CACf,SAAoB,EACpB,EAAqD,EACrD,EACE,MAAM,GAAG,QAA6B,EACtC,YAAY,EACZ,YAAY,GAAG,EAAE,KAKf,EAAE;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,CAAC,OAAO,CAAC,GAAG,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;QAC9C,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,EAAmB,EAAE,YAAY,CAAC,CAAC;QAEvE,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,mBAAmB,CAAC,SAAS,EAAE,EAAmB,EAAE,YAAY,CAAC,CAAC;QAC5E,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE,YAAY,EAAE,GAAG,YAAY,CAAC,CAAC,CAAC;AAC7D,CAAC;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { DependencyList, RefObject, useEffect } from 'react';\n\nimport { normalizeElements } from '../utils';\n\n//  Based on https://github.com/microsoft/TypeScript/issues/33047#issuecomment-704005614\ntype EventMapForTarget<Target extends EventTarget> = Target extends HTMLElement\n  ? HTMLElementEventMap\n  : Target extends SVGElement\n  ? SVGElementEventMap\n  : Target extends Document\n  ? DocumentEventMap\n  : Target extends Window\n  ? WindowEventMap\n  : {\n      [eventType: string]: Event;\n    };\ntype EventNamesForTarget<T extends EventTarget> = keyof EventMapForTarget<T> & string;\n\n/**\n * @example useEvent('keydown', (event) => { do something });\n * @param cb The function that should be executed on keydown keyevent.\n * @param options\n */\nfunction useEvent<Target extends Document, EventName extends EventNamesForTarget<Target>>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target>[EventName]) => void,\n  opts?: {\n    target?: undefined;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies: DependencyList;\n  }\n): void;\n\nfunction useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target>>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target>[EventName]) => void,\n  opts: {\n    target: Target | RefObject<Target> | null;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies?: DependencyList;\n  }\n): void;\n\nfunction useEvent<\n  Target extends EventTarget,\n  EventName extends EventNamesForTarget<Target | Document>\n>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target | Document>[EventName]) => void,\n  opts: {\n    target?: Target | RefObject<Target> | null | undefined;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies?: DependencyList;\n  }\n): void;\n\nfunction useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target>>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target>[EventName]) => void,\n  {\n    target = document as unknown as Target,\n    eventOptions,\n    dependencies = []\n  }: {\n    target?: Target | RefObject<Target> | null;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies?: DependencyList;\n  } = {}\n) {\n  useEffect(() => {\n    const [element] = normalizeElements([target]);\n    if (!element) return;\n\n    element.addEventListener(eventName, cb as EventListener, eventOptions);\n\n    return () => {\n      element.removeEventListener(eventName, cb as EventListener, eventOptions);\n    };\n  }, [eventName, target, cb, eventOptions, ...dependencies]);\n}\n\nexport default useEvent;\n"]}

package/lib/hooks/useFocusTrap.js

@@ -24,7 +24,7 @@ const useFocusTrap = (elementRef, attachToDocument = true, dependencies = []) =>
             }
         }
     }, dependencies);
-    useEvent('keydown', onKeydown, { target: attachToDocument ? undefined : elementRef?.current });
+    useEvent('keydown', onKeydown, { target: attachToDocument ? undefined : elementRef });
 };
 export default useFocusTrap;
 //# sourceMappingURL=useFocusTrap.js.map

package/lib/hooks/useFocusTrap.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFocusTrap.js","sourceRoot":"","sources":["../../src/hooks/useFocusTrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,WAAW,EAAkB,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC;;;;;GAKG;AACH,MAAM,YAAY,GAAG,CACnB,UAAkC,EAClC,mBAA4B,IAAI,EAChC,eAA+B,EAAE,EACjC,EAAE;IACF,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,CAAgB,EAAE,EAAE;QACjD,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,EAAE;YACnB,MAAM,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;YAC7C,MAAM,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,aAAa,EAAE,GAAG,UAAU,CAAC;YAEjF,IACE,CAAC,CAAC,CAAC,QAAQ;gBACX,CAAC,QAAQ,CAAC,aAAa,KAAK,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC,aAAa,KAAK,aAAa,CAAC,EAC3F;gBACA,cAAc,EAAE,KAAK,EAAE,CAAC;gBACxB,CAAC,CAAC,cAAc,EAAE,CAAC;aACpB;iBAAM,IACL,CAAC,CAAC,QAAQ;gBACV,CAAC,QAAQ,CAAC,aAAa,KAAK,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC,aAAa,KAAK,cAAc,CAAC,EAC5F;gBACA,aAAa,EAAE,KAAK,EAAE,CAAC;gBACvB,CAAC,CAAC,cAAc,EAAE,CAAC;aACpB;SACF;IACH,CAAC,EAAE,YAAY,CAAC,CAAC;IAEjB,QAAQ,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,EAAE,OAAO,EAAE,CAAC,CAAC;AACjG,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { RefObject, useCallback, DependencyList } from 'react';\n\nimport { getFocusables } from '../utils';\n\nimport useEvent from './useEvent';\n\n/**\n * @example useFocusTrap(elementRef)\n * @param elementRef ref of the element in which focus needs to be retained\n * @param addToDocument boolean value to specify if event to be attached to document or to be taken from elementRef, defaults to true\n * @param dependencies  list of variables or functions that will initiate this hook when they are updated.\n */\nconst useFocusTrap = (\n  elementRef: RefObject<HTMLElement>,\n  attachToDocument: boolean = true,\n  dependencies: DependencyList = []\n) => {\n  const onKeydown = useCallback((e: KeyboardEvent) => {\n    if (e.key === 'Tab') {\n      const focusables = getFocusables(elementRef);\n      const { 0: firstFocusable, [focusables.length - 1]: lastFocusable } = focusables;\n\n      if (\n        !e.shiftKey &&\n        (document.activeElement === elementRef.current || document.activeElement === lastFocusable)\n      ) {\n        firstFocusable?.focus();\n        e.preventDefault();\n      } else if (\n        e.shiftKey &&\n        (document.activeElement === elementRef.current || document.activeElement === firstFocusable)\n      ) {\n        lastFocusable?.focus();\n        e.preventDefault();\n      }\n    }\n  }, dependencies);\n\n  useEvent('keydown', onKeydown, { target: attachToDocument ? undefined : elementRef?.current });\n};\n\nexport default useFocusTrap;\n"]}
+{"version":3,"file":"useFocusTrap.js","sourceRoot":"","sources":["../../src/hooks/useFocusTrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,WAAW,EAAkB,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC;;;;;GAKG;AACH,MAAM,YAAY,GAAG,CACnB,UAAkC,EAClC,mBAA4B,IAAI,EAChC,eAA+B,EAAE,EACjC,EAAE;IACF,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,CAAgB,EAAE,EAAE;QACjD,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,EAAE;YACnB,MAAM,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;YAC7C,MAAM,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,aAAa,EAAE,GAAG,UAAU,CAAC;YAEjF,IACE,CAAC,CAAC,CAAC,QAAQ;gBACX,CAAC,QAAQ,CAAC,aAAa,KAAK,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC,aAAa,KAAK,aAAa,CAAC,EAC3F;gBACA,cAAc,EAAE,KAAK,EAAE,CAAC;gBACxB,CAAC,CAAC,cAAc,EAAE,CAAC;aACpB;iBAAM,IACL,CAAC,CAAC,QAAQ;gBACV,CAAC,QAAQ,CAAC,aAAa,KAAK,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC,aAAa,KAAK,cAAc,CAAC,EAC5F;gBACA,aAAa,EAAE,KAAK,EAAE,CAAC;gBACvB,CAAC,CAAC,cAAc,EAAE,CAAC;aACpB;SACF;IACH,CAAC,EAAE,YAAY,CAAC,CAAC;IAEjB,QAAQ,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC;AACxF,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { RefObject, useCallback, DependencyList } from 'react';\n\nimport { getFocusables } from '../utils';\n\nimport useEvent from './useEvent';\n\n/**\n * @example useFocusTrap(elementRef)\n * @param elementRef ref of the element in which focus needs to be retained\n * @param addToDocument boolean value to specify if event to be attached to document or to be taken from elementRef, defaults to true\n * @param dependencies  list of variables or functions that will initiate this hook when they are updated.\n */\nconst useFocusTrap = (\n  elementRef: RefObject<HTMLElement>,\n  attachToDocument: boolean = true,\n  dependencies: DependencyList = []\n) => {\n  const onKeydown = useCallback((e: KeyboardEvent) => {\n    if (e.key === 'Tab') {\n      const focusables = getFocusables(elementRef);\n      const { 0: firstFocusable, [focusables.length - 1]: lastFocusable } = focusables;\n\n      if (\n        !e.shiftKey &&\n        (document.activeElement === elementRef.current || document.activeElement === lastFocusable)\n      ) {\n        firstFocusable?.focus();\n        e.preventDefault();\n      } else if (\n        e.shiftKey &&\n        (document.activeElement === elementRef.current || document.activeElement === firstFocusable)\n      ) {\n        lastFocusable?.focus();\n        e.preventDefault();\n      }\n    }\n  }, dependencies);\n\n  useEvent('keydown', onKeydown, { target: attachToDocument ? undefined : elementRef });\n};\n\nexport default useFocusTrap;\n"]}

package/lib/hooks/useI18n.d.ts

@@ -36,7 +36,6 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     filter_by: string;
     sort_by: string;
     group_by: string;
-    all: string;
     view_all: string;
     view_less: string;
     show_more: string;
@@ -108,6 +107,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     date_quarter_q2: string;
     date_quarter_q3: string;
     date_quarter_q4: string;
+    time_unit: string;
     attachments_count: {
         zero: string;
         one: string;
@@ -161,8 +161,9 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     close_time_button_a11y: string;
     picker_next_month: string;
     picker_prev_month: string;
-    picker_jump_to_month: string;
+    picker_jump_to_month_and_year: string;
     calendar_assist: string;
+    calendar: string;
     boolean_display_true_label: string;
     boolean_display_false_label: string;
     measured_in: string;
@@ -176,10 +177,6 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     location_input_placeholder: string;
     location_not_found_text: string;
     allow_location_permissions_text: string;
-    advanced_search: string;
-    select_search_filter: string;
-    recent_searches: string;
-    clear_search: string;
     utilities_summary: string;
     expand_summary_panel: string;
     collapse_summary_panel: string;

package/lib/hooks/useI18n.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}