@foxford/ui 2.75.0 → 2.76.0-beta-7e5a1c1-20250711

package/components/Accordion/Accordion.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var accordion=require('../../shared/context/accordion.js');var constants=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var AccordionDivider=require('./AccordionDivider.js');var hooks=require('./hooks.js');var sizes=require('./sizes.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var AccordionItem=require('../AccordionItem/AccordionItem.js');const Accordion=Object.assign(withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const{size:o="m",sizeXXS:i,sizeXS:s,sizeS:t,sizeM:n,sizeL:d,sizeXL:a,children:c,multiple:l,collapsible:u,expanded:m,palette:v,loading:y,disabled:p,embedded:A,defaultExpanded:h,borderRadius:j,primary:x,secondary:z,onExpandedChange:b,...f}=e;const g={size:o,sizeXXS:i,sizeXS:s,sizeS:t,sizeM:n,sizeL:d,sizeXL:a};const k=hooks.useAccordion({expanded:m,defaultExpanded:h,multiple:l,collapsible:u,onExpandedChange:b});const q={...g,palette:v,loading:y,disabled:p,embedded:A,borderRadius:j,primary:x,secondary:z};return jsxRuntime.jsx(style.Root,{...f,...g,ref:r,onKeyDown:e=>{if(f.onKeyDown&&f.onKeyDown(e),!(document.activeElement instanceof HTMLElement)||document.activeElement.dataset.accordionControl!=='true')return;const r=Array.from(e.currentTarget.querySelectorAll('[data-accordion-control]'));r.length!==0&&(constants.keyboardKeys.Home.validate(e.key)?(e.preventDefault(),dom.focusFirstFocusable(r[0])):constants.keyboardKeys.End.validate(e.key)?(e.preventDefault(),dom.focusFirstFocusable(r[r.length-1])):(constants.keyboardKeys.ArrowUp.validate(e.key)||constants.keyboardKeys.ArrowDown.validate(e.key))&&(e.preventDefault(),dom.navigateFocusableList(e.key,document.activeElement,r)))},children:jsxRuntime.jsx(accordion.AccordionPanelsContext.Provider,{value:k,children:jsxRuntime.jsx(accordion.AccordionPropsContext.Provider,{value:q,children:c})})})})),{displayName:'Accordion',sizes:sizes.SIZES}),{Item:AccordionItem.AccordionItem,Divider:AccordionDivider.AccordionDivider});exports.Accordion=Accordion;
+'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var accordion=require('../../shared/context/accordion.js');var constants=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var hooks=require('./hooks.js');var sizes=require('./sizes.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var AccordionItem=require('../AccordionItem/AccordionItem.js');var Divider=require('../Divider/Divider.js');const Accordion=Object.assign(withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const{size:o="m",sizeXXS:i,sizeXS:s,sizeS:t,sizeM:n,sizeL:a,sizeXL:d,children:c,multiple:l,collapsible:u,expanded:v,palette:m,loading:y,disabled:p,embedded:h,defaultExpanded:j,borderRadius:x,primary:z,secondary:A,onExpandedChange:b,...f}=e;const g={size:o,sizeXXS:i,sizeXS:s,sizeS:t,sizeM:n,sizeL:a,sizeXL:d};const D=hooks.useAccordion({expanded:v,defaultExpanded:j,multiple:l,collapsible:u,onExpandedChange:b});const k={...g,palette:m,loading:y,disabled:p,embedded:h,borderRadius:x,primary:z,secondary:A};return jsxRuntime.jsx(style.Root,{...f,...g,ref:r,onKeyDown:e=>{if(f.onKeyDown&&f.onKeyDown(e),!(document.activeElement instanceof HTMLElement)||document.activeElement.dataset.accordionControl!=='true')return;const r=Array.from(e.currentTarget.querySelectorAll('[data-accordion-control="true"]'));r.length!==0&&(constants.keyboardKeys.Home.validate(e.key)?(e.preventDefault(),r[0].focus()):constants.keyboardKeys.End.validate(e.key)?(e.preventDefault(),r[r.length-1].focus()):(constants.keyboardKeys.ArrowUp.validate(e.key)||constants.keyboardKeys.ArrowDown.validate(e.key))&&(e.preventDefault(),dom.navigateVerticalList(e.key,document.activeElement,r)))},children:jsxRuntime.jsx(accordion.AccordionPanelsContext.Provider,{value:D,children:jsxRuntime.jsx(accordion.AccordionPropsContext.Provider,{value:k,children:c})})})})),{displayName:'Accordion',sizes:sizes.SIZES}),{Item:AccordionItem.AccordionItem,Divider:Divider.Divider});exports.Accordion=Accordion;
 //# sourceMappingURL=Accordion.js.map

package/components/Accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { AccordionPanelsContext, AccordionPropsContext } from 'shared/context/accordion'\nimport { keyboardKeys } from 'shared/constants'\nimport { focusFirstFocusable, navigateFocusableList } from 'shared/utils/dom'\nimport { AccordionItem } from 'components/AccordionItem'\nimport { AccordionDivider } from './AccordionDivider'\nimport { useAccordion } from './hooks'\nimport { SIZES } from './sizes'\nimport type { AccordionProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Accordion'\n\n/**\n *\n * Компонент для создания вертикального стека сворачиваемых секций контента.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n *\n * Дизайн соответствует [рекомендациям WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/accordion/).\n */\nconst Accordion: React.ForwardRefExoticComponent<AccordionProps> & {\n  Item: typeof AccordionItem\n  Divider: typeof AccordionDivider\n} = Object.assign(\n  withMergedProps<AccordionProps, HTMLDivElement>(\n    forwardRef((props, ref) => {\n      const {\n        size = 'm',\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n        children,\n        multiple,\n        collapsible,\n        expanded,\n        palette,\n        loading,\n        disabled,\n        embedded,\n        defaultExpanded,\n        borderRadius,\n        primary,\n        secondary,\n        onExpandedChange,\n        ...restProps\n      } = props\n\n      const sizeProps = {\n        size,\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n      }\n\n      const panels = useAccordion({\n        expanded,\n        defaultExpanded,\n        multiple,\n        collapsible,\n        onExpandedChange,\n      })\n\n      const panelsContextProps = {\n        ...sizeProps,\n        palette,\n        loading,\n        disabled,\n        embedded,\n        borderRadius,\n        primary,\n        secondary,\n      }\n\n      return (\n        <Styled.Root\n          {...restProps}\n          {...sizeProps}\n          ref={ref}\n          onKeyDown={(evt) => {\n            if (restProps.onKeyDown) {\n              restProps.onKeyDown(evt)\n            }\n\n            if (\n              !(document.activeElement instanceof HTMLElement) ||\n              document.activeElement.dataset.accordionControl !== 'true'\n            ) {\n              return\n            }\n\n            const controls = Array.from(evt.currentTarget.querySelectorAll<HTMLElement>('[data-accordion-control]'))\n\n            if (controls.length === 0) return\n\n            if (keyboardKeys.Home.validate(evt.key)) {\n              evt.preventDefault()\n              focusFirstFocusable(controls[0])\n            } else if (keyboardKeys.End.validate(evt.key)) {\n              evt.preventDefault()\n              focusFirstFocusable(controls[controls.length - 1])\n            } else if (keyboardKeys.ArrowUp.validate(evt.key) || keyboardKeys.ArrowDown.validate(evt.key)) {\n              evt.preventDefault()\n              navigateFocusableList(evt.key, document.activeElement, controls)\n            }\n          }}\n        >\n          <AccordionPanelsContext.Provider value={panels}>\n            <AccordionPropsContext.Provider value={panelsContextProps}>{children}</AccordionPropsContext.Provider>\n          </AccordionPanelsContext.Provider>\n        </Styled.Root>\n      )\n    }),\n    {\n      displayName: COMPONENT_NAME,\n      sizes: SIZES,\n    }\n  ),\n  {\n    Item: AccordionItem,\n    Divider: AccordionDivider,\n  }\n)\n\nexport { Accordion }\n"],"names":["Accordion","Object","assign","withMergedProps","forwardRef","props","ref","size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","children","multiple","collapsible","expanded","palette","loading","disabled","embedded","defaultExpanded","borderRadius","primary","secondary","onExpandedChange","restProps","sizeProps","panels","useAccordion","panelsContextProps","_jsx","Styled","onKeyDown","evt","document","activeElement","HTMLElement","dataset","accordionControl","controls","Array","from","currentTarget","querySelectorAll","length","keyboardKeys","Home","validate","key","preventDefault","focusFirstFocusable","End","ArrowUp","ArrowDown","navigateFocusableList","AccordionPanelsContext","Provider","value","AccordionPropsContext","displayName","sizes","SIZES","Item","AccordionItem","Divider","AccordionDivider"],"mappings":"igBAsBA,MAAMA,UAGFC,OAAOC,OACTC,gBAAAA,gBACEC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,QACVA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,SACNA,EAAQC,SACRA,EAAQC,YACRA,EAAWC,SACXA,EAAQC,QACRA,EAAOC,QACPA,EAAOC,SACPA,EAAQC,SACRA,EAAQC,gBACRA,EAAeC,aACfA,EAAYC,QACZA,EAAOC,UACPA,EAASC,iBACTA,KACGC,GACDtB,EAEJ,MAAMuB,EAAY,CAChBrB,OACAC,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMgB,EAASC,MAAAA,aAAa,CAC1Bb,WACAK,kBACAP,WACAC,cACAU,qBAGF,MAAMK,EAAqB,IACtBH,EACHV,UACAC,UACAC,WACAC,WACAE,eACAC,UACAC,aAGF,OACEO,WAAAA,IAACC,MAAAA,KAAW,IACNN,KACAC,EACJtB,IAAKA,EACL4B,UAAYC,IAKV,GAJIR,EAAUO,WACZP,EAAUO,UAAUC,KAIlBC,SAASC,yBAAyBC,cACpCF,SAASC,cAAcE,QAAQC,mBAAqB,OAEpD,OAGF,MAAMC,EAAWC,MAAMC,KAAKR,EAAIS,cAAcC,iBAA8B,6BAExEJ,EAASK,SAAW,IAEpBC,UAAYA,aAACC,KAAKC,SAASd,EAAIe,MACjCf,EAAIgB,iBACJC,wBAAoBX,EAAS,KACpBM,UAAYA,aAACM,IAAIJ,SAASd,EAAIe,MACvCf,EAAIgB,iBACJC,IAAAA,oBAAoBX,EAASA,EAASK,OAAS,MACtCC,UAAYA,aAACO,QAAQL,SAASd,EAAIe,MAAQH,UAAAA,aAAaQ,UAAUN,SAASd,EAAIe,QACvFf,EAAIgB,iBACJK,IAAqBA,sBAACrB,EAAIe,IAAKd,SAASC,cAAeI,IACzD,EACA3B,SAEFkB,WAAAA,IAACyB,UAAsBA,uBAACC,SAAQ,CAACC,MAAO9B,EAAOf,SAC7CkB,WAAAA,IAAC4B,UAAqBA,sBAACF,SAAQ,CAACC,MAAO5B,EAAmBjB,SAAEA,OAElD,IAGlB,CACE+C,YA7GiB,YA8GjBC,MAAOC,MAAAA,QAGX,CACEC,KAAMC,cAAaA,cACnBC,QAASC,iBAAAA"}
+{"version":3,"file":"Accordion.js","sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { AccordionPanelsContext, AccordionPropsContext } from 'shared/context/accordion'\nimport { keyboardKeys } from 'shared/constants'\nimport { navigateVerticalList } from 'shared/utils/dom'\nimport { AccordionItem } from 'components/AccordionItem'\nimport { Divider } from 'components/Divider'\nimport { useAccordion } from './hooks'\nimport { SIZES } from './sizes'\nimport type { AccordionProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Accordion'\n\n/**\n *\n * Компонент для создания вертикального стека сворачиваемых секций контента.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n *\n * Дизайн соответствует [рекомендациям WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/accordion/).\n */\nconst Accordion: React.ForwardRefExoticComponent<AccordionProps> & {\n  Item: typeof AccordionItem\n  Divider: typeof Divider\n} = Object.assign(\n  withMergedProps<AccordionProps, HTMLDivElement>(\n    forwardRef((props, ref) => {\n      const {\n        size = 'm',\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n        children,\n        multiple,\n        collapsible,\n        expanded,\n        palette,\n        loading,\n        disabled,\n        embedded,\n        defaultExpanded,\n        borderRadius,\n        primary,\n        secondary,\n        onExpandedChange,\n        ...restProps\n      } = props\n\n      const sizeProps = {\n        size,\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n      }\n\n      const panels = useAccordion({\n        expanded,\n        defaultExpanded,\n        multiple,\n        collapsible,\n        onExpandedChange,\n      })\n\n      const panelsContextProps = {\n        ...sizeProps,\n        palette,\n        loading,\n        disabled,\n        embedded,\n        borderRadius,\n        primary,\n        secondary,\n      }\n\n      return (\n        <Styled.Root\n          {...restProps}\n          {...sizeProps}\n          ref={ref}\n          onKeyDown={(evt) => {\n            if (restProps.onKeyDown) {\n              restProps.onKeyDown(evt)\n            }\n\n            if (\n              !(document.activeElement instanceof HTMLElement) ||\n              document.activeElement.dataset.accordionControl !== 'true'\n            ) {\n              return\n            }\n\n            const controls = Array.from(\n              evt.currentTarget.querySelectorAll<HTMLElement>('[data-accordion-control=\"true\"]')\n            )\n\n            if (controls.length === 0) return\n\n            if (keyboardKeys.Home.validate(evt.key)) {\n              evt.preventDefault()\n              controls[0].focus()\n            } else if (keyboardKeys.End.validate(evt.key)) {\n              evt.preventDefault()\n              controls[controls.length - 1].focus()\n            } else if (keyboardKeys.ArrowUp.validate(evt.key) || keyboardKeys.ArrowDown.validate(evt.key)) {\n              evt.preventDefault()\n              navigateVerticalList(evt.key, document.activeElement, controls)\n            }\n          }}\n        >\n          <AccordionPanelsContext.Provider value={panels}>\n            <AccordionPropsContext.Provider value={panelsContextProps}>{children}</AccordionPropsContext.Provider>\n          </AccordionPanelsContext.Provider>\n        </Styled.Root>\n      )\n    }),\n    {\n      displayName: COMPONENT_NAME,\n      sizes: SIZES,\n    }\n  ),\n  {\n    Item: AccordionItem,\n    Divider,\n  }\n)\n\nexport { Accordion }\n"],"names":["Accordion","Object","assign","withMergedProps","forwardRef","props","ref","size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","children","multiple","collapsible","expanded","palette","loading","disabled","embedded","defaultExpanded","borderRadius","primary","secondary","onExpandedChange","restProps","sizeProps","panels","useAccordion","panelsContextProps","_jsx","Styled","onKeyDown","evt","document","activeElement","HTMLElement","dataset","accordionControl","controls","Array","from","currentTarget","querySelectorAll","length","keyboardKeys","Home","validate","key","preventDefault","focus","End","ArrowUp","ArrowDown","navigateVerticalList","AccordionPanelsContext","Provider","value","AccordionPropsContext","displayName","sizes","SIZES","Item","AccordionItem","Divider"],"mappings":"wfAsBA,MAAMA,UAGFC,OAAOC,OACTC,gBAAAA,gBACEC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,QACVA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,SACNA,EAAQC,SACRA,EAAQC,YACRA,EAAWC,SACXA,EAAQC,QACRA,EAAOC,QACPA,EAAOC,SACPA,EAAQC,SACRA,EAAQC,gBACRA,EAAeC,aACfA,EAAYC,QACZA,EAAOC,UACPA,EAASC,iBACTA,KACGC,GACDtB,EAEJ,MAAMuB,EAAY,CAChBrB,OACAC,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMgB,EAASC,MAAAA,aAAa,CAC1Bb,WACAK,kBACAP,WACAC,cACAU,qBAGF,MAAMK,EAAqB,IACtBH,EACHV,UACAC,UACAC,WACAC,WACAE,eACAC,UACAC,aAGF,OACEO,WAAAA,IAACC,MAAAA,KAAW,IACNN,KACAC,EACJtB,IAAKA,EACL4B,UAAYC,IAKV,GAJIR,EAAUO,WACZP,EAAUO,UAAUC,KAIlBC,SAASC,yBAAyBC,cACpCF,SAASC,cAAcE,QAAQC,mBAAqB,OAEpD,OAGF,MAAMC,EAAWC,MAAMC,KACrBR,EAAIS,cAAcC,iBAA8B,oCAG9CJ,EAASK,SAAW,IAEpBC,UAAYA,aAACC,KAAKC,SAASd,EAAIe,MACjCf,EAAIgB,iBACJV,EAAS,GAAGW,SACHL,UAAYA,aAACM,IAAIJ,SAASd,EAAIe,MACvCf,EAAIgB,iBACJV,EAASA,EAASK,OAAS,GAAGM,UACrBL,UAAYA,aAACO,QAAQL,SAASd,EAAIe,MAAQH,UAAAA,aAAaQ,UAAUN,SAASd,EAAIe,QACvFf,EAAIgB,iBACJK,IAAoBA,qBAACrB,EAAIe,IAAKd,SAASC,cAAeI,IACxD,EACA3B,SAEFkB,WAAAA,IAACyB,UAAsBA,uBAACC,SAAQ,CAACC,MAAO9B,EAAOf,SAC7CkB,WAAAA,IAAC4B,UAAqBA,sBAACF,SAAQ,CAACC,MAAO5B,EAAmBjB,SAAEA,OAElD,IAGlB,CACE+C,YA/GiB,YAgHjBC,MAAOC,MAAAA,QAGX,CACEC,KAAMC,cAAaA,cACnBC,QAAAA,QAAAA"}

