@foxford/ui 2.116.0 → 2.117.0

package/components/AccordionItem/AccordionItem.js

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

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.js","sources":["../../../../src/components/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement, useLayoutEffect, useMemo } from 'react'\nimport { ChevronDown } from '@foxford/icon-pack'\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 } from './useAccordionPanel'\nimport { useAccordionPanelProps } from './useAccordionPanelProps'\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      icon: <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={Boolean(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","_jsx","ChevronDown","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","onClick","type","Boolean","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":"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"}
+{"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 } from './useAccordionPanel'\nimport { useAccordionPanelProps } from './useAccordionPanelProps'\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      icon: <Styled.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={Boolean(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","_jsx","Styled","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","onClick","type","Boolean","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":"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"}

package/components/AccordionItem/AccordionItem.mjs

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

package/components/AccordionItem/AccordionItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.mjs","sources":["../../../../src/components/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement, useLayoutEffect, useMemo } from 'react'\nimport { ChevronDown } from '@foxford/icon-pack'\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 } from './useAccordionPanel'\nimport { useAccordionPanelProps } from './useAccordionPanelProps'\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      icon: <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={Boolean(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","_jsx","ChevronDown","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","onClick","type","Boolean","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":"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"}
+{"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 } from './useAccordionPanel'\nimport { useAccordionPanelProps } from './useAccordionPanelProps'\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      icon: <Styled.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={Boolean(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","_jsx","Styled","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","onClick","type","Boolean","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":"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"}

package/components/AccordionItem/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 hover=require('../../mixins/hover.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  ${hover.hover(`color: ${e.headerColorHover};`,`& ${Heading}:hover`)}\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;
+'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 hover=require('../../mixins/hover.js');var index=require('../../icon-pack/src/icons/ChevronUp/index.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  ${hover.hover(`color: ${e.headerColorHover};`,`& ${Heading}:hover`)}\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 ChevronDown=styled__default.default(index.ChevronUp).withConfig({displayName:"AccordionItem__ChevronDown",componentId:"ui__sc-7h1z5c-7"})(["transform-origin:center;transform:scaleY(-1);"]);const Details=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardAccordionItemCommonProp}).withConfig({displayName:"AccordionItem__Details",componentId:"ui__sc-7h1z5c-8"})(["box-sizing:border-box;",""],responsiveSize.responsiveSize);exports.Button=Button,exports.ChevronDown=ChevronDown,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

package/components/AccordionItem/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/AccordionItem/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 type { ResponsiveSizeProps, ResponsiveSizeInterpolationProps } from 'shared/interfaces'\nimport { hover } from 'mixins/hover'\nimport type { Size, AccordionItemPalette, StyledAccordionItemProps } from './types'\n\nconst shouldForwardAccordionItemProp = createShouldForwardProp(\n  (propKey) => !['expanded', 'disabled', 'loading', 'borderRadius'].includes(propKey)\n)\n\nconst shouldForwardAccordionItemCommonProp = createShouldForwardProp()\n\nexport const Heading = styled.h3`\n  box-sizing: border-box;\n  display: flex;\n  margin: 0;\n  padding: ${focus.padding}px;\n  border-radius: inherit;\n  font: inherit;\n  transition-property: color;\n  transition-duration: 150ms;\n  transition-timing-function: ease-in;\n`\n\nconst template = (palette: AccordionItemPalette) => `\n  background-color: ${palette.backgroundColor};\n\n  & ${Heading} {\n    color: ${palette.headerColor};\n    background-color: ${palette.headerBackgroundColor};\n  }\n  ${hover(`color: ${palette.headerColorHover};`, `& ${Heading}:hover`)}\n`\n\nconst COLOR_SCHEMA = {\n  primary: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ??\n            props.palette.backgroundColor ??\n            props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n  },\n  secondary: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ??\n            props.palette.backgroundColor ??\n            props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n  },\n  transparent: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors.transparent,\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ?? props.palette.backgroundColor ?? props.theme.colors.transparent,\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors.transparent,\n        })}\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 Button = styled.button`\n  box-sizing: border-box;\n  display: flex;\n  flex-grow: 1;\n  appearance: none;\n  border: none;\n  margin: 0;\n  padding: 0;\n  color: inherit;\n  background-color: transparent;\n  font: inherit;\n  cursor: inherit;\n  text-align: left;\n\n  ${focus}\n`\n\nexport const Root = styled.section.withConfig<StyledAccordionItemProps>({\n  shouldForwardProp: shouldForwardAccordionItemProp,\n})`\n  box-sizing: border-box;\n  display: grid;\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  @media (prefers-reduced-motion: reduce) {\n    transition-duration: 0ms;\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    border-radius: ${props.borderRadius}px;\n    \n    & ${Button} {\n      border-radius: ${props.borderRadius > focus.padding ? props.borderRadius - focus.padding : 0}px;\n    }\n    \n    & ${Heading} {\n      cursor: ${props.loading ? 'wait' : props.disabled ? 'not-allowed' : 'pointer'};\n    }\n  `}\n\n  ${(props) => {\n    let schema = COLOR_SCHEMA.transparent\n\n    if (props.primary) {\n      schema = COLOR_SCHEMA.primary\n    }\n    if (props.secondary) {\n      schema = COLOR_SCHEMA.secondary\n    }\n\n    if (props.disabled) return schema.disabled\n    if (props.expanded) return schema.expanded\n\n    return schema.default\n  }}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Header = styled.span.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n  shouldForwardProp: shouldForwardAccordionItemCommonProp,\n})`\n  box-sizing: border-box;\n  display: flex;\n  flex-grow: 1;\n\n  & > *:not(:last-child) {\n    margin-right: 8px;\n  }\n\n  ${responsiveSize}\n`\n\nexport const Content = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  align-self: center;\n  flex-grow: 1;\n`\n\nexport const IconAnimation = styled.span.withConfig<{ up: boolean }>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  box-sizing: border-box;\n  display: flex;\n  align-self: flex-start;\n  flex-shrink: 0;\n  transition-property: transform;\n  transition-duration: 250ms;\n  transform-origin: center;\n  @media (prefers-reduced-motion: reduce) {\n    transition-duration: 0ms;\n  }\n  ${(props) => `\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const Details = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n  shouldForwardProp: shouldForwardAccordionItemCommonProp,\n})`\n  box-sizing: border-box;\n\n  ${responsiveSize}\n`\n"],"names":["shouldForwardAccordionItemProp","createShouldForwardProp","propKey","includes","shouldForwardAccordionItemCommonProp","Heading","styled","h3","withConfig","displayName","componentId","focus","padding","template","palette","backgroundColor","headerColor","headerBackgroundColor","hover","headerColorHover","COLOR_SCHEMA","primary","default","css","props","theme","colors","headerColorExpanded","transparent","expanded","headerBackgroundColorExpanded","backgroundColorExpanded","disabled","headerColorDisabled","headerBackgroundColorDisabled","backgroundColorDisabled","secondary","Panel","div","Button","button","Root","section","shouldForwardProp","borderRadius","loading","schema","responsiveSize","responsiveMargin","Header","span","Content","IconAnimation","up","Details"],"mappings":"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"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/AccordionItem/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { ChevronUp } from '@foxford/icon-pack'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport type { ResponsiveSizeProps, ResponsiveSizeInterpolationProps } from 'shared/interfaces'\nimport { hover } from 'mixins/hover'\nimport type { Size, AccordionItemPalette, StyledAccordionItemProps } from './types'\n\nconst shouldForwardAccordionItemProp = createShouldForwardProp(\n  (propKey) => !['expanded', 'disabled', 'loading', 'borderRadius'].includes(propKey)\n)\n\nconst shouldForwardAccordionItemCommonProp = createShouldForwardProp()\n\nexport const Heading = styled.h3`\n  box-sizing: border-box;\n  display: flex;\n  margin: 0;\n  padding: ${focus.padding}px;\n  border-radius: inherit;\n  font: inherit;\n  transition-property: color;\n  transition-duration: 150ms;\n  transition-timing-function: ease-in;\n`\n\nconst template = (palette: AccordionItemPalette) => `\n  background-color: ${palette.backgroundColor};\n\n  & ${Heading} {\n    color: ${palette.headerColor};\n    background-color: ${palette.headerBackgroundColor};\n  }\n  ${hover(`color: ${palette.headerColorHover};`, `& ${Heading}:hover`)}\n`\n\nconst COLOR_SCHEMA = {\n  primary: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ??\n            props.palette.backgroundColor ??\n            props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n  },\n  secondary: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ??\n            props.palette.backgroundColor ??\n            props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n  },\n  transparent: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors.transparent,\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ?? props.palette.backgroundColor ?? props.theme.colors.transparent,\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors.transparent,\n        })}\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 Button = styled.button`\n  box-sizing: border-box;\n  display: flex;\n  flex-grow: 1;\n  appearance: none;\n  border: none;\n  margin: 0;\n  padding: 0;\n  color: inherit;\n  background-color: transparent;\n  font: inherit;\n  cursor: inherit;\n  text-align: left;\n\n  ${focus}\n`\n\nexport const Root = styled.section.withConfig<StyledAccordionItemProps>({\n  shouldForwardProp: shouldForwardAccordionItemProp,\n})`\n  box-sizing: border-box;\n  display: grid;\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  @media (prefers-reduced-motion: reduce) {\n    transition-duration: 0ms;\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    border-radius: ${props.borderRadius}px;\n    \n    & ${Button} {\n      border-radius: ${props.borderRadius > focus.padding ? props.borderRadius - focus.padding : 0}px;\n    }\n    \n    & ${Heading} {\n      cursor: ${props.loading ? 'wait' : props.disabled ? 'not-allowed' : 'pointer'};\n    }\n  `}\n\n  ${(props) => {\n    let schema = COLOR_SCHEMA.transparent\n\n    if (props.primary) {\n      schema = COLOR_SCHEMA.primary\n    }\n    if (props.secondary) {\n      schema = COLOR_SCHEMA.secondary\n    }\n\n    if (props.disabled) return schema.disabled\n    if (props.expanded) return schema.expanded\n\n    return schema.default\n  }}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Header = styled.span.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n  shouldForwardProp: shouldForwardAccordionItemCommonProp,\n})`\n  box-sizing: border-box;\n  display: flex;\n  flex-grow: 1;\n\n  & > *:not(:last-child) {\n    margin-right: 8px;\n  }\n\n  ${responsiveSize}\n`\n\nexport const Content = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  align-self: center;\n  flex-grow: 1;\n`\n\nexport const IconAnimation = styled.span.withConfig<{ up: boolean }>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  box-sizing: border-box;\n  display: flex;\n  align-self: flex-start;\n  flex-shrink: 0;\n  transition-property: transform;\n  transition-duration: 250ms;\n  transform-origin: center;\n  @media (prefers-reduced-motion: reduce) {\n    transition-duration: 0ms;\n  }\n  ${(props) => `\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const ChevronDown = styled(ChevronUp)`\n  transform-origin: center;\n  transform: scaleY(-1);\n`\n\nexport const Details = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n  shouldForwardProp: shouldForwardAccordionItemCommonProp,\n})`\n  box-sizing: border-box;\n\n  ${responsiveSize}\n`\n"],"names":["shouldForwardAccordionItemProp","createShouldForwardProp","propKey","includes","shouldForwardAccordionItemCommonProp","Heading","styled","h3","withConfig","displayName","componentId","focus","padding","template","palette","backgroundColor","headerColor","headerBackgroundColor","hover","headerColorHover","COLOR_SCHEMA","primary","default","css","props","theme","colors","headerColorExpanded","transparent","expanded","headerBackgroundColorExpanded","backgroundColorExpanded","disabled","headerColorDisabled","headerBackgroundColorDisabled","backgroundColorDisabled","secondary","Panel","div","Button","button","Root","section","shouldForwardProp","borderRadius","loading","schema","responsiveSize","responsiveMargin","Header","span","Content","IconAnimation","up","ChevronDown","ChevronUp","Details"],"mappings":"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"}

