Security Audit and fixes

.eslintrc.cjs

@@ -1,4 +1,5 @@
 module.exports = {
+    ignorePatterns: ['docs/**'],
     env: {
         browser: true,
         es2021: true,

docs/app/docs/components/accordion/page.mdx → docs/app/docs/components/accordion/content.mdx

@@ -1,7 +1,3 @@
-import accordionMetadata from "./seo"
-
-export const metadata = accordionMetadata
-
 import PageDetails from '@/components/seo/PageDetails';
 
 import Documentation from '@/components/layout/Documentation/Documentation';

docs/app/docs/components/accordion/page.tsx

@@ -0,0 +1,8 @@
+import accordionMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = accordionMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/alert-dialog/page.mdx → docs/app/docs/components/alert-dialog/content.mdx

@@ -1,7 +1,3 @@
-import alertDialogMetadata from "./seo"
-
-export const metadata = alertDialogMetadata
-
 import PageDetails from '@/components/seo/PageDetails';
 
 import Documentation from '@/components/layout/Documentation/Documentation';

docs/app/docs/components/alert-dialog/page.tsx

@@ -0,0 +1,8 @@
+import alertDialogMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = alertDialogMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/aspect-ratio/page.mdx → docs/app/docs/components/aspect-ratio/content.mdx

@@ -2,9 +2,6 @@ import Documentation from "@/components/layout/Documentation/Documentation"
 import AspectRatio from "@radui/ui/AspectRatio"
 import codeUsage, { AspectRatioTable } from "./docs/codeUsage"
 import Card from "@radui/ui/Card"
-import aspectRatioMetadata from "./seo"
-
-export const metadata = aspectRatioMetadata
 
 <Documentation 
   title="AspectRatio"  

docs/app/docs/components/aspect-ratio/page.tsx

@@ -0,0 +1,8 @@
+import aspectRatioMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = aspectRatioMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/avatar-group/page.mdx → docs/app/docs/components/avatar-group/content.mdx

@@ -1,11 +1,8 @@
 import Documentation from "@/components/layout/Documentation/Documentation";
 import codeUsage, { anatomy } from "./docs/codeUsage";
 import Example1 from "./docs/example_1";
-import avatarGroupMetadata from "./seo";
 import { api_documentation } from "./docs/codeUsage";
 
-export const metadata = avatarGroupMetadata;
-
 <Documentation 
     title='Avatar Group' 
     description={`Avatar Group is used to represent a group of users or a brand. They are used in the header, sidebar, and in the chat.`}

docs/app/docs/components/avatar-group/page.tsx

@@ -0,0 +1,8 @@
+import avatarGroupMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = avatarGroupMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/avatar/page.mdx → docs/app/docs/components/avatar/content.mdx

@@ -1,9 +1,7 @@
 import Documentation from "@/components/layout/Documentation/Documentation"
 import AvatarExample from "./docs/AvatarExample"
 import codeUsage, { avatarBasicUsageExample } from "./docs/codeUsage"
-import avatarMetadata from "./seo"
 import { api_documentation } from "./docs/codeUsage"
-export const metadata = avatarMetadata
 
 <Documentation 
   title="Avatar" 

docs/app/docs/components/avatar/page.tsx

@@ -0,0 +1,8 @@
+import avatarMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = avatarMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/badge/page.mdx → docs/app/docs/components/badge/content.mdx

@@ -7,9 +7,6 @@ import { code as colorCodeUsage } from './docs/colorCodeUsage';
 import BadgeVariants from './examples/BadgeVariants';
 import BadgeSizes from './examples/BadgeSizes';
 import BadgeColor from './examples/BadgeColor';
-import badgeMetadata from "./seo"
-
-export const metadata = badgeMetadata
 
 <Documentation 
     title={`Badge`} 

docs/app/docs/components/badge/page.tsx

@@ -0,0 +1,8 @@
+import badgeMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = badgeMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/blockquote/page.mdx → docs/app/docs/components/blockquote/content.mdx

@@ -6,11 +6,8 @@ import { code as sizeCodeUsage } from './docs/sizeCodeUsage';
 import { code as colorCodeUsage } from './docs/colorCodeUsage';
 import BlockQuoteSizes from './examples/BlockQuoteSizes';
 import BlockQuoteColor from './examples/BlockQuoteColor';
-import blockquoteMetadata from './seo';
 import BlockQuoteExample from './examples/BlockQuoteExample';
 
-export const metadata = blockquoteMetadata;
-
 <Documentation 
   title="BlockQuote" 
   description="BlockQuote is a component that visually distinguishes quoted content, making it perfect for testimonials, citations, and emphasizing important passages."

docs/app/docs/components/blockquote/page.tsx

@@ -0,0 +1,8 @@
+import blockquoteMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = blockquoteMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/button/page.mdx → docs/app/docs/components/button/content.mdx

@@ -8,9 +8,6 @@ import { code as colorCodeUsage } from './docs/colorCodeUsage';
 import ButtonVariants from './examples/ButtonVariants';
 import ButtonSizes from './examples/ButtonSizes';
 import ButtonColor from './examples/ButtonColor';
-import buttonMetadata from './seo';
-
-export const metadata = buttonMetadata;
 
 <Documentation
   title="Button" 

docs/app/docs/components/button/page.tsx

@@ -0,0 +1,8 @@
+import buttonMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = buttonMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/callout/page.mdx → docs/app/docs/components/callout/content.mdx

@@ -10,9 +10,6 @@ import { code as colorCodeUsage } from './docs/colorCodeUsage';
 import CalloutVariants from './examples/CalloutVariants';
 import CalloutSizes from './examples/CalloutSizes';
 import CalloutColor from './examples/CalloutColor';
-import calloutMetadata from './seo';
-
-export const metadata = calloutMetadata;
 
 <Documentation 
   title="Callout" 

docs/app/docs/components/callout/page.tsx

@@ -0,0 +1,8 @@
+import calloutMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = calloutMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/card/page.mdx → docs/app/docs/components/card/content.mdx

@@ -3,9 +3,6 @@ import Documentation from '@/components/layout/Documentation/Documentation';
 import Card from '@radui/ui/Card';
 import Avatar from '@radui/ui/Avatar';
 import codeUsage, { api_documentation, features } from './docs/codeUsage';
-import cardMetadata from './seo';
-
-export const metadata = cardMetadata;
 
 <Documentation 
   title="Card" 

docs/app/docs/components/card/page.tsx

@@ -0,0 +1,8 @@
+import cardMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = cardMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/code/page.mdx → docs/app/docs/components/code/content.mdx

@@ -2,9 +2,6 @@ import PageDetails from '@/components/seo/PageDetails';
 import Documentation from '@/components/layout/Documentation/Documentation';
 import Code from '@radui/ui/Code';
 import codeUsage, { api_documentation, features } from './docs/codeUsage';
-import codeMetadata from './seo';
-
-export const metadata = codeMetadata;
 
 <Documentation
   title="Code" 

docs/app/docs/components/code/page.tsx

@@ -0,0 +1,8 @@
+import codeMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = codeMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/dialog/page.mdx → docs/app/docs/components/dialog/content.mdx

@@ -1,7 +1,3 @@
-import dialogMetadata from "./seo"
-
-export const metadata = dialogMetadata
-
 import PageDetails from '@/components/seo/PageDetails';
 
 import Documentation from '@/components/layout/Documentation/Documentation';

docs/app/docs/components/dialog/page.tsx

@@ -0,0 +1,8 @@
+import dialogMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = dialogMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/em/page.mdx → docs/app/docs/components/em/content.mdx

@@ -4,9 +4,6 @@ import Em from "@radui/ui/Em"
 import Text from "@radui/ui/Text"
 import codeUsage, { api_documentation, features } from "./docs/codeUsage"
 import EmExample from "./docs/EmExample"
-import emMetadata from "./seo"
-
-export const metadata = emMetadata;
 
 <Documentation  
   title="Em" 

docs/app/docs/components/em/page.tsx

@@ -0,0 +1,8 @@
+import emMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = emMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/heading/page.mdx → docs/app/docs/components/heading/content.mdx

@@ -2,9 +2,6 @@ import PageDetails from '@/components/seo/PageDetails';
 import Documentation from "@/components/layout/Documentation/Documentation"
 import Heading from "@radui/ui/Heading"
 import codeUsage, { api_documentation, features } from "./docs/codeUsage"
-import headingMetadata from "./seo"
-
-export const metadata = headingMetadata;
 
 <Documentation 
   title="Heading" 

docs/app/docs/components/heading/page.tsx

@@ -0,0 +1,8 @@
+import headingMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = headingMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/kbd/page.mdx → docs/app/docs/components/kbd/content.mdx

@@ -3,9 +3,6 @@ import Documentation from "@/components/layout/Documentation/Documentation"
 import Kbd from "@radui/ui/Kbd"
 import Card from "@radui/ui/Card"
 import codeUsage, { api_documentation, features } from "./docs/codeUsage"
-import kbdMetadata from "./seo"
-
-export const metadata = kbdMetadata;
 
 <Documentation 
   title="Kbd" 

docs/app/docs/components/kbd/page.tsx

@@ -0,0 +1,8 @@
+import kbdMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = kbdMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/progress/page.mdx → docs/app/docs/components/progress/content.mdx

@@ -1,12 +1,8 @@
 import PageDetails from '@/components/seo/PageDetails';
 import Documentation from "@/components/layout/Documentation/Documentation"
 import codeUsage, { ProgressTable, api_documentation, features } from "./docs/codeUsage"
-import progressMetadata from "./seo"
-
 import ProgressExample from "./docs/examples/ProgressExample"
 
-export const metadata = progressMetadata;
-
 <Documentation 
   title="Progress" 
   description="The Progress component visually represents the completion status of a task or process, such as uploading a file, loading content, or completing form steps."

docs/app/docs/components/progress/page.tsx

@@ -0,0 +1,8 @@
+import progressMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = progressMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/separator/page.mdx → docs/app/docs/components/separator/content.mdx

@@ -3,9 +3,6 @@ import Documentation from "@/components/layout/Documentation/Documentation"
 import Separator from "@radui/ui/Separator"
 import Text from "@radui/ui/Text"
 import codeUsage, { SeparatorTable, api_documentation, features } from "./docs/codeUsage"
-import separatorMetadata from "./seo"
-
-export const metadata = separatorMetadata;
 
 <Documentation 
   title="Separator" 

docs/app/docs/components/separator/page.tsx

@@ -0,0 +1,8 @@
+import separatorMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = separatorMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/strong/page.mdx → docs/app/docs/components/strong/content.mdx

@@ -2,9 +2,6 @@ import PageDetails from '@/components/seo/PageDetails';
 import Documentation from "@/components/layout/Documentation/Documentation"
 import Strong from "@radui/ui/Strong"
 import codeUsage, { api_documentation, features } from "./docs/codeUsage"
-import strongMetadata from "./seo"
-
-export const metadata = strongMetadata;
 
 <Documentation 
   title="Strong" 

docs/app/docs/components/strong/page.tsx

@@ -0,0 +1,8 @@
+import strongMetadata from './seo'
+import Content from './content.mdx'
+
+export const metadata = strongMetadata
+
+export default function Page() {
+  return <Content />
+}

docs/app/docs/components/switch/page.mdx → docs/app/docs/components/switch/content.mdx

@@ -1,17 +1,8 @@
 import Documentation from "@/components/layout/Documentation/Documentation"
 import Switch from "@radui/ui/Switch"
 import codeUsage, { api_documentation } from "./docs/codeUsage"
-import switchMetadata from "./seo"
-
 import SwitchExample from "./docs/examples/SwitchExample"
 
-export const metadata = switchMetadata;
-
-
-
-
-
-
 <Documentation  title='Switch' description={`
             Switch is used to toggle between two states on and off. It is commonly used in settings panel, forms and any other 
             place where a user needs to enable or disable feature.