"use client";
import{e as a}from"./chunk-CLTGASR6.js";import{a as e,m as t}from"./chunk-3CHPBNY2.js";var d=e("EulTextarea",["root"]),s=r=>a("EulTextarea",{root:["root",r.disabled&&"disabled",r.focused&&"focused",r.error&&"error"]}),o=d;import{forwardRef as x}from"react";import g from"clsx";import{css as f}from"@emotion/react";var l=t("textarea")(({theme:r})=>f`
    position: relative;
    display: inline-flex;
    flex-direction: row;
    gap: ${r.spacing(4)};
    align-items: center;
    width: 100%;
    padding: ${r.spacing(2.5,4)};
    color: ${r.palette.text.primary};
    font-weight: ${r.typography.body1.fontWeight};
    font-size: ${r.typography.body1.fontSize};
    line-height: ${r.typography.body1.lineHeight};
    background-color: ${r.palette.background[200]};
    border: none;
    border-radius: ${r.spacing(2)};
    outline: ${r.spacing(.5)} solid transparent;
    outline-offset: ${r.spacing(-.5)};
    cursor: text;
    transition: ${r.transitions.create(["background-color","outline-color"])};

    &:hover {
      background-color: ${r.palette.background[100]};
    }

    &.${o.error} {
      color: ${r.palette.red[600]};
      outline-color: currentColor;
    }

    &.${o.focused}, &:focus-visible {
      outline-color: currentColor;
    }

    &.${o.disabled} {
      background-color: transparent;
      outline-width: ${r.spacing(.25)};
      outline-color: ${r.palette.background[600]};
      cursor: not-allowed;
    }
  `);import{jsx as b}from"react/jsx-runtime";var i=x((r,n)=>{let{className:c}=r,p=s(r);return b(l,{className:g(c,p.root),ref:n,...r})});i.displayName="Textarea";var $=i;export{o as a,$ as b};
