@newtonedev/editor 0.1.3 → 0.1.5

package/src/components/ThemeBar.tsx

@@ -1,76 +0,0 @@
-import { useState } from "react";
-import { useTokens } from "@newtonedev/components";
-import { srgbToHex } from "newtone";
-import type { ThemeName } from "../types";
-
-interface ThemeBarProps {
-  readonly activeTheme: ThemeName;
-  readonly onThemeChange: (theme: ThemeName) => void;
-}
-
-const THEME_CHIPS: readonly { id: ThemeName; label: string }[] = [
-  { id: "neutral", label: "Neutral" },
-  { id: "primary", label: "Primary" },
-  { id: "secondary", label: "Secondary" },
-  { id: "strong", label: "Strong" },
-];
-
-export function ThemeBar({ activeTheme, onThemeChange }: ThemeBarProps) {
-  const tokens = useTokens();
-  const [hoveredChipId, setHoveredChipId] = useState<string | null>(null);
-
-  const borderColor = srgbToHex(tokens.border.srgb);
-  const interactiveColor = srgbToHex(tokens.interactive.srgb);
-
-  return (
-    <div
-      style={{
-        display: "flex",
-        alignItems: "center",
-        padding: "8px 24px",
-        borderBottom: `1px solid ${borderColor}`,
-        backgroundColor: srgbToHex(tokens.background.srgb),
-        flexShrink: 0,
-      }}
-    >
-      {/* Theme Chips */}
-      <div style={{ display: "flex", gap: 8 }} role="group" aria-label="Theme">
-        {THEME_CHIPS.map((chip) => {
-          const isActive = chip.id === activeTheme;
-          const isHovered = hoveredChipId === chip.id;
-
-          return (
-            <button
-              key={chip.id}
-              onClick={() => onThemeChange(chip.id)}
-              onMouseEnter={() => setHoveredChipId(chip.id)}
-              onMouseLeave={() => setHoveredChipId(null)}
-              aria-pressed={isActive}
-              style={{
-                padding: "4px 12px",
-                borderRadius: 16,
-                border: `1px solid ${srgbToHex(
-                  isActive ? tokens.interactive.srgb : tokens.border.srgb,
-                )}`,
-                backgroundColor: isActive
-                  ? interactiveColor
-                  : isHovered
-                    ? `${interactiveColor}10`
-                    : "transparent",
-                color: isActive
-                  ? "#fff"
-                  : srgbToHex(tokens.textPrimary.srgb),
-                fontSize: 12,
-                fontWeight: 500,
-                cursor: "pointer",
-                transition: "background-color 150ms ease",
-              }}
-            >
-              {chip.label}
-            </button>
-          );
-        })}
-      </div>
-    </div>
-  );
-}