Establish NODE.DC design system baseline

2026-07-10 02:34:36 +03:00
commit 73629d68c3
63 changed files with 6701 additions and 0 deletions
@@ -0,0 +1,41 @@
+import type { ButtonHTMLAttributes } from "react";
+import { cn } from "./cn";
+
+export interface CheckerProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "onChange"> {
+  checked: boolean;
+  label: string;
+  description?: string;
+  onChange: (checked: boolean) => void;
+}
+
+export function Checker({
+  checked,
+  label,
+  description,
+  onChange,
+  disabled,
+  className,
+  type = "button",
+  ...props
+}: CheckerProps) {
+  return (
+    <button
+      type={type}
+      className={cn("nodedc-checker", className)}
+      role="checkbox"
+      aria-checked={checked}
+      disabled={disabled}
+      onClick={() => {
+        if (!disabled) onChange(!checked);
+      }}
+      {...props}
+    >
+      <span className="nodedc-checker__copy">
+        <span className="nodedc-checker__label">{label}</span>
+        {description ? <span className="nodedc-checker__description">{description}</span> : null}
+      </span>
+      <span className="nodedc-checker__indicator" aria-hidden="true" />
+    </button>
+  );
+}
+