feat: structure

src/components/tabs/index.tsx

@@ -0,0 +1,28 @@
+import { type ComponentPropsWithoutRef } from 'react';
+import { Tabs as RTabs } from 'radix-ui';
+import { cx } from '../utils';
+
+export const Tabs = RTabs.Root;
+
+export const TabsList = ({
+  items,
+  className,
+  ...props
+}: { items: Array<{ value: string; label: string }> } & Omit<
+  ComponentPropsWithoutRef<typeof RTabs.List>,
+  'children'
+>) => (
+  <RTabs.List className={cx('modern-sk-tabs', className)} {...props}>
+    {items.map((it) => (
+      <RTabs.Trigger
+        key={it.value}
+        value={it.value}
+        className="modern-sk-tabs__trigger"
+      >
+        {it.label}
+      </RTabs.Trigger>
+    ))}
+  </RTabs.List>
+);
+
+export const TabsContent = RTabs.Content;