@almadar/cli 1.0.6 → 1.0.8

package/shells/typescript-shell/packages/client/src/components/atoms/index.ts

@@ -1,88 +0,0 @@
-export { Button, type ButtonProps } from "./Button";
-export { Input, type InputProps } from "./Input";
-export { Label, type LabelProps } from "./Label";
-export { Textarea, type TextareaProps } from "./Textarea";
-export { Select, type SelectProps, type SelectOption } from "./Select";
-export { Checkbox, type CheckboxProps } from "./Checkbox";
-export {
-  Card,
-  CardHeader,
-  CardTitle,
-  CardContent,
-  CardBody,
-  CardFooter,
-  type CardProps,
-} from "./Card";
-export { Badge, type BadgeProps } from "./Badge";
-export { Spinner, type SpinnerProps } from "./Spinner";
-
-// Migrated atoms
-export {
-  Avatar,
-  type AvatarProps,
-  type AvatarSize,
-  type AvatarStatus,
-} from "./Avatar";
-export {
-  Box,
-  type BoxProps,
-  type BoxPadding,
-  type BoxMargin,
-  type BoxBg,
-  type BoxRounded,
-  type BoxShadow,
-} from "./Box";
-export { Center, type CenterProps } from "./Center";
-export { Divider, type DividerProps, type DividerOrientation } from "./Divider";
-export {
-  Icon,
-  type IconProps,
-  type IconSize,
-  type IconAnimation,
-} from "./Icon";
-export {
-  ProgressBar,
-  type ProgressBarProps,
-  type ProgressBarVariant,
-  type ProgressBarColor,
-} from "./ProgressBar";
-export { Radio, type RadioProps } from "./Radio";
-export { Switch, type SwitchProps } from "./Switch";
-export { Spacer, type SpacerProps, type SpacerSize } from "./Spacer";
-export {
-  Stack,
-  VStack,
-  HStack,
-  type StackProps,
-  type VStackProps,
-  type HStackProps,
-  type StackDirection,
-  type StackGap,
-  type StackAlign,
-  type StackJustify,
-} from "./Stack";
-export {
-  TextHighlight,
-  type TextHighlightProps,
-  type HighlightType,
-} from "./TextHighlight";
-export {
-  Typography,
-  type TypographyProps,
-  type TypographyVariant,
-} from "./Typography";
-export { ThemeToggle, type ThemeToggleProps } from "./ThemeToggle";
-export { ThemeSelector } from "./ThemeSelector";
-export { Overlay, type OverlayProps } from "./Overlay";
-
-// Inspection form components
-export {
-  ConditionalWrapper,
-  type ConditionalWrapperProps,
-  type ConditionalContext,
-} from "./ConditionalWrapper";
-export {
-  LawReferenceTooltip,
-  type LawReferenceTooltipProps,
-  type LawReference,
-} from "./LawReferenceTooltip";

package/shells/typescript-shell/packages/client/src/components/index.ts

@@ -1,4 +0,0 @@
-export * from './atoms';
-export * from './molecules';
-export * from './organisms';
-export * from './templates';

package/shells/typescript-shell/packages/client/src/components/molecules/Accordion.tsx

