@foxford/ui 2.74.0 → 2.75.0-beta-9c898b3-20250515

package/components/Accordion/Accordion.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var nanoid=require('nanoid');var withMergedProps=require('../../hocs/withMergedProps.js');var constants=require('./constants.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');const Accordion=withMergedProps.withMergedProps(React.forwardRef(((e,s)=>{const{size:t="m",iconProps:n={},titleProps:i={},subtitleProps:a={},defaultExpanded:o=!1,sizeXXS:r,sizeXS:c,sizeS:d,sizeM:l,sizeL:p,sizeXL:x,expanded:u,onExpandedChange:j,children:m,icon:R,imgSrc:S,title:h,subtitle:y,addon:z,loading:b,headingAs:g,disabled:v,...E}=e;const I={size:t,sizeXXS:r,sizeXS:c,sizeS:d,sizeM:l,sizeL:p,sizeXL:x};const T=React.isValidElement(z)&&typeof z.props=='object'&&z.props!==null?z.props:{};const[f,k]=React.useState(u??o);const[w,q]=React.useState(u??f);const L=React.useMemo((()=>nanoid.nanoid()),[]);const M=React.useMemo((()=>nanoid.nanoid()),[]);return React.useLayoutEffect((()=>{u!==void 0&&k(u)}),[u]),React.useLayoutEffect((()=>{f&&q(!0)}),[f]),jsxRuntime.jsxs(style.Root,{...E,...I,expanded:f,ref:s,children:[jsxRuntime.jsx(style.Heading,{as:g,children:jsxRuntime.jsxs(style.Button,{id:L,type:"button","aria-controls":M,"aria-expanded":w,"aria-disabled":w&&(v||u!==void 0&&!j),expanded:f,disabled:v,loading:b,palette:E.palette,onClick:()=>{const e=!f;u===void 0&&k(e),j&&j(e)},children:[R&&!b&&jsxRuntime.jsx(style.Spacer,{children:jsxRuntime.jsx(Icon.Icon,{preset:"brand",name:typeof R=='string'?R:void 0,icon:typeof R!='string'?R:void 0,sizes:constants.SIZES_ICON,...I,...n})}),S&&jsxRuntime.jsx(style.Media,{src:b?void 0:S,children:b&&jsxRuntime.jsx(Skeleton.Skeleton,{as:"span",width:"100%",height:"100%",borderRadius:"inherit"})}),z&&jsxRuntime.jsx(style.Spacer,{stretch:!0,children:React.isValidElement(z)?React.cloneElement(z,{...I,...T}):typeof z=='function'?z(I):z}),jsxRuntime.jsxs(style.Content,{children:[b?jsxRuntime.jsx(Skeleton.Skeleton,{as:"span",borderRadius:4,children:jsxRuntime.jsx(Text.Text,{as:"span",appearance:"subheading-compact",sizes:constants.SIZES_TITLE,...I,...i})}):jsxRuntime.jsx(Text.Text,{as:"span",appearance:"subheading-compact",wordBreak:"break-word",color:"inherit",sizes:constants.SIZES_TITLE,...I,...i,children:h}),y&&!b&&jsxRuntime.jsx(Text.Text,{as:"span",appearance:"body",wordBreak:"break-word",color:"content-onmain-tertiary",marginTop:h?'0.2em':void 0,sizes:constants.SIZES_SUBTITLE,...I,...a,children:y})]}),jsxRuntime.jsx(style.IconAnimated,{...I,preset:"brand",name:"chevronDown",sizes:constants.SIZES_ICON,up:f})]})}),jsxRuntime.jsx(style.Panel,{id:M,role:"region","aria-labelledby":L,hidden:!w,onTransitionEnd:e=>{e.propertyName!=='opacity'||f||q(!1)},children:jsxRuntime.jsx(style.Details,{children:m})})]})})),{displayName:'Accordion',sizes:constants.SIZES});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 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;
 //# 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, useState, isValidElement, cloneElement, useLayoutEffect, useMemo } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Text } from 'components/Text'\nimport { Skeleton } from 'components/Skeleton'\nimport { SIZES, SIZES_ICON, SIZES_TITLE, SIZES_SUBTITLE } from './constants'\nimport type { AccordionProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Accordion'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<section\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Accordion/types.ts).\n */\nconst Accordion: React.ForwardRefExoticComponent<AccordionProps> = withMergedProps<AccordionProps, HTMLElement>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      iconProps = {},\n      titleProps = {},\n      subtitleProps = {},\n      defaultExpanded = false,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      expanded,\n      onExpandedChange,\n      children,\n      icon,\n      imgSrc,\n      title,\n      subtitle,\n      addon,\n      loading,\n      headingAs,\n      disabled,\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 addonProps =\n      isValidElement(addon) && typeof addon.props === 'object' && addon.props !== null ? addon.props : {}\n\n    const [panelExpanded, setPanelExpanded] = useState<boolean>(expanded ?? defaultExpanded)\n    const [panelVisible, setPanelVisible] = useState<boolean>(expanded ?? panelExpanded)\n\n    const controlId = useMemo(() => nanoid(), [])\n    const panelId = useMemo(() => nanoid(), [])\n\n    useLayoutEffect(() => {\n      if (expanded !== undefined) setPanelExpanded(expanded)\n    }, [expanded])\n\n    useLayoutEffect(() => {\n      if (panelExpanded) setPanelVisible(true)\n    }, [panelExpanded])\n\n    return (\n      <Styled.Root {...restProps} {...sizeProps} expanded={panelExpanded} ref={ref}>\n        <Styled.Heading as={headingAs}>\n          <Styled.Button\n            id={controlId}\n            type='button'\n            aria-controls={panelId}\n            aria-expanded={panelVisible}\n            aria-disabled={panelVisible && (disabled || (expanded !== undefined && !onExpandedChange))}\n            expanded={panelExpanded}\n            disabled={disabled}\n            loading={loading}\n            palette={restProps.palette}\n            onClick={() => {\n              const update = !panelExpanded\n\n              if (expanded === undefined) setPanelExpanded(update)\n              if (onExpandedChange) onExpandedChange(update)\n            }}\n          >\n            {icon && !loading && (\n              <Styled.Spacer>\n                <Icon\n                  preset='brand'\n                  name={typeof icon === 'string' ? icon : undefined}\n                  icon={typeof icon !== 'string' ? icon : undefined}\n                  sizes={SIZES_ICON}\n                  {...sizeProps}\n                  {...iconProps}\n                />\n              </Styled.Spacer>\n            )}\n            {imgSrc && (\n              <Styled.Media src={loading ? undefined : imgSrc}>\n                {loading && <Skeleton as='span' width='100%' height='100%' borderRadius='inherit' />}\n              </Styled.Media>\n            )}\n            {addon && (\n              <Styled.Spacer stretch>\n                {isValidElement(addon)\n                  ? cloneElement(addon, { ...sizeProps, ...addonProps })\n                  : typeof addon === 'function'\n                  ? addon(sizeProps)\n                  : addon}\n              </Styled.Spacer>\n            )}\n            <Styled.Content>\n              {loading ? (\n                <Skeleton as='span' borderRadius={4}>\n                  <Text as='span' appearance='subheading-compact' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n                </Skeleton>\n              ) : (\n                <Text\n                  as='span'\n                  appearance='subheading-compact'\n                  wordBreak='break-word'\n                  color='inherit'\n                  sizes={SIZES_TITLE}\n                  {...sizeProps}\n                  {...titleProps}\n                >\n                  {title}\n                </Text>\n              )}\n              {subtitle && !loading && (\n                <Text\n                  as='span'\n                  appearance='body'\n                  wordBreak='break-word'\n                  color='content-onmain-tertiary'\n                  marginTop={title ? '0.2em' : undefined}\n                  sizes={SIZES_SUBTITLE}\n                  {...sizeProps}\n                  {...subtitleProps}\n                >\n                  {subtitle}\n                </Text>\n              )}\n            </Styled.Content>\n            <Styled.IconAnimated\n              {...sizeProps}\n              preset='brand'\n              name='chevronDown'\n              sizes={SIZES_ICON}\n              up={panelExpanded}\n            />\n          </Styled.Button>\n        </Styled.Heading>\n        <Styled.Panel\n          id={panelId}\n          role='region'\n          aria-labelledby={controlId}\n          hidden={!panelVisible}\n          onTransitionEnd={(evt) => {\n            if (evt.propertyName === 'opacity' && !panelExpanded) {\n              setPanelVisible(false)\n            }\n          }}\n        >\n          <Styled.Details>{children}</Styled.Details>\n        </Styled.Panel>\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: SIZES,\n  }\n)\n\nexport { Accordion }\n"],"names":["Accordion","withMergedProps","forwardRef","props","ref","size","iconProps","titleProps","subtitleProps","defaultExpanded","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","expanded","onExpandedChange","children","icon","imgSrc","title","subtitle","addon","loading","headingAs","disabled","restProps","sizeProps","addonProps","isValidElement","panelExpanded","setPanelExpanded","useState","panelVisible","setPanelVisible","controlId","useMemo","nanoid","panelId","useLayoutEffect","undefined","_jsxs","Styled","_jsx","jsx","as","jsxs","id","type","palette","onClick","update","Icon","preset","name","sizes","SIZES_ICON","src","Skeleton","width","height","borderRadius","stretch","cloneElement","Text","appearance","SIZES_TITLE","wordBreak","color","marginTop","SIZES_SUBTITLE","up","role","hidden","onTransitionEnd","evt","propertyName","displayName","SIZES"],"mappings":"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"}
+{"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"}

package/components/Accordion/Accordion.mjs

@@ -1,2 +1,2 @@
-import{forwardRef,isValidElement,useState,useMemo,useLayoutEffect,cloneElement}from'react';import{nanoid}from'nanoid';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES,SIZES_ICON,SIZES_TITLE,SIZES_SUBTITLE}from'./constants.mjs';import{Root,Heading,Button,Spacer,Media,Content,IconAnimated,Panel,Details}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';const Accordion=withMergedProps(forwardRef(((e,o)=>{const{size:s="m",iconProps:n={},titleProps:i={},subtitleProps:t={},defaultExpanded:r=!1,sizeXXS:a,sizeXS:d,sizeS:c,sizeM:p,sizeL:l,sizeXL:m,expanded:S,onExpandedChange:x,children:h,icon:u,imgSrc:f,title:j,subtitle:E,addon:I,loading:z,headingAs:b,disabled:T,...g}=e;const y={size:s,sizeXXS:a,sizeXS:d,sizeS:c,sizeM:p,sizeL:l,sizeXL:m};const L=isValidElement(I)&&typeof I.props=='object'&&I.props!==null?I.props:{};const[w,k]=useState(S??r);const[M,Z]=useState(S??w);const v=useMemo((()=>nanoid()),[]);const P=useMemo((()=>nanoid()),[]);return useLayoutEffect((()=>{S!==void 0&&k(S)}),[S]),useLayoutEffect((()=>{w&&Z(!0)}),[w]),jsxs(Root,{...g,...y,expanded:w,ref:o,children:[jsx(Heading,{as:b,children:jsxs(Button,{id:v,type:"button","aria-controls":P,"aria-expanded":M,"aria-disabled":M&&(T||S!==void 0&&!x),expanded:w,disabled:T,loading:z,palette:g.palette,onClick:()=>{const e=!w;S===void 0&&k(e),x&&x(e)},children:[u&&!z&&jsx(Spacer,{children:jsx(Icon,{preset:"brand",name:typeof u=='string'?u:void 0,icon:typeof u!='string'?u:void 0,sizes:SIZES_ICON,...y,...n})}),f&&jsx(Media,{src:z?void 0:f,children:z&&jsx(Skeleton,{as:"span",width:"100%",height:"100%",borderRadius:"inherit"})}),I&&jsx(Spacer,{stretch:!0,children:isValidElement(I)?cloneElement(I,{...y,...L}):typeof I=='function'?I(y):I}),jsxs(Content,{children:[z?jsx(Skeleton,{as:"span",borderRadius:4,children:jsx(Text,{as:"span",appearance:"subheading-compact",sizes:SIZES_TITLE,...y,...i})}):jsx(Text,{as:"span",appearance:"subheading-compact",wordBreak:"break-word",color:"inherit",sizes:SIZES_TITLE,...y,...i,children:j}),E&&!z&&jsx(Text,{as:"span",appearance:"body",wordBreak:"break-word",color:"content-onmain-tertiary",marginTop:j?'0.2em':void 0,sizes:SIZES_SUBTITLE,...y,...t,children:E})]}),jsx(IconAnimated,{...y,preset:"brand",name:"chevronDown",sizes:SIZES_ICON,up:w})]})}),jsx(Panel,{id:P,role:"region","aria-labelledby":v,hidden:!M,onTransitionEnd:e=>{e.propertyName!=='opacity'||w||Z(!1)},children:jsx(Details,{children:h})})]})})),{displayName:'Accordion',sizes:SIZES});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{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};
 //# 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, useState, isValidElement, cloneElement, useLayoutEffect, useMemo } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Text } from 'components/Text'\nimport { Skeleton } from 'components/Skeleton'\nimport { SIZES, SIZES_ICON, SIZES_TITLE, SIZES_SUBTITLE } from './constants'\nimport type { AccordionProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Accordion'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<section\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Accordion/types.ts).\n */\nconst Accordion: React.ForwardRefExoticComponent<AccordionProps> = withMergedProps<AccordionProps, HTMLElement>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      iconProps = {},\n      titleProps = {},\n      subtitleProps = {},\n      defaultExpanded = false,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      expanded,\n      onExpandedChange,\n      children,\n      icon,\n      imgSrc,\n      title,\n      subtitle,\n      addon,\n      loading,\n      headingAs,\n      disabled,\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 addonProps =\n      isValidElement(addon) && typeof addon.props === 'object' && addon.props !== null ? addon.props : {}\n\n    const [panelExpanded, setPanelExpanded] = useState<boolean>(expanded ?? defaultExpanded)\n    const [panelVisible, setPanelVisible] = useState<boolean>(expanded ?? panelExpanded)\n\n    const controlId = useMemo(() => nanoid(), [])\n    const panelId = useMemo(() => nanoid(), [])\n\n    useLayoutEffect(() => {\n      if (expanded !== undefined) setPanelExpanded(expanded)\n    }, [expanded])\n\n    useLayoutEffect(() => {\n      if (panelExpanded) setPanelVisible(true)\n    }, [panelExpanded])\n\n    return (\n      <Styled.Root {...restProps} {...sizeProps} expanded={panelExpanded} ref={ref}>\n        <Styled.Heading as={headingAs}>\n          <Styled.Button\n            id={controlId}\n            type='button'\n            aria-controls={panelId}\n            aria-expanded={panelVisible}\n            aria-disabled={panelVisible && (disabled || (expanded !== undefined && !onExpandedChange))}\n            expanded={panelExpanded}\n            disabled={disabled}\n            loading={loading}\n            palette={restProps.palette}\n            onClick={() => {\n              const update = !panelExpanded\n\n              if (expanded === undefined) setPanelExpanded(update)\n              if (onExpandedChange) onExpandedChange(update)\n            }}\n          >\n            {icon && !loading && (\n              <Styled.Spacer>\n                <Icon\n                  preset='brand'\n                  name={typeof icon === 'string' ? icon : undefined}\n                  icon={typeof icon !== 'string' ? icon : undefined}\n                  sizes={SIZES_ICON}\n                  {...sizeProps}\n                  {...iconProps}\n                />\n              </Styled.Spacer>\n            )}\n            {imgSrc && (\n              <Styled.Media src={loading ? undefined : imgSrc}>\n                {loading && <Skeleton as='span' width='100%' height='100%' borderRadius='inherit' />}\n              </Styled.Media>\n            )}\n            {addon && (\n              <Styled.Spacer stretch>\n                {isValidElement(addon)\n                  ? cloneElement(addon, { ...sizeProps, ...addonProps })\n                  : typeof addon === 'function'\n                  ? addon(sizeProps)\n                  : addon}\n              </Styled.Spacer>\n            )}\n            <Styled.Content>\n              {loading ? (\n                <Skeleton as='span' borderRadius={4}>\n                  <Text as='span' appearance='subheading-compact' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n                </Skeleton>\n              ) : (\n                <Text\n                  as='span'\n                  appearance='subheading-compact'\n                  wordBreak='break-word'\n                  color='inherit'\n                  sizes={SIZES_TITLE}\n                  {...sizeProps}\n                  {...titleProps}\n                >\n                  {title}\n                </Text>\n              )}\n              {subtitle && !loading && (\n                <Text\n                  as='span'\n                  appearance='body'\n                  wordBreak='break-word'\n                  color='content-onmain-tertiary'\n                  marginTop={title ? '0.2em' : undefined}\n                  sizes={SIZES_SUBTITLE}\n                  {...sizeProps}\n                  {...subtitleProps}\n                >\n                  {subtitle}\n                </Text>\n              )}\n            </Styled.Content>\n            <Styled.IconAnimated\n              {...sizeProps}\n              preset='brand'\n              name='chevronDown'\n              sizes={SIZES_ICON}\n              up={panelExpanded}\n            />\n          </Styled.Button>\n        </Styled.Heading>\n        <Styled.Panel\n          id={panelId}\n          role='region'\n          aria-labelledby={controlId}\n          hidden={!panelVisible}\n          onTransitionEnd={(evt) => {\n            if (evt.propertyName === 'opacity' && !panelExpanded) {\n              setPanelVisible(false)\n            }\n          }}\n        >\n          <Styled.Details>{children}</Styled.Details>\n        </Styled.Panel>\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: SIZES,\n  }\n)\n\nexport { Accordion }\n"],"names":["Accordion","withMergedProps","forwardRef","props","ref","size","iconProps","titleProps","subtitleProps","defaultExpanded","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","expanded","onExpandedChange","children","icon","imgSrc","title","subtitle","addon","loading","headingAs","disabled","restProps","sizeProps","addonProps","isValidElement","panelExpanded","setPanelExpanded","useState","panelVisible","setPanelVisible","controlId","useMemo","nanoid","panelId","useLayoutEffect","undefined","_jsxs","Styled","_jsx","as","id","type","palette","onClick","update","Icon","preset","name","sizes","SIZES_ICON","src","Skeleton","width","height","borderRadius","stretch","cloneElement","Text","appearance","SIZES_TITLE","wordBreak","color","marginTop","SIZES_SUBTITLE","up","role","hidden","onTransitionEnd","evt","propertyName","displayName","SIZES"],"mappings":"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"}