package/components/AccordionItem/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{hover}from'../../mixins/hover.mjs';const shouldForwardAccordionItemProp=createShouldForwardProp(e=>!['expanded','disabled','loading','borderRadius'].includes(e));const shouldForwardAccordionItemCommonProp=createShouldForwardProp();const Heading=styled.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.padding);const template=e=>`\n  background-color: ${e.backgroundColor};\n\n  & ${Heading} {\n    color: ${e.headerColor};\n    background-color: ${e.headerBackgroundColor};\n  }\n  ${hover(`color: ${e.headerColorHover};`,`& ${Heading}:hover`)}\n`;const COLOR_SCHEMA={primary:{default: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: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: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: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: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: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: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: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: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.div.withConfig({displayName:"AccordionItem__Panel",componentId:"ui__sc-7h1z5c-1"})(["box-sizing:border-box;overflow:hidden;transition-property:opacity;"]);const Button=styled.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);const Root=styled.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.padding?e.borderRadius-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,responsiveMargin);const Header=styled.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);const Content=styled.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.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.div.withConfig({shouldForwardProp:shouldForwardAccordionItemCommonProp}).withConfig({displayName:"AccordionItem__Details",componentId:"ui__sc-7h1z5c-7"})(["box-sizing:border-box;",""],responsiveSize);export{Button,Content,Details,Header,Heading,IconAnimation,Panel,Root};
+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{hover}from'../../mixins/hover.mjs';import{ChevronUp}from'../../icon-pack/src/icons/ChevronUp/index.mjs';const shouldForwardAccordionItemProp=createShouldForwardProp(e=>!['expanded','disabled','loading','borderRadius'].includes(e));const shouldForwardAccordionItemCommonProp=createShouldForwardProp();const Heading=styled.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.padding);const template=e=>`\n  background-color: ${e.backgroundColor};\n\n  & ${Heading} {\n    color: ${e.headerColor};\n    background-color: ${e.headerBackgroundColor};\n  }\n  ${hover(`color: ${e.headerColorHover};`,`& ${Heading}:hover`)}\n`;const COLOR_SCHEMA={primary:{default: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: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: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: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: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: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: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: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: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.div.withConfig({displayName:"AccordionItem__Panel",componentId:"ui__sc-7h1z5c-1"})(["box-sizing:border-box;overflow:hidden;transition-property:opacity;"]);const Button=styled.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);const Root=styled.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.padding?e.borderRadius-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,responsiveMargin);const Header=styled.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);const Content=styled.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.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 ChevronDown=styled(ChevronUp).withConfig({displayName:"AccordionItem__ChevronDown",componentId:"ui__sc-7h1z5c-7"})(["transform-origin:center;transform:scaleY(-1);"]);const Details=styled.div.withConfig({shouldForwardProp:shouldForwardAccordionItemCommonProp}).withConfig({displayName:"AccordionItem__Details",componentId:"ui__sc-7h1z5c-8"})(["box-sizing:border-box;",""],responsiveSize);export{Button,ChevronDown,Content,Details,Header,Heading,IconAnimation,Panel,Root};
 //# sourceMappingURL=style.mjs.map

