@trafilea/afrodita-components 7.20.1 → 7.22.0

package/build/es/components/accordion/Accordion.js

@@ -1,2 +1,2 @@
-import{__assign as o}from"tslib";import{jsx as n,jsxs as i,Fragment as t}from"react/jsx-runtime";import{useTheme as e}from"@emotion/react";import r from"@emotion/styled";import{Disclosure as c}from"@headlessui/react";import{useRef as a}from"react";import{AccordionStyles as l,AccordionSummaryStyles as d,AccordionDetailsStyles as v,StyledOpenIconContainer as s,StyledContent as h,StyledCloseIconContainer as m}from"./styles.js";var u=0,p=r(c)(l.baseStyles,(function(o){return[l[o.variant](o.theme,o.disabled,o.controlIconPos)]})),f=r(c.Button)(d.baseStyles,(function(o){var n,i;return[d[o.variant](o.theme,null!==(n=o.disabled)&&void 0!==n&&n,null!==(i=o.controlIconPos)&&void 0!==i?i:"right")]}),(function(o){return[d.title(o.titlecolor)]})),b=r(c.Panel)(v.baseStyles,(function(o){return[v[o.variant](o.theme)]})),g=function(r){var c,l=r.header,d=r.headerOnOpen,v=r.content,g=r.defaultOpen,y=r.forceOpenHandler,I=void 0!==y&&y,C=r.forceOpenValue,k=void 0!==C&&C,P=r.titleColor,w=r.variant,O=r.disabled,B=void 0!==O&&O,S=r.innerHTML,H=void 0!==S&&S,j=r.backgroundCover,x=void 0===j?{value:!1,iconBgColor:"inherit"}:j,L=r.controlIconPos,M=void 0===L?"right":L,N=r.openIcon,T=r.closeIcon,_=r.onClick,V=r.testId,q=r.ssr,z=void 0!==q&&q,A=r.id,D=e(),E=a(null);null!==(c=E.current)&&void 0!==c||(E.current="afrodita-accordion-".concat(++u));var F=null!=A?A:E.current,G="".concat(F,"-button"),J="".concat(F,"-panel");return n(p,o({"data-testid":V,theme:D,as:"div",defaultOpen:g,variant:w,disabled:B,onClick:_,controlIconPos:M},{children:function(e){var r=e.open,c=I?k:r,a=B?N:c?T:N,u=c&&!B,p=u||z,g=u?"region":void 0,y=function(){return n(b,H?{static:!0,variant:w,theme:D,id:J,role:g,"aria-labelledby":G,dangerouslySetInnerHTML:{__html:v}}:o({static:!0,variant:w,theme:D,id:J,role:g,"aria-labelledby":G},{children:v}),void 0)};return i(t,{children:[i(f,o({theme:D,variant:w,disabled:B,titlecolor:P,controlIconPos:M,"aria-controls":J,id:G},{children:[u&&d?d:l,"right"===M&&n(a,{title:c?"close icon":"open icon",height:D.component.accordion.variant[w].icon.height,width:D.component.accordion.variant[w].icon.width,fill:D.component.accordion.variant[w].icon.color},void 0),"bottom"===M&&!(null==x?void 0:x.value)&&!u&&n(s,o({className:"openIconBottom",backgroundCover:x.iconBgColor},{children:n(a,{title:"open icon",height:D.component.accordion.variant[w].icon.height,width:D.component.accordion.variant[w].icon.width,fill:D.component.accordion.variant[w].icon.color},void 0)}),void 0),"bottom"===M&&p&&i(t,{children:[n(h,o({onClick:function(o){return o.stopPropagation()},style:{display:u?"block":"none"}},{children:y()}),void 0),u&&n(m,o({className:"closeIconBottom"},{children:n(a,{title:"close icon",height:D.component.accordion.variant[w].icon.height,width:D.component.accordion.variant[w].icon.width,fill:D.component.accordion.variant[w].icon.color},void 0)}),void 0)]},void 0)]}),void 0),"right"===M&&p&&n(h,o({onClick:function(o){return o.stopPropagation()},style:{display:u?"block":"none"}},{children:y()}),void 0)]},void 0)}}),void 0)};export{g as default};
+import{__assign as o}from"tslib";import{jsxs as n,jsx as e}from"react/jsx-runtime";import t from"@emotion/styled";import{Disclosure as i}from"@headlessui/react";import{useRef as r}from"react";import"../../types/enums.js";import{useTheme as c}from"../../core/theme/Theme.js";import{AccordionStyles as l,AccordionSummaryStyles as d,AccordionDetailsStyles as a,StyledOpenIconContainer as v,StyledPanelWrapper as s,StyledCloseIconContainer as u}from"./styles.js";var m=0,h=t.div(l.baseStyles,(function(o){return[l[o.variant](o.theme,o.disabled,o.controlIconPos)]})),p=t.button(d.baseStyles,(function(o){var n;return[d[o.variant](o.theme,null!==(n=o.disabled)&&void 0!==n&&n,o.controlIconPos)]}),(function(o){return[d.alignment(o.centerHeader,o.controlIconPos)]}),(function(o){return[d.title(o.titlecolor)]})),f=t.div(a.baseStyles,(function(o){return[a[o.variant](o.theme)]})),b=function(t){var l,d=t.header,a=t.headerOnOpen,b=t.content,I=t.defaultOpen,g=t.forceOpenHandler,C=void 0!==g&&g,y=t.forceOpenValue,B=void 0!==y&&y,k=t.titleColor,P=t.variant,H=t.disabled,O=void 0!==H&&H,j=t.innerHTML,x=void 0!==j&&j,N=t.backgroundCover,S=void 0===N?{value:!1,iconBgColor:"inherit"}:N,T=t.controlIconPos,w=void 0===T?"right":T,L=t.centerHeader,M=void 0!==L&&L,_=t.openIcon,V=t.closeIcon,q=t.onClick,z=t.testId,A=t.ssr,D=void 0!==A&&A,E=t.id,F=c(),G=r(null);null!==(l=G.current)&&void 0!==l||(G.current="afrodita-accordion-".concat(++m));var J=null!=E?E:G.current,K="".concat(J,"-button"),Q="".concat(J,"-panel"),R=function(o,n){return{height:o.component.accordion.variant[n].icon.height,width:o.component.accordion.variant[n].icon.width,fill:o.component.accordion.variant[n].icon.color}}(F,P),U="bottom"===w,W=function(n){var t={variant:P,theme:F,id:Q,role:n?"region":void 0,"aria-labelledby":K,"aria-hidden":!n};return e(f,o({},t,x?{dangerouslySetInnerHTML:{__html:b}}:{children:x?null:"function"==typeof b?e(b,{},void 0):b}),void 0)};if(C){var X=O||!B?_:V,Y=B&&!O,Z=Y||D,$=function(){O||null==q||q()};return n(h,o({"data-testid":z,theme:F,variant:P,disabled:O,controlIconPos:w},{children:[n(p,o({theme:F,variant:P,disabled:O,titlecolor:k,controlIconPos:w,centerHeader:M,"aria-controls":Q,"aria-expanded":Y,id:K,onClick:$,type:"button"},{children:[Y&&a?a:d,!U&&e(X,o({title:B?"close icon":"open icon"},R),void 0),U&&!Y&&!(null==S?void 0:S.value)&&e(v,o({className:"openIconBottom",backgroundCover:null==S?void 0:S.iconBgColor},{children:e(X,o({title:"open icon"},R),void 0)}),void 0)]}),void 0),Z&&e(s,o({hidden:!Y},{children:W(Y)}),void 0),U&&Y&&e(u,o({as:"button",type:"button",className:"closeIconBottom",onClick:$},{children:e(X,o({title:"close icon"},R),void 0)}),void 0)]}),void 0)}return e(i,o({as:"div",defaultOpen:I},{children:function(t){var r=t.open,c=O||!r?_:V,l=r&&!O,m=l||D,f=r?"close icon":"open icon";return n(h,o({"data-testid":z,theme:F,variant:P,disabled:O,controlIconPos:w},{children:[n(i.Button,o({as:p,theme:F,variant:P,disabled:O,titlecolor:k,controlIconPos:w,centerHeader:M,"aria-controls":Q,"aria-expanded":l,id:K,onClick:function(){return null==q?void 0:q()}},{children:[l&&a?a:d,!U&&e(c,o({title:f},R),void 0),U&&!l&&!(null==S?void 0:S.value)&&e(v,o({className:"openIconBottom",backgroundCover:null==S?void 0:S.iconBgColor},{children:e(c,o({title:"open icon"},R),void 0)}),void 0)]}),void 0),m&&e(s,o({hidden:!l},{children:W(l)}),void 0),U&&l&&e(i.Button,o({as:u,className:"closeIconBottom",onClick:function(){return null==q?void 0:q()}},{children:e(c,o({title:"close icon"},R),void 0)}),void 0)]}),void 0)}}),void 0)};export{b as default};
 //# sourceMappingURL=Accordion.js.map

