@itcase/ui-web 1.10.6 → 1.10.8

package/dist/cjs/components/Accordion.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),i=require("react"),r=require("clsx"),a=require("lodash/castArray"),o=require("@itcase/ui-core/hooks"),t=require("@itcase/ui-core/utils"),c=require("../../primitives_cjs_ocTnUpml.js"),s=require("../../default_cjs_BMbs2it-.js");require("@rc-component/tooltip"),require("react-inlinesvg"),require("@itcase/ui-core/hoc");const n={...{sizeXXL:{size:"xxl",titleTextSize:"xxl",badgeAppearanceSize:"sizeXS",contentTextSize:"xxl",icon:s.icons16.Arrow.ChevronDown},sizeXL:{size:"xl",titleTextSize:"xl",badgeAppearanceSize:"sizeXS",contentTextSize:"l",icon:s.icons16.Arrow.ChevronDown},sizeL:{size:"l",titleTextSize:"l",badgeAppearanceSize:"sizeXS",icon:s.icons16.Arrow.ChevronDown},sizeM:{size:"m",titleTextSize:"m",badgeAppearanceSize:"sizeXS",contentTextSize:"m",icon:s.icons16.Arrow.ChevronDown},sizeS:{size:"s",titleTextSize:"s",badgeAppearanceSize:"sizeXS",contentTextSize:"s",icon:s.icons16.Arrow.ChevronDown},sizeXS:{size:"xs",titleTextSize:"xs",badgeAppearanceSize:"sizeXS",contentTextSize:"xs",icon:s.icons16.Arrow.ChevronDown},sizeXXS:{size:"xxs",titleTextSize:"xxs",badgeAppearanceSize:"sizeXS",contentTextSize:"xs",icon:s.icons16.Arrow.ChevronDown}},solid:{borderColor:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none"},surfacePrimary:{fill:"surfacePrimary",fillHover:"surfacePrimary",titleTextColor:"surfaceTextPrimary",labelTextColor:"surfaceTextPrimary",badgeAppearance:"accentPrimary sizeM solid rounded",badgeShape:"circular",iconFillIcon:"surfaceItemPrimary"},surfaceQuaternary:{fill:"surfaceQuaternary",fillHover:"surfaceQuaternary",labelTextColor:"surfaceTextPrimary",badgeAppearance:"accentPrimary sizeM solid rounded",badgeShape:"circular",iconFillIcon:"surfaceItemPrimary"},surfaceSecondary:{fill:"surfaceSecondary",fillHover:"surfaceSecondary",labelTextColor:"surfaceTextPrimary",badgeAppearance:"accentPrimary sizeM solid rounded",badgeShape:"circular",iconFillIcon:"surfaceItemPrimary"},surfaceTertiary:{fill:"surfaceTertiary",fillHover:"surfaceTertiary",labelTextColor:"surfaceTextPrimary",badgeAppearance:"accentPrimary sizeM solid rounded",badgeShape:"circular",iconFillIcon:"surfaceItemPrimary"}},l={appearance:n,setAppearance:e=>{l.appearance=e}};function d(a){const{id:s,appearance:n,className:d,title:p,afterContent:u,beforeContent:x,content:z,isExpanded:m,onClick:S,children:f}=a,C=i.useCallback(()=>{S&&S({id:s,title:p,content:z,isExpanded:!m})},[s,p,z,m,S]),h=o.useAppearanceConfig(n,l),_=o.useDevicePropsGenerator(a,h),{fillClass:g,fillHoverClass:T,titleBorderColorClass:b,titleFillClass:y,titleFillHoverClass:v,titleTextColor:A,titleTextSize:w,titleTextWeight:P,titleWidthClass:j,borderColorClass:I,badgeAppearance:$,badgeAppearanceSize:X,badgeShape:k,badgeSize:D,badgeTextColor:q,badgeTextSize:F,badgeValue:N,contentTextColor:M,contentTextSize:E,contentTextWeight:H,dividerDirection:W,dividerFill:G,dividerSize:L,icon:Q,iconFill:B,iconFillIcon:V,iconFillSize:K,iconShape:J,iconSize:O,iconSrc:R,shapeClass:U,showDivider:Y,sizeClass:Z,zeroGap:ee,zeroPadding:ie}=_,{styles:re}=o.useStyles(a);return e.jsxs("div",{className:r("accordion-item",d,ie&&"accordion-item_zero-padding",ee&&"accordion-item_zero-gap",I&&`border-color_${I}`,U&&`shape_${U}`,Z&&`accordion-item_size_${Z}`,m&&"accordion-item_state_open"),style:re,children:[e.jsxs("div",{className:r("accordion-item__header",g&&`fill_${g}`,T&&`fill_hover_${T}`),children:[e.jsx(c.Text,{className:r("accordion-item__title",b&&`border-color_${b}`,y&&`fill_${y}`,v&&`fill_hover_${v}`,j&&`width_${j}`,S&&"cursor_type_pointer"),size:w,textColor:A,textWeight:P,onClick:C,children:p}),e.jsxs("div",{className:"accordion-item__action",children:[N&&e.jsx(c.Badge,{appearance:t.mergeAppearanceKeys($,X),className:"accordion-item__badge",size:D,textColor:q,textSize:F,shape:k,value:N}),(Q||R)&&e.jsx(c.Icon,{className:r("accordion-item__icon"),fill:B,fillSize:K,iconFill:V,iconSize:O,imageSrc:R,shape:J,SvgImage:Q,onClick:C})]}),Y&&e.jsx(c.Divider,{width:"fill",direction:W,size:L,fill:G||"surfaceTertiary"})]}),x,m&&e.jsxs("div",{className:r("accordion-item__content"),children:[z&&e.jsx("div",{className:r("accordion-item__content-inner",g&&`fill_${g}`),children:e.jsx(c.Text,{size:E,textColor:M,textWeight:H,children:z})}),f]}),u]})}exports.Accordion=function(t){const{appearance:c,className:s,dataTestId:n,dataTour:l,initial:p=[],items:u,isSkeleton:x,isMultiple:z,onClickItem:m,children:S}=t,[f,C]=i.useState(()=>a(p)),h=i.useCallback(e=>{C(i=>{const r=i.find(i=>i===e.id);return z?r?i.filter(i=>i!==e.id):[...i,e.id]:r?[]:[e.id]}),m&&m(e)},[z,m]),_=i.useMemo(()=>u?u.map((i,r)=>e.jsx(d,{id:i.id,appearance:c,title:i.title,content:i.content,isExpanded:f.includes(i.id),onClick:h},`accordionItem_${i.id||r+1}`)):S?i.Children.toArray(S).map(e=>{if(i.isValidElement(e)){const r=e.props.id||e.key;return i.cloneElement(e,{id:r,isExpanded:f.includes(r),onClick:h})}return e}):[],[u,S,c,f,h]),g=o.useDevicePropsGenerator(t),{fillClass:T,borderColorClass:b,shapeClass:y,widthClass:v}=g,{styles:A}=o.useStyles(t);return e.jsx("div",{className:r(s,"accordion",b&&`border-color_${b}`,T&&`fill_${T}`,y&&`shape_${y}`,v&&`width_${v}`,x&&"skeleton"),"data-testid":n,"data-tour":l,style:A,children:_})},exports.AccordionItem=d,exports.accordionAppearance=n,exports.accordionItemConfig=l;
+"use strict";var e=require("react/jsx-runtime"),i=require("react"),r=require("clsx"),a=require("lodash/castArray"),t=require("@itcase/ui-core/hooks"),o=require("@itcase/ui-core/utils"),c=require("../../primitives_cjs_ocTnUpml.js"),s=require("../../default_cjs_BMbs2it-.js");require("@rc-component/tooltip"),require("react-inlinesvg"),require("@itcase/ui-core/hoc");const n={...{sizeXXL:{size:"xxl",titleTextSize:"xxl",badgeAppearanceSize:"sizeXS",contentTextSize:"xxl",icon:s.icons16.Arrow.ChevronDown},sizeXL:{size:"xl",titleTextSize:"xl",badgeAppearanceSize:"sizeXS",contentTextSize:"l",icon:s.icons16.Arrow.ChevronDown},sizeL:{size:"l",titleTextSize:"l",badgeAppearanceSize:"sizeXS",icon:s.icons16.Arrow.ChevronDown},sizeM:{size:"m",titleTextSize:"m",badgeAppearanceSize:"sizeXS",contentTextSize:"m",icon:s.icons16.Arrow.ChevronDown},sizeS:{size:"s",titleTextSize:"s",badgeAppearanceSize:"sizeXS",contentTextSize:"s",icon:s.icons16.Arrow.ChevronDown},sizeXS:{size:"xs",titleTextSize:"xs",badgeAppearanceSize:"sizeXS",contentTextSize:"xs",icon:s.icons16.Arrow.ChevronDown},sizeXXS:{size:"xxs",titleTextSize:"xxs",badgeAppearanceSize:"sizeXS",contentTextSize:"xs",icon:s.icons16.Arrow.ChevronDown}},solid:{borderColor:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none"},surfacePrimary:{fill:"surfacePrimary",fillHover:"surfacePrimary",titleTextColor:"surfaceTextPrimary",labelTextColor:"surfaceTextPrimary",badgeAppearance:"accentPrimary sizeM solid rounded",badgeShape:"circular",iconFillIcon:"surfaceItemPrimary"},surfaceQuaternary:{fill:"surfaceQuaternary",fillHover:"surfaceQuaternary",labelTextColor:"surfaceTextPrimary",badgeAppearance:"accentPrimary sizeM solid rounded",badgeShape:"circular",iconFillIcon:"surfaceItemPrimary"},surfaceSecondary:{fill:"surfaceSecondary",fillHover:"surfaceSecondary",labelTextColor:"surfaceTextPrimary",badgeAppearance:"accentPrimary sizeM solid rounded",badgeShape:"circular",iconFillIcon:"surfaceItemPrimary"},surfaceTertiary:{fill:"surfaceTertiary",fillHover:"surfaceTertiary",labelTextColor:"surfaceTextPrimary",badgeAppearance:"accentPrimary sizeM solid rounded",badgeShape:"circular",iconFillIcon:"surfaceItemPrimary"}},l={appearance:n,setAppearance:e=>{l.appearance=e}};function d(a){const{id:s,appearance:n,className:d,dataTestId:p,title:u,afterContent:x,beforeContent:z,content:m,isExpanded:S,onClick:f,children:C}=a,h=i.useCallback(()=>{f&&f({id:s,title:u,content:m,isExpanded:!S})},[s,u,m,S,f]),T=t.useAppearanceConfig(n,l),_=t.useDevicePropsGenerator(a,T),{fillClass:g,fillHoverClass:b,titleBorderColorClass:y,titleFillClass:v,titleFillHoverClass:A,titleTextColor:I,titleTextSize:w,titleTextWeight:P,titleWidthClass:j,borderColorClass:$,badgeAppearance:X,badgeAppearanceSize:k,badgeShape:D,badgeSize:q,badgeTextColor:F,badgeTextSize:N,badgeValue:M,contentTextColor:E,contentTextSize:H,contentTextWeight:W,dividerDirection:G,dividerFill:L,dividerSize:Q,icon:B,iconFill:V,iconFillIcon:K,iconFillSize:J,iconShape:O,iconSize:R,iconSrc:U,shapeClass:Y,showDivider:Z,sizeClass:ee,zeroGap:ie,zeroPadding:re}=_,{styles:ae}=t.useStyles(a);return e.jsxs("div",{className:r("accordion-item",d,re&&"accordion-item_zero-padding",ie&&"accordion-item_zero-gap",$&&`border-color_${$}`,Y&&`shape_${Y}`,ee&&`accordion-item_size_${ee}`,S&&"accordion-item_state_open"),style:ae,children:[e.jsxs("div",{className:r("accordion-item__header",g&&`fill_${g}`,b&&`fill_hover_${b}`),"data-testid":p&&s?`${p}Item${s}Title`:void 0,children:[e.jsx(c.Text,{className:r("accordion-item__title",y&&`border-color_${y}`,v&&`fill_${v}`,A&&`fill_hover_${A}`,j&&`width_${j}`,f&&"cursor_type_pointer"),size:w,textColor:I,textWeight:P,onClick:h,children:u}),e.jsxs("div",{className:"accordion-item__action",children:[M&&e.jsx(c.Badge,{appearance:o.mergeAppearanceKeys(X,k),className:"accordion-item__badge",size:q,textColor:F,textSize:N,shape:D,value:M}),(B||U)&&e.jsx(c.Icon,{className:r("accordion-item__icon"),fill:V,fillSize:J,iconFill:K,iconSize:R,imageSrc:U,shape:O,SvgImage:B,onClick:h})]}),Z&&e.jsx(c.Divider,{width:"fill",direction:G,size:Q,fill:L||"surfaceTertiary"})]}),z,S&&e.jsxs("div",{className:r("accordion-item__content"),children:[m&&e.jsx("div",{className:r("accordion-item__content-inner",g&&`fill_${g}`),children:e.jsx(c.Text,{size:H,textColor:E,textWeight:W,children:m})}),C]}),x]})}exports.Accordion=function(o){const{appearance:c,className:s,dataTestId:n,dataTour:l,initial:p=[],items:u,isSkeleton:x,isMultiple:z,onClickItem:m,children:S}=o,[f,C]=i.useState(()=>a(p)),h=i.useCallback(e=>{C(i=>{const r=i.find(i=>i===e.id);return z?r?i.filter(i=>i!==e.id):[...i,e.id]:r?[]:[e.id]}),m&&m(e)},[z,m]),T=i.useMemo(()=>u?u.map((i,r)=>e.jsx(d,{id:i.id,appearance:c,dataTestId:n,title:i.title,content:i.content,isExpanded:f.includes(i.id),onClick:h},`accordionItem_${i.id||r+1}`)):S?i.Children.toArray(S).map(e=>{if(i.isValidElement(e)){const r=e.props.id||e.key;return i.cloneElement(e,{id:r,dataTestId:e.props.dataTestId??n,isExpanded:f.includes(r),onClick:h})}return e}):[],[u,S,c,n,f,h]),_=t.useDevicePropsGenerator(o),{fillClass:g,borderColorClass:b,shapeClass:y,widthClass:v}=_,{styles:A}=t.useStyles(o);return e.jsx("div",{className:r(s,"accordion",b&&`border-color_${b}`,g&&`fill_${g}`,y&&`shape_${y}`,v&&`width_${v}`,x&&"skeleton"),"data-testid":n,"data-tour":l,style:A,children:T})},exports.AccordionItem=d,exports.accordionAppearance=n,exports.accordionItemConfig=l;