"use client";
import{c as d,d as u,e as f}from"./chunk-CLTGASR6.js";import{a as g,d as C,m as $}from"./chunk-3CHPBNY2.js";import{s as a}from"./chunk-KEPQUAOX.js";import{forwardRef as A}from"react";import n from"clsx";var N=g("EulChip",["active","contained","clickable","disabled","endIcon","focusVisible","green","greenContained","greenOutlined","grey","greyContained","greyOutlined","outlined","root","red","redContained","redOutlined","startIcon","teal","tealContained","tealOutlined","uppercase","weight100","weight200","weight300","weight400","weight500","weight600","weight700","weight800","weight900","yellow","yellowContained","yellowOutlined"]),b=o=>f("EulChip",{endIcon:["endIcon"],root:["root",o.weight&&`weight${o.weight}`,o.color,o.variant,o.variant&&o.color&&`${o.color}${C(o.variant)}`,o.uppercase&&"uppercase",o.onClick&&"clickable",o.active&&"active",o.disabled&&"disabled",o.focusVisible&&"focusVisible"],startIcon:["startIcon"]}),e=N;import{css as q}from"@emotion/react";import{Slot as R}from"@radix-ui/react-slot";var w=$(R,{shouldForwardProp:o=>!["weight"].includes(o.toString())})(({theme:o,weight:t})=>q`
    position: relative;
    display: inline-flex;
    flex-direction: row;
    gap: ${o.spacing(2)};
    align-items: center;
    justify-content: center;
    height: ${o.spacing(5)};
    padding: ${o.spacing(.5,1)};
    font-weight: ${t||o.typography.fontWeightMedium};
    font-size: ${o.typography.body2.fontSize};
    line-height: ${o.typography.body2.lineHeight};
    white-space: nowrap;
    background-color: transparent;
    border: none;
    border-radius: 4px;
    outline: 0 solid transparent;
    outline-offset: -1px;

    &.${e.clickable} {
      cursor: pointer;
    }

    &.${e.uppercase} {
      text-transform: uppercase;
    }

    &.${e.outlined} {
      outline-width: 1px;
    }

    &.${e.green} {
      color: ${o.palette.green[800]};
      outline-color: ${o.palette.green[800]};
    }

    &.${e.greenContained} {
      background-color: ${o.palette.greenOpaque[300]};
    }

    &.${e.grey} {
      color: ${o.palette.background[900]};
    }

    &.${e.greyContained} {
      background-color: ${o.palette.background[500]};
    }

    &.${e.greyOutlined} {
      color: ${o.palette.background[800]};
      outline-color: ${o.palette.background[900]};
    }

    &.${e.red} {
      color: ${o.palette.red[800]};
      outline-color: ${o.palette.red[800]};
    }

    &.${e.redContained} {
      background-color: ${o.palette.redOpaque[400]};
    }

    &.${e.teal} {
      color: ${o.palette.teal[800]};
      outline-color: ${o.palette.teal[800]};
    }

    &.${e.tealContained} {
      background-color: ${o.palette.tealOpaque[300]};
    }

    &.${e.yellow} {
      color: ${o.palette.yellow[800]};
      outline-color: ${o.palette.yellow[800]};
    }

    &.${e.yellowContained} {
      background-color: ${o.palette.yellowOpaque[300]};
    }
  `);import{jsx as l,jsxs as U}from"react/jsx-runtime";var s=A((o,t)=>{let{color:z,component:y="button",endIcon:c,startIcon:p,uppercase:H,variant:M,weight:h,...r}=o,{children:m,className:k,...x}=r,{active:I,disabled:P,focusVisible:v,getRootProps:O}=d({...r,ref:t}),S=u(r),i=b({...o,active:I,disabled:P,focusVisible:v}),B=c&&l(a,{className:n(i.endIcon),children:c}),V=p&&l(a,{className:n(i.startIcon),children:p});return l(w,{...O(),...S,...x,className:n(k,i.root),weight:h,children:U(y,{children:[V,m,B]})})});s.defaultProps={color:"teal",variant:"contained"};s.displayName="Chip";var E=s;export{e as a,E as b};
