@enderfall/ui 0.2.22 → 0.2.24

package/dist/components/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAElD,KAAK,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC3D,OAAO,CAAC,EACJ,SAAS,GACT,OAAO,GACP,QAAQ,GACR,QAAQ,GACR,QAAQ,GACR,SAAS,GACT,MAAM,GACN,SAAS,GACT,KAAK,CAAC;IACV,UAAU,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,YAAY,CAAC;CAChD,CAAC;AAEF,eAAO,MAAM,MAAM,GAAI,8CAAsE,WAAW,4CAavG,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAElD,KAAK,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC3D,OAAO,CAAC,EACJ,SAAS,GACT,OAAO,GACP,QAAQ,GACR,QAAQ,GACR,QAAQ,GACR,SAAS,GACT,MAAM,GACN,SAAS,GACT,KAAK,CAAC;IACV,UAAU,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,YAAY,CAAC;CAChD,CAAC;AAEF,eAAO,MAAM,MAAM,GAAI,8CAAyE,WAAW,4CAa1G,CAAC"}

package/dist/components/Button.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-export const Button = ({ variant = "primary", subvariant = "default", className, ...props }) => (_jsx("button", { ...props, className: [
+export const Button = ({ variant = "primary", subvariant = "hover-glow", className, ...props }) => (_jsx("button", { ...props, className: [
         "ef-button",
         variant,
         subvariant === "glow" ? "ef-button--glow" : "",

package/dist/components/Dropdown.js

@@ -87,7 +87,7 @@ export const Dropdown = (props) => {
                             }, disabled: item.disabled, title: item.title, children: item.label }, key));
                     }
                     const isLogoutAction = /\b(log\s*out|sign\s*out)\b/i.test(item.label);
-                    return (_jsx(Button, { variant: item.buttonVariant ?? (isLogoutAction ? "danger" : "primary"), subvariant: item.buttonSubvariant ?? "default", className: ["dropdown-item", item.className].filter(Boolean).join(" "), type: "button", onClick: () => {
+                    return (_jsx(Button, { variant: item.buttonVariant ?? (isLogoutAction ? "danger" : "primary"), subvariant: item.buttonSubvariant ?? "hover-glow", className: ["dropdown-item", item.className].filter(Boolean).join(" "), type: "button", onClick: () => {
                             item.onClick();
                             setOpen(false);
                         }, disabled: item.disabled, title: item.title, children: item.label }, key));

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@enderfall/ui",
   "private": false,
-  "version": "0.2.22",
+  "version": "0.2.24",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",

package/src/components/Button.css

@@ -56,22 +56,38 @@
     var(--ef-button-border-soft) border-box;
 }
 
-.ef-button.primary {
-  background:
-    linear-gradient(var(--ef-button-surface), var(--ef-button-surface)) padding-box,
-    var(--ef-button-border) border-box;
-  color: var(--ef-button-text);
-}
+.ef-button.primary {
+  background:
+    linear-gradient(var(--ef-button-surface), var(--ef-button-surface)) padding-box,
+    var(--ef-button-border) border-box;
+  color: var(--ef-button-text);
+}
+
+.ef-button.primary.ef-button--hover-glow:not(:disabled):hover,
+.ef-button.primary.ef-button--hover-glow:focus-visible,
+.ef-button.primary.ef-button--glow:not(:disabled):hover,
+.ef-button.primary.ef-button--glow:focus-visible {
+  transform: none;
+}
 
 .ef-button.ghost {
   --ef-button-current-glow-shadow: var(--ef-button-glow-shadow, 0 0 24px rgba(124, 77, 255, 0.45));
   --ef-button-current-hover-shadow: var(--ef-button-hover-shadow, 0 0 18px rgba(124, 77, 255, 0.35));
   --ef-button-current-focus-shadow: var(--ef-button-focus-shadow, 0 0 18px rgba(124, 77, 255, 0.35));
-  background:
-    linear-gradient(var(--ef-button-surface), var(--ef-button-surface)) padding-box,
-    var(--ef-button-border) border-box;
-  color: var(--ef-button-text);
-}
+  background: var(--ef-tab-button-surface, var(--ef-nav-surface));
+  box-shadow: var(--ef-tab-button-shadow, var(--ef-nav-shadow));
+  color: var(--ef-tab-button-text, var(--ef-nav-text));
+}
+
+.ef-button.ghost:not(:disabled):hover {
+  background: var(--ef-tab-button-surface-hover, var(--ef-tab-button-surface, var(--ef-nav-surface)));
+  box-shadow: var(--ef-tab-button-shadow-hover, var(--ef-nav-shadow-hover));
+}
+
+.ef-button.ghost:focus-visible {
+  background: var(--ef-tab-button-surface-hover, var(--ef-tab-button-surface, var(--ef-nav-surface)));
+  box-shadow: var(--ef-tab-button-shadow-focus, var(--ef-nav-shadow-focus));
+}
 
 .ef-button.locked {
   background: var(--ef-button-locked-bg);

package/src/components/Button.tsx

@@ -14,7 +14,7 @@ type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
   subvariant?: "default" | "glow" | "hover-glow";
 };
 
-export const Button = ({ variant = "primary", subvariant = "default", className, ...props }: ButtonProps) => (
+export const Button = ({ variant = "primary", subvariant = "hover-glow", className, ...props }: ButtonProps) => (
   <button
     {...props}
     className={[

package/src/components/Dropdown.tsx

@@ -7,26 +7,26 @@ export type HeaderMenuItem = {
   content: ReactNode;
 };
 
-export type DropdownUserItem = {
-  id?: string;
-  label: string;
-  onClick: () => void;
-  disabled?: boolean;
-  className?: string;
-  title?: string;
-  variant?: "default" | "theme-preview";
-  buttonVariant?:
-    | "primary"
-    | "ghost"
-    | "locked"
-    | "danger"
-    | "delete"
-    | "warning"
-    | "info"
-    | "success"
-    | "tab";
-  buttonSubvariant?: "default" | "glow" | "hover-glow";
-};
+export type DropdownUserItem = {
+  id?: string;
+  label: string;
+  onClick: () => void;
+  disabled?: boolean;
+  className?: string;
+  title?: string;
+  variant?: "default" | "theme-preview";
+  buttonVariant?:
+    | "primary"
+    | "ghost"
+    | "locked"
+    | "danger"
+    | "delete"
+    | "warning"
+    | "info"
+    | "success"
+    | "tab";
+  buttonSubvariant?: "default" | "glow" | "hover-glow";
+};
 
 export type DropdownUserListItem = {
   id?: string;
@@ -300,48 +300,48 @@ export const Dropdown = (props: DropdownProps) => {
           : null;
 
     const renderUserListItems = () => {
-      if (props.variant !== "user-list") {
-        return props.items.map((item, index) => {
-          const key = item.id ?? `${item.label}-${index}`;
-          if (item.variant === "theme-preview") {
-            return (
+      if (props.variant !== "user-list") {
+        return props.items.map((item, index) => {
+          const key = item.id ?? `${item.label}-${index}`;
+          if (item.variant === "theme-preview") {
+            return (
               <Button
                 key={key}
                 type="button"
-                variant="primary"
-                subvariant={item.buttonSubvariant ?? "default"}
-                className={["theme-preview", item.className].filter(Boolean).join(" ")}
-                onClick={() => {
-                  item.onClick();
-                  setOpen(false);
-                }}
+                variant="primary"
+                subvariant={item.buttonSubvariant ?? "default"}
+                className={["theme-preview", item.className].filter(Boolean).join(" ")}
+                onClick={() => {
+                  item.onClick();
+                  setOpen(false);
+                }}
                 disabled={item.disabled}
                 title={item.title}
-              >
-                {item.label}
-              </Button>
-            );
-          }
-          const isLogoutAction = /\b(log\s*out|sign\s*out)\b/i.test(item.label);
-          return (
+              >
+                {item.label}
+              </Button>
+            );
+          }
+          const isLogoutAction = /\b(log\s*out|sign\s*out)\b/i.test(item.label);
+          return (
             <Button
               key={key}
               variant={item.buttonVariant ?? (isLogoutAction ? "danger" : "primary")}
-              subvariant={item.buttonSubvariant ?? "default"}
+              subvariant={item.buttonSubvariant ?? "hover-glow"}
               className={["dropdown-item", item.className].filter(Boolean).join(" ")}
               type="button"
               onClick={() => {
                 item.onClick();
                 setOpen(false);
-              }}
-              disabled={item.disabled}
-              title={item.title}
-            >
-              {item.label}
-            </Button>
-          );
-        });
-      }
+              }}
+              disabled={item.disabled}
+              title={item.title}
+            >
+              {item.label}
+            </Button>
+          );
+        });
+      }
 
       if (!props.items.length) {
         return (

package/src/components/UserMenu.css

@@ -116,26 +116,9 @@
   cursor: pointer;
 }
 
-.dropdown-item:not(.ef-button) {
-  border: 2px solid transparent;
-  padding: 10px 16px;
-  border-radius: var(--ef-control-radius, 12px);
-  background:
-    linear-gradient(var(--ef-surface), var(--ef-surface)) padding-box,
-    var(--ef-border-gradient) border-box;
-  color: var(--text-strong);
-  font-weight: 600;
-  transition: box-shadow 0.2s ease, transform 0.2s ease;
-  box-shadow: var(--ef-button-glow-shadow, 0 0 24px rgba(124, 77, 255, 0.45));
-}
-
 .dropdown-item:hover {
   transform: translateY(-1px);
 }
-
-.dropdown-item:not(.ef-button):hover {
-  box-shadow: var(--ef-button-hover-glow-shadow, 0 0 18px rgba(124, 77, 255, 0.35));
-}
 
 .dropdown-item.theme-preview {
   border: 2px solid transparent;