@almadar/cli 1.0.5 → 1.0.7

package/shells/typescript-shell/packages/client/src/clients/inspection-system/molecules/ParticipantList.tsx

@@ -1,227 +0,0 @@
-/**
- * ParticipantList
- *
- * List of participants in an inspection with add/remove actions.
- * Displays company representatives who participated in the inspection.
- *
- * Event Contract:
- * - Emits: UI:ADD_PARTICIPANT { inspectionId }
- * - Emits: UI:REMOVE_PARTICIPANT { participantId, inspectionId }
- * - Emits: UI:EDIT_PARTICIPANT { participant }
- */
-
-import React, { useCallback } from "react";
-import { cn } from "../../../lib/cn";
-import { Box } from "../../../components/atoms/Box";
-import { VStack, HStack } from "../../../components/atoms/Stack";
-import { Typography } from "../../../components/atoms/Typography";
-import { Button } from "../../../components/atoms/Button";
-import { Card } from "../../../components/atoms/Card";
-import { Avatar } from "../../../components/atoms/Avatar";
-import { Badge } from "../../../components/atoms/Badge";
-import { useEventBus } from "../../../hooks/useEventBus";
-import { Plus, Trash2, Edit, User, Briefcase, Phone } from "lucide-react";
-
-export interface Participant {
-  id: string;
-  name?: string;
-  surname?: string;
-  positionInCompany?: string;
-  contactInfo?: string;
-  addedAt?: string;
-}
-
-export interface ParticipantListProps {
-  /** Inspection ID */
-  inspectionId?: string;
-  /** List of participants */
-  participants: Participant[];
-  /** Allow adding participants */
-  allowAdd?: boolean;
-  /** Allow removing participants */
-  allowRemove?: boolean;
-  /** Allow editing participants */
-  allowEdit?: boolean;
-  /** Minimum required participants */
-  minParticipants?: number;
-  /** Title */
-  title?: string;
-  /** Read-only mode */
-  readOnly?: boolean;
-  /** Additional CSS classes */
-  className?: string;
-  /** Add handler - can receive participant data */
-  onAdd?: (participant?: Participant) => void;
-  /** Remove handler */
-  onRemove?: (participantId: string) => void;
-  /** Edit handler */
-  onEdit?: (participant: Participant) => void;
-}
-
-export const ParticipantList: React.FC<ParticipantListProps> = ({
-  inspectionId,
-  participants,
-  allowAdd = true,
-  allowRemove = true,
-  allowEdit = true,
-  minParticipants = 1,
-  title = "Participants",
-  readOnly = false,
-  className,
-  onAdd,
-  onRemove,
-  onEdit,
-}) => {
-  const eventBus = useEventBus();
-
-  const handleAdd = useCallback(() => {
-    onAdd?.();
-    eventBus.emit("UI:ADD_PARTICIPANT", { inspectionId });
-  }, [inspectionId, onAdd, eventBus]);
-
-  const handleRemove = useCallback(
-    (participantId: string) => {
-      onRemove?.(participantId);
-      eventBus.emit("UI:REMOVE_PARTICIPANT", { participantId, inspectionId });
-    },
-    [inspectionId, onRemove, eventBus],
-  );
-
-  const handleEdit = useCallback(
-    (participant: Participant) => {
-      onEdit?.(participant);
-      eventBus.emit("UI:EDIT_PARTICIPANT", { participant });
-    },
-    [onEdit, eventBus],
-  );
-
-  const canRemove =
-    !readOnly && allowRemove && participants.length > minParticipants;
-
-  return (
-    <VStack gap="md" className={cn("w-full", className)}>
-      {/* Header */}
-      <HStack justify="between" align="center">
-        <HStack gap="sm" align="center">
-          <Typography variant="h4" className="text-neutral-800">
-            {title}
-          </Typography>
-          <Badge variant="default">{participants.length}</Badge>
-        </HStack>
-
-        {!readOnly && allowAdd && (
-          <Button
-            variant="secondary"
-            size="sm"
-            onClick={handleAdd}
-            className="gap-1"
-          >
-            <Plus className="h-4 w-4" />
-            Add Participant
-          </Button>
-        )}
-      </HStack>
-
-      {/* Participant cards */}
-      {participants.length === 0 ? (
-        <Card className="p-6">
-          <VStack align="center" gap="sm" className="text-neutral-400">
-            <User className="h-8 w-8" />
-            <Typography variant="body">No participants added yet</Typography>
-            {!readOnly && allowAdd && (
-              <Button
-                variant="primary"
-                size="sm"
-                onClick={handleAdd}
-                className="gap-1"
-              >
-                <Plus className="h-4 w-4" />
-                Add First Participant
-              </Button>
-            )}
-          </VStack>
-        </Card>
-      ) : (
-        <VStack gap="sm">
-          {participants.map((participant) => (
-            <Card key={participant.id} className="p-4">
-              <HStack justify="between" align="start">
-                <HStack gap="sm" align="start">
-                  <Avatar
-                    name={`${participant.name} ${participant.surname}`}
-                    size="md"
-                  />
-                  <VStack gap="xs">
-                    <Typography
-                      variant="body"
-                      className="font-medium text-neutral-800"
-                    >
-                      {participant.name} {participant.surname}
-                    </Typography>
-                    <HStack
-                      gap="xs"
-                      align="center"
-                      className="text-neutral-500"
-                    >
-                      <Briefcase className="h-3 w-3" />
-                      <Typography variant="small">
-                        {participant.positionInCompany}
-                      </Typography>
-                    </HStack>
-                    {participant.contactInfo && (
-                      <HStack
-                        gap="xs"
-                        align="center"
-                        className="text-neutral-500"
-                      >
-                        <Phone className="h-3 w-3" />
-                        <Typography variant="small">
-                          {participant.contactInfo}
-                        </Typography>
-                      </HStack>
-                    )}
-                  </VStack>
-                </HStack>
-
-                {!readOnly && (
-                  <HStack gap="xs">
-                    {allowEdit && (
-                      <Button
-                        variant="ghost"
-                        size="sm"
-                        onClick={() => handleEdit(participant)}
-                        className="text-neutral-400 hover:text-neutral-600"
-                      >
-                        <Edit className="h-4 w-4" />
-                      </Button>
-                    )}
-                    {canRemove && (
-                      <Button
-                        variant="ghost"
-                        size="sm"
-                        onClick={() => handleRemove(participant.id)}
-                        className="text-red-400 hover:text-red-600"
-                      >
-                        <Trash2 className="h-4 w-4" />
-                      </Button>
-                    )}
-                  </HStack>
-                )}
-              </HStack>
-            </Card>
-          ))}
-        </VStack>
-      )}
-
-      {/* Minimum participants warning */}
-      {participants.length < minParticipants && (
-        <Typography variant="small" className="text-amber-600">
-          At least {minParticipants} participant
-          {minParticipants !== 1 ? "s" : ""} required
-        </Typography>
-      )}
-    </VStack>
-  );
-};
-
-ParticipantList.displayName = "ParticipantList";