+{"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"}

package/components/Accordion/AccordionDivider.js

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

package/components/Accordion/AccordionDivider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionDivider.js","sources":["../../../../src/components/Accordion/AccordionDivider.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport type { AccordionDividerProps } from './types'\nimport * as Styled from './style'\n\nconst AccordionDivider: React.ForwardRefExoticComponent<AccordionDividerProps> = forwardRef<\n  HTMLDivElement,\n  AccordionDividerProps\n>((props, ref) => <Styled.Divider {...props} ref={ref} />)\n\nexport { AccordionDivider }\n"],"names":["forwardRef","props","ref","_jsx","Styled"],"mappings":"6IAIiFA,MAAUA,YAGzF,CAACC,EAAOC,IAAQC,WAAAA,IAACC,MAAAA,QAAc,IAAKH,EAAOC,IAAKA"}

package/components/Accordion/AccordionDivider.mjs

@@ -0,0 +1,2 @@
+import{forwardRef}from'react';import{Divider}from'./style.mjs';import{jsx}from'react/jsx-runtime';const AccordionDivider=forwardRef(((r,i)=>jsx(Divider,{...r,ref:i})));export{AccordionDivider};
+//# sourceMappingURL=AccordionDivider.mjs.map

package/components/Accordion/AccordionDivider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionDivider.mjs","sources":["../../../../src/components/Accordion/AccordionDivider.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport type { AccordionDividerProps } from './types'\nimport * as Styled from './style'\n\nconst AccordionDivider: React.ForwardRefExoticComponent<AccordionDividerProps> = forwardRef<\n  HTMLDivElement,\n  AccordionDividerProps\n>((props, ref) => <Styled.Divider {...props} ref={ref} />)\n\nexport { AccordionDivider }\n"],"names":["AccordionDivider","forwardRef","props","ref","_jsx","Styled"],"mappings":"kGAIA,MAAMA,iBAA2EC,YAG/E,CAACC,EAAOC,IAAQC,IAACC,QAAc,IAAKH,EAAOC,IAAKA"}

package/components/Accordion/hooks.js

@@ -0,0 +1,2 @@
+'use strict';var React=require('react');exports.useAccordion=({defaultExpanded:e=[],expanded:t,multiple:a,collapsible:n,onExpandedChange:d})=>{const[o,r]=React.useState((()=>{const n=t??e;return!a&&n.length>1?[n[0]]:n}));return React.useLayoutEffect((()=>{t!==void 0&&r(t)}),[t]),{expandedPanels:o,updatePanels:(e,c)=>{if(c){const n=a?[...o,e]:[e];return t===void 0&&r(n),void(d&&d(n))}if(n){const n=a?o.filter((t=>t!==e)):[];t===void 0&&r(n),d&&d(n)}}}};
+//# sourceMappingURL=hooks.js.map

package/components/Accordion/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sources":["../../../../src/components/Accordion/hooks.ts"],"sourcesContent":["import { useState, useLayoutEffect } from 'react'\nimport type { AccordionProps } from './types'\n\nexport const useAccordion = ({\n  defaultExpanded = [],\n  expanded,\n  multiple,\n  collapsible,\n  onExpandedChange,\n}: Pick<AccordionProps, 'expanded' | 'defaultExpanded' | 'multiple' | 'collapsible' | 'onExpandedChange'>): {\n  expandedPanels: string[]\n  updatePanels: (panelId: string, panelExpanded: boolean) => void\n} => {\n  const [expandedPanels, setExpandedPanels] = useState<string[]>(() => {\n    const panels = expanded ?? defaultExpanded\n\n    return !multiple && panels.length > 1 ? [panels[0]] : panels\n  })\n\n  useLayoutEffect(() => {\n    if (expanded !== undefined) {\n      setExpandedPanels(expanded)\n    }\n  }, [expanded])\n\n  return {\n    expandedPanels,\n    updatePanels: (panelId, panelExpanded) => {\n      if (panelExpanded) {\n        const update = multiple ? [...expandedPanels, panelId] : [panelId]\n\n        if (expanded === undefined) setExpandedPanels(update)\n        if (onExpandedChange) onExpandedChange(update)\n\n        return\n      }\n\n      if (collapsible) {\n        const update = multiple ? expandedPanels.filter((id) => id !== panelId) : []\n\n        if (expanded === undefined) setExpandedPanels(update)\n        if (onExpandedChange) onExpandedChange(update)\n      }\n    },\n  }\n}\n"],"names":["useAccordion","defaultExpanded","expanded","multiple","collapsible","onExpandedChange","expandedPanels","setExpandedPanels","useState","panels","length","useLayoutEffect","undefined","updatePanels","panelId","panelExpanded","update","filter","id"],"mappings":"6DAG4BA,EAC1BC,kBAAkB,GAClBC,WACAC,WACAC,cACAC,uBAKA,MAAOC,EAAgBC,GAAqBC,MAAQA,UAAW,KAC7D,MAAMC,EAASP,GAAYD,EAE3B,OAAQE,GAAYM,EAAOC,OAAS,EAAI,CAACD,EAAO,IAAMA,CAAM,IAS9D,OANAE,MAAAA,iBAAgB,KACVT,SAAaU,GACfL,EAAkBL,EACpB,GACC,CAACA,IAEG,CACLI,iBACAO,aAAcA,CAACC,EAASC,KACtB,GAAIA,EAAe,CACjB,MAAMC,EAASb,EAAW,IAAIG,EAAgBQ,GAAW,CAACA,GAK1D,OAHIZ,SAAaU,GAAWL,EAAkBS,QAC1CX,GAAkBA,EAAiBW,GAGzC,CAEA,GAAIZ,EAAa,CACf,MAAMY,EAASb,EAAWG,EAAeW,QAAQC,GAAOA,IAAOJ,IAAW,GAEtEZ,SAAaU,GAAWL,EAAkBS,GAC1CX,GAAkBA,EAAiBW,EACzC,GAEH"}

package/components/Accordion/hooks.mjs

@@ -0,0 +1,2 @@
+import{useState,useLayoutEffect}from'react';const useAccordion=({defaultExpanded:e=[],expanded:t,multiple:o,collapsible:n,onExpandedChange:d})=>{const[a,s]=useState((()=>{const n=t??e;return!o&&n.length>1?[n[0]]:n}));return useLayoutEffect((()=>{t!==void 0&&s(t)}),[t]),{expandedPanels:a,updatePanels:(e,u)=>{if(u){const n=o?[...a,e]:[e];return t===void 0&&s(n),void(d&&d(n))}if(n){const n=o?a.filter((t=>t!==e)):[];t===void 0&&s(n),d&&d(n)}}}};export{useAccordion};
+//# sourceMappingURL=hooks.mjs.map

package/components/Accordion/hooks.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.mjs","sources":["../../../../src/components/Accordion/hooks.ts"],"sourcesContent":["import { useState, useLayoutEffect } from 'react'\nimport type { AccordionProps } from './types'\n\nexport const useAccordion = ({\n  defaultExpanded = [],\n  expanded,\n  multiple,\n  collapsible,\n  onExpandedChange,\n}: Pick<AccordionProps, 'expanded' | 'defaultExpanded' | 'multiple' | 'collapsible' | 'onExpandedChange'>): {\n  expandedPanels: string[]\n  updatePanels: (panelId: string, panelExpanded: boolean) => void\n} => {\n  const [expandedPanels, setExpandedPanels] = useState<string[]>(() => {\n    const panels = expanded ?? defaultExpanded\n\n    return !multiple && panels.length > 1 ? [panels[0]] : panels\n  })\n\n  useLayoutEffect(() => {\n    if (expanded !== undefined) {\n      setExpandedPanels(expanded)\n    }\n  }, [expanded])\n\n  return {\n    expandedPanels,\n    updatePanels: (panelId, panelExpanded) => {\n      if (panelExpanded) {\n        const update = multiple ? [...expandedPanels, panelId] : [panelId]\n\n        if (expanded === undefined) setExpandedPanels(update)\n        if (onExpandedChange) onExpandedChange(update)\n\n        return\n      }\n\n      if (collapsible) {\n        const update = multiple ? expandedPanels.filter((id) => id !== panelId) : []\n\n        if (expanded === undefined) setExpandedPanels(update)\n        if (onExpandedChange) onExpandedChange(update)\n      }\n    },\n  }\n}\n"],"names":["useAccordion","defaultExpanded","expanded","multiple","collapsible","onExpandedChange","expandedPanels","setExpandedPanels","useState","panels","length","useLayoutEffect","undefined","updatePanels","panelId","panelExpanded","update","filter","id"],"mappings":"4CAGO,MAAMA,aAAeA,EAC1BC,kBAAkB,GAClBC,WACAC,WACAC,cACAC,uBAKA,MAAOC,EAAgBC,GAAqBC,UAAmB,KAC7D,MAAMC,EAASP,GAAYD,EAE3B,OAAQE,GAAYM,EAAOC,OAAS,EAAI,CAACD,EAAO,IAAMA,CAAM,IAS9D,OANAE,iBAAgB,KACVT,SAAaU,GACfL,EAAkBL,EACpB,GACC,CAACA,IAEG,CACLI,iBACAO,aAAcA,CAACC,EAASC,KACtB,GAAIA,EAAe,CACjB,MAAMC,EAASb,EAAW,IAAIG,EAAgBQ,GAAW,CAACA,GAK1D,OAHIZ,SAAaU,GAAWL,EAAkBS,QAC1CX,GAAkBA,EAAiBW,GAGzC,CAEA,GAAIZ,EAAa,CACf,MAAMY,EAASb,EAAWG,EAAeW,QAAQC,GAAOA,IAAOJ,IAAW,GAEtEZ,SAAaU,GAAWL,EAAkBS,GAC1CX,GAAkBA,EAAiBW,EACzC,GAEH"}

package/components/Accordion/sizes.js

@@ -0,0 +1,2 @@
+'use strict';exports.SIZES={l:{width:'100%',minWidth:'min-content'},m:{width:'100%',minWidth:'min-content'},s:{width:'100%',minWidth:'min-content'},xs:{width:'100%',minWidth:'min-content'}};
+//# sourceMappingURL=sizes.js.map

package/components/Accordion/sizes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizes.js","sources":["../../../../src/components/Accordion/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  m: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  s: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  xs: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n}\n"],"names":["l","width","minWidth","m","s","xs"],"mappings":"2BAGkD,CAChDA,EAAG,CACDC,MAAO,OACPC,SAAU,eAEZC,EAAG,CACDF,MAAO,OACPC,SAAU,eAEZE,EAAG,CACDH,MAAO,OACPC,SAAU,eAEZG,GAAI,CACFJ,MAAO,OACPC,SAAU"}

package/components/Accordion/sizes.mjs

@@ -0,0 +1,2 @@
+const SIZES={l:{width:'100%',minWidth:'min-content'},m:{width:'100%',minWidth:'min-content'},s:{width:'100%',minWidth:'min-content'},xs:{width:'100%',minWidth:'min-content'}};export{SIZES};
+//# sourceMappingURL=sizes.mjs.map

