@skbkontur/react-ui 3.10.0-fileuploader.2 → 3.11.0-select-right-2

package/lib/theming/useTheme/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/lib/theming/useTheme.js",
+  "module": "useTheme",
+  "types": "../useTheme.d.ts",
+  "sideEffects": false
+}

package/lib/theming/useTheme/useTheme.js

@@ -0,0 +1,5 @@
+import { useContext } from 'react';
+import { ThemeContext } from "../ThemeContext";
+export var useTheme = function useTheme() {
+  return useContext(ThemeContext);
+};

package/lib/theming/useTheme/useTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useTheme.ts"],"names":["useContext","ThemeContext","useTheme"],"mappings":"AAAA,SAASA,UAAT,QAA2B,OAA3B;;AAEA,SAASC,YAAT,QAA6B,gBAA7B;;AAEA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAW,GAAM;AAC5B,SAAOF,UAAU,CAACC,YAAD,CAAjB;AACD,CAFM","sourcesContent":["import { useContext } from 'react';\n\nimport { ThemeContext } from './ThemeContext';\n\nexport const useTheme = () => {\n  return useContext(ThemeContext);\n};\n"]}

package/lib/theming/useTheme.d.ts

@@ -0,0 +1 @@
+export declare const useTheme: () => Readonly<Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>>;

package/lib/utils/utils.js

@@ -1,6 +1,7 @@
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 import _wrapNativeSuper from "@babel/runtime/helpers/esm/wrapNativeSuper";
 import React from 'react';
