@contractspec/bundle.library 3.7.6 → 3.8.2

package/src/presentation/features/molecules/FeatureHoverPreview/FeatureHoverPreview.tsx

@@ -1,22 +1,21 @@
 'use client';
 
-import * as React from 'react';
+import type { FeatureModuleSpec } from '@contractspec/lib.contracts-spec/features';
 import { StatusChip } from '@contractspec/lib.design-system';
 import { HStack } from '@contractspec/lib.ui-kit-web/ui/stack';
 import {
-  ArrowRight,
-  Layout,
-  Radio,
-  Shield,
-  Tag,
-  Users,
-  Zap,
+	ArrowRight,
+	Layout,
+	Radio,
+	Shield,
+	Tag,
+	Users,
+	Zap,
 } from 'lucide-react';
-import type { FeatureModuleSpec } from '@contractspec/lib.contracts-spec/features';
 
 export interface FeatureHoverPreviewProps {
-  /** The feature to preview */
-  feature: FeatureModuleSpec;
+	/** The feature to preview */
+	feature: FeatureModuleSpec;
 }
 
 /**
@@ -24,120 +23,120 @@ export interface FeatureHoverPreviewProps {
  * Shows detailed stats, capabilities, and tags.
  */
 export function FeatureHoverPreview({ feature }: FeatureHoverPreviewProps) {
-  const { meta, operations, events, presentations, capabilities } = feature;
+	const { meta, operations, events, presentations, capabilities } = feature;
 
-  const hasCapabilities =
-    capabilities?.provides?.length || capabilities?.requires?.length;
+	const hasCapabilities =
+		capabilities?.provides?.length || capabilities?.requires?.length;
 
-  return (
-    <>
-      {/* Description */}
-      {meta.description && (
-        <p className="text-muted-foreground text-sm leading-relaxed">
-          {meta.description}
-        </p>
-      )}
+	return (
+		<>
+			{/* Description */}
+			{meta.description && (
+				<p className="text-muted-foreground text-sm leading-relaxed">
+					{meta.description}
+				</p>
+			)}
 
-      {/* Stats Row */}
-      <HStack gap="md" className="py-2">
-        {operations?.length ? (
-          <div className="flex items-center gap-1.5 text-sm">
-            <Zap className="h-4 w-4 text-amber-500" />
-            <span className="font-medium">{operations.length}</span>
-            <span className="text-muted-foreground">ops</span>
-          </div>
-        ) : null}
-        {events?.length ? (
-          <div className="flex items-center gap-1.5 text-sm">
-            <Radio className="h-4 w-4 text-blue-500" />
-            <span className="font-medium">{events.length}</span>
-            <span className="text-muted-foreground">events</span>
-          </div>
-        ) : null}
-        {presentations?.length ? (
-          <div className="flex items-center gap-1.5 text-sm">
-            <Layout className="h-4 w-4 text-purple-500" />
-            <span className="font-medium">{presentations.length}</span>
-            <span className="text-muted-foreground">views</span>
-          </div>
-        ) : null}
-      </HStack>
+			{/* Stats Row */}
+			<HStack gap="md" className="py-2">
+				{operations?.length ? (
+					<div className="flex items-center gap-1.5 text-sm">
+						<Zap className="h-4 w-4 text-amber-500" />
+						<span className="font-medium">{operations.length}</span>
+						<span className="text-muted-foreground">ops</span>
+					</div>
+				) : null}
+				{events?.length ? (
+					<div className="flex items-center gap-1.5 text-sm">
+						<Radio className="h-4 w-4 text-blue-500" />
+						<span className="font-medium">{events.length}</span>
+						<span className="text-muted-foreground">events</span>
+					</div>
+				) : null}
+				{presentations?.length ? (
+					<div className="flex items-center gap-1.5 text-sm">
+						<Layout className="h-4 w-4 text-purple-500" />
+						<span className="font-medium">{presentations.length}</span>
+						<span className="text-muted-foreground">views</span>
+					</div>
+				) : null}
+			</HStack>
 
-      {/* Capabilities */}
-      {hasCapabilities && (
-        <div className="border-border/50 space-y-1.5 border-t pt-1">
-          {capabilities?.provides?.length ? (
-            <HStack gap="xs" wrap="wrap" className="items-start">
-              <Shield className="mt-0.5 h-3.5 w-3.5 text-emerald-500" />
-              <span className="text-muted-foreground text-xs">Provides:</span>
-              {capabilities.provides.slice(0, 2).map((cap) => (
-                <StatusChip
-                  key={cap.key}
-                  tone="success"
-                  label={cap.key}
-                  size="sm"
-                />
-              ))}
-              {capabilities.provides.length > 2 && (
-                <span className="text-muted-foreground text-xs">
-                  +{capabilities.provides.length - 2}
-                </span>
-              )}
-            </HStack>
-          ) : null}
-          {capabilities?.requires?.length ? (
-            <HStack gap="xs" wrap="wrap" className="items-start">
-              <ArrowRight className="mt-0.5 h-3.5 w-3.5 text-blue-500" />
-              <span className="text-muted-foreground text-xs">Requires:</span>
-              {capabilities.requires.slice(0, 2).map((req) => (
-                <StatusChip
-                  key={req.key}
-                  tone="info"
-                  label={req.key}
-                  size="sm"
-                />
-              ))}
-              {capabilities.requires.length > 2 && (
-                <span className="text-muted-foreground text-xs">
-                  +{capabilities.requires.length - 2}
-                </span>
-              )}
-            </HStack>
-          ) : null}
-        </div>
-      )}
+			{/* Capabilities */}
+			{hasCapabilities && (
+				<div className="space-y-1.5 border-border/50 border-t pt-1">
+					{capabilities?.provides?.length ? (
+						<HStack gap="xs" wrap="wrap" className="items-start">
+							<Shield className="mt-0.5 h-3.5 w-3.5 text-emerald-500" />
+							<span className="text-muted-foreground text-xs">Provides:</span>
+							{capabilities.provides.slice(0, 2).map((cap) => (
+								<StatusChip
+									key={cap.key}
+									tone="success"
+									label={cap.key}
+									size="sm"
+								/>
+							))}
+							{capabilities.provides.length > 2 && (
+								<span className="text-muted-foreground text-xs">
+									+{capabilities.provides.length - 2}
+								</span>
+							)}
+						</HStack>
+					) : null}
+					{capabilities?.requires?.length ? (
+						<HStack gap="xs" wrap="wrap" className="items-start">
+							<ArrowRight className="mt-0.5 h-3.5 w-3.5 text-blue-500" />
+							<span className="text-muted-foreground text-xs">Requires:</span>
+							{capabilities.requires.slice(0, 2).map((req) => (
+								<StatusChip
+									key={req.key}
+									tone="info"
+									label={req.key}
+									size="sm"
+								/>
+							))}
+							{capabilities.requires.length > 2 && (
+								<span className="text-muted-foreground text-xs">
+									+{capabilities.requires.length - 2}
+								</span>
+							)}
+						</HStack>
+					) : null}
+				</div>
+			)}
 
-      {/* Tags */}
-      {meta.tags?.length ? (
-        <HStack
-          gap="xs"
-          wrap="wrap"
-          className="border-border/50 items-center border-t pt-1"
-        >
-          <Tag className="text-muted-foreground h-3.5 w-3.5" />
-          {meta.tags.slice(0, 4).map((tag) => (
-            <span
-              key={tag}
-              className="bg-muted text-muted-foreground rounded px-1.5 py-0.5 text-xs"
-            >
-              #{tag}
-            </span>
-          ))}
-          {meta.tags.length > 4 && (
-            <span className="text-muted-foreground text-xs">
-              +{meta.tags.length - 4}
-            </span>
-          )}
-        </HStack>
-      ) : null}
+			{/* Tags */}
+			{meta.tags?.length ? (
+				<HStack
+					gap="xs"
+					wrap="wrap"
+					className="items-center border-border/50 border-t pt-1"
+				>
+					<Tag className="h-3.5 w-3.5 text-muted-foreground" />
+					{meta.tags.slice(0, 4).map((tag) => (
+						<span
+							key={tag}
+							className="rounded bg-muted px-1.5 py-0.5 text-muted-foreground text-xs"
+						>
+							#{tag}
+						</span>
+					))}
+					{meta.tags.length > 4 && (
+						<span className="text-muted-foreground text-xs">
+							+{meta.tags.length - 4}
+						</span>
+					)}
+				</HStack>
+			) : null}
 
-      {/* Owners */}
-      {meta.owners?.length ? (
-        <HStack gap="xs" className="text-muted-foreground items-center text-xs">
-          <Users className="h-3.5 w-3.5" />
-          <span>{meta.owners.join(', ')}</span>
-        </HStack>
-      ) : null}
-    </>
-  );
+			{/* Owners */}
+			{meta.owners?.length ? (
+				<HStack gap="xs" className="items-center text-muted-foreground text-xs">
+					<Users className="h-3.5 w-3.5" />
+					<span>{meta.owners.join(', ')}</span>
+				</HStack>
+			) : null}
+		</>
+	);
 }