package/components/AccordionItem/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","sources":["../../../../src/components/AccordionItem/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 type { ResponsiveSizeProps, ResponsiveSizeInterpolationProps } from 'shared/interfaces'\nimport { hover } from 'mixins/hover'\nimport type { Size, AccordionItemPalette, StyledAccordionItemProps } from './types'\n\nconst shouldForwardAccordionItemProp = createShouldForwardProp(\n  (propKey) => !['expanded', 'disabled', 'loading', 'borderRadius'].includes(propKey)\n)\n\nconst shouldForwardAccordionItemCommonProp = createShouldForwardProp()\n\nexport const Heading = styled.h3`\n  box-sizing: border-box;\n  display: flex;\n  margin: 0;\n  padding: ${focus.padding}px;\n  border-radius: inherit;\n  font: inherit;\n  transition-property: color;\n  transition-duration: 150ms;\n  transition-timing-function: ease-in;\n`\n\nconst template = (palette: AccordionItemPalette) => `\n  background-color: ${palette.backgroundColor};\n\n  & ${Heading} {\n    color: ${palette.headerColor};\n    background-color: ${palette.headerBackgroundColor};\n  }\n  ${hover(`color: ${palette.headerColorHover};`, `& ${Heading}:hover`)}\n`\n\nconst COLOR_SCHEMA = {\n  primary: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ??\n            props.palette.backgroundColor ??\n            props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n  },\n  secondary: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ??\n            props.palette.backgroundColor ??\n            props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n  },\n  transparent: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors.transparent,\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ?? props.palette.backgroundColor ?? props.theme.colors.transparent,\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors.transparent,\n        })}\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 Button = styled.button`\n  box-sizing: border-box;\n  display: flex;\n  flex-grow: 1;\n  appearance: none;\n  border: none;\n  margin: 0;\n  padding: 0;\n  color: inherit;\n  background-color: transparent;\n  font: inherit;\n  cursor: inherit;\n  text-align: left;\n\n  ${focus}\n`\n\nexport const Root = styled.section.withConfig<StyledAccordionItemProps>({\n  shouldForwardProp: shouldForwardAccordionItemProp,\n})`\n  box-sizing: border-box;\n  display: grid;\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  @media (prefers-reduced-motion: reduce) {\n    transition-duration: 0ms;\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    border-radius: ${props.borderRadius}px;\n    \n    & ${Button} {\n      border-radius: ${props.borderRadius > focus.padding ? props.borderRadius - focus.padding : 0}px;\n    }\n    \n    & ${Heading} {\n      cursor: ${props.loading ? 'wait' : props.disabled ? 'not-allowed' : 'pointer'};\n    }\n  `}\n\n  ${(props) => {\n    let schema = COLOR_SCHEMA.transparent\n\n    if (props.primary) {\n      schema = COLOR_SCHEMA.primary\n    }\n    if (props.secondary) {\n      schema = COLOR_SCHEMA.secondary\n    }\n\n    if (props.disabled) return schema.disabled\n    if (props.expanded) return schema.expanded\n\n    return schema.default\n  }}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Header = styled.span.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n  shouldForwardProp: shouldForwardAccordionItemCommonProp,\n})`\n  box-sizing: border-box;\n  display: flex;\n  flex-grow: 1;\n\n  & > *:not(:last-child) {\n    margin-right: 8px;\n  }\n\n  ${responsiveSize}\n`\n\nexport const Content = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  align-self: center;\n  flex-grow: 1;\n`\n\nexport const IconAnimation = styled.span.withConfig<{ up: boolean }>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  box-sizing: border-box;\n  display: flex;\n  align-self: flex-start;\n  flex-shrink: 0;\n  transition-property: transform;\n  transition-duration: 250ms;\n  transform-origin: center;\n  @media (prefers-reduced-motion: reduce) {\n    transition-duration: 0ms;\n  }\n  ${(props) => `\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const Details = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n  shouldForwardProp: shouldForwardAccordionItemCommonProp,\n})`\n  box-sizing: border-box;\n\n  ${responsiveSize}\n`\n"],"names":["shouldForwardAccordionItemProp","createShouldForwardProp","propKey","includes","shouldForwardAccordionItemCommonProp","Heading","styled","h3","withConfig","displayName","componentId","focus","padding","template","palette","backgroundColor","headerColor","headerBackgroundColor","hover","headerColorHover","COLOR_SCHEMA","primary","default","css","props","theme","colors","headerColorExpanded","transparent","expanded","headerBackgroundColorExpanded","backgroundColorExpanded","disabled","headerColorDisabled","headerBackgroundColorDisabled","backgroundColorDisabled","secondary","Panel","div","Button","button","Root","section","shouldForwardProp","borderRadius","loading","schema","responsiveSize","responsiveMargin","Header","span","Content","IconAnimation","up","Details"],"mappings":"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"}
+{"version":3,"file":"style.mjs","sources":["../../../../src/components/AccordionItem/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { ChevronUp } from '@foxford/icon-pack'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport type { ResponsiveSizeProps, ResponsiveSizeInterpolationProps } from 'shared/interfaces'\nimport { hover } from 'mixins/hover'\nimport type { Size, AccordionItemPalette, StyledAccordionItemProps } from './types'\n\nconst shouldForwardAccordionItemProp = createShouldForwardProp(\n  (propKey) => !['expanded', 'disabled', 'loading', 'borderRadius'].includes(propKey)\n)\n\nconst shouldForwardAccordionItemCommonProp = createShouldForwardProp()\n\nexport const Heading = styled.h3`\n  box-sizing: border-box;\n  display: flex;\n  margin: 0;\n  padding: ${focus.padding}px;\n  border-radius: inherit;\n  font: inherit;\n  transition-property: color;\n  transition-duration: 150ms;\n  transition-timing-function: ease-in;\n`\n\nconst template = (palette: AccordionItemPalette) => `\n  background-color: ${palette.backgroundColor};\n\n  & ${Heading} {\n    color: ${palette.headerColor};\n    background-color: ${palette.headerBackgroundColor};\n  }\n  ${hover(`color: ${palette.headerColorHover};`, `& ${Heading}:hover`)}\n`\n\nconst COLOR_SCHEMA = {\n  primary: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ??\n            props.palette.backgroundColor ??\n            props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors['bg-onmain-primary'],\n        })}\n    `,\n  },\n  secondary: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ??\n            props.palette.backgroundColor ??\n            props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors['bg-onmain-secondary'],\n        })}\n    `,\n  },\n  transparent: {\n    default: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColor ?? props.theme.colors['content-onmain-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor: props.palette.headerBackgroundColor ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColor ?? props.theme.colors.transparent,\n        })}\n    `,\n    expanded: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerColorHover:\n            props.palette.headerColorExpanded ??\n            props.palette.headerColor ??\n            props.theme.colors['content-brand-primary'],\n          headerBackgroundColor:\n            props.palette.headerBackgroundColorExpanded ??\n            props.palette.headerBackgroundColor ??\n            props.theme.colors.transparent,\n          backgroundColor:\n            props.palette.backgroundColorExpanded ?? props.palette.backgroundColor ?? props.theme.colors.transparent,\n        })}\n    `,\n    disabled: css<StyledAccordionItemProps>`\n      ${(props) =>\n        template({\n          headerColor: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerColorHover: props.palette.headerColorDisabled ?? props.theme.colors['content-disabled'],\n          headerBackgroundColor: props.palette.headerBackgroundColorDisabled ?? props.theme.colors.transparent,\n          backgroundColor: props.palette.backgroundColorDisabled ?? props.theme.colors.transparent,\n        })}\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 Button = styled.button`\n  box-sizing: border-box;\n  display: flex;\n  flex-grow: 1;\n  appearance: none;\n  border: none;\n  margin: 0;\n  padding: 0;\n  color: inherit;\n  background-color: transparent;\n  font: inherit;\n  cursor: inherit;\n  text-align: left;\n\n  ${focus}\n`\n\nexport const Root = styled.section.withConfig<StyledAccordionItemProps>({\n  shouldForwardProp: shouldForwardAccordionItemProp,\n})`\n  box-sizing: border-box;\n  display: grid;\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  @media (prefers-reduced-motion: reduce) {\n    transition-duration: 0ms;\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    border-radius: ${props.borderRadius}px;\n    \n    & ${Button} {\n      border-radius: ${props.borderRadius > focus.padding ? props.borderRadius - focus.padding : 0}px;\n    }\n    \n    & ${Heading} {\n      cursor: ${props.loading ? 'wait' : props.disabled ? 'not-allowed' : 'pointer'};\n    }\n  `}\n\n  ${(props) => {\n    let schema = COLOR_SCHEMA.transparent\n\n    if (props.primary) {\n      schema = COLOR_SCHEMA.primary\n    }\n    if (props.secondary) {\n      schema = COLOR_SCHEMA.secondary\n    }\n\n    if (props.disabled) return schema.disabled\n    if (props.expanded) return schema.expanded\n\n    return schema.default\n  }}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Header = styled.span.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n  shouldForwardProp: shouldForwardAccordionItemCommonProp,\n})`\n  box-sizing: border-box;\n  display: flex;\n  flex-grow: 1;\n\n  & > *:not(:last-child) {\n    margin-right: 8px;\n  }\n\n  ${responsiveSize}\n`\n\nexport const Content = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  align-self: center;\n  flex-grow: 1;\n`\n\nexport const IconAnimation = styled.span.withConfig<{ up: boolean }>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  box-sizing: border-box;\n  display: flex;\n  align-self: flex-start;\n  flex-shrink: 0;\n  transition-property: transform;\n  transition-duration: 250ms;\n  transform-origin: center;\n  @media (prefers-reduced-motion: reduce) {\n    transition-duration: 0ms;\n  }\n  ${(props) => `\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const ChevronDown = styled(ChevronUp)`\n  transform-origin: center;\n  transform: scaleY(-1);\n`\n\nexport const Details = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n  shouldForwardProp: shouldForwardAccordionItemCommonProp,\n})`\n  box-sizing: border-box;\n\n  ${responsiveSize}\n`\n"],"names":["shouldForwardAccordionItemProp","createShouldForwardProp","propKey","includes","shouldForwardAccordionItemCommonProp","Heading","styled","h3","withConfig","displayName","componentId","focus","padding","template","palette","backgroundColor","headerColor","headerBackgroundColor","hover","headerColorHover","COLOR_SCHEMA","primary","default","css","props","theme","colors","headerColorExpanded","transparent","expanded","headerBackgroundColorExpanded","backgroundColorExpanded","disabled","headerColorDisabled","headerBackgroundColorDisabled","backgroundColorDisabled","secondary","Panel","div","Button","button","Root","section","shouldForwardProp","borderRadius","loading","schema","responsiveSize","responsiveMargin","Header","span","Content","IconAnimation","up","ChevronDown","ChevronUp","Details"],"mappings":"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"}

