andesine 0.4.0 → 0.6.0

package/dist/templates/pages/src/components/layout/page-actions.tsx

@@ -53,9 +53,7 @@ const PageActions: Component<PageActionsProps> = (props) => {
   return (
     <div class="flex shrink-0 gap-1">
       <Button
-        color="contrast"
-        variant="outlined"
-        size="small"
+        variant="secondary"
         text="base"
         class="gap-1.5"
         aria-label="Copy page as Markdown"
@@ -72,10 +70,6 @@ const PageActions: Component<PageActionsProps> = (props) => {
           <IconButton
             {...triggerProps()}
             icon="i-lucide:chevron-down"
-            color="contrast"
-            variant="outlined"
-            size="small"
-            text="soft"
             aria-label="More page actions"
           />
         )}

package/dist/templates/pages/src/components/primitives/button.tsx

@@ -3,9 +3,10 @@ import { type JSX, type ParentComponent, mergeProps, Show, splitProps } from "so
 import { Dynamic } from "solid-js/web";
 
 interface ButtonProps extends JSX.ButtonHTMLAttributes<HTMLButtonElement> {
-  color?: ButtonColor;
+  /** Defaults to `primary` for buttons and `secondary` for icon buttons. */
   variant?: ButtonVariant;
   size?: ButtonSize;
+  /** The gray level of `secondary` and `ghost` buttons; icon buttons default to `soft`. */
   text?: ButtonText;
   /** Renders an `<a>` element. */
   link?: string;
@@ -20,8 +21,7 @@ interface IconButtonProps extends ButtonProps {
   iconClass?: string;
 }
 
-type ButtonColor = "base" | "contrast" | "primary";
-type ButtonVariant = "solid" | "text" | "outlined";
+type ButtonVariant = "primary" | "secondary" | "ghost";
 type ButtonSize = "xs" | "small" | "medium";
 type ButtonText = "base" | "soft" | "softer";
 
@@ -30,15 +30,19 @@ const sizeClasses: Record<ButtonSize, string> = {
   small: ":base: px-1.5 py-1 text-sm",
   medium: ":base: px-2 py-1 text-base"
 };
-const colorClasses: Record<ButtonColor, string> = {
-  base: ":base: bg-gray-200 outline-gray-200",
-  contrast: ":base: bg-white outline-gray-200 shadow-gray-200",
-  primary: ":base: bg-gradient-to-tr bg-[length:125%_auto] text-white outline-tertiary"
-};
+const outlinedClasses =
+  ":base: outline outline-1 -outline-offset-1 shadow-md focus-visible:outline-1";
+// Keyboard focus shows the hover style.
 const variantClasses: Record<ButtonVariant, string> = {
-  solid: ":base: focus:outline-none",
-  text: ":base: bg-transparent focus:outline-none",
-  outlined: ":base: outline outline-1 -outline-offset-1 shadow-md focus-visible:outline-1"
+  primary: clsx(
+    outlinedClasses,
+    ":base: bg-gradient-to-tr bg-[length:125%_auto] text-white outline-tertiary @hover:bg-right focus-visible:bg-right"
+  ),
+  secondary: clsx(
+    outlinedClasses,
+    ":base: bg-white outline-gray-200 shadow-gray-200 @hover:bg-gray-100 focus-visible:bg-gray-100"
+  ),
+  ghost: ":base: bg-transparent focus:outline-none @hover:bg-gray-200 focus-visible:bg-gray-200"
 };
 const textClasses: Record<ButtonText, string> = {
   base: ":base: text-gray-700",
@@ -51,28 +55,9 @@ const iconButtonSizes: Record<ButtonSize, Record<"button" | "icon" | "label", st
   medium: { button: ":base-2: p-1", icon: ":base: h-6 w-6", label: ":base: pl-1" }
 };
 
-// Keyboard focus shows the hover style.
-const getHoverClasses = (color: ButtonColor, variant: ButtonVariant): string => {
-  if (color === "primary") return ":base: @hover:bg-right focus-visible:bg-right";
-  if (color === "contrast") return ":base: @hover:bg-gray-100 focus-visible:bg-gray-100";
-  if (variant === "text") return ":base: @hover:bg-gray-200 focus-visible:bg-gray-200";
-
-  return ":base: @hover:(shadow-inner outline-gray-300) focus-visible:(shadow-inner outline-gray-300)";
-};
 const Button: ParentComponent<ButtonProps> = (providedProps) => {
-  const props = mergeProps(
-    { color: "base", variant: "solid", size: "medium" } as const,
-    providedProps
-  );
-  const [local, rest] = splitProps(props, [
-    "class",
-    "color",
-    "variant",
-    "size",
-    "text",
-    "link",
-    "badge"
-  ]);
+  const props = mergeProps({ variant: "primary", size: "small" } as const, providedProps);
+  const [local, rest] = splitProps(props, ["class", "variant", "size", "text", "link", "badge"]);
   const component = (): "a" | "div" | "button" => {
     if (local.link) return "a";
     if (local.badge) return "div";
@@ -91,20 +76,19 @@ const Button: ParentComponent<ButtonProps> = (providedProps) => {
         !local.badge && ":base: cursor-pointer",
         sizeClasses[local.size],
         variantClasses[local.variant],
-        local.variant !== "text" && colorClasses[local.color],
-        local.text && textClasses[local.text],
-        getHoverClasses(local.color, local.variant),
+        local.text && local.variant !== "primary" && textClasses[local.text],
         local.class
       )}
     />
   );
 };
 const IconButton: ParentComponent<IconButtonProps> = (providedProps) => {
-  const props = mergeProps({ size: "medium" } as const, providedProps);
+  const props = mergeProps({ variant: "secondary", size: "small" } as const, providedProps);
   const [local, rest] = splitProps(props, ["class", "icon", "label", "iconClass", "children"]);
+  const text = () => props.text ?? (props.variant === "primary" ? undefined : "soft");
 
   return (
-    <Button {...rest} class={clsx(iconButtonSizes[props.size].button, local.class)}>
+    <Button {...rest} text={text()} class={clsx(iconButtonSizes[props.size].button, local.class)}>
       <span
         aria-hidden="true"
         class={clsx("shrink-0", iconButtonSizes[props.size].icon, local.icon, local.iconClass)}

package/dist/templates/pages/src/components/search/search-palette.tsx

@@ -93,9 +93,7 @@ const SearchPalette: Component<SearchPaletteProps> = (props) => {
             <Tooltip content="Close">
               <IconButton
                 icon="i-lucide:x"
-                variant="text"
-                text="soft"
-                size="small"
+                variant="ghost"
                 aria-label="Close search"
                 onClick={() => palette.setOpen(false)}
               />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "andesine",
-  "version": "0.4.0",
+  "version": "0.6.0",
   "description": "Command-line tools for Andesine",
   "type": "module",
   "license": "MIT",
@@ -24,22 +24,33 @@
     "node": ">=22.12.0"
   },
   "dependencies": {
+    "@babel/core": "^7.29.7",
     "@clack/prompts": "1.7.0",
     "@commander-js/extra-typings": "15.0.0",
+    "@iconify-json/lucide": "^1.2.140",
+    "@iconify-json/tabler": "^1.2.41",
+    "@iconify/utils": "^3.1.4",
+    "@orpc/zod": "^1.14.14",
+    "babel-preset-solid": "^1.9.12",
+    "base-x": "^5.0.1",
     "commander": "15.0.0",
-    "zod": "4.5.4",
     "open": "11.0.0",
     "proper-lockfile": "4.1.2",
-    "@andesine/sdk": "0.4.0"
+    "rolldown": "^1.2.2",
+    "unocss": "^66.7.5",
+    "zod": "4.5.4",
+    "@andesine/sdk": "0.6.0"
   },
   "devDependencies": {
+    "@types/babel__core": "^7.20.5",
     "@types/node": "^26.1.2",
-    "publint": "0.3.24",
-    "rolldown": "^1.2.2",
-    "typescript": "6.0.3",
     "@types/proper-lockfile": "4.1.4",
+    "prettier": "^3.9.6",
+    "publint": "0.3.24",
     "tsx": "^4.23.5",
-    "prettier": "^3.9.6"
+    "typescript": "6.0.3",
+    "@andesine/uno-preset": "0.0.0",
+    "@andesine/contracts": "0.0.0"
   },
   "repository": {
     "type": "git",