package/src/presentation/features/molecules/FeatureHoverPreview/index.ts

@@ -1,4 +1,4 @@
 export {
-  FeatureHoverPreview,
-  type FeatureHoverPreviewProps,
+	FeatureHoverPreview,
+	type FeatureHoverPreviewProps,
 } from './FeatureHoverPreview';

package/src/presentation/features/molecules/index.ts

@@ -1,13 +1,13 @@
 export { FeatureCard, type FeatureCardProps } from './FeatureCard';
 export {
-  FeatureFiltersBar,
-  type FeatureFiltersBarProps,
+	FeatureCategoryHeader,
+	type FeatureCategoryHeaderProps,
+} from './FeatureCategoryHeader';
+export {
+	FeatureFiltersBar,
+	type FeatureFiltersBarProps,
 } from './FeatureFilters';
 export {
-  FeatureHoverPreview,
-  type FeatureHoverPreviewProps,
+	FeatureHoverPreview,
+	type FeatureHoverPreviewProps,
 } from './FeatureHoverPreview';
-export {
-  FeatureCategoryHeader,
-  type FeatureCategoryHeaderProps,
-} from './FeatureCategoryHeader';

package/src/presentation/features/organisms/FeatureDataViewsList.tsx

@@ -1,33 +1,33 @@
 'use client';
 