@@ -1,223 +0,0 @@
-/**
- * Accordion Molecule Component
- *
- * A collapsible content component with single or multiple open items.
- * Uses Button, Icon, Typography, and Divider atoms.
- */
-
-import React, { useState } from "react";
-import { ChevronDown } from "lucide-react";
-
-import { Icon } from "../atoms/Icon";
-import { Typography } from "../atoms/Typography";
-
-import { cn } from "../../lib/cn";
-
-export interface AccordionItem {
-  /**
-   * Item ID (auto-generated from header/title if not provided)
-   */
-  id?: string;
-
-  /**
-   * Item header/title
-   */
-  header?: React.ReactNode;
-
-  /**
-   * Alias for header (pattern compatibility)
-   */
-  title?: React.ReactNode;
-
-  /**
-   * Item content
-   */
-  content: React.ReactNode;
-
-  /**
-   * Disable item
-   */
-  disabled?: boolean;
-
-  /**
-   * Default open state
-   */
-  defaultOpen?: boolean;
-}
-
-export interface AccordionProps {
-  /**
-   * Accordion items
-   */
-  items: AccordionItem[];
-
-  /**
-   * Allow multiple items open at once
-   * @default false
-   */
-  multiple?: boolean;
-
-  /**
-   * Default open items (IDs)
-   */
-  defaultOpenItems?: string[];
-
-  /**
-   * Default open items by index (pattern compatibility)
-   */
-  defaultOpen?: number[];
-
-  /**
-   * Controlled open items (IDs)
-   */
-  openItems?: string[];
-
-  /**
-   * Callback when item opens/closes
-   */
-  onItemToggle?: (itemId: string, isOpen: boolean) => void;
-
-  /**
-   * Additional CSS classes
-   */
-  className?: string;
-}
-
-// Helper to generate ID from header/title content
-function generateItemId(item: AccordionItem, index: number): string {
-  if (item.id) return item.id;
-  const headerText = item.header ?? item.title;
-  if (typeof headerText === "string") {
-    return `accordion-${headerText.toLowerCase().replace(/\s+/g, "-")}-${index}`;
-  }
-  return `accordion-item-${index}`;
-}
-
-// Normalize item to ensure id and header are set
-function normalizeItem(
-  item: AccordionItem,
-  index: number,
-): AccordionItem & { id: string; header: React.ReactNode } {
-  return {
-    ...item,
-    id: generateItemId(item, index),
-    header: item.header ?? item.title ?? "",
-  };
-}
-
-export const Accordion: React.FC<AccordionProps> = ({
-  items,
-  multiple = false,
-  defaultOpenItems,
-  defaultOpen,
-  openItems: controlledOpenItems,
-  onItemToggle,
-  className,
-}) => {
-  // Normalize items to ensure id and header are always present
-  const normalizedItems = items.map((item, index) =>
-    normalizeItem(item, index),
-  );
-
-  // Resolve default open items - prefer defaultOpenItems (string IDs), fall back to defaultOpen (indices)
-  const resolveDefaultOpen = (): string[] => {
-    if (defaultOpenItems) return defaultOpenItems;
-    if (defaultOpen) {
-      return defaultOpen
-        .filter((index) => index >= 0 && index < normalizedItems.length)
-        .map((index) => normalizedItems[index].id);
-    }
-    return normalizedItems
-      .filter((item) => item.defaultOpen)
-      .map((item) => item.id);
-  };
-
-  const [internalOpenItems, setInternalOpenItems] = useState<Set<string>>(
-    new Set(resolveDefaultOpen()),
-  );
-
-  const openItemsSet = controlledOpenItems
-    ? new Set(controlledOpenItems)
-    : internalOpenItems;
-
-  const handleToggle = (itemId: string) => {
-    const isOpen = openItemsSet.has(itemId);
-    const newOpenItems = new Set(openItemsSet);
-
-    if (isOpen) {
-      newOpenItems.delete(itemId);
-    } else {
-      if (!multiple) {
-        newOpenItems.clear();
-      }
-      newOpenItems.add(itemId);
-    }
-
-    if (controlledOpenItems === undefined) {
-      setInternalOpenItems(newOpenItems);
-    }
-
-    onItemToggle?.(itemId, !isOpen);
-  };
-
-  return (
-    <div className={cn("w-full", className)}>
-      {normalizedItems.map((item, index) => {
-        const isOpen = openItemsSet.has(item.id);
-        const isDisabled = item.disabled;
-
-        return (
-          <div key={item.id} className={index > 0 ? "mt-2" : ""}>
-            <div className="border-2 border-[var(--color-border)] overflow-hidden">
-              <button
-                type="button"
-                onClick={() => !isDisabled && handleToggle(item.id)}
-                disabled={isDisabled}
-                className={cn(
-                  "w-full flex items-center justify-between px-4 py-3",
-                  "bg-[var(--color-card)]",
-                  "hover:bg-[var(--color-muted)]",
-                  "transition-colors duration-200",
-                  "focus:outline-none focus:ring-2 focus:ring-[var(--color-ring)] focus:ring-inset",
-                  "disabled:opacity-50 disabled:cursor-not-allowed",
-                  isOpen && "bg-[var(--color-muted)] font-bold",
-                )}
-                aria-expanded={isOpen}
-                aria-controls={`accordion-content-${item.id}`}
-              >
-                <div className="flex-1 text-left">
-                  {typeof item.header === "string" ? (
-                    <Typography variant="body" weight="medium">
-                      {item.header}
-                    </Typography>
-                  ) : (
-                    item.header
-                  )}
-                </div>
-                <Icon
-                  icon={ChevronDown}
-                  size="sm"
-                  className={cn(
-                    "transition-transform duration-200",
-                    isOpen && "transform rotate-180",
-                  )}
-                />
-              </button>
-
-              {isOpen && (
-                <div
-                  id={`accordion-content-${item.id}`}
-                  className="px-4 py-3 bg-[var(--color-card)] border-t-2 border-[var(--color-border)]"
-                >
-                  {item.content}
-                </div>
-              )}
-            </div>
-          </div>
-        );
-      })}
-    </div>
-  );
-};
-
-Accordion.displayName = "Accordion";

