@skbkontur/react-ui 5.6.0 → 5.6.1-85c65.0

package/cjs/components/__stories__/Form.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Emotion","_excluded","_excluded2","_excluded3","_excluded4","_excluded5","_excluded6","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","line","css","_taggedTemplateLiteralLoose2","default","title","content","formLineBreak","actionsBar","formWrapper","FormLine","_ref","children","className","rest","_objectWithoutPropertiesLoose2","createElement","_extends2","Line","_ref2","Title","_ref3","Content","_ref4","LineBreak","_ref5","ActionsBar","_ref6","Form","exports","_React$Component","apply","arguments","_inheritsLoose2","_proto","prototype","render","props","React","Component"],"sources":["Form.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from '@skbkontur/react-ui/lib/theming/Emotion';\n\nconst line = css`\n  display: flex;\n  align-items: baseline;\n  margin-bottom: 10px;\n`;\n\nconst title = css`\n  box-sizing: border-box;\n  margin-right: 10px;\n  width: 150px;\n  text-align: right;\n`;\n\nconst content = css`\n  display: inline-flex;\n`;\n\nconst formLineBreak = css`\n  height: 20px;\n`;\n\nconst actionsBar = css`\n  margin-top: 10px;\n  padding-left: 160px;\n`;\n\nconst formWrapper = css`\n  display: flex;\n  flex-direction: column;\n`;\n\ntype ComponentProps = React.PropsWithChildren<React.HTMLAttributes<HTMLElement>>;\n\nconst FormLine = ({ children, className, ...rest }: ComponentProps) => {\n  return (\n    <div className={css(line, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nconst Line = ({ children, className, ...rest }: ComponentProps) => {\n  return (\n    <div className={css(line, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nconst Title = ({ children, className, ...rest }: ComponentProps) => {\n  return (\n    <span className={css(title, className)} {...rest}>\n      {children}\n    </span>\n  );\n};\n\nconst Content = ({ children, className, ...rest }: ComponentProps) => {\n  return (\n    <span className={css(content, className)} {...rest}>\n      {children}\n    </span>\n  );\n};\n\nconst LineBreak = ({ children, className, ...rest }: ComponentProps) => {\n  return (\n    <div className={css(formLineBreak, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nconst ActionsBar = ({ children, className, ...rest }: ComponentProps) => {\n  return (\n    <div className={css(actionsBar, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nexport class Form extends React.Component<ComponentProps> {\n  public static Line = Line;\n  public static LineBreak = LineBreak;\n  public static ActionsBar = ActionsBar;\n  public static FormLine = FormLine;\n  public static Title = Title;\n  public static Content = Content;\n\n  public render() {\n    return <div className={css(formWrapper, this.props.className)}>{this.props.children}</div>;\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_renderEnvironment","_class","_Form","_excluded","_excluded2","_excluded3","_excluded4","_excluded5","_excluded6","line","title","content","formLineBreak","actionsBar","formWrapper","FormLine","_ref","children","className","rest","_objectWithoutPropertiesLoose2","default","_useEmotion","useEmotion","css","createElement","_extends2","Line","_ref2","_useEmotion2","Title","_ref3","_useEmotion3","Content","_ref4","_useEmotion4","LineBreak","_ref5","_useEmotion5","ActionsBar","_ref6","_useEmotion6","Form","exports","withRenderEnvironment","_React$Component","apply","arguments","_inheritsLoose2","_proto","prototype","render","emotion","props","React","Component"],"sources":["Form.tsx"],"sourcesContent":["import type { Emotion } from '@emotion/css/types/create-instance';\nimport React from 'react';\n\nimport { useEmotion, withRenderEnvironment } from '../../lib/renderEnvironment';\n\nconst line = `\n  display: flex;\n  align-items: baseline;\n  margin-bottom: 10px;\n`;\n\nconst title = `\n  box-sizing: border-box;\n  margin-right: 10px;\n  width: 150px;\n  text-align: right;\n`;\n\nconst content = `\n  display: inline-flex;\n`;\n\nconst formLineBreak = `\n  height: 20px;\n`;\n\nconst actionsBar = `\n  margin-top: 10px;\n  padding-left: 160px;\n`;\n\nconst formWrapper = `\n  display: flex;\n  flex-direction: column;\n`;\n\ntype ComponentProps = React.PropsWithChildren<React.HTMLAttributes<HTMLElement>>;\n\nconst FormLine = ({ children, className, ...rest }: ComponentProps) => {\n  const { css } = useEmotion();\n\n  return (\n    <div className={css(line, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nconst Line = ({ children, className, ...rest }: ComponentProps) => {\n  const { css } = useEmotion();\n\n  return (\n    <div className={css(line, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nconst Title = ({ children, className, ...rest }: ComponentProps) => {\n  const { css } = useEmotion();\n\n  return (\n    <span className={css(title, className)} {...rest}>\n      {children}\n    </span>\n  );\n};\n\nconst Content = ({ children, className, ...rest }: ComponentProps) => {\n  const { css } = useEmotion();\n\n  return (\n    <span className={css(content, className)} {...rest}>\n      {children}\n    </span>\n  );\n};\n\nconst LineBreak = ({ children, className, ...rest }: ComponentProps) => {\n  const { css } = useEmotion();\n\n  return (\n    <div className={css(formLineBreak, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nconst ActionsBar = ({ children, className, ...rest }: ComponentProps) => {\n  const { css } = useEmotion();\n\n  return (\n    <div className={css(actionsBar, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\n@withRenderEnvironment\nexport class Form extends React.Component<ComponentProps> {\n  public static Line = Line;\n  public static LineBreak = LineBreak;\n  public static ActionsBar = ActionsBar;\n  public static FormLine = FormLine;\n  public static Title = Title;\n  public static Content = Content;\n\n  private emotion!: Emotion;\n\n  public render() {\n    return <div className={this.emotion.css(formWrapper, this.props.className)}>{this.props.children}</div>;\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/cjs/hooks/useDrop.js

@@ -1,7 +1,7 @@
 "use strict";exports.__esModule = true;exports.useDrop = void 0;
 var _react = require("react");
 
-var _globalObject = require("@skbkontur/global-object");
+
 
 
 
@@ -19,11 +19,11 @@ var useDrop = exports.useDrop = function useDrop(props) {if (props === void 0) {
 
   var droppableRef = (0, _react.useRef)(null);
   var overRef = (0, _react.useRef)(false);
-  var timerId = (0, _react.useRef)();
+  var timerId = (0, _react.useRef)(undefined);
   var _useState = (0, _react.useState)(false),isDraggable = _useState[0],setIsDraggable = _useState[1];
 
   var clearTimer = (0, _react.useCallback)(function () {
-    timerId.current && _globalObject.globalObject.clearTimeout(timerId.current);
+    timerId.current && clearTimeout(timerId.current);
   }, []);
 
   var handleDragOver = (0, _react.useCallback)(
@@ -32,7 +32,7 @@ var useDrop = exports.useDrop = function useDrop(props) {if (props === void 0) {
       setIsDraggable(true);
 
       clearTimer();
-      timerId.current = _globalObject.globalObject.setTimeout(function () {
+      timerId.current = setTimeout(function () {
         overRef.current = false;
         setIsDraggable(false);
       }, 200);

package/cjs/hooks/useDrop.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_globalObject","useDrop","exports","props","_props","onDrop","droppableRef","useRef","overRef","timerId","_useState","useState","isDraggable","setIsDraggable","clearTimer","useCallback","current","globalObject","clearTimeout","handleDragOver","event","preventDefault","setTimeout","stopPropagation","handleDrop","useEffect","ref","addEventListener","removeEventListener"],"sources":["useDrop.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport type { SafeTimer } from '@skbkontur/global-object';\nimport { globalObject } from '@skbkontur/global-object';\n\ninterface IUseDropProps {\n  onDrop?: (event: DragEvent) => void;\n}\n\ntype IElementWithListener = Pick<HTMLElement, 'addEventListener' | 'removeEventListener'>;\n\ninterface IUseDropResult<TElement extends IElementWithListener> {\n  isDraggable: boolean;\n  ref: MutableRefObject<TElement | null>;\n}\n\nexport const useDrop = <TElement extends IElementWithListener>(props: IUseDropProps = {}): IUseDropResult<TElement> => {\n  const { onDrop } = props;\n\n  const droppableRef = useRef<TElement>(null);\n  const overRef = useRef<boolean>(false);\n  const timerId = useRef<SafeTimer>();\n  const [isDraggable, setIsDraggable] = useState<boolean>(false);\n\n  const clearTimer = useCallback(() => {\n    timerId.current && globalObject.clearTimeout(timerId.current);\n  }, []);\n\n  const handleDragOver = useCallback(\n    (event: DragEvent) => {\n      event.preventDefault();\n      setIsDraggable(true);\n\n      clearTimer();\n      timerId.current = globalObject.setTimeout(() => {\n        overRef.current = false;\n        setIsDraggable(false);\n      }, 200);\n    },\n    [clearTimer],\n  );\n\n  const preventDefault = useCallback((event: DragEvent) => {\n    event.preventDefault();\n    event.stopPropagation();\n  }, []);\n\n  const handleDrop = useCallback(\n    (event: DragEvent) => {\n      preventDefault(event);\n      setIsDraggable(false);\n      overRef.current = false;\n\n      onDrop?.(event);\n    },\n    [preventDefault, onDrop],\n  );\n\n  useEffect(() => {\n    const ref = droppableRef.current;\n\n    if (!ref) {\n      return;\n    }\n\n    ref.addEventListener('dragenter', preventDefault);\n    ref.addEventListener('dragleave', preventDefault);\n    ref.addEventListener('dragover', handleDragOver);\n    ref.addEventListener('drop', handleDrop);\n\n    return () => {\n      ref.removeEventListener('dragenter', preventDefault);\n      ref.removeEventListener('dragleave', preventDefault);\n      ref.removeEventListener('dragover', handleDragOver);\n      ref.removeEventListener('drop', handleDrop);\n    };\n  }, [handleDrop, handleDragOver, preventDefault]);\n\n  return { isDraggable, ref: droppableRef };\n};\n"],"mappings":";AACA,IAAAA,MAAA,GAAAC,OAAA;;AAEA,IAAAC,aAAA,GAAAD,OAAA;;;;;;;;;;;;;AAaO,IAAME,OAAO,GAAAC,OAAA,CAAAD,OAAA,GAAG,SAAVA,OAAOA,CAA2CE,KAAoB,EAAoC,KAAxDA,KAAoB,cAApBA,KAAoB,GAAG,CAAC,CAAC;EACtF,IAAAC,MAAA,GAAmBD,KAAK,CAAhBE,MAAM,GAAAD,MAAA,CAANC,MAAM;;EAEd,IAAMC,YAAY,GAAG,IAAAC,aAAM,EAAW,IAAI,CAAC;EAC3C,IAAMC,OAAO,GAAG,IAAAD,aAAM,EAAU,KAAK,CAAC;EACtC,IAAME,OAAO,GAAG,IAAAF,aAAM,EAAY,CAAC;EACnC,IAAAG,SAAA,GAAsC,IAAAC,eAAQ,EAAU,KAAK,CAAC,CAAvDC,WAAW,GAAAF,SAAA,IAAEG,cAAc,GAAAH,SAAA;;EAElC,IAAMI,UAAU,GAAG,IAAAC,kBAAW,EAAC,YAAM;IACnCN,OAAO,CAACO,OAAO,IAAIC,0BAAY,CAACC,YAAY,CAACT,OAAO,CAACO,OAAO,CAAC;EAC/D,CAAC,EAAE,EAAE,CAAC;;EAEN,IAAMG,cAAc,GAAG,IAAAJ,kBAAW;IAChC,UAACK,KAAgB,EAAK;MACpBA,KAAK,CAACC,cAAc,CAAC,CAAC;MACtBR,cAAc,CAAC,IAAI,CAAC;;MAEpBC,UAAU,CAAC,CAAC;MACZL,OAAO,CAACO,OAAO,GAAGC,0BAAY,CAACK,UAAU,CAAC,YAAM;QAC9Cd,OAAO,CAACQ,OAAO,GAAG,KAAK;QACvBH,cAAc,CAAC,KAAK,CAAC;MACvB,CAAC,EAAE,GAAG,CAAC;IACT,CAAC;IACD,CAACC,UAAU;EACb,CAAC;;EAED,IAAMO,cAAc,GAAG,IAAAN,kBAAW,EAAC,UAACK,KAAgB,EAAK;IACvDA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtBD,KAAK,CAACG,eAAe,CAAC,CAAC;EACzB,CAAC,EAAE,EAAE,CAAC;;EAEN,IAAMC,UAAU,GAAG,IAAAT,kBAAW;IAC5B,UAACK,KAAgB,EAAK;MACpBC,cAAc,CAACD,KAAK,CAAC;MACrBP,cAAc,CAAC,KAAK,CAAC;MACrBL,OAAO,CAACQ,OAAO,GAAG,KAAK;;MAEvBX,MAAM,YAANA,MAAM,CAAGe,KAAK,CAAC;IACjB,CAAC;IACD,CAACC,cAAc,EAAEhB,MAAM;EACzB,CAAC;;EAED,IAAAoB,gBAAS,EAAC,YAAM;IACd,IAAMC,GAAG,GAAGpB,YAAY,CAACU,OAAO;;IAEhC,IAAI,CAACU,GAAG,EAAE;MACR;IACF;;IAEAA,GAAG,CAACC,gBAAgB,CAAC,WAAW,EAAEN,cAAc,CAAC;IACjDK,GAAG,CAACC,gBAAgB,CAAC,WAAW,EAAEN,cAAc,CAAC;IACjDK,GAAG,CAACC,gBAAgB,CAAC,UAAU,EAAER,cAAc,CAAC;IAChDO,GAAG,CAACC,gBAAgB,CAAC,MAAM,EAAEH,UAAU,CAAC;;IAExC,OAAO,YAAM;MACXE,GAAG,CAACE,mBAAmB,CAAC,WAAW,EAAEP,cAAc,CAAC;MACpDK,GAAG,CAACE,mBAAmB,CAAC,WAAW,EAAEP,cAAc,CAAC;MACpDK,GAAG,CAACE,mBAAmB,CAAC,UAAU,EAAET,cAAc,CAAC;MACnDO,GAAG,CAACE,mBAAmB,CAAC,MAAM,EAAEJ,UAAU,CAAC;IAC7C,CAAC;EACH,CAAC,EAAE,CAACA,UAAU,EAAEL,cAAc,EAAEE,cAAc,CAAC,CAAC;;EAEhD,OAAO,EAAET,WAAW,EAAXA,WAAW,EAAEc,GAAG,EAAEpB,YAAY,CAAC,CAAC;AAC3C,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","require","useDrop","exports","props","_props","onDrop","droppableRef","useRef","overRef","timerId","undefined","_useState","useState","isDraggable","setIsDraggable","clearTimer","useCallback","current","clearTimeout","handleDragOver","event","preventDefault","setTimeout","stopPropagation","handleDrop","useEffect","ref","addEventListener","removeEventListener"],"sources":["useDrop.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport type { SafeTimer } from '../lib/globalObject';\n\ninterface IUseDropProps {\n  onDrop?: (event: DragEvent) => void;\n}\n\ntype IElementWithListener = Pick<HTMLElement, 'addEventListener' | 'removeEventListener'>;\n\ninterface IUseDropResult<TElement extends IElementWithListener> {\n  isDraggable: boolean;\n  ref: MutableRefObject<TElement | null>;\n}\n\nexport const useDrop = <TElement extends IElementWithListener>(props: IUseDropProps = {}): IUseDropResult<TElement> => {\n  const { onDrop } = props;\n\n  const droppableRef = useRef<TElement>(null);\n  const overRef = useRef<boolean>(false);\n  const timerId = useRef<SafeTimer>(undefined);\n  const [isDraggable, setIsDraggable] = useState<boolean>(false);\n\n  const clearTimer = useCallback(() => {\n    timerId.current && clearTimeout(timerId.current);\n  }, []);\n\n  const handleDragOver = useCallback(\n    (event: DragEvent) => {\n      event.preventDefault();\n      setIsDraggable(true);\n\n      clearTimer();\n      timerId.current = setTimeout(() => {\n        overRef.current = false;\n        setIsDraggable(false);\n      }, 200);\n    },\n    [clearTimer],\n  );\n\n  const preventDefault = useCallback((event: DragEvent) => {\n    event.preventDefault();\n    event.stopPropagation();\n  }, []);\n\n  const handleDrop = useCallback(\n    (event: DragEvent) => {\n      preventDefault(event);\n      setIsDraggable(false);\n      overRef.current = false;\n\n      onDrop?.(event);\n    },\n    [preventDefault, onDrop],\n  );\n\n  useEffect(() => {\n    const ref = droppableRef.current;\n\n    if (!ref) {\n      return;\n    }\n\n    ref.addEventListener('dragenter', preventDefault);\n    ref.addEventListener('dragleave', preventDefault);\n    ref.addEventListener('dragover', handleDragOver);\n    ref.addEventListener('drop', handleDrop);\n\n    return () => {\n      ref.removeEventListener('dragenter', preventDefault);\n      ref.removeEventListener('dragleave', preventDefault);\n      ref.removeEventListener('dragover', handleDragOver);\n      ref.removeEventListener('drop', handleDrop);\n    };\n  }, [handleDrop, handleDragOver, preventDefault]);\n\n  return { isDraggable, ref: droppableRef };\n};\n"],"mappings":";AACA,IAAAA,MAAA,GAAAC,OAAA;;;;;;;;;;;;;;;AAeO,IAAMC,OAAO,GAAAC,OAAA,CAAAD,OAAA,GAAG,SAAVA,OAAOA,CAA2CE,KAAoB,EAAoC,KAAxDA,KAAoB,cAApBA,KAAoB,GAAG,CAAC,CAAC;EACtF,IAAAC,MAAA,GAAmBD,KAAK,CAAhBE,MAAM,GAAAD,MAAA,CAANC,MAAM;;EAEd,IAAMC,YAAY,GAAG,IAAAC,aAAM,EAAW,IAAI,CAAC;EAC3C,IAAMC,OAAO,GAAG,IAAAD,aAAM,EAAU,KAAK,CAAC;EACtC,IAAME,OAAO,GAAG,IAAAF,aAAM,EAAYG,SAAS,CAAC;EAC5C,IAAAC,SAAA,GAAsC,IAAAC,eAAQ,EAAU,KAAK,CAAC,CAAvDC,WAAW,GAAAF,SAAA,IAAEG,cAAc,GAAAH,SAAA;;EAElC,IAAMI,UAAU,GAAG,IAAAC,kBAAW,EAAC,YAAM;IACnCP,OAAO,CAACQ,OAAO,IAAIC,YAAY,CAACT,OAAO,CAACQ,OAAO,CAAC;EAClD,CAAC,EAAE,EAAE,CAAC;;EAEN,IAAME,cAAc,GAAG,IAAAH,kBAAW;IAChC,UAACI,KAAgB,EAAK;MACpBA,KAAK,CAACC,cAAc,CAAC,CAAC;MACtBP,cAAc,CAAC,IAAI,CAAC;;MAEpBC,UAAU,CAAC,CAAC;MACZN,OAAO,CAACQ,OAAO,GAAGK,UAAU,CAAC,YAAM;QACjCd,OAAO,CAACS,OAAO,GAAG,KAAK;QACvBH,cAAc,CAAC,KAAK,CAAC;MACvB,CAAC,EAAE,GAAG,CAAC;IACT,CAAC;IACD,CAACC,UAAU;EACb,CAAC;;EAED,IAAMM,cAAc,GAAG,IAAAL,kBAAW,EAAC,UAACI,KAAgB,EAAK;IACvDA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtBD,KAAK,CAACG,eAAe,CAAC,CAAC;EACzB,CAAC,EAAE,EAAE,CAAC;;EAEN,IAAMC,UAAU,GAAG,IAAAR,kBAAW;IAC5B,UAACI,KAAgB,EAAK;MACpBC,cAAc,CAACD,KAAK,CAAC;MACrBN,cAAc,CAAC,KAAK,CAAC;MACrBN,OAAO,CAACS,OAAO,GAAG,KAAK;;MAEvBZ,MAAM,YAANA,MAAM,CAAGe,KAAK,CAAC;IACjB,CAAC;IACD,CAACC,cAAc,EAAEhB,MAAM;EACzB,CAAC;;EAED,IAAAoB,gBAAS,EAAC,YAAM;IACd,IAAMC,GAAG,GAAGpB,YAAY,CAACW,OAAO;;IAEhC,IAAI,CAACS,GAAG,EAAE;MACR;IACF;;IAEAA,GAAG,CAACC,gBAAgB,CAAC,WAAW,EAAEN,cAAc,CAAC;IACjDK,GAAG,CAACC,gBAAgB,CAAC,WAAW,EAAEN,cAAc,CAAC;IACjDK,GAAG,CAACC,gBAAgB,CAAC,UAAU,EAAER,cAAc,CAAC;IAChDO,GAAG,CAACC,gBAAgB,CAAC,MAAM,EAAEH,UAAU,CAAC;;IAExC,OAAO,YAAM;MACXE,GAAG,CAACE,mBAAmB,CAAC,WAAW,EAAEP,cAAc,CAAC;MACpDK,GAAG,CAACE,mBAAmB,CAAC,WAAW,EAAEP,cAAc,CAAC;MACpDK,GAAG,CAACE,mBAAmB,CAAC,UAAU,EAAET,cAAc,CAAC;MACnDO,GAAG,CAACE,mBAAmB,CAAC,MAAM,EAAEJ,UAAU,CAAC;IAC7C,CAAC;EACH,CAAC,EAAE,CAACA,UAAU,EAAEL,cAAc,EAAEE,cAAc,CAAC,CAAC;;EAEhD,OAAO,EAAER,WAAW,EAAXA,WAAW,EAAEa,GAAG,EAAEpB,YAAY,CAAC,CAAC;AAC3C,CAAC","ignoreList":[]}

package/cjs/hooks/useEffectWithoutInitCall.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","useEffectWithoutInitCall","exports","effect","deps","isMountedRef","useRef","useEffect","current"],"sources":["useEffectWithoutInitCall.ts"],"sourcesContent":["import type { DependencyList } from 'react';\nimport { useEffect, useRef } from 'react';\n\nexport const useEffectWithoutInitCall = (effect: () => void, deps: DependencyList) => {\n  const isMountedRef = useRef(false);\n\n  useEffect(() => {\n    if (isMountedRef.current) {\n      effect();\n    }\n  }, deps);\n\n  useEffect(() => {\n    isMountedRef.current = true;\n    return () => {\n      isMountedRef.current = false;\n    };\n  }, []);\n};\n"],"mappings":";AACA,IAAAA,MAAA,GAAAC,OAAA;;AAEO,IAAMC,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG,SAA3BA,wBAAwBA,CAAIE,MAAkB,EAAEC,IAAoB,EAAK;EACpF,IAAMC,YAAY,GAAG,IAAAC,aAAM,EAAC,KAAK,CAAC;;EAElC,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAIF,YAAY,CAACG,OAAO,EAAE;MACxBL,MAAM,CAAC,CAAC;IACV;EACF,CAAC,EAAEC,IAAI,CAAC;;EAER,IAAAG,gBAAS,EAAC,YAAM;IACdF,YAAY,CAACG,OAAO,GAAG,IAAI;IAC3B,OAAO,YAAM;MACXH,YAAY,CAACG,OAAO,GAAG,KAAK;IAC9B,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;AACR,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","require","useEffectWithoutInitCall","exports","effect","deps","isMountedRef","useRef","useEffect","current"],"sources":["useEffectWithoutInitCall.ts"],"sourcesContent":["import type { DependencyList } from 'react';\nimport { useEffect, useRef } from 'react';\n\nexport const useEffectWithoutInitCall = (effect: () => void, deps: DependencyList): void => {\n  const isMountedRef = useRef(false);\n\n  useEffect(() => {\n    if (isMountedRef.current) {\n      effect();\n    }\n  }, deps);\n\n  useEffect(() => {\n    isMountedRef.current = true;\n    return () => {\n      isMountedRef.current = false;\n    };\n  }, []);\n};\n"],"mappings":";AACA,IAAAA,MAAA,GAAAC,OAAA;;AAEO,IAAMC,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG,SAA3BA,wBAAwBA,CAAIE,MAAkB,EAAEC,IAAoB,EAAW;EAC1F,IAAMC,YAAY,GAAG,IAAAC,aAAM,EAAC,KAAK,CAAC;;EAElC,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAIF,YAAY,CAACG,OAAO,EAAE;MACxBL,MAAM,CAAC,CAAC;IACV;EACF,CAAC,EAAEC,IAAI,CAAC;;EAER,IAAAG,gBAAS,EAAC,YAAM;IACdF,YAAY,CAACG,OAAO,GAAG,IAAI;IAC3B,OAAO,YAAM;MACXH,YAAY,CAACG,OAAO,GAAG,KAAK;IAC9B,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;AACR,CAAC","ignoreList":[]}

package/cjs/hooks/useMemoObject.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","useMemoObject","exports","objectValue","useMemo","Object","values"],"sources":["useMemoObject.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport type { AnyObject } from '../lib/utils';\n\nexport const useMemoObject = <TObject extends AnyObject>(objectValue: TObject) => {\n  return useMemo<TObject>(() => objectValue, Object.values(objectValue));\n};\n"],"mappings":"sEAAA,IAAAA,MAAA,GAAAC,OAAA;;;;AAIO,IAAMC,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG,SAAhBA,aAAaA,CAA+BE,WAAoB,EAAK;EAChF,OAAO,IAAAC,cAAO,EAAU,oBAAMD,WAAW,IAAEE,MAAM,CAACC,MAAM,CAACH,WAAW,CAAC,CAAC;AACxE,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","require","useMemoObject","exports","objectValue","useMemo","Object","values"],"sources":["useMemoObject.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport type { AnyObject } from '../lib/utils';\n\nexport const useMemoObject = <TObject extends AnyObject>(objectValue: TObject): TObject => {\n  return useMemo<TObject>(() => objectValue, Object.values(objectValue));\n};\n"],"mappings":"sEAAA,IAAAA,MAAA,GAAAC,OAAA;;;;AAIO,IAAMC,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG,SAAhBA,aAAaA,CAA+BE,WAAoB,EAAc;EACzF,OAAO,IAAAC,cAAO,EAAU,oBAAMD,WAAW,IAAEE,MAAM,CAACC,MAAM,CAACH,WAAW,CAAC,CAAC;AACxE,CAAC","ignoreList":[]}

package/cjs/internal/ClearCrossIcon/ClearCrossIcon.js

@@ -1,8 +1,7 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.ClearCrossIcon = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _react = _interopRequireDefault(require("react"));
-var _globalObject = require("@skbkontur/global-object");
 
-var _Emotion = require("../../lib/theming/Emotion");
+var _renderEnvironment = require("../../lib/renderEnvironment");
 var _keyListener = require("../../lib/events/keyListener");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 
@@ -29,16 +28,20 @@ var ClearCrossIcon = exports.ClearCrossIcon = function ClearCrossIcon(_ref)
 
 
 {var _ref$size = _ref.size,size = _ref$size === void 0 ? 'small' : _ref$size,style = _ref.style,dataTid = _ref['data-tid'],rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+  var globalObject = (0, _renderEnvironment.useGlobal)();
+  var _useEmotion = (0, _renderEnvironment.useEmotion)(),cx = _useEmotion.cx;
+  var styles = (0, _renderEnvironment.useStyles)(_ClearCrossIcon.getStyles);
   var theme = _react.default.useContext(_ThemeContext.ThemeContext);
+  var keyListener = (0, _keyListener.useKeyListener)();
   var getSizeClassNames = function getSizeClassNames(size) {
     switch (size) {
       case 'large':
-        return { button: _ClearCrossIcon.styles.clearCrossLarge(theme), span: _ClearCrossIcon.styles.relativeWidthLarge(theme) };
+        return { button: styles.clearCrossLarge(theme), span: styles.relativeWidthLarge(theme) };
       case 'medium':
-        return { button: _ClearCrossIcon.styles.clearCrossMedium(theme), span: _ClearCrossIcon.styles.relativeWidthMedium(theme) };
+        return { button: styles.clearCrossMedium(theme), span: styles.relativeWidthMedium(theme) };
       case 'small':
       default:
-        return { button: _ClearCrossIcon.styles.clearCrossSmall(theme), span: _ClearCrossIcon.styles.relativeWidthSmall(theme) };
+        return { button: styles.clearCrossSmall(theme), span: styles.relativeWidthSmall(theme) };
     }
   };
 
@@ -46,8 +49,8 @@ var ClearCrossIcon = exports.ClearCrossIcon = function ClearCrossIcon(_ref)
 
   var handleFocus = function handleFocus() {
     // focus event fires before keyDown eventlistener so we should check tabPressed in async way
-    _globalObject.globalObject.requestAnimationFrame == null || _globalObject.globalObject.requestAnimationFrame(function () {
-      if (_keyListener.keyListener.isTabPressed) {
+    globalObject.requestAnimationFrame == null || globalObject.requestAnimationFrame(function () {
+      if (keyListener.isTabPressed) {
         setFocusedByTab(true);
       }
     });
@@ -61,10 +64,10 @@ var ClearCrossIcon = exports.ClearCrossIcon = function ClearCrossIcon(_ref)
       "data-tid": dataTid,
       type: "button",
       tabIndex: -1,
-      className: (0, _Emotion.cx)(
-        _ClearCrossIcon.styles.root(theme),
+      className: cx(
+        styles.root(theme),
         // Todo: use &:focus-visible on root instead styles.focus. It supported on Chrome >= 86, Firefox >= 4, Safari >= 15.4
-        focusedByTab && _ClearCrossIcon.styles.focus(theme),
+        focusedByTab && styles.focus(theme),
         getSizeClassNames(size).button
       ),
       style: style,

package/cjs/internal/ClearCrossIcon/ClearCrossIcon.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_globalObject","_Emotion","_keyListener","_ThemeContext","_CommonWrapper","_ClearCrossIcon","_CrossIcon","_excluded","ClearCrossIcon","exports","_ref","_ref$size","size","style","dataTid","rest","_objectWithoutPropertiesLoose2","default","theme","React","useContext","ThemeContext","getSizeClassNames","button","styles","clearCrossLarge","span","relativeWidthLarge","clearCrossMedium","relativeWidthMedium","clearCrossSmall","relativeWidthSmall","_React$useState","useState","focusedByTab","setFocusedByTab","handleFocus","globalObject","requestAnimationFrame","keyListener","isTabPressed","handleBlur","createElement","CommonWrapper","className","_extends2","type","tabIndex","cx","root","focus","onFocus","onBlur","CrossIcon","focusable","__KONTUR_REACT_UI__","displayName"],"sources":["ClearCrossIcon.tsx"],"sourcesContent":["import type { AriaAttributes } from 'react';\nimport React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { CommonProps } from '../CommonWrapper';\nimport { CommonWrapper } from '../CommonWrapper';\nimport type { SizeProp } from '../../lib/types/props';\nimport type { TokenSize } from '../../components/Token';\n\nimport { styles } from './ClearCrossIcon.styles';\nimport { CrossIcon } from './CrossIcon';\n\nexport interface ClearCrossIconProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    CommonProps {\n  /** Ширина и высота иконки крестика\n   * @default small */\n  size?: SizeProp;\n  'data-tid'?: string;\n}\n\nexport const ClearCrossIcon: React.FunctionComponent<ClearCrossIconProps> = ({\n  size = 'small',\n  style,\n  'data-tid': dataTid,\n  ...rest\n}) => {\n  const theme = React.useContext(ThemeContext);\n  const getSizeClassNames = (size: TokenSize) => {\n    switch (size) {\n      case 'large':\n        return { button: styles.clearCrossLarge(theme), span: styles.relativeWidthLarge(theme) };\n      case 'medium':\n        return { button: styles.clearCrossMedium(theme), span: styles.relativeWidthMedium(theme) };\n      case 'small':\n      default:\n        return { button: styles.clearCrossSmall(theme), span: styles.relativeWidthSmall(theme) };\n    }\n  };\n\n  const [focusedByTab, setFocusedByTab] = React.useState<boolean>(false);\n\n  const handleFocus = () => {\n    // focus event fires before keyDown eventlistener so we should check tabPressed in async way\n    globalObject.requestAnimationFrame?.(() => {\n      if (keyListener.isTabPressed) {\n        setFocusedByTab(true);\n      }\n    });\n  };\n  const handleBlur = () => setFocusedByTab(false);\n\n  return (\n    <CommonWrapper {...rest}>\n      <span className={getSizeClassNames(size).span}>\n        <button\n          data-tid={dataTid}\n          type=\"button\"\n          tabIndex={-1}\n          className={cx(\n            styles.root(theme),\n            // Todo: use &:focus-visible on root instead styles.focus. It supported on Chrome >= 86, Firefox >= 4, Safari >= 15.4\n            focusedByTab && styles.focus(theme),\n            getSizeClassNames(size).button,\n          )}\n          style={style}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          {...rest}\n        >\n          <CrossIcon size={size} focusable />\n        </button>\n      </span>\n    </CommonWrapper>\n  );\n};\n\nClearCrossIcon.__KONTUR_REACT_UI__ = 'ClearCrossIcon';\nClearCrossIcon.displayName = 'ClearCrossIcon';\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_renderEnvironment","_keyListener","_ThemeContext","_CommonWrapper","_ClearCrossIcon","_CrossIcon","_excluded","ClearCrossIcon","exports","_ref","_ref$size","size","style","dataTid","rest","_objectWithoutPropertiesLoose2","default","globalObject","useGlobal","_useEmotion","useEmotion","cx","styles","useStyles","getStyles","theme","React","useContext","ThemeContext","keyListener","useKeyListener","getSizeClassNames","button","clearCrossLarge","span","relativeWidthLarge","clearCrossMedium","relativeWidthMedium","clearCrossSmall","relativeWidthSmall","_React$useState","useState","focusedByTab","setFocusedByTab","handleFocus","requestAnimationFrame","isTabPressed","handleBlur","createElement","CommonWrapper","className","_extends2","type","tabIndex","root","focus","onFocus","onBlur","CrossIcon","focusable","__KONTUR_REACT_UI__","displayName"],"sources":["ClearCrossIcon.tsx"],"sourcesContent":["import type { AriaAttributes } from 'react';\nimport React from 'react';\n\nimport { useGlobal, useEmotion, useStyles } from '../../lib/renderEnvironment';\nimport { useKeyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { CommonProps } from '../CommonWrapper';\nimport { CommonWrapper } from '../CommonWrapper';\nimport type { SizeProp } from '../../lib/types/props';\nimport type { TokenSize } from '../../components/Token';\n\nimport { getStyles } from './ClearCrossIcon.styles';\nimport { CrossIcon } from './CrossIcon';\n\nexport interface ClearCrossIconProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    CommonProps {\n  /** Ширина и высота иконки крестика\n   * @default small */\n  size?: SizeProp;\n  'data-tid'?: string;\n}\n\nexport const ClearCrossIcon: React.FunctionComponent<ClearCrossIconProps> = ({\n  size = 'small',\n  style,\n  'data-tid': dataTid,\n  ...rest\n}) => {\n  const globalObject = useGlobal();\n  const { cx } = useEmotion();\n  const styles = useStyles(getStyles);\n  const theme = React.useContext(ThemeContext);\n  const keyListener = useKeyListener();\n  const getSizeClassNames = (size: TokenSize) => {\n    switch (size) {\n      case 'large':\n        return { button: styles.clearCrossLarge(theme), span: styles.relativeWidthLarge(theme) };\n      case 'medium':\n        return { button: styles.clearCrossMedium(theme), span: styles.relativeWidthMedium(theme) };\n      case 'small':\n      default:\n        return { button: styles.clearCrossSmall(theme), span: styles.relativeWidthSmall(theme) };\n    }\n  };\n\n  const [focusedByTab, setFocusedByTab] = React.useState<boolean>(false);\n\n  const handleFocus = () => {\n    // focus event fires before keyDown eventlistener so we should check tabPressed in async way\n    globalObject.requestAnimationFrame?.(() => {\n      if (keyListener.isTabPressed) {\n        setFocusedByTab(true);\n      }\n    });\n  };\n  const handleBlur = () => setFocusedByTab(false);\n\n  return (\n    <CommonWrapper {...rest}>\n      <span className={getSizeClassNames(size).span}>\n        <button\n          data-tid={dataTid}\n          type=\"button\"\n          tabIndex={-1}\n          className={cx(\n            styles.root(theme),\n            // Todo: use &:focus-visible on root instead styles.focus. It supported on Chrome >= 86, Firefox >= 4, Safari >= 15.4\n            focusedByTab && styles.focus(theme),\n            getSizeClassNames(size).button,\n          )}\n          style={style}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          {...rest}\n        >\n          <CrossIcon size={size} focusable />\n        </button>\n      </span>\n    </CommonWrapper>\n  );\n};\n\nClearCrossIcon.__KONTUR_REACT_UI__ = 'ClearCrossIcon';\nClearCrossIcon.displayName = 'ClearCrossIcon';\n"],"mappings":";AACA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;;AAEA,IAAAC,kBAAA,GAAAD,OAAA;AACA,IAAAE,YAAA,GAAAF,OAAA;AACA,IAAAG,aAAA,GAAAH,OAAA;;AAEA,IAAAI,cAAA,GAAAJ,OAAA;;;;AAIA,IAAAK,eAAA,GAAAL,OAAA;AACA,IAAAM,UAAA,GAAAN,OAAA,gBAAwC,IAAAO,SAAA;;;;;;;;;;;;AAYjC,IAAMC,cAA4D,GAAAC,OAAA,CAAAD,cAAA,GAAG,SAA/DA,cAA4DA,CAAAE,IAAA;;;;;AAKnE,KAAAC,SAAA,GAAAD,IAAA,CAJJE,IAAI,CAAJA,IAAI,GAAAD,SAAA,cAAG,OAAO,GAAAA,SAAA,CACdE,KAAK,GAAAH,IAAA,CAALG,KAAK,CACOC,OAAO,GAAAJ,IAAA,CAAnB,UAAU,EACPK,IAAI,OAAAC,8BAAA,CAAAC,OAAA,EAAAP,IAAA,EAAAH,SAAA;EAEP,IAAMW,YAAY,GAAG,IAAAC,4BAAS,EAAC,CAAC;EAChC,IAAAC,WAAA,GAAe,IAAAC,6BAAU,EAAC,CAAC,CAAnBC,EAAE,GAAAF,WAAA,CAAFE,EAAE;EACV,IAAMC,MAAM,GAAG,IAAAC,4BAAS,EAACC,yBAAS,CAAC;EACnC,IAAMC,KAAK,GAAGC,cAAK,CAACC,UAAU,CAACC,0BAAY,CAAC;EAC5C,IAAMC,WAAW,GAAG,IAAAC,2BAAc,EAAC,CAAC;EACpC,IAAMC,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIpB,IAAe,EAAK;IAC7C,QAAQA,IAAI;MACV,KAAK,OAAO;QACV,OAAO,EAAEqB,MAAM,EAAEV,MAAM,CAACW,eAAe,CAACR,KAAK,CAAC,EAAES,IAAI,EAAEZ,MAAM,CAACa,kBAAkB,CAACV,KAAK,CAAC,CAAC,CAAC;MAC1F,KAAK,QAAQ;QACX,OAAO,EAAEO,MAAM,EAAEV,MAAM,CAACc,gBAAgB,CAACX,KAAK,CAAC,EAAES,IAAI,EAAEZ,MAAM,CAACe,mBAAmB,CAACZ,KAAK,CAAC,CAAC,CAAC;MAC5F,KAAK,OAAO;MACZ;QACE,OAAO,EAAEO,MAAM,EAAEV,MAAM,CAACgB,eAAe,CAACb,KAAK,CAAC,EAAES,IAAI,EAAEZ,MAAM,CAACiB,kBAAkB,CAACd,KAAK,CAAC,CAAC,CAAC;IAC5F;EACF,CAAC;;EAED,IAAAe,eAAA,GAAwCd,cAAK,CAACe,QAAQ,CAAU,KAAK,CAAC,CAA/DC,YAAY,GAAAF,eAAA,IAAEG,eAAe,GAAAH,eAAA;;EAEpC,IAAMI,WAAW,GAAG,SAAdA,WAAWA,CAAA,EAAS;IACxB;IACA3B,YAAY,CAAC4B,qBAAqB,YAAlC5B,YAAY,CAAC4B,qBAAqB,CAAG,YAAM;MACzC,IAAIhB,WAAW,CAACiB,YAAY,EAAE;QAC5BH,eAAe,CAAC,IAAI,CAAC;MACvB;IACF,CAAC,CAAC;EACJ,CAAC;EACD,IAAMI,UAAU,GAAG,SAAbA,UAAUA,CAAA,UAASJ,eAAe,CAAC,KAAK,CAAC;;EAE/C;IACE9C,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAC7C,cAAA,CAAA8C,aAAa,EAAKnC,IAAI;IACrBjB,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,WAAME,SAAS,EAAEnB,iBAAiB,CAACpB,IAAI,CAAC,CAACuB,IAAK;IAC5CrC,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,eAAAG,SAAA,CAAAnC,OAAA;MACE,YAAUH,OAAQ;MAClBuC,IAAI,EAAC,QAAQ;MACbC,QAAQ,EAAE,CAAC,CAAE;MACbH,SAAS,EAAE7B,EAAE;QACXC,MAAM,CAACgC,IAAI,CAAC7B,KAAK,CAAC;QAClB;QACAiB,YAAY,IAAIpB,MAAM,CAACiC,KAAK,CAAC9B,KAAK,CAAC;QACnCM,iBAAiB,CAACpB,IAAI,CAAC,CAACqB;MAC1B,CAAE;MACFpB,KAAK,EAAEA,KAAM;MACb4C,OAAO,EAAEZ,WAAY;MACrBa,MAAM,EAAEV,UAAW;IACfjC,IAAI;;IAERjB,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAC3C,UAAA,CAAAqD,SAAS,IAAC/C,IAAI,EAAEA,IAAK,EAACgD,SAAS,QAAE;IAC5B;IACJ;IACO,CAAC;;AAEpB,CAAC;;AAEDpD,cAAc,CAACqD,mBAAmB,GAAG,gBAAgB;AACrDrD,cAAc,CAACsD,WAAW,GAAG,gBAAgB","ignoreList":[]}

package/cjs/internal/ClearCrossIcon/ClearCrossIcon.styles.d.ts

@@ -1,5 +1,6 @@
+import type { Emotion } from '@emotion/css/types/create-instance';
 import type { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
+export declare const getStyles: (emotion: Emotion) => {
     root(t: Theme): string;
     focus(t: Theme): string;
     clearCrossSmall(t: Theme): string;

package/cjs/internal/ClearCrossIcon/ClearCrossIcon.styles.js

@@ -1,69 +1,72 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
+
+var _Emotion = require("../../lib/theming/Emotion");
 
 var _Mixins = require("../../lib/styles/Mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
 
-var styles = exports.styles = (0, _Emotion.memoizeStyle)({
-  root: function root(t) {
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "\n      color: ", ";\n      cursor: pointer;\n      transition: color ", " ", ";\n      &:hover {\n        color: ", ";\n      }\n      display: flex;\n      justify-content: ", ";\n      align-items: center;\n      position: absolute;\n      right: -", ";\n      top: -", ";\n    "])),
-    (0, _Mixins.resetButton)(),
-    t.clearCrossIconColor,
+var getStyles = exports.getStyles = function getStyles(emotion) {return (
+    (0, _Emotion.memoizeStyle)({
+      root: function root(t) {
+        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "\n      color: ", ";\n      cursor: pointer;\n      transition: color ", " ", ";\n      &:hover {\n        color: ", ";\n      }\n      display: flex;\n      justify-content: ", ";\n      align-items: center;\n      position: absolute;\n      right: -", ";\n      top: -", ";\n    "])),
+        (0, _Mixins.resetButton)(),
+        t.clearCrossIconColor,
 
-    t.transitionDuration, t.transitionTimingFunction,
+        t.transitionDuration, t.transitionTimingFunction,
 
-    t.clearCrossIconHoverColor,
+        t.clearCrossIconHoverColor,
 
 
-    t.clearCrossIconAlign,
+        t.clearCrossIconAlign,
 
 
-    t.inputBorderWidth,
-    t.inputBorderWidth);
+        t.inputBorderWidth,
+        t.inputBorderWidth);
 
-  },
+      },
 
-  focus: function focus(t) {
-    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n    "])),
-    t.clearCrossIconHoverColor);
+      focus: function focus(t) {
+        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n        color: ", ";\n      "])),
+        t.clearCrossIconHoverColor);
 
-  },
+      },
 
-  clearCrossSmall: function clearCrossSmall(t) {
-    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n      border-radius: ", ";\n    "])),
-    t.clearCrossIconWidthSmall,
-    t.clearCrossIconHeightSmall,
-    t.clearCrossIconBorderRadiusSmall);
+      clearCrossSmall: function clearCrossSmall(t) {
+        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n      border-radius: ", ";\n    "])),
+        t.clearCrossIconWidthSmall,
+        t.clearCrossIconHeightSmall,
+        t.clearCrossIconBorderRadiusSmall);
 
-  },
-  clearCrossMedium: function clearCrossMedium(t) {
-    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n      border-radius: ", ";\n    "])),
-    t.clearCrossIconWidthMedium,
-    t.clearCrossIconHeightMedium,
-    t.clearCrossIconBorderRadiusMedium);
+      },
+      clearCrossMedium: function clearCrossMedium(t) {
+        return emotion.css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n      border-radius: ", ";\n    "])),
+        t.clearCrossIconWidthMedium,
+        t.clearCrossIconHeightMedium,
+        t.clearCrossIconBorderRadiusMedium);
 
-  },
-  clearCrossLarge: function clearCrossLarge(t) {
-    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n      border-radius: ", ";\n    "])),
-    t.clearCrossIconWidthLarge,
-    t.clearCrossIconHeightLarge,
-    t.clearCrossIconBorderRadiusLarge);
+      },
+      clearCrossLarge: function clearCrossLarge(t) {
+        return emotion.css(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n      border-radius: ", ";\n    "])),
+        t.clearCrossIconWidthLarge,
+        t.clearCrossIconHeightLarge,
+        t.clearCrossIconBorderRadiusLarge);
 
-  },
-  relativeWidthSmall: function relativeWidthSmall(t) {
-    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      width: ", ";\n    "])),
+      },
+      relativeWidthSmall: function relativeWidthSmall(t) {
+        return emotion.css(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      width: ", ";\n    "])),
 
-    t.inputIconSizeSmall);
+        t.inputIconSizeSmall);
 
-  },
-  relativeWidthMedium: function relativeWidthMedium(t) {
-    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      width: ", ";\n    "])),
+      },
+      relativeWidthMedium: function relativeWidthMedium(t) {
+        return emotion.css(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      width: ", ";\n    "])),
 
-    t.inputIconSizeMedium);
+        t.inputIconSizeMedium);
 
-  },
-  relativeWidthLarge: function relativeWidthLarge(t) {
-    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      width: ", ";\n    "])),
+      },
+      relativeWidthLarge: function relativeWidthLarge(t) {
+        return emotion.css(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      width: ", ";\n    "])),
 
-    t.inputIconSizeLarge);
+        t.inputIconSizeLarge);
 
-  }
-});
+      }
+    }));};

package/cjs/internal/ClearCrossIcon/ClearCrossIcon.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Emotion","require","_Mixins","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","styles","exports","memoizeStyle","root","t","css","_taggedTemplateLiteralLoose2","default","resetButton","clearCrossIconColor","transitionDuration","transitionTimingFunction","clearCrossIconHoverColor","clearCrossIconAlign","inputBorderWidth","focus","clearCrossSmall","clearCrossIconWidthSmall","clearCrossIconHeightSmall","clearCrossIconBorderRadiusSmall","clearCrossMedium","clearCrossIconWidthMedium","clearCrossIconHeightMedium","clearCrossIconBorderRadiusMedium","clearCrossLarge","clearCrossIconWidthLarge","clearCrossIconHeightLarge","clearCrossIconBorderRadiusLarge","relativeWidthSmall","inputIconSizeSmall","relativeWidthMedium","inputIconSizeMedium","relativeWidthLarge","inputIconSizeLarge"],"sources":["ClearCrossIcon.styles.tsx"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      ${resetButton()}\n      color: ${t.clearCrossIconColor};\n      cursor: pointer;\n      transition: color ${t.transitionDuration} ${t.transitionTimingFunction};\n      &:hover {\n        color: ${t.clearCrossIconHoverColor};\n      }\n      display: flex;\n      justify-content: ${t.clearCrossIconAlign};\n      align-items: center;\n      position: absolute;\n      right: -${t.inputBorderWidth};\n      top: -${t.inputBorderWidth};\n    `;\n  },\n\n  focus(t: Theme) {\n    return css`\n      color: ${t.clearCrossIconHoverColor};\n    `;\n  },\n\n  clearCrossSmall(t: Theme) {\n    return css`\n      width: ${t.clearCrossIconWidthSmall};\n      height: ${t.clearCrossIconHeightSmall};\n      border-radius: ${t.clearCrossIconBorderRadiusSmall};\n    `;\n  },\n  clearCrossMedium(t: Theme) {\n    return css`\n      width: ${t.clearCrossIconWidthMedium};\n      height: ${t.clearCrossIconHeightMedium};\n      border-radius: ${t.clearCrossIconBorderRadiusMedium};\n    `;\n  },\n  clearCrossLarge(t: Theme) {\n    return css`\n      width: ${t.clearCrossIconWidthLarge};\n      height: ${t.clearCrossIconHeightLarge};\n      border-radius: ${t.clearCrossIconBorderRadiusLarge};\n    `;\n  },\n  relativeWidthSmall(t: Theme) {\n    return css`\n      display: inline-block;\n      width: ${t.inputIconSizeSmall};\n    `;\n  },\n  relativeWidthMedium(t: Theme) {\n    return css`\n      display: inline-block;\n      width: ${t.inputIconSizeMedium};\n    `;\n  },\n  relativeWidthLarge(t: Theme) {\n    return css`\n      display: inline-block;\n      width: ${t.inputIconSizeLarge};\n    `;\n  },\n});\n"],"mappings":"oRAAA,IAAAA,QAAA,GAAAC,OAAA;;AAEA,IAAAC,OAAA,GAAAD,OAAA,4BAAsD,IAAAE,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;AAE/C,IAAMC,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,IAAAE,qBAAY,EAAC;EACjCC,IAAI,WAAAA,KAACC,CAAQ,EAAE;IACb,WAAOC,YAAG,EAAAb,eAAA,KAAAA,eAAA,OAAAc,4BAAA,CAAAC,OAAA;IACN,IAAAC,mBAAW,EAAC,CAAC;IACNJ,CAAC,CAACK,mBAAmB;;IAEVL,CAAC,CAACM,kBAAkB,EAAIN,CAAC,CAACO,wBAAwB;;IAE3DP,CAAC,CAACQ,wBAAwB;;;IAGlBR,CAAC,CAACS,mBAAmB;;;IAG9BT,CAAC,CAACU,gBAAgB;IACpBV,CAAC,CAACU,gBAAgB;;EAE9B,CAAC;;EAEDC,KAAK,WAAAA,MAACX,CAAQ,EAAE;IACd,WAAOC,YAAG,EAAAZ,gBAAA,KAAAA,gBAAA,OAAAa,4BAAA,CAAAC,OAAA;IACCH,CAAC,CAACQ,wBAAwB;;EAEvC,CAAC;;EAEDI,eAAe,WAAAA,gBAACZ,CAAQ,EAAE;IACxB,WAAOC,YAAG,EAAAX,gBAAA,KAAAA,gBAAA,OAAAY,4BAAA,CAAAC,OAAA;IACCH,CAAC,CAACa,wBAAwB;IACzBb,CAAC,CAACc,yBAAyB;IACpBd,CAAC,CAACe,+BAA+B;;EAEtD,CAAC;EACDC,gBAAgB,WAAAA,iBAAChB,CAAQ,EAAE;IACzB,WAAOC,YAAG,EAAAV,gBAAA,KAAAA,gBAAA,OAAAW,4BAAA,CAAAC,OAAA;IACCH,CAAC,CAACiB,yBAAyB;IAC1BjB,CAAC,CAACkB,0BAA0B;IACrBlB,CAAC,CAACmB,gCAAgC;;EAEvD,CAAC;EACDC,eAAe,WAAAA,gBAACpB,CAAQ,EAAE;IACxB,WAAOC,YAAG,EAAAT,gBAAA,KAAAA,gBAAA,OAAAU,4BAAA,CAAAC,OAAA;IACCH,CAAC,CAACqB,wBAAwB;IACzBrB,CAAC,CAACsB,yBAAyB;IACpBtB,CAAC,CAACuB,+BAA+B;;EAEtD,CAAC;EACDC,kBAAkB,WAAAA,mBAACxB,CAAQ,EAAE;IAC3B,WAAOC,YAAG,EAAAR,gBAAA,KAAAA,gBAAA,OAAAS,4BAAA,CAAAC,OAAA;;IAECH,CAAC,CAACyB,kBAAkB;;EAEjC,CAAC;EACDC,mBAAmB,WAAAA,oBAAC1B,CAAQ,EAAE;IAC5B,WAAOC,YAAG,EAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;;IAECH,CAAC,CAAC2B,mBAAmB;;EAElC,CAAC;EACDC,kBAAkB,WAAAA,mBAAC5B,CAAQ,EAAE;IAC3B,WAAOC,YAAG,EAAAN,gBAAA,KAAAA,gBAAA,OAAAO,4BAAA,CAAAC,OAAA;;IAECH,CAAC,CAAC6B,kBAAkB;;EAEjC;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_Emotion","require","_Mixins","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","getStyles","exports","emotion","memoizeStyle","root","t","css","_taggedTemplateLiteralLoose2","default","resetButton","clearCrossIconColor","transitionDuration","transitionTimingFunction","clearCrossIconHoverColor","clearCrossIconAlign","inputBorderWidth","focus","clearCrossSmall","clearCrossIconWidthSmall","clearCrossIconHeightSmall","clearCrossIconBorderRadiusSmall","clearCrossMedium","clearCrossIconWidthMedium","clearCrossIconHeightMedium","clearCrossIconBorderRadiusMedium","clearCrossLarge","clearCrossIconWidthLarge","clearCrossIconHeightLarge","clearCrossIconBorderRadiusLarge","relativeWidthSmall","inputIconSizeSmall","relativeWidthMedium","inputIconSizeMedium","relativeWidthLarge","inputIconSizeLarge"],"sources":["ClearCrossIcon.styles.tsx"],"sourcesContent":["import type { Emotion } from '@emotion/css/types/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    root(t: Theme) {\n      return emotion.css`\n      ${resetButton()}\n      color: ${t.clearCrossIconColor};\n      cursor: pointer;\n      transition: color ${t.transitionDuration} ${t.transitionTimingFunction};\n      &:hover {\n        color: ${t.clearCrossIconHoverColor};\n      }\n      display: flex;\n      justify-content: ${t.clearCrossIconAlign};\n      align-items: center;\n      position: absolute;\n      right: -${t.inputBorderWidth};\n      top: -${t.inputBorderWidth};\n    `;\n    },\n\n    focus(t: Theme) {\n      return emotion.css`\n        color: ${t.clearCrossIconHoverColor};\n      `;\n    },\n\n    clearCrossSmall(t: Theme) {\n      return emotion.css`\n      width: ${t.clearCrossIconWidthSmall};\n      height: ${t.clearCrossIconHeightSmall};\n      border-radius: ${t.clearCrossIconBorderRadiusSmall};\n    `;\n    },\n    clearCrossMedium(t: Theme) {\n      return emotion.css`\n      width: ${t.clearCrossIconWidthMedium};\n      height: ${t.clearCrossIconHeightMedium};\n      border-radius: ${t.clearCrossIconBorderRadiusMedium};\n    `;\n    },\n    clearCrossLarge(t: Theme) {\n      return emotion.css`\n      width: ${t.clearCrossIconWidthLarge};\n      height: ${t.clearCrossIconHeightLarge};\n      border-radius: ${t.clearCrossIconBorderRadiusLarge};\n    `;\n    },\n    relativeWidthSmall(t: Theme) {\n      return emotion.css`\n      display: inline-block;\n      width: ${t.inputIconSizeSmall};\n    `;\n    },\n    relativeWidthMedium(t: Theme) {\n      return emotion.css`\n      display: inline-block;\n      width: ${t.inputIconSizeMedium};\n    `;\n    },\n    relativeWidthLarge(t: Theme) {\n      return emotion.css`\n      display: inline-block;\n      width: ${t.inputIconSizeLarge};\n    `;\n    },\n  });\n"],"mappings":";;AAEA,IAAAA,QAAA,GAAAC,OAAA;;AAEA,IAAAC,OAAA,GAAAD,OAAA,4BAAsD,IAAAE,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;AAE/C,IAAMC,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,SAAZA,SAASA,CAAIE,OAAgB;IACxC,IAAAC,qBAAY,EAAC;MACXC,IAAI,WAAAA,KAACC,CAAQ,EAAE;QACb,OAAOH,OAAO,CAACI,GAAG,CAAAd,eAAA,KAAAA,eAAA,OAAAe,4BAAA,CAAAC,OAAA;QAChB,IAAAC,mBAAW,EAAC,CAAC;QACNJ,CAAC,CAACK,mBAAmB;;QAEVL,CAAC,CAACM,kBAAkB,EAAIN,CAAC,CAACO,wBAAwB;;QAE3DP,CAAC,CAACQ,wBAAwB;;;QAGlBR,CAAC,CAACS,mBAAmB;;;QAG9BT,CAAC,CAACU,gBAAgB;QACpBV,CAAC,CAACU,gBAAgB;;MAE5B,CAAC;;MAEDC,KAAK,WAAAA,MAACX,CAAQ,EAAE;QACd,OAAOH,OAAO,CAACI,GAAG,CAAAb,gBAAA,KAAAA,gBAAA,OAAAc,4BAAA,CAAAC,OAAA;QACPH,CAAC,CAACQ,wBAAwB;;MAEvC,CAAC;;MAEDI,eAAe,WAAAA,gBAACZ,CAAQ,EAAE;QACxB,OAAOH,OAAO,CAACI,GAAG,CAAAZ,gBAAA,KAAAA,gBAAA,OAAAa,4BAAA,CAAAC,OAAA;QACTH,CAAC,CAACa,wBAAwB;QACzBb,CAAC,CAACc,yBAAyB;QACpBd,CAAC,CAACe,+BAA+B;;MAEpD,CAAC;MACDC,gBAAgB,WAAAA,iBAAChB,CAAQ,EAAE;QACzB,OAAOH,OAAO,CAACI,GAAG,CAAAX,gBAAA,KAAAA,gBAAA,OAAAY,4BAAA,CAAAC,OAAA;QACTH,CAAC,CAACiB,yBAAyB;QAC1BjB,CAAC,CAACkB,0BAA0B;QACrBlB,CAAC,CAACmB,gCAAgC;;MAErD,CAAC;MACDC,eAAe,WAAAA,gBAACpB,CAAQ,EAAE;QACxB,OAAOH,OAAO,CAACI,GAAG,CAAAV,gBAAA,KAAAA,gBAAA,OAAAW,4BAAA,CAAAC,OAAA;QACTH,CAAC,CAACqB,wBAAwB;QACzBrB,CAAC,CAACsB,yBAAyB;QACpBtB,CAAC,CAACuB,+BAA+B;;MAEpD,CAAC;MACDC,kBAAkB,WAAAA,mBAACxB,CAAQ,EAAE;QAC3B,OAAOH,OAAO,CAACI,GAAG,CAAAT,gBAAA,KAAAA,gBAAA,OAAAU,4BAAA,CAAAC,OAAA;;QAETH,CAAC,CAACyB,kBAAkB;;MAE/B,CAAC;MACDC,mBAAmB,WAAAA,oBAAC1B,CAAQ,EAAE;QAC5B,OAAOH,OAAO,CAACI,GAAG,CAAAR,gBAAA,KAAAA,gBAAA,OAAAS,4BAAA,CAAAC,OAAA;;QAETH,CAAC,CAAC2B,mBAAmB;;MAEhC,CAAC;MACDC,kBAAkB,WAAAA,mBAAC5B,CAAQ,EAAE;QAC3B,OAAOH,OAAO,CAACI,GAAG,CAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;;QAETH,CAAC,CAAC6B,kBAAkB;;MAE/B;IACF,CAAC,CAAC","ignoreList":[]}

package/cjs/internal/ClearCrossIcon/CrossIcon.d.ts

@@ -1,3 +1,3 @@
 export declare const CrossIcon: import("../../lib/forwardRefAndName").ReactUIIconWithRef<SVGSVGElement, Omit<import("../icons2022/BaseIcon").IconProps, "size"> & {
-    size?: number | "small" | "medium" | "large" | undefined;
+    size?: import("../icons2022/BaseIcon").IconProps["size"] | import("../icons2022/iconConstants").IconSizeAliases;
 }>;

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.js

@@ -1,8 +1,7 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.CloseButtonIcon = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _react = _interopRequireDefault(require("react"));
-var _globalObject = require("@skbkontur/global-object");
 
-var _Emotion = require("../../lib/theming/Emotion");
+var _renderEnvironment = require("../../lib/renderEnvironment");
 var _keyListener = require("../../lib/events/keyListener");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _iconConstants = require("../icons2022/iconConstants");
@@ -58,6 +57,9 @@ var CloseButtonIcon = exports.CloseButtonIcon = function CloseButtonIcon(_ref)
 
 
 {var _ref$side = _ref.side,side = _ref$side === void 0 ? _iconConstants.DEFAULT_ICON_SIZE : _ref$side,_ref$size = _ref.size,size = _ref$size === void 0 ? _iconConstants.DEFAULT_ICON_SIZE : _ref$size,color = _ref.color,colorHover = _ref.colorHover,_ref$tabbable = _ref.tabbable,tabbable = _ref$tabbable === void 0 ? true : _ref$tabbable,style = _ref.style,rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+  var globalObject = (0, _renderEnvironment.useGlobal)();
+  var _useEmotion = (0, _renderEnvironment.useEmotion)(),cx = _useEmotion.cx;
+  var styles = (0, _renderEnvironment.useStyles)(_CloseButtonIcon.getStyles);
   var _theme = _react.default.useContext(_ThemeContext.ThemeContext);
   var theme = _ThemeFactory.ThemeFactory.create(
     {
@@ -66,13 +68,14 @@ var CloseButtonIcon = exports.CloseButtonIcon = function CloseButtonIcon(_ref)
     },
     _theme
   );
+  var keyListener = (0, _keyListener.useKeyListener)();
   var _React$useState = _react.default.useState(false),focusedByTab = _React$useState[0],setFocusedByTab = _React$useState[1];
 
   var handleFocus = function handleFocus() {
     // focus event fires before keyDown eventlistener
     // so we should check tabPressed in async way
-    _globalObject.globalObject.requestAnimationFrame == null || _globalObject.globalObject.requestAnimationFrame(function () {
-      if (_keyListener.keyListener.isTabPressed) {
+    globalObject.requestAnimationFrame == null || globalObject.requestAnimationFrame(function () {
+      if (keyListener.isTabPressed) {
         setFocusedByTab(true);
       }
     });
@@ -85,17 +88,17 @@ var CloseButtonIcon = exports.CloseButtonIcon = function CloseButtonIcon(_ref)
     _react.default.createElement(_CommonWrapper.CommonWrapper, rest, /*#__PURE__*/
     _react.default.createElement("button", (0, _extends2.default)({
       tabIndex: tabIndex,
-      className: (0, _Emotion.cx)(
-        _CloseButtonIcon.styles.root(theme),
-        !rest.disabled && focusedByTab && _CloseButtonIcon.styles.focus(theme),
-        rest.disabled && _CloseButtonIcon.styles.rootDisabled(theme)
+      className: cx(
+        styles.root(theme),
+        !rest.disabled && focusedByTab && styles.focus(theme),
+        rest.disabled && styles.rootDisabled(theme)
       ),
       style: (0, _extends2.default)({}, style, { width: side, height: side }),
       onFocus: handleFocus,
       onBlur: handleBlur },
     rest), /*#__PURE__*/
 
-    _react.default.createElement("span", { className: _CloseButtonIcon.styles.wrapper() }, /*#__PURE__*/
+    _react.default.createElement("span", { className: styles.wrapper() }, /*#__PURE__*/
     _react.default.createElement(_CrossIcon.CrossIcon, { size: side < size ? side : size, focusable: tabIndex >= 0 })
     )
     )

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_globalObject","_Emotion","_keyListener","_ThemeContext","_iconConstants","_ThemeFactory","_CommonWrapper","_CloseButtonIcon","_CrossIcon","_excluded","CloseButtonIcon","exports","_ref","_ref$side","side","DEFAULT_ICON_SIZE","_ref$size","size","color","colorHover","_ref$tabbable","tabbable","style","rest","_objectWithoutPropertiesLoose2","default","_theme","React","useContext","ThemeContext","theme","ThemeFactory","create","closeBtnIconColor","closeBtnIconHoverColor","_React$useState","useState","focusedByTab","setFocusedByTab","handleFocus","globalObject","requestAnimationFrame","keyListener","isTabPressed","handleBlur","tabIndex","disabled","createElement","CommonWrapper","_extends2","className","cx","styles","root","focus","rootDisabled","width","height","onFocus","onBlur","wrapper","CrossIcon","focusable","__KONTUR_REACT_UI__","displayName"],"sources":["CloseButtonIcon.tsx"],"sourcesContent":["import type { AriaAttributes, CSSProperties } from 'react';\nimport React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { DEFAULT_ICON_SIZE } from '../icons2022/iconConstants';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport type { CommonProps } from '../CommonWrapper';\nimport { CommonWrapper } from '../CommonWrapper';\n\nimport { styles } from './CloseButtonIcon.styles';\nimport { CrossIcon } from './CrossIcon';\n\nexport interface CloseButtonIconProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    CommonProps {\n  /**\n   * Ширина и высота иконки крестика\n   *\n   * @default 16\n   */\n  size?: number;\n  /**\n   * Ширина и высота всей кнопки\n   *\n   * @default 16\n   */\n  side?: number;\n  /**\n   * Цвет иконки\n   *\n   * Переменная темы: `closeBtnIconColor`\n   */\n  color?: CSSProperties['color'];\n  /**\n   * Цвет иконки при наведении мышью и при фокусе\n   *\n   * Переменная темы: `closeBtnIconHoverColor`\n   */\n  colorHover?: CSSProperties['color'];\n  /**\n   * Возможность сфокусироваться на кнопке клавишей TAB\n   *\n   * @default true\n   * */\n  tabbable?: boolean;\n}\n\nexport const CloseButtonIcon: React.FunctionComponent<CloseButtonIconProps> = ({\n  side = DEFAULT_ICON_SIZE,\n  size = DEFAULT_ICON_SIZE,\n  color,\n  colorHover,\n  tabbable = true,\n  style,\n  ...rest\n}) => {\n  const _theme = React.useContext(ThemeContext);\n  const theme = ThemeFactory.create(\n    {\n      closeBtnIconColor: color ?? _theme.closeBtnIconColor,\n      closeBtnIconHoverColor: colorHover ?? _theme.closeBtnIconHoverColor,\n    },\n    _theme,\n  );\n  const [focusedByTab, setFocusedByTab] = React.useState(false);\n\n  const handleFocus = () => {\n    // focus event fires before keyDown eventlistener\n    // so we should check tabPressed in async way\n    globalObject.requestAnimationFrame?.(() => {\n      if (keyListener.isTabPressed) {\n        setFocusedByTab(true);\n      }\n    });\n  };\n  const handleBlur = () => setFocusedByTab(false);\n\n  const tabIndex = !tabbable || rest.disabled ? -1 : 0;\n\n  return (\n    <CommonWrapper {...rest}>\n      <button\n        tabIndex={tabIndex}\n        className={cx(\n          styles.root(theme),\n          !rest.disabled && focusedByTab && styles.focus(theme),\n          rest.disabled && styles.rootDisabled(theme),\n        )}\n        style={{ ...style, width: side, height: side }}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        {...rest}\n      >\n        <span className={styles.wrapper()}>\n          <CrossIcon size={side < size ? side : size} focusable={tabIndex >= 0} />\n        </span>\n      </button>\n    </CommonWrapper>\n  );\n};\n\nCloseButtonIcon.__KONTUR_REACT_UI__ = 'CloseButtonIcon';\nCloseButtonIcon.displayName = 'CloseButtonIcon';\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_renderEnvironment","_keyListener","_ThemeContext","_iconConstants","_ThemeFactory","_CommonWrapper","_CloseButtonIcon","_CrossIcon","_excluded","CloseButtonIcon","exports","_ref","_ref$side","side","DEFAULT_ICON_SIZE","_ref$size","size","color","colorHover","_ref$tabbable","tabbable","style","rest","_objectWithoutPropertiesLoose2","default","globalObject","useGlobal","_useEmotion","useEmotion","cx","styles","useStyles","getStyles","_theme","React","useContext","ThemeContext","theme","ThemeFactory","create","closeBtnIconColor","closeBtnIconHoverColor","keyListener","useKeyListener","_React$useState","useState","focusedByTab","setFocusedByTab","handleFocus","requestAnimationFrame","isTabPressed","handleBlur","tabIndex","disabled","createElement","CommonWrapper","_extends2","className","root","focus","rootDisabled","width","height","onFocus","onBlur","wrapper","CrossIcon","focusable","__KONTUR_REACT_UI__","displayName"],"sources":["CloseButtonIcon.tsx"],"sourcesContent":["import type { AriaAttributes, CSSProperties } from 'react';\nimport React from 'react';\n\nimport { useGlobal, useEmotion, useStyles } from '../../lib/renderEnvironment';\nimport { useKeyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { DEFAULT_ICON_SIZE } from '../icons2022/iconConstants';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport type { CommonProps } from '../CommonWrapper';\nimport { CommonWrapper } from '../CommonWrapper';\n\nimport { getStyles } from './CloseButtonIcon.styles';\nimport { CrossIcon } from './CrossIcon';\n\nexport interface CloseButtonIconProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    CommonProps {\n  /**\n   * Ширина и высота иконки крестика\n   *\n   * @default 16\n   */\n  size?: number;\n  /**\n   * Ширина и высота всей кнопки\n   *\n   * @default 16\n   */\n  side?: number;\n  /**\n   * Цвет иконки\n   *\n   * Переменная темы: `closeBtnIconColor`\n   */\n  color?: CSSProperties['color'];\n  /**\n   * Цвет иконки при наведении мышью и при фокусе\n   *\n   * Переменная темы: `closeBtnIconHoverColor`\n   */\n  colorHover?: CSSProperties['color'];\n  /**\n   * Возможность сфокусироваться на кнопке клавишей TAB\n   *\n   * @default true\n   * */\n  tabbable?: boolean;\n}\n\nexport const CloseButtonIcon: React.FunctionComponent<CloseButtonIconProps> = ({\n  side = DEFAULT_ICON_SIZE,\n  size = DEFAULT_ICON_SIZE,\n  color,\n  colorHover,\n  tabbable = true,\n  style,\n  ...rest\n}) => {\n  const globalObject = useGlobal();\n  const { cx } = useEmotion();\n  const styles = useStyles(getStyles);\n  const _theme = React.useContext(ThemeContext);\n  const theme = ThemeFactory.create(\n    {\n      closeBtnIconColor: color ?? _theme.closeBtnIconColor,\n      closeBtnIconHoverColor: colorHover ?? _theme.closeBtnIconHoverColor,\n    },\n    _theme,\n  );\n  const keyListener = useKeyListener();\n  const [focusedByTab, setFocusedByTab] = React.useState(false);\n\n  const handleFocus = () => {\n    // focus event fires before keyDown eventlistener\n    // so we should check tabPressed in async way\n    globalObject.requestAnimationFrame?.(() => {\n      if (keyListener.isTabPressed) {\n        setFocusedByTab(true);\n      }\n    });\n  };\n  const handleBlur = () => setFocusedByTab(false);\n\n  const tabIndex = !tabbable || rest.disabled ? -1 : 0;\n\n  return (\n    <CommonWrapper {...rest}>\n      <button\n        tabIndex={tabIndex}\n        className={cx(\n          styles.root(theme),\n          !rest.disabled && focusedByTab && styles.focus(theme),\n          rest.disabled && styles.rootDisabled(theme),\n        )}\n        style={{ ...style, width: side, height: side }}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        {...rest}\n      >\n        <span className={styles.wrapper()}>\n          <CrossIcon size={side < size ? side : size} focusable={tabIndex >= 0} />\n        </span>\n      </button>\n    </CommonWrapper>\n  );\n};\n\nCloseButtonIcon.__KONTUR_REACT_UI__ = 'CloseButtonIcon';\nCloseButtonIcon.displayName = 'CloseButtonIcon';\n"],"mappings":"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","ignoreList":[]}

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.styles.d.ts

@@ -1,5 +1,6 @@
+import type { Emotion } from '@emotion/css/types/create-instance';
 import type { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
+export declare const getStyles: (emotion: Emotion) => {
     root(t: Theme): string;
     rootDisabled(t: Theme): string;
     focus(t: Theme): string;

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.styles.js

@@ -1,36 +1,39 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
+
+var _Emotion = require("../../lib/theming/Emotion");
 
 var _Mixins = require("../../lib/styles/Mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
-var styles = exports.styles = (0, _Emotion.memoizeStyle)({
-  root: function root(t) {
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "\n      display: inline-block;\n      position: relative;\n      border-radius: ", ";\n      color: ", ";\n      cursor: pointer;\n      transition: color ", " ", ";\n\n      &:enabled:focus,\n      &:enabled:hover {\n        color: ", ";\n      }\n    "])),
-    (0, _Mixins.resetButton)(),
+var getStyles = exports.getStyles = function getStyles(emotion) {return (
+    (0, _Emotion.memoizeStyle)({
+      root: function root(t) {
+        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", "\n        display: inline-block;\n        position: relative;\n        border-radius: ", ";\n        color: ", ";\n        cursor: pointer;\n        transition: color ", " ", ";\n\n        &:enabled:focus,\n        &:enabled:hover {\n          color: ", ";\n        }\n      "])),
+        (0, _Mixins.resetButton)(),
 
 
-    t.closeBtnIconBorderRadius,
-    t.closeBtnIconColor,
+        t.closeBtnIconBorderRadius,
+        t.closeBtnIconColor,
 
-    t.transitionDuration, t.transitionTimingFunction,
+        t.transitionDuration, t.transitionTimingFunction,
 
 
 
-    t.closeBtnIconHoverColor);
+        t.closeBtnIconHoverColor);
 
 
-  },
-  rootDisabled: function rootDisabled(t) {
-    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n    "])),
-    t.closeBtnIconDisabledColor);
+      },
+      rootDisabled: function rootDisabled(t) {
+        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n        color: ", ";\n      "])),
+        t.closeBtnIconDisabledColor);
 
-  },
-  focus: function focus(t) {
-    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: ", ";\n    "])),
-    t.closeBtnIconFocusShadow);
+      },
+      focus: function focus(t) {
+        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n        box-shadow: ", ";\n      "])),
+        t.closeBtnIconFocusShadow);
 
-  },
-  wrapper: function wrapper() {
-    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-sizing: content-box;\n      display: flex;\n      width: 100%;\n      height: 100%;\n      align-items: center;\n      justify-content: center;\n      pointer-events: none;\n    "])));
+      },
+      wrapper: function wrapper() {
+        return emotion.css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n        box-sizing: content-box;\n        display: flex;\n        width: 100%;\n        height: 100%;\n        align-items: center;\n        justify-content: center;\n        pointer-events: none;\n      "])));
 
 
 
@@ -39,5 +42,5 @@ var styles = exports.styles = (0, _Emotion.memoizeStyle)({
 
 
 
-  }
-});
+      }
+    }));};

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Emotion","require","_Mixins","_templateObject","_templateObject2","_templateObject3","_templateObject4","styles","exports","memoizeStyle","root","t","css","_taggedTemplateLiteralLoose2","default","resetButton","closeBtnIconBorderRadius","closeBtnIconColor","transitionDuration","transitionTimingFunction","closeBtnIconHoverColor","rootDisabled","closeBtnIconDisabledColor","focus","closeBtnIconFocusShadow","wrapper"],"sources":["CloseButtonIcon.styles.tsx"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      ${resetButton()}\n      display: inline-block;\n      position: relative;\n      border-radius: ${t.closeBtnIconBorderRadius};\n      color: ${t.closeBtnIconColor};\n      cursor: pointer;\n      transition: color ${t.transitionDuration} ${t.transitionTimingFunction};\n\n      &:enabled:focus,\n      &:enabled:hover {\n        color: ${t.closeBtnIconHoverColor};\n      }\n    `;\n  },\n  rootDisabled(t: Theme) {\n    return css`\n      color: ${t.closeBtnIconDisabledColor};\n    `;\n  },\n  focus(t: Theme) {\n    return css`\n      box-shadow: ${t.closeBtnIconFocusShadow};\n    `;\n  },\n  wrapper() {\n    return css`\n      box-sizing: content-box;\n      display: flex;\n      width: 100%;\n      height: 100%;\n      align-items: center;\n      justify-content: center;\n      pointer-events: none;\n    `;\n  },\n});\n"],"mappings":"oRAAA,IAAAA,QAAA,GAAAC,OAAA;;AAEA,IAAAC,OAAA,GAAAD,OAAA,4BAAsD,IAAAE,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;AAE/C,IAAMC,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,IAAAE,qBAAY,EAAC;EACjCC,IAAI,WAAAA,KAACC,CAAQ,EAAE;IACb,WAAOC,YAAG,EAAAT,eAAA,KAAAA,eAAA,OAAAU,4BAAA,CAAAC,OAAA;IACN,IAAAC,mBAAW,EAAC,CAAC;;;IAGEJ,CAAC,CAACK,wBAAwB;IAClCL,CAAC,CAACM,iBAAiB;;IAERN,CAAC,CAACO,kBAAkB,EAAIP,CAAC,CAACQ,wBAAwB;;;;IAI3DR,CAAC,CAACS,sBAAsB;;;EAGvC,CAAC;EACDC,YAAY,WAAAA,aAACV,CAAQ,EAAE;IACrB,WAAOC,YAAG,EAAAR,gBAAA,KAAAA,gBAAA,OAAAS,4BAAA,CAAAC,OAAA;IACCH,CAAC,CAACW,yBAAyB;;EAExC,CAAC;EACDC,KAAK,WAAAA,MAACZ,CAAQ,EAAE;IACd,WAAOC,YAAG,EAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;IACMH,CAAC,CAACa,uBAAuB;;EAE3C,CAAC;EACDC,OAAO,WAAAA,QAAA,EAAG;IACR,WAAOb,YAAG,EAAAN,gBAAA,KAAAA,gBAAA,OAAAO,4BAAA,CAAAC,OAAA;;;;;;;;;EASZ;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_Emotion","require","_Mixins","_templateObject","_templateObject2","_templateObject3","_templateObject4","getStyles","exports","emotion","memoizeStyle","root","t","css","_taggedTemplateLiteralLoose2","default","resetButton","closeBtnIconBorderRadius","closeBtnIconColor","transitionDuration","transitionTimingFunction","closeBtnIconHoverColor","rootDisabled","closeBtnIconDisabledColor","focus","closeBtnIconFocusShadow","wrapper"],"sources":["CloseButtonIcon.styles.tsx"],"sourcesContent":["import type { Emotion } from '@emotion/css/types/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    root(t: Theme) {\n      return emotion.css`\n        ${resetButton()}\n        display: inline-block;\n        position: relative;\n        border-radius: ${t.closeBtnIconBorderRadius};\n        color: ${t.closeBtnIconColor};\n        cursor: pointer;\n        transition: color ${t.transitionDuration} ${t.transitionTimingFunction};\n\n        &:enabled:focus,\n        &:enabled:hover {\n          color: ${t.closeBtnIconHoverColor};\n        }\n      `;\n    },\n    rootDisabled(t: Theme) {\n      return emotion.css`\n        color: ${t.closeBtnIconDisabledColor};\n      `;\n    },\n    focus(t: Theme) {\n      return emotion.css`\n        box-shadow: ${t.closeBtnIconFocusShadow};\n      `;\n    },\n    wrapper() {\n      return emotion.css`\n        box-sizing: content-box;\n        display: flex;\n        width: 100%;\n        height: 100%;\n        align-items: center;\n        justify-content: center;\n        pointer-events: none;\n      `;\n    },\n  });\n"],"mappings":";;AAEA,IAAAA,QAAA,GAAAC,OAAA;;AAEA,IAAAC,OAAA,GAAAD,OAAA,4BAAsD,IAAAE,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;AAE/C,IAAMC,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,SAAZA,SAASA,CAAIE,OAAgB;IACxC,IAAAC,qBAAY,EAAC;MACXC,IAAI,WAAAA,KAACC,CAAQ,EAAE;QACb,OAAOH,OAAO,CAACI,GAAG,CAAAV,eAAA,KAAAA,eAAA,OAAAW,4BAAA,CAAAC,OAAA;QACd,IAAAC,mBAAW,EAAC,CAAC;;;QAGEJ,CAAC,CAACK,wBAAwB;QAClCL,CAAC,CAACM,iBAAiB;;QAERN,CAAC,CAACO,kBAAkB,EAAIP,CAAC,CAACQ,wBAAwB;;;;QAI3DR,CAAC,CAACS,sBAAsB;;;MAGvC,CAAC;MACDC,YAAY,WAAAA,aAACV,CAAQ,EAAE;QACrB,OAAOH,OAAO,CAACI,GAAG,CAAAT,gBAAA,KAAAA,gBAAA,OAAAU,4BAAA,CAAAC,OAAA;QACPH,CAAC,CAACW,yBAAyB;;MAExC,CAAC;MACDC,KAAK,WAAAA,MAACZ,CAAQ,EAAE;QACd,OAAOH,OAAO,CAACI,GAAG,CAAAR,gBAAA,KAAAA,gBAAA,OAAAS,4BAAA,CAAAC,OAAA;QACFH,CAAC,CAACa,uBAAuB;;MAE3C,CAAC;MACDC,OAAO,WAAAA,QAAA,EAAG;QACR,OAAOjB,OAAO,CAACI,GAAG,CAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;;;;;;;;;MASpB;IACF,CAAC,CAAC","ignoreList":[]}