"use client";
import{e as n}from"./chunk-CLTGASR6.js";import{a,m as i}from"./chunk-3CHPBNY2.js";import{forwardRef as g}from"react";import x from"clsx";var S=a("EulSkeleton",["circular","rectangular","root","fullWidth"]),p=e=>n("EulSkeleton",{root:[e.variant,"root",e.fullWidth&&"fullWidth"]}),r=S;import{css as y}from"@emotion/react";var m=i("span",{shouldForwardProp:e=>!["width","height","colorType"].includes(e.toString())})(({colorType:e=600,height:o,theme:l,width:t})=>y`
    position: relative;
    display: inline-flex;
    width: ${typeof t=="number"?`${t}px`:t};
    height: ${typeof o=="number"?`${o}px`:o};
    vertical-align: top;
    background-color: ${l.palette.background[e]};
    animation: 1.5s ease-in-out 0.5s infinite normal none running skeleton-animation;

    &.${r.rectangular} {
      border-radius: 4px;
    }

    &.${r.circular} {
      border-radius: 50%;
    }

    &.${r.fullWidth} {
      width: 100%;
    }

    @keyframes skeleton-animation {
      0% {
        opacity: 1;
      }

      50% {
        opacity: 0.4;
      }

      100% {
        opacity: 1;
      }
    }
  `);import{jsx as P}from"react/jsx-runtime";var s=g(({children:e,className:o,colorType:l,fullWidth:t,height:f,variant:u,width:k},c)=>{let d=p({fullWidth:t,variant:u});return P(m,{className:x(o,d.root),colorType:l,height:f,ref:c,width:k,children:e})});s.defaultProps={variant:"rectangular"};s.displayName="Skeleton";var C=s;export{r as a,C as b};