package/components/ActionBtn/ActionBtn.js

@@ -1,2 +1,2 @@
-'use strict';var useClassname=require('../../hooks/useClassname.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');function ActionBtn({icon:e,disabled:s=!1,onClick:n,children:t,className:i,active:a,style:c}){const l=useClassname.useClassname(ActionBtn.displayName,i);return jsxRuntime.jsxs(style.Root,{className:l,style:c,disabled:s,active:a,onClick:n,children:[e?jsxRuntime.jsx(Icon.Icon,{size:16,name:e}):null,t]})}ActionBtn.displayName='ActionBtn',exports.ActionBtn=ActionBtn;
+'use strict';var useClassname=require('../../hooks/useClassname.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');function ActionBtn({icon:s,disabled:e=!1,iconProps:n={},onClick:t,children:i,className:a,active:c,style:o}){const l=useClassname.useClassname(ActionBtn.displayName,a);return jsxRuntime.jsxs(style.Root,{className:l,style:o,disabled:e,active:c,onClick:t,children:[s?jsxRuntime.jsx(Icon.Icon,{size:16,name:s,...n}):null,i]})}ActionBtn.displayName='ActionBtn',exports.ActionBtn=ActionBtn;
 //# sourceMappingURL=ActionBtn.js.map

package/components/ActionBtn/ActionBtn.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionBtn.js","sources":["../../../../src/components/ActionBtn/ActionBtn.tsx"],"sourcesContent":["import type { DisplayProperty } from 'mixins/display'\nimport { useClassname } from 'hooks/useClassname'\nimport type { BaseProps } from 'shared/interfaces'\nimport { Icon } from 'components/Icon'\nimport type { IconName } from 'components/Icon'\nimport * as Styled from './style'\n\nexport interface ActionBtnProps extends BaseProps, DisplayProperty {\n  /** Icon name (for inner Icon component) */\n  icon?: IconName\n  disabled?: boolean\n  active?: boolean\n  onClick?(): void\n  /**\n   * Children react node\n   */\n  children?: React.ReactNode\n}\n\nfunction ActionBtn({ icon, disabled = false, onClick, children, className, active, style }: ActionBtnProps) {\n  const _className = useClassname(ActionBtn.displayName, className)\n\n  return (\n    <Styled.Root className={_className} style={style} disabled={disabled} active={active} onClick={onClick}>\n      {icon ? <Icon size={16} name={icon} /> : null}\n      {children}\n    </Styled.Root>\n  )\n}\n\nActionBtn.displayName = 'ActionBtn'\n\nexport { ActionBtn }\n"],"names":["ActionBtn","icon","disabled","onClick","children","className","active","style","_className","useClassname","displayName","_jsxs","Styled","_jsx","Icon","size","name"],"mappings":"qLAmBA,SAASA,WAAUC,KAAEA,EAAIC,SAAEA,GAAW,EAAKC,QAAEA,EAAOC,SAAEA,EAAQC,UAAEA,EAASC,OAAEA,EAAQC,MAAAA,IACjF,MAAMC,EAAaC,aAAAA,aAAaT,UAAUU,YAAaL,GAEvD,OACEM,WAAAA,KAACC,MAAAA,KAAW,CAACP,UAAWG,EAAYD,MAAOA,EAAOL,SAAUA,EAAUI,OAAQA,EAAQH,QAASA,EAAQC,SAAA,CACpGH,EAAOY,WAAAA,IAACC,UAAI,CAACC,KAAM,GAAIC,KAAMf,IAAW,KACxCG,IAGP,CAEAJ,UAAUU,YAAc"}
+{"version":3,"file":"ActionBtn.js","sources":["../../../../src/components/ActionBtn/ActionBtn.tsx"],"sourcesContent":["import type { DisplayProperty } from 'mixins/display'\nimport { useClassname } from 'hooks/useClassname'\nimport type { BaseProps } from 'shared/interfaces'\nimport { Icon } from 'components/Icon'\nimport type { IconName, IconProps } from 'components/Icon'\nimport * as Styled from './style'\n\nexport interface ActionBtnProps extends BaseProps, DisplayProperty {\n  /** Icon name (for inner Icon component) */\n  icon?: IconName\n  disabled?: boolean\n  active?: boolean\n  onClick?(): void\n  iconProps?: IconProps\n  /**\n   * Children react node\n   */\n  children?: React.ReactNode\n}\n\nfunction ActionBtn({\n  icon,\n  disabled = false,\n  iconProps = {},\n  onClick,\n  children,\n  className,\n  active,\n  style,\n}: ActionBtnProps) {\n  const _className = useClassname(ActionBtn.displayName, className)\n\n  return (\n    <Styled.Root className={_className} style={style} disabled={disabled} active={active} onClick={onClick}>\n      {icon ? <Icon size={16} name={icon} {...iconProps} /> : null}\n      {children}\n    </Styled.Root>\n  )\n}\n\nActionBtn.displayName = 'ActionBtn'\n\nexport { ActionBtn }\n"],"names":["ActionBtn","icon","disabled","iconProps","onClick","children","className","active","style","_className","useClassname","displayName","_jsxs","Styled","_jsx","Icon","size","name"],"mappings":"qLAoBA,SAASA,WAAUC,KACjBA,EAAIC,SACJA,GAAW,EAAKC,UAChBA,EAAY,CAAA,EAAEC,QACdA,EAAOC,SACPA,EAAQC,UACRA,EAASC,OACTA,EACAC,MAAAA,IAEA,MAAMC,EAAaC,aAAAA,aAAaV,UAAUW,YAAaL,GAEvD,OACEM,WAAAA,KAACC,MAAAA,KAAW,CAACP,UAAWG,EAAYD,MAAOA,EAAON,SAAUA,EAAUK,OAAQA,EAAQH,QAASA,EAAQC,SAAA,CACpGJ,EAAOa,WAAAA,IAACC,UAAI,CAACC,KAAM,GAAIC,KAAMhB,KAAUE,IAAgB,KACvDE,IAGP,CAEAL,UAAUW,YAAc"}