package/build/es/components/accordion/styles.js

@@ -1,2 +1,2 @@
-import{__assign as n,__makeTemplateObject as o}from"tslib";import r from"@emotion/styled";import{css as t}from"@emotion/react";var e,i,a,c={baseStyles:t({background:"transparent",width:"auto"}),simple:function(o,r){return t(n(n({},o.component.accordion.variant.simple.container),{borderColor:r?o.colors.border.disabled:o.component.accordion.variant.simple.container.borderColor}))},box:function(o,r,e){return t(n(n({},o.component.accordion.variant.box.container),{padding:"bottom"===e?"unset":o.component.accordion.variant.box.container.padding,borderRadius:"bottom"===e?"1.25rem":o.component.accordion.variant.box.container.borderRadius,overflow:"bottom"===e?"hidden":"unset",borderColor:r?o.colors.border.disabled:o.component.accordion.variant.box.container.borderColor}))}},d={baseStyles:t({background:"transparent",width:"100%",border:"none",display:"flex",cursor:"pointer",justifyContent:"space-between",alignItems:"center",padding:"0"}),simple:function(o,r,e){return t(n(n({},o.component.accordion.variant.simple.summary),{flexDirection:"bottom"===e?"column":"row",color:r?o.colors.text.disabled:o.component.accordion.variant.simple.summary.color,fontFamily:o.fonts.config[0].family}))},box:function(o,r,e){return t(n(n({},o.component.accordion.variant.box.summary),{flexDirection:"bottom"===e?"column":"row",color:r?o.colors.text.disabled:o.component.accordion.variant.box.summary.color,fontFamily:o.fonts.config[0].family}))},title:function(n){return t({color:n||""})}},l={baseStyles:t({width:"100%",background:"transparent",border:"none"}),simple:function(o){return t(n({},o.component.accordion.variant.simple.details))},box:function(o){return t(n({},o.component.accordion.variant.box.details))}},s=r.button(e||(e=o(["\n  appearance: none;\n  padding: 0;\n  margin: 0;\n  border: none;\n  background: none;\n  font-size: inherit;\n  line-height: inherit;\n  color: inherit;\n  cursor: auto;\n  user-select: text;\n  writing-mode: unset;\n  font-family: inherit;\n"],["\n  appearance: none;\n  padding: 0;\n  margin: 0;\n  border: none;\n  background: none;\n  font-size: inherit;\n  line-height: inherit;\n  color: inherit;\n  cursor: auto;\n  user-select: text;\n  writing-mode: unset;\n  font-family: inherit;\n"]))),m=r.div(i||(i=o(["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  padding: 0 0 15px 0;\n  background-color: ",";\n"],["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  padding: 0 0 15px 0;\n  background-color: ",";\n"])),(function(n){return n.backgroundCover||"inherit"})),u=r.div(a||(a=o(["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  margin: 20px 0;\n  background-color: transparent;\n"],["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  margin: 20px 0;\n  background-color: transparent;\n"])));export{l as AccordionDetailsStyles,c as AccordionStyles,d as AccordionSummaryStyles,u as StyledCloseIconContainer,s as StyledContent,m as StyledOpenIconContainer};
+import{__assign as n,__makeTemplateObject as o}from"tslib";import{css as r}from"@emotion/react";import t from"@emotion/styled";var e={baseStyles:r({background:"transparent",width:"auto"}),simple:function(o,t){return r(n(n({},o.component.accordion.variant.simple.container),{borderColor:t?o.colors.border.disabled:o.component.accordion.variant.simple.container.borderColor}))},box:function(o,t,e){return r(n(n({},o.component.accordion.variant.box.container),{padding:"bottom"===e?"unset":o.component.accordion.variant.box.container.padding,borderRadius:"bottom"===e?"1.25rem":o.component.accordion.variant.box.container.borderRadius,overflow:"bottom"===e?"hidden":"unset",borderColor:t?o.colors.border.disabled:o.component.accordion.variant.box.container.borderColor}))}},i={baseStyles:r({background:"transparent",width:"100%",border:"none",display:"flex",cursor:"pointer",justifyContent:"space-between",alignItems:"center",padding:"0"}),alignment:function(n,o){return r(n&&"right"===o?{justifyContent:"center",columnGap:"0.5rem"}:{})},simple:function(o,t,e){return r(n(n({},o.component.accordion.variant.simple.summary),{flexDirection:"bottom"===e?"column":"row",color:t?o.colors.text.disabled:o.component.accordion.variant.simple.summary.color,fontFamily:o.fonts.config[0].family}))},box:function(o,t,e){return r(n(n({},o.component.accordion.variant.box.summary),{flexDirection:"bottom"===e?"column":"row",color:t?o.colors.text.disabled:o.component.accordion.variant.box.summary.color,fontFamily:o.fonts.config[0].family}))},title:function(n){return r({color:n||""})}},a={baseStyles:r({width:"100%",background:"transparent",border:"none"}),simple:function(o){return r(n({},o.component.accordion.variant.simple.details))},box:function(o){return r(n({},o.component.accordion.variant.box.details))}};t.button(c||(c=o(["\n  appearance: none;\n  padding: 0;\n  margin: 0;\n  border: none;\n  background: none;\n  font-size: inherit;\n  line-height: inherit;\n  color: inherit;\n  cursor: auto;\n  user-select: text;\n  writing-mode: unset;\n  font-family: inherit;\n"],["\n  appearance: none;\n  padding: 0;\n  margin: 0;\n  border: none;\n  background: none;\n  font-size: inherit;\n  line-height: inherit;\n  color: inherit;\n  cursor: auto;\n  user-select: text;\n  writing-mode: unset;\n  font-family: inherit;\n"])));var c,d,l,s,m=t.div(d||(d=o(["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  padding: 0 0 15px 0;\n  background-color: ",";\n"],["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  padding: 0 0 15px 0;\n  background-color: ",";\n"])),(function(n){return n.backgroundCover||"inherit"})),p=t.div(l||(l=o(["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  margin: 20px 0;\n  background-color: transparent;\n  cursor: pointer;\n  border: none;\n  padding: 0;\n"],["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  margin: 20px 0;\n  background-color: transparent;\n  cursor: pointer;\n  border: none;\n  padding: 0;\n"]))),u=t.div(s||(s=o(["\n  width: 100%;\n\n  &[hidden] {\n    display: none;\n  }\n"],["\n  width: 100%;\n\n  &[hidden] {\n    display: none;\n  }\n"])));export{a as AccordionDetailsStyles,e as AccordionStyles,i as AccordionSummaryStyles,p as StyledCloseIconContainer,m as StyledOpenIconContainer,u as StyledPanelWrapper};
 //# sourceMappingURL=styles.js.map