+import { isForwardRef } from 'react-is';
 import { isBrowser } from "../client"; // NOTE: Copy-paste from @types/react
 
 export var delay = function delay(ms) {
@@ -45,7 +46,16 @@ export function isFunction(x) {
   return typeof x === 'function';
 }
 export function isFunctionalComponent(Component) {
-  return typeof Component === 'function' && !(Component.prototype && Component.prototype.isReactComponent);
+  return Boolean(typeof Component === 'function' && !(Component.prototype && Component.prototype.isReactComponent));
+}
+export function isClassComponent(Component) {
+  return Boolean(typeof Component === 'function' && Component.prototype && Component.prototype.isReactComponent);
+}
+export function isIntrinsicElement(element) {
+  return typeof element.type === 'string';
+}
+export function isRefableElement(element) {
+  return Boolean(isIntrinsicElement(element) || isClassComponent(element.type) || isForwardRef(element));
 }
 export function escapeRegExpSpecChars(s) {
   return s.replace(/[\\^$*+?.()|[\]{}]/g, '\\$&');
@@ -68,24 +78,6 @@ export var isReactUINode = function isReactUINode(componentName, node) {
 
   return false;
 };
-var KB = 1024;
-var UNITS = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-export var formatBytes = function formatBytes(bytes, decimals) {
-  if (decimals === void 0) {
-    decimals = 2;
-  }
-
-  if (bytes === 0) return '0 Bytes';
-
-  if (!bytes) {
-    return null;
-  }
-
-  decimals = decimals < 0 ? 0 : decimals;
-  var i = Math.floor(Math.log2(bytes) / Math.log2(KB));
-  var formattedBytes = parseFloat((bytes / Math.pow(KB, i)).toFixed(decimals));
-  return formattedBytes + " " + UNITS[i];
-};
 /**
  * Проверяет, не является ли переданный аргумент null или undefined и исключает типы null и undefined из типа аргумента
  *
@@ -95,4 +87,70 @@ export var formatBytes = function formatBytes(bytes, decimals) {
 
 export var isNonNullable = function isNonNullable(value) {
   return value !== null && value !== undefined;
+};
+/**
+ * Creates a function that checks if the given `child`
+ * is an instance of some component specified by `name`.
+ *
+ * @param name Component name for which function will be created.
+ * @returns A function that checks if the given `child` is an instance of the component specified by `name`.
+ */
+
+export var isReactUIComponent = function isReactUIComponent(name) {
+  return function (child) {
+    var _child$type; // @ts-ignore
+
+
+    return (child == null ? void 0 : (_child$type = child.type) == null ? void 0 : _child$type.__KONTUR_REACT_UI__) === name;
+  };
+};
+/**
+ * Merges two or more refs into one.
+ *
+ * @param refs Array of refs.
+ * @returns A single ref composing all the refs passed.
+ *
+ * @example
+ * const SomeComponent = forwardRef((props, ref) => {
+ *  const localRef = useRef();
+ *
+ *  return <div ref={mergeRefs([localRef, ref])} />;
+ * });
+ */
+
+export function mergeRefs(refs) {
+  return function (value) {
+    refs.forEach(function (ref) {
+      if (typeof ref === 'function') {
+        return ref(value);
+      } else if (isNonNullable(ref)) {
+        return ref.current = value;
+      }
+    });
+  };
+}
+/**
+ * Extracts all data attributes from props and returns them as well as props.
+ *
+ * @param props Props object to extract data attributes from.
+ * @returns Separated data attributes and all other props.
+ */
+
+export var extractDataProps = function extractDataProps(props) {
+  var dataProps = {};
+  var restWithoutDataProps = {};
+  Object.entries(props).map(function (_ref) {
+    var name = _ref[0],
+        value = _ref[1];
+
+    if (name.startsWith('data-')) {
+      dataProps[name] = value;
+    } else {
+      restWithoutDataProps[name] = value;
+    }
+  });
+  return {
+    dataProps: dataProps,
+    restWithoutDataProps: restWithoutDataProps
+  };
 };

package/lib/utils/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["utils.ts"],"names":["React","isBrowser","delay","ms","Promise","resolve","setTimeout","emptyHandler","CancelationError","code","Error","taskWithDelay","task","cancelationToken","reject","then","isFunction","x","isFunctionalComponent","Component","prototype","isReactComponent","escapeRegExpSpecChars","s","replace","getRandomID","Math","random","toString","slice","isExternalLink","link","RegExp","window","location","host","test","isReactUINode","componentName","node","isValidElement","Object","hasOwnProperty","call","type","__KONTUR_REACT_UI__","KB","UNITS","formatBytes","bytes","decimals","i","floor","log2","formattedBytes","parseFloat","pow","toFixed","isNonNullable","value","undefined"],"mappings":"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","sourcesContent":["import { ReactComponentLike } from 'prop-types';\nimport React from 'react';\n\nimport { isBrowser } from './client';\n\n// NOTE: Copy-paste from @types/react\nexport type Defaultize<P, D> = P extends any\n  ? string extends keyof P\n    ? P\n    : Pick<P, Exclude<keyof P, keyof D>> &\n        Partial<Pick<P, Extract<keyof P, keyof D>>> &\n        Partial<Pick<D, Exclude<keyof D, keyof P>>>\n  : never;\n\nexport type DefaultizeProps<C, P> = C extends { defaultProps: infer D } ? Defaultize<P, D> : P;\n\nexport const delay = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));\n\nexport const emptyHandler = () => {\n  /* noop */\n};\n\nexport class CancelationError extends Error {\n  public code = 'CancelationError';\n}\n\nexport function taskWithDelay(task: () => void, ms: number) {\n  let cancelationToken: () => void = () => null;\n\n  new Promise((resolve, reject) => {\n    cancelationToken = reject;\n    setTimeout(resolve, ms);\n  })\n    .then(task)\n    .catch(() => null);\n\n  return cancelationToken;\n}\n\nexport function isFunction<T>(x: T | Function): x is Function {\n  return typeof x === 'function';\n}\n\nexport function isFunctionalComponent(Component: ReactComponentLike) {\n  return typeof Component === 'function' && !(Component.prototype && Component.prototype.isReactComponent);\n}\n\nexport function escapeRegExpSpecChars(s: string): string {\n  return s.replace(/[\\\\^$*+?.()|[\\]{}]/g, '\\\\$&');\n}\n\nexport const getRandomID = (): string => Math.random().toString(16).slice(2);\n\nexport const isExternalLink = (link: string): boolean => {\n  return new RegExp(`^(https?:)?//${isBrowser ? `(?!${window.location.host})` : ``}\\\\S+`, 'gi').test(link);\n};\n\n/**\n * Check if the given ReactNode is an element of the specified ReactUI component\n */\nexport const isReactUINode = (componentName: string, node: React.ReactNode): boolean => {\n  if (React.isValidElement(node)) {\n    return (\n      Object.prototype.hasOwnProperty.call(node.type, '__KONTUR_REACT_UI__') &&\n      // @ts-ignore\n      node.type.__KONTUR_REACT_UI__ === componentName\n    );\n  }\n\n  return false;\n};\n\nconst KB = 1024;\nconst UNITS = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n\nexport const formatBytes = (bytes: number, decimals = 2): string | null => {\n  if (bytes === 0) return '0 Bytes';\n\n  if (!bytes) {\n    return null;\n  }\n\n  decimals = decimals < 0 ? 0 : decimals;\n\n  const i = Math.floor(Math.log2(bytes) / Math.log2(KB));\n  const formattedBytes = parseFloat((bytes / Math.pow(KB, i)).toFixed(decimals));\n\n  return `${formattedBytes} ${UNITS[i]}`;\n};\n\n/**\n * Проверяет, не является ли переданный аргумент null или undefined и исключает типы null и undefined из типа аргумента\n *\n * @param value Значение, которое нужно проверить и исключить из него типы\n * @returns Возвращает true, если переданный аргумент не является null или undefined иначе false\n */\nexport const isNonNullable = <T>(value: T): value is NonNullable<T> => {\n  return value !== null && value !== undefined;\n};\n"]}
+{"version":3,"sources":["utils.ts"],"names":["React","isForwardRef","isBrowser","delay","ms","Promise","resolve","setTimeout","emptyHandler","CancelationError","code","Error","taskWithDelay","task","cancelationToken","reject","then","isFunction","x","isFunctionalComponent","Component","Boolean","prototype","isReactComponent","isClassComponent","isIntrinsicElement","element","type","isRefableElement","escapeRegExpSpecChars","s","replace","getRandomID","Math","random","toString","slice","isExternalLink","link","RegExp","window","location","host","test","isReactUINode","componentName","node","isValidElement","Object","hasOwnProperty","call","__KONTUR_REACT_UI__","isNonNullable","value","undefined","isReactUIComponent","name","child","mergeRefs","refs","forEach","ref","current","extractDataProps","props","dataProps","restWithoutDataProps","entries","map","startsWith"],"mappings":";AACA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,YAAT,QAA6B,UAA7B;;AAEA,SAASC,SAAT,QAA0B,UAA1B;;AAEA;;;;;;;;;;;AAWA,OAAO,IAAMC,KAAK,GAAG,SAARA,KAAQ,CAACC,EAAD,UAAgB,IAAIC,OAAJ,CAAY,UAACC,OAAD,UAAaC,UAAU,CAACD,OAAD,EAAUF,EAAV,CAAvB,EAAZ,CAAhB,EAAd;;AAEP,OAAO,IAAMI,YAAY,GAAG,SAAfA,YAAe,GAAM;AAChC;AACD,CAFM;;AAIP,WAAaC,gBAAb;AACSC,IAAAA,IADT,GACgB,kBADhB,wEAAsCC,KAAtC;;;AAIA,OAAO,SAASC,aAAT,CAAuBC,IAAvB,EAAyCT,EAAzC,EAAqD;AAC1D,MAAIU,gBAA4B,GAAG,oCAAM,IAAN,EAAnC;;AAEA,MAAIT,OAAJ,CAAY,UAACC,OAAD,EAAUS,MAAV,EAAqB;AAC/BD,IAAAA,gBAAgB,GAAGC,MAAnB;AACAR,IAAAA,UAAU,CAACD,OAAD,EAAUF,EAAV,CAAV;AACD,GAHD;AAIGY,EAAAA,IAJH,CAIQH,IAJR;AAKS,sBAAM,IAAN,EALT;;AAOA,SAAOC,gBAAP;AACD;;AAED,OAAO,SAASG,UAAT,CAAuBC,CAAvB,EAAuD;AAC5D,SAAO,OAAOA,CAAP,KAAa,UAApB;AACD;;AAED,OAAO,SAASC,qBAAT,CAA+BC,SAA/B,EAAuE;AAC5E,SAAOC,OAAO,CAAC,OAAOD,SAAP,KAAqB,UAArB,IAAmC,EAAEA,SAAS,CAACE,SAAV,IAAuBF,SAAS,CAACE,SAAV,CAAoBC,gBAA7C,CAApC,CAAd;AACD;;AAED,OAAO,SAASC,gBAAT,CAA0BJ,SAA1B,EAAkE;AACvE,SAAOC,OAAO,CAAC,OAAOD,SAAP,KAAqB,UAArB,IAAmCA,SAAS,CAACE,SAA7C,IAA0DF,SAAS,CAACE,SAAV,CAAoBC,gBAA/E,CAAd;AACD;;AAED,OAAO,SAASE,kBAAT,CAA4BC,OAA5B,EAAkE;AACvE,SAAO,OAAOA,OAAO,CAACC,IAAf,KAAwB,QAA/B;AACD;;AAED,OAAO,SAASC,gBAAT,CAA0BF,OAA1B,EAAgE;AACrE,SAAOL,OAAO,CAACI,kBAAkB,CAACC,OAAD,CAAlB,IAA+BF,gBAAgB,CAACE,OAAO,CAACC,IAAT,CAA/C,IAAiE1B,YAAY,CAACyB,OAAD,CAA9E,CAAd;AACD;;AAED,OAAO,SAASG,qBAAT,CAA+BC,CAA/B,EAAkD;AACvD,SAAOA,CAAC,CAACC,OAAF,CAAU,qBAAV,EAAiC,MAAjC,CAAP;AACD;;AAED,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAc,WAAcC,IAAI,CAACC,MAAL,GAAcC,QAAd,CAAuB,EAAvB,EAA2BC,KAA3B,CAAiC,CAAjC,CAAd,EAApB;;AAEP,OAAO,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,CAACC,IAAD,EAA2B;AACvD,SAAO,IAAIC,MAAJ,oBAA2BrC,SAAS,WAASsC,MAAM,CAACC,QAAP,CAAgBC,IAAzB,WAApC,YAAiF,IAAjF,EAAuFC,IAAvF,CAA4FL,IAA5F,CAAP;AACD,CAFM;;AAIP;AACA;AACA;AACA,OAAO,IAAMM,aAAa,GAAG,SAAhBA,aAAgB,CAACC,aAAD,EAAwBC,IAAxB,EAA2D;AACtF,oBAAI9C,KAAK,CAAC+C,cAAN,CAAqBD,IAArB,CAAJ,EAAgC;AAC9B;AACEE,MAAAA,MAAM,CAAC1B,SAAP,CAAiB2B,cAAjB,CAAgCC,IAAhC,CAAqCJ,IAAI,CAACnB,IAA1C,EAAgD,qBAAhD;AACA;AACAmB,MAAAA,IAAI,CAACnB,IAAL,CAAUwB,mBAAV,KAAkCN,aAHpC;;AAKD;;AAED,SAAO,KAAP;AACD,CAVM;;AAYP;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMO,aAAa,GAAG,SAAhBA,aAAgB,CAAIC,KAAJ,EAA0C;AACrE,SAAOA,KAAK,KAAK,IAAV,IAAkBA,KAAK,KAAKC,SAAnC;AACD,CAFM;;AAIP;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,CAAUC,IAAV,EAA2B;AAC3D,SAAO,UAACC,KAAD,EAA4D;AACjE;AACA,WAAO,CAAAA,KAAK,QAAL,2BAAAA,KAAK,CAAE9B,IAAP,iCAAawB,mBAAb,MAAqCK,IAA5C;AACD,GAHD;AAID,CALM;;AAOP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASE,SAAT,CAA4BC,IAA5B,EAA+G;AACpH,SAAO,UAACN,KAAD,EAAW;AAChBM,IAAAA,IAAI,CAACC,OAAL,CAAa,UAACC,GAAD,EAAS;AACpB,UAAI,OAAOA,GAAP,KAAe,UAAnB,EAA+B;AAC7B,eAAOA,GAAG,CAACR,KAAD,CAAV;AACD,OAFD,MAEO,IAAID,aAAa,CAACS,GAAD,CAAjB,EAAwB;AAC7B,eAASA,GAAD,CAA0CC,OAA1C,GAAoDT,KAA5D;AACD;AACF,KAND;AAOD,GARD;AASD;;AAED;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMU,gBAAgB,GAAG,SAAnBA,gBAAmB,CAAIC,KAAJ,EAAiB;AAC/C,MAAMC,SAA8B,GAAG,EAAvC;AACA,MAAMC,oBAAyC,GAAG,EAAlD;;AAEAlB,EAAAA,MAAM,CAACmB,OAAP,CAAeH,KAAf,EAAsBI,GAAtB,CAA0B,gBAAmB,KAAjBZ,IAAiB,WAAXH,KAAW;AAC3C,QAAIG,IAAI,CAACa,UAAL,CAAgB,OAAhB,CAAJ,EAA8B;AAC5BJ,MAAAA,SAAS,CAACT,IAAD,CAAT,GAAkBH,KAAlB;AACD,KAFD,MAEO;AACLa,MAAAA,oBAAoB,CAACV,IAAD,CAApB,GAA6BH,KAA7B;AACD;AACF,GAND;;AAQA,SAAO,EAAEY,SAAS,EAATA,SAAF,EAAaC,oBAAoB,EAApBA,oBAAb,EAAP;AACD,CAbM","sourcesContent":["import { ReactComponentLike } from 'prop-types';\nimport React from 'react';\nimport { isForwardRef } from 'react-is';\n\nimport { isBrowser } from './client';\n\n// NOTE: Copy-paste from @types/react\nexport type Defaultize<P, D> = P extends any\n  ? string extends keyof P\n    ? P\n    : Pick<P, Exclude<keyof P, keyof D>> &\n        Partial<Pick<P, Extract<keyof P, keyof D>>> &\n        Partial<Pick<D, Exclude<keyof D, keyof P>>>\n  : never;\n\nexport type DefaultizeProps<C, P> = C extends { defaultProps: infer D } ? Defaultize<P, D> : P;\n\nexport const delay = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));\n\nexport const emptyHandler = () => {\n  /* noop */\n};\n\nexport class CancelationError extends Error {\n  public code = 'CancelationError';\n}\n\nexport function taskWithDelay(task: () => void, ms: number) {\n  let cancelationToken: () => void = () => null;\n\n  new Promise((resolve, reject) => {\n    cancelationToken = reject;\n    setTimeout(resolve, ms);\n  })\n    .then(task)\n    .catch(() => null);\n\n  return cancelationToken;\n}\n\nexport function isFunction<T>(x: T | Function): x is Function {\n  return typeof x === 'function';\n}\n\nexport function isFunctionalComponent(Component: ReactComponentLike): boolean {\n  return Boolean(typeof Component === 'function' && !(Component.prototype && Component.prototype.isReactComponent));\n}\n\nexport function isClassComponent(Component: ReactComponentLike): boolean {\n  return Boolean(typeof Component === 'function' && Component.prototype && Component.prototype.isReactComponent);\n}\n\nexport function isIntrinsicElement(element: React.ReactElement): boolean {\n  return typeof element.type === 'string';\n}\n\nexport function isRefableElement(element: React.ReactElement): boolean {\n  return Boolean(isIntrinsicElement(element) || isClassComponent(element.type) || isForwardRef(element));\n}\n\nexport function escapeRegExpSpecChars(s: string): string {\n  return s.replace(/[\\\\^$*+?.()|[\\]{}]/g, '\\\\$&');\n}\n\nexport const getRandomID = (): string => Math.random().toString(16).slice(2);\n\nexport const isExternalLink = (link: string): boolean => {\n  return new RegExp(`^(https?:)?//${isBrowser ? `(?!${window.location.host})` : ``}\\\\S+`, 'gi').test(link);\n};\n\n/**\n * Check if the given ReactNode is an element of the specified ReactUI component\n */\nexport const isReactUINode = (componentName: string, node: React.ReactNode): boolean => {\n  if (React.isValidElement(node)) {\n    return (\n      Object.prototype.hasOwnProperty.call(node.type, '__KONTUR_REACT_UI__') &&\n      // @ts-ignore\n      node.type.__KONTUR_REACT_UI__ === componentName\n    );\n  }\n\n  return false;\n};\n\n/**\n * Проверяет, не является ли переданный аргумент null или undefined и исключает типы null и undefined из типа аргумента\n *\n * @param value Значение, которое нужно проверить и исключить из него типы\n * @returns Возвращает true, если переданный аргумент не является null или undefined иначе false\n */\nexport const isNonNullable = <T>(value: T): value is NonNullable<T> => {\n  return value !== null && value !== undefined;\n};\n\n/**\n * Creates a function that checks if the given `child`\n * is an instance of some component specified by `name`.\n *\n * @param name Component name for which function will be created.\n * @returns A function that checks if the given `child` is an instance of the component specified by `name`.\n */\nexport const isReactUIComponent = <P = any>(name: string) => {\n  return (child: React.ReactNode): child is React.ReactElement<P> => {\n    // @ts-ignore\n    return child?.type?.__KONTUR_REACT_UI__ === name;\n  };\n};\n\n/**\n * Merges two or more refs into one.\n *\n * @param refs Array of refs.\n * @returns A single ref composing all the refs passed.\n *\n * @example\n * const SomeComponent = forwardRef((props, ref) => {\n *  const localRef = useRef();\n *\n *  return <div ref={mergeRefs([localRef, ref])} />;\n * });\n */\nexport function mergeRefs<T = any>(refs: Array<React.MutableRefObject<T> | React.LegacyRef<T>>): React.RefCallback<T> {\n  return (value) => {\n    refs.forEach((ref) => {\n      if (typeof ref === 'function') {\n        return ref(value);\n      } else if (isNonNullable(ref)) {\n        return ((ref as React.MutableRefObject<T | null>).current = value);\n      }\n    });\n  };\n}\n\n/**\n * Extracts all data attributes from props and returns them as well as props.\n *\n * @param props Props object to extract data attributes from.\n * @returns Separated data attributes and all other props.\n */\nexport const extractDataProps = <T>(props: T) => {\n  const dataProps: Record<string, any> = {};\n  const restWithoutDataProps: Record<string, any> = {};\n\n  Object.entries(props).map(([name, value]) => {\n    if (name.startsWith('data-')) {\n      dataProps[name] = value;\n    } else {\n      restWithoutDataProps[name] = value;\n    }\n  });\n\n  return { dataProps, restWithoutDataProps };\n};\n"]}

package/lib/utils.d.ts

@@ -1,29 +1,63 @@
-import { ReactComponentLike } from 'prop-types';
-import React from 'react';
-export declare type Defaultize<P, D> = P extends any ? string extends keyof P ? P : Pick<P, Exclude<keyof P, keyof D>> & Partial<Pick<P, Extract<keyof P, keyof D>>> & Partial<Pick<D, Exclude<keyof D, keyof P>>> : never;
-export declare type DefaultizeProps<C, P> = C extends {
-    defaultProps: infer D;
-} ? Defaultize<P, D> : P;
-export declare const delay: (ms: number) => Promise<unknown>;
-export declare const emptyHandler: () => void;
-export declare class CancelationError extends Error {
-    code: string;
-}
-export declare function taskWithDelay(task: () => void, ms: number): () => void;
-export declare function isFunction<T>(x: T | Function): x is Function;
-export declare function isFunctionalComponent(Component: ReactComponentLike): boolean;
-export declare function escapeRegExpSpecChars(s: string): string;
-export declare const getRandomID: () => string;
-export declare const isExternalLink: (link: string) => boolean;
-/**
- * Check if the given ReactNode is an element of the specified ReactUI component
- */
-export declare const isReactUINode: (componentName: string, node: React.ReactNode) => boolean;
-export declare const formatBytes: (bytes: number, decimals?: number) => string | null;
-/**
- * Проверяет, не является ли переданный аргумент null или undefined и исключает типы null и undefined из типа аргумента
- *
- * @param value Значение, которое нужно проверить и исключить из него типы
- * @returns Возвращает true, если переданный аргумент не является null или undefined иначе false
- */
-export declare const isNonNullable: <T>(value: T) => value is NonNullable<T>;
+import { ReactComponentLike } from 'prop-types';
+import React from 'react';
+export declare type Defaultize<P, D> = P extends any ? string extends keyof P ? P : Pick<P, Exclude<keyof P, keyof D>> & Partial<Pick<P, Extract<keyof P, keyof D>>> & Partial<Pick<D, Exclude<keyof D, keyof P>>> : never;
+export declare type DefaultizeProps<C, P> = C extends {
+    defaultProps: infer D;
+} ? Defaultize<P, D> : P;
+export declare const delay: (ms: number) => Promise<unknown>;
+export declare const emptyHandler: () => void;
+export declare class CancelationError extends Error {
+    code: string;
+}
+export declare function taskWithDelay(task: () => void, ms: number): () => void;
+export declare function isFunction<T>(x: T | Function): x is Function;
+export declare function isFunctionalComponent(Component: ReactComponentLike): boolean;
+export declare function isClassComponent(Component: ReactComponentLike): boolean;
+export declare function isIntrinsicElement(element: React.ReactElement): boolean;
+export declare function isRefableElement(element: React.ReactElement): boolean;
+export declare function escapeRegExpSpecChars(s: string): string;
+export declare const getRandomID: () => string;
+export declare const isExternalLink: (link: string) => boolean;
+/**
+ * Check if the given ReactNode is an element of the specified ReactUI component
+ */
+export declare const isReactUINode: (componentName: string, node: React.ReactNode) => boolean;
+/**
+ * Проверяет, не является ли переданный аргумент null или undefined и исключает типы null и undefined из типа аргумента
+ *
+ * @param value Значение, которое нужно проверить и исключить из него типы
+ * @returns Возвращает true, если переданный аргумент не является null или undefined иначе false
+ */
+export declare const isNonNullable: <T>(value: T) => value is NonNullable<T>;
+/**
+ * Creates a function that checks if the given `child`
+ * is an instance of some component specified by `name`.
+ *
+ * @param name Component name for which function will be created.
+ * @returns A function that checks if the given `child` is an instance of the component specified by `name`.
+ */
+export declare const isReactUIComponent: <P = any>(name: string) => (child: React.ReactNode) => child is React.ReactElement<P, string | React.JSXElementConstructor<any>>;
+/**
+ * Merges two or more refs into one.
+ *
+ * @param refs Array of refs.
+ * @returns A single ref composing all the refs passed.
+ *
+ * @example
+ * const SomeComponent = forwardRef((props, ref) => {
+ *  const localRef = useRef();
+ *
+ *  return <div ref={mergeRefs([localRef, ref])} />;
+ * });
+ */
+export declare function mergeRefs<T = any>(refs: Array<React.MutableRefObject<T> | React.LegacyRef<T>>): React.RefCallback<T>;
+/**
+ * Extracts all data attributes from props and returns them as well as props.
+ *
+ * @param props Props object to extract data attributes from.
+ * @returns Separated data attributes and all other props.
+ */
+export declare const extractDataProps: <T>(props: T) => {
+    dataProps: Record<string, any>;
+    restWithoutDataProps: Record<string, any>;
+};

package/lib/withClassWrapper/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../cjs/lib/withClassWrapper.js",
+  "module": "withClassWrapper",
+  "types": "../withClassWrapper.d.ts",
+  "sideEffects": false
+}

