@start-base/start-ui/Accordion/index.mjs

<p align="center"> <a href="https://startbase.dev" target="_blank"> <img src="https://startbase.dev/apple-touch-icon.png" width="60px" style="padding-top: 60px" /> </a> </p>

import*as e from"react";import a,{forwardRef as t,useState as n,useRef as r,useEffect as o}from"react";import c from"clsx";var l=Object.defineProperty,s=Object.defineProperties,i=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,d=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable,f=(e,a,t)=>a in e?l(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,p=(e,a)=>{for(var t in a||(a={}))d.call(a,t)&&f(e,t,a[t]);if(m)for(var t of m(a))u.call(a,t)&&f(e,t,a[t]);return e},v=(e,a)=>s(e,i(a)),x=(e,a)=>{var t={};for(var n in e)d.call(e,n)&&a.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&m)for(var n of m(e))a.indexOf(n)<0&&u.call(e,n)&&(t[n]=e[n]);return t},N="SUI-Accordion-module-container-cZk6G",b="SUI-Accordion-module-actions-IxMwE",E="SUI-Accordion-module-root-zrCFw",y="SUI-Accordion-module-icon-0eXvX",h="SUI-Accordion-module-summary-Xxdol";function C(a){var t=a,{size:n,width:r,height:o}=t,c=x(t,["size","width","height"]);return e.createElement("svg",p({xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",stroke:"currentColor",strokeWidth:0,viewBox:"0 0 24 24",width:null!=n?n:r,height:null!=n?n:o},c),e.createElement("path",{fill:"none",stroke:"none",d:"M0 0h24v24H0V0z"}),e.createElement("path",{stroke:"none",d:"M6.23 20.23 8 22l10-10L8 2 6.23 3.77 14.46 12z"}))}var w=t((e,t)=>{var l=e,{children:s,summary:i,actions:m,className:d,summaryClassName:u,actionsClassName:f,containerClassName:v,defaultExpanded:w=!1,disabled:O=!1,icon:I,unmountOnExit:A=!1,variant:g="drawer"}=l,S=x(l,["children","summary","actions","className","summaryClassName","actionsClassName","containerClassName","defaultExpanded","disabled","icon","unmountOnExit","variant"]);const k=c(N,v),z=c(h,u),j=c(E,d),U=c(b,f),[P,M]=n(w);const X=r(null);return o(()=>{if(!X.current)return;X.current.querySelectorAll("a, button, input, textarea, select, [tabindex]").forEach(e=>{const a=P?"0":"-1";e.setAttribute("tabIndex",a)})},[P]),a.createElement("div",p({className:k,ref:t,"data-expanded":P,"data-unmountonexit":A,"aria-disabled":O,"data-variant":g},S),a.createElement("button",{className:z,onClick:function(){M(!P)},disabled:O},i,I?a.createElement("div",{className:y},I):a.createElement(C,{className:y,size:16})),a.createElement("div",{className:j,tabIndex:P?0:-1},(!A||P)&&s),m&&a.createElement("div",{className:U,ref:X,tabIndex:-1},m))});w.displayName="UncontrolledAccordion";var O=w,I=t((e,t)=>{var n=e,{children:l,summary:s,actions:i,className:m,summaryClassName:d,actionsClassName:u,containerClassName:f,expanded:v,onExpand:w,icon:O,unmountOnExit:I=!1,variant:A="drawer"}=n,g=x(n,["children","summary","actions","className","summaryClassName","actionsClassName","containerClassName","expanded","onExpand","icon","unmountOnExit","variant"]);const S=c(N,f),k=c(h,d),z=c(E,m),j=c(b,u);const U=r(null);return o(()=>{if(!U.current)return;U.current.querySelectorAll("a, button, input, textarea, select, [tabindex]").forEach(e=>{const a=v?"0":"-1";e.setAttribute("tabIndex",a)})},[v]),a.createElement("div",p({className:S,ref:t,"data-expanded":v,"data-unmountonexit":I,"data-variant":A},g),a.createElement("button",{className:k,onClick:function(){w()}},s,O?a.createElement("div",{className:y},O):a.createElement(C,{className:y,size:16})),a.createElement("div",{className:z,tabIndex:v?0:-1},(!I||v)&&l),i&&a.createElement("div",{className:j,ref:U,tabIndex:-1},i))});I.displayName="ControlledAccordion";var A=I,g=t((e,t)=>{const{expanded:n}=e;if("boolean"==typeof n){const n=e;return a.createElement(A,v(p({},n),{ref:t}))}return a.createElement(O,v(p({},e),{ref:t}))});g.displayName="Accordion";var S=g;export{S as default};