ladle-inject-custom-addons/dist/components/AddonButton.mjs

Adds a button to the Ladle addon bar

import a from"react";import{createPortal as p}from"react-dom";function l(){return document.getElementsByClassName("ladle-addons")[0]?.getElementsByTagName("ul")?.[0]??null}var i=(o,{position:e=0})=>{let[t]=a.useState(document.createElement("li"));return a.useEffect(()=>{let n=l();if(!n){console.warn("Unable to find addon panel. Custom addons won't be mounted!");return}return f(n,t,e),()=>{n.removeChild(t)}},[e]),t?p(o,t):null},f=(o,e,t)=>{e.setAttribute("data-position",t.toString()),o.insertBefore(e,b(Array.from(o.getElementsByTagName("li")),t))};function b(o,e){let t=null;for(let n of o){let s=Number(n.dataset.position);if(n.dataset.position!=null&&!isNaN(s)?t=s:t===null||isNaN(t)?t=1:++t,e<t)return n}return null}import{Fragment as g,jsx as r,jsxs as d}from"react/jsx-runtime";var R=({icon:o,tooltip:e,children:t,badge:n=!1,label:s="",position:u=0,...m})=>{let c=n||["string","number"].includes(typeof n);return i(d(g,{children:[d("button",{"aria-label":e,title:e,type:"button",...m,children:[o,r("span",{className:"ladle-addon-tooltip",children:e}),s&&r("label",{children:s}),c&&r("div",{className:"ladle-badge",children:n})]}),t]}),{position:u})};export{R as AddonButton};