import{__rest as e}from"tslib";import t from"react";import{twMerge as r}from"tailwind-merge";import{sizing as m}from"../../../lib/sizing.js";import{spacing as o}from"../../../lib/spacing.js";import{fontSize as l,fontWeight as a}from"../../../lib/font.js";import{colorPalette as i,DEFAULT_COLOR as s,themeColorRange as c}from"../../../lib/theme.js";import{makeClassName as n,getColorClassNames as f}from"../../../lib/utils.js";const p=n("Legend"),g=({name:e,color:c})=>t.createElement("li",{className:r(p("legendItem"),"termor-elem inline-flex items-center truncate",f(s,i.text).textColor,o.md.marginRight)},t.createElement("svg",{className:r("termor-elem flex-none",f(c,i.text).textColor,m.xs.height,m.xs.width,o.xs.marginRight),fill:"currentColor",viewBox:"0 0 8 8"},t.createElement("circle",{cx:4,cy:4,r:4})),t.createElement("p",{className:r("termor-elem whitespace-nowrap truncate",l.sm,a.sm)},e)),x=t.forwardRef(((m,o)=>{const{categories:l,colors:a=c,className:i}=m,s=e(m,["categories","colors","className"]);return t.createElement("ol",Object.assign({ref:o,className:r(p("root"),"flex flex-wrap overflow-hidden truncate",i)},s),l.map(((e,r)=>t.createElement(g,{key:`item-${r}`,name:e,color:a[r]}))))}));x.displayName="Legend";export{x as default};