package/components/ActionBtn/ActionBtn.mjs

@@ -1,2 +1,2 @@
-import{useClassname}from'../../hooks/useClassname.mjs';import{Root}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';function ActionBtn({icon:s,disabled:n=!1,onClick:o,children:t,className:e,active:i,style:c}){const a=useClassname(ActionBtn.displayName,e);return jsxs(Root,{className:a,style:c,disabled:n,active:i,onClick:o,children:[s?jsx(Icon,{size:16,name:s}):null,t]})}ActionBtn.displayName='ActionBtn';export{ActionBtn};
+import{useClassname}from'../../hooks/useClassname.mjs';import{Root}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';function ActionBtn({icon:s,disabled:o=!1,iconProps:n={},onClick:t,children:e,className:i,active:c,style:a}){const m=useClassname(ActionBtn.displayName,i);return jsxs(Root,{className:m,style:a,disabled:o,active:c,onClick:t,children:[s?jsx(Icon,{size:16,name:s,...n}):null,e]})}ActionBtn.displayName='ActionBtn';export{ActionBtn};
 //# sourceMappingURL=ActionBtn.mjs.map

package/components/ActionBtn/ActionBtn.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ActionBtn.mjs","sources":["../../../../src/components/ActionBtn/ActionBtn.tsx"],"sourcesContent":["import type { DisplayProperty } from 'mixins/display'\nimport { useClassname } from 'hooks/useClassname'\nimport type { BaseProps } from 'shared/interfaces'\nimport { Icon } from 'components/Icon'\nimport type { IconName } from 'components/Icon'\nimport * as Styled from './style'\n\nexport interface ActionBtnProps extends BaseProps, DisplayProperty {\n  /** Icon name (for inner Icon component) */\n  icon?: IconName\n  disabled?: boolean\n  active?: boolean\n  onClick?(): void\n  /**\n   * Children react node\n   */\n  children?: React.ReactNode\n}\n\nfunction ActionBtn({ icon, disabled = false, onClick, children, className, active, style }: ActionBtnProps) {\n  const _className = useClassname(ActionBtn.displayName, className)\n\n  return (\n    <Styled.Root className={_className} style={style} disabled={disabled} active={active} onClick={onClick}>\n      {icon ? <Icon size={16} name={icon} /> : null}\n      {children}\n    </Styled.Root>\n  )\n}\n\nActionBtn.displayName = 'ActionBtn'\n\nexport { ActionBtn }\n"],"names":["ActionBtn","icon","disabled","onClick","children","className","active","style","_className","useClassname","displayName","_jsxs","Styled","_jsx","Icon","size","name"],"mappings":"gKAmBA,SAASA,WAAUC,KAAEA,EAAIC,SAAEA,GAAW,EAAKC,QAAEA,EAAOC,SAAEA,EAAQC,UAAEA,EAASC,OAAEA,EAAMC,MAAEA,IACjF,MAAMC,EAAaC,aAAaT,UAAUU,YAAaL,GAEvD,OACEM,KAACC,KAAW,CAACP,UAAWG,EAAYD,MAAOA,EAAOL,SAAUA,EAAUI,OAAQA,EAAQH,QAASA,EAAQC,SAAA,CACpGH,EAAOY,IAACC,KAAI,CAACC,KAAM,GAAIC,KAAMf,IAAW,KACxCG,IAGP,CAEAJ,UAAUU,YAAc"}
+{"version":3,"file":"ActionBtn.mjs","sources":["../../../../src/components/ActionBtn/ActionBtn.tsx"],"sourcesContent":["import type { DisplayProperty } from 'mixins/display'\nimport { useClassname } from 'hooks/useClassname'\nimport type { BaseProps } from 'shared/interfaces'\nimport { Icon } from 'components/Icon'\nimport type { IconName, IconProps } from 'components/Icon'\nimport * as Styled from './style'\n\nexport interface ActionBtnProps extends BaseProps, DisplayProperty {\n  /** Icon name (for inner Icon component) */\n  icon?: IconName\n  disabled?: boolean\n  active?: boolean\n  onClick?(): void\n  iconProps?: IconProps\n  /**\n   * Children react node\n   */\n  children?: React.ReactNode\n}\n\nfunction ActionBtn({\n  icon,\n  disabled = false,\n  iconProps = {},\n  onClick,\n  children,\n  className,\n  active,\n  style,\n}: ActionBtnProps) {\n  const _className = useClassname(ActionBtn.displayName, className)\n\n  return (\n    <Styled.Root className={_className} style={style} disabled={disabled} active={active} onClick={onClick}>\n      {icon ? <Icon size={16} name={icon} {...iconProps} /> : null}\n      {children}\n    </Styled.Root>\n  )\n}\n\nActionBtn.displayName = 'ActionBtn'\n\nexport { ActionBtn }\n"],"names":["ActionBtn","icon","disabled","iconProps","onClick","children","className","active","style","_className","useClassname","displayName","_jsxs","Styled","_jsx","Icon","size","name"],"mappings":"gKAoBA,SAASA,WAAUC,KACjBA,EAAIC,SACJA,GAAW,EAAKC,UAChBA,EAAY,CAAA,EAAEC,QACdA,EAAOC,SACPA,EAAQC,UACRA,EAASC,OACTA,EAAMC,MACNA,IAEA,MAAMC,EAAaC,aAAaV,UAAUW,YAAaL,GAEvD,OACEM,KAACC,KAAW,CAACP,UAAWG,EAAYD,MAAOA,EAAON,SAAUA,EAAUK,OAAQA,EAAQH,QAASA,EAAQC,SAAA,CACpGJ,EAAOa,IAACC,KAAI,CAACC,KAAM,GAAIC,KAAMhB,KAAUE,IAAgB,KACvDE,IAGP,CAEAL,UAAUW,YAAc"}

package/components/Anchor/Anchor.js