package/components/Accordion/sizes.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizes.mjs","sources":["../../../../src/components/Accordion/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  m: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  s: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  xs: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n}\n"],"names":["SIZES","l","width","minWidth","m","s","xs"],"mappings":"AAGO,MAAMA,MAAqC,CAChDC,EAAG,CACDC,MAAO,OACPC,SAAU,eAEZC,EAAG,CACDF,MAAO,OACPC,SAAU,eAEZE,EAAG,CACDH,MAAO,OACPC,SAAU,eAEZG,GAAI,CACFJ,MAAO,OACPC,SAAU"}

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');var focus=require('../../mixins/focus.js');var Icon=require('../Icon/Icon.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardAccordionProp=style.createShouldForwardProp((o=>!['expanded'].includes(o)));const template_button=o=>`\n    color: ${o.color};\n    &:hover {\n      color: ${o.colorHover};\n    }\n  `;const COLOR_SCHEMA={default:styled.css(["","}"],(o=>template_button({color:o.theme.colors['content-onmain-primary'],colorHover:o.theme.colors['content-brand-primary'],...o.palette}))),disabled:styled.css(["","}"],(o=>template_button({color:o.theme.colors['content-disabled'],colorHover:o.theme.colors['content-disabled'],...o.palette}))),expanded:styled.css(["","}"],(o=>template_button({color:o.theme.colors['content-brand-primary'],colorHover:o.theme.colors['content-brand-primary'],...o.palette})))};const Panel=styled__default.default.div.withConfig({displayName:"Accordion__Panel",componentId:"ui__sc-dk3o6j-0"})(["box-sizing:border-box;overflow:hidden;transition-property:opacity;"]);const Root=styled__default.default.section.withConfig({shouldForwardProp:shouldForwardAccordionProp}).withConfig({displayName:"Accordion__Root",componentId:"ui__sc-dk3o6j-1"})(["box-sizing:border-box;isolation:isolate;display:grid;border-bottom:1px solid;transition-property:grid-template-rows;&,& > ","{transition-timing-function:cubic-bezier(0.42,0,0.75,1);transition-duration:250ms;}"," "," "," ",""],Panel,(o=>o.expanded?`\n        grid-template-rows: 0fr 1fr;\n        & > ${Panel} {\n          opacity: 1;\n        }\n      `:`\n        grid-template-rows: 0fr 0fr;\n        & > ${Panel} {\n          opacity: 0;\n        }\n      `),(o=>{return`\n    background-color: ${(e={backgroundColor:o.theme.colors.transparent,borderBottomColor:o.theme.colors['border-onmain-default-large'],...o.palette}).backgroundColor};\n    border-bottom-color: ${e.borderBottomColor};\n  `;var e}),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Heading=styled__default.default.h3.withConfig({displayName:"Accordion__Heading",componentId:"ui__sc-dk3o6j-2"})(["box-sizing:border-box;display:flex;font-size:inherit;margin:0;padding:0;"]);const Button=styled__default.default.button.withConfig({shouldForwardProp:o=>!['palette','expanded','loading'].includes(o)}).withConfig({displayName:"Accordion__Button",componentId:"ui__sc-dk3o6j-3"})(["box-sizing:border-box;position:relative;z-index:1;display:flex;align-items:center;flex-grow:1;appearance:none;border:none;margin:0;padding:0.1em;background-color:inherit;font-size:inherit;text-align:start;transition-property:color;transition-duration:150ms;transition-timing-function:ease-in;& > *:not(:last-child){margin-right:0.8em;}"," "," ",""],(o=>{let e='pointer';return o.loading&&(e='wait'),o.disabled&&(e='not-allowed'),`\n      cursor: ${e};\n    `}),(o=>o.disabled?COLOR_SCHEMA.disabled:o.expanded?COLOR_SCHEMA.expanded:COLOR_SCHEMA.default),focus.focus);const Content=styled__default.default.span.withConfig({displayName:"Accordion__Content",componentId:"ui__sc-dk3o6j-4"})(["box-sizing:border-box;display:flex;flex-direction:column;flex-grow:1;"]);const IconAnimated=styled__default.default(Icon.Icon).withConfig({shouldForwardProp:o=>o!=='up'}).withConfig({displayName:"Accordion__IconAnimated",componentId:"ui__sc-dk3o6j-5"})(["",""],(o=>`\n    align-self: flex-start;\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${o.up?180:0}deg);\n  `));const Media=styled__default.default.span.withConfig({shouldForwardProp:o=>o!=='src'}).withConfig({displayName:"Accordion__Media",componentId:"ui__sc-dk3o6j-6"})(["box-sizing:border-box;width:2em;height:2em;flex-shrink:0;background-size:contain;background-repeat:no-repeat;background-position:50%;",""],(o=>o.src?`\n        background-image: url(${o.src});\n        background-color: ${o.theme.colors['bg-oncolor-hover']};\n      `:`\n        background-image: none;\n        background-color: ${o.theme.colors.transparent};\n      `));const Spacer=styled__default.default.span.withConfig({shouldForwardProp:o=>o!=='stretch'}).withConfig({displayName:"Accordion__Spacer",componentId:"ui__sc-dk3o6j-7"})(["",""],(o=>`\n    box-sizing: border-box;\n    display: flex;\n    flex-shrink: 0;\n    align-self: ${o.stretch?'stretch':'auto'};  \n  `));const Details=styled__default.default.div.withConfig({displayName:"Accordion__Details",componentId:"ui__sc-dk3o6j-8"})(["box-sizing:border-box;padding:1em 0.1em 0.1em;"]);exports.Button=Button,exports.Content=Content,exports.Details=Details,exports.Heading=Heading,exports.IconAnimated=IconAnimated,exports.Media=Media,exports.Panel=Panel,exports.Root=Root,exports.Spacer=Spacer;
+'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;
 //# 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, { css } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport { Icon } from 'components/Icon'\nimport type {\n  AccordionPalette,\n  StyledAccordionProps,\n  StyledAccordionButtonProps,\n  StyledIconAnimatedProps,\n  StyledAccordionMediaProps,\n  StyledAccordionSpacerProps,\n} from './types'\n\nconst shouldForwardAccordionProp = createShouldForwardProp((propKey) => !['expanded'].includes(propKey))\n\nconst template = {\n  root: (palette: Pick<AccordionPalette, 'backgroundColor' | 'borderBottomColor'>) => `\n    background-color: ${palette.backgroundColor};\n    border-bottom-color: ${palette.borderBottomColor};\n  `,\n  button: (palette: Pick<AccordionPalette, 'color' | 'colorHover'>) => `\n    color: ${palette.color};\n    &:hover {\n      color: ${palette.colorHover};\n    }\n  `,\n}\n\nconst COLOR_SCHEMA = {\n  default: css<StyledAccordionButtonProps>`\n    ${(props) =>\n      template.button({\n        color: props.theme.colors['content-onmain-primary'],\n        colorHover: props.theme.colors['content-brand-primary'],\n        ...props.palette,\n      })}}\n  `,\n  disabled: css<StyledAccordionButtonProps>`\n    ${(props) =>\n      template.button({\n        color: props.theme.colors['content-disabled'],\n        colorHover: props.theme.colors['content-disabled'],\n        ...props.palette,\n      })}}\n  `,\n  expanded: css<StyledAccordionButtonProps>`\n    ${(props) =>\n      template.button({\n        color: props.theme.colors['content-brand-primary'],\n        colorHover: props.theme.colors['content-brand-primary'],\n        ...props.palette,\n      })}}\n  `,\n}\n\nexport const Panel = styled.div`\n  box-sizing: border-box;\n  overflow: hidden;\n  transition-property: opacity;\n`\n\nexport const Root = styled.section.withConfig<StyledAccordionProps>({\n  shouldForwardProp: shouldForwardAccordionProp,\n})`\n  box-sizing: border-box;\n  isolation: isolate;\n  display: grid;\n  border-bottom: 1px solid;\n  transition-property: grid-template-rows;\n\n  &,\n  & > ${Panel} {\n    transition-timing-function: cubic-bezier(0.42, 0, 0.75, 1);\n    transition-duration: 250ms;\n  }\n\n  ${(props) =>\n    props.expanded\n      ? `\n        grid-template-rows: 0fr 1fr;\n        & > ${Panel} {\n          opacity: 1;\n        }\n      `\n      : `\n        grid-template-rows: 0fr 0fr;\n        & > ${Panel} {\n          opacity: 0;\n        }\n      `}\n\n  ${(props) =>\n    template.root({\n      backgroundColor: props.theme.colors.transparent,\n      borderBottomColor: props.theme.colors['border-onmain-default-large'],\n      ...props.palette,\n    })}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Heading = styled.h3`\n  box-sizing: border-box;\n  display: flex;\n  font-size: inherit;\n  margin: 0;\n  padding: 0;\n`\n\nexport const Button = styled.button.withConfig<StyledAccordionButtonProps>({\n  shouldForwardProp: (propKey) => !['palette', 'expanded', 'loading'].includes(propKey),\n})`\n  box-sizing: border-box;\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  flex-grow: 1;\n  appearance: none;\n  border: none;\n  margin: 0;\n  padding: 0.1em;\n  background-color: inherit;\n  font-size: inherit;\n  text-align: start;\n  transition-property: color;\n  transition-duration: 150ms;\n  transition-timing-function: ease-in;\n\n  & > *:not(:last-child) {\n    margin-right: 0.8em;\n  }\n\n  ${(props) => {\n    let cursor = 'pointer'\n\n    if (props.loading) cursor = 'wait'\n    if (props.disabled) cursor = 'not-allowed'\n\n    return `\n      cursor: ${cursor};\n    `\n  }}\n\n  ${(props) => {\n    if (props.disabled) return COLOR_SCHEMA.disabled\n    if (props.expanded) return COLOR_SCHEMA.expanded\n\n    return COLOR_SCHEMA.default\n  }}\n\n  ${focus}\n`\n\nexport const Content = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n`\n\nexport const IconAnimated = styled(Icon).withConfig<StyledIconAnimatedProps>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  ${(props) => `\n    align-self: flex-start;\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const Media = styled.span.withConfig<StyledAccordionMediaProps>({\n  shouldForwardProp: (propKey) => propKey !== 'src',\n})`\n  box-sizing: border-box;\n  width: 2em;\n  height: 2em;\n  flex-shrink: 0;\n  background-size: contain;\n  background-repeat: no-repeat;\n  background-position: 50%;\n  ${(props) =>\n    props.src\n      ? `\n        background-image: url(${props.src});\n        background-color: ${props.theme.colors['bg-oncolor-hover']};\n      `\n      : `\n        background-image: none;\n        background-color: ${props.theme.colors.transparent};\n      `}\n`\n\nexport const Spacer = styled.span.withConfig<StyledAccordionSpacerProps>({\n  shouldForwardProp: (propKey) => propKey !== 'stretch',\n})`\n  ${(props) => `\n    box-sizing: border-box;\n    display: flex;\n    flex-shrink: 0;\n    align-self: ${props.stretch ? 'stretch' : 'auto'};  \n  `}\n`\n\nexport const Details = styled.div`\n  box-sizing: border-box;\n  padding: 1em 0.1em 0.1em;\n`\n"],"names":["shouldForwardAccordionProp","createShouldForwardProp","propKey","includes","template","palette","color","colorHover","COLOR_SCHEMA","default","css","props","theme","colors","disabled","expanded","Panel","styled","div","withConfig","displayName","componentId","Root","section","shouldForwardProp","backgroundColor","transparent","borderBottomColor","responsiveSize","responsiveMargin","Heading","h3","Button","button","cursor","loading","focus","Content","span","IconAnimated","Icon","up","Media","src","Spacer","stretch","Details"],"mappings":"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"}
+{"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"}

package/components/Accordion/style.mjs

@@ -1,2 +1,2 @@
-import styled,{css}from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';import{focus}from'../../mixins/focus.mjs';import{Icon}from'../Icon/Icon.mjs';const shouldForwardAccordionProp=createShouldForwardProp((o=>!['expanded'].includes(o)));const template_button=o=>`\n    color: ${o.color};\n    &:hover {\n      color: ${o.colorHover};\n    }\n  `;const COLOR_SCHEMA={default:css(["","}"],(o=>template_button({color:o.theme.colors['content-onmain-primary'],colorHover:o.theme.colors['content-brand-primary'],...o.palette}))),disabled:css(["","}"],(o=>template_button({color:o.theme.colors['content-disabled'],colorHover:o.theme.colors['content-disabled'],...o.palette}))),expanded:css(["","}"],(o=>template_button({color:o.theme.colors['content-brand-primary'],colorHover:o.theme.colors['content-brand-primary'],...o.palette})))};const Panel=styled.div.withConfig({displayName:"Accordion__Panel",componentId:"ui__sc-dk3o6j-0"})(["box-sizing:border-box;overflow:hidden;transition-property:opacity;"]);const Root=styled.section.withConfig({shouldForwardProp:shouldForwardAccordionProp}).withConfig({displayName:"Accordion__Root",componentId:"ui__sc-dk3o6j-1"})(["box-sizing:border-box;isolation:isolate;display:grid;border-bottom:1px solid;transition-property:grid-template-rows;&,& > ","{transition-timing-function:cubic-bezier(0.42,0,0.75,1);transition-duration:250ms;}"," "," "," ",""],Panel,(o=>o.expanded?`\n        grid-template-rows: 0fr 1fr;\n        & > ${Panel} {\n          opacity: 1;\n        }\n      `:`\n        grid-template-rows: 0fr 0fr;\n        & > ${Panel} {\n          opacity: 0;\n        }\n      `),(o=>{return`\n    background-color: ${(n={backgroundColor:o.theme.colors.transparent,borderBottomColor:o.theme.colors['border-onmain-default-large'],...o.palette}).backgroundColor};\n    border-bottom-color: ${n.borderBottomColor};\n  `;var n}),responsiveSize,responsiveMargin);const Heading=styled.h3.withConfig({displayName:"Accordion__Heading",componentId:"ui__sc-dk3o6j-2"})(["box-sizing:border-box;display:flex;font-size:inherit;margin:0;padding:0;"]);const Button=styled.button.withConfig({shouldForwardProp:o=>!['palette','expanded','loading'].includes(o)}).withConfig({displayName:"Accordion__Button",componentId:"ui__sc-dk3o6j-3"})(["box-sizing:border-box;position:relative;z-index:1;display:flex;align-items:center;flex-grow:1;appearance:none;border:none;margin:0;padding:0.1em;background-color:inherit;font-size:inherit;text-align:start;transition-property:color;transition-duration:150ms;transition-timing-function:ease-in;& > *:not(:last-child){margin-right:0.8em;}"," "," ",""],(o=>{let n='pointer';return o.loading&&(n='wait'),o.disabled&&(n='not-allowed'),`\n      cursor: ${n};\n    `}),(o=>o.disabled?COLOR_SCHEMA.disabled:o.expanded?COLOR_SCHEMA.expanded:COLOR_SCHEMA.default),focus);const Content=styled.span.withConfig({displayName:"Accordion__Content",componentId:"ui__sc-dk3o6j-4"})(["box-sizing:border-box;display:flex;flex-direction:column;flex-grow:1;"]);const IconAnimated=styled(Icon).withConfig({shouldForwardProp:o=>o!=='up'}).withConfig({displayName:"Accordion__IconAnimated",componentId:"ui__sc-dk3o6j-5"})(["",""],(o=>`\n    align-self: flex-start;\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${o.up?180:0}deg);\n  `));const Media=styled.span.withConfig({shouldForwardProp:o=>o!=='src'}).withConfig({displayName:"Accordion__Media",componentId:"ui__sc-dk3o6j-6"})(["box-sizing:border-box;width:2em;height:2em;flex-shrink:0;background-size:contain;background-repeat:no-repeat;background-position:50%;",""],(o=>o.src?`\n        background-image: url(${o.src});\n        background-color: ${o.theme.colors['bg-oncolor-hover']};\n      `:`\n        background-image: none;\n        background-color: ${o.theme.colors.transparent};\n      `));const Spacer=styled.span.withConfig({shouldForwardProp:o=>o!=='stretch'}).withConfig({displayName:"Accordion__Spacer",componentId:"ui__sc-dk3o6j-7"})(["",""],(o=>`\n    box-sizing: border-box;\n    display: flex;\n    flex-shrink: 0;\n    align-self: ${o.stretch?'stretch':'auto'};  \n  `));const Details=styled.div.withConfig({displayName:"Accordion__Details",componentId:"ui__sc-dk3o6j-8"})(["box-sizing:border-box;padding:1em 0.1em 0.1em;"]);export{Button,Content,Details,Heading,IconAnimated,Media,Panel,Root,Spacer};
+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};
 //# 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, { css } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport { Icon } from 'components/Icon'\nimport type {\n  AccordionPalette,\n  StyledAccordionProps,\n  StyledAccordionButtonProps,\n  StyledIconAnimatedProps,\n  StyledAccordionMediaProps,\n  StyledAccordionSpacerProps,\n} from './types'\n\nconst shouldForwardAccordionProp = createShouldForwardProp((propKey) => !['expanded'].includes(propKey))\n\nconst template = {\n  root: (palette: Pick<AccordionPalette, 'backgroundColor' | 'borderBottomColor'>) => `\n    background-color: ${palette.backgroundColor};\n    border-bottom-color: ${palette.borderBottomColor};\n  `,\n  button: (palette: Pick<AccordionPalette, 'color' | 'colorHover'>) => `\n    color: ${palette.color};\n    &:hover {\n      color: ${palette.colorHover};\n    }\n  `,\n}\n\nconst COLOR_SCHEMA = {\n  default: css<StyledAccordionButtonProps>`\n    ${(props) =>\n      template.button({\n        color: props.theme.colors['content-onmain-primary'],\n        colorHover: props.theme.colors['content-brand-primary'],\n        ...props.palette,\n      })}}\n  `,\n  disabled: css<StyledAccordionButtonProps>`\n    ${(props) =>\n      template.button({\n        color: props.theme.colors['content-disabled'],\n        colorHover: props.theme.colors['content-disabled'],\n        ...props.palette,\n      })}}\n  `,\n  expanded: css<StyledAccordionButtonProps>`\n    ${(props) =>\n      template.button({\n        color: props.theme.colors['content-brand-primary'],\n        colorHover: props.theme.colors['content-brand-primary'],\n        ...props.palette,\n      })}}\n  `,\n}\n\nexport const Panel = styled.div`\n  box-sizing: border-box;\n  overflow: hidden;\n  transition-property: opacity;\n`\n\nexport const Root = styled.section.withConfig<StyledAccordionProps>({\n  shouldForwardProp: shouldForwardAccordionProp,\n})`\n  box-sizing: border-box;\n  isolation: isolate;\n  display: grid;\n  border-bottom: 1px solid;\n  transition-property: grid-template-rows;\n\n  &,\n  & > ${Panel} {\n    transition-timing-function: cubic-bezier(0.42, 0, 0.75, 1);\n    transition-duration: 250ms;\n  }\n\n  ${(props) =>\n    props.expanded\n      ? `\n        grid-template-rows: 0fr 1fr;\n        & > ${Panel} {\n          opacity: 1;\n        }\n      `\n      : `\n        grid-template-rows: 0fr 0fr;\n        & > ${Panel} {\n          opacity: 0;\n        }\n      `}\n\n  ${(props) =>\n    template.root({\n      backgroundColor: props.theme.colors.transparent,\n      borderBottomColor: props.theme.colors['border-onmain-default-large'],\n      ...props.palette,\n    })}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Heading = styled.h3`\n  box-sizing: border-box;\n  display: flex;\n  font-size: inherit;\n  margin: 0;\n  padding: 0;\n`\n\nexport const Button = styled.button.withConfig<StyledAccordionButtonProps>({\n  shouldForwardProp: (propKey) => !['palette', 'expanded', 'loading'].includes(propKey),\n})`\n  box-sizing: border-box;\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  flex-grow: 1;\n  appearance: none;\n  border: none;\n  margin: 0;\n  padding: 0.1em;\n  background-color: inherit;\n  font-size: inherit;\n  text-align: start;\n  transition-property: color;\n  transition-duration: 150ms;\n  transition-timing-function: ease-in;\n\n  & > *:not(:last-child) {\n    margin-right: 0.8em;\n  }\n\n  ${(props) => {\n    let cursor = 'pointer'\n\n    if (props.loading) cursor = 'wait'\n    if (props.disabled) cursor = 'not-allowed'\n\n    return `\n      cursor: ${cursor};\n    `\n  }}\n\n  ${(props) => {\n    if (props.disabled) return COLOR_SCHEMA.disabled\n    if (props.expanded) return COLOR_SCHEMA.expanded\n\n    return COLOR_SCHEMA.default\n  }}\n\n  ${focus}\n`\n\nexport const Content = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n`\n\nexport const IconAnimated = styled(Icon).withConfig<StyledIconAnimatedProps>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  ${(props) => `\n    align-self: flex-start;\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const Media = styled.span.withConfig<StyledAccordionMediaProps>({\n  shouldForwardProp: (propKey) => propKey !== 'src',\n})`\n  box-sizing: border-box;\n  width: 2em;\n  height: 2em;\n  flex-shrink: 0;\n  background-size: contain;\n  background-repeat: no-repeat;\n  background-position: 50%;\n  ${(props) =>\n    props.src\n      ? `\n        background-image: url(${props.src});\n        background-color: ${props.theme.colors['bg-oncolor-hover']};\n      `\n      : `\n        background-image: none;\n        background-color: ${props.theme.colors.transparent};\n      `}\n`\n\nexport const Spacer = styled.span.withConfig<StyledAccordionSpacerProps>({\n  shouldForwardProp: (propKey) => propKey !== 'stretch',\n})`\n  ${(props) => `\n    box-sizing: border-box;\n    display: flex;\n    flex-shrink: 0;\n    align-self: ${props.stretch ? 'stretch' : 'auto'};  \n  `}\n`\n\nexport const Details = styled.div`\n  box-sizing: border-box;\n  padding: 1em 0.1em 0.1em;\n`\n"],"names":["shouldForwardAccordionProp","createShouldForwardProp","propKey","includes","template","palette","color","colorHover","COLOR_SCHEMA","default","css","props","theme","colors","disabled","expanded","Panel","styled","div","withConfig","displayName","componentId","Root","section","shouldForwardProp","backgroundColor","transparent","borderBottomColor","responsiveSize","responsiveMargin","Heading","h3","Button","button","cursor","loading","focus","Content","span","IconAnimated","Icon","up","Media","src","Spacer","stretch","Details"],"mappings":"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"}
