feat: structure

2026-05-31 17:49:29 +03:00
parent 67993ae3ec
commit 22afa7e1a5
29 changed files with 860 additions and 684 deletions
@@ -0,0 +1,53 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+import {
+  Switch as RSwitch,
+  Checkbox as RCheckbox,
+  RadioGroup as RRadioGroup,
+} from 'radix-ui';
+
+export const Switch = (props: ComponentPropsWithoutRef<typeof RSwitch.Root>) => (
+  <RSwitch.Root className="modern-sk-switch" {...props}>
+    <RSwitch.Thumb className="modern-sk-switch__thumb" />
+  </RSwitch.Root>
+);
+
+export const Checkbox = (props: ComponentPropsWithoutRef<typeof RCheckbox.Root>) => (
+  <RCheckbox.Root className="modern-sk-check" {...props}>
+    <RCheckbox.Indicator className="modern-sk-check__indicator">
+      <svg
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="var(--lime-ink)"
+        strokeWidth={3.5}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      >
+        <path d="M4 12l5 5L20 6" />
+      </svg>
+    </RCheckbox.Indicator>
+  </RCheckbox.Root>
+);
+
+export const RadioGroup = RRadioGroup.Root;
+
+export const RadioItem = ({
+  value,
+  ...props
+}: ComponentPropsWithoutRef<typeof RRadioGroup.Item>) => (
+  <RRadioGroup.Item className="modern-sk-radio" value={value} {...props}>
+    <RRadioGroup.Indicator className="modern-sk-radio__indicator" />
+  </RRadioGroup.Item>
+);
+
+export const Control = ({
+  children,
+  control,
+}: {
+  children: ReactNode;
+  control: ReactNode;
+}) => (
+  <label className="modern-sk-control">
+    {control}
+    {children}
+  </label>
+);