@@ -1,2 +1,2 @@
-'use strict';var styled=require('styled-components');var createPolymorphicComponentWithRef=require('../../shared/utils/createPolymorphicComponentWithRef.js');var useMergedProps=require('../../hooks/useMergedProps.js');var useClassname=require('../../hooks/useClassname.js');var isNil=require('../../shared/utils/isNil.js');var constants=require('./constants.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var Text=require('../Text/Text.js');const Anchor=createPolymorphicComponentWithRef.createPolymorphicComponentWithRef((e,s)=>{const r=styled.useTheme();const n=useMergedProps.useMergedProps(e,{componentName:"Anchor",sizes:constants.SIZES});const{component:t,size:o="inherit",autoRel:i=!0,textProps:a={},iconProps:c={},icon:l,children:u,content:p,...m}=n;const d=useClassname.useClassname("Anchor",m.className);const h=r.utils?.relBuilder;const[x,j]=Array.isArray(l)?l:[l];const y={as:'span',size:'inherit',color:'inherit',underline:m.underline,marginLeft:x?'0.20em':void 0,marginRight:j?'0.20em':void 0};const f={as:'span',color:'inherit'};return jsxRuntime.jsx(style.Root,{...m,ref:s,as:(()=>{let e='a';return m.to&&(e=r.link),m.pseudo&&(e='div'),m.disabled&&(e='span'),m.as&&(e=m.as),t&&(e=t),e})(),className:d,size:o,rel:(()=>{if(!isNil.isNil(m.rel))return m.rel;const e=m.href??m.to;if(i&&h&&typeof e=='string'){const s=m.target;if(typeof s=='string'||s===void 0)return h(e,s)}})(),"data-disabled":m.disabled,children:typeof u=='function'?u({baseTextProps:y,textProps:a,iconBaseProps:f,iconProps:c,icon:l}):m.preset==='brand'?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[x?jsxRuntime.jsx(Icon.Icon,{name:typeof x=='string'?x:void 0,icon:typeof x!='string'?x:void 0,...f,...c}):null,jsxRuntime.jsx(Text.Text,{...y,...a,children:u||p}),j?jsxRuntime.jsx(Icon.Icon,{name:typeof j=='string'?j:void 0,icon:typeof j!='string'?j:void 0,...f,...c}):null]}):u||p})});exports.Anchor=Anchor,exports.COMPONENT_NAME="Anchor";
+'use strict';var styled=require('styled-components');var createPolymorphicComponentWithRef=require('../../shared/utils/createPolymorphicComponentWithRef.js');var useMergedProps=require('../../hooks/useMergedProps.js');var useClassname=require('../../hooks/useClassname.js');var isNil=require('../../shared/utils/isNil.js');var constants=require('./constants.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var Text=require('../Text/Text.js');const Anchor=createPolymorphicComponentWithRef.createPolymorphicComponentWithRef((e,s)=>{const r=styled.useTheme();const n=useMergedProps.useMergedProps(e,{componentName:"Anchor",sizes:constants.SIZES});const{component:o,size:t="inherit",autoRel:i=!0,textProps:a={},iconProps:c={},leftIconProps:l={},rightIconProps:u={},icon:p,children:m,content:d,...h}=n;const x=useClassname.useClassname("Anchor",h.className);const j=r.utils?.relBuilder;const[f,y]=Array.isArray(p)?p:[p];const v={as:'span',size:'inherit',color:'inherit',underline:h.underline,marginLeft:f?'0.20em':void 0,marginRight:y?'0.20em':void 0};const P={as:'span',color:'inherit'};return jsxRuntime.jsx(style.Root,{...h,ref:s,as:(()=>{let e='a';return h.to&&(e=r.link),h.pseudo&&(e='div'),h.disabled&&(e='span'),h.as&&(e=h.as),o&&(e=o),e})(),className:x,size:t,rel:(()=>{if(!isNil.isNil(h.rel))return h.rel;const e=h.href??h.to;if(i&&j&&typeof e=='string'){const s=h.target;if(typeof s=='string'||s===void 0)return j(e,s)}})(),"data-disabled":h.disabled,children:typeof m=='function'?m({baseTextProps:v,textProps:a,iconBaseProps:P,iconProps:c,icon:p}):h.preset==='brand'?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[f?jsxRuntime.jsx(Icon.Icon,{name:typeof f=='string'?f:void 0,icon:typeof f!='string'?f:void 0,...P,...c,...l}):null,jsxRuntime.jsx(Text.Text,{...v,...a,children:m||d}),y?jsxRuntime.jsx(Icon.Icon,{name:typeof y=='string'?y:void 0,icon:typeof y!='string'?y:void 0,...P,...c,...u}):null]}):m||d})});exports.Anchor=Anchor,exports.COMPONENT_NAME="Anchor";
 //# sourceMappingURL=Anchor.js.map

package/components/Anchor/Anchor.js.map

@@ -1 +1 @@
-{"version":3,"file":"Anchor.js","sources":["../../../../src/components/Anchor/Anchor.tsx"],"sourcesContent":["import { useTheme } from 'styled-components'\nimport { createPolymorphicComponentWithRef } from 'shared/utils/createPolymorphicComponentWithRef'\nimport { useMergedProps } from 'hooks/useMergedProps'\nimport { Text } from 'components/Text'\nimport type { TextProps } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport type { IconProps } from 'components/Icon'\nimport { useClassname } from 'hooks/useClassname'\nimport type { PolymorphicProps } from 'shared/interfaces'\nimport { isNil } from 'shared/utils/isNil'\nimport { SIZES } from './constants'\nimport type { AnchorProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Anchor'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Полиморфный компонент.\n *\n * Можно передать \"ref\" и атрибуты выбранного HTML-элемента (по умолчанию \\<a\\>).\n */\nconst Anchor = createPolymorphicComponentWithRef<'a', AnchorProps>((props, ref) => {\n  const theme = useTheme()\n  const mergedProps = useMergedProps<PolymorphicProps<React.ElementType, AnchorProps>>(props, {\n    componentName: COMPONENT_NAME,\n    sizes: SIZES,\n  })\n\n  const {\n    component,\n    size = 'inherit',\n    autoRel = true,\n    textProps = {},\n    iconProps = {},\n    icon,\n    children,\n    content,\n    ...restProps\n  } = mergedProps\n\n  const rootNode = () => {\n    let root: React.ElementType | undefined = 'a'\n\n    if (restProps.to) {\n      root = theme.link\n    }\n    if (restProps.pseudo) {\n      root = 'div'\n    }\n    if (restProps.disabled) {\n      root = 'span'\n    }\n    if (restProps.as) {\n      root = restProps.as\n    }\n    if (component) {\n      root = component\n    }\n\n    return root\n  }\n\n  const className = useClassname(COMPONENT_NAME, restProps.className)\n\n  const relBuilder = theme.utils?.relBuilder\n\n  const getRel = () => {\n    if (!isNil(restProps.rel)) {\n      return restProps.rel\n    }\n\n    const href = restProps.href ?? restProps.to\n    if (autoRel && relBuilder && typeof href === 'string') {\n      const target = restProps.target\n      if (typeof target === 'string' || target === undefined) {\n        return relBuilder(href, target)\n      }\n    }\n\n    return undefined\n  }\n\n  const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n  const baseTextProps: TextProps = {\n    as: 'span',\n    size: 'inherit',\n    color: 'inherit',\n    underline: restProps.underline,\n    marginLeft: before ? '0.20em' : undefined,\n    marginRight: after ? '0.20em' : undefined,\n  }\n\n  const iconBaseProps: IconProps = { as: 'span', color: 'inherit' }\n\n  return (\n    <Styled.Root\n      {...restProps}\n      ref={ref}\n      as={rootNode()}\n      className={className}\n      size={size}\n      rel={getRel()}\n      data-disabled={restProps.disabled}\n    >\n      {typeof children === 'function' ? (\n        children({ baseTextProps, textProps, iconBaseProps, iconProps, icon })\n      ) : restProps.preset === 'brand' ? (\n        <>\n          {before ? (\n            <Icon\n              name={typeof before === 'string' ? before : undefined}\n              icon={typeof before !== 'string' ? before : undefined}\n              {...iconBaseProps}\n              {...iconProps}\n            />\n          ) : null}\n          <Text {...baseTextProps} {...textProps}>\n            {children || content}\n          </Text>\n          {after ? (\n            <Icon\n              name={typeof after === 'string' ? after : undefined}\n              icon={typeof after !== 'string' ? after : undefined}\n              {...iconBaseProps}\n              {...iconProps}\n            />\n          ) : null}\n        </>\n      ) : (\n        children || content\n      )}\n    </Styled.Root>\n  )\n})\n\nconst AnchorDoc: React.FC<AnchorProps> = () => null\n\nexport { AnchorDoc, Anchor, COMPONENT_NAME }\n"],"names":["Anchor","createPolymorphicComponentWithRef","props","ref","theme","useTheme","mergedProps","useMergedProps","componentName","sizes","SIZES","component","size","autoRel","textProps","iconProps","icon","children","content","restProps","className","useClassname","relBuilder","utils","before","after","Array","isArray","baseTextProps","as","color","underline","marginLeft","undefined","marginRight","iconBaseProps","_jsx","Styled","rootNode","root","to","link","pseudo","disabled","rel","getRel","isNil","href","target","preset","_jsxs","_Fragment","Icon","name","Text"],"mappings":"+fAwBA,MAAMA,OAASC,kCAAAA,kCAAoD,CAACC,EAAOC,KACzE,MAAMC,EAAQC,OAAAA,WACd,MAAMC,EAAcC,eAAAA,eAAiEL,EAAO,CAC1FM,cAbmB,SAcnBC,MAAOC,UAAAA,QAGT,MAAMC,UACJA,EAASC,KACTA,EAAO,UAASC,QAChBA,GAAU,EAAIC,UACdA,EAAY,CAAA,EAAEC,UACdA,EAAY,CAAA,EAAEC,KACdA,EAAIC,SACJA,EAAQC,QACRA,KACGC,GACDb,EAwBJ,MAAMc,EAAYC,aAAAA,aAnDG,SAmD0BF,EAAUC,WAEzD,MAAME,EAAalB,EAAMmB,OAAOD,WAkBhC,MAAOE,EAAQC,GAASC,MAAMC,QAAQX,GAAQA,EAAO,CAACA,GAEtD,MAAMY,EAA2B,CAC/BC,GAAI,OACJjB,KAAM,UACNkB,MAAO,UACPC,UAAWZ,EAAUY,UACrBC,WAAYR,EAAS,cAAWS,EAChCC,YAAaT,EAAQ,cAAWQ,GAGlC,MAAME,EAA2B,CAAEN,GAAI,OAAQC,MAAO,WAEtD,OACEM,WAAAA,IAACC,MAAAA,KAAW,IACNlB,EACJhB,IAAKA,EACL0B,GA3DaS,MACf,IAAIC,EAAsC,IAkB1C,OAhBIpB,EAAUqB,KACZD,EAAOnC,EAAMqC,MAEXtB,EAAUuB,SACZH,EAAO,OAELpB,EAAUwB,WACZJ,EAAO,QAELpB,EAAUU,KACZU,EAAOpB,EAAUU,IAEflB,IACF4B,EAAO5B,GAGF4B,GAwCDD,GACJlB,UAAWA,EACXR,KAAMA,EACNgC,IApCWC,MACb,IAAKC,MAAAA,MAAM3B,EAAUyB,KACnB,OAAOzB,EAAUyB,IAGnB,MAAMG,EAAO5B,EAAU4B,MAAQ5B,EAAUqB,GACzC,GAAI3B,GAAWS,UAAqByB,GAAS,SAAU,CACrD,MAAMC,EAAS7B,EAAU6B,OACzB,UAAWA,GAAW,UAAYA,SAAWf,EAC3C,OAAOX,EAAWyB,EAAMC,EAE5B,GAyBOH,GACL,gBAAe1B,EAAUwB,SAAS1B,gBAE1BA,GAAa,WACnBA,EAAS,CAAEW,gBAAed,YAAWqB,gBAAepB,YAAWC,SAC7DG,EAAU8B,SAAW,QACvBC,WAAAA,KAAAC,WAAAA,SAAA,CAAAlC,SAAA,CACGO,EACCY,WAAAA,IAACgB,UAAI,CACHC,YAAa7B,GAAW,SAAWA,OAASS,EAC5CjB,YAAaQ,GAAW,SAAWA,OAASS,KACxCE,KACApB,IAEJ,KACJqB,WAAAA,IAACkB,UAAI,IAAK1B,KAAmBd,EAASG,SACnCA,GAAYC,IAEdO,EACCW,WAAAA,IAACgB,UAAI,CACHC,YAAa5B,GAAU,SAAWA,OAAQQ,EAC1CjB,YAAaS,GAAU,SAAWA,OAAQQ,KACtCE,KACApB,IAEJ,QAGNE,GAAYC,mDAvHG"}
+{"version":3,"file":"Anchor.js","sources":["../../../../src/components/Anchor/Anchor.tsx"],"sourcesContent":["import { useTheme } from 'styled-components'\nimport { createPolymorphicComponentWithRef } from 'shared/utils/createPolymorphicComponentWithRef'\nimport { useMergedProps } from 'hooks/useMergedProps'\nimport { Text } from 'components/Text'\nimport type { TextProps } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport type { IconProps } from 'components/Icon'\nimport { useClassname } from 'hooks/useClassname'\nimport type { PolymorphicProps } from 'shared/interfaces'\nimport { isNil } from 'shared/utils/isNil'\nimport { SIZES } from './constants'\nimport type { AnchorProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Anchor'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Полиморфный компонент.\n *\n * Можно передать \"ref\" и атрибуты выбранного HTML-элемента (по умолчанию \\<a\\>).\n */\nconst Anchor = createPolymorphicComponentWithRef<'a', AnchorProps>((props, ref) => {\n  const theme = useTheme()\n  const mergedProps = useMergedProps<PolymorphicProps<React.ElementType, AnchorProps>>(props, {\n    componentName: COMPONENT_NAME,\n    sizes: SIZES,\n  })\n\n  const {\n    component,\n    size = 'inherit',\n    autoRel = true,\n    textProps = {},\n    iconProps = {},\n    leftIconProps = {},\n    rightIconProps = {},\n    icon,\n    children,\n    content,\n    ...restProps\n  } = mergedProps\n\n  const rootNode = () => {\n    let root: React.ElementType | undefined = 'a'\n\n    if (restProps.to) {\n      root = theme.link\n    }\n    if (restProps.pseudo) {\n      root = 'div'\n    }\n    if (restProps.disabled) {\n      root = 'span'\n    }\n    if (restProps.as) {\n      root = restProps.as\n    }\n    if (component) {\n      root = component\n    }\n\n    return root\n  }\n\n  const className = useClassname(COMPONENT_NAME, restProps.className)\n\n  const relBuilder = theme.utils?.relBuilder\n\n  const getRel = () => {\n    if (!isNil(restProps.rel)) {\n      return restProps.rel\n    }\n\n    const href = restProps.href ?? restProps.to\n    if (autoRel && relBuilder && typeof href === 'string') {\n      const target = restProps.target\n      if (typeof target === 'string' || target === undefined) {\n        return relBuilder(href, target)\n      }\n    }\n\n    return undefined\n  }\n\n  const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n  const baseTextProps: TextProps = {\n    as: 'span',\n    size: 'inherit',\n    color: 'inherit',\n    underline: restProps.underline,\n    marginLeft: before ? '0.20em' : undefined,\n    marginRight: after ? '0.20em' : undefined,\n  }\n\n  const iconBaseProps: IconProps = { as: 'span', color: 'inherit' }\n\n  return (\n    <Styled.Root\n      {...restProps}\n      ref={ref}\n      as={rootNode()}\n      className={className}\n      size={size}\n      rel={getRel()}\n      data-disabled={restProps.disabled}\n    >\n      {typeof children === 'function' ? (\n        children({ baseTextProps, textProps, iconBaseProps, iconProps, icon })\n      ) : restProps.preset === 'brand' ? (\n        <>\n          {before ? (\n            <Icon\n              name={typeof before === 'string' ? before : undefined}\n              icon={typeof before !== 'string' ? before : undefined}\n              {...iconBaseProps}\n              {...iconProps}\n              {...leftIconProps}\n            />\n          ) : null}\n          <Text {...baseTextProps} {...textProps}>\n            {children || content}\n          </Text>\n          {after ? (\n            <Icon\n              name={typeof after === 'string' ? after : undefined}\n              icon={typeof after !== 'string' ? after : undefined}\n              {...iconBaseProps}\n              {...iconProps}\n              {...rightIconProps}\n            />\n          ) : null}\n        </>\n      ) : (\n        children || content\n      )}\n    </Styled.Root>\n  )\n})\n\nconst AnchorDoc: React.FC<AnchorProps> = () => null\n\nexport { AnchorDoc, Anchor, COMPONENT_NAME }\n"],"names":["Anchor","createPolymorphicComponentWithRef","props","ref","theme","useTheme","mergedProps","useMergedProps","componentName","sizes","SIZES","component","size","autoRel","textProps","iconProps","leftIconProps","rightIconProps","icon","children","content","restProps","className","useClassname","relBuilder","utils","before","after","Array","isArray","baseTextProps","as","color","underline","marginLeft","undefined","marginRight","iconBaseProps","_jsx","Styled","rootNode","root","to","link","pseudo","disabled","rel","getRel","isNil","href","target","preset","_jsxs","_Fragment","Icon","name","Text"],"mappings":"+fAwBA,MAAMA,OAASC,kCAAAA,kCAAoD,CAACC,EAAOC,KACzE,MAAMC,EAAQC,OAAAA,WACd,MAAMC,EAAcC,eAAAA,eAAiEL,EAAO,CAC1FM,cAbmB,SAcnBC,MAAOC,UAAAA,QAGT,MAAMC,UACJA,EAASC,KACTA,EAAO,UAASC,QAChBA,GAAU,EAAIC,UACdA,EAAY,CAAA,EAAEC,UACdA,EAAY,CAAA,EAAEC,cACdA,EAAgB,CAAA,EAAEC,eAClBA,EAAiB,CAAA,EAAEC,KACnBA,EAAIC,SACJA,EAAQC,QACRA,KACGC,GACDf,EAwBJ,MAAMgB,EAAYC,aAAAA,aArDG,SAqD0BF,EAAUC,WAEzD,MAAME,EAAapB,EAAMqB,OAAOD,WAkBhC,MAAOE,EAAQC,GAASC,MAAMC,QAAQX,GAAQA,EAAO,CAACA,GAEtD,MAAMY,EAA2B,CAC/BC,GAAI,OACJnB,KAAM,UACNoB,MAAO,UACPC,UAAWZ,EAAUY,UACrBC,WAAYR,EAAS,cAAWS,EAChCC,YAAaT,EAAQ,cAAWQ,GAGlC,MAAME,EAA2B,CAAEN,GAAI,OAAQC,MAAO,WAEtD,OACEM,WAAAA,IAACC,MAAAA,KAAW,IACNlB,EACJlB,IAAKA,EACL4B,GA3DaS,MACf,IAAIC,EAAsC,IAkB1C,OAhBIpB,EAAUqB,KACZD,EAAOrC,EAAMuC,MAEXtB,EAAUuB,SACZH,EAAO,OAELpB,EAAUwB,WACZJ,EAAO,QAELpB,EAAUU,KACZU,EAAOpB,EAAUU,IAEfpB,IACF8B,EAAO9B,GAGF8B,GAwCDD,GACJlB,UAAWA,EACXV,KAAMA,EACNkC,IApCWC,MACb,IAAKC,MAAAA,MAAM3B,EAAUyB,KACnB,OAAOzB,EAAUyB,IAGnB,MAAMG,EAAO5B,EAAU4B,MAAQ5B,EAAUqB,GACzC,GAAI7B,GAAWW,UAAqByB,GAAS,SAAU,CACrD,MAAMC,EAAS7B,EAAU6B,OACzB,UAAWA,GAAW,UAAYA,SAAWf,EAC3C,OAAOX,EAAWyB,EAAMC,EAE5B,GAyBOH,GACL,gBAAe1B,EAAUwB,SAAS1B,gBAE1BA,GAAa,WACnBA,EAAS,CAAEW,gBAAehB,YAAWuB,gBAAetB,YAAWG,SAC7DG,EAAU8B,SAAW,QACvBC,WAAAA,KAAAC,WAAAA,SAAA,CAAAlC,SAAA,CACGO,EACCY,WAAAA,IAACgB,UAAI,CACHC,YAAa7B,GAAW,SAAWA,OAASS,EAC5CjB,YAAaQ,GAAW,SAAWA,OAASS,KACxCE,KACAtB,KACAC,IAEJ,KACJsB,WAAAA,IAACkB,UAAI,IAAK1B,KAAmBhB,EAASK,SACnCA,GAAYC,IAEdO,EACCW,WAAAA,IAACgB,UAAI,CACHC,YAAa5B,GAAU,SAAWA,OAAQQ,EAC1CjB,YAAaS,GAAU,SAAWA,OAAQQ,KACtCE,KACAtB,KACAE,IAEJ,QAGNE,GAAYC,mDA3HG"}

package/components/Anchor/Anchor.mjs

@@ -1,2 +1,2 @@
-import{useTheme}from'styled-components';import{createPolymorphicComponentWithRef}from'../../shared/utils/createPolymorphicComponentWithRef.mjs';import{useMergedProps}from'../../hooks/useMergedProps.mjs';import{useClassname}from'../../hooks/useClassname.mjs';import{isNil}from'../../shared/utils/isNil.mjs';import{SIZES}from'./constants.mjs';import{Root}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{Text}from'../Text/Text.mjs';const COMPONENT_NAME='Anchor';const Anchor=createPolymorphicComponentWithRef((o,e)=>{const s=useTheme();const r=useMergedProps(o,{componentName:"Anchor",sizes:SIZES});const{component:t,size:n="inherit",autoRel:i=!0,textProps:m={},iconProps:c={},icon:a,children:p,content:l,...d}=r;const f=useClassname("Anchor",d.className);const h=s.utils?.relBuilder;const[u,j]=Array.isArray(a)?a:[a];const x={as:'span',size:'inherit',color:'inherit',underline:d.underline,marginLeft:u?'0.20em':void 0,marginRight:j?'0.20em':void 0};const g={as:'span',color:'inherit'};return jsx(Root,{...d,ref:e,as:(()=>{let o='a';return d.to&&(o=s.link),d.pseudo&&(o='div'),d.disabled&&(o='span'),d.as&&(o=d.as),t&&(o=t),o})(),className:f,size:n,rel:(()=>{if(!isNil(d.rel))return d.rel;const o=d.href??d.to;if(i&&h&&typeof o=='string'){const e=d.target;if(typeof e=='string'||e===void 0)return h(o,e)}})(),"data-disabled":d.disabled,children:typeof p=='function'?p({baseTextProps:x,textProps:m,iconBaseProps:g,iconProps:c,icon:a}):d.preset==='brand'?jsxs(Fragment,{children:[u?jsx(Icon,{name:typeof u=='string'?u:void 0,icon:typeof u!='string'?u:void 0,...g,...c}):null,jsx(Text,{...x,...m,children:p||l}),j?jsx(Icon,{name:typeof j=='string'?j:void 0,icon:typeof j!='string'?j:void 0,...g,...c}):null]}):p||l})});export{Anchor,COMPONENT_NAME};
+import{useTheme}from'styled-components';import{createPolymorphicComponentWithRef}from'../../shared/utils/createPolymorphicComponentWithRef.mjs';import{useMergedProps}from'../../hooks/useMergedProps.mjs';import{useClassname}from'../../hooks/useClassname.mjs';import{isNil}from'../../shared/utils/isNil.mjs';import{SIZES}from'./constants.mjs';import{Root}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{Text}from'../Text/Text.mjs';const COMPONENT_NAME='Anchor';const Anchor=createPolymorphicComponentWithRef((o,e)=>{const s=useTheme();const r=useMergedProps(o,{componentName:"Anchor",sizes:SIZES});const{component:t,size:n="inherit",autoRel:i=!0,textProps:m={},iconProps:c={},leftIconProps:a={},rightIconProps:p={},icon:l,children:d,content:f,...h}=r;const u=useClassname("Anchor",h.className);const g=s.utils?.relBuilder;const[j,x]=Array.isArray(l)?l:[l];const P={as:'span',size:'inherit',color:'inherit',underline:h.underline,marginLeft:j?'0.20em':void 0,marginRight:x?'0.20em':void 0};const y={as:'span',color:'inherit'};return jsx(Root,{...h,ref:e,as:(()=>{let o='a';return h.to&&(o=s.link),h.pseudo&&(o='div'),h.disabled&&(o='span'),h.as&&(o=h.as),t&&(o=t),o})(),className:u,size:n,rel:(()=>{if(!isNil(h.rel))return h.rel;const o=h.href??h.to;if(i&&g&&typeof o=='string'){const e=h.target;if(typeof e=='string'||e===void 0)return g(o,e)}})(),"data-disabled":h.disabled,children:typeof d=='function'?d({baseTextProps:P,textProps:m,iconBaseProps:y,iconProps:c,icon:l}):h.preset==='brand'?jsxs(Fragment,{children:[j?jsx(Icon,{name:typeof j=='string'?j:void 0,icon:typeof j!='string'?j:void 0,...y,...c,...a}):null,jsx(Text,{...P,...m,children:d||f}),x?jsx(Icon,{name:typeof x=='string'?x:void 0,icon:typeof x!='string'?x:void 0,...y,...c,...p}):null]}):d||f})});export{Anchor,COMPONENT_NAME};
 //# sourceMappingURL=Anchor.mjs.map