+{"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"}

package/components/AccordionItem/AccordionItem.js

@@ -0,0 +1,2 @@
+'use strict';var React=require('react');var nanoid=require('nanoid');var withMergedProps=require('../../hocs/withMergedProps.js');var hooks=require('./hooks.js');var sizes=require('./sizes.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');var Icon=require('../Icon/Icon.js');const AccordionItem=withMergedProps.withMergedProps(React.forwardRef(((e,s)=>{const{size:i="m",defaultExpanded:n=!1,headingAs:t="h3",borderRadius:o=0,sizeXXS:a,sizeXS:r,sizeS:d,sizeM:l,sizeL:c,sizeXL:x,id:u,header:j,addon:E,content:p,title:m,subtitle:R,icon:S,panel:h,children:z,loading:y,disabled:I,expanded:b,embedded:D,onExpandedChange:T,...f}=hooks.useAccordionPanelProps(e);const k={size:i,sizeXXS:a,sizeXS:r,sizeS:d,sizeM:l,sizeL:c,sizeXL:x};const g={...k,preset:'brand',name:'chevronDown',sizes:sizes.SIZES_ICON};const A={...k,as:'span',appearance:'subheading-compact',wordBreak:'break-word',color:'inherit',sizes:sizes.SIZES_TITLE};const P={...k,as:'span',appearance:'body',wordBreak:'break-word',color:'inherit',sizes:sizes.SIZES_SUBTITLE};const{panelExpanded:_,setPanelExpanded:w}=hooks.useAccordionPanel({id:u,expanded:b,defaultExpanded:n,onExpandedChange:T});const[v,M]=React.useState(_);const Z=React.useMemo((()=>nanoid.nanoid()),[]);const L=React.useMemo((()=>nanoid.nanoid()),[]);return React.useLayoutEffect((()=>{_&&M(!0)}),[_]),jsxRuntime.jsxs(style.Root,{...f,...k,id:u,disabled:I,loading:y,expanded:_,borderRadius:o,"data-accordion-item":!0,ref:s,children:[jsxRuntime.jsx(style.Heading,{as:t,onClick:()=>{I||w(!_)},children:jsxRuntime.jsx(style.Button,{id:Z,type:"button","data-accordion-control":!0,"aria-controls":L,"aria-expanded":v,"aria-disabled":v&&(I||b!==void 0&&!T),disabled:I,onClick:e=>{e.stopPropagation(),w(!_)},children:y?jsxRuntime.jsx(style.Header,{...k,sizes:D?sizes.SIZES_HEADER_EMBEDDED:sizes.SIZES_HEADER,children:jsxRuntime.jsx(style.Content,{children:jsxRuntime.jsx(Skeleton.Skeleton,{as:"span",borderRadius:4,width:"90%","data-accordion-skeleton":!0,children:jsxRuntime.jsx(Text.Text,{...A})})})}):React.isValidElement(j)?j:typeof j=='function'?j({titleProps:A,subtitleProps:P,iconProps:g}):jsxRuntime.jsxs(style.Header,{...k,sizes:D?sizes.SIZES_HEADER_EMBEDDED:sizes.SIZES_HEADER,children:[E,jsxRuntime.jsx(style.Content,{children:React.isValidElement(p)?p:typeof p=='function'?p({titleProps:A,subtitleProps:P}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[React.isValidElement(m)?m:typeof m=='function'?m(A):typeof m=='string'||typeof m=='number'?jsxRuntime.jsx(Text.Text,{...A,children:m}):null,React.isValidElement(R)?R:typeof R=='function'?R(P):typeof R=='string'||typeof R=='number'?jsxRuntime.jsx(Text.Text,{...P,children:R}):null]})}),jsxRuntime.jsx(style.IconAnimation,{up:_,children:React.isValidElement(S)?S:typeof S=='function'?S(g):jsxRuntime.jsx(Icon.Icon,{...g})})]})})}),jsxRuntime.jsx(style.Panel,{id:L,role:"region","aria-labelledby":Z,hidden:!v,onTransitionEnd:e=>{e.propertyName!=='opacity'||_||M(!1)},children:y?jsxRuntime.jsxs(style.Details,{...k,sizes:D?sizes.SIZES_DETAILS_EMBEDDED:sizes.SIZES_DETAILS,children:[jsxRuntime.jsx(Skeleton.Skeleton,{as:"span",borderRadius:4,width:"100%",marginBottom:"0.4em",children:jsxRuntime.jsx(Text.Text,{...P})}),jsxRuntime.jsx(Skeleton.Skeleton,{as:"span",borderRadius:4,width:"70%",children:jsxRuntime.jsx(Text.Text,{...P})})]}):React.isValidElement(h)?h:jsxRuntime.jsx(style.Details,{...k,sizes:D?sizes.SIZES_DETAILS_EMBEDDED:sizes.SIZES_DETAILS,children:z})})]})})),{displayName:'AccordionItem',sizes:sizes.SIZES});exports.AccordionItem=AccordionItem;
+//# sourceMappingURL=AccordionItem.js.map