package/components/Accordion/Accordion.mjs

@@ -1,2 +1,2 @@
-import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{AccordionPanelsContext,AccordionPropsContext}from'../../shared/context/accordion.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{focusFirstFocusable,navigateFocusableList}from'../../shared/utils/dom.mjs';import{AccordionDivider}from'./AccordionDivider.mjs';import{useAccordion}from'./hooks.mjs';import{SIZES}from'./sizes.mjs';import{Root}from'./style.mjs';import{jsx}from'react/jsx-runtime';import{AccordionItem}from'../AccordionItem/AccordionItem.mjs';const Accordion=Object.assign(withMergedProps(forwardRef(((e,o)=>{const{size:r="m",sizeXXS:i,sizeXS:t,sizeS:s,sizeM:d,sizeL:n,sizeXL:a,children:c,multiple:m,collapsible:l,expanded:p,palette:u,loading:f,disabled:y,embedded:v,defaultExpanded:A,borderRadius:b,primary:x,secondary:h,onExpandedChange:z,...j}=e;const g={size:r,sizeXXS:i,sizeXS:t,sizeS:s,sizeM:d,sizeL:n,sizeXL:a};const k=useAccordion({expanded:p,defaultExpanded:A,multiple:m,collapsible:l,onExpandedChange:z});const w={...g,palette:u,loading:f,disabled:y,embedded:v,borderRadius:b,primary:x,secondary:h};return jsx(Root,{...j,...g,ref:o,onKeyDown:e=>{if(j.onKeyDown&&j.onKeyDown(e),!(document.activeElement instanceof HTMLElement)||document.activeElement.dataset.accordionControl!=='true')return;const o=Array.from(e.currentTarget.querySelectorAll('[data-accordion-control]'));o.length!==0&&(keyboardKeys.Home.validate(e.key)?(e.preventDefault(),focusFirstFocusable(o[0])):keyboardKeys.End.validate(e.key)?(e.preventDefault(),focusFirstFocusable(o[o.length-1])):(keyboardKeys.ArrowUp.validate(e.key)||keyboardKeys.ArrowDown.validate(e.key))&&(e.preventDefault(),navigateFocusableList(e.key,document.activeElement,o)))},children:jsx(AccordionPanelsContext.Provider,{value:k,children:jsx(AccordionPropsContext.Provider,{value:w,children:c})})})})),{displayName:'Accordion',sizes:SIZES}),{Item:AccordionItem,Divider:AccordionDivider});export{Accordion};
+import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{AccordionPanelsContext,AccordionPropsContext}from'../../shared/context/accordion.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{navigateVerticalList}from'../../shared/utils/dom.mjs';import{useAccordion}from'./hooks.mjs';import{SIZES}from'./sizes.mjs';import{Root}from'./style.mjs';import{jsx}from'react/jsx-runtime';import{AccordionItem}from'../AccordionItem/AccordionItem.mjs';import{Divider}from'../Divider/Divider.mjs';const Accordion=Object.assign(withMergedProps(forwardRef(((e,o)=>{const{size:r="m",sizeXXS:t,sizeXS:i,sizeS:d,sizeM:n,sizeL:s,sizeXL:a,children:c,multiple:m,collapsible:l,expanded:p,palette:f,loading:u,disabled:y,embedded:v,defaultExpanded:x,borderRadius:A,primary:h,secondary:z,onExpandedChange:j,...b}=e;const g={size:r,sizeXXS:t,sizeXS:i,sizeS:d,sizeM:n,sizeL:s,sizeXL:a};const D=useAccordion({expanded:p,defaultExpanded:x,multiple:m,collapsible:l,onExpandedChange:j});const k={...g,palette:f,loading:u,disabled:y,embedded:v,borderRadius:A,primary:h,secondary:z};return jsx(Root,{...b,...g,ref:o,onKeyDown:e=>{if(b.onKeyDown&&b.onKeyDown(e),!(document.activeElement instanceof HTMLElement)||document.activeElement.dataset.accordionControl!=='true')return;const o=Array.from(e.currentTarget.querySelectorAll('[data-accordion-control="true"]'));o.length!==0&&(keyboardKeys.Home.validate(e.key)?(e.preventDefault(),o[0].focus()):keyboardKeys.End.validate(e.key)?(e.preventDefault(),o[o.length-1].focus()):(keyboardKeys.ArrowUp.validate(e.key)||keyboardKeys.ArrowDown.validate(e.key))&&(e.preventDefault(),navigateVerticalList(e.key,document.activeElement,o)))},children:jsx(AccordionPanelsContext.Provider,{value:D,children:jsx(AccordionPropsContext.Provider,{value:k,children:c})})})})),{displayName:'Accordion',sizes:SIZES}),{Item:AccordionItem,Divider});export{Accordion};
 //# sourceMappingURL=Accordion.mjs.map

package/components/Accordion/Accordion.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.mjs","sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { AccordionPanelsContext, AccordionPropsContext } from 'shared/context/accordion'\nimport { keyboardKeys } from 'shared/constants'\nimport { focusFirstFocusable, navigateFocusableList } from 'shared/utils/dom'\nimport { AccordionItem } from 'components/AccordionItem'\nimport { AccordionDivider } from './AccordionDivider'\nimport { useAccordion } from './hooks'\nimport { SIZES } from './sizes'\nimport type { AccordionProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Accordion'\n\n/**\n *\n * Компонент для создания вертикального стека сворачиваемых секций контента.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n *\n * Дизайн соответствует [рекомендациям WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/accordion/).\n */\nconst Accordion: React.ForwardRefExoticComponent<AccordionProps> & {\n  Item: typeof AccordionItem\n  Divider: typeof AccordionDivider\n} = Object.assign(\n  withMergedProps<AccordionProps, HTMLDivElement>(\n    forwardRef((props, ref) => {\n      const {\n        size = 'm',\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n        children,\n        multiple,\n        collapsible,\n        expanded,\n        palette,\n        loading,\n        disabled,\n        embedded,\n        defaultExpanded,\n        borderRadius,\n        primary,\n        secondary,\n        onExpandedChange,\n        ...restProps\n      } = props\n\n      const sizeProps = {\n        size,\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n      }\n\n      const panels = useAccordion({\n        expanded,\n        defaultExpanded,\n        multiple,\n        collapsible,\n        onExpandedChange,\n      })\n\n      const panelsContextProps = {\n        ...sizeProps,\n        palette,\n        loading,\n        disabled,\n        embedded,\n        borderRadius,\n        primary,\n        secondary,\n      }\n\n      return (\n        <Styled.Root\n          {...restProps}\n          {...sizeProps}\n          ref={ref}\n          onKeyDown={(evt) => {\n            if (restProps.onKeyDown) {\n              restProps.onKeyDown(evt)\n            }\n\n            if (\n              !(document.activeElement instanceof HTMLElement) ||\n              document.activeElement.dataset.accordionControl !== 'true'\n            ) {\n              return\n            }\n\n            const controls = Array.from(evt.currentTarget.querySelectorAll<HTMLElement>('[data-accordion-control]'))\n\n            if (controls.length === 0) return\n\n            if (keyboardKeys.Home.validate(evt.key)) {\n              evt.preventDefault()\n              focusFirstFocusable(controls[0])\n            } else if (keyboardKeys.End.validate(evt.key)) {\n              evt.preventDefault()\n              focusFirstFocusable(controls[controls.length - 1])\n            } else if (keyboardKeys.ArrowUp.validate(evt.key) || keyboardKeys.ArrowDown.validate(evt.key)) {\n              evt.preventDefault()\n              navigateFocusableList(evt.key, document.activeElement, controls)\n            }\n          }}\n        >\n          <AccordionPanelsContext.Provider value={panels}>\n            <AccordionPropsContext.Provider value={panelsContextProps}>{children}</AccordionPropsContext.Provider>\n          </AccordionPanelsContext.Provider>\n        </Styled.Root>\n      )\n    }),\n    {\n      displayName: COMPONENT_NAME,\n      sizes: SIZES,\n    }\n  ),\n  {\n    Item: AccordionItem,\n    Divider: AccordionDivider,\n  }\n)\n\nexport { Accordion }\n"],"names":["Accordion","Object","assign","withMergedProps","forwardRef","props","ref","size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","children","multiple","collapsible","expanded","palette","loading","disabled","embedded","defaultExpanded","borderRadius","primary","secondary","onExpandedChange","restProps","sizeProps","panels","useAccordion","panelsContextProps","_jsx","Styled","onKeyDown","evt","document","activeElement","HTMLElement","dataset","accordionControl","controls","Array","from","currentTarget","querySelectorAll","length","keyboardKeys","Home","validate","key","preventDefault","focusFirstFocusable","End","ArrowUp","ArrowDown","navigateFocusableList","AccordionPanelsContext","Provider","value","AccordionPropsContext","displayName","sizes","SIZES","Item","AccordionItem","Divider","AccordionDivider"],"mappings":"ujBAsBA,MAAMA,UAGFC,OAAOC,OACTC,gBACEC,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,QACVA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,SACNA,EAAQC,SACRA,EAAQC,YACRA,EAAWC,SACXA,EAAQC,QACRA,EAAOC,QACPA,EAAOC,SACPA,EAAQC,SACRA,EAAQC,gBACRA,EAAeC,aACfA,EAAYC,QACZA,EAAOC,UACPA,EAASC,iBACTA,KACGC,GACDtB,EAEJ,MAAMuB,EAAY,CAChBrB,OACAC,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMgB,EAASC,aAAa,CAC1Bb,WACAK,kBACAP,WACAC,cACAU,qBAGF,MAAMK,EAAqB,IACtBH,EACHV,UACAC,UACAC,WACAC,WACAE,eACAC,UACAC,aAGF,OACEO,IAACC,KAAW,IACNN,KACAC,EACJtB,IAAKA,EACL4B,UAAYC,IAKV,GAJIR,EAAUO,WACZP,EAAUO,UAAUC,KAIlBC,SAASC,yBAAyBC,cACpCF,SAASC,cAAcE,QAAQC,mBAAqB,OAEpD,OAGF,MAAMC,EAAWC,MAAMC,KAAKR,EAAIS,cAAcC,iBAA8B,6BAExEJ,EAASK,SAAW,IAEpBC,aAAaC,KAAKC,SAASd,EAAIe,MACjCf,EAAIgB,iBACJC,oBAAoBX,EAAS,KACpBM,aAAaM,IAAIJ,SAASd,EAAIe,MACvCf,EAAIgB,iBACJC,oBAAoBX,EAASA,EAASK,OAAS,MACtCC,aAAaO,QAAQL,SAASd,EAAIe,MAAQH,aAAaQ,UAAUN,SAASd,EAAIe,QACvFf,EAAIgB,iBACJK,sBAAsBrB,EAAIe,IAAKd,SAASC,cAAeI,IACzD,EACA3B,SAEFkB,IAACyB,uBAAuBC,SAAQ,CAACC,MAAO9B,EAAOf,SAC7CkB,IAAC4B,sBAAsBF,SAAQ,CAACC,MAAO5B,EAAmBjB,SAAEA,OAElD,IAGlB,CACE+C,YA7GiB,YA8GjBC,MAAOC,QAGX,CACEC,KAAMC,cACNC,QAASC"}
+{"version":3,"file":"Accordion.mjs","sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { AccordionPanelsContext, AccordionPropsContext } from 'shared/context/accordion'\nimport { keyboardKeys } from 'shared/constants'\nimport { navigateVerticalList } from 'shared/utils/dom'\nimport { AccordionItem } from 'components/AccordionItem'\nimport { Divider } from 'components/Divider'\nimport { useAccordion } from './hooks'\nimport { SIZES } from './sizes'\nimport type { AccordionProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Accordion'\n\n/**\n *\n * Компонент для создания вертикального стека сворачиваемых секций контента.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n *\n * Дизайн соответствует [рекомендациям WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/accordion/).\n */\nconst Accordion: React.ForwardRefExoticComponent<AccordionProps> & {\n  Item: typeof AccordionItem\n  Divider: typeof Divider\n} = Object.assign(\n  withMergedProps<AccordionProps, HTMLDivElement>(\n    forwardRef((props, ref) => {\n      const {\n        size = 'm',\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n        children,\n        multiple,\n        collapsible,\n        expanded,\n        palette,\n        loading,\n        disabled,\n        embedded,\n        defaultExpanded,\n        borderRadius,\n        primary,\n        secondary,\n        onExpandedChange,\n        ...restProps\n      } = props\n\n      const sizeProps = {\n        size,\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n      }\n\n      const panels = useAccordion({\n        expanded,\n        defaultExpanded,\n        multiple,\n        collapsible,\n        onExpandedChange,\n      })\n\n      const panelsContextProps = {\n        ...sizeProps,\n        palette,\n        loading,\n        disabled,\n        embedded,\n        borderRadius,\n        primary,\n        secondary,\n      }\n\n      return (\n        <Styled.Root\n          {...restProps}\n          {...sizeProps}\n          ref={ref}\n          onKeyDown={(evt) => {\n            if (restProps.onKeyDown) {\n              restProps.onKeyDown(evt)\n            }\n\n            if (\n              !(document.activeElement instanceof HTMLElement) ||\n              document.activeElement.dataset.accordionControl !== 'true'\n            ) {\n              return\n            }\n\n            const controls = Array.from(\n              evt.currentTarget.querySelectorAll<HTMLElement>('[data-accordion-control=\"true\"]')\n            )\n\n            if (controls.length === 0) return\n\n            if (keyboardKeys.Home.validate(evt.key)) {\n              evt.preventDefault()\n              controls[0].focus()\n            } else if (keyboardKeys.End.validate(evt.key)) {\n              evt.preventDefault()\n              controls[controls.length - 1].focus()\n            } else if (keyboardKeys.ArrowUp.validate(evt.key) || keyboardKeys.ArrowDown.validate(evt.key)) {\n              evt.preventDefault()\n              navigateVerticalList(evt.key, document.activeElement, controls)\n            }\n          }}\n        >\n          <AccordionPanelsContext.Provider value={panels}>\n            <AccordionPropsContext.Provider value={panelsContextProps}>{children}</AccordionPropsContext.Provider>\n          </AccordionPanelsContext.Provider>\n        </Styled.Root>\n      )\n    }),\n    {\n      displayName: COMPONENT_NAME,\n      sizes: SIZES,\n    }\n  ),\n  {\n    Item: AccordionItem,\n    Divider,\n  }\n)\n\nexport { Accordion }\n"],"names":["Accordion","Object","assign","withMergedProps","forwardRef","props","ref","size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","children","multiple","collapsible","expanded","palette","loading","disabled","embedded","defaultExpanded","borderRadius","primary","secondary","onExpandedChange","restProps","sizeProps","panels","useAccordion","panelsContextProps","_jsx","Styled","onKeyDown","evt","document","activeElement","HTMLElement","dataset","accordionControl","controls","Array","from","currentTarget","querySelectorAll","length","keyboardKeys","Home","validate","key","preventDefault","focus","End","ArrowUp","ArrowDown","navigateVerticalList","AccordionPanelsContext","Provider","value","AccordionPropsContext","displayName","sizes","SIZES","Item","AccordionItem","Divider"],"mappings":"yhBAsBA,MAAMA,UAGFC,OAAOC,OACTC,gBACEC,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,QACVA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,SACNA,EAAQC,SACRA,EAAQC,YACRA,EAAWC,SACXA,EAAQC,QACRA,EAAOC,QACPA,EAAOC,SACPA,EAAQC,SACRA,EAAQC,gBACRA,EAAeC,aACfA,EAAYC,QACZA,EAAOC,UACPA,EAASC,iBACTA,KACGC,GACDtB,EAEJ,MAAMuB,EAAY,CAChBrB,OACAC,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMgB,EAASC,aAAa,CAC1Bb,WACAK,kBACAP,WACAC,cACAU,qBAGF,MAAMK,EAAqB,IACtBH,EACHV,UACAC,UACAC,WACAC,WACAE,eACAC,UACAC,aAGF,OACEO,IAACC,KAAW,IACNN,KACAC,EACJtB,IAAKA,EACL4B,UAAYC,IAKV,GAJIR,EAAUO,WACZP,EAAUO,UAAUC,KAIlBC,SAASC,yBAAyBC,cACpCF,SAASC,cAAcE,QAAQC,mBAAqB,OAEpD,OAGF,MAAMC,EAAWC,MAAMC,KACrBR,EAAIS,cAAcC,iBAA8B,oCAG9CJ,EAASK,SAAW,IAEpBC,aAAaC,KAAKC,SAASd,EAAIe,MACjCf,EAAIgB,iBACJV,EAAS,GAAGW,SACHL,aAAaM,IAAIJ,SAASd,EAAIe,MACvCf,EAAIgB,iBACJV,EAASA,EAASK,OAAS,GAAGM,UACrBL,aAAaO,QAAQL,SAASd,EAAIe,MAAQH,aAAaQ,UAAUN,SAASd,EAAIe,QACvFf,EAAIgB,iBACJK,qBAAqBrB,EAAIe,IAAKd,SAASC,cAAeI,IACxD,EACA3B,SAEFkB,IAACyB,uBAAuBC,SAAQ,CAACC,MAAO9B,EAAOf,SAC7CkB,IAAC4B,sBAAsBF,SAAQ,CAACC,MAAO5B,EAAmBjB,SAAEA,OAElD,IAGlB,CACE+C,YA/GiB,YAgHjBC,MAAOC,QAGX,CACEC,KAAMC,cACNC"}