package/shells/typescript-shell/packages/client/src/clients/inspection-system/molecules/PhotoAttachment.tsx

@@ -1,276 +0,0 @@
-/**
- * PhotoAttachment
- *
- * Photo capture and display component for inspection evidence.
- * Supports camera capture and file upload.
- *
- * Event Contract:
- * - Emits: UI:PHOTO_CAPTURED { photo, context }
- * - Emits: UI:PHOTO_REMOVED { photoId, context }
- */
-
-import React, { useState, useCallback, useRef } from "react";
-import { cn } from "../../../lib/cn";
-import { Box } from "../../../components/atoms/Box";
-import { VStack, HStack } from "../../../components/atoms/Stack";
-import { Typography } from "../../../components/atoms/Typography";
-import { Button } from "../../../components/atoms/Button";
-import { useEventBus } from "../../../hooks/useEventBus";
-import { Camera, Upload, X, Image, ZoomIn, Trash2 } from "lucide-react";
-
-export interface Photo {
-  id: string;
-  url: string;
-  thumbnail?: string;
-  caption?: string;
-  timestamp?: string;
-}
-
-export interface PhotoAttachmentProps {
-  /** Attached photos */
-  photos?: Photo[];
-  /** Context for events (e.g., ruleId, findingId) */
-  context?: Record<string, string>;
-  /** Maximum photos allowed */
-  maxPhotos?: number;
-  /** Allow camera capture */
-  allowCamera?: boolean;
-  /** Allow file upload */
-  allowUpload?: boolean;
-  /** Read-only mode */
-  readOnly?: boolean;
-  /** Compact mode (thumbnails only) */
-  compact?: boolean;
-  /** Additional CSS classes */
-  className?: string;
-  /** Photo added handler */
-  onPhotoAdded?: (file: File) => void;
-  /** Photo removed handler */
-  onPhotoRemoved?: (photoId: string) => void;
-  /** Photo clicked handler */
-  onPhotoClick?: (photo: Photo) => void;
-}
-
-export const PhotoAttachment: React.FC<PhotoAttachmentProps> = ({
-  photos = [],
-  context = {},
-  maxPhotos = 5,
-  allowCamera = true,
-  allowUpload = true,
-  readOnly = false,
-  compact = false,
-  className,
-  onPhotoAdded,
-  onPhotoRemoved,
-  onPhotoClick,
-}) => {
-  const eventBus = useEventBus();
-  const fileInputRef = useRef<HTMLInputElement>(null);
-  const [previewPhoto, setPreviewPhoto] = useState<Photo | null>(null);
-
-  const canAddMore = photos.length < maxPhotos && !readOnly;
-
-  const handleFileSelect = useCallback(
-    (event: React.ChangeEvent<HTMLInputElement>) => {
-      const files = event.target.files;
-      if (!files || files.length === 0) return;
-
-      const file = files[0];
-      onPhotoAdded?.(file);
-      eventBus.emit("UI:PHOTO_CAPTURED", { photo: file, context });
-
-      // Reset input
-      if (fileInputRef.current) {
-        fileInputRef.current.value = "";
-      }
-    },
-    [context, onPhotoAdded, eventBus]
-  );
-
-  const handleRemove = useCallback(
-    (photoId: string) => {
-      onPhotoRemoved?.(photoId);
-      eventBus.emit("UI:PHOTO_REMOVED", { photoId, context });
-    },
-    [context, onPhotoRemoved, eventBus]
-  );
-
-  const handlePhotoClick = useCallback(
-    (photo: Photo) => {
-      onPhotoClick?.(photo);
-      setPreviewPhoto(photo);
-    },
-    [onPhotoClick]
-  );
-
-  const triggerFileInput = useCallback((capture?: boolean) => {
-    if (fileInputRef.current) {
-      if (capture) {
-        fileInputRef.current.setAttribute("capture", "environment");
-      } else {
-        fileInputRef.current.removeAttribute("capture");
-      }
-      fileInputRef.current.click();
-    }
-  }, []);
-
-  return (
-    <VStack gap="sm" className={cn("w-full", className)}>
-      {/* Photo grid */}
-      {photos.length > 0 && (
-        <Box
-          className={cn(
-            "grid gap-2",
-            compact ? "grid-cols-6" : "grid-cols-3 md:grid-cols-4"
-          )}
-        >
-          {photos.map((photo) => (
-            <Box
-              key={photo.id}
-              rounded="lg"
-              className={cn(
-                "relative group overflow-hidden bg-neutral-100",
-                compact ? "aspect-square" : "aspect-video"
-              )}
-            >
-              <img
-                src={photo.thumbnail || photo.url}
-                alt={photo.caption || "Photo"}
-                className="w-full h-full object-cover cursor-pointer"
-                onClick={() => handlePhotoClick(photo)}
-              />
-
-              {/* Overlay actions */}
-              <Box
-                className={cn(
-                  "absolute inset-0 bg-black/50 opacity-0 group-hover:opacity-100 transition-opacity",
-                  "flex items-center justify-center gap-2"
-                )}
-              >
-                <Button
-                  variant="ghost"
-                  size="sm"
-                  onClick={() => handlePhotoClick(photo)}
-                  className="text-white hover:text-white hover:bg-white/20"
-                >
-                  <ZoomIn className="h-4 w-4" />
-                </Button>
-                {!readOnly && (
-                  <Button
-                    variant="ghost"
-                    size="sm"
-                    onClick={() => handleRemove(photo.id)}
-                    className="text-white hover:text-red-300 hover:bg-white/20"
-                  >
-                    <Trash2 className="h-4 w-4" />
-                  </Button>
-                )}
-              </Box>
-
-              {/* Caption */}
-              {!compact && photo.caption && (
-                <Box
-                  padding="xs"
-                  className="absolute bottom-0 left-0 right-0 bg-black/60"
-                >
-                  <Typography variant="small" className="text-white truncate">
-                    {photo.caption}
-                  </Typography>
-                </Box>
-              )}
-            </Box>
-          ))}
-        </Box>
-      )}
-
-      {/* Add photo buttons */}
-      {canAddMore && (
-        <HStack gap="sm">
-          {/* Hidden file input */}
-          <input
-            ref={fileInputRef}
-            type="file"
-            accept="image/*"
-            onChange={handleFileSelect}
-            className="hidden"
-          />
-
-          {allowCamera && (
-            <Button
-              variant="secondary"
-              size="sm"
-              onClick={() => triggerFileInput(true)}
-              className="gap-1"
-            >
-              <Camera className="h-4 w-4" />
-              {!compact && "Camera"}
-            </Button>
-          )}
-
-          {allowUpload && (
-            <Button
-              variant="secondary"
-              size="sm"
-              onClick={() => triggerFileInput(false)}
-              className="gap-1"
-            >
-              <Upload className="h-4 w-4" />
-              {!compact && "Upload"}
-            </Button>
-          )}
-
-          {photos.length > 0 && (
-            <Typography variant="small" className="text-neutral-500 self-center">
-              {photos.length}/{maxPhotos}
-            </Typography>
-          )}
-        </HStack>
-      )}
-
-      {/* Empty state */}
-      {photos.length === 0 && !canAddMore && (
-        <Box
-          rounded="lg"
-          padding="md"
-          className="bg-neutral-50 border border-dashed border-neutral-300"
-        >
-          <VStack align="center" gap="xs" className="text-neutral-400">
-            <Image className="h-6 w-6" />
-            <Typography variant="small">No photos attached</Typography>
-          </VStack>
-        </Box>
-      )}
-
-      {/* Photo preview modal - simplified */}
-      {previewPhoto && (
-        <Box
-          className="fixed inset-0 z-50 bg-black/80 flex items-center justify-center p-4"
-          onClick={() => setPreviewPhoto(null)}
-        >
-          <Box className="relative max-w-4xl max-h-full">
-            <Button
-              variant="ghost"
-              size="sm"
-              onClick={() => setPreviewPhoto(null)}
-              className="absolute top-2 right-2 text-white hover:bg-white/20"
-            >
-              <X className="h-6 w-6" />
-            </Button>
-            <img
-              src={previewPhoto.url}
-              alt={previewPhoto.caption || "Photo preview"}
-              className="max-w-full max-h-[80vh] object-contain rounded-lg"
-            />
-            {previewPhoto.caption && (
-              <Typography variant="body" className="text-white text-center mt-2">
-                {previewPhoto.caption}
-              </Typography>
-            )}
-          </Box>
-        </Box>
-      )}
-    </VStack>
-  );
-};
-
-PhotoAttachment.displayName = "PhotoAttachment";