package/components/AccordionItem/AccordionItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.js","sources":["../../../../src/components/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement, useLayoutEffect, useMemo } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport type { IconProps } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport { useAccordionPanel, useAccordionPanelProps } from './hooks'\nimport {\n  SIZES,\n  SIZES_HEADER,\n  SIZES_HEADER_EMBEDDED,\n  SIZES_DETAILS,\n  SIZES_DETAILS_EMBEDDED,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  SIZES_ICON,\n} from './sizes'\nimport type { AccordionItemProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'AccordionItem'\n\n/**\n *\n * Компонент для создания сворачиваемой секции контента.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<section\\> элемента.\n *\n * Дизайн соответствует [рекомендациям WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/accordion/).\n *\n * @visibleName Accordion.Item\n */\nconst AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps> = withMergedProps<\n  AccordionItemProps,\n  HTMLElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      defaultExpanded = false,\n      headingAs = 'h3',\n      borderRadius = 0,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      id,\n      header,\n      addon,\n      content,\n      title,\n      subtitle,\n      icon,\n      panel,\n      children,\n      loading,\n      disabled,\n      expanded,\n      embedded,\n      onExpandedChange,\n      ...restProps\n    } = useAccordionPanelProps(props)\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const iconProps: IconProps = {\n      ...sizeProps,\n      preset: 'brand',\n      name: 'chevronDown',\n      sizes: SIZES_ICON,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'span',\n      appearance: 'subheading-compact',\n      wordBreak: 'break-word',\n      color: 'inherit',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'span',\n      appearance: 'body',\n      wordBreak: 'break-word',\n      color: 'inherit',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const { panelExpanded, setPanelExpanded } = useAccordionPanel({\n      id,\n      expanded,\n      defaultExpanded,\n      onExpandedChange,\n    })\n\n    const [panelVisible, setPanelVisible] = useState<boolean>(panelExpanded)\n\n    const controlId = useMemo(() => nanoid(), [])\n    const panelId = useMemo(() => nanoid(), [])\n\n    useLayoutEffect(() => {\n      if (panelExpanded) setPanelVisible(true)\n    }, [panelExpanded])\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        id={id}\n        disabled={disabled}\n        loading={loading}\n        expanded={panelExpanded}\n        borderRadius={borderRadius}\n        data-accordion-item\n        ref={ref}\n      >\n        <Styled.Heading\n          as={headingAs}\n          onClick={() => {\n            if (!disabled) {\n              setPanelExpanded(!panelExpanded)\n            }\n          }}\n        >\n          <Styled.Button\n            id={controlId}\n            type='button'\n            data-accordion-control\n            aria-controls={panelId}\n            aria-expanded={panelVisible}\n            aria-disabled={panelVisible && (disabled || (expanded !== undefined && !onExpandedChange))}\n            disabled={disabled}\n            onClick={(evt) => {\n              evt.stopPropagation()\n              setPanelExpanded(!panelExpanded)\n            }}\n          >\n            {loading ? (\n              <Styled.Header {...sizeProps} sizes={embedded ? SIZES_HEADER_EMBEDDED : SIZES_HEADER}>\n                <Styled.Content>\n                  <Skeleton as='span' borderRadius={4} width='90%' data-accordion-skeleton>\n                    <Text {...titleProps} />\n                  </Skeleton>\n                </Styled.Content>\n              </Styled.Header>\n            ) : isValidElement(header) ? (\n              header\n            ) : typeof header === 'function' ? (\n              header({\n                titleProps,\n                subtitleProps,\n                iconProps,\n              })\n            ) : (\n              <Styled.Header {...sizeProps} sizes={embedded ? SIZES_HEADER_EMBEDDED : SIZES_HEADER}>\n                {addon}\n                <Styled.Content>\n                  {isValidElement(content) ? (\n                    content\n                  ) : typeof content === 'function' ? (\n                    content({\n                      titleProps,\n                      subtitleProps,\n                    })\n                  ) : (\n                    <>\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                    </>\n                  )}\n                </Styled.Content>\n                <Styled.IconAnimation up={panelExpanded}>\n                  {isValidElement(icon) ? icon : typeof icon === 'function' ? icon(iconProps) : <Icon {...iconProps} />}\n                </Styled.IconAnimation>\n              </Styled.Header>\n            )}\n          </Styled.Button>\n        </Styled.Heading>\n        <Styled.Panel\n          id={panelId}\n          role='region'\n          aria-labelledby={controlId}\n          hidden={!panelVisible}\n          onTransitionEnd={(evt) => {\n            if (evt.propertyName === 'opacity' && !panelExpanded) {\n              setPanelVisible(false)\n            }\n          }}\n        >\n          {loading ? (\n            <Styled.Details {...sizeProps} sizes={embedded ? SIZES_DETAILS_EMBEDDED : SIZES_DETAILS}>\n              <Skeleton as='span' borderRadius={4} width='100%' marginBottom='0.4em'>\n                <Text {...subtitleProps} />\n              </Skeleton>\n              <Skeleton as='span' borderRadius={4} width='70%'>\n                <Text {...subtitleProps} />\n              </Skeleton>\n            </Styled.Details>\n          ) : isValidElement(panel) ? (\n            panel\n          ) : (\n            <Styled.Details {...sizeProps} sizes={embedded ? SIZES_DETAILS_EMBEDDED : SIZES_DETAILS}>\n              {children}\n            </Styled.Details>\n          )}\n        </Styled.Panel>\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: SIZES,\n  }\n)\n\nexport { AccordionItem }\n"],"names":["AccordionItem","withMergedProps","forwardRef","props","ref","size","defaultExpanded","headingAs","borderRadius","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","id","header","addon","content","title","subtitle","icon","panel","children","loading","disabled","expanded","embedded","onExpandedChange","restProps","useAccordionPanelProps","sizeProps","iconProps","preset","name","sizes","SIZES_ICON","titleProps","as","appearance","wordBreak","color","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","panelExpanded","setPanelExpanded","useAccordionPanel","panelVisible","setPanelVisible","useState","controlId","useMemo","nanoid","panelId","useLayoutEffect","_jsxs","Styled","_jsx","jsx","onClick","type","undefined","evt","stopPropagation","SIZES_HEADER_EMBEDDED","SIZES_HEADER","Skeleton","width","Text","isValidElement","jsxs","_Fragment","up","Icon","role","hidden","onTransitionEnd","propertyName","SIZES_DETAILS_EMBEDDED","SIZES_DETAILS","marginBottom","displayName","SIZES"],"mappings":"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"}

package/components/AccordionItem/AccordionItem.mjs

@@ -0,0 +1,2 @@
+import{forwardRef,useState,useMemo,useLayoutEffect,isValidElement}from'react';import{nanoid}from'nanoid';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useAccordionPanelProps,useAccordionPanel}from'./hooks.mjs';import{SIZES,SIZES_HEADER_EMBEDDED,SIZES_HEADER,SIZES_DETAILS_EMBEDDED,SIZES_DETAILS,SIZES_ICON,SIZES_TITLE,SIZES_SUBTITLE}from'./sizes.mjs';import{Root,Heading,Button,Header,Content,IconAnimation,Panel,Details}from'./style.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';import{Icon}from'../Icon/Icon.mjs';const AccordionItem=withMergedProps(forwardRef(((e,n)=>{const{size:o="m",defaultExpanded:i=!1,headingAs:s="h3",borderRadius:t=0,sizeXXS:d,sizeXS:r,sizeS:a,sizeM:l,sizeL:c,sizeXL:E,id:S,header:p,addon:m,content:x,title:I,subtitle:u,icon:h,panel:f,children:D,loading:j,disabled:_,expanded:b,embedded:z,onExpandedChange:T,...A}=useAccordionPanelProps(e);const Z={size:o,sizeXXS:d,sizeXS:r,sizeS:a,sizeM:l,sizeL:c,sizeXL:E};const g={...Z,preset:'brand',name:'chevronDown',sizes:SIZES_ICON};const y={...Z,as:'span',appearance:'subheading-compact',wordBreak:'break-word',color:'inherit',sizes:SIZES_TITLE};const P={...Z,as:'span',appearance:'body',wordBreak:'break-word',color:'inherit',sizes:SIZES_SUBTITLE};const{panelExpanded:L,setPanelExpanded:R}=useAccordionPanel({id:S,expanded:b,defaultExpanded:i,onExpandedChange:T});const[k,M]=useState(L);const w=useMemo((()=>nanoid()),[]);const B=useMemo((()=>nanoid()),[]);return useLayoutEffect((()=>{L&&M(!0)}),[L]),jsxs(Root,{...A,...Z,id:S,disabled:_,loading:j,expanded:L,borderRadius:t,"data-accordion-item":!0,ref:n,children:[jsx(Heading,{as:s,onClick:()=>{_||R(!L)},children:jsx(Button,{id:w,type:"button","data-accordion-control":!0,"aria-controls":B,"aria-expanded":k,"aria-disabled":k&&(_||b!==void 0&&!T),disabled:_,onClick:e=>{e.stopPropagation(),R(!L)},children:j?jsx(Header,{...Z,sizes:z?SIZES_HEADER_EMBEDDED:SIZES_HEADER,children:jsx(Content,{children:jsx(Skeleton,{as:"span",borderRadius:4,width:"90%","data-accordion-skeleton":!0,children:jsx(Text,{...y})})})}):isValidElement(p)?p:typeof p=='function'?p({titleProps:y,subtitleProps:P,iconProps:g}):jsxs(Header,{...Z,sizes:z?SIZES_HEADER_EMBEDDED:SIZES_HEADER,children:[m,jsx(Content,{children:isValidElement(x)?x:typeof x=='function'?x({titleProps:y,subtitleProps:P}):jsxs(Fragment,{children:[isValidElement(I)?I:typeof I=='function'?I(y):typeof I=='string'||typeof I=='number'?jsx(Text,{...y,children:I}):null,isValidElement(u)?u:typeof u=='function'?u(P):typeof u=='string'||typeof u=='number'?jsx(Text,{...P,children:u}):null]})}),jsx(IconAnimation,{up:L,children:isValidElement(h)?h:typeof h=='function'?h(g):jsx(Icon,{...g})})]})})}),jsx(Panel,{id:B,role:"region","aria-labelledby":w,hidden:!k,onTransitionEnd:e=>{e.propertyName!=='opacity'||L||M(!1)},children:j?jsxs(Details,{...Z,sizes:z?SIZES_DETAILS_EMBEDDED:SIZES_DETAILS,children:[jsx(Skeleton,{as:"span",borderRadius:4,width:"100%",marginBottom:"0.4em",children:jsx(Text,{...P})}),jsx(Skeleton,{as:"span",borderRadius:4,width:"70%",children:jsx(Text,{...P})})]}):isValidElement(f)?f:jsx(Details,{...Z,sizes:z?SIZES_DETAILS_EMBEDDED:SIZES_DETAILS,children:D})})]})})),{displayName:'AccordionItem',sizes:SIZES});export{AccordionItem};
+//# sourceMappingURL=AccordionItem.mjs.map

package/components/AccordionItem/AccordionItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.mjs","sources":["../../../../src/components/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement, useLayoutEffect, useMemo } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport type { IconProps } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport { useAccordionPanel, useAccordionPanelProps } from './hooks'\nimport {\n  SIZES,\n  SIZES_HEADER,\n  SIZES_HEADER_EMBEDDED,\n  SIZES_DETAILS,\n  SIZES_DETAILS_EMBEDDED,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  SIZES_ICON,\n} from './sizes'\nimport type { AccordionItemProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'AccordionItem'\n\n/**\n *\n * Компонент для создания сворачиваемой секции контента.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<section\\> элемента.\n *\n * Дизайн соответствует [рекомендациям WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/accordion/).\n *\n * @visibleName Accordion.Item\n */\nconst AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps> = withMergedProps<\n  AccordionItemProps,\n  HTMLElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      defaultExpanded = false,\n      headingAs = 'h3',\n      borderRadius = 0,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      id,\n      header,\n      addon,\n      content,\n      title,\n      subtitle,\n      icon,\n      panel,\n      children,\n      loading,\n      disabled,\n      expanded,\n      embedded,\n      onExpandedChange,\n      ...restProps\n    } = useAccordionPanelProps(props)\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const iconProps: IconProps = {\n      ...sizeProps,\n      preset: 'brand',\n      name: 'chevronDown',\n      sizes: SIZES_ICON,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'span',\n      appearance: 'subheading-compact',\n      wordBreak: 'break-word',\n      color: 'inherit',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'span',\n      appearance: 'body',\n      wordBreak: 'break-word',\n      color: 'inherit',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const { panelExpanded, setPanelExpanded } = useAccordionPanel({\n      id,\n      expanded,\n      defaultExpanded,\n      onExpandedChange,\n    })\n\n    const [panelVisible, setPanelVisible] = useState<boolean>(panelExpanded)\n\n    const controlId = useMemo(() => nanoid(), [])\n    const panelId = useMemo(() => nanoid(), [])\n\n    useLayoutEffect(() => {\n      if (panelExpanded) setPanelVisible(true)\n    }, [panelExpanded])\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        id={id}\n        disabled={disabled}\n        loading={loading}\n        expanded={panelExpanded}\n        borderRadius={borderRadius}\n        data-accordion-item\n        ref={ref}\n      >\n        <Styled.Heading\n          as={headingAs}\n          onClick={() => {\n            if (!disabled) {\n              setPanelExpanded(!panelExpanded)\n            }\n          }}\n        >\n          <Styled.Button\n            id={controlId}\n            type='button'\n            data-accordion-control\n            aria-controls={panelId}\n            aria-expanded={panelVisible}\n            aria-disabled={panelVisible && (disabled || (expanded !== undefined && !onExpandedChange))}\n            disabled={disabled}\n            onClick={(evt) => {\n              evt.stopPropagation()\n              setPanelExpanded(!panelExpanded)\n            }}\n          >\n            {loading ? (\n              <Styled.Header {...sizeProps} sizes={embedded ? SIZES_HEADER_EMBEDDED : SIZES_HEADER}>\n                <Styled.Content>\n                  <Skeleton as='span' borderRadius={4} width='90%' data-accordion-skeleton>\n                    <Text {...titleProps} />\n                  </Skeleton>\n                </Styled.Content>\n              </Styled.Header>\n            ) : isValidElement(header) ? (\n              header\n            ) : typeof header === 'function' ? (\n              header({\n                titleProps,\n                subtitleProps,\n                iconProps,\n              })\n            ) : (\n              <Styled.Header {...sizeProps} sizes={embedded ? SIZES_HEADER_EMBEDDED : SIZES_HEADER}>\n                {addon}\n                <Styled.Content>\n                  {isValidElement(content) ? (\n                    content\n                  ) : typeof content === 'function' ? (\n                    content({\n                      titleProps,\n                      subtitleProps,\n                    })\n                  ) : (\n                    <>\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                    </>\n                  )}\n                </Styled.Content>\n                <Styled.IconAnimation up={panelExpanded}>\n                  {isValidElement(icon) ? icon : typeof icon === 'function' ? icon(iconProps) : <Icon {...iconProps} />}\n                </Styled.IconAnimation>\n              </Styled.Header>\n            )}\n          </Styled.Button>\n        </Styled.Heading>\n        <Styled.Panel\n          id={panelId}\n          role='region'\n          aria-labelledby={controlId}\n          hidden={!panelVisible}\n          onTransitionEnd={(evt) => {\n            if (evt.propertyName === 'opacity' && !panelExpanded) {\n              setPanelVisible(false)\n            }\n          }}\n        >\n          {loading ? (\n            <Styled.Details {...sizeProps} sizes={embedded ? SIZES_DETAILS_EMBEDDED : SIZES_DETAILS}>\n              <Skeleton as='span' borderRadius={4} width='100%' marginBottom='0.4em'>\n                <Text {...subtitleProps} />\n              </Skeleton>\n              <Skeleton as='span' borderRadius={4} width='70%'>\n                <Text {...subtitleProps} />\n              </Skeleton>\n            </Styled.Details>\n          ) : isValidElement(panel) ? (\n            panel\n          ) : (\n            <Styled.Details {...sizeProps} sizes={embedded ? SIZES_DETAILS_EMBEDDED : SIZES_DETAILS}>\n              {children}\n            </Styled.Details>\n          )}\n        </Styled.Panel>\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: SIZES,\n  }\n)\n\nexport { AccordionItem }\n"],"names":["AccordionItem","withMergedProps","forwardRef","props","ref","size","defaultExpanded","headingAs","borderRadius","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","id","header","addon","content","title","subtitle","icon","panel","children","loading","disabled","expanded","embedded","onExpandedChange","restProps","useAccordionPanelProps","sizeProps","iconProps","preset","name","sizes","SIZES_ICON","titleProps","as","appearance","wordBreak","color","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","panelExpanded","setPanelExpanded","useAccordionPanel","panelVisible","setPanelVisible","useState","controlId","useMemo","nanoid","panelId","useLayoutEffect","_jsxs","Styled","_jsx","onClick","type","undefined","evt","stopPropagation","SIZES_HEADER_EMBEDDED","SIZES_HEADER","Skeleton","width","Text","isValidElement","_Fragment","up","Icon","role","hidden","onTransitionEnd","propertyName","SIZES_DETAILS_EMBEDDED","SIZES_DETAILS","marginBottom","displayName","SIZES"],"mappings":"knBAkCMA,MAAAA,cAAqEC,gBAIzEC,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,gBACVA,GAAkB,EAAKC,UACvBA,EAAY,KAAIC,aAChBA,EAAe,EAACC,QAChBA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,GACNA,EAAEC,OACFA,EAAMC,MACNA,EAAKC,QACLA,EAAOC,MACPA,EAAKC,SACLA,EAAQC,KACRA,EAAIC,MACJA,EAAKC,SACLA,EAAQC,QACRA,EAAOC,SACPA,EAAQC,SACRA,EAAQC,SACRA,EAAQC,iBACRA,KACGC,GACDC,uBAAuB3B,GAE3B,MAAM4B,EAAY,CAChB1B,OACAI,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMkB,EAAuB,IACxBD,EACHE,OAAQ,QACRC,KAAM,cACNC,MAAOC,YAGT,MAAMC,EAAwB,IACzBN,EACHO,GAAI,OACJC,WAAY,qBACZC,UAAW,aACXC,MAAO,UACPN,MAAOO,aAGT,MAAMC,EAA2B,IAC5BZ,EACHO,GAAI,OACJC,WAAY,OACZC,UAAW,aACXC,MAAO,UACPN,MAAOS,gBAGT,MAAMC,cAAEA,EAAaC,iBAAEA,GAAqBC,kBAAkB,CAC5DhC,KACAW,WACApB,kBACAsB,qBAGF,MAAOoB,EAAcC,GAAmBC,SAAkBL,GAE1D,MAAMM,EAAYC,SAAQ,IAAMC,UAAU,IAC1C,MAAMC,EAAUF,SAAQ,IAAMC,UAAU,IAMxC,OAJAE,iBAAgB,KACVV,GAAeI,GAAgB,EAAK,GACvC,CAACJ,IAGFW,KAACC,KAAW,IACN5B,KACAE,EACJhB,GAAIA,EACJU,SAAUA,EACVD,QAASA,EACTE,SAAUmB,EACVrC,aAAcA,EACd,uBAAmB,EACnBJ,IAAKA,EAAImB,SAETmC,CAAAA,IAACD,QAAc,CACbnB,GAAI/B,EACJoD,QAASA,KACFlC,GACHqB,GAAkBD,EACpB,EACAtB,SAEFmC,IAACD,OAAa,CACZ1C,GAAIoC,EACJS,KAAK,SACL,0BAAsB,EACtB,gBAAeN,EACf,gBAAeN,EACf,gBAAeA,IAAiBvB,GAAaC,SAAamC,IAAcjC,GACxEH,SAAUA,EACVkC,QAAUG,IACRA,EAAIC,kBACJjB,GAAkBD,EAAc,EAChCtB,SAEDC,EACCkC,IAACD,OAAa,IAAK1B,EAAWI,MAAOR,EAAWqC,sBAAwBC,aAAa1C,SACnFmC,IAACD,QAAc,CAAAlC,SACbmC,IAACQ,SAAQ,CAAC5B,GAAG,OAAO9B,aAAc,EAAG2D,MAAM,MAAM,2BAAuB,EAAA5C,SACtEmC,IAACU,KAAI,IAAK/B,UAIdgC,eAAerD,GACjBA,SACSA,GAAW,WACpBA,EAAO,CACLqB,aACAM,gBACAX,cAGFwB,KAACC,OAAa,IAAK1B,EAAWI,MAAOR,EAAWqC,sBAAwBC,aAAa1C,UAClFN,EACDyC,IAACD,QAAc,CAAAlC,SACZ8C,eAAenD,GACdA,SACSA,GAAY,WACrBA,EAAQ,CACNmB,aACAM,kBAGFa,KAAAc,SAAA,CAAA/C,SACG,CAAA8C,eAAelD,GACdA,SACSA,GAAU,WACnBA,EAAMkB,UACGlB,GAAU,iBAAmBA,GAAU,SAChDuC,IAACU,KAAI,IAAK/B,EAAUd,SAAGJ,IACrB,KACHkD,eAAejD,GACdA,SACSA,GAAa,WACtBA,EAASuB,UACAvB,GAAa,iBAAmBA,GAAa,SACtDsC,IAACU,KAAI,IAAKzB,EAAapB,SAAGH,IACxB,UAIVsC,IAACD,cAAoB,CAACc,GAAI1B,EAActB,SACrC8C,eAAehD,GAAQA,SAAcA,GAAS,WAAaA,EAAKW,GAAa0B,IAACc,KAAI,IAAKxC,aAMlG0B,IAACD,MAAY,CACX1C,GAAIuC,EACJmB,KAAK,SACL,kBAAiBtB,EACjBuB,QAAS1B,EACT2B,gBAAkBb,IACZA,EAAIc,eAAiB,WAAc/B,GACrCI,GAAgB,EAClB,EACA1B,SAEDC,EACCgC,KAACC,QAAc,IAAK1B,EAAWI,MAAOR,EAAWkD,uBAAyBC,cAAcvD,SAAA,CACtFmC,IAACQ,SAAQ,CAAC5B,GAAG,OAAO9B,aAAc,EAAG2D,MAAM,OAAOY,aAAa,QAAOxD,SACpEmC,IAACU,KAAI,IAAKzB,MAEZe,IAACQ,SAAQ,CAAC5B,GAAG,OAAO9B,aAAc,EAAG2D,MAAM,MAAK5C,SAC9CmC,IAACU,KAAI,IAAKzB,SAGZ0B,eAAe/C,GACjBA,EAEAoC,IAACD,QAAc,IAAK1B,EAAWI,MAAOR,EAAWkD,uBAAyBC,cAAcvD,SACrFA,QAIK,IAGlB,CACEyD,YAtNmB,gBAuNnB7C,MAAO8C"}

