chore: add as prop to skeleton for quick usage

closes #68

packages/components/elements/skeleton/Skeleton.tsx

@@ -7,13 +7,15 @@ interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
   animation?: "none" | "pulse" | "shimmer";
   content?: any;
   fade?: "top" | "bottom" | "left" | "right";
+  as?: "div" | "input";
 }
 
 function Skeleton({
   className,
   content,
   animation = "pulse",
   fade,
+  as = "div",
   ...props
 }: SkeletonProps) {
   const animationStyles = {
@@ -29,13 +31,19 @@ function Skeleton({
     left: "hawa-mask-fade-left ",
   };
 
+  const styledAs = {
+    div: "",
+    input: "!h-[38px] !w-full",
+  };
+
   return (
     <div
       className={cn(
         animationStyles[animation],
         content &&
           "hawa-flex hawa-flex-col hawa-items-center hawa-justify-center",
         fade && fadeStyle[fade],
+        styledAs[as],
         className,
       )}
       {...props}