+import type { FeatureModuleSpec } from '@contractspec/lib.contracts-spec/features';
 import { EntityCard } from '@contractspec/lib.design-system';
 import { Table } from 'lucide-react';
-import type { FeatureModuleSpec } from '@contractspec/lib.contracts-spec/features';
 import { resolveSerializedDataViewSpec } from '../../../features';
 
 export function FeatureDataViewsList({
-  feature,
+	feature,
 }: {
-  feature: FeatureModuleSpec;
+	feature: FeatureModuleSpec;
 }) {
-  if (!feature.dataViews?.length) return null;
+	if (!feature.dataViews?.length) return null;
 
-  return (
-    <div className="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
-      {feature.dataViews.map((view) => {
-        const spec = resolveSerializedDataViewSpec(view.key, view.version);
+	return (
+		<div className="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
+			{feature.dataViews.map((view) => {
+				const spec = resolveSerializedDataViewSpec(view.key, view.version);
 
-        return (
-          <EntityCard
-            key={view.key}
-            cardTitle={view.key}
-            cardSubtitle={`v${view.version}`}
-            footer={spec?.meta.description}
-            icon={<Table className="h-4 w-4" />}
-            href={`/features/${feature.meta.key}/dataviews/${view.key}`}
-          />
-        );
-      })}
-    </div>
-  );
+				return (
+					<EntityCard
+						key={view.key}
+						cardTitle={view.key}
+						cardSubtitle={`v${view.version}`}
+						footer={spec?.meta.description}
+						icon={<Table className="h-4 w-4" />}
+						href={`/features/${feature.meta.key}/dataviews/${view.key}`}
+					/>
+				);
+			})}
+		</div>
+	);
 }