package/components/AccordionItem/hooks.js

@@ -0,0 +1,2 @@
+'use strict';var React=require('react');var accordion=require('../../shared/context/accordion.js');var misc=require('../../shared/utils/misc.js');exports.useAccordionPanel=({defaultExpanded:e=!1,id:n,expanded:t,onExpandedChange:o})=>{const a=React.useContext(accordion.AccordionPanelsContext);const[c,r]=React.useState(t??e);const s=a!==null&&typeof n=='string';return React.useLayoutEffect((()=>{s||t===void 0||r(t)}),[s,t]),{panelExpanded:s?a.expandedPanels.includes(n):c,setPanelExpanded:e=>{s?a.updatePanels(n,e):(t===void 0&&r(e),o&&o(e))}}},exports.useAccordionPanelProps=e=>{const n=React.useContext(accordion.AccordionPropsContext);return n?misc.deepmerge(n,e):e};
+//# sourceMappingURL=hooks.js.map

package/components/AccordionItem/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sources":["../../../../src/components/AccordionItem/hooks.ts"],"sourcesContent":["import { useContext, useState, useLayoutEffect } from 'react'\nimport { AccordionPanelsContext, AccordionPropsContext } from 'shared/context/accordion'\nimport { deepmerge } from 'shared/utils/misc'\nimport type { AccordionItemProps } from './types'\n\nexport const useAccordionPanel = ({\n  defaultExpanded = false,\n  id,\n  expanded,\n  onExpandedChange,\n}: Pick<AccordionItemProps, 'id' | 'expanded' | 'defaultExpanded' | 'onExpandedChange'>): {\n  panelExpanded: boolean\n  setPanelExpanded: (update: boolean) => void\n} => {\n  const context = useContext(AccordionPanelsContext)\n\n  const [panelExpandedLocal, setPanelExpandedLocal] = useState<boolean>(expanded ?? defaultExpanded)\n\n  const contextEnabled = context !== null && typeof id === 'string'\n\n  useLayoutEffect(() => {\n    if (!contextEnabled && expanded !== undefined) {\n      setPanelExpandedLocal(expanded)\n    }\n  }, [contextEnabled, expanded])\n\n  return {\n    panelExpanded: contextEnabled ? context.expandedPanels.includes(id) : panelExpandedLocal,\n    setPanelExpanded: (update) => {\n      if (contextEnabled) {\n        context.updatePanels(id, update)\n      } else {\n        if (expanded === undefined) setPanelExpandedLocal(update)\n        if (onExpandedChange) onExpandedChange(update)\n      }\n    },\n  }\n}\n\nexport const useAccordionPanelProps = <T>(props: T): T => {\n  const contextProps = useContext(AccordionPropsContext)\n\n  return (contextProps ? deepmerge(contextProps, props) : props) as T\n}\n"],"names":["useAccordionPanel","defaultExpanded","id","expanded","onExpandedChange","context","useContext","AccordionPanelsContext","panelExpandedLocal","setPanelExpandedLocal","useState","contextEnabled","useLayoutEffect","undefined","panelExpanded","expandedPanels","includes","setPanelExpanded","update","updatePanels","props","contextProps","AccordionPropsContext","deepmerge"],"mappings":"4KAKiCA,EAC/BC,mBAAkB,EAClBC,KACAC,WACAC,uBAKA,MAAMC,EAAUC,iBAAWC,UAAAA,wBAE3B,MAAOC,EAAoBC,GAAyBC,MAAAA,SAAkBP,GAAYF,GAElF,MAAMU,EAAiBN,IAAY,aAAeH,GAAO,SAQzD,OANAU,MAAAA,iBAAgB,KACTD,GAAkBR,SAAaU,GAClCJ,EAAsBN,EACxB,GACC,CAACQ,EAAgBR,IAEb,CACLW,cAAeH,EAAiBN,EAAQU,eAAeC,SAASd,GAAMM,EACtES,iBAAmBC,IACbP,EACFN,EAAQc,aAAajB,EAAIgB,IAErBf,SAAaU,GAAWJ,EAAsBS,GAC9Cd,GAAkBA,EAAiBc,GACzC,EAEH,iCAGuCE,IACxC,MAAMC,EAAef,iBAAWgB,UAAAA,uBAEhC,OAAQD,EAAeE,KAASA,UAACF,EAAcD,GAASA,CAAK"}

package/components/AccordionItem/hooks.mjs

@@ -0,0 +1,2 @@
+import{useContext,useState,useLayoutEffect}from'react';import{AccordionPanelsContext,AccordionPropsContext}from'../../shared/context/accordion.mjs';import{deepmerge}from'../../shared/utils/misc.mjs';const useAccordionPanel=({defaultExpanded:e=!1,id:o,expanded:n,onExpandedChange:t})=>{const s=useContext(AccordionPanelsContext);const[d,c]=useState(n??e);const r=s!==null&&typeof o=='string';return useLayoutEffect((()=>{r||n===void 0||c(n)}),[r,n]),{panelExpanded:r?s.expandedPanels.includes(o):d,setPanelExpanded:e=>{r?s.updatePanels(o,e):(n===void 0&&c(e),t&&t(e))}}};const useAccordionPanelProps=e=>{const o=useContext(AccordionPropsContext);return o?deepmerge(o,e):e};export{useAccordionPanel,useAccordionPanelProps};
+//# sourceMappingURL=hooks.mjs.map

package/components/AccordionItem/hooks.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.mjs","sources":["../../../../src/components/AccordionItem/hooks.ts"],"sourcesContent":["import { useContext, useState, useLayoutEffect } from 'react'\nimport { AccordionPanelsContext, AccordionPropsContext } from 'shared/context/accordion'\nimport { deepmerge } from 'shared/utils/misc'\nimport type { AccordionItemProps } from './types'\n\nexport const useAccordionPanel = ({\n  defaultExpanded = false,\n  id,\n  expanded,\n  onExpandedChange,\n}: Pick<AccordionItemProps, 'id' | 'expanded' | 'defaultExpanded' | 'onExpandedChange'>): {\n  panelExpanded: boolean\n  setPanelExpanded: (update: boolean) => void\n} => {\n  const context = useContext(AccordionPanelsContext)\n\n  const [panelExpandedLocal, setPanelExpandedLocal] = useState<boolean>(expanded ?? defaultExpanded)\n\n  const contextEnabled = context !== null && typeof id === 'string'\n\n  useLayoutEffect(() => {\n    if (!contextEnabled && expanded !== undefined) {\n      setPanelExpandedLocal(expanded)\n    }\n  }, [contextEnabled, expanded])\n\n  return {\n    panelExpanded: contextEnabled ? context.expandedPanels.includes(id) : panelExpandedLocal,\n    setPanelExpanded: (update) => {\n      if (contextEnabled) {\n        context.updatePanels(id, update)\n      } else {\n        if (expanded === undefined) setPanelExpandedLocal(update)\n        if (onExpandedChange) onExpandedChange(update)\n      }\n    },\n  }\n}\n\nexport const useAccordionPanelProps = <T>(props: T): T => {\n  const contextProps = useContext(AccordionPropsContext)\n\n  return (contextProps ? deepmerge(contextProps, props) : props) as T\n}\n"],"names":["useAccordionPanel","defaultExpanded","id","expanded","onExpandedChange","context","useContext","AccordionPanelsContext","panelExpandedLocal","setPanelExpandedLocal","useState","contextEnabled","useLayoutEffect","undefined","panelExpanded","expandedPanels","includes","setPanelExpanded","update","updatePanels","useAccordionPanelProps","props","contextProps","AccordionPropsContext","deepmerge"],"mappings":"uMAKO,MAAMA,kBAAoBA,EAC/BC,mBAAkB,EAClBC,KACAC,WACAC,uBAKA,MAAMC,EAAUC,WAAWC,wBAE3B,MAAOC,EAAoBC,GAAyBC,SAAkBP,GAAYF,GAElF,MAAMU,EAAiBN,IAAY,aAAeH,GAAO,SAQzD,OANAU,iBAAgB,KACTD,GAAkBR,SAAaU,GAClCJ,EAAsBN,EACxB,GACC,CAACQ,EAAgBR,IAEb,CACLW,cAAeH,EAAiBN,EAAQU,eAAeC,SAASd,GAAMM,EACtES,iBAAmBC,IACbP,EACFN,EAAQc,aAAajB,EAAIgB,IAErBf,SAAaU,GAAWJ,EAAsBS,GAC9Cd,GAAkBA,EAAiBc,GACzC,EAEH,EAGUE,MAAAA,uBAA6BC,IACxC,MAAMC,EAAehB,WAAWiB,uBAEhC,OAAQD,EAAeE,UAAUF,EAAcD,GAASA,CAAK"}

package/components/AccordionItem/sizes.js