package/shells/typescript-shell/packages/client/src/clients/inspection-system/molecules/ProgressHeader.stories.tsx

@@ -1,89 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { ProgressHeader } from "./ProgressHeader";
-
-const meta: Meta<typeof ProgressHeader> = {
-  title: "Clients/Inspection-System/Molecules/ProgressHeader",
-  component: ProgressHeader,
-  parameters: {
-    layout: "padded",
-  },
-  tags: ["autodocs"],
-};
-
-export default meta;
-type Story = StoryObj<typeof ProgressHeader>;
-
-export const Default: Story = {
-  args: {
-    title: "Field Inspection",
-    subtitle: "ABC Company Ltd.",
-    phase: "execution",
-    progress: 45,
-  },
-};
-
-export const WithSteps: Story = {
-  args: {
-    title: "Restaurant Inspection",
-    subtitle: "Golden Dragon Restaurant",
-    phase: "execution",
-    steps: [
-      { id: "1", label: "Preparation", completed: true },
-      { id: "2", label: "Company Info", completed: true },
-      { id: "3", label: "Rule Check", completed: false, current: true },
-      { id: "4", label: "Documentation", completed: false },
-      { id: "5", label: "Signatures", completed: false },
-    ],
-  },
-};
-
-export const Preparation: Story = {
-  args: {
-    title: "New Inspection",
-    subtitle: "Pending company selection",
-    phase: "preparation",
-    progress: 10,
-  },
-};
-
-export const Documentation: Story = {
-  args: {
-    title: "Market Inspection",
-    subtitle: "Fresh Foods Market",
-    phase: "documentation",
-    progress: 75,
-    steps: [
-      { id: "1", label: "Preparation", completed: true },
-      { id: "2", label: "Company Info", completed: true },
-      { id: "3", label: "Rule Check", completed: true },
-      { id: "4", label: "Documentation", completed: false, current: true },
-      { id: "5", label: "Signatures", completed: false },
-    ],
-  },
-};
-
-export const Completed: Story = {
-  args: {
-    title: "Completed Inspection",
-    subtitle: "Tech Solutions Inc.",
-    phase: "completed",
-    progress: 100,
-    steps: [
-      { id: "1", label: "Preparation", completed: true },
-      { id: "2", label: "Company Info", completed: true },
-      { id: "3", label: "Rule Check", completed: true },
-      { id: "4", label: "Documentation", completed: true },
-      { id: "5", label: "Signatures", completed: true },
-    ],
-  },
-};
-
-export const NoSteps: Story = {
-  args: {
-    title: "Quick Inspection",
-    subtitle: "Mobile Food Vendor",
-    phase: "execution",
-    progress: 60,
-    showSteps: false,
-  },
-};