package/src/presentation/features/organisms/FeatureDetail/FeatureDetail.tsx

@@ -1,20 +1,20 @@
 'use client';
 
 import {
-  StatCard,
-  StatCardGroup,
-  StatusChip,
+	StatCard,
+	StatCardGroup,
+	StatusChip,
 } from '@contractspec/lib.design-system';
 import { Box, HStack, VStack } from '@contractspec/lib.ui-kit-web/ui/stack';
 import { cn } from '@contractspec/lib.ui-kit-web/ui/utils';
-import type { FeatureDetailProps } from './types';
 import Link from 'next/link';
+import type { FeatureDetailProps } from './types';
 
 const stabilityTone = {
-  stable: 'success' as const,
-  beta: 'warning' as const,
-  experimental: 'info' as const,
-  deprecated: 'danger' as const,
+	stable: 'success' as const,
+	beta: 'warning' as const,
+	experimental: 'info' as const,
+	deprecated: 'danger' as const,
 };
 
 /**
@@ -22,89 +22,89 @@ const stabilityTone = {
  * Shows full feature info including operations, events, capabilities, and tags.
  */
 export function FeatureDetail({ feature, className }: FeatureDetailProps) {
-  const { meta, operations, events, presentations, capabilities } = feature;
+	const { meta, operations, events, presentations, capabilities } = feature;
 
-  const tone =
-    stabilityTone[meta.stability as keyof typeof stabilityTone] ?? 'neutral';
+	const tone =
+		stabilityTone[meta.stability as keyof typeof stabilityTone] ?? 'neutral';
 
-  return (
-    <VStack gap="lg" className={cn('w-full', className)}>
-      <HStack gap="sm">
-        <StatusChip tone={tone} label={meta.stability ?? 'unknown'} />
-        <StatusChip tone="neutral" label={meta.key} size="sm" />
-        <StatusChip tone="neutral" label={`v${meta.version}`} size="sm" />
-      </HStack>
+	return (
+		<VStack gap="lg" className={cn('w-full', className)}>
+			<HStack gap="sm">
+				<StatusChip tone={tone} label={meta.stability ?? 'unknown'} />
+				<StatusChip tone="neutral" label={meta.key} size="sm" />
+				<StatusChip tone="neutral" label={`v${meta.version}`} size="sm" />
+			</HStack>
 
-      <StatCardGroup>
-        <Link href={`./${feature.meta.key}/operations`}>
-          <StatCard label="Operations" value={operations?.length ?? 0} />
-        </Link>
-        <Link href={`./${feature.meta.key}/events`}>
-          <StatCard label="Events" value={events?.length ?? 0} />
-        </Link>
-        <Link href={`./${feature.meta.key}/presentations`}>
-          <StatCard label="Presentations" value={presentations?.length ?? 0} />
-        </Link>
-      </StatCardGroup>
+			<StatCardGroup>
+				<Link href={`./${feature.meta.key}/operations`}>
+					<StatCard label="Operations" value={operations?.length ?? 0} />
+				</Link>
+				<Link href={`./${feature.meta.key}/events`}>
+					<StatCard label="Events" value={events?.length ?? 0} />
+				</Link>
+				<Link href={`./${feature.meta.key}/presentations`}>
+					<StatCard label="Presentations" value={presentations?.length ?? 0} />
+				</Link>
+			</StatCardGroup>
 
-      {capabilities?.provides?.length ? (
-        <Box className="flex-col rounded-lg border p-4" gap="sm" align="start">
-          <span className="font-semibold">Provides Capabilities</span>
-          <HStack gap="xs" wrap="wrap">
-            {capabilities.provides.map((cap) => (
-              <StatusChip
-                key={`${cap.key}-${cap.version}`}
-                tone="success"
-                label={`${cap.key} v${cap.version}`}
-                size="sm"
-              />
-            ))}
-          </HStack>
-        </Box>
-      ) : null}
+			{capabilities?.provides?.length ? (
+				<Box className="flex-col rounded-lg border p-4" gap="sm" align="start">
+					<span className="font-semibold">Provides Capabilities</span>
+					<HStack gap="xs" wrap="wrap">
+						{capabilities.provides.map((cap) => (
+							<StatusChip
+								key={`${cap.key}-${cap.version}`}
+								tone="success"
+								label={`${cap.key} v${cap.version}`}
+								size="sm"
+							/>
+						))}
+					</HStack>
+				</Box>
+			) : null}
 
-      {capabilities?.requires?.length ? (
-        <Box className="flex-col rounded-lg border p-4" gap="sm" align="start">
-          <span className="font-semibold">Requires Capabilities</span>
-          <HStack gap="xs" wrap="wrap">
-            {capabilities.requires.map((req) => (
-              <StatusChip
-                key={req.key}
-                tone="info"
-                label={`${req.key}${req.version ? ` v${req.version}` : ''}${req.optional ? ' (optional)' : ''}`}
-                size="sm"
-              />
-            ))}
-          </HStack>
-        </Box>
-      ) : null}
+			{capabilities?.requires?.length ? (
+				<Box className="flex-col rounded-lg border p-4" gap="sm" align="start">
+					<span className="font-semibold">Requires Capabilities</span>
+					<HStack gap="xs" wrap="wrap">
+						{capabilities.requires.map((req) => (
+							<StatusChip
+								key={req.key}
+								tone="info"
+								label={`${req.key}${req.version ? ` v${req.version}` : ''}${req.optional ? ' (optional)' : ''}`}
+								size="sm"
+							/>
+						))}
+					</HStack>
+				</Box>
+			) : null}
 
-      {meta.tags?.length ? (
-        <Box className="flex-col rounded-lg border p-4" gap="sm" align="start">
-          <span className="font-semibold">Tags</span>
-          <HStack gap="xs" wrap="wrap">
-            {meta.tags.map((tag) => (
-              <StatusChip
-                key={tag}
-                tone="neutral"
-                label={`#${tag}`}
-                size="sm"
-              />
-            ))}
-          </HStack>
-        </Box>
-      ) : null}
+			{meta.tags?.length ? (
+				<Box className="flex-col rounded-lg border p-4" gap="sm" align="start">
+					<span className="font-semibold">Tags</span>
+					<HStack gap="xs" wrap="wrap">
+						{meta.tags.map((tag) => (
+							<StatusChip
+								key={tag}
+								tone="neutral"
+								label={`#${tag}`}
+								size="sm"
+							/>
+						))}
+					</HStack>
+				</Box>
+			) : null}
 
-      {meta.owners?.length ? (
-        <Box className="flex-col rounded-lg border p-4" gap="sm" align="start">
-          <span className="font-semibold">Owners</span>
-          <HStack gap="xs" wrap="wrap">
-            {meta.owners.map((owner) => (
-              <StatusChip key={owner} tone="neutral" label={owner} size="sm" />
-            ))}
-          </HStack>
-        </Box>
-      ) : null}
-    </VStack>
-  );
+			{meta.owners?.length ? (
+				<Box className="flex-col rounded-lg border p-4" gap="sm" align="start">
+					<span className="font-semibold">Owners</span>
+					<HStack gap="xs" wrap="wrap">
+						{meta.owners.map((owner) => (
+							<StatusChip key={owner} tone="neutral" label={owner} size="sm" />
+						))}
+					</HStack>
+				</Box>
+			) : null}
+		</VStack>
+	);
 }

package/src/presentation/features/organisms/FeatureDetail/types.ts

@@ -1,8 +1,8 @@
 import type { FeatureModuleSpec } from '@contractspec/lib.contracts-spec/features';
 
 export interface FeatureDetailProps {
-  /** The feature to display. */
-  feature: FeatureModuleSpec;
-  /** Additional class name. */
-  className?: string;
+	/** The feature to display. */
+	feature: FeatureModuleSpec;
+	/** Additional class name. */
+	className?: string;
 }