package/lib/withClassWrapper/withClassWrapper.js

@@ -0,0 +1,70 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import React from 'react';
+import { getDisplayName } from "../getDisplayName";
+
+var removePostfix = function removePostfix(word, postfixRegex) {
+  var regexContent = postfixRegex.source.replace(/\$$/, '');
+  var isCorrectPostfix = postfixRegex.test(word);
+
+  if (!isCorrectPostfix) {
+    throw new Error("Component's displayName property must end with '" + regexContent + "' in order to be wrapped in withClassWrapper HOC");
+  }
+
+  return word.replace(postfixRegex, '');
+};
+/**
+ * HOC for moving from Class to Functional components.
+ *
+ * Used to remove distinctions between Class and Functional refs.
+ *
+ * @param RFC Functional component wrapped in forwardRefAndName.
+ * @returns Class component that wraps Functional component.
+ */
+
+
+export function withClassWrapper(RFC) {
+  var _class, _temp;
+
+  var fullName = getDisplayName(RFC);
+  var nameWithoutPostfix = removePostfix(fullName, /FC$/);
+  return _temp = _class = /*#__PURE__*/function (_React$Component) {
+    _inheritsLoose(ClassWrapper, _React$Component);
+
+    function ClassWrapper() {
+      var _this;
+
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+
+      _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+      _this.instancePropertiesRef = /*#__PURE__*/React.createRef();
+      return _this;
+    }
+
+    var _proto = ClassWrapper.prototype;
+
+    _proto.componentDidMount = function componentDidMount() {
+      if (this.instancePropertiesRef.current) {
+        Object.defineProperties(this, Object.getOwnPropertyDescriptors(this.instancePropertiesRef.current));
+      }
+    };
+
+    _proto.render = function render() {
+      return (
+        /*#__PURE__*/
+        // TypeScript is not able to understand
+        // that both types (class one and functional one)
+        // have ref at the build stage.
+        // @ts-ignore
+        React.createElement(ClassWrapper.FC, _extends({
+          // Returns methods defined in useImperativeHandle.
+          instanceRef: this.instancePropertiesRef
+        }, this.props))
+      );
+    };
+
+    return ClassWrapper;
+  }(React.Component), _class.__KONTUR_REACT_UI__ = nameWithoutPostfix, _class.displayName = nameWithoutPostfix, _class.FC = RFC, _temp;
+}