@@ -0,0 +1,2 @@
+'use strict';var focus=require('../../mixins/focus.js');const SIZES_HEADER={l:{paddingTop:28,paddingRight:28,paddingBottom:28,paddingLeft:28},m:{paddingTop:16,paddingRight:16,paddingBottom:16,paddingLeft:16},s:{paddingTop:12,paddingRight:12,paddingBottom:12,paddingLeft:12},xs:{paddingTop:6,paddingRight:6,paddingBottom:6,paddingLeft:6}};const SIZES_HEADER_EMBEDDED={l:{...SIZES_HEADER.l,paddingRight:0,paddingLeft:0},m:{...SIZES_HEADER.m,paddingRight:0,paddingLeft:0},s:{...SIZES_HEADER.s,paddingRight:0,paddingLeft:0},xs:{...SIZES_HEADER.xs,paddingRight:0,paddingLeft:0}};const SIZES_DETAILS={l:{paddingTop:focus.focus.padding,paddingRight:28+focus.focus.padding,paddingBottom:28+focus.focus.padding,paddingLeft:28+focus.focus.padding},m:{paddingTop:focus.focus.padding,paddingRight:16+focus.focus.padding,paddingBottom:16+focus.focus.padding,paddingLeft:16+focus.focus.padding},s:{paddingTop:focus.focus.padding,paddingRight:12+focus.focus.padding,paddingBottom:12+focus.focus.padding,paddingLeft:12+focus.focus.padding},xs:{paddingTop:focus.focus.padding,paddingRight:6+focus.focus.padding,paddingBottom:6+focus.focus.padding,paddingLeft:6+focus.focus.padding}};const SIZES_DETAILS_EMBEDDED={l:{...SIZES_DETAILS.l,paddingRight:focus.focus.padding,paddingLeft:focus.focus.padding},m:{...SIZES_DETAILS.m,paddingRight:focus.focus.padding,paddingLeft:focus.focus.padding},s:{...SIZES_DETAILS.s,paddingRight:focus.focus.padding,paddingLeft:focus.focus.padding},xs:{...SIZES_DETAILS.xs,paddingRight:focus.focus.padding,paddingLeft:focus.focus.padding}};exports.SIZES={l:{width:'100%',minWidth:'min-content'},m:{width:'100%',minWidth:'min-content'},s:{width:'100%',minWidth:'min-content'},xs:{width:'100%',minWidth:'min-content'}},exports.SIZES_DETAILS=SIZES_DETAILS,exports.SIZES_DETAILS_EMBEDDED=SIZES_DETAILS_EMBEDDED,exports.SIZES_HEADER=SIZES_HEADER,exports.SIZES_HEADER_EMBEDDED=SIZES_HEADER_EMBEDDED,exports.SIZES_ICON={l:{fontSize:32},m:{fontSize:24},s:{fontSize:20},xs:{fontSize:20}},exports.SIZES_SUBTITLE={l:{fontSize:18},m:{fontSize:16},s:{fontSize:14},xs:{fontSize:14}},exports.SIZES_TITLE={l:{fontSize:24},m:{fontSize:20},s:{fontSize:16},xs:{fontSize:16}};
+//# sourceMappingURL=sizes.js.map

package/components/AccordionItem/sizes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizes.js","sources":["../../../../src/components/AccordionItem/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { focus } from 'mixins/focus'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  m: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  s: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  xs: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n}\n\nexport const SIZES_HEADER: Record<Size, CSSProperties> = {\n  l: {\n    paddingTop: 28,\n    paddingRight: 28,\n    paddingBottom: 28,\n    paddingLeft: 28,\n  },\n  m: {\n    paddingTop: 16,\n    paddingRight: 16,\n    paddingBottom: 16,\n    paddingLeft: 16,\n  },\n  s: {\n    paddingTop: 12,\n    paddingRight: 12,\n    paddingBottom: 12,\n    paddingLeft: 12,\n  },\n  xs: {\n    paddingTop: 6,\n    paddingRight: 6,\n    paddingBottom: 6,\n    paddingLeft: 6,\n  },\n}\n\nexport const SIZES_HEADER_EMBEDDED: Record<Size, CSSProperties> = {\n  l: {\n    ...SIZES_HEADER.l,\n    paddingRight: 0,\n    paddingLeft: 0,\n  },\n  m: {\n    ...SIZES_HEADER.m,\n    paddingRight: 0,\n    paddingLeft: 0,\n  },\n  s: {\n    ...SIZES_HEADER.s,\n    paddingRight: 0,\n    paddingLeft: 0,\n  },\n  xs: {\n    ...SIZES_HEADER.xs,\n    paddingRight: 0,\n    paddingLeft: 0,\n  },\n}\n\nexport const SIZES_DETAILS: Record<Size, CSSProperties> = {\n  l: {\n    paddingTop: focus.padding,\n    paddingRight: 28 + focus.padding,\n    paddingBottom: 28 + focus.padding,\n    paddingLeft: 28 + focus.padding,\n  },\n  m: {\n    paddingTop: focus.padding,\n    paddingRight: 16 + focus.padding,\n    paddingBottom: 16 + focus.padding,\n    paddingLeft: 16 + focus.padding,\n  },\n  s: {\n    paddingTop: focus.padding,\n    paddingRight: 12 + focus.padding,\n    paddingBottom: 12 + focus.padding,\n    paddingLeft: 12 + focus.padding,\n  },\n  xs: {\n    paddingTop: focus.padding,\n    paddingRight: 6 + focus.padding,\n    paddingBottom: 6 + focus.padding,\n    paddingLeft: 6 + focus.padding,\n  },\n}\n\nexport const SIZES_DETAILS_EMBEDDED: Record<Size, CSSProperties> = {\n  l: {\n    ...SIZES_DETAILS.l,\n    paddingRight: focus.padding,\n    paddingLeft: focus.padding,\n  },\n  m: {\n    ...SIZES_DETAILS.m,\n    paddingRight: focus.padding,\n    paddingLeft: focus.padding,\n  },\n  s: {\n    ...SIZES_DETAILS.s,\n    paddingRight: focus.padding,\n    paddingLeft: focus.padding,\n  },\n  xs: {\n    ...SIZES_DETAILS.xs,\n    paddingRight: focus.padding,\n    paddingLeft: focus.padding,\n  },\n}\n\nexport const SIZES_TITLE: Record<Size, CSSProperties> = {\n  l: { fontSize: 24 },\n  m: { fontSize: 20 },\n  s: { fontSize: 16 },\n  xs: { fontSize: 16 },\n}\n\nexport const SIZES_SUBTITLE: Record<Size, CSSProperties> = {\n  l: { fontSize: 18 },\n  m: { fontSize: 16 },\n  s: { fontSize: 14 },\n  xs: { fontSize: 14 },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n  l: { fontSize: 32 },\n  m: { fontSize: 24 },\n  s: { fontSize: 20 },\n  xs: { fontSize: 20 },\n}\n"],"names":["SIZES_HEADER","l","paddingTop","paddingRight","paddingBottom","paddingLeft","m","s","xs","SIZES_HEADER_EMBEDDED","SIZES_DETAILS","focus","padding","SIZES_DETAILS_EMBEDDED","width","minWidth","fontSize"],"mappings":"wDAuBO,MAAMA,aAA4C,CACvDC,EAAG,CACDC,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,IAEfC,EAAG,CACDJ,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,IAEfE,EAAG,CACDL,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,IAEfG,GAAI,CACFN,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,IAIV,MAAMI,sBAAqD,CAChER,EAAG,IACED,aAAaC,EAChBE,aAAc,EACdE,YAAa,GAEfC,EAAG,IACEN,aAAaM,EAChBH,aAAc,EACdE,YAAa,GAEfE,EAAG,IACEP,aAAaO,EAChBJ,aAAc,EACdE,YAAa,GAEfG,GAAI,IACCR,aAAaQ,GAChBL,aAAc,EACdE,YAAa,IAIV,MAAMK,cAA6C,CACxDT,EAAG,CACDC,WAAYS,MAAKA,MAACC,QAClBT,aAAc,GAAKQ,MAAAA,MAAMC,QACzBR,cAAe,GAAKO,MAAAA,MAAMC,QAC1BP,YAAa,GAAKM,MAAAA,MAAMC,SAE1BN,EAAG,CACDJ,WAAYS,MAAKA,MAACC,QAClBT,aAAc,GAAKQ,MAAAA,MAAMC,QACzBR,cAAe,GAAKO,MAAAA,MAAMC,QAC1BP,YAAa,GAAKM,MAAAA,MAAMC,SAE1BL,EAAG,CACDL,WAAYS,MAAKA,MAACC,QAClBT,aAAc,GAAKQ,MAAAA,MAAMC,QACzBR,cAAe,GAAKO,MAAAA,MAAMC,QAC1BP,YAAa,GAAKM,MAAAA,MAAMC,SAE1BJ,GAAI,CACFN,WAAYS,MAAKA,MAACC,QAClBT,aAAc,EAAIQ,MAAAA,MAAMC,QACxBR,cAAe,EAAIO,MAAAA,MAAMC,QACzBP,YAAa,EAAIM,MAAAA,MAAMC,UAIpB,MAAMC,uBAAsD,CACjEZ,EAAG,IACES,cAAcT,EACjBE,aAAcQ,MAAKA,MAACC,QACpBP,YAAaM,MAAKA,MAACC,SAErBN,EAAG,IACEI,cAAcJ,EACjBH,aAAcQ,MAAKA,MAACC,QACpBP,YAAaM,MAAKA,MAACC,SAErBL,EAAG,IACEG,cAAcH,EACjBJ,aAAcQ,MAAKA,MAACC,QACpBP,YAAaM,MAAKA,MAACC,SAErBJ,GAAI,IACCE,cAAcF,GACjBL,aAAcQ,MAAKA,MAACC,QACpBP,YAAaM,MAAKA,MAACC,wBAnH2B,CAChDX,EAAG,CACDa,MAAO,OACPC,SAAU,eAEZT,EAAG,CACDQ,MAAO,OACPC,SAAU,eAEZR,EAAG,CACDO,MAAO,OACPC,SAAU,eAEZP,GAAI,CACFM,MAAO,OACPC,SAAU,mNAsHyC,CACrDd,EAAG,CAAEe,SAAU,IACfV,EAAG,CAAEU,SAAU,IACfT,EAAG,CAAES,SAAU,IACfR,GAAI,CAAEQ,SAAU,4BAXyC,CACzDf,EAAG,CAAEe,SAAU,IACfV,EAAG,CAAEU,SAAU,IACfT,EAAG,CAAES,SAAU,IACfR,GAAI,CAAEQ,SAAU,yBAXsC,CACtDf,EAAG,CAAEe,SAAU,IACfV,EAAG,CAAEU,SAAU,IACfT,EAAG,CAAES,SAAU,IACfR,GAAI,CAAEQ,SAAU"}

package/components/AccordionItem/sizes.mjs

@@ -0,0 +1,2 @@
+import{focus}from'../../mixins/focus.mjs';const SIZES={l:{width:'100%',minWidth:'min-content'},m:{width:'100%',minWidth:'min-content'},s:{width:'100%',minWidth:'min-content'},xs:{width:'100%',minWidth:'min-content'}};const SIZES_HEADER={l:{paddingTop:28,paddingRight:28,paddingBottom:28,paddingLeft:28},m:{paddingTop:16,paddingRight:16,paddingBottom:16,paddingLeft:16},s:{paddingTop:12,paddingRight:12,paddingBottom:12,paddingLeft:12},xs:{paddingTop:6,paddingRight:6,paddingBottom:6,paddingLeft:6}};const SIZES_HEADER_EMBEDDED={l:{...SIZES_HEADER.l,paddingRight:0,paddingLeft:0},m:{...SIZES_HEADER.m,paddingRight:0,paddingLeft:0},s:{...SIZES_HEADER.s,paddingRight:0,paddingLeft:0},xs:{...SIZES_HEADER.xs,paddingRight:0,paddingLeft:0}};const SIZES_DETAILS={l:{paddingTop:focus.padding,paddingRight:28+focus.padding,paddingBottom:28+focus.padding,paddingLeft:28+focus.padding},m:{paddingTop:focus.padding,paddingRight:16+focus.padding,paddingBottom:16+focus.padding,paddingLeft:16+focus.padding},s:{paddingTop:focus.padding,paddingRight:12+focus.padding,paddingBottom:12+focus.padding,paddingLeft:12+focus.padding},xs:{paddingTop:focus.padding,paddingRight:6+focus.padding,paddingBottom:6+focus.padding,paddingLeft:6+focus.padding}};const SIZES_DETAILS_EMBEDDED={l:{...SIZES_DETAILS.l,paddingRight:focus.padding,paddingLeft:focus.padding},m:{...SIZES_DETAILS.m,paddingRight:focus.padding,paddingLeft:focus.padding},s:{...SIZES_DETAILS.s,paddingRight:focus.padding,paddingLeft:focus.padding},xs:{...SIZES_DETAILS.xs,paddingRight:focus.padding,paddingLeft:focus.padding}};const SIZES_TITLE={l:{fontSize:24},m:{fontSize:20},s:{fontSize:16},xs:{fontSize:16}};const SIZES_SUBTITLE={l:{fontSize:18},m:{fontSize:16},s:{fontSize:14},xs:{fontSize:14}};const SIZES_ICON={l:{fontSize:32},m:{fontSize:24},s:{fontSize:20},xs:{fontSize:20}};export{SIZES,SIZES_DETAILS,SIZES_DETAILS_EMBEDDED,SIZES_HEADER,SIZES_HEADER_EMBEDDED,SIZES_ICON,SIZES_SUBTITLE,SIZES_TITLE};
+//# sourceMappingURL=sizes.mjs.map