package/shells/typescript-shell/packages/client/src/components/molecules/Alert.tsx

@@ -1,117 +0,0 @@
-/**
- * Alert Molecule Component
- *
- * A component for displaying alert messages with different variants and actions.
- * Uses theme-aware CSS variables for styling.
- */
-
-import React from "react";
-import { X, AlertCircle, CheckCircle, AlertTriangle, Info } from "lucide-react";
-import { cn } from "../../lib/cn";
-import { Box } from "../atoms/Box";
-import { Icon } from "../atoms/Icon";
-import { Typography } from "../atoms/Typography";
-
-export type AlertVariant = "info" | "success" | "warning" | "error";
-
-export interface AlertProps {
-  /** Alert content (children or message) */
-  children?: React.ReactNode;
-  /** Alert message (alias for children) */
-  message?: string;
-  variant?: AlertVariant;
-  title?: string;
-  dismissible?: boolean;
-  onDismiss?: () => void;
-  onClose?: () => void;
-  actions?: React.ReactNode;
-  className?: string;
-}
-
-const variantBorderClasses: Record<AlertVariant, string> = {
-  info: "border-[var(--color-info)]",
-  success: "border-[var(--color-success)]",
-  warning: "border-[var(--color-warning)]",
-  error: "border-[var(--color-error)]",
-};
-
-const variantIconColors: Record<AlertVariant, string> = {
-  info: "text-[var(--color-info)]",
-  success: "text-[var(--color-success)]",
-  warning: "text-[var(--color-warning)]",
-  error: "text-[var(--color-error)]",
-};
-
-const iconMap: Record<AlertVariant, typeof Info> = {
-  info: Info,
-  success: CheckCircle,
-  warning: AlertTriangle,
-  error: AlertCircle,
-};
-
-export const Alert: React.FC<AlertProps> = ({
-  children,
-  message,
-  variant = "info",
-  title,
-  dismissible = false,
-  onDismiss,
-  onClose,
-  actions,
-  className,
-}) => {
-  const handleDismiss = onDismiss || onClose;
-  // Use message if provided, else children
-  const content = children ?? message;
-
-  return (
-    <Box
-      bg="surface"
-      border
-      shadow="sm"
-      padding="md"
-      rounded="sm"
-      className={cn(variantBorderClasses[variant], className)}
-      role="alert"
-    >
-      <div className="flex items-start gap-3">
-        {/* Icon */}
-        <div className="flex-shrink-0 mt-0.5">
-          <Icon
-            icon={iconMap[variant]}
-            size="md"
-            className={variantIconColors[variant]}
-          />
-        </div>
-
-        {/* Content */}
-        <div className="flex-1 min-w-0">
-          {title && (
-            <Typography variant="h6" className="mb-1">
-              {title}
-            </Typography>
-          )}
-          <Typography variant="body2">{content}</Typography>
-          {actions && <div className="mt-3 flex gap-2">{actions}</div>}
-        </div>
-
-        {/* Dismiss Button */}
-        {(dismissible || handleDismiss) && (
-          <button
-            type="button"
-            onClick={handleDismiss}
-            className={cn(
-              "flex-shrink-0 p-1 transition-colors rounded-[var(--radius-sm)]",
-              "hover:bg-[var(--color-muted)]",
-            )}
-            aria-label="Dismiss alert"
-          >
-            <Icon icon={X} size="sm" />
-          </button>
-        )}
-      </div>
-    </Box>
-  );
-};
-
-Alert.displayName = "Alert";