package/lib/withClassWrapper/withClassWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["withClassWrapper.tsx"],"names":["React","getDisplayName","removePostfix","word","postfixRegex","regexContent","source","replace","isCorrectPostfix","test","Error","withClassWrapper","RFC","fullName","nameWithoutPostfix","instancePropertiesRef","createRef","componentDidMount","current","Object","defineProperties","getOwnPropertyDescriptors","render","props","Component","__KONTUR_REACT_UI__","displayName","FC"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;;AAGA,SAASC,cAAT,QAA+B,kBAA/B;;AAEA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,IAAD,EAAeC,YAAf,EAAwC;AAC5D,MAAMC,YAAY,GAAGD,YAAY,CAACE,MAAb,CAAoBC,OAApB,CAA4B,KAA5B,EAAmC,EAAnC,CAArB;;AAEA,MAAMC,gBAAgB,GAAGJ,YAAY,CAACK,IAAb,CAAkBN,IAAlB,CAAzB;AACA,MAAI,CAACK,gBAAL,EAAuB;AACrB,UAAM,IAAIE,KAAJ;AAC+CL,IAAAA,YAD/C,sDAAN;;AAGD;;AAED,SAAOF,IAAI,CAACI,OAAL,CAAaH,YAAb,EAA2B,EAA3B,CAAP;AACD,CAXD;;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASO,gBAAT,CAAgCC,GAAhC,EAAoE;AACzE,MAAMC,QAAQ,GAAGZ,cAAc,CAACW,GAAD,CAA/B;AACA,MAAME,kBAAkB,GAAGZ,aAAa,CAACW,QAAD,EAAW,KAAX,CAAxC;;AAEA;AACSE,MAAAA,qBADT,gBACiCf,KAAK,CAACgB,SAAN,EADjC;;AAGEC,IAAAA,iBAHF,GAGE,6BAAoB;AAClB,UAAI,KAAKF,qBAAL,CAA2BG,OAA/B,EAAwC;AACtCC,QAAAA,MAAM,CAACC,gBAAP,CAAwB,IAAxB,EAA8BD,MAAM,CAACE,yBAAP,CAAiC,KAAKN,qBAAL,CAA2BG,OAA5D,CAA9B;AACD;AACF,KAPH;;;;;;;AAcEI,IAAAA,MAdF,GAcE,kBAAS;AACP;AACE;AACA;AACA;AACA;AACA,4BAAC,YAAD,CAAc,EAAd;AACE;AACA,UAAA,WAAW,EAAE,KAAKP,qBAFpB;AAGM,aAAKQ,KAHX,EALF;;;AAWD,KA1BH,uBAAkCvB,KAAK,CAACwB,SAAxC,UASgBC,mBAThB,GASsCX,kBATtC,SAUgBY,WAVhB,GAU8BZ,kBAV9B,SAYgBa,EAZhB,GAYqBf,GAZrB;;AA4BD","sourcesContent":["import React from 'react';\n\nimport { ReactUIComponentWithRef } from './forwardRefAndName';\nimport { getDisplayName } from './getDisplayName';\n\nconst removePostfix = (word: string, postfixRegex: RegExp) => {\n  const regexContent = postfixRegex.source.replace(/\\$$/, '');\n\n  const isCorrectPostfix = postfixRegex.test(word);\n  if (!isCorrectPostfix) {\n    throw new Error(\n      `Component's displayName property must end with '${regexContent}' in order to be wrapped in withClassWrapper HOC`,\n    );\n  }\n\n  return word.replace(postfixRegex, '');\n};\n\n/**\n * HOC for moving from Class to Functional components.\n *\n * Used to remove distinctions between Class and Functional refs.\n *\n * @param RFC Functional component wrapped in forwardRefAndName.\n * @returns Class component that wraps Functional component.\n */\nexport function withClassWrapper<T, P>(RFC: ReactUIComponentWithRef<T, P>) {\n  const fullName = getDisplayName(RFC);\n  const nameWithoutPostfix = removePostfix(fullName, /FC$/);\n\n  return class ClassWrapper extends React.Component<P> {\n    public instancePropertiesRef = React.createRef<T>();\n\n    componentDidMount() {\n      if (this.instancePropertiesRef.current) {\n        Object.defineProperties(this, Object.getOwnPropertyDescriptors(this.instancePropertiesRef.current));\n      }\n    }\n\n    public static __KONTUR_REACT_UI__ = nameWithoutPostfix;\n    public static displayName = nameWithoutPostfix;\n\n    public static FC = RFC;\n\n    render() {\n      return (\n        // TypeScript is not able to understand\n        // that both types (class one and functional one)\n        // have ref at the build stage.\n        // @ts-ignore\n        <ClassWrapper.FC\n          // Returns methods defined in useImperativeHandle.\n          instanceRef={this.instancePropertiesRef}\n          {...this.props}\n        />\n      );\n    }\n  };\n}\n\nexport interface InstanceRefType<T> {\n  instanceRef: React.MutableRefObject<T>;\n}\n"]}

package/lib/withClassWrapper.d.ts

@@ -0,0 +1,71 @@
+import React from 'react';
+import { ReactUIComponentWithRef } from './forwardRefAndName';
+/**
+ * HOC for moving from Class to Functional components.
+ *
+ * Used to remove distinctions between Class and Functional refs.
+ *
+ * @param RFC Functional component wrapped in forwardRefAndName.
+ * @returns Class component that wraps Functional component.
+ */
+export declare function withClassWrapper<T, P>(RFC: ReactUIComponentWithRef<T, P>): {
+    new (props: P | Readonly<P>): {
+        instancePropertiesRef: React.RefObject<T>;
+        componentDidMount(): void;
+        render(): JSX.Element;
+        context: any;
+        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<P>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<P> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        state: Readonly<{}>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<P>, nextState: Readonly<{}>, nextContext: any): boolean;
+        componentWillUnmount?(): void;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<P>, prevState: Readonly<{}>): any;
+        componentDidUpdate?(prevProps: Readonly<P>, prevState: Readonly<{}>, snapshot?: any): void;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<P>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<P>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<P>, nextState: Readonly<{}>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<P>, nextState: Readonly<{}>, nextContext: any): void;
+    };
+    new (props: P, context: any): {
+        instancePropertiesRef: React.RefObject<T>;
+        componentDidMount(): void;
+        render(): JSX.Element;
+        context: any;
+        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<P>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<P> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        state: Readonly<{}>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<P>, nextState: Readonly<{}>, nextContext: any): boolean;
+        componentWillUnmount?(): void;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<P>, prevState: Readonly<{}>): any;
+        componentDidUpdate?(prevProps: Readonly<P>, prevState: Readonly<{}>, snapshot?: any): void;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<P>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<P>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<P>, nextState: Readonly<{}>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<P>, nextState: Readonly<{}>, nextContext: any): void;
+    };
+    __KONTUR_REACT_UI__: string;
+    displayName: string;
+    FC: ReactUIComponentWithRef<T, P>;
+    contextType?: React.Context<any> | undefined;
+};
+export interface InstanceRefType<T> {
+    instanceRef: React.MutableRefObject<T>;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skbkontur/react-ui",
-  "version": "3.10.0-fileuploader.2",
+  "version": "3.11.0-select-right-2",
   "description": "UI Components",
   "main": "cjs/index.js",
   "module": "index.js",
@@ -58,6 +58,7 @@
     "raf": "^3.4.1",
     "react-focus-lock": "^2.2.1",
     "react-input-mask": "2.0.4",
+    "react-is": "^17.0.2",
     "react-transition-group": "^4.3.0",
     "shallowequal": "^1.1.0",
     "stylis-plugin-extra-scope": "^0.3.0",
@@ -76,12 +77,18 @@
     "@skbkontur/react-icons": "4.4.0",
     "@skbkontur/react-props2attrs": "0.1.2",
     "@skbkontur/react-sorge": "0.1.0",
+    "@storybook/addon-a11y": "6.3.2",
     "@storybook/addon-essentials": "6.3.2",
     "@storybook/addon-links": "6.3.2",
     "@storybook/react": "6.3.2",
+    "@testing-library/jest-dom": "5.16.1",
+    "@testing-library/react": "12.1.2",
+    "@testing-library/react-hooks": "^7.0.2",
+    "@testing-library/user-event": "13.5.0",
     "@types/enzyme": "^3.10.8",
     "@types/invariant": "^2.2.33",
     "@types/jest": "^26.0.22",
+    "@types/jest-axe": "^3.5.3",
     "@types/lodash.debounce": "^4.0.6",
     "@types/lodash.isequal": "^4.5.5",
     "@types/lodash.throttle": "^4.1.6",
@@ -91,9 +98,11 @@
     "@types/react": "16.14.4",
     "@types/react-dom": "16.9.11",
     "@types/react-input-mask": "2.0.5",
+    "@types/react-is": "^17.0.3",
     "@types/react-transition-group": "^4.2.3",
     "@types/shallowequal": "^1.1.1",
     "@types/warning": "^3.0.0",
+    "axios": "^0.24.0",
     "babel-jest": "^26.6.3",
     "babel-loader": "^8.2.2",
     "chalk": "4.1.0",
@@ -102,6 +111,7 @@
     "creevey": "0.7.31",
     "cross-env": "^7.0.3",
     "css-loader": "5.2.0",
+    "dotenv": "^10.0.0",
     "dts-css-modules-loader": "1.2.1",
     "enzyme": "^3.11.0",
     "enzyme-adapter-react-16": "^1.15.6",
@@ -112,6 +122,7 @@
     "gh-pages": "^3.1.0",
     "identity-obj-proxy": "^3.0.0",
     "jest": "26.6.3",
+    "jest-axe": "^5.0.1",
     "jest-teamcity-reporter": "^0.9.0",
     "npm-run-all": "^4.1.5",
     "output-file-sync": "^2.0.1",

package/typings/html-props.d.ts

@@ -0,0 +1,123 @@
+import React from 'react';
+
+export type HTMLProps = {
+  a: React.AnchorHTMLAttributes<HTMLAnchorElement>;
+  abbr: React.HTMLAttributes<HTMLElement>;
+  div: React.HTMLAttributes<HTMLDivElement>;
+  address: React.HTMLAttributes<HTMLElement>;
+  area: React.AreaHTMLAttributes<HTMLAreaElement>;
+  article: React.HTMLAttributes<HTMLElement>;
+  aside: React.HTMLAttributes<HTMLElement>;
+  audio: React.AudioHTMLAttributes<HTMLAudioElement>;
+  b: React.HTMLAttributes<HTMLElement>;
+  base: React.BaseHTMLAttributes<HTMLBaseElement>;
+  bdi: React.HTMLAttributes<HTMLElement>;
+  bdo: React.HTMLAttributes<HTMLElement>;
+  big: React.HTMLAttributes<HTMLElement>;
+  blockquote: React.BlockquoteHTMLAttributes<HTMLElement>;
+  body: React.HTMLAttributes<HTMLBodyElement>;
+  br: React.HTMLAttributes<HTMLBRElement>;
+  button: React.ButtonHTMLAttributes<HTMLButtonElement>;
+  canvas: React.CanvasHTMLAttributes<HTMLCanvasElement>;
+  caption: React.HTMLAttributes<HTMLElement>;
+  cite: React.HTMLAttributes<HTMLElement>;
+  code: React.HTMLAttributes<HTMLElement>;
+  col: React.ColHTMLAttributes<HTMLTableColElement>;
+  colgroup: React.ColgroupHTMLAttributes<HTMLTableColElement>;
+  data: React.DataHTMLAttributes<HTMLDataElement>;
+  datalist: React.HTMLAttributes<HTMLDataListElement>;
+  dd: React.HTMLAttributes<HTMLElement>;
+  del: React.DelHTMLAttributes<HTMLElement>;
+  details: React.DetailsHTMLAttributes<HTMLElement>;
+  dfn: React.HTMLAttributes<HTMLElement>;
+  dialog: React.DialogHTMLAttributes<HTMLDialogElement>;
+  div: React.HTMLAttributes<HTMLDivElement>;
+  dl: React.HTMLAttributes<HTMLDListElement>;
+  dt: React.HTMLAttributes<HTMLElement>;
+  em: React.HTMLAttributes<HTMLElement>;
+  embed: React.EmbedHTMLAttributes<HTMLEmbedElement>;
+  fieldset: React.FieldsetHTMLAttributes<HTMLFieldSetElement>;
+  figcaption: React.HTMLAttributes<HTMLElement>;
+  figure: React.HTMLAttributes<HTMLElement>;
+  footer: React.HTMLAttributes<HTMLElement>;
+  form: React.FormHTMLAttributes<HTMLFormElement>;
+  h1: React.HTMLAttributes<HTMLHeadingElement>;
+  h2: React.HTMLAttributes<HTMLHeadingElement>;
+  h3: React.HTMLAttributes<HTMLHeadingElement>;
+  h4: React.HTMLAttributes<HTMLHeadingElement>;
+  h5: React.HTMLAttributes<HTMLHeadingElement>;
+  h6: React.HTMLAttributes<HTMLHeadingElement>;
+  head: React.HTMLAttributes<HTMLHeadElement>;
+  header: React.HTMLAttributes<HTMLElement>;
+  hgroup: React.HTMLAttributes<HTMLElement>;
+  hr: React.HTMLAttributes<HTMLHRElement>;
+  html: React.HtmlHTMLAttributes<HTMLHtmlElement>;
+  i: React.HTMLAttributes<HTMLElement>;
+  iframe: React.IframeHTMLAttributes<HTMLIFrameElement>;
+  img: React.ImgHTMLAttributes<HTMLImageElement>;
+  input: React.InputHTMLAttributes<HTMLInputElement>;
+  ins: React.InsHTMLAttributes<HTMLModElement>;
+  kbd: React.HTMLAttributes<HTMLElement>;
+  keygen: React.KeygenHTMLAttributes<HTMLElement>;
+  label: React.LabelHTMLAttributes<HTMLLabelElement>;
+  legend: React.HTMLAttributes<HTMLLegendElement>;
+  li: React.LiHTMLAttributes<HTMLLIElement>;
+  link: React.LinkHTMLAttributes<HTMLLinkElement>;
+  main: React.HTMLAttributes<HTMLElement>;
+  map: React.MapHTMLAttributes<HTMLMapElement>;
+  mark: React.HTMLAttributes<HTMLElement>;
+  menu: React.MenuHTMLAttributes<HTMLElement>;
+  menuitem: React.HTMLAttributes<HTMLElement>;
+  meta: React.MetaHTMLAttributes<HTMLMetaElement>;
+  meter: React.MeterHTMLAttributes<HTMLElement>;
+  nav: React.HTMLAttributes<HTMLElement>;
+  noindex: React.HTMLAttributes<HTMLElement>;
+  noscript: React.HTMLAttributes<HTMLElement>;
+  object: React.ObjectHTMLAttributes<HTMLObjectElement>;
+  ol: React.OlHTMLAttributes<HTMLOListElement>;
+  optgroup: React.OptgroupHTMLAttributes<HTMLOptGroupElement>;
+  option: React.OptionHTMLAttributes<HTMLOptionElement>;
+  output: React.OutputHTMLAttributes<HTMLElement>;
+  p: React.HTMLAttributes<HTMLParagraphElement>;
+  param: React.ParamHTMLAttributes<HTMLParamElement>;
+  picture: React.HTMLAttributes<HTMLElement>;
+  pre: React.HTMLAttributes<HTMLPreElement>;
+  progress: React.ProgressHTMLAttributes<HTMLProgressElement>;
+  q: React.QuoteHTMLAttributes<HTMLQuoteElement>;
+  rp: React.HTMLAttributes<HTMLElement>;
+  rt: React.HTMLAttributes<HTMLElement>;
+  ruby: React.HTMLAttributes<HTMLElement>;
+  s: React.HTMLAttributes<HTMLElement>;
+  samp: React.HTMLAttributes<HTMLElement>;
+  slot: React.SlotHTMLAttributes<HTMLSlotElement>;
+  script: React.ScriptHTMLAttributes<HTMLScriptElement>;
+  section: React.HTMLAttributes<HTMLElement>;
+  select: React.SelectHTMLAttributes<HTMLSelectElement>;
+  small: React.HTMLAttributes<HTMLElement>;
+  source: React.SourceHTMLAttributes<HTMLSourceElement>;
+  span: React.HTMLAttributes<HTMLSpanElement>;
+  strong: React.HTMLAttributes<HTMLElement>;
+  style: React.StyleHTMLAttributes<HTMLStyleElement>;
+  sub: React.HTMLAttributes<HTMLElement>;
+  summary: React.HTMLAttributes<HTMLElement>;
+  sup: React.HTMLAttributes<HTMLElement>;
+  table: React.TableHTMLAttributes<HTMLTableElement>;
+  template: React.HTMLAttributes<HTMLTemplateElement>;
+  tbody: React.HTMLAttributes<HTMLTableSectionElement>;
+  td: React.TdHTMLAttributes<HTMLTableDataCellElement>;
+  textarea: React.TextareaHTMLAttributes<HTMLTextAreaElement>;
+  tfoot: React.HTMLAttributes<HTMLTableSectionElement>;
+  th: React.ThHTMLAttributes<HTMLTableHeaderCellElement>;
+  thead: React.HTMLAttributes<HTMLTableSectionElement>;
+  time: React.TimeHTMLAttributes<HTMLElement>;
+  title: React.HTMLAttributes<HTMLTitleElement>;
+  tr: React.HTMLAttributes<HTMLTableRowElement>;
+  track: React.TrackHTMLAttributes<HTMLTrackElement>;
+  u: React.HTMLAttributes<HTMLElement>;
+  ul: React.HTMLAttributes<HTMLUListElement>;
+  var: React.HTMLAttributes<HTMLElement>;
+  video: React.VideoHTMLAttributes<HTMLVideoElement>;
+  wbr: React.HTMLAttributes<HTMLElement>;
+  webview: React.WebViewHTMLAttributes<HTMLWebViewElement>;
+  svg: React.SVGProps<SVGSVGElement>;
+};