package/components/AccordionItem/sizes.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizes.mjs","sources":["../../../../src/components/AccordionItem/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { focus } from 'mixins/focus'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  m: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  s: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n  xs: {\n    width: '100%',\n    minWidth: 'min-content',\n  },\n}\n\nexport const SIZES_HEADER: Record<Size, CSSProperties> = {\n  l: {\n    paddingTop: 28,\n    paddingRight: 28,\n    paddingBottom: 28,\n    paddingLeft: 28,\n  },\n  m: {\n    paddingTop: 16,\n    paddingRight: 16,\n    paddingBottom: 16,\n    paddingLeft: 16,\n  },\n  s: {\n    paddingTop: 12,\n    paddingRight: 12,\n    paddingBottom: 12,\n    paddingLeft: 12,\n  },\n  xs: {\n    paddingTop: 6,\n    paddingRight: 6,\n    paddingBottom: 6,\n    paddingLeft: 6,\n  },\n}\n\nexport const SIZES_HEADER_EMBEDDED: Record<Size, CSSProperties> = {\n  l: {\n    ...SIZES_HEADER.l,\n    paddingRight: 0,\n    paddingLeft: 0,\n  },\n  m: {\n    ...SIZES_HEADER.m,\n    paddingRight: 0,\n    paddingLeft: 0,\n  },\n  s: {\n    ...SIZES_HEADER.s,\n    paddingRight: 0,\n    paddingLeft: 0,\n  },\n  xs: {\n    ...SIZES_HEADER.xs,\n    paddingRight: 0,\n    paddingLeft: 0,\n  },\n}\n\nexport const SIZES_DETAILS: Record<Size, CSSProperties> = {\n  l: {\n    paddingTop: focus.padding,\n    paddingRight: 28 + focus.padding,\n    paddingBottom: 28 + focus.padding,\n    paddingLeft: 28 + focus.padding,\n  },\n  m: {\n    paddingTop: focus.padding,\n    paddingRight: 16 + focus.padding,\n    paddingBottom: 16 + focus.padding,\n    paddingLeft: 16 + focus.padding,\n  },\n  s: {\n    paddingTop: focus.padding,\n    paddingRight: 12 + focus.padding,\n    paddingBottom: 12 + focus.padding,\n    paddingLeft: 12 + focus.padding,\n  },\n  xs: {\n    paddingTop: focus.padding,\n    paddingRight: 6 + focus.padding,\n    paddingBottom: 6 + focus.padding,\n    paddingLeft: 6 + focus.padding,\n  },\n}\n\nexport const SIZES_DETAILS_EMBEDDED: Record<Size, CSSProperties> = {\n  l: {\n    ...SIZES_DETAILS.l,\n    paddingRight: focus.padding,\n    paddingLeft: focus.padding,\n  },\n  m: {\n    ...SIZES_DETAILS.m,\n    paddingRight: focus.padding,\n    paddingLeft: focus.padding,\n  },\n  s: {\n    ...SIZES_DETAILS.s,\n    paddingRight: focus.padding,\n    paddingLeft: focus.padding,\n  },\n  xs: {\n    ...SIZES_DETAILS.xs,\n    paddingRight: focus.padding,\n    paddingLeft: focus.padding,\n  },\n}\n\nexport const SIZES_TITLE: Record<Size, CSSProperties> = {\n  l: { fontSize: 24 },\n  m: { fontSize: 20 },\n  s: { fontSize: 16 },\n  xs: { fontSize: 16 },\n}\n\nexport const SIZES_SUBTITLE: Record<Size, CSSProperties> = {\n  l: { fontSize: 18 },\n  m: { fontSize: 16 },\n  s: { fontSize: 14 },\n  xs: { fontSize: 14 },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n  l: { fontSize: 32 },\n  m: { fontSize: 24 },\n  s: { fontSize: 20 },\n  xs: { fontSize: 20 },\n}\n"],"names":["SIZES","l","width","minWidth","m","s","xs","SIZES_HEADER","paddingTop","paddingRight","paddingBottom","paddingLeft","SIZES_HEADER_EMBEDDED","SIZES_DETAILS","focus","padding","SIZES_DETAILS_EMBEDDED","SIZES_TITLE","fontSize","SIZES_SUBTITLE","SIZES_ICON"],"mappings":"0CAIO,MAAMA,MAAqC,CAChDC,EAAG,CACDC,MAAO,OACPC,SAAU,eAEZC,EAAG,CACDF,MAAO,OACPC,SAAU,eAEZE,EAAG,CACDH,MAAO,OACPC,SAAU,eAEZG,GAAI,CACFJ,MAAO,OACPC,SAAU,gBAIP,MAAMI,aAA4C,CACvDN,EAAG,CACDO,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,IAEfP,EAAG,CACDI,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,IAEfN,EAAG,CACDG,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,IAEfL,GAAI,CACFE,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,IAIV,MAAMC,sBAAqD,CAChEX,EAAG,IACEM,aAAaN,EAChBQ,aAAc,EACdE,YAAa,GAEfP,EAAG,IACEG,aAAaH,EAChBK,aAAc,EACdE,YAAa,GAEfN,EAAG,IACEE,aAAaF,EAChBI,aAAc,EACdE,YAAa,GAEfL,GAAI,IACCC,aAAaD,GAChBG,aAAc,EACdE,YAAa,IAIV,MAAME,cAA6C,CACxDZ,EAAG,CACDO,WAAYM,MAAMC,QAClBN,aAAc,GAAKK,MAAMC,QACzBL,cAAe,GAAKI,MAAMC,QAC1BJ,YAAa,GAAKG,MAAMC,SAE1BX,EAAG,CACDI,WAAYM,MAAMC,QAClBN,aAAc,GAAKK,MAAMC,QACzBL,cAAe,GAAKI,MAAMC,QAC1BJ,YAAa,GAAKG,MAAMC,SAE1BV,EAAG,CACDG,WAAYM,MAAMC,QAClBN,aAAc,GAAKK,MAAMC,QACzBL,cAAe,GAAKI,MAAMC,QAC1BJ,YAAa,GAAKG,MAAMC,SAE1BT,GAAI,CACFE,WAAYM,MAAMC,QAClBN,aAAc,EAAIK,MAAMC,QACxBL,cAAe,EAAII,MAAMC,QACzBJ,YAAa,EAAIG,MAAMC,UAIpB,MAAMC,uBAAsD,CACjEf,EAAG,IACEY,cAAcZ,EACjBQ,aAAcK,MAAMC,QACpBJ,YAAaG,MAAMC,SAErBX,EAAG,IACES,cAAcT,EACjBK,aAAcK,MAAMC,QACpBJ,YAAaG,MAAMC,SAErBV,EAAG,IACEQ,cAAcR,EACjBI,aAAcK,MAAMC,QACpBJ,YAAaG,MAAMC,SAErBT,GAAI,IACCO,cAAcP,GACjBG,aAAcK,MAAMC,QACpBJ,YAAaG,MAAMC,UAIhB,MAAME,YAA2C,CACtDhB,EAAG,CAAEiB,SAAU,IACfd,EAAG,CAAEc,SAAU,IACfb,EAAG,CAAEa,SAAU,IACfZ,GAAI,CAAEY,SAAU,KAGX,MAAMC,eAA8C,CACzDlB,EAAG,CAAEiB,SAAU,IACfd,EAAG,CAAEc,SAAU,IACfb,EAAG,CAAEa,SAAU,IACfZ,GAAI,CAAEY,SAAU,KAGX,MAAME,WAA0C,CACrDnB,EAAG,CAAEiB,SAAU,IACfd,EAAG,CAAEc,SAAU,IACfb,EAAG,CAAEa,SAAU,IACfZ,GAAI,CAAEY,SAAU"}

package/components/AccordionItem/style.js

@@ -0,0 +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');var focus=require('../../mixins/focus.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var styled__default=_interopDefault(styled);const shouldForwardAccordionItemProp=style.createShouldForwardProp((e=>!['expanded','disabled','loading','borderRadius'].includes(e)));const shouldForwardAccordionItemCommonProp=style.createShouldForwardProp();const Heading=styled__default.default.h3.withConfig({displayName:"AccordionItem__Heading",componentId:"ui__sc-7h1z5c-0"})(["box-sizing:border-box;display:flex;margin:0;padding:","px;border-radius:inherit;font:inherit;transition-property:color;transition-duration:150ms;transition-timing-function:ease-in;"],focus.focus.padding);const template=e=>`\n  background-color: ${e.backgroundColor};\n\n  & ${Heading} {\n    color: ${e.headerColor};\n    background-color: ${e.headerBackgroundColor};\n  }\n  & ${Heading}:hover {\n    color: ${e.headerColorHover};\n  }\n`;const COLOR_SCHEMA={primary:{default:styled.css(["",""],(e=>template({headerColor:e.palette.headerColor??e.theme.colors['content-onmain-primary'],headerColorHover:e.palette.headerColorExpanded??e.palette.headerColor??e.theme.colors['content-brand-primary'],headerBackgroundColor:e.palette.headerBackgroundColor??e.theme.colors.transparent,backgroundColor:e.palette.backgroundColor??e.theme.colors['bg-onmain-primary']}))),expanded:styled.css(["",""],(e=>template({headerColor:e.palette.headerColorExpanded??e.palette.headerColor??e.theme.colors['content-brand-primary'],headerColorHover:e.palette.headerColorExpanded??e.palette.headerColor??e.theme.colors['content-brand-primary'],headerBackgroundColor:e.palette.headerBackgroundColorExpanded??e.palette.headerBackgroundColor??e.theme.colors.transparent,backgroundColor:e.palette.backgroundColorExpanded??e.palette.backgroundColor??e.theme.colors['bg-onmain-primary']}))),disabled:styled.css(["",""],(e=>template({headerColor:e.palette.headerColorDisabled??e.theme.colors['content-disabled'],headerColorHover:e.palette.headerColorDisabled??e.theme.colors['content-disabled'],headerBackgroundColor:e.palette.headerBackgroundColorDisabled??e.theme.colors.transparent,backgroundColor:e.palette.backgroundColorDisabled??e.theme.colors['bg-onmain-primary']})))},secondary:{default:styled.css(["",""],(e=>template({headerColor:e.palette.headerColor??e.theme.colors['content-onmain-primary'],headerColorHover:e.palette.headerColorExpanded??e.palette.headerColor??e.theme.colors['content-brand-primary'],headerBackgroundColor:e.palette.headerBackgroundColor??e.theme.colors.transparent,backgroundColor:e.palette.backgroundColor??e.theme.colors['bg-onmain-secondary']}))),expanded:styled.css(["",""],(e=>template({headerColor:e.palette.headerColorExpanded??e.palette.headerColor??e.theme.colors['content-brand-primary'],headerColorHover:e.palette.headerColorExpanded??e.palette.headerColor??e.theme.colors['content-brand-primary'],headerBackgroundColor:e.palette.headerBackgroundColorExpanded??e.palette.headerBackgroundColor??e.theme.colors.transparent,backgroundColor:e.palette.backgroundColorExpanded??e.palette.backgroundColor??e.theme.colors['bg-onmain-secondary']}))),disabled:styled.css(["",""],(e=>template({headerColor:e.palette.headerColorDisabled??e.theme.colors['content-disabled'],headerColorHover:e.palette.headerColorDisabled??e.theme.colors['content-disabled'],headerBackgroundColor:e.palette.headerBackgroundColorDisabled??e.theme.colors.transparent,backgroundColor:e.palette.backgroundColorDisabled??e.theme.colors['bg-onmain-secondary']})))},transparent:{default:styled.css(["",""],(e=>template({headerColor:e.palette.headerColor??e.theme.colors['content-onmain-primary'],headerColorHover:e.palette.headerColorExpanded??e.palette.headerColor??e.theme.colors['content-brand-primary'],headerBackgroundColor:e.palette.headerBackgroundColor??e.theme.colors.transparent,backgroundColor:e.palette.backgroundColor??e.theme.colors.transparent}))),expanded:styled.css(["",""],(e=>template({headerColor:e.palette.headerColorExpanded??e.palette.headerColor??e.theme.colors['content-brand-primary'],headerColorHover:e.palette.headerColorExpanded??e.palette.headerColor??e.theme.colors['content-brand-primary'],headerBackgroundColor:e.palette.headerBackgroundColorExpanded??e.palette.headerBackgroundColor??e.theme.colors.transparent,backgroundColor:e.palette.backgroundColorExpanded??e.palette.backgroundColor??e.theme.colors.transparent}))),disabled:styled.css(["",""],(e=>template({headerColor:e.palette.headerColorDisabled??e.theme.colors['content-disabled'],headerColorHover:e.palette.headerColorDisabled??e.theme.colors['content-disabled'],headerBackgroundColor:e.palette.headerBackgroundColorDisabled??e.theme.colors.transparent,backgroundColor:e.palette.backgroundColorDisabled??e.theme.colors.transparent})))}};const Panel=styled__default.default.div.withConfig({displayName:"AccordionItem__Panel",componentId:"ui__sc-7h1z5c-1"})(["box-sizing:border-box;overflow:hidden;transition-property:opacity;"]);const Button=styled__default.default.button.withConfig({displayName:"AccordionItem__Button",componentId:"ui__sc-7h1z5c-2"})(["box-sizing:border-box;display:flex;flex-grow:1;appearance:none;border:none;margin:0;padding:0;color:inherit;background-color:transparent;font:inherit;cursor:inherit;text-align:left;",""],focus.focus);const Root=styled__default.default.section.withConfig({shouldForwardProp:shouldForwardAccordionItemProp}).withConfig({displayName:"AccordionItem__Root",componentId:"ui__sc-7h1z5c-3"})(["box-sizing:border-box;display:grid;transition-property:grid-template-rows;&,& > ","{transition-timing-function:cubic-bezier(0.42,0,0.75,1);transition-duration:250ms;}@media (prefers-reduced-motion:reduce){transition-duration:0ms;}"," "," "," "," ",""],Panel,(e=>e.expanded?`\n        grid-template-rows: 0fr 1fr;\n        & > ${Panel} {\n          opacity: 1;\n        }\n      `:`\n        grid-template-rows: 0fr 0fr;\n        & > ${Panel} {\n          opacity: 0;\n        }\n      `),(e=>`\n    border-radius: ${e.borderRadius}px;\n    \n    & ${Button} {\n      border-radius: ${e.borderRadius>focus.focus.padding?e.borderRadius-focus.focus.padding:0}px;\n    }\n    \n    & ${Heading} {\n      cursor: ${e.loading?'wait':e.disabled?'not-allowed':'pointer'};\n    }\n  `),(e=>{let o=COLOR_SCHEMA.transparent;return e.primary&&(o=COLOR_SCHEMA.primary),e.secondary&&(o=COLOR_SCHEMA.secondary),e.disabled?o.disabled:e.expanded?o.expanded:o.default}),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Header=styled__default.default.span.withConfig({shouldForwardProp:shouldForwardAccordionItemCommonProp}).withConfig({displayName:"AccordionItem__Header",componentId:"ui__sc-7h1z5c-4"})(["box-sizing:border-box;display:flex;flex-grow:1;& > *:not(:last-child){margin-right:8px;}",""],responsiveSize.responsiveSize);const Content=styled__default.default.span.withConfig({displayName:"AccordionItem__Content",componentId:"ui__sc-7h1z5c-5"})(["box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;align-self:center;flex-grow:1;"]);const IconAnimation=styled__default.default.span.withConfig({shouldForwardProp:e=>e!=='up'}).withConfig({displayName:"AccordionItem__IconAnimation",componentId:"ui__sc-7h1z5c-6"})(["box-sizing:border-box;display:flex;align-self:flex-start;flex-shrink:0;transition-property:transform;transition-duration:250ms;transform-origin:center;@media (prefers-reduced-motion:reduce){transition-duration:0ms;}",""],(e=>`\n    transform: rotate(${e.up?180:0}deg);\n  `));const Details=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardAccordionItemCommonProp}).withConfig({displayName:"AccordionItem__Details",componentId:"ui__sc-7h1z5c-7"})(["box-sizing:border-box;",""],responsiveSize.responsiveSize);exports.Button=Button,exports.Content=Content,exports.Details=Details,exports.Header=Header,exports.Heading=Heading,exports.IconAnimation=IconAnimation,exports.Panel=Panel,exports.Root=Root;
+//# sourceMappingURL=style.js.map