hrm_ui_lib 2.1.0-alpha.20 → 2.1.0-alpha.21

package/components/TableV2/types.d.ts

@@ -1,3 +1,4 @@
+import { IBaseProps } from '../../type';
 import type { ColumnDef, ColumnSizingState, PaginationState, RowSelectionState, Table, Row } from '@tanstack/react-table';
 import type { ReactNode } from 'react';
 export type TTable<TData> = Table<TData>;
@@ -5,7 +6,7 @@ export type TRowSelectionState = RowSelectionState;
 export type TColumnSizingState = ColumnSizingState;
 export type TPaginationState = PaginationState;
 export type TPersistColumnSettings = 'localStorage' | 'external';
-export type TTableProps<TData> = {
+export type TTableProps<TData> = IBaseProps & {
     data: (TData & {
         subRows?: TData[];
     })[];
@@ -58,7 +59,7 @@ export interface TableData {
     subRows: TableData[];
     [key: string]: unknown;
 }
-export interface ExpandColumnProps<TData> {
+export interface ExpandColumnProps<TData> extends IBaseProps {
     row: Row<TData>;
     expandedRows: Set<string>;
     onToggle: (rowId: string) => void;

package/components/Text/Text.js

@@ -1 +1,2 @@
-import{jsx as p}from"react/jsx-runtime";import h from"classnames";import{noop as y}from"../../utils/helpers.js";const x=e=>{const{children:t,className:i="",type:r="primary",size:s="standard",weight:a="regular",lineHeight:o="medium",as:l="p",dataId:d="",onClick:m=y,id:n="",title:c}=e;/* @__PURE__ */return p(l,{id:n,title:c,"data-id":d,onClick:m,className:h("body",s&&`body-${s}`,r&&`color-${r}`,a,o&&`lh-${o}`,i),children:t})};export{x as Text};
+import{jsx as p}from"react/jsx-runtime";import h from"classnames";import{noop as y}from"../../utils/helpers.js";const x=t=>{const{children:e,className:s="",type:i="primary",size:r="standard",weight:a="regular",lineHeight:o="medium",as:l="p",dataTestId:d="",onClick:m=y,id:n="",title:c}=t;/* @__PURE__ */
+return p(l,{id:n,title:c,"data-test-id":d,onClick:m,className:h("body",r&&`body-${r}`,i&&`color-${i}`,a,o&&`lh-${o}`,s),children:e})};export{x as Text};

package/components/Text/types.d.ts

@@ -1,9 +1,10 @@
+import { IBaseProps } from '../../type';
 import { ElementType, MouseEvent, ReactNode } from 'react';
 type TTextTypes = 'primary' | 'secondary' | 'tertiary' | 'disabled' | 'inverse' | 'selected' | 'brand' | 'danger' | 'warning' | 'success' | 'information' | 'discovery';
 export type TTextSize = 'xxsmall' | 'xsmall' | 'small' | 'standard' | 'medium' | 'large' | 'xlarge';
 type TTextWeight = 'regular' | 'semibold' | 'bold' | 'bolder';
 type TTextLineHeight = 'xsmall' | 'small' | 'medium' | 'large';
-export interface TextPropTypes {
+export interface TextPropTypes extends IBaseProps {
     id?: string;
     as?: ElementType;
     title?: string;
@@ -13,7 +14,6 @@ export interface TextPropTypes {
     weight?: TTextWeight;
     lineHeight?: TTextLineHeight;
     className?: string;
-    dataId?: string;
     onClick?: (event: MouseEvent<HTMLElement>) => void;
 }
 export {};

package/components/Textarea/Textarea.js

@@ -1,5 +1,6 @@
-import{jsxs as s,jsx as e,Fragment as F}from"react/jsx-runtime";import j,{useMemo as k}from"react";import{ErrorMessage as L}from"../../helperComponents/ErrorMessage/ErrorMessage.js";import{Label as R}from"../../helperComponents/Label/Label.js";import{Text as o}from"../Text/Text.js";import $ from"classnames";import b from"../SVGIcons/IconCheckmarkCircleFilled.js";const w=j.forwardRef(({className:a,error:r,hasError:l,label:t,disabled:n,currentValue:i,changeHandler:d,placeHolder:c,onChange:m,required:p=!1,maxCount:u,helperText:x,successMessage:h,dataId:g="",labelAddons:f,isValid:j,setFieldValue:v,...y},N)=>{const C=k(()=>i?i.length:y&&y.value&&"string"==typeof y.value?y.value.length:0,[y,i]);/* @__PURE__ */return s("div",{className:$("textarea",a,{"textarea--invalid":l}),children:[
+import{jsxs as s,jsx as e,Fragment as F}from"react/jsx-runtime";import j,{useMemo as k}from"react";import{ErrorMessage as L}from"../../helperComponents/ErrorMessage/ErrorMessage.js";import{Label as R}from"../../helperComponents/Label/Label.js";import{Text as o}from"../Text/Text.js";import $ from"classnames";import b from"../SVGIcons/IconCheckmarkCircleFilled.js";const w=j.forwardRef(({className:a,error:r,hasError:l,label:t,disabled:n,currentValue:i,changeHandler:d,placeHolder:c,onChange:m,required:p=!1,maxCount:u,helperText:x,successMessage:h,dataTestId:g="",labelAddons:f,isValid:j,setFieldValue:v,...y},N)=>{const T=k(()=>i?i.length:y&&y.value&&"string"==typeof y.value?y.value.length:0,[y,i]);/* @__PURE__ */
+return s("div",{className:$("textarea",a,{"textarea--invalid":l}),children:[
 /* @__PURE__ */e(R,{text:t,required:p,disabled:n,labelAddons:f}),
-/* @__PURE__ */e("div",{className:"textarea__inner",children:/* @__PURE__ */e("textarea",{"data-id":g,disabled:n,ref:N,placeholder:c,...y,onChange:e=>{d&&d(e),m&&m(e)},...i?{value:i}:{}})}),r||h||x||u?/* @__PURE__ */s("div",{className:"textarea__message mt-8",children:[r&&/* @__PURE__ */e(L,{message:r,icon:"infoFilled",dataId:g}),h?/* @__PURE__ */e(o,{size:"small",type:"success",className:"flexbox align-items--center",children:/* @__PURE__ */s(F,{children:[
+/* @__PURE__ */e("div",{className:"textarea__inner",children:/* @__PURE__ */e("textarea",{"data-test-id":g,disabled:n,ref:N,placeholder:c,...y,onChange:e=>{d&&d(e),m&&m(e)},...i?{value:i}:{}})}),r||h||x||u?/* @__PURE__ */s("div",{className:"textarea__message mt-8",children:[r&&/* @__PURE__ */e(L,{message:r,icon:"infoFilled",dataTestId:g}),h?/* @__PURE__ */e(o,{size:"small",type:"success",className:"flexbox align-items--center",children:/* @__PURE__ */s(F,{children:[
 /* @__PURE__ */e(b,{type:"success",size:"xsmall"}),
-/* @__PURE__ */e("span",{className:"ml-4",children:h})]})}):null,x&&!h?/* @__PURE__ */e(o,{size:"small",type:n?"disabled":"secondary",children:x}):null,u?/* @__PURE__ */e(o,{size:"small",type:n?"disabled":"secondary",className:"textarea__counter",children:`${C}/${u}`}):null]}):null]})});w.displayName="Textarea";export{w as Textarea};
+/* @__PURE__ */e("span",{className:"ml-4",children:h})]})}):null,x&&!h?/* @__PURE__ */e(o,{size:"small",type:n?"disabled":"secondary",children:x}):null,u?/* @__PURE__ */e(o,{size:"small",type:n?"disabled":"secondary",className:"textarea__counter",children:`${T}/${u}`}):null]}):null]})});w.displayName="Textarea";export{w as Textarea};

package/components/Textarea/types.d.ts

@@ -1,3 +1,4 @@
+import { IFormCompProps } from '../../type';
 export interface TTextAreaTypeProps extends IFormCompProps {
     className?: string;
     name?: string;

package/components/Tooltip/Tooltip.js

@@ -1,2 +1,2 @@
-import{jsx as p}from"react/jsx-runtime";import{useRef as H,useState as l,useEffect as n}from"react";import I from"classnames";import{Text as N}from"../Text/Text.js";import{useGetTooltipStyles as P}from"../../hooks/useGetTooltipStyles.js";import{useHideOnScroll as $}from"../../hooks/useHideOnScroll.js";import"../../context/types.js";import"../../hooks/useScreenSize.js";import"react-hook-form";import{Positions as M}from"./types.js";import{createPortal as O}from"react-dom";const k=e=>{const t=H(null),{size:o="large",text:s,className:i="",position:r=M.BOTTOM_LEFT,dataId:a="",id:m,elemRef:u,hovered:c=!1}=e,[d,f]=l(c),[v,h]=l(u||null),[x,y]=l(0);n(()=>{if(m){const e=document.getElementById(m.toString());h(e)}},[m]);const T=()=>{f(!0)},S=()=>f(!1);$(S);const{tooltipStyles:j,tooltipPosition:E}=P({elemRef:v,tooltipRef:t.current,initialPosition:r,toolTipCurrentWidth:x});return n(()=>(v&&(v.addEventListener("mouseenter",T),v.addEventListener("mouseleave",S)),()=>{null==v||v.removeEventListener("mouseenter",T),null==v||v.removeEventListener("mouseleave",S)}),[v]),n(()=>{var e;y(d&&(null==(e=null==t?void 0:t.current)?void 0:e.clientWidth)||0)},[d]),d?O(
-/* @__PURE__ */p("div",{style:j,"data-id":a,className:I(`tooltip tooltip--${o} tooltip--${E}`,i),ref:t,children:/* @__PURE__ */p(N,{dataId:`${a}-text`,className:"tooltip__inner",type:"primary",weight:"regular",lineHeight:"small",size:"small"==o?"xsmall":"small",children:s})}),document.body):null};export{k as Tooltip};
+import{jsx as p}from"react/jsx-runtime";import{useRef as H,useState as l,useEffect as n}from"react";import I from"classnames";import{Text as N}from"../Text/Text.js";import{useGetTooltipStyles as P}from"../../hooks/useGetTooltipStyles.js";import{useHideOnScroll as $}from"../../hooks/useHideOnScroll.js";import"../../context/types.js";import"../../hooks/useScreenSize.js";import"react-hook-form";import{Positions as M}from"./types.js";import{createPortal as O}from"react-dom";const k=e=>{const t=H(null),{size:o="large",text:s,className:i="",position:r=M.BOTTOM_LEFT,dataTestId:a="",id:m,elemRef:u,hovered:c=!1}=e,[d,f]=l(c),[v,T]=l(u||null),[h,x]=l(0);n(()=>{if(m){const e=document.getElementById(m.toString());T(e)}},[m]);const y=()=>{f(!0)},S=()=>f(!1);$(S);const{tooltipStyles:j,tooltipPosition:E}=P({elemRef:v,tooltipRef:t.current,initialPosition:r,toolTipCurrentWidth:h});return n(()=>(v&&(v.addEventListener("mouseenter",y),v.addEventListener("mouseleave",S)),()=>{null==v||v.removeEventListener("mouseenter",y),null==v||v.removeEventListener("mouseleave",S)}),[v]),n(()=>{var e;x(d&&(null==(e=null==t?void 0:t.current)?void 0:e.clientWidth)||0)},[d]),d?O(
+/* @__PURE__ */p("div",{style:j,"data-test-id":a,className:I(`tooltip tooltip--${o} tooltip--${E}`,i),ref:t,children:/* @__PURE__ */p(N,{dataTestId:`${a}-text`,className:"tooltip__inner",type:"primary",weight:"regular",lineHeight:"small",size:""+("small"==o?"xsmall":"small"),children:s})}),document.body):null};export{k as Tooltip};

package/components/Tooltip/types.d.ts

@@ -1,3 +1,4 @@
+import { IFormCompProps } from '../../type';
 import { ReactElement } from 'react';
 export declare enum Positions {
     BOTTOM_LEFT = "bottom-left",

package/components/UnderConstruction/UnderConstruction.js

@@ -1,5 +1,6 @@
-import{jsxs as s,jsx as e}from"react/jsx-runtime";import{Text as n}from"../Text/Text.js";import{Image as d}from"../Image/Image.js";import g from"classnames";import u from"../../assets/images/under-construction.webp.js";import{SELECT_TRANSLATIONS as p}from"./localization.js";const M=a=>{const{size:r="large",mainMessage:t,paragraphMessage:i,className:o,illustration:c=u,language:m="en"}=a,l=p[m];/* @__PURE__ */return s("div",{className:g("under-construction "+("large"===r?"under-construction--large":"under-construction--small"),o),children:[
-/* @__PURE__ */e("div",{className:"under-construction__icon",children:/* @__PURE__ */e(d,{imagePath:c})}),
-/* @__PURE__ */s("div",{className:"under-construction__content",children:[
-/* @__PURE__ */e(n,{size:"large"==r?"large":"medium",weight:"bold",children:t??l.mainMessage}),
-/* @__PURE__ */e(n,{size:"large"==r?"standard":"small",children:i??l.paragraphMessage})]})]})};export{M as UnderConstruction};
+import{jsxs as r,jsx as a}from"react/jsx-runtime";import{Text as n}from"../Text/Text.js";import{Image as g}from"../Image/Image.js";import u from"classnames";import p from"../../assets/images/under-construction.webp.js";import{SELECT_TRANSLATIONS as h}from"./localization.js";const z=e=>{const{size:s="large",mainMessage:t,paragraphMessage:i,className:o,illustration:m=p,language:c="en",dataTestId:d=""}=e,l=h[c];/* @__PURE__ */
+return r("div",{className:u("under-construction "+("large"===s?"under-construction--large":"under-construction--small"),o),"data-test-id":d,children:[
+/* @__PURE__ */a("div",{className:"under-construction__icon",children:/* @__PURE__ */a(g,{imagePath:m,dataTestId:d?`${d}-image`:""})}),
+/* @__PURE__ */r("div",{className:"under-construction__content",children:[
+/* @__PURE__ */a(n,{size:"large"==s?"large":"medium",weight:"bold",dataTestId:d?`${d}-text`:"",children:t??l.mainMessage}),
+/* @__PURE__ */a(n,{size:"large"==s?"standard":"small",dataTestId:d?`${d}-subtext`:"",children:i??l.paragraphMessage})]})]})};export{z as UnderConstruction};

package/components/UnderConstruction/types.d.ts

@@ -1,4 +1,5 @@
-export interface TUnderConstructionProps {
+import { IBaseProps } from '../../type';
+export interface TUnderConstructionProps extends IBaseProps {
     size?: string;
     className?: string;
     mainMessage?: string;

package/context/types.d.ts

@@ -8,6 +8,7 @@ export type TFormContextProps = {
     watch?: UseFormWatch<TFormData>;
     reset?: UseFormReset<TFormData>;
     isDirty?: boolean;
+    isValid?: boolean;
     clearErrors?: UseFormClearErrors<TFormData>;
     setError?: UseFormSetError<TFormData>;
     isSubmitted: boolean;

package/helperComponents/ErrorMessage/ErrorMessage.d.ts

@@ -1,3 +1,3 @@
 import { ReactElement } from 'react';
 import { TErrorMessageProps } from './types';
-export declare const ErrorMessage: ({ message, icon, dataId, className }: TErrorMessageProps) => ReactElement;
+export declare const ErrorMessage: ({ message, icon, dataTestId, className }: TErrorMessageProps) => ReactElement;

package/helperComponents/ErrorMessage/ErrorMessage.js

@@ -1,3 +1,3 @@
-import{jsx as r,jsxs as a,Fragment as t}from"react/jsx-runtime";import{Text as n}from"../../components/Text/Text.js";import{generateDataTestId as i}from"../../utils/helpers.js";import l from"classnames";import{ICONS_MAPPING as p}from"./consts.js";import{IconDynamicComponent as c}from"../IconDynamicComponent/IconDynamicComponent.js";const h=({message:s,icon:e="infoFilled",dataId:o,className:m})=>/* @__PURE__ */r(n,{className:l("error-message",m),size:"small",type:"danger",dataId:i("error-message",o),children:/* @__PURE__ */a(t,{children:[
-/* @__PURE__ */r(c,{Component:p[e],className:"mr-4",size:"xsmall",type:"danger"}),
-/* @__PURE__ */r("span",{children:s})]})});export{h as ErrorMessage};
+import{jsx as e,jsxs as a,Fragment as t}from"react/jsx-runtime";import{Text as n}from"../../components/Text/Text.js";import{generateDataTestId as i}from"../../utils/helpers.js";import l from"classnames";import{ICONS_MAPPING as p}from"./consts.js";import{IconDynamicComponent as c}from"../IconDynamicComponent/IconDynamicComponent.js";const h=({message:s,icon:o="infoFilled",dataTestId:r,className:m})=>/* @__PURE__ */e(n,{className:l("error-message",m),size:"small",type:"danger",dataTestId:i("error-message",r),children:/* @__PURE__ */a(t,{children:[
+/* @__PURE__ */e(c,{Component:p[o],className:"mr-4",size:"xsmall",type:"danger"}),
+/* @__PURE__ */e("span",{children:s})]})});export{h as ErrorMessage};

package/helperComponents/ErrorMessage/types.d.ts

@@ -1,6 +1,6 @@
 export interface TErrorMessageProps {
     message?: string | React.ReactElement;
     icon?: string;
-    dataId?: string;
+    dataTestId?: string;
     className?: string;
 }

package/helperComponents/Label/types.d.ts

@@ -7,5 +7,5 @@ export interface LabelPropTypes {
     size?: 'xxsmall' | 'xsmall' | 'small' | 'standard' | 'medium' | 'large';
     className?: string;
     labelAddons?: React.ReactElement;
-    dataId?: string;
+    dataTestId?: string;
 }

package/helperComponents/Loader/Loader.js

@@ -1 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";const s=r=>{const{size:a="large",type:s="lite"}=r;/* @__PURE__ */return e("div",{className:`loader loader--${s} loader--${a}`,children:/* @__PURE__ */e("span",{className:"loader__inner"})})};export{s as Loader};
+import{jsx as e}from"react/jsx-runtime";const s=r=>{const{size:a="large",type:s="lite"}=r;/* @__PURE__ */
+return e("div",{className:`loader loader--${s} loader--${a}`,children:/* @__PURE__ */e("span",{className:"loader__inner"})})};export{s as Loader};

package/helperComponents/OptionItem/OptionItem.js

@@ -1,5 +1,5 @@
-import{jsxs as n,jsx as t,Fragment as I}from"react/jsx-runtime";import m from"classnames";import{useCallback as $}from"react";import{Avatar as y}from"../../components/Avatar/Avatar.js";import{Tooltip as j}from"../../components/Tooltip/Tooltip.js";import"../../consts/index.js";import"../../context/types.js";import"../../hooks/useScreenSize.js";import"react-hook-form";import{Checkbox as A}from"../../components/Checkbox/Checkbox.js";import O from"../../components/SVGIcons/IconCheckmark.js";const E=e=>{const{size:o="small",data:a,onClick:s,disabled:l,isSelected:i,labelLeftIconProps:r,LabelRightIconComponent:c,OptionRightIconComponent:p,isCheckbox:d,className:_="",tooltipAddons:b,dataId:x="",style:h={}}=e,{label:u,meta:C,value:f,optionLeftIcon:g,avatar:k}=a,N=$(e=>{e.preventDefault(),e.stopPropagation(),!l&&s({value:f,label:u,meta:C})},[l,f,u,s]),v=/* @__PURE__ */n("div",{"data-id":x,id:`${f}`,className:m("select__option",{"select__option--disabled":l},_),onClick:N,style:h,children:[d?/* @__PURE__ */t(A,{className:"mr-8",selectedValue:i,disabled:l}):null,!d&&i?/* @__PURE__ */t(O,{size:"xsmall",type:l?"disabled":"brand",className:"mr-8"}):null,
+import{jsxs as n,jsx as t,Fragment as I}from"react/jsx-runtime";import m from"classnames";import{useCallback as $}from"react";import{Avatar as y}from"../../components/Avatar/Avatar.js";import{Tooltip as j}from"../../components/Tooltip/Tooltip.js";import"../../consts/index.js";import"../../context/types.js";import"../../hooks/useScreenSize.js";import"react-hook-form";import{Checkbox as A}from"../../components/Checkbox/Checkbox.js";import O from"../../components/SVGIcons/IconCheckmark.js";const E=e=>{const{size:o="small",data:s,onClick:a,disabled:l,isSelected:i,labelLeftIconProps:r,LabelRightIconComponent:c,OptionRightIconComponent:p,isCheckbox:d,className:_="",tooltipAddons:b,dataTestId:x="",style:h={}}=e,{label:u,meta:C,value:f,optionLeftIcon:g,avatar:k}=s,N=$(e=>{e.preventDefault(),e.stopPropagation(),!l&&a({value:f,label:u,meta:C})},[l,f,u,a]),v=/* @__PURE__ */n("div",{"data-test-id":x,id:`${f}`,className:m("select__option",{"select__option--disabled":l},_),onClick:N,style:h,children:[d?/* @__PURE__ */t(A,{className:"mr-8",selectedValue:i,disabled:l}):null,!d&&i?/* @__PURE__ */t(O,{size:"xsmall",type:l?"disabled":"brand",className:"mr-8"}):null,
 /* @__PURE__ */n("div",{className:"select__option__inner",children:[g&&g.Component?/* @__PURE__ */t(g.Component,{...g,size:"small",className:"mr-8"}):null,k&&/* @__PURE__ */t(y,{size:"small"===o?"xxsmall":"medium",imagePath:k.url,className:"mr-4",initials:k.initials}),null!=r&&r.Component?/* @__PURE__ */t(r.Component,{size:"xsmall",type:l?"disabled":"primary",className:"mr-4",...r}):null,
-/* @__PURE__ */n("div",{className:m("select__option__content",{select__option__content__large:"large"===o}),"data-id":x,children:[
+/* @__PURE__ */n("div",{className:m("select__option__content",{select__option__content__large:"large"===o}),"data-test-id":x,children:[
 /* @__PURE__ */t("span",{className:m("select__option__text pr-4 "+(l?"color-disabled":""),{select__option__text__large:"large"===o}),children:u}),c&&c(f),C?/* @__PURE__ */t("span",{className:m("select__option__meta "+(l?"color-disabled":""),{select__option__meta__large:"large"===o}),children:C}):null]})]}),p&&p(f)]});return b?/* @__PURE__ */n(I,{children:[
 /* @__PURE__ */t(j,{...b,text:`${u}`,id:`${f}`}),v]}):v};export{E as OptionItem};

package/helperComponents/OptionItem/types.d.ts

@@ -11,7 +11,7 @@ export type TSelectItemProps = {
     disabled?: boolean;
     isCheckbox?: boolean;
     tooltipAddons?: TTooltipProps;
-    dataId?: string;
+    dataTestId?: string;
     style?: CSSProperties;
     size?: 'small' | 'large';
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hrm_ui_lib",
-  "version": "2.1.0-alpha.20",
+  "version": "2.1.0-alpha.21",
   "description": "UI library for Dino",
   "main": "./index.cjs",
   "module": "./index.js",

package/type/base.d.ts

@@ -0,0 +1,14 @@
+export interface IBaseProps {
+    dataTestId?: string;
+}
+export interface IFormCompProps extends IBaseProps {
+    hasError?: boolean;
+    isValid?: boolean;
+    value?: TFormValue;
+    onChange?: TOnChange;
+    placeholder?: string;
+    name?: string;
+    setFieldValue?: (name: string, value: TFormValue, shouldValidate?: {
+        shouldValidate: boolean;
+    }) => void;
+}

package/type/index.d.ts

@@ -1,3 +1,4 @@
+export * from './base';
 export * from './locale';
 export * from './file-upload';
 export * from './notification';

package/type/svg-icons.d.ts

@@ -8,7 +8,7 @@ export interface ISVGIconProps {
     className?: string;
     refHandler?: LegacyRef<SVGSVGElement> | undefined;
     id?: string;
-    dataId?: string;
+    dataTestId?: string;
     Component?: TSVGIconComponent;
 }
 export type TTextSize = 'xxsmall' | 'xsmall' | 'small' | 'standard' | 'medium' | 'large';

package/utils/helpers.d.ts

@@ -13,5 +13,5 @@ export declare const getStringWidth: (text: string, fontSize: number) => number;
 export declare const setTranslationValue: (translation: string, value: string | number) => string;
 export declare const getYearOptions: (startYear: number, lastYear: number) => TSelectOptions;
 export declare const isSameDay: (date1?: Date, date2?: Date) => boolean;
-export declare const generateDataTestId: (postfix: string, dataId?: string) => string;
+export declare const generateDataTestId: (postfix: string, dataTestId?: string) => string;
 export declare const clearStorage: (preservedKeys?: STORE_KEYS[]) => void;