feat(theme): added new styles for component Skeleton

[gerzon05]

Styles for component Skeleton

Introduction

In this PR add new feature for component Skeleton, it is about styles:

Details

Added new variants like:

• rounded

Api refernece

 const variants = {
   rounded: {
      none: 'rounded-none',
      sm: 'rounded-sm',
      md: 'rounded-md',
      lg: 'rounded-lg',
      full: 'rounded-full',
   }
}

new animation

const animations = {
  animation: {
    'pulse-infinite': 'pulse-infinite 2s cubic-bezier(0.4, 0, 0.6, 1) infinite',
  },
  keyframes: {
    'pulse-infinite': {
      '0%': {
        opacity: 1,
      },
      '50%': {
        opacity: 0.5,
      },
      '100%': {
        opacity: 1,
      },
    },
  },
}

Related problems

Resolves #250

Preview

By default, for rounded the variant is full and icons is none

mode light

Create.Next.App.y.14.paginas.mas.-.Personal_.Microsoft.Edge.2024-05-19.22-26-31.mp4

mode dark

Create.Next.App.y.14.paginas.mas.-.Personal_.Microsoft.Edge.2024-05-19.22-25-06.mp4

How to use

import { Skeleton} from '@openui-org/react'

function SkeletonExample() {
return <Skeleton/>
}

[sebastiandotdev]

LGTM