package/shells/typescript-shell/packages/client/src/components/molecules/Breadcrumb.tsx

@@ -1,159 +0,0 @@
-/**
- * Breadcrumb Molecule Component
- *
- * A breadcrumb navigation component with separators and icons.
- * Uses Button, Icon, and Typography atoms.
- */
-
-import React from "react";
-import { ChevronRight } from "lucide-react";
-import type { LucideIcon } from "lucide-react";
-
-import { Icon } from "../atoms/Icon";
-import { Typography } from "../atoms/Typography";
-import { cn } from "../../lib/cn";
-
-export interface BreadcrumbItem {
-  /**
-   * Item label
-   */
-  label: string;
-
-  /**
-   * Item href (if provided, renders as link)
-   */
-  href?: string;
-
-  /**
-   * Item path (alias for href, for schema compatibility)
-   */
-  path?: string;
-
-  /**
-   * Item icon
-   */
-  icon?: LucideIcon;
-
-  /**
-   * Click handler (if href not provided)
-   */
-  onClick?: () => void;
-
-  /**
-   * Is current page
-   */
-  isCurrent?: boolean;
-}
-
-export interface BreadcrumbProps {
-  /**
-   * Breadcrumb items
-   */
-  items: BreadcrumbItem[];
-
-  /**
-   * Separator icon
-   */
-  separator?: LucideIcon;
-
-  /**
-   * Maximum items to show (truncates with ellipsis)
-   */
-  maxItems?: number;
-
-  /**
-   * Additional CSS classes
-   */
-  className?: string;
-}
-
-export const Breadcrumb: React.FC<BreadcrumbProps> = ({
-  items,
-  separator = ChevronRight,
-  maxItems,
-  className,
-}) => {
-  const displayItems =
-    maxItems && items.length > maxItems
-      ? [
-          ...items.slice(0, 1),
-          { label: "...", isCurrent: false } as BreadcrumbItem,
-          ...items.slice(-maxItems + 1),
-        ]
-      : items;
-
-  return (
-    <nav
-      aria-label="Breadcrumb"
-      className={cn("flex items-center gap-2", className)}
-    >
-      <ol className="flex items-center gap-2">
-        {displayItems.map((item, index) => {
-          const isLast = index === displayItems.length - 1;
-          const isEllipsis = item.label === "...";
-
-          return (
-            <li key={index} className="flex items-center gap-2">
-              {isEllipsis ? (
-                <Typography variant="small" color="muted">
-                  {item.label}
-                </Typography>
-              ) : item.href || item.path ? (
-                <a
-                  href={item.href || item.path}
-                  className={cn(
-                    "flex items-center gap-1.5 transition-colors",
-                    isLast
-                      ? "text-[var(--color-foreground)] font-bold"
-                      : "text-[var(--color-muted-foreground)] hover:text-[var(--color-foreground)]",
-                  )}
-                  aria-current={isLast ? "page" : undefined}
-                >
-                  {item.icon && <Icon icon={item.icon} size="sm" />}
-                  <Typography
-                    variant="small"
-                    weight={isLast ? "medium" : "normal"}
-                  >
-                    {item.label}
-                  </Typography>
-                </a>
-              ) : (
-                <button
-                  type="button"
-                  onClick={item.onClick}
-                  className={cn(
-                    "flex items-center gap-1.5 transition-colors",
-                    "focus:outline-none focus:ring-2 focus:ring-[var(--color-ring)] focus:ring-offset-2",
-                    isLast
-                      ? "text-[var(--color-foreground)] font-bold cursor-default"
-                      : "text-[var(--color-muted-foreground)] hover:text-[var(--color-foreground)]",
-                  )}
-                  aria-current={isLast ? "page" : undefined}
-                  disabled={isLast}
-                >
-                  {item.icon && <Icon icon={item.icon} size="sm" />}
-                  <Typography
-                    variant="small"
-                    weight={isLast ? "medium" : "normal"}
-                  >
-                    {item.label}
-                  </Typography>
-                </button>
-              )}
-
-              {!isLast && (
-                <Icon
-                  icon={separator}
-                  size="sm"
-                  className="text-[var(--color-muted-foreground)]"
-                />
-              )}
-            </li>
-          );
-        })}
-      </ol>
-    </nav>
-  );
-};
-
-Breadcrumb.displayName = "Breadcrumb";