package/components/Accordion/style.js

@@ -1,2 +1,2 @@
-'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardAccordionProp=style.createShouldForwardProp((o=>!['gap'].includes(o)));const Divider=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardAccordionProp}).withConfig({displayName:"Accordion__Divider",componentId:"ui__sc-dk3o6j-0"})(["box-sizing:border-box;height:1px;"," ",""],(o=>`\n      background-color: ${o.color?o.theme.colors[o.color]?o.theme.colors[o.color]:o.color:o.theme.colors['border-onmain-default-large']};  \n    `),responsiveMargin.responsiveMargin);const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardAccordionProp}).withConfig({displayName:"Accordion__Root",componentId:"ui__sc-dk3o6j-1"})(["box-sizing:border-box;"," "," "," ",""],[75,85,80,65].map(((o,e)=>`\n       & > *:nth-child(5n + ${e+2} of [data-accordion-item]) [data-accordion-skeleton] {\n        width: ${o}%;\n      }\n    `)),(o=>typeof o.gap=='number'&&`\n     & > *:not(:first-child, ${Divider}) {\n        margin-top: ${o.gap}px;\n      }\n    `),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);exports.Divider=Divider,exports.Root=Root;
+'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var styled__default=_interopDefault(styled);const shouldForwardAccordionProp=style.createShouldForwardProp((e=>!['gap'].includes(e)));const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardAccordionProp}).withConfig({displayName:"Accordion__Root",componentId:"ui__sc-dk3o6j-0"})(["box-sizing:border-box;"," "," "," ",""],[75,85,80,65].map(((e,o)=>`\n       & > *:nth-child(5n + ${o+2} of [data-accordion-item]) [data-accordion-skeleton] {\n        width: ${e}%;\n      }\n    `)),(e=>typeof e.gap=='number'&&`\n     & > *:not(:first-child, [data-ui-divider]) {\n        margin-top: ${e.gap}px;\n      }\n    `),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);exports.Root=Root;
 //# sourceMappingURL=style.js.map

package/components/Accordion/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Accordion/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { AccordionDividerProps, StyledAccordionProps } from './types'\n\nconst shouldForwardAccordionProp = createShouldForwardProp((propKey) => !['gap'].includes(propKey))\n\nexport const Divider = styled.div.withConfig<AccordionDividerProps>({\n  shouldForwardProp: shouldForwardAccordionProp,\n})`\n  box-sizing: border-box;\n  height: 1px;\n  ${(props) => `\n      background-color: ${\n        props.color\n          ? props.theme.colors[props.color]\n            ? props.theme.colors[props.color]\n            : props.color\n          : props.theme.colors['border-onmain-default-large']\n      };  \n    `}\n\n  ${responsiveMargin}\n`\n\nexport const Root = styled.div.withConfig<StyledAccordionProps>({\n  shouldForwardProp: shouldForwardAccordionProp,\n})`\n  box-sizing: border-box;\n\n  ${[75, 85, 80, 65].map(\n    (width, idx) => `\n       & > *:nth-child(5n + ${idx + 2} of [data-accordion-item]) [data-accordion-skeleton] {\n        width: ${width}%;\n      }\n    `\n  )}\n\n  ${(props) =>\n    typeof props.gap === 'number' &&\n    `\n     & > *:not(:first-child, ${Divider}) {\n        margin-top: ${props.gap}px;\n      }\n    `}\n \n  ${responsiveSize}\n  ${responsiveMargin}\n`\n"],"names":["shouldForwardAccordionProp","createShouldForwardProp","propKey","includes","Divider","styled","div","withConfig","shouldForwardProp","displayName","componentId","props","color","theme","colors","responsiveMargin","Root","map","width","idx","gap","responsiveSize"],"mappings":"mVAMA,MAAMA,2BAA6BC,MAAAA,yBAAyBC,IAAa,CAAC,OAAOC,SAASD,KAEnF,MAAME,QAAUC,gBAAAA,QAAOC,IAAIC,WAAkC,CAClEC,kBAAmBR,6BACnBO,WAAA,CAAAE,YAAA,qBAAAC,YAAA,mBAFqBL,CAErB,CAAA,oCAAA,IAAA,KAGGM,GAAU,6BAEPA,EAAMC,MACFD,EAAME,MAAMC,OAAOH,EAAMC,OACvBD,EAAME,MAAMC,OAAOH,EAAMC,OACzBD,EAAMC,MACRD,EAAME,MAAMC,OAAO,2CAI3BC,iBAAAA,kBAGG,MAAMC,KAAOX,gBAAAA,QAAOC,IAAIC,WAAiC,CAC9DC,kBAAmBR,6BACnBO,WAAA,CAAAE,YAAA,kBAAAC,YAAA,mBAFkBL,CAElB,CAAA,yBAAA,IAAA,IAAA,IAAA,IAGE,CAAC,GAAI,GAAI,GAAI,IAAIY,KACjB,CAACC,EAAOC,IAAQ,iCACUA,EAAM,2EACnBD,wBAKZP,UACMA,EAAMS,KAAQ,UACrB,kCAC2BhB,mCACTO,EAAMS,yBAIxBC,eAAcA,eACdN,iBAAgBA"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Accordion/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { StyledAccordionProps } from './types'\n\nconst shouldForwardAccordionProp = createShouldForwardProp((propKey) => !['gap'].includes(propKey))\n\nexport const Root = styled.div.withConfig<StyledAccordionProps>({\n  shouldForwardProp: shouldForwardAccordionProp,\n})`\n  box-sizing: border-box;\n\n  ${[75, 85, 80, 65].map(\n    (width, idx) => `\n       & > *:nth-child(5n + ${idx + 2} of [data-accordion-item]) [data-accordion-skeleton] {\n        width: ${width}%;\n      }\n    `\n  )}\n\n  ${(props) =>\n    typeof props.gap === 'number' &&\n    `\n     & > *:not(:first-child, [data-ui-divider]) {\n        margin-top: ${props.gap}px;\n      }\n    `}\n \n  ${responsiveSize}\n  ${responsiveMargin}\n`\n"],"names":["shouldForwardAccordionProp","createShouldForwardProp","propKey","includes","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","map","width","idx","props","gap","responsiveSize","responsiveMargin"],"mappings":"mVAMA,MAAMA,2BAA6BC,MAAAA,yBAAyBC,IAAa,CAAC,OAAOC,SAASD,KAEnF,MAAME,KAAOC,gBAAAA,QAAOC,IAAIC,WAAiC,CAC9DC,kBAAmBR,6BACnBO,WAAA,CAAAE,YAAA,kBAAAC,YAAA,mBAFkBL,CAElB,CAAA,yBAAA,IAAA,IAAA,IAAA,IAGE,CAAC,GAAI,GAAI,GAAI,IAAIM,KACjB,CAACC,EAAOC,IAAQ,iCACUA,EAAM,2EACnBD,wBAKZE,UACMA,EAAMC,KAAQ,UACrB,4EAEkBD,EAAMC,yBAIxBC,eAAcA,eACdC,iBAAgBA"}

package/components/Accordion/style.mjs

@@ -1,2 +1,2 @@
-import styled from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';const shouldForwardAccordionProp=createShouldForwardProp((o=>!['gap'].includes(o)));const Divider=styled.div.withConfig({shouldForwardProp:shouldForwardAccordionProp}).withConfig({displayName:"Accordion__Divider",componentId:"ui__sc-dk3o6j-0"})(["box-sizing:border-box;height:1px;"," ",""],(o=>`\n      background-color: ${o.color?o.theme.colors[o.color]?o.theme.colors[o.color]:o.color:o.theme.colors['border-onmain-default-large']};  \n    `),responsiveMargin);const Root=styled.div.withConfig({shouldForwardProp:shouldForwardAccordionProp}).withConfig({displayName:"Accordion__Root",componentId:"ui__sc-dk3o6j-1"})(["box-sizing:border-box;"," "," "," ",""],[75,85,80,65].map(((o,r)=>`\n       & > *:nth-child(5n + ${r+2} of [data-accordion-item]) [data-accordion-skeleton] {\n        width: ${o}%;\n      }\n    `)),(o=>typeof o.gap=='number'&&`\n     & > *:not(:first-child, ${Divider}) {\n        margin-top: ${o.gap}px;\n      }\n    `),responsiveSize,responsiveMargin);export{Divider,Root};
+import styled from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';const shouldForwardAccordionProp=createShouldForwardProp((o=>!['gap'].includes(o)));const Root=styled.div.withConfig({shouldForwardProp:shouldForwardAccordionProp}).withConfig({displayName:"Accordion__Root",componentId:"ui__sc-dk3o6j-0"})(["box-sizing:border-box;"," "," "," ",""],[75,85,80,65].map(((o,r)=>`\n       & > *:nth-child(5n + ${r+2} of [data-accordion-item]) [data-accordion-skeleton] {\n        width: ${o}%;\n      }\n    `)),(o=>typeof o.gap=='number'&&`\n     & > *:not(:first-child, [data-ui-divider]) {\n        margin-top: ${o.gap}px;\n      }\n    `),responsiveSize,responsiveMargin);export{Root};
 //# sourceMappingURL=style.mjs.map

package/components/Accordion/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","sources":["../../../../src/components/Accordion/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { AccordionDividerProps, StyledAccordionProps } from './types'\n\nconst shouldForwardAccordionProp = createShouldForwardProp((propKey) => !['gap'].includes(propKey))\n\nexport const Divider = styled.div.withConfig<AccordionDividerProps>({\n  shouldForwardProp: shouldForwardAccordionProp,\n})`\n  box-sizing: border-box;\n  height: 1px;\n  ${(props) => `\n      background-color: ${\n        props.color\n          ? props.theme.colors[props.color]\n            ? props.theme.colors[props.color]\n            : props.color\n          : props.theme.colors['border-onmain-default-large']\n      };  \n    `}\n\n  ${responsiveMargin}\n`\n\nexport const Root = styled.div.withConfig<StyledAccordionProps>({\n  shouldForwardProp: shouldForwardAccordionProp,\n})`\n  box-sizing: border-box;\n\n  ${[75, 85, 80, 65].map(\n    (width, idx) => `\n       & > *:nth-child(5n + ${idx + 2} of [data-accordion-item]) [data-accordion-skeleton] {\n        width: ${width}%;\n      }\n    `\n  )}\n\n  ${(props) =>\n    typeof props.gap === 'number' &&\n    `\n     & > *:not(:first-child, ${Divider}) {\n        margin-top: ${props.gap}px;\n      }\n    `}\n \n  ${responsiveSize}\n  ${responsiveMargin}\n`\n"],"names":["shouldForwardAccordionProp","createShouldForwardProp","propKey","includes","Divider","styled","div","withConfig","shouldForwardProp","displayName","componentId","props","color","theme","colors","responsiveMargin","Root","map","width","idx","gap","responsiveSize"],"mappings":"sOAMA,MAAMA,2BAA6BC,yBAAyBC,IAAa,CAAC,OAAOC,SAASD,KAEnF,MAAME,QAAUC,OAAOC,IAAIC,WAAkC,CAClEC,kBAAmBR,6BACnBO,WAAA,CAAAE,YAAA,qBAAAC,YAAA,mBAFqBL,CAErB,CAAA,oCAAA,IAAA,KAGGM,GAAU,6BAEPA,EAAMC,MACFD,EAAME,MAAMC,OAAOH,EAAMC,OACvBD,EAAME,MAAMC,OAAOH,EAAMC,OACzBD,EAAMC,MACRD,EAAME,MAAMC,OAAO,2CAI3BC,kBAGG,MAAMC,KAAOX,OAAOC,IAAIC,WAAiC,CAC9DC,kBAAmBR,6BACnBO,WAAA,CAAAE,YAAA,kBAAAC,YAAA,mBAFkBL,CAElB,CAAA,yBAAA,IAAA,IAAA,IAAA,IAGE,CAAC,GAAI,GAAI,GAAI,IAAIY,KACjB,CAACC,EAAOC,IAAQ,iCACUA,EAAM,2EACnBD,wBAKZP,UACMA,EAAMS,KAAQ,UACrB,kCAC2BhB,mCACTO,EAAMS,yBAIxBC,eACAN"}
+{"version":3,"file":"style.mjs","sources":["../../../../src/components/Accordion/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { StyledAccordionProps } from './types'\n\nconst shouldForwardAccordionProp = createShouldForwardProp((propKey) => !['gap'].includes(propKey))\n\nexport const Root = styled.div.withConfig<StyledAccordionProps>({\n  shouldForwardProp: shouldForwardAccordionProp,\n})`\n  box-sizing: border-box;\n\n  ${[75, 85, 80, 65].map(\n    (width, idx) => `\n       & > *:nth-child(5n + ${idx + 2} of [data-accordion-item]) [data-accordion-skeleton] {\n        width: ${width}%;\n      }\n    `\n  )}\n\n  ${(props) =>\n    typeof props.gap === 'number' &&\n    `\n     & > *:not(:first-child, [data-ui-divider]) {\n        margin-top: ${props.gap}px;\n      }\n    `}\n \n  ${responsiveSize}\n  ${responsiveMargin}\n`\n"],"names":["shouldForwardAccordionProp","createShouldForwardProp","propKey","includes","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","map","width","idx","props","gap","responsiveSize","responsiveMargin"],"mappings":"sOAMA,MAAMA,2BAA6BC,yBAAyBC,IAAa,CAAC,OAAOC,SAASD,KAEnF,MAAME,KAAOC,OAAOC,IAAIC,WAAiC,CAC9DC,kBAAmBR,6BACnBO,WAAA,CAAAE,YAAA,kBAAAC,YAAA,mBAFkBL,CAElB,CAAA,yBAAA,IAAA,IAAA,IAAA,IAGE,CAAC,GAAI,GAAI,GAAI,IAAIM,KACjB,CAACC,EAAOC,IAAQ,iCACUA,EAAM,2EACnBD,wBAKZE,UACMA,EAAMC,KAAQ,UACrB,4EAEkBD,EAAMC,yBAIxBC,eACAC"}

package/components/DialogComponent/DialogComponent.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var ResizeObserver=require('resize-observer-polyfill');var withMergedProps=require('../../hocs/withMergedProps.js');var constants=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var dragging=require('./images/dragging.svg.js');var style=require('./style.js');var sizes=require('./sizes.js');var layouts=require('./layouts.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var AspectRatio=require('../AspectRatio/AspectRatio.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ResizeObserver__default=_interopDefault(ResizeObserver);const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver__default.default((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps.withMergedProps(React.forwardRef(((e,t)=>{const{size:s="s",layout:n="vertical",sizeXXS:i,sizeXS:o,sizeS:r,sizeM:a,sizeL:l,sizeXL:c,layoutXXS:u,layoutXS:m,layoutS:x,layoutM:d,layoutL:y,layoutXL:j,root:R,floats:g,media:S,body:p,caption:h,title:z,subtitle:T,children:I,footer:f,closeButton:b,progressLine:A,fancy:E,imgSrcVertical:v,imgSrcHorizontal:_,scrollable:L,scrollFading:O,draggable:k,loading:w,className:C,backgroundClassName:N,onGrab:B,onNudge:D,...P}=e;const V={size:s,sizeXXS:i,sizeXS:o,sizeS:r,sizeM:a,sizeL:l,sizeXL:c};const X={layout:n,layoutXXS:u,layoutXS:m,layoutS:x,layoutM:d,layoutL:y,layoutXL:j};const M={...V,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_CAPTION};const q={...V,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:sizes.SIZES_TITLE};const H={...V,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_SUBTITLE};const Y=E?{icon:'close',size:'xxl',secondary:!0}:{icon:'close',size:'l',marginTop:8,marginRight:8};const Z={size:'xs'};const F=E?C:dom.concatClassNames(C,N);const U=L&&O;const[K,G]=React.useState(null);const[J,Q]=React.useState(null);const[W,$]=React.useState(null);const ee=React.useCallback((e=>{e.scrollHeight===e.clientHeight?(G(null),Q(null)):(G(e.scrollTop<=0),Q(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return React.useLayoutEffect((()=>(W&&U&&(W[resizeHandlerSymbol]=ee,resizeObserver.observe(W)),()=>{W&&resizeObserver.unobserve(W)})),[W,U,ee]),jsxRuntime.jsxs(style.Root,{...P,...V,...X,layouts:E?layouts.LAYOUTS_FANCY:layouts.LAYOUTS,className:F,fancy:E,ref:t,children:[E&&jsxRuntime.jsx(style.FancyBackground,{className:N}),React.isValidElement(R)?R:typeof R=='function'?R({captionProps:M,titleProps:q,subtitleProps:H,closeButtonProps:Y,progressLineProps:Z,onGrab:B,onNudge:D}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[g,k&&jsxRuntime.jsx(style.DraggingHandle,{...X,layouts:layouts.VISIBILITY_VERTICAL,onPointerDown:B,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:D,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}),b&&jsxRuntime.jsx(style.ButtonPosition,{children:React.isValidElement(b)?b:typeof b=='function'?b(Y):null}),(w||S||v)&&jsxRuntime.jsx(style.Media,{...X,layouts:E?layouts.LAYOUTS_FANCY_MEDIA_VERTICAL:layouts.LAYOUTS_MEDIA_VERTICAL,children:w?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(S)?S:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(style.Img,{src:v})})}),(w||S||_)&&jsxRuntime.jsx(style.Media,{...X,layouts:layouts.LAYOUTS_MEDIA_HORIZONTAL,children:w?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(S)?S:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(style.Img,{src:_})})}),jsxRuntime.jsxs(style.Body,{children:[A&&!w&&jsxRuntime.jsx(style.ProgressPosition,{...X,layouts:E?layouts.LAYOUTS_FANCY_PROGRESS:layouts.LAYOUTS_PROGRESS,children:React.isValidElement(A)?A:typeof A=='function'?A(Z):null}),k&&jsxRuntime.jsx(style.DraggingHandle,{...X,layouts:layouts.VISIBILITY_HORIZONTAL,onPointerDown:B,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:D,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}),E&&jsxRuntime.jsx(style.LayoutSpacer,{...X,layouts:layouts.VISIBILITY_HORIZONTAL,paddingTop:76}),w?jsxRuntime.jsx(style.Container,{...V,sizes:sizes.SIZES_CONTAINER,children:jsxRuntime.jsxs(style.Content,{...V,sizes:sizes.SIZES_CONTENT,children:[jsxRuntime.jsx(Skeleton.Skeleton,{children:jsxRuntime.jsx(Text.Text,{...q,marginBottom:"1.5em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"90%",children:jsxRuntime.jsx(Text.Text,{...H,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"70%",children:jsxRuntime.jsx(Text.Text,{...H,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"50%",children:jsxRuntime.jsx(Text.Text,{...H,marginBottom:"0.8em"})})]})}):React.isValidElement(p)?p:typeof p=='function'?p({captionProps:M,titleProps:q,subtitleProps:H}):jsxRuntime.jsxs(style.Container,{...V,sizes:sizes.SIZES_CONTAINER,children:[U&&jsxRuntime.jsx(style.Fading,{visible:K===!1}),jsxRuntime.jsxs(style.Content,{...V,sizes:sizes.SIZES_CONTENT,ref:e=>{$(e)},scrollable:L,tabIndex:L?0:void 0,onScroll:e=>{U&&ee(e.currentTarget)},onKeyDown:e=>{constants.keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):constants.keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:[React.isValidElement(h)?h:typeof h=='function'?h(M):typeof h=='string'||typeof h=='number'?jsxRuntime.jsx(Text.Text,{...M,children:h}):null,React.isValidElement(z)?z:typeof z=='function'?z(q):typeof z=='string'||typeof z=='number'?jsxRuntime.jsx(Text.Text,{...q,children:z}):null,React.isValidElement(T)?T:typeof T=='function'?T(H):typeof T=='string'||typeof T=='number'?jsxRuntime.jsx(Text.Text,{...H,children:T}):null,I]}),U&&jsxRuntime.jsx(style.Fading,{visible:J===!1,after:!0}),f&&jsxRuntime.jsx(style.Footer,{...V,sizes:sizes.SIZES_FOOTER,children:f})]})]})]})]})})),{sizes:e=>e.fancy?sizes.SIZES_FANCY:sizes.SIZES,displayName:'DialogComponent'});exports.DialogComponent=DialogComponent;
+'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var useScrollThresholds=require('../../hooks/useScrollThresholds.js');var constants=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var dragging=require('./images/dragging.svg.js');var style=require('./style.js');var sizes=require('./sizes.js');var layouts=require('./layouts.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var AspectRatio=require('../AspectRatio/AspectRatio.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');const DialogComponent=withMergedProps.withMergedProps(React.forwardRef(((e,t)=>{const{size:s="s",layout:o="vertical",scrollable:n=!1,scrollFading:i=!1,sizeXXS:r,sizeXS:a,sizeS:l,sizeM:c,sizeL:u,sizeXL:x,layoutXXS:m,layoutXS:d,layoutS:j,layoutM:y,layoutL:R,layoutXL:g,root:S,floats:p,media:h,body:T,caption:I,title:z,subtitle:A,children:f,footer:E,closeButton:b,progressLine:L,fancy:k,imgSrcVertical:w,imgSrcHorizontal:C,draggable:N,loading:v,className:_,backgroundClassName:O,onGrab:B,onNudge:P,...D}=e;const V={size:s,sizeXXS:r,sizeXS:a,sizeS:l,sizeM:c,sizeL:u,sizeXL:x};const X={layout:o,layoutXXS:m,layoutXS:d,layoutS:j,layoutM:y,layoutL:R,layoutXL:g};const q={...V,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_CAPTION};const Y={...V,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:sizes.SIZES_TITLE};const M={...V,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_SUBTITLE};const Z=k?{icon:'close',size:'xxl',secondary:!0}:{icon:'close',size:'l',marginTop:8,marginRight:8};const F={size:'xs'};const U=k?_:dom.concatClassNames(_,O);const H=n&&i;const[K,G]=React.useState(null);const{scrollThresholds:J,setScrollThresholds:Q}=useScrollThresholds.useScrollThresholds({enabled:H,target:K});return jsxRuntime.jsxs(style.Root,{...D,...V,...X,layouts:k?layouts.LAYOUTS_FANCY:layouts.LAYOUTS,className:U,fancy:k,ref:t,children:[k&&jsxRuntime.jsx(style.FancyBackground,{className:O}),React.isValidElement(S)?S:typeof S=='function'?S({captionProps:q,titleProps:Y,subtitleProps:M,closeButtonProps:Z,progressLineProps:F,onGrab:B,onNudge:P}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[p,N&&jsxRuntime.jsx(style.DraggingHandle,{...X,layouts:layouts.VISIBILITY_VERTICAL,onPointerDown:B,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:P,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}),b&&jsxRuntime.jsx(style.ButtonPosition,{children:React.isValidElement(b)?b:typeof b=='function'?b(Z):null}),(v||h||w)&&jsxRuntime.jsx(style.Media,{...X,layouts:k?layouts.LAYOUTS_FANCY_MEDIA_VERTICAL:layouts.LAYOUTS_MEDIA_VERTICAL,children:v?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(h)?h:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(style.Img,{src:w})})}),(v||h||C)&&jsxRuntime.jsx(style.Media,{...X,layouts:layouts.LAYOUTS_MEDIA_HORIZONTAL,children:v?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(h)?h:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(style.Img,{src:C})})}),jsxRuntime.jsxs(style.Body,{children:[L&&!v&&jsxRuntime.jsx(style.ProgressPosition,{...X,layouts:k?layouts.LAYOUTS_FANCY_PROGRESS:layouts.LAYOUTS_PROGRESS,children:React.isValidElement(L)?L:typeof L=='function'?L(F):null}),N&&jsxRuntime.jsx(style.DraggingHandle,{...X,layouts:layouts.VISIBILITY_HORIZONTAL,onPointerDown:B,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:P,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}),k&&jsxRuntime.jsx(style.LayoutSpacer,{...X,layouts:layouts.VISIBILITY_HORIZONTAL,paddingTop:76}),v?jsxRuntime.jsx(style.Container,{...V,sizes:sizes.SIZES_CONTAINER,children:jsxRuntime.jsxs(style.Content,{...V,sizes:sizes.SIZES_CONTENT,children:[jsxRuntime.jsx(Skeleton.Skeleton,{children:jsxRuntime.jsx(Text.Text,{...Y,marginBottom:"1.5em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"90%",children:jsxRuntime.jsx(Text.Text,{...M,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"70%",children:jsxRuntime.jsx(Text.Text,{...M,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"50%",children:jsxRuntime.jsx(Text.Text,{...M,marginBottom:"0.8em"})})]})}):React.isValidElement(T)?T:typeof T=='function'?T({captionProps:q,titleProps:Y,subtitleProps:M}):jsxRuntime.jsxs(style.Container,{...V,sizes:sizes.SIZES_CONTAINER,children:[H&&jsxRuntime.jsx(style.Fading,{visible:J.top===!1}),jsxRuntime.jsxs(style.Content,{...V,sizes:sizes.SIZES_CONTENT,ref:e=>{G(e)},scrollable:n,tabIndex:n?0:void 0,onScroll:e=>{H&&Q(e.currentTarget)},onKeyDown:e=>{constants.keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):constants.keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:[React.isValidElement(I)?I:typeof I=='function'?I(q):typeof I=='string'||typeof I=='number'?jsxRuntime.jsx(Text.Text,{...q,children:I}):null,React.isValidElement(z)?z:typeof z=='function'?z(Y):typeof z=='string'||typeof z=='number'?jsxRuntime.jsx(Text.Text,{...Y,children:z}):null,React.isValidElement(A)?A:typeof A=='function'?A(M):typeof A=='string'||typeof A=='number'?jsxRuntime.jsx(Text.Text,{...M,children:A}):null,f]}),H&&jsxRuntime.jsx(style.Fading,{visible:J.bottom===!1,after:!0}),E&&jsxRuntime.jsx(style.Footer,{...V,sizes:sizes.SIZES_FOOTER,children:E})]})]})]})]})})),{sizes:e=>e.fancy?sizes.SIZES_FANCY:sizes.SIZES,displayName:'DialogComponent'});exports.DialogComponent=DialogComponent;
 //# sourceMappingURL=DialogComponent.js.map

package/components/DialogComponent/DialogComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogComponent.js","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useState, useCallback, isValidElement } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport { AspectRatio } from 'components/AspectRatio'\nimport type { TextProps } from 'components/Text'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ProgressLineProps } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CONTAINER,\n  SIZES_CONTENT,\n  SIZES_FOOTER,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n} from './sizes'\nimport {\n  LAYOUTS,\n  LAYOUTS_FANCY,\n  LAYOUTS_MEDIA_VERTICAL,\n  LAYOUTS_FANCY_MEDIA_VERTICAL,\n  LAYOUTS_MEDIA_HORIZONTAL,\n  LAYOUTS_PROGRESS,\n  LAYOUTS_FANCY_PROGRESS,\n  VISIBILITY_VERTICAL,\n  VISIBILITY_HORIZONTAL,\n} from './layouts'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n  entries.forEach((entry) => {\n    if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n      entry.target[resizeHandlerSymbol](entry.target)\n    }\n  })\n})\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 's',\n      layout = 'vertical',\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n      root,\n      floats,\n      media,\n      body,\n      caption,\n      title,\n      subtitle,\n      children,\n      footer,\n      closeButton,\n      progressLine,\n      fancy,\n      imgSrcVertical,\n      imgSrcHorizontal,\n      scrollable,\n      scrollFading,\n      draggable,\n      loading,\n      className,\n      backgroundClassName,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const layoutProps = {\n      layout,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n    }\n\n    const captionProps: TextProps = {\n      ...sizeProps,\n      appearance: 'body',\n      color: 'content-onmain-tertiary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_CAPTION,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'h2',\n      appearance: 'heading',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.5em',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'p',\n      appearance: 'body',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const closeButtonProps: IconButtonProps = fancy\n      ? { icon: 'close', size: 'xxl', secondary: true }\n      : { icon: 'close', size: 'l', marginTop: 8, marginRight: 8 }\n\n    const progressLineProps: ProgressLineProps = {\n      size: 'xs',\n    }\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const scrollFadingEnabled = scrollable && scrollFading\n\n    const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n    const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n    const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n    const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n      if (e.scrollHeight === e.clientHeight) {\n        setScrollTop(null)\n        setScrollBottom(null)\n      } else {\n        setScrollTop(e.scrollTop <= 0)\n        setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n      }\n    }, [])\n\n    useLayoutEffect(() => {\n      if (contentRef && scrollFadingEnabled) {\n        contentRef[resizeHandlerSymbol] = handleScrollThresholds\n        resizeObserver.observe(contentRef)\n      }\n\n      return () => {\n        if (contentRef) {\n          resizeObserver.unobserve(contentRef)\n        }\n      }\n    }, [contentRef, scrollFadingEnabled, handleScrollThresholds])\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        {...layoutProps}\n        layouts={fancy ? LAYOUTS_FANCY : LAYOUTS}\n        className={rootClassName}\n        fancy={fancy}\n        ref={ref}\n      >\n        {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n        {isValidElement(root) ? (\n          root\n        ) : typeof root === 'function' ? (\n          root({\n            captionProps,\n            titleProps,\n            subtitleProps,\n            closeButtonProps,\n            progressLineProps,\n            onGrab,\n            onNudge,\n          })\n        ) : (\n          <>\n            {floats}\n            {draggable && (\n              <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_VERTICAL} onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            )}\n            {closeButton && (\n              <Styled.ButtonPosition>\n                {isValidElement(closeButton)\n                  ? closeButton\n                  : typeof closeButton === 'function'\n                  ? closeButton(closeButtonProps)\n                  : null}\n              </Styled.ButtonPosition>\n            )}\n            {(loading || media || imgSrcVertical) && (\n              <Styled.Media {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_MEDIA_VERTICAL : LAYOUTS_MEDIA_VERTICAL}>\n                {loading ? (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Styled.Img src={imgSrcVertical} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            )}\n            {(loading || media || imgSrcHorizontal) && (\n              <Styled.Media {...layoutProps} layouts={LAYOUTS_MEDIA_HORIZONTAL}>\n                {loading ? (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Styled.Img src={imgSrcHorizontal} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            )}\n            <Styled.Body>\n              {progressLine && !loading && (\n                <Styled.ProgressPosition {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_PROGRESS : LAYOUTS_PROGRESS}>\n                  {isValidElement(progressLine)\n                    ? progressLine\n                    : typeof progressLine === 'function'\n                    ? progressLine(progressLineProps)\n                    : null}\n                </Styled.ProgressPosition>\n              )}\n              {draggable && (\n                <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_HORIZONTAL} onPointerDown={onGrab}>\n                  <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                    <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                  </Styled.DraggingIconContainer>\n                </Styled.DraggingHandle>\n              )}\n              {fancy && <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} />}\n              {loading ? (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                    <Skeleton>\n                      <Text {...titleProps} marginBottom='1.5em' />\n                    </Skeleton>\n                    <Skeleton width='90%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='70%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='50%'>\n                      <Text {...subtitleProps} marginBottom='0.8em' />\n                    </Skeleton>\n                  </Styled.Content>\n                </Styled.Container>\n              ) : isValidElement(body) ? (\n                body\n              ) : typeof body === 'function' ? (\n                body({\n                  captionProps,\n                  titleProps,\n                  subtitleProps,\n                })\n              ) : (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  {scrollFadingEnabled && <Styled.Fading visible={scrollTop === false} />}\n                  <Styled.Content\n                    {...sizeProps}\n                    sizes={SIZES_CONTENT}\n                    ref={(ref) => {\n                      setContentRef(ref)\n                    }}\n                    scrollable={scrollable}\n                    tabIndex={scrollable ? 0 : undefined}\n                    onScroll={(evt) => {\n                      if (scrollFadingEnabled) {\n                        handleScrollThresholds(evt.currentTarget)\n                      }\n                    }}\n                    onKeyDown={(evt) => {\n                      if (keyboardKeys.ArrowUp.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, -13)\n                      } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, 13)\n                      }\n                    }}\n                  >\n                    {isValidElement(caption) ? (\n                      caption\n                    ) : typeof caption === 'function' ? (\n                      caption(captionProps)\n                    ) : typeof caption === 'string' || typeof caption === 'number' ? (\n                      <Text {...captionProps}>{caption}</Text>\n                    ) : null}\n                    {isValidElement(title) ? (\n                      title\n                    ) : typeof title === 'function' ? (\n                      title(titleProps)\n                    ) : typeof title === 'string' || typeof title === 'number' ? (\n                      <Text {...titleProps}>{title}</Text>\n                    ) : null}\n                    {isValidElement(subtitle) ? (\n                      subtitle\n                    ) : typeof subtitle === 'function' ? (\n                      subtitle(subtitleProps)\n                    ) : typeof subtitle === 'string' || typeof subtitle === 'number' ? (\n                      <Text {...subtitleProps}>{subtitle}</Text>\n                    ) : null}\n                    {children}\n                  </Styled.Content>\n                  {scrollFadingEnabled && <Styled.Fading visible={scrollBottom === false} after />}\n                  {footer && (\n                    <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n                      {footer}\n                    </Styled.Footer>\n                  )}\n                </Styled.Container>\n              )}\n            </Styled.Body>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DialogComponent }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","default","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","scrollable","scrollFading","draggable","loading","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","secondary","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","contentRef","setContentRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observe","unobserve","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","_jsx","jsx","isValidElement","jsxs","_Fragment","VISIBILITY_VERTICAL","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","LAYOUTS_FANCY_MEDIA_VERTICAL","LAYOUTS_MEDIA_VERTICAL","AspectRatio","ratio","width","Skeleton","borderRadius","src","LAYOUTS_MEDIA_HORIZONTAL","height","LAYOUTS_FANCY_PROGRESS","LAYOUTS_PROGRESS","VISIBILITY_HORIZONTAL","paddingTop","SIZES_CONTAINER","SIZES_CONTENT","Text","visible","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}
+{"version":3,"file":"DialogComponent.js","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { useScrollThresholds } from 'hooks/useScrollThresholds'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport { AspectRatio } from 'components/AspectRatio'\nimport type { TextProps } from 'components/Text'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ProgressLineProps } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CONTAINER,\n  SIZES_CONTENT,\n  SIZES_FOOTER,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n} from './sizes'\nimport {\n  LAYOUTS,\n  LAYOUTS_FANCY,\n  LAYOUTS_MEDIA_VERTICAL,\n  LAYOUTS_FANCY_MEDIA_VERTICAL,\n  LAYOUTS_MEDIA_HORIZONTAL,\n  LAYOUTS_PROGRESS,\n  LAYOUTS_FANCY_PROGRESS,\n  VISIBILITY_VERTICAL,\n  VISIBILITY_HORIZONTAL,\n} from './layouts'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 's',\n      layout = 'vertical',\n      scrollable = false,\n      scrollFading = false,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n      root,\n      floats,\n      media,\n      body,\n      caption,\n      title,\n      subtitle,\n      children,\n      footer,\n      closeButton,\n      progressLine,\n      fancy,\n      imgSrcVertical,\n      imgSrcHorizontal,\n      draggable,\n      loading,\n      className,\n      backgroundClassName,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const layoutProps = {\n      layout,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n    }\n\n    const captionProps: TextProps = {\n      ...sizeProps,\n      appearance: 'body',\n      color: 'content-onmain-tertiary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_CAPTION,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'h2',\n      appearance: 'heading',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.5em',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'p',\n      appearance: 'body',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const closeButtonProps: IconButtonProps = fancy\n      ? { icon: 'close', size: 'xxl', secondary: true }\n      : { icon: 'close', size: 'l', marginTop: 8, marginRight: 8 }\n\n    const progressLineProps: ProgressLineProps = {\n      size: 'xs',\n    }\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const scrollFadingEnabled = scrollable && scrollFading\n\n    const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n    const { scrollThresholds, setScrollThresholds } = useScrollThresholds({\n      enabled: scrollFadingEnabled,\n      target: contentRef,\n    })\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        {...layoutProps}\n        layouts={fancy ? LAYOUTS_FANCY : LAYOUTS}\n        className={rootClassName}\n        fancy={fancy}\n        ref={ref}\n      >\n        {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n        {isValidElement(root) ? (\n          root\n        ) : typeof root === 'function' ? (\n          root({\n            captionProps,\n            titleProps,\n            subtitleProps,\n            closeButtonProps,\n            progressLineProps,\n            onGrab,\n            onNudge,\n          })\n        ) : (\n          <>\n            {floats}\n            {draggable && (\n              <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_VERTICAL} onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            )}\n            {closeButton && (\n              <Styled.ButtonPosition>\n                {isValidElement(closeButton)\n                  ? closeButton\n                  : typeof closeButton === 'function'\n                  ? closeButton(closeButtonProps)\n                  : null}\n              </Styled.ButtonPosition>\n            )}\n            {(loading || media || imgSrcVertical) && (\n              <Styled.Media {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_MEDIA_VERTICAL : LAYOUTS_MEDIA_VERTICAL}>\n                {loading ? (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Styled.Img src={imgSrcVertical} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            )}\n            {(loading || media || imgSrcHorizontal) && (\n              <Styled.Media {...layoutProps} layouts={LAYOUTS_MEDIA_HORIZONTAL}>\n                {loading ? (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Styled.Img src={imgSrcHorizontal} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            )}\n            <Styled.Body>\n              {progressLine && !loading && (\n                <Styled.ProgressPosition {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_PROGRESS : LAYOUTS_PROGRESS}>\n                  {isValidElement(progressLine)\n                    ? progressLine\n                    : typeof progressLine === 'function'\n                    ? progressLine(progressLineProps)\n                    : null}\n                </Styled.ProgressPosition>\n              )}\n              {draggable && (\n                <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_HORIZONTAL} onPointerDown={onGrab}>\n                  <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                    <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                  </Styled.DraggingIconContainer>\n                </Styled.DraggingHandle>\n              )}\n              {fancy && <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} />}\n              {loading ? (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                    <Skeleton>\n                      <Text {...titleProps} marginBottom='1.5em' />\n                    </Skeleton>\n                    <Skeleton width='90%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='70%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='50%'>\n                      <Text {...subtitleProps} marginBottom='0.8em' />\n                    </Skeleton>\n                  </Styled.Content>\n                </Styled.Container>\n              ) : isValidElement(body) ? (\n                body\n              ) : typeof body === 'function' ? (\n                body({\n                  captionProps,\n                  titleProps,\n                  subtitleProps,\n                })\n              ) : (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  {scrollFadingEnabled && <Styled.Fading visible={scrollThresholds.top === false} />}\n                  <Styled.Content\n                    {...sizeProps}\n                    sizes={SIZES_CONTENT}\n                    ref={(ref) => {\n                      setContentRef(ref)\n                    }}\n                    scrollable={scrollable}\n                    tabIndex={scrollable ? 0 : undefined}\n                    onScroll={(evt) => {\n                      if (scrollFadingEnabled) {\n                        setScrollThresholds(evt.currentTarget)\n                      }\n                    }}\n                    onKeyDown={(evt) => {\n                      if (keyboardKeys.ArrowUp.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, -13)\n                      } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, 13)\n                      }\n                    }}\n                  >\n                    {isValidElement(caption) ? (\n                      caption\n                    ) : typeof caption === 'function' ? (\n                      caption(captionProps)\n                    ) : typeof caption === 'string' || typeof caption === 'number' ? (\n                      <Text {...captionProps}>{caption}</Text>\n                    ) : null}\n                    {isValidElement(title) ? (\n                      title\n                    ) : typeof title === 'function' ? (\n                      title(titleProps)\n                    ) : typeof title === 'string' || typeof title === 'number' ? (\n                      <Text {...titleProps}>{title}</Text>\n                    ) : null}\n                    {isValidElement(subtitle) ? (\n                      subtitle\n                    ) : typeof subtitle === 'function' ? (\n                      subtitle(subtitleProps)\n                    ) : typeof subtitle === 'string' || typeof subtitle === 'number' ? (\n                      <Text {...subtitleProps}>{subtitle}</Text>\n                    ) : null}\n                    {children}\n                  </Styled.Content>\n                  {scrollFadingEnabled && <Styled.Fading visible={scrollThresholds.bottom === false} after />}\n                  {footer && (\n                    <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n                      {footer}\n                    </Styled.Footer>\n                  )}\n                </Styled.Container>\n              )}\n            </Styled.Body>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DialogComponent }\n"],"names":["DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","scrollable","scrollFading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","draggable","loading","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","secondary","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","contentRef","setContentRef","useState","scrollThresholds","setScrollThresholds","useScrollThresholds","enabled","target","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","_jsx","jsx","isValidElement","jsxs","_Fragment","VISIBILITY_VERTICAL","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","default","LAYOUTS_FANCY_MEDIA_VERTICAL","LAYOUTS_MEDIA_VERTICAL","AspectRatio","ratio","width","Skeleton","borderRadius","src","LAYOUTS_MEDIA_HORIZONTAL","height","LAYOUTS_FANCY_PROGRESS","LAYOUTS_PROGRESS","VISIBILITY_HORIZONTAL","paddingTop","SIZES_CONTAINER","SIZES_CONTENT","Text","visible","top","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","bottom","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}

package/components/DialogComponent/DialogComponent.mjs

@@ -1,2 +1,2 @@
-import{forwardRef,useState,useCallback,useLayoutEffect,isValidElement}from'react';import ResizeObserver from'resize-observer-polyfill';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{concatClassNames}from'../../shared/utils/dom.mjs';import SvgDragging from'./images/dragging.svg.mjs';import{Root,FancyBackground,DraggingHandle,DraggingIconContainer,ButtonPosition,Media,Img,Body,ProgressPosition,LayoutSpacer,Container,Content,Fading,Footer}from'./style.mjs';import{SIZES_FANCY,SIZES,SIZES_CONTAINER,SIZES_CONTENT,SIZES_FOOTER,SIZES_CAPTION,SIZES_TITLE,SIZES_SUBTITLE}from'./sizes.mjs';import{LAYOUTS_FANCY,LAYOUTS,VISIBILITY_VERTICAL,LAYOUTS_FANCY_MEDIA_VERTICAL,LAYOUTS_MEDIA_VERTICAL,LAYOUTS_MEDIA_HORIZONTAL,LAYOUTS_FANCY_PROGRESS,LAYOUTS_PROGRESS,VISIBILITY_HORIZONTAL}from'./layouts.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{AspectRatio}from'../AspectRatio/AspectRatio.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps(forwardRef(((e,o)=>{const{size:t="s",layout:s="vertical",sizeXXS:n,sizeXS:r,sizeS:i,sizeM:a,sizeL:l,sizeXL:c,layoutXXS:m,layoutXS:d,layoutS:S,layoutM:g,layoutL:u,layoutXL:I,root:y,floats:p,media:T,body:x,caption:E,title:j,subtitle:f,children:h,footer:A,closeButton:L,progressLine:O,fancy:b,imgSrcVertical:_,imgSrcHorizontal:z,scrollable:R,scrollFading:C,draggable:N,loading:B,className:Y,backgroundClassName:D,onGrab:k,onNudge:w,...P}=e;const Z={size:t,sizeXXS:n,sizeXS:r,sizeS:i,sizeM:a,sizeL:l,sizeXL:c};const V={layout:s,layoutXXS:m,layoutXS:d,layoutS:S,layoutM:g,layoutL:u,layoutXL:I};const v={...Z,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_CAPTION};const F={...Z,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:SIZES_TITLE};const H={...Z,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_SUBTITLE};const M=b?{icon:'close',size:'xxl',secondary:!0}:{icon:'close',size:'l',marginTop:8,marginRight:8};const U={size:'xs'};const X=b?Y:concatClassNames(Y,D);const G=R&&C;const[K,q]=useState(null);const[J,Q]=useState(null);const[W,$]=useState(null);const ee=useCallback((e=>{e.scrollHeight===e.clientHeight?(q(null),Q(null)):(q(e.scrollTop<=0),Q(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return useLayoutEffect((()=>(W&&G&&(W[resizeHandlerSymbol]=ee,resizeObserver.observe(W)),()=>{W&&resizeObserver.unobserve(W)})),[W,G,ee]),jsxs(Root,{...P,...Z,...V,layouts:b?LAYOUTS_FANCY:LAYOUTS,className:X,fancy:b,ref:o,children:[b&&jsx(FancyBackground,{className:D}),isValidElement(y)?y:typeof y=='function'?y({captionProps:v,titleProps:F,subtitleProps:H,closeButtonProps:M,progressLineProps:U,onGrab:k,onNudge:w}):jsxs(Fragment,{children:[p,N&&jsx(DraggingHandle,{...V,layouts:VISIBILITY_VERTICAL,onPointerDown:k,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}),L&&jsx(ButtonPosition,{children:isValidElement(L)?L:typeof L=='function'?L(M):null}),(B||T||_)&&jsx(Media,{...V,layouts:b?LAYOUTS_FANCY_MEDIA_VERTICAL:LAYOUTS_MEDIA_VERTICAL,children:B?jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(T)?T:jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Img,{src:_})})}),(B||T||z)&&jsx(Media,{...V,layouts:LAYOUTS_MEDIA_HORIZONTAL,children:B?jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(T)?T:jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Img,{src:z})})}),jsxs(Body,{children:[O&&!B&&jsx(ProgressPosition,{...V,layouts:b?LAYOUTS_FANCY_PROGRESS:LAYOUTS_PROGRESS,children:isValidElement(O)?O:typeof O=='function'?O(U):null}),N&&jsx(DraggingHandle,{...V,layouts:VISIBILITY_HORIZONTAL,onPointerDown:k,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}),b&&jsx(LayoutSpacer,{...V,layouts:VISIBILITY_HORIZONTAL,paddingTop:76}),B?jsx(Container,{...Z,sizes:SIZES_CONTAINER,children:jsxs(Content,{...Z,sizes:SIZES_CONTENT,children:[jsx(Skeleton,{children:jsx(Text,{...F,marginBottom:"1.5em"})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{...H,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{...H,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{...H,marginBottom:"0.8em"})})]})}):isValidElement(x)?x:typeof x=='function'?x({captionProps:v,titleProps:F,subtitleProps:H}):jsxs(Container,{...Z,sizes:SIZES_CONTAINER,children:[G&&jsx(Fading,{visible:K===!1}),jsxs(Content,{...Z,sizes:SIZES_CONTENT,ref:e=>{$(e)},scrollable:R,tabIndex:R?0:void 0,onScroll:e=>{G&&ee(e.currentTarget)},onKeyDown:e=>{keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:[isValidElement(E)?E:typeof E=='function'?E(v):typeof E=='string'||typeof E=='number'?jsx(Text,{...v,children:E}):null,isValidElement(j)?j:typeof j=='function'?j(F):typeof j=='string'||typeof j=='number'?jsx(Text,{...F,children:j}):null,isValidElement(f)?f:typeof f=='function'?f(H):typeof f=='string'||typeof f=='number'?jsx(Text,{...H,children:f}):null,h]}),G&&jsx(Fading,{visible:J===!1,after:!0}),A&&jsx(Footer,{...Z,sizes:SIZES_FOOTER,children:A})]})]})]})]})})),{sizes:e=>e.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent};
+import{forwardRef,useState,isValidElement}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useScrollThresholds}from'../../hooks/useScrollThresholds.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{concatClassNames}from'../../shared/utils/dom.mjs';import SvgDragging from'./images/dragging.svg.mjs';import{Root,FancyBackground,DraggingHandle,DraggingIconContainer,ButtonPosition,Media,Img,Body,ProgressPosition,LayoutSpacer,Container,Content,Fading,Footer}from'./style.mjs';import{SIZES_FANCY,SIZES,SIZES_CONTAINER,SIZES_CONTENT,SIZES_FOOTER,SIZES_CAPTION,SIZES_TITLE,SIZES_SUBTITLE}from'./sizes.mjs';import{LAYOUTS_FANCY,LAYOUTS,VISIBILITY_VERTICAL,LAYOUTS_FANCY_MEDIA_VERTICAL,LAYOUTS_MEDIA_VERTICAL,LAYOUTS_MEDIA_HORIZONTAL,LAYOUTS_FANCY_PROGRESS,LAYOUTS_PROGRESS,VISIBILITY_HORIZONTAL}from'./layouts.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{AspectRatio}from'../AspectRatio/AspectRatio.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';const DialogComponent=withMergedProps(forwardRef(((o,e)=>{const{size:t="s",layout:s="vertical",scrollable:n=!1,scrollFading:r=!1,sizeXXS:i,sizeXS:a,sizeS:l,sizeM:c,sizeL:d,sizeXL:m,layoutXXS:S,layoutXS:g,layoutS:I,layoutM:p,layoutL:T,layoutXL:y,root:u,floats:x,media:j,body:h,caption:E,title:A,subtitle:f,children:L,footer:_,closeButton:O,progressLine:R,fancy:C,imgSrcVertical:N,imgSrcHorizontal:b,draggable:z,loading:B,className:Y,backgroundClassName:D,onGrab:P,onNudge:k,...w}=o;const Z={size:t,sizeXXS:i,sizeXS:a,sizeS:l,sizeM:c,sizeL:d,sizeXL:m};const V={layout:s,layoutXXS:S,layoutXS:g,layoutS:I,layoutM:p,layoutL:T,layoutXL:y};const F={...Z,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_CAPTION};const U={...Z,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:SIZES_TITLE};const M={...Z,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_SUBTITLE};const X=C?{icon:'close',size:'xxl',secondary:!0}:{icon:'close',size:'l',marginTop:8,marginRight:8};const v={size:'xs'};const H=C?Y:concatClassNames(Y,D);const G=n&&r;const[K,q]=useState(null);const{scrollThresholds:J,setScrollThresholds:Q}=useScrollThresholds({enabled:G,target:K});return jsxs(Root,{...w,...Z,...V,layouts:C?LAYOUTS_FANCY:LAYOUTS,className:H,fancy:C,ref:e,children:[C&&jsx(FancyBackground,{className:D}),isValidElement(u)?u:typeof u=='function'?u({captionProps:F,titleProps:U,subtitleProps:M,closeButtonProps:X,progressLineProps:v,onGrab:P,onNudge:k}):jsxs(Fragment,{children:[x,z&&jsx(DraggingHandle,{...V,layouts:VISIBILITY_VERTICAL,onPointerDown:P,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:k,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}),O&&jsx(ButtonPosition,{children:isValidElement(O)?O:typeof O=='function'?O(X):null}),(B||j||N)&&jsx(Media,{...V,layouts:C?LAYOUTS_FANCY_MEDIA_VERTICAL:LAYOUTS_MEDIA_VERTICAL,children:B?jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(j)?j:jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Img,{src:N})})}),(B||j||b)&&jsx(Media,{...V,layouts:LAYOUTS_MEDIA_HORIZONTAL,children:B?jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(j)?j:jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Img,{src:b})})}),jsxs(Body,{children:[R&&!B&&jsx(ProgressPosition,{...V,layouts:C?LAYOUTS_FANCY_PROGRESS:LAYOUTS_PROGRESS,children:isValidElement(R)?R:typeof R=='function'?R(v):null}),z&&jsx(DraggingHandle,{...V,layouts:VISIBILITY_HORIZONTAL,onPointerDown:P,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:k,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}),C&&jsx(LayoutSpacer,{...V,layouts:VISIBILITY_HORIZONTAL,paddingTop:76}),B?jsx(Container,{...Z,sizes:SIZES_CONTAINER,children:jsxs(Content,{...Z,sizes:SIZES_CONTENT,children:[jsx(Skeleton,{children:jsx(Text,{...U,marginBottom:"1.5em"})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{...M,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{...M,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{...M,marginBottom:"0.8em"})})]})}):isValidElement(h)?h:typeof h=='function'?h({captionProps:F,titleProps:U,subtitleProps:M}):jsxs(Container,{...Z,sizes:SIZES_CONTAINER,children:[G&&jsx(Fading,{visible:J.top===!1}),jsxs(Content,{...Z,sizes:SIZES_CONTENT,ref:o=>{q(o)},scrollable:n,tabIndex:n?0:void 0,onScroll:o=>{G&&Q(o.currentTarget)},onKeyDown:o=>{keyboardKeys.ArrowUp.validate(o.key)?(o.preventDefault(),o.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(o.key)&&(o.preventDefault(),o.currentTarget.scrollBy(0,13))},children:[isValidElement(E)?E:typeof E=='function'?E(F):typeof E=='string'||typeof E=='number'?jsx(Text,{...F,children:E}):null,isValidElement(A)?A:typeof A=='function'?A(U):typeof A=='string'||typeof A=='number'?jsx(Text,{...U,children:A}):null,isValidElement(f)?f:typeof f=='function'?f(M):typeof f=='string'||typeof f=='number'?jsx(Text,{...M,children:f}):null,L]}),G&&jsx(Fading,{visible:J.bottom===!1,after:!0}),_&&jsx(Footer,{...Z,sizes:SIZES_FOOTER,children:_})]})]})]})]})})),{sizes:o=>o.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent};
 //# sourceMappingURL=DialogComponent.mjs.map

package/components/DialogComponent/DialogComponent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DialogComponent.mjs","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useState, useCallback, isValidElement } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport { AspectRatio } from 'components/AspectRatio'\nimport type { TextProps } from 'components/Text'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ProgressLineProps } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CONTAINER,\n  SIZES_CONTENT,\n  SIZES_FOOTER,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n} from './sizes'\nimport {\n  LAYOUTS,\n  LAYOUTS_FANCY,\n  LAYOUTS_MEDIA_VERTICAL,\n  LAYOUTS_FANCY_MEDIA_VERTICAL,\n  LAYOUTS_MEDIA_HORIZONTAL,\n  LAYOUTS_PROGRESS,\n  LAYOUTS_FANCY_PROGRESS,\n  VISIBILITY_VERTICAL,\n  VISIBILITY_HORIZONTAL,\n} from './layouts'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n  entries.forEach((entry) => {\n    if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n      entry.target[resizeHandlerSymbol](entry.target)\n    }\n  })\n})\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 's',\n      layout = 'vertical',\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n      root,\n      floats,\n      media,\n      body,\n      caption,\n      title,\n      subtitle,\n      children,\n      footer,\n      closeButton,\n      progressLine,\n      fancy,\n      imgSrcVertical,\n      imgSrcHorizontal,\n      scrollable,\n      scrollFading,\n      draggable,\n      loading,\n      className,\n      backgroundClassName,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const layoutProps = {\n      layout,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n    }\n\n    const captionProps: TextProps = {\n      ...sizeProps,\n      appearance: 'body',\n      color: 'content-onmain-tertiary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_CAPTION,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'h2',\n      appearance: 'heading',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.5em',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'p',\n      appearance: 'body',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const closeButtonProps: IconButtonProps = fancy\n      ? { icon: 'close', size: 'xxl', secondary: true }\n      : { icon: 'close', size: 'l', marginTop: 8, marginRight: 8 }\n\n    const progressLineProps: ProgressLineProps = {\n      size: 'xs',\n    }\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const scrollFadingEnabled = scrollable && scrollFading\n\n    const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n    const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n    const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n    const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n      if (e.scrollHeight === e.clientHeight) {\n        setScrollTop(null)\n        setScrollBottom(null)\n      } else {\n        setScrollTop(e.scrollTop <= 0)\n        setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n      }\n    }, [])\n\n    useLayoutEffect(() => {\n      if (contentRef && scrollFadingEnabled) {\n        contentRef[resizeHandlerSymbol] = handleScrollThresholds\n        resizeObserver.observe(contentRef)\n      }\n\n      return () => {\n        if (contentRef) {\n          resizeObserver.unobserve(contentRef)\n        }\n      }\n    }, [contentRef, scrollFadingEnabled, handleScrollThresholds])\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        {...layoutProps}\n        layouts={fancy ? LAYOUTS_FANCY : LAYOUTS}\n        className={rootClassName}\n        fancy={fancy}\n        ref={ref}\n      >\n        {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n        {isValidElement(root) ? (\n          root\n        ) : typeof root === 'function' ? (\n          root({\n            captionProps,\n            titleProps,\n            subtitleProps,\n            closeButtonProps,\n            progressLineProps,\n            onGrab,\n            onNudge,\n          })\n        ) : (\n          <>\n            {floats}\n            {draggable && (\n              <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_VERTICAL} onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            )}\n            {closeButton && (\n              <Styled.ButtonPosition>\n                {isValidElement(closeButton)\n                  ? closeButton\n                  : typeof closeButton === 'function'\n                  ? closeButton(closeButtonProps)\n                  : null}\n              </Styled.ButtonPosition>\n            )}\n            {(loading || media || imgSrcVertical) && (\n              <Styled.Media {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_MEDIA_VERTICAL : LAYOUTS_MEDIA_VERTICAL}>\n                {loading ? (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Styled.Img src={imgSrcVertical} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            )}\n            {(loading || media || imgSrcHorizontal) && (\n              <Styled.Media {...layoutProps} layouts={LAYOUTS_MEDIA_HORIZONTAL}>\n                {loading ? (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Styled.Img src={imgSrcHorizontal} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            )}\n            <Styled.Body>\n              {progressLine && !loading && (\n                <Styled.ProgressPosition {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_PROGRESS : LAYOUTS_PROGRESS}>\n                  {isValidElement(progressLine)\n                    ? progressLine\n                    : typeof progressLine === 'function'\n                    ? progressLine(progressLineProps)\n                    : null}\n                </Styled.ProgressPosition>\n              )}\n              {draggable && (\n                <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_HORIZONTAL} onPointerDown={onGrab}>\n                  <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                    <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                  </Styled.DraggingIconContainer>\n                </Styled.DraggingHandle>\n              )}\n              {fancy && <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} />}\n              {loading ? (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                    <Skeleton>\n                      <Text {...titleProps} marginBottom='1.5em' />\n                    </Skeleton>\n                    <Skeleton width='90%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='70%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='50%'>\n                      <Text {...subtitleProps} marginBottom='0.8em' />\n                    </Skeleton>\n                  </Styled.Content>\n                </Styled.Container>\n              ) : isValidElement(body) ? (\n                body\n              ) : typeof body === 'function' ? (\n                body({\n                  captionProps,\n                  titleProps,\n                  subtitleProps,\n                })\n              ) : (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  {scrollFadingEnabled && <Styled.Fading visible={scrollTop === false} />}\n                  <Styled.Content\n                    {...sizeProps}\n                    sizes={SIZES_CONTENT}\n                    ref={(ref) => {\n                      setContentRef(ref)\n                    }}\n                    scrollable={scrollable}\n                    tabIndex={scrollable ? 0 : undefined}\n                    onScroll={(evt) => {\n                      if (scrollFadingEnabled) {\n                        handleScrollThresholds(evt.currentTarget)\n                      }\n                    }}\n                    onKeyDown={(evt) => {\n                      if (keyboardKeys.ArrowUp.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, -13)\n                      } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, 13)\n                      }\n                    }}\n                  >\n                    {isValidElement(caption) ? (\n                      caption\n                    ) : typeof caption === 'function' ? (\n                      caption(captionProps)\n                    ) : typeof caption === 'string' || typeof caption === 'number' ? (\n                      <Text {...captionProps}>{caption}</Text>\n                    ) : null}\n                    {isValidElement(title) ? (\n                      title\n                    ) : typeof title === 'function' ? (\n                      title(titleProps)\n                    ) : typeof title === 'string' || typeof title === 'number' ? (\n                      <Text {...titleProps}>{title}</Text>\n                    ) : null}\n                    {isValidElement(subtitle) ? (\n                      subtitle\n                    ) : typeof subtitle === 'function' ? (\n                      subtitle(subtitleProps)\n                    ) : typeof subtitle === 'string' || typeof subtitle === 'number' ? (\n                      <Text {...subtitleProps}>{subtitle}</Text>\n                    ) : null}\n                    {children}\n                  </Styled.Content>\n                  {scrollFadingEnabled && <Styled.Fading visible={scrollBottom === false} after />}\n                  {footer && (\n                    <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n                      {footer}\n                    </Styled.Footer>\n                  )}\n                </Styled.Container>\n              )}\n            </Styled.Body>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DialogComponent }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","scrollable","scrollFading","draggable","loading","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","secondary","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","contentRef","setContentRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observe","unobserve","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","_jsx","isValidElement","_Fragment","VISIBILITY_VERTICAL","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","LAYOUTS_FANCY_MEDIA_VERTICAL","LAYOUTS_MEDIA_VERTICAL","AspectRatio","ratio","width","Skeleton","borderRadius","src","LAYOUTS_MEDIA_HORIZONTAL","height","LAYOUTS_FANCY_PROGRESS","LAYOUTS_PROGRESS","VISIBILITY_HORIZONTAL","paddingTop","SIZES_CONTAINER","SIZES_CONTENT","Text","visible","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}
+{"version":3,"file":"DialogComponent.mjs","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { useScrollThresholds } from 'hooks/useScrollThresholds'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport { AspectRatio } from 'components/AspectRatio'\nimport type { TextProps } from 'components/Text'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ProgressLineProps } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CONTAINER,\n  SIZES_CONTENT,\n  SIZES_FOOTER,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n} from './sizes'\nimport {\n  LAYOUTS,\n  LAYOUTS_FANCY,\n  LAYOUTS_MEDIA_VERTICAL,\n  LAYOUTS_FANCY_MEDIA_VERTICAL,\n  LAYOUTS_MEDIA_HORIZONTAL,\n  LAYOUTS_PROGRESS,\n  LAYOUTS_FANCY_PROGRESS,\n  VISIBILITY_VERTICAL,\n  VISIBILITY_HORIZONTAL,\n} from './layouts'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 's',\n      layout = 'vertical',\n      scrollable = false,\n      scrollFading = false,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n      root,\n      floats,\n      media,\n      body,\n      caption,\n      title,\n      subtitle,\n      children,\n      footer,\n      closeButton,\n      progressLine,\n      fancy,\n      imgSrcVertical,\n      imgSrcHorizontal,\n      draggable,\n      loading,\n      className,\n      backgroundClassName,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const layoutProps = {\n      layout,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n    }\n\n    const captionProps: TextProps = {\n      ...sizeProps,\n      appearance: 'body',\n      color: 'content-onmain-tertiary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_CAPTION,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'h2',\n      appearance: 'heading',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.5em',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'p',\n      appearance: 'body',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const closeButtonProps: IconButtonProps = fancy\n      ? { icon: 'close', size: 'xxl', secondary: true }\n      : { icon: 'close', size: 'l', marginTop: 8, marginRight: 8 }\n\n    const progressLineProps: ProgressLineProps = {\n      size: 'xs',\n    }\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const scrollFadingEnabled = scrollable && scrollFading\n\n    const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n    const { scrollThresholds, setScrollThresholds } = useScrollThresholds({\n      enabled: scrollFadingEnabled,\n      target: contentRef,\n    })\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        {...layoutProps}\n        layouts={fancy ? LAYOUTS_FANCY : LAYOUTS}\n        className={rootClassName}\n        fancy={fancy}\n        ref={ref}\n      >\n        {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n        {isValidElement(root) ? (\n          root\n        ) : typeof root === 'function' ? (\n          root({\n            captionProps,\n            titleProps,\n            subtitleProps,\n            closeButtonProps,\n            progressLineProps,\n            onGrab,\n            onNudge,\n          })\n        ) : (\n          <>\n            {floats}\n            {draggable && (\n              <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_VERTICAL} onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            )}\n            {closeButton && (\n              <Styled.ButtonPosition>\n                {isValidElement(closeButton)\n                  ? closeButton\n                  : typeof closeButton === 'function'\n                  ? closeButton(closeButtonProps)\n                  : null}\n              </Styled.ButtonPosition>\n            )}\n            {(loading || media || imgSrcVertical) && (\n              <Styled.Media {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_MEDIA_VERTICAL : LAYOUTS_MEDIA_VERTICAL}>\n                {loading ? (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Styled.Img src={imgSrcVertical} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            )}\n            {(loading || media || imgSrcHorizontal) && (\n              <Styled.Media {...layoutProps} layouts={LAYOUTS_MEDIA_HORIZONTAL}>\n                {loading ? (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Styled.Img src={imgSrcHorizontal} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            )}\n            <Styled.Body>\n              {progressLine && !loading && (\n                <Styled.ProgressPosition {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_PROGRESS : LAYOUTS_PROGRESS}>\n                  {isValidElement(progressLine)\n                    ? progressLine\n                    : typeof progressLine === 'function'\n                    ? progressLine(progressLineProps)\n                    : null}\n                </Styled.ProgressPosition>\n              )}\n              {draggable && (\n                <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_HORIZONTAL} onPointerDown={onGrab}>\n                  <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                    <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                  </Styled.DraggingIconContainer>\n                </Styled.DraggingHandle>\n              )}\n              {fancy && <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} />}\n              {loading ? (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                    <Skeleton>\n                      <Text {...titleProps} marginBottom='1.5em' />\n                    </Skeleton>\n                    <Skeleton width='90%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='70%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='50%'>\n                      <Text {...subtitleProps} marginBottom='0.8em' />\n                    </Skeleton>\n                  </Styled.Content>\n                </Styled.Container>\n              ) : isValidElement(body) ? (\n                body\n              ) : typeof body === 'function' ? (\n                body({\n                  captionProps,\n                  titleProps,\n                  subtitleProps,\n                })\n              ) : (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  {scrollFadingEnabled && <Styled.Fading visible={scrollThresholds.top === false} />}\n                  <Styled.Content\n                    {...sizeProps}\n                    sizes={SIZES_CONTENT}\n                    ref={(ref) => {\n                      setContentRef(ref)\n                    }}\n                    scrollable={scrollable}\n                    tabIndex={scrollable ? 0 : undefined}\n                    onScroll={(evt) => {\n                      if (scrollFadingEnabled) {\n                        setScrollThresholds(evt.currentTarget)\n                      }\n                    }}\n                    onKeyDown={(evt) => {\n                      if (keyboardKeys.ArrowUp.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, -13)\n                      } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, 13)\n                      }\n                    }}\n                  >\n                    {isValidElement(caption) ? (\n                      caption\n                    ) : typeof caption === 'function' ? (\n                      caption(captionProps)\n                    ) : typeof caption === 'string' || typeof caption === 'number' ? (\n                      <Text {...captionProps}>{caption}</Text>\n                    ) : null}\n                    {isValidElement(title) ? (\n                      title\n                    ) : typeof title === 'function' ? (\n                      title(titleProps)\n                    ) : typeof title === 'string' || typeof title === 'number' ? (\n                      <Text {...titleProps}>{title}</Text>\n                    ) : null}\n                    {isValidElement(subtitle) ? (\n                      subtitle\n                    ) : typeof subtitle === 'function' ? (\n                      subtitle(subtitleProps)\n                    ) : typeof subtitle === 'string' || typeof subtitle === 'number' ? (\n                      <Text {...subtitleProps}>{subtitle}</Text>\n                    ) : null}\n                    {children}\n                  </Styled.Content>\n                  {scrollFadingEnabled && <Styled.Fading visible={scrollThresholds.bottom === false} after />}\n                  {footer && (\n                    <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n                      {footer}\n                    </Styled.Footer>\n                  )}\n                </Styled.Container>\n              )}\n            </Styled.Body>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DialogComponent }\n"],"names":["DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","scrollable","scrollFading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","draggable","loading","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","secondary","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","contentRef","setContentRef","useState","scrollThresholds","setScrollThresholds","useScrollThresholds","enabled","target","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","_jsx","isValidElement","_Fragment","VISIBILITY_VERTICAL","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","LAYOUTS_FANCY_MEDIA_VERTICAL","LAYOUTS_MEDIA_VERTICAL","AspectRatio","ratio","width","Skeleton","borderRadius","src","LAYOUTS_MEDIA_HORIZONTAL","height","LAYOUTS_FANCY_PROGRESS","LAYOUTS_PROGRESS","VISIBILITY_HORIZONTAL","paddingTop","SIZES_CONTAINER","SIZES_CONTENT","Text","visible","top","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","bottom","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}

package/components/Divider/Divider.js

@@ -0,0 +1,2 @@
+'use strict';var React=require('react');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');exports.Divider=React.forwardRef(((e,r)=>jsxRuntime.jsx(style.Root,{...e,"data-ui-divider":!0,ref:r})));
+//# sourceMappingURL=Divider.js.map

package/components/Divider/Divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.js","sources":["../../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport type { DividerProps } from './types'\nimport * as Styled from './style'\n\n/**\n *\n * Компонент для создания горизонтальной разделительной линии.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n */\nconst Divider: React.ForwardRefExoticComponent<DividerProps> = forwardRef<HTMLDivElement, DividerProps>(\n  (props, ref) => <Styled.Root {...props} data-ui-divider ref={ref} />\n)\n\nexport { Divider }\n"],"names":["forwardRef","props","ref","_jsx","Styled"],"mappings":"oIAU+DA,MAAUA,YACvE,CAACC,EAAOC,IAAQC,WAAAA,IAACC,MAAAA,KAAW,IAAKH,EAAO,mBAAe,EAACC,IAAKA"}

package/components/Divider/Divider.mjs

@@ -0,0 +1,2 @@
+import{forwardRef}from'react';import{Root}from'./style.mjs';import{jsx}from'react/jsx-runtime';const Divider=forwardRef(((r,o)=>jsx(Root,{...r,"data-ui-divider":!0,ref:o})));export{Divider};
+//# sourceMappingURL=Divider.mjs.map

package/components/Divider/Divider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.mjs","sources":["../../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport type { DividerProps } from './types'\nimport * as Styled from './style'\n\n/**\n *\n * Компонент для создания горизонтальной разделительной линии.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n */\nconst Divider: React.ForwardRefExoticComponent<DividerProps> = forwardRef<HTMLDivElement, DividerProps>(\n  (props, ref) => <Styled.Root {...props} data-ui-divider ref={ref} />\n)\n\nexport { Divider }\n"],"names":["Divider","forwardRef","props","ref","_jsx","Styled"],"mappings":"+FAUA,MAAMA,QAAyDC,YAC7D,CAACC,EAAOC,IAAQC,IAACC,KAAW,IAAKH,EAAO,mBAAe,EAACC,IAAKA"}

package/components/Divider/style.js

@@ -0,0 +1,2 @@
+'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveMargin=require('../../mixins/responsive-margin.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardDividerProp=style.createShouldForwardProp();const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardDividerProp}).withConfig({displayName:"Divider__Root",componentId:"ui__sc-1mpznd4-0"})(["box-sizing:border-box;height:1px;"," ",""],(o=>`\n      background-color: ${o.color?o.theme.colors[o.color]??o.color:o.theme.colors['border-onmain-default-large']};  \n    `),responsiveMargin.responsiveMargin);exports.Root=Root;
+//# sourceMappingURL=style.js.map

package/components/Divider/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","sources":["../../../../src/components/Divider/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { DividerProps } from './types'\n\nconst shouldForwardDividerProp = createShouldForwardProp()\n\nexport const Root = styled.div.withConfig<DividerProps>({\n  shouldForwardProp: shouldForwardDividerProp,\n})`\n  box-sizing: border-box;\n  height: 1px;\n  ${(props) => `\n      background-color: ${\n        props.color ? props.theme.colors[props.color] ?? props.color : props.theme.colors['border-onmain-default-large']\n      };  \n    `}\n\n  ${responsiveMargin}\n`\n"],"names":["shouldForwardDividerProp","createShouldForwardProp","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","props","color","theme","colors","responsiveMargin"],"mappings":"qRAKA,MAAMA,yBAA2BC,MAAuBA,0BAEjD,MAAMC,KAAOC,gBAAAA,QAAOC,IAAIC,WAAyB,CACtDC,kBAAmBN,2BACnBK,WAAA,CAAAE,YAAA,gBAAAC,YAAA,oBAFkBL,CAElB,CAAA,oCAAA,IAAA,KAGGM,GAAU,6BAEPA,EAAMC,MAAQD,EAAME,MAAMC,OAAOH,EAAMC,QAAUD,EAAMC,MAAQD,EAAME,MAAMC,OAAO,2CAItFC,iBAAgBA"}

package/components/Divider/style.mjs

@@ -0,0 +1,2 @@
+import styled from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';const shouldForwardDividerProp=createShouldForwardProp();const Root=styled.div.withConfig({shouldForwardProp:shouldForwardDividerProp}).withConfig({displayName:"Divider__Root",componentId:"ui__sc-1mpznd4-0"})(["box-sizing:border-box;height:1px;"," ",""],(o=>`\n      background-color: ${o.color?o.theme.colors[o.color]??o.color:o.theme.colors['border-onmain-default-large']};  \n    `),responsiveMargin);export{Root};
+//# sourceMappingURL=style.mjs.map

package/components/Divider/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","sources":["../../../../src/components/Divider/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { DividerProps } from './types'\n\nconst shouldForwardDividerProp = createShouldForwardProp()\n\nexport const Root = styled.div.withConfig<DividerProps>({\n  shouldForwardProp: shouldForwardDividerProp,\n})`\n  box-sizing: border-box;\n  height: 1px;\n  ${(props) => `\n      background-color: ${\n        props.color ? props.theme.colors[props.color] ?? props.color : props.theme.colors['border-onmain-default-large']\n      };  \n    `}\n\n  ${responsiveMargin}\n`\n"],"names":["shouldForwardDividerProp","createShouldForwardProp","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","props","color","theme","colors","responsiveMargin"],"mappings":"yKAKA,MAAMA,yBAA2BC,0BAE1B,MAAMC,KAAOC,OAAOC,IAAIC,WAAyB,CACtDC,kBAAmBN,2BACnBK,WAAA,CAAAE,YAAA,gBAAAC,YAAA,oBAFkBL,CAElB,CAAA,oCAAA,IAAA,KAGGM,GAAU,6BAEPA,EAAMC,MAAQD,EAAME,MAAMC,OAAOH,EAAMC,QAAUD,EAAMC,MAAQD,EAAME,MAAMC,OAAO,2CAItFC"}

package/components/FormInput/FormInput.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var ResizeObserver=require('resize-observer-polyfill');var useMergedPalette=require('../../hooks/useMergedPalette.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ResizeObserver__default=_interopDefault(ResizeObserver);const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver__default.default((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));exports.FormInput=React.forwardRef(((e,r)=>{const{mask:t="",...s}=e;const a=React.useRef(null);React.useImperativeHandle(r,(()=>a.current),[]);const u=useMergedPalette.useMergedPalette(s);const[n,l]=React.useState(!1);const o=React.useCallback((e=>{l(e.scrollWidth>e.clientWidth)}),[]);return React.useLayoutEffect((()=>(a.current&&(a.current[resizeHandlerSymbol]=o,resizeObserver.observe(a.current)),()=>{a.current&&resizeObserver.unobserve(a.current)})),[o]),jsxRuntime.jsx(style.Root,{"data-input-control":!0,fading:n,children:jsxRuntime.jsx(style.Input,{...s,mask:t,palette:u,onBlur:e=>{s.onBlur&&s.onBlur(e),o(e.currentTarget)},inputRef:e=>{a.current=e}})})}));
+'use strict';var React=require('react');var useMergedPalette=require('../../hooks/useMergedPalette.js');var useResizeObserver=require('../../hooks/useResizeObserver.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');exports.FormInput=React.forwardRef(((e,t)=>{const{mask:r="",...s}=e;const u=React.useRef(null);React.useImperativeHandle(t,(()=>u.current),[]);const a=useMergedPalette.useMergedPalette(s);const[n,i]=React.useState(!1);const c=React.useCallback((e=>{i(e.scrollWidth>e.clientWidth)}),[]);return useResizeObserver.useResizeObserver({target:u,onResize:c}),jsxRuntime.jsx(style.Root,{"data-input-control":!0,fading:n,children:jsxRuntime.jsx(style.Input,{...s,mask:r,palette:a,onBlur:e=>{s.onBlur&&s.onBlur(e),c(e.currentTarget)},inputRef:e=>{u.current=e}})})}));
 //# sourceMappingURL=FormInput.js.map

package/components/FormInput/FormInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormInput.js","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useLayoutEffect, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { useMergedPalette } from 'hooks/useMergedPalette'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n  entries.forEach((entry) => {\n    if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n      entry.target[resizeHandlerSymbol](entry.target)\n    }\n  })\n})\n\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = forwardRef((props, forwardRef) => {\n  const { mask = '', ...inputProps } = props\n\n  const inputRef = useRef<HTMLInputElement | null>(null)\n  useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardRef, () => inputRef.current, [])\n\n  const palette = useMergedPalette(inputProps)\n\n  const [overflow, setOverflow] = useState<boolean>(false)\n\n  const handleDetectOverflow = useCallback((e: HTMLInputElement) => {\n    setOverflow(e.scrollWidth > e.clientWidth)\n  }, [])\n\n  useLayoutEffect(() => {\n    if (inputRef.current) {\n      inputRef.current[resizeHandlerSymbol] = handleDetectOverflow\n      resizeObserver.observe(inputRef.current)\n    }\n    return () => {\n      if (inputRef.current) {\n        resizeObserver.unobserve(inputRef.current)\n      }\n    }\n  }, [handleDetectOverflow])\n\n  return (\n    <Styled.Root data-input-control fading={overflow}>\n      <Styled.Input\n        {...inputProps}\n        mask={mask}\n        palette={palette}\n        onBlur={(evt) => {\n          if (inputProps.onBlur) inputProps.onBlur(evt)\n\n          handleDetectOverflow(evt.currentTarget)\n        }}\n        inputRef={(input) => {\n          inputRef.current = input\n        }}\n      />\n    </Styled.Root>\n  )\n})\n\nexport { FormInput }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","default","entries","forEach","entry","target","forwardRef","props","mask","inputProps","inputRef","useRef","useImperativeHandle","current","palette","useMergedPalette","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useLayoutEffect","observe","unobserve","_jsx","Styled","fading","children","jsx","onBlur","evt","currentTarget","input"],"mappings":"wWAMA,MAAMA,oBAAsBC,OAAO,kBAEnC,MAAMC,eAAiB,IAAIC,wBAAcC,SAAEC,IACzCA,EAAQC,SAASC,WACJA,EAAMC,OAAOR,sBAAyB,YAC/CO,EAAMC,OAAOR,qBAAqBO,EAAMC,OAC1C,GACA,sBAG+DC,MAAUA,YAAC,CAACC,EAAOD,KACpF,MAAME,KAAEA,EAAO,MAAOC,GAAeF,EAErC,MAAMG,EAAWC,aAAgC,MACjDC,MAAAA,oBAAsEN,GAAY,IAAMI,EAASG,SAAS,IAE1G,MAAMC,EAAUC,kCAAiBN,GAEjC,MAAOO,EAAUC,GAAeC,MAAQA,UAAU,GAElD,MAAMC,EAAuBC,MAAWA,aAAEC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAcH,OAZAC,MAAAA,iBAAgB,KACVd,EAASG,UACXH,EAASG,QAAQhB,qBAAuBsB,EACxCpB,eAAe0B,QAAQf,EAASG,UAE3B,KACDH,EAASG,SACXd,eAAe2B,UAAUhB,EAASG,QACpC,IAED,CAACM,IAGFQ,WAAAA,IAACC,MAAAA,KAAW,CAAC,sBAAkB,EAACC,OAAQb,EAASc,SAC/CH,WAAAI,IAACH,YAAY,IACPnB,EACJD,KAAMA,EACNM,QAASA,EACTkB,OAASC,IACHxB,EAAWuB,QAAQvB,EAAWuB,OAAOC,GAEzCd,EAAqBc,EAAIC,cAAc,EAEzCxB,SAAWyB,IACTzB,EAASG,QAAUsB,CAAK,KAGhB"}
+{"version":3,"file":"FormInput.js","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useState, useCallback } from 'react'\nimport { useMergedPalette } from 'hooks/useMergedPalette'\nimport { useResizeObserver } from 'hooks/useResizeObserver'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = forwardRef((props, forwardRef) => {\n  const { mask = '', ...inputProps } = props\n\n  const inputRef = useRef<HTMLInputElement | null>(null)\n  useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardRef, () => inputRef.current, [])\n\n  const palette = useMergedPalette(inputProps)\n\n  const [overflow, setOverflow] = useState<boolean>(false)\n\n  const handleDetectOverflow = useCallback((e: HTMLInputElement) => {\n    setOverflow(e.scrollWidth > e.clientWidth)\n  }, [])\n\n  useResizeObserver({\n    target: inputRef,\n    onResize: handleDetectOverflow,\n  })\n\n  return (\n    <Styled.Root data-input-control fading={overflow}>\n      <Styled.Input\n        {...inputProps}\n        mask={mask}\n        palette={palette}\n        onBlur={(evt) => {\n          if (inputProps.onBlur) inputProps.onBlur(evt)\n\n          handleDetectOverflow(evt.currentTarget)\n        }}\n        inputRef={(input) => {\n          inputRef.current = input\n        }}\n      />\n    </Styled.Root>\n  )\n})\n\nexport { FormInput }\n"],"names":["forwardRef","props","mask","inputProps","inputRef","useRef","useImperativeHandle","current","palette","useMergedPalette","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useResizeObserver","target","onResize","_jsx","Styled","fading","children","jsx","onBlur","evt","currentTarget","input"],"mappings":"wQAMmEA,MAAUA,YAAC,CAACC,EAAOD,KACpF,MAAME,KAAEA,EAAO,MAAOC,GAAeF,EAErC,MAAMG,EAAWC,aAAgC,MACjDC,MAAAA,oBAAsEN,GAAY,IAAMI,EAASG,SAAS,IAE1G,MAAMC,EAAUC,kCAAiBN,GAEjC,MAAOO,EAAUC,GAAeC,MAAQA,UAAU,GAElD,MAAMC,EAAuBC,MAAWA,aAAEC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAOH,OALAC,oCAAkB,CAChBC,OAAQf,EACRgB,SAAUP,IAIVQ,WAAAA,IAACC,MAAAA,KAAW,CAAC,sBAAkB,EAACC,OAAQb,EAASc,SAC/CH,WAAAI,IAACH,YAAY,IACPnB,EACJD,KAAMA,EACNM,QAASA,EACTkB,OAASC,IACHxB,EAAWuB,QAAQvB,EAAWuB,OAAOC,GAEzCd,EAAqBc,EAAIC,cAAc,EAEzCxB,SAAWyB,IACTzB,EAASG,QAAUsB,CAAK,KAGhB"}

package/components/FormInput/FormInput.mjs

@@ -1,2 +1,2 @@
-import{forwardRef,useRef,useImperativeHandle,useState,useCallback,useLayoutEffect}from'react';import ResizeObserver from'resize-observer-polyfill';import{useMergedPalette}from'../../hooks/useMergedPalette.mjs';import{Root,Input}from'./style.mjs';import{jsx}from'react/jsx-runtime';const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const FormInput=forwardRef(((e,r)=>{const{mask:t="",...s}=e;const o=useRef(null);useImperativeHandle(r,(()=>o.current),[]);const n=useMergedPalette(s);const[u,a]=useState(!1);const l=useCallback((e=>{a(e.scrollWidth>e.clientWidth)}),[]);return useLayoutEffect((()=>(o.current&&(o.current[resizeHandlerSymbol]=l,resizeObserver.observe(o.current)),()=>{o.current&&resizeObserver.unobserve(o.current)})),[l]),jsx(Root,{"data-input-control":!0,fading:u,children:jsx(Input,{...s,mask:t,palette:n,onBlur:e=>{s.onBlur&&s.onBlur(e),l(e.currentTarget)},inputRef:e=>{o.current=e}})})}));export{FormInput};
+import{forwardRef,useRef,useImperativeHandle,useState,useCallback}from'react';import{useMergedPalette}from'../../hooks/useMergedPalette.mjs';import{useResizeObserver}from'../../hooks/useResizeObserver.mjs';import{Root,Input}from'./style.mjs';import{jsx}from'react/jsx-runtime';const FormInput=forwardRef(((e,t)=>{const{mask:r="",...s}=e;const o=useRef(null);useImperativeHandle(t,(()=>o.current),[]);const u=useMergedPalette(s);const[n,a]=useState(!1);const l=useCallback((e=>{a(e.scrollWidth>e.clientWidth)}),[]);return useResizeObserver({target:o,onResize:l}),jsx(Root,{"data-input-control":!0,fading:n,children:jsx(Input,{...s,mask:r,palette:u,onBlur:e=>{s.onBlur&&s.onBlur(e),l(e.currentTarget)},inputRef:e=>{o.current=e}})})}));export{FormInput};
 //# sourceMappingURL=FormInput.mjs.map

package/components/FormInput/FormInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FormInput.mjs","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useLayoutEffect, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { useMergedPalette } from 'hooks/useMergedPalette'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n  entries.forEach((entry) => {\n    if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n      entry.target[resizeHandlerSymbol](entry.target)\n    }\n  })\n})\n\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = forwardRef((props, forwardRef) => {\n  const { mask = '', ...inputProps } = props\n\n  const inputRef = useRef<HTMLInputElement | null>(null)\n  useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardRef, () => inputRef.current, [])\n\n  const palette = useMergedPalette(inputProps)\n\n  const [overflow, setOverflow] = useState<boolean>(false)\n\n  const handleDetectOverflow = useCallback((e: HTMLInputElement) => {\n    setOverflow(e.scrollWidth > e.clientWidth)\n  }, [])\n\n  useLayoutEffect(() => {\n    if (inputRef.current) {\n      inputRef.current[resizeHandlerSymbol] = handleDetectOverflow\n      resizeObserver.observe(inputRef.current)\n    }\n    return () => {\n      if (inputRef.current) {\n        resizeObserver.unobserve(inputRef.current)\n      }\n    }\n  }, [handleDetectOverflow])\n\n  return (\n    <Styled.Root data-input-control fading={overflow}>\n      <Styled.Input\n        {...inputProps}\n        mask={mask}\n        palette={palette}\n        onBlur={(evt) => {\n          if (inputProps.onBlur) inputProps.onBlur(evt)\n\n          handleDetectOverflow(evt.currentTarget)\n        }}\n        inputRef={(input) => {\n          inputRef.current = input\n        }}\n      />\n    </Styled.Root>\n  )\n})\n\nexport { FormInput }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","entries","forEach","entry","target","FormInput","forwardRef","props","mask","inputProps","inputRef","useRef","useImperativeHandle","current","palette","useMergedPalette","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useLayoutEffect","observe","unobserve","_jsx","Styled","fading","children","onBlur","evt","currentTarget","input"],"mappings":"yRAMA,MAAMA,oBAAsBC,OAAO,kBAEnC,MAAMC,eAAiB,IAAIC,gBAAgBC,IACzCA,EAAQC,SAASC,WACJA,EAAMC,OAAOP,sBAAyB,YAC/CM,EAAMC,OAAOP,qBAAqBM,EAAMC,OAC1C,GACA,IAGEC,MAAAA,UAA6DC,YAAW,CAACC,EAAOD,KACpF,MAAME,KAAEA,EAAO,MAAOC,GAAeF,EAErC,MAAMG,EAAWC,OAAgC,MACjDC,oBAAsEN,GAAY,IAAMI,EAASG,SAAS,IAE1G,MAAMC,EAAUC,iBAAiBN,GAEjC,MAAOO,EAAUC,GAAeC,UAAkB,GAElD,MAAMC,EAAuBC,aAAaC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAcH,OAZAC,iBAAgB,KACVd,EAASG,UACXH,EAASG,QAAQhB,qBAAuBsB,EACxCpB,eAAe0B,QAAQf,EAASG,UAE3B,KACDH,EAASG,SACXd,eAAe2B,UAAUhB,EAASG,QACpC,IAED,CAACM,IAGFQ,IAACC,KAAW,CAAC,sBAAkB,EAACC,OAAQb,EAASc,SAC/CH,IAACC,MAAY,IACPnB,EACJD,KAAMA,EACNM,QAASA,EACTiB,OAASC,IACHvB,EAAWsB,QAAQtB,EAAWsB,OAAOC,GAEzCb,EAAqBa,EAAIC,cAAc,EAEzCvB,SAAWwB,IACTxB,EAASG,QAAUqB,CAAK,KAGhB"}
+{"version":3,"file":"FormInput.mjs","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useState, useCallback } from 'react'\nimport { useMergedPalette } from 'hooks/useMergedPalette'\nimport { useResizeObserver } from 'hooks/useResizeObserver'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = forwardRef((props, forwardRef) => {\n  const { mask = '', ...inputProps } = props\n\n  const inputRef = useRef<HTMLInputElement | null>(null)\n  useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardRef, () => inputRef.current, [])\n\n  const palette = useMergedPalette(inputProps)\n\n  const [overflow, setOverflow] = useState<boolean>(false)\n\n  const handleDetectOverflow = useCallback((e: HTMLInputElement) => {\n    setOverflow(e.scrollWidth > e.clientWidth)\n  }, [])\n\n  useResizeObserver({\n    target: inputRef,\n    onResize: handleDetectOverflow,\n  })\n\n  return (\n    <Styled.Root data-input-control fading={overflow}>\n      <Styled.Input\n        {...inputProps}\n        mask={mask}\n        palette={palette}\n        onBlur={(evt) => {\n          if (inputProps.onBlur) inputProps.onBlur(evt)\n\n          handleDetectOverflow(evt.currentTarget)\n        }}\n        inputRef={(input) => {\n          inputRef.current = input\n        }}\n      />\n    </Styled.Root>\n  )\n})\n\nexport { FormInput }\n"],"names":["FormInput","forwardRef","props","mask","inputProps","inputRef","useRef","useImperativeHandle","current","palette","useMergedPalette","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useResizeObserver","target","onResize","_jsx","Styled","fading","children","onBlur","evt","currentTarget","input"],"mappings":"qRAMMA,MAAAA,UAA6DC,YAAW,CAACC,EAAOD,KACpF,MAAME,KAAEA,EAAO,MAAOC,GAAeF,EAErC,MAAMG,EAAWC,OAAgC,MACjDC,oBAAsEN,GAAY,IAAMI,EAASG,SAAS,IAE1G,MAAMC,EAAUC,iBAAiBN,GAEjC,MAAOO,EAAUC,GAAeC,UAAkB,GAElD,MAAMC,EAAuBC,aAAaC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAOH,OALAC,kBAAkB,CAChBC,OAAQf,EACRgB,SAAUP,IAIVQ,IAACC,KAAW,CAAC,sBAAkB,EAACC,OAAQb,EAASc,SAC/CH,IAACC,MAAY,IACPnB,EACJD,KAAMA,EACNM,QAASA,EACTiB,OAASC,IACHvB,EAAWsB,QAAQtB,EAAWsB,OAAOC,GAEzCb,EAAqBa,EAAIC,cAAc,EAEzCvB,SAAWwB,IACTxB,EAASG,QAAUqB,CAAK,KAGhB"}