@shepai/cli 1.59.0 → 1.61.0

package/dist/src/presentation/web/components/common/tech-decisions-review/tech-decisions-review.stories.d.ts

@@ -4,7 +4,7 @@ import { TechDecisionsDrawer } from './tech-decisions-drawer.js';
 declare const meta: Meta<typeof TechDecisionsReview>;
 export default meta;
 type Story = StoryObj<typeof TechDecisionsReview>;
-/** Default — scrollable list of decisions taken. */
+/** Default — scrollable list of decisions taken. "Other Options Considered" toggle plays expand/collapse sounds. */
 export declare const Default: Story;
 /** Processing state — approve button disabled. */
 export declare const Processing: Story;

package/dist/src/presentation/web/components/common/tech-decisions-review/tech-decisions-review.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tech-decisions-review.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/tech-decisions-review/tech-decisions-review.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AA0C9D,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,mBAAmB,CAc1C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAElD,oDAAoD;AACpD,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,kDAAkD;AAClD,eAAO,MAAM,UAAU,EAAE,KAMxB,CAAC;AAEF,uBAAuB;AACvB,eAAO,MAAM,cAAc,EAAE,KAM5B,CAAC;AAEF,8BAA8B;AAC9B,eAAO,MAAM,cAAc,EAAE,KAM5B,CAAC;AAIF,KAAK,WAAW,GAAG,QAAQ,CAAC,OAAO,mBAAmB,CAAC,CAAC;AA8BxD,uCAAuC;AACvC,eAAO,MAAM,QAAQ,EAAE,WAWtB,CAAC;AAEF,yCAAyC;AACzC,eAAO,MAAM,gBAAgB,EAAE,WAY9B,CAAC;AAEF,wDAAwD;AACxD,eAAO,MAAM,aAAa,EAAE,WAa3B,CAAC;AAIF,kDAAkD;AAClD,eAAO,MAAM,gBAAgB,EAAE,KAM9B,CAAC;AAEF,iFAAiF;AACjF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC"}
+{"version":3,"file":"tech-decisions-review.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/tech-decisions-review/tech-decisions-review.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AA0C9D,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,mBAAmB,CAc1C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAElD,oHAAoH;AACpH,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,kDAAkD;AAClD,eAAO,MAAM,UAAU,EAAE,KAMxB,CAAC;AAEF,uBAAuB;AACvB,eAAO,MAAM,cAAc,EAAE,KAM5B,CAAC;AAEF,8BAA8B;AAC9B,eAAO,MAAM,cAAc,EAAE,KAM5B,CAAC;AAIF,KAAK,WAAW,GAAG,QAAQ,CAAC,OAAO,mBAAmB,CAAC,CAAC;AA8BxD,uCAAuC;AACvC,eAAO,MAAM,QAAQ,EAAE,WAWtB,CAAC;AAEF,yCAAyC;AACzC,eAAO,MAAM,gBAAgB,EAAE,WAY9B,CAAC;AAEF,wDAAwD;AACxD,eAAO,MAAM,aAAa,EAAE,WAa3B,CAAC;AAIF,kDAAkD;AAClD,eAAO,MAAM,gBAAgB,EAAE,KAM9B,CAAC;AAEF,iFAAiF;AACjF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC"}

package/dist/src/presentation/web/components/common/tech-decisions-review/tech-decisions-review.stories.js

@@ -47,7 +47,7 @@ const meta = {
     ],
 };
 export default meta;
-/** Default — scrollable list of decisions taken. */
+/** Default — scrollable list of decisions taken. "Other Options Considered" toggle plays expand/collapse sounds. */
 export const Default = {
     args: {
         data: mockData,

package/dist/src/presentation/web/components/common/theme-toggle/theme-toggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/theme-toggle/theme-toggle.tsx"],"names":[],"mappings":"AAMA,wBAAgB,WAAW,4CAyB1B"}
+{"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/theme-toggle/theme-toggle.tsx"],"names":[],"mappings":"AAOA,wBAAgB,WAAW,4CAsC1B"}

package/dist/src/presentation/web/components/common/theme-toggle/theme-toggle.js

@@ -3,9 +3,22 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Moon, Sun } from 'lucide-react';
 import { Button } from '../../ui/button.js';
 import { useTheme } from '../../../hooks/useTheme.js';
+import { useSoundAction } from '../../../hooks/use-sound-action.js';
 export function ThemeToggle() {
     const { theme, resolvedTheme, setTheme } = useTheme();
+    const toggleOnSound = useSoundAction('toggle-on');
+    const toggleOffSound = useSoundAction('toggle-off');
     const toggleTheme = () => {
+        // Determine target theme before switching
+        const currentResolved = theme === 'system' ? resolvedTheme : theme;
+        const goingToDark = currentResolved !== 'dark';
+        // Play sound before setTheme for immediate feedback
+        if (goingToDark) {
+            toggleOnSound.play();
+        }
+        else {
+            toggleOffSound.play();
+        }
         // If system theme, switch to explicit light/dark
         // If explicit, toggle between light and dark
         if (theme === 'system') {

package/dist/src/presentation/web/components/common/theme-toggle/theme-toggle.stories.d.ts

@@ -3,6 +3,8 @@ import { ThemeToggle } from './theme-toggle.js';
 declare const meta: Meta<typeof ThemeToggle>;
 export default meta;
 type Story = StoryObj<typeof meta>;
+/** Default — click to toggle theme. Plays toggle-on (dark) or toggle-off (light) sound. */
 export declare const Default: Story;
+/** In context with label. Sounds play on each toggle click. */
 export declare const InContext: Story;
 //# sourceMappingURL=theme-toggle.stories.d.ts.map

package/dist/src/presentation/web/components/common/theme-toggle/theme-toggle.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme-toggle.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/theme-toggle/theme-toggle.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAOlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAOvB,CAAC"}
+{"version":3,"file":"theme-toggle.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/theme-toggle/theme-toggle.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAOlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,2FAA2F;AAC3F,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,+DAA+D;AAC/D,eAAO,MAAM,SAAS,EAAE,KAOvB,CAAC"}

package/dist/src/presentation/web/components/common/theme-toggle/theme-toggle.stories.js

@@ -9,9 +9,11 @@ const meta = {
     tags: ['autodocs'],
 };
 export default meta;
+/** Default — click to toggle theme. Plays toggle-on (dark) or toggle-off (light) sound. */
 export const Default = {
     render: () => _jsx(ThemeToggle, {}),
 };
+/** In context with label. Sounds play on each toggle click. */
 export const InContext = {
     render: () => (_jsxs("div", { className: "flex items-center gap-4 rounded-lg border p-4", children: [_jsx("span", { className: "text-muted-foreground text-sm", children: "Toggle theme:" }), _jsx(ThemeToggle, {})] })),
 };

package/dist/src/presentation/web/components/features/control-center/control-center-inner.js

@@ -14,7 +14,7 @@ import { PrdQuestionnaireDrawer } from '../../common/prd-questionnaire/index.js'
 import { TechDecisionsDrawer } from '../../common/tech-decisions-review/index.js';
 import { MergeReviewDrawer } from '../../common/merge-review/index.js';
 import { NotificationPermissionBanner } from '../../common/notification-permission-banner/index.js';
-import { useSound } from '../../../hooks/use-sound.js';
+import { useSoundAction } from '../../../hooks/use-sound-action.js';
 import { ControlCenterEmptyState } from './control-center-empty-state.js';
 import { useControlCenterState } from './use-control-center-state.js';
 export function ControlCenterInner({ initialNodes, initialEdges }) {
@@ -43,7 +43,7 @@ export function ControlCenterInner({ initialNodes, initialEdges }) {
     const [isLoadingQuestionnaire, setIsLoadingQuestionnaire] = useState(false);
     // Reject state (shared by both drawers)
     const [isRejecting, setIsRejecting] = useState(false);
-    const rejectSound = useSound('caution', { volume: 0.5 });
+    const rejectSound = useSoundAction('reject');
     // Tech decisions drawer state
     const [techDecisionsData, setTechDecisionsData] = useState(null);
     const [isLoadingTechDecisions, setIsLoadingTechDecisions] = useState(false);

package/dist/src/presentation/web/components/features/control-center/use-control-center-state.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-control-center-state.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/use-control-center-state.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACxE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACtF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,EAAmB,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAYhF,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,YAAY,EAAE,eAAe,GAAG,IAAI,CAAC;IACrC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,qBAAqB,EAAE,MAAM,CAAC;IAC9B,4EAA4E;IAC5E,sBAAsB,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3C,aAAa,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC;IAC/D,aAAa,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IAChD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,eAAe,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACzE,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,sBAAsB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,yBAAyB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,mBAAmB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,YAAY,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;IACnD,yBAAyB,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAChE,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D,sBAAsB,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAChE,UAAU,EAAE,OAAO,CAAC;IACpB,iBAAiB,EAAE,CACjB,YAAY,EAAE,MAAM,GAAG,IAAI,EAC3B,YAAY,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,KACpC,MAAM,CAAC;IACZ,iBAAiB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAChD;AAID,wBAAgB,qBAAqB,CACnC,YAAY,EAAE,cAAc,EAAE,EAC9B,YAAY,EAAE,IAAI,EAAE,GACnB,kBAAkB,CAgtBpB"}
+{"version":3,"file":"use-control-center-state.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/control-center/use-control-center-state.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACxE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACtF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,EAAmB,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAYhF,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,YAAY,EAAE,eAAe,GAAG,IAAI,CAAC;IACrC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,qBAAqB,EAAE,MAAM,CAAC;IAC9B,4EAA4E;IAC5E,sBAAsB,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3C,aAAa,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC;IAC/D,aAAa,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IAChD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,eAAe,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACzE,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,sBAAsB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,yBAAyB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,mBAAmB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,YAAY,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;IACnD,yBAAyB,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAChE,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D,sBAAsB,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAChE,UAAU,EAAE,OAAO,CAAC;IACpB,iBAAiB,EAAE,CACjB,YAAY,EAAE,MAAM,GAAG,IAAI,EAC3B,YAAY,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,KACpC,MAAM,CAAC;IACZ,iBAAiB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAChD;AAID,wBAAgB,qBAAqB,CACnC,YAAY,EAAE,cAAc,EAAE,EAC9B,YAAY,EAAE,IAAI,EAAE,GACnB,kBAAkB,CA2sBpB"}

package/dist/src/presentation/web/components/features/control-center/use-control-center-state.js

@@ -9,7 +9,7 @@ import { deleteFeature } from '../../../app/actions/delete-feature.js';
 import { addRepository } from '../../../app/actions/add-repository.js';
 import { deleteRepository } from '../../../app/actions/delete-repository.js';
 import { useAgentEventsContext } from '../../../hooks/agent-events-provider.js';
-import { useSound } from '../../../hooks/use-sound.js';
+import { useSoundAction } from '../../../hooks/use-sound-action.js';
 import { mapEventTypeToState, mapPhaseNameToLifecycle, } from '../../common/feature-node/derive-feature-state.js';
 let nextFeatureId = 0;
 export function useControlCenterState(initialNodes, initialEdges) {
@@ -30,9 +30,9 @@ export function useControlCenterState(initialNodes, initialEdges) {
     const [selectedNode, setSelectedNode] = useState(null);
     const [isCreateDrawerOpen, setIsCreateDrawerOpen] = useState(false);
     const [isDeleting, setIsDeleting] = useState(false);
-    const deleteSound = useSound('transition_down', { volume: 0.5 });
-    const createSound = useSound('transition_up', { volume: 0.5 });
-    const clickSound = useSound('tap_01', { volume: 0.3 });
+    const deleteSound = useSoundAction('delete');
+    const createSound = useSoundAction('create');
+    const clickSound = useSoundAction('click');
     const [pendingRepoNodeId, setPendingRepoNodeId] = useState(null);
     // Sync server props into local state when router.refresh() delivers new data
     const initialNodeKey = initialNodes
@@ -189,14 +189,9 @@ export function useControlCenterState(initialNodes, initialEdges) {
     const onNodesChange = useCallback((changes) => {
         setNodes((ns) => applyNodeChanges(changes, ns));
     }, []);
-    const closeSound = useSound('transition_down', { volume: 0.01 });
     const clearSelection = useCallback(() => {
-        setSelectedNode((prev) => {
-            if (prev)
-                closeSound.play();
-            return null;
-        });
-    }, [closeSound]);
+        setSelectedNode(null);
+    }, []);
     const handleNodeClick = useCallback((_event, node) => {
         if (node.type === 'featureNode') {
             const data = node.data;
@@ -395,10 +390,9 @@ export function useControlCenterState(initialNodes, initialEdges) {
         });
     }, [router, createFeatureNode, pendingRepoNodeId, createSound, pendingParentFeatureId, setEdges]);
     const closeCreateDrawer = useCallback(() => {
-        closeSound.play();
         setIsCreateDrawerOpen(false);
         setPendingParentFeatureId(undefined);
-    }, [closeSound]);
+    }, []);
     const handleDeleteFeature = useCallback(async (featureId) => {
         setIsDeleting(true);
         try {

package/dist/src/presentation/web/components/features/skills/category-filter.d.ts

@@ -0,0 +1,8 @@
+import type { SkillCategory } from '../../../lib/skills.js';
+export interface CategoryFilterProps {
+    activeCategory: SkillCategory | null;
+    onCategoryChange: (category: SkillCategory | null) => void;
+    counts?: Record<SkillCategory, number>;
+}
+export declare function CategoryFilter({ activeCategory, onCategoryChange, counts }: CategoryFilterProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=category-filter.d.ts.map

package/dist/src/presentation/web/components/features/skills/category-filter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"category-filter.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/skills/category-filter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAUlD,MAAM,WAAW,mBAAmB;IAClC,cAAc,EAAE,aAAa,GAAG,IAAI,CAAC;IACrC,gBAAgB,EAAE,CAAC,QAAQ,EAAE,aAAa,GAAG,IAAI,KAAK,IAAI,CAAC;IAC3D,MAAM,CAAC,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;CACxC;AAED,wBAAgB,cAAc,CAAC,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,EAAE,EAAE,mBAAmB,2CAkB/F"}

package/dist/src/presentation/web/components/features/skills/category-filter.js

@@ -0,0 +1,12 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Button } from '../../ui/button.js';
+const CATEGORIES = [
+    { label: 'All', value: null },
+    { label: 'Workflow', value: 'Workflow' },
+    { label: 'Code Generation', value: 'Code Generation' },
+    { label: 'Analysis', value: 'Analysis' },
+    { label: 'Reference', value: 'Reference' },
+];
+export function CategoryFilter({ activeCategory, onCategoryChange, counts }) {
+    return (_jsx("div", { className: "flex flex-wrap gap-2", role: "group", "aria-label": "Filter by category", children: CATEGORIES.map(({ label, value }) => (_jsxs(Button, { variant: activeCategory === value ? 'default' : 'outline', size: "sm", onClick: () => onCategoryChange(value), children: [label, counts && value ? (_jsxs("span", { className: "ml-1 text-xs opacity-70", children: ["(", counts[value], ")"] })) : null] }, label))) }));
+}

package/dist/src/presentation/web/components/features/skills/category-filter.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { CategoryFilter } from './category-filter.js';
+declare const meta: Meta<typeof CategoryFilter>;
+export default meta;
+type Story = StoryObj<typeof CategoryFilter>;
+export declare const AllSelected: Story;
+export declare const WorkflowSelected: Story;
+export declare const WithCounts: Story;
+//# sourceMappingURL=category-filter.stories.d.ts.map

package/dist/src/presentation/web/components/features/skills/category-filter.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"category-filter.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/skills/category-filter.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGnD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,cAAc,CAOrC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,cAAc,CAAC,CAAC;AAqB7C,eAAO,MAAM,WAAW,EAAE,KAEzB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAE9B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAYxB,CAAC"}

package/dist/src/presentation/web/components/features/skills/category-filter.stories.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { CategoryFilter } from './category-filter.js';
+const meta = {
+    title: 'Features/CategoryFilter',
+    component: CategoryFilter,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'padded',
+    },
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Interactive wrapper — manages activeCategory state
+ * ------------------------------------------------------------------------- */
+function InteractiveCategoryFilter({ initial, counts, }) {
+    const [active, setActive] = useState(initial);
+    return _jsx(CategoryFilter, { activeCategory: active, onCategoryChange: setActive, counts: counts });
+}
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+export const AllSelected = {
+    render: () => _jsx(InteractiveCategoryFilter, { initial: null }),
+};
+export const WorkflowSelected = {
+    render: () => _jsx(InteractiveCategoryFilter, { initial: "Workflow" }),
+};
+export const WithCounts = {
+    render: () => (_jsx(InteractiveCategoryFilter, { initial: null, counts: {
+            Workflow: 8,
+            'Code Generation': 1,
+            Analysis: 2,
+            Reference: 7,
+        } })),
+};

package/dist/src/presentation/web/components/features/skills/index.d.ts

@@ -0,0 +1,6 @@
+export { SkillsPageClient, type SkillsPageClientProps } from './skills-page-client.js';
+export { SkillCard, type SkillCardProps } from './skill-card.js';
+export { CategoryFilter, type CategoryFilterProps } from './category-filter.js';
+export { SkillList, type SkillListProps } from './skill-list.js';
+export { SkillDetailDrawer, type SkillDetailDrawerProps } from './skill-detail-drawer.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/presentation/web/components/features/skills/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/skills/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AACpF,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7E,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,uBAAuB,CAAC"}

package/dist/src/presentation/web/components/features/skills/index.js

@@ -0,0 +1,5 @@
+export { SkillsPageClient } from './skills-page-client.js';
+export { SkillCard } from './skill-card.js';
+export { CategoryFilter } from './category-filter.js';
+export { SkillList } from './skill-list.js';
+export { SkillDetailDrawer } from './skill-detail-drawer.js';

package/dist/src/presentation/web/components/features/skills/skill-card.d.ts

@@ -0,0 +1,7 @@
+import type { SkillData } from '../../../lib/skills.js';
+export interface SkillCardProps {
+    skill: SkillData;
+    onSelect: (skill: SkillData) => void;
+}
+export declare function SkillCard({ skill, onSelect }: SkillCardProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=skill-card.d.ts.map

package/dist/src/presentation/web/components/features/skills/skill-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-card.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/skills/skill-card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG9C,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACtC;AAED,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,cAAc,2CAqC5D"}

package/dist/src/presentation/web/components/features/skills/skill-card.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, CardContent, CardHeader, CardTitle } from '../../ui/card.js';
+import { Badge } from '../../ui/badge.js';
+import { FolderOpen } from 'lucide-react';
+export function SkillCard({ skill, onSelect }) {
+    return (_jsxs(Card, { className: "hover:border-primary/50 cursor-pointer transition-colors", role: "button", tabIndex: 0, onClick: () => onSelect(skill), onKeyDown: (e) => {
+            if (e.key === 'Enter' || e.key === ' ') {
+                e.preventDefault();
+                onSelect(skill);
+            }
+        }, "data-testid": `skill-card-${skill.name}`, children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: skill.displayName }), _jsx("p", { className: "text-muted-foreground font-mono text-xs", children: skill.name })] }), _jsxs(CardContent, { className: "space-y-3", children: [_jsx("p", { className: "text-muted-foreground line-clamp-2 text-sm", children: skill.description }), _jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [_jsx(Badge, { variant: skill.source === 'project' ? 'secondary' : 'outline', children: skill.source === 'project' ? 'Project' : 'Global' }), skill.context ? _jsx(Badge, { variant: "outline", children: skill.context }) : null, skill.allowedTools ? _jsx(Badge, { variant: "outline", children: "Tools" }) : null, skill.resources.length > 0 ? (_jsxs("span", { className: "text-muted-foreground inline-flex items-center gap-1 text-xs", children: [_jsx(FolderOpen, { className: "size-3" }), skill.resources.length, " ", skill.resources.length === 1 ? 'resource' : 'resources'] })) : null] })] })] }));
+}

package/dist/src/presentation/web/components/features/skills/skill-card.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { SkillCard } from './skill-card.js';
+declare const meta: Meta<typeof SkillCard>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const WithContext: Story;
+export declare const WithAllBadges: Story;
+export declare const ProjectSource: Story;
+export declare const GlobalSource: Story;
+//# sourceMappingURL=skill-card.stories.d.ts.map

package/dist/src/presentation/web/components/features/skills/skill-card.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-card.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/skills/skill-card.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAUhC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AA0DnC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAIzB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAI3B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAI3B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAI1B,CAAC"}

package/dist/src/presentation/web/components/features/skills/skill-card.stories.js

@@ -0,0 +1,88 @@
+import { fn } from '@storybook/test';
+import { SkillCard } from './skill-card.js';
+const meta = {
+    title: 'Features/SkillCard',
+    component: SkillCard,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'centered',
+    },
+    args: {
+        onSelect: fn(),
+    },
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Data fixtures
+ * ------------------------------------------------------------------------- */
+const baseSkill = {
+    name: 'shep-kit:implement',
+    displayName: 'implement',
+    description: 'Validate specs and autonomously execute implementation tasks with status tracking.',
+    category: 'Workflow',
+    source: 'project',
+    body: '## Usage\n\nRun /shep-kit:implement after planning is complete.',
+    resources: [],
+};
+const skillWithAllBadges = {
+    name: 'shep:ui-component',
+    displayName: 'ui-component',
+    description: 'Use when creating, modifying, or reviewing web UI components. Triggers include "new component", "add component", "create UI".',
+    context: 'fork',
+    allowedTools: 'Read, Write, Bash, Edit, Glob',
+    category: 'Code Generation',
+    source: 'project',
+    body: '## Overview\n\nScaffolds UI components following the four-tier hierarchy.',
+    resources: [
+        { name: 'references', fileCount: 7 },
+        { name: 'templates', fileCount: 3 },
+        { name: 'rules', fileCount: 2 },
+    ],
+};
+const globalSkill = {
+    name: 'vercel-react-best-practices',
+    displayName: 'vercel-react-best-practices',
+    description: 'React and Next.js performance optimization guidelines from Vercel Engineering.',
+    category: 'Reference',
+    source: 'global',
+    body: 'Performance patterns for React and Next.js applications.',
+    resources: [{ name: 'references', fileCount: 4 }],
+};
+const skillWithContext = {
+    name: 'architecture-reviewer',
+    displayName: 'architecture-reviewer',
+    description: 'Use when making architectural decisions, planning features, or reviewing PRs.',
+    context: 'fork',
+    category: 'Analysis',
+    source: 'project',
+    body: '',
+    resources: [],
+};
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+export const Default = {
+    args: {
+        skill: baseSkill,
+    },
+};
+export const WithContext = {
+    args: {
+        skill: skillWithContext,
+    },
+};
+export const WithAllBadges = {
+    args: {
+        skill: skillWithAllBadges,
+    },
+};
+export const ProjectSource = {
+    args: {
+        skill: baseSkill,
+    },
+};
+export const GlobalSource = {
+    args: {
+        skill: globalSkill,
+    },
+};

package/dist/src/presentation/web/components/features/skills/skill-detail-drawer.d.ts

@@ -0,0 +1,7 @@
+import type { SkillData } from '../../../lib/skills.js';
+export interface SkillDetailDrawerProps {
+    skill: SkillData | null;
+    onClose: () => void;
+}
+export declare function SkillDetailDrawer({ skill, onClose }: SkillDetailDrawerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=skill-detail-drawer.d.ts.map

package/dist/src/presentation/web/components/features/skills/skill-detail-drawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-detail-drawer.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/skills/skill-detail-drawer.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,SAAS,GAAG,IAAI,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,sBAAsB,2CA+E3E"}

package/dist/src/presentation/web/components/features/skills/skill-detail-drawer.js

@@ -0,0 +1,13 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetDescription, } from '../../ui/sheet.js';
+import { Badge } from '../../ui/badge.js';
+import { ScrollArea } from '../../ui/scroll-area.js';
+import { Separator } from '../../ui/separator.js';
+import { FolderOpen } from 'lucide-react';
+export function SkillDetailDrawer({ skill, onClose }) {
+    return (_jsx(Sheet, { open: skill !== null, onOpenChange: (open) => {
+            if (!open)
+                onClose();
+        }, children: _jsx(SheetContent, { side: "right", className: "w-full sm:max-w-lg", children: skill ? (_jsxs(_Fragment, { children: [_jsxs(SheetHeader, { children: [_jsx(SheetTitle, { children: skill.displayName }), _jsx(SheetDescription, { children: skill.name })] }), _jsxs(ScrollArea, { className: "flex-1 px-4 pb-4", children: [_jsx("p", { className: "text-muted-foreground text-sm", children: skill.description }), _jsxs("div", { className: "mt-4 flex flex-wrap items-center gap-1.5", children: [_jsx(Badge, { variant: skill.source === 'project' ? 'secondary' : 'outline', children: skill.source === 'project' ? 'Project' : 'Global' }), _jsx(Badge, { variant: "outline", children: skill.category }), skill.context ? _jsx(Badge, { variant: "outline", children: skill.context }) : null] }), skill.allowedTools ? (_jsxs(_Fragment, { children: [_jsx(Separator, { className: "my-4" }), _jsxs("div", { children: [_jsx("h3", { className: "text-sm font-semibold", children: "Allowed Tools" }), _jsx("p", { className: "text-muted-foreground mt-1 text-sm", children: skill.allowedTools })] })] })) : null, skill.resources.length > 0 ? (_jsxs(_Fragment, { children: [_jsx(Separator, { className: "my-4" }), _jsxs("div", { children: [_jsx("h3", { className: "text-sm font-semibold", children: "Resources" }), _jsx("ul", { className: "mt-2 space-y-1.5", children: skill.resources.map((resource) => (_jsxs("li", { className: "text-muted-foreground flex items-center gap-2 text-sm", children: [_jsx(FolderOpen, { className: "size-3.5 shrink-0" }), _jsxs("span", { children: [resource.name, "/ \u2014 ", resource.fileCount, ' ', resource.fileCount === 1 ? 'file' : 'files'] })] }, resource.name))) })] })] })) : null, skill.body ? (_jsxs(_Fragment, { children: [_jsx(Separator, { className: "my-4" }), _jsx("pre", { className: "text-muted-foreground text-sm leading-relaxed whitespace-pre-wrap", children: skill.body })] })) : null] })] })) : null }) }));
+}

package/dist/src/presentation/web/components/features/skills/skill-detail-drawer.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { SkillDetailDrawer } from './skill-detail-drawer.js';
+declare const meta: Meta<typeof SkillDetailDrawer>;
+export default meta;
+type Story = StoryObj<typeof SkillDetailDrawer>;
+export declare const Open: Story;
+export declare const WithResources: Story;
+export declare const WithoutResources: Story;
+export declare const MinimalSkill: Story;
+//# sourceMappingURL=skill-detail-drawer.stories.d.ts.map

package/dist/src/presentation/web/components/features/skills/skill-detail-drawer.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-detail-drawer.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/skills/skill-detail-drawer.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAI1D,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,iBAAiB,CAOxC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAiEhD,eAAO,MAAM,IAAI,EAAE,KAElB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAE9B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAE1B,CAAC"}

package/dist/src/presentation/web/components/features/skills/skill-detail-drawer.stories.js

@@ -0,0 +1,71 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { SkillDetailDrawer } from './skill-detail-drawer.js';
+import { Button } from '../../ui/button.js';
+const meta = {
+    title: 'Features/SkillDetailDrawer',
+    component: SkillDetailDrawer,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'fullscreen',
+    },
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Data fixtures
+ * ------------------------------------------------------------------------- */
+const skillWithResources = {
+    name: 'shep:ui-component',
+    displayName: 'ui-component',
+    description: 'Use when creating, modifying, or reviewing web UI components. Triggers include "new component", "add component", "create UI", "build a widget".',
+    context: 'fork',
+    allowedTools: 'Read, Write, Bash, Edit, Glob, Grep',
+    category: 'Code Generation',
+    source: 'project',
+    body: '## Overview\n\nScaffolds UI components following the four-tier hierarchy.\n\n## Usage\n\nRun /shep:ui-component when you need to create or modify components.',
+    resources: [
+        { name: 'references', fileCount: 7 },
+        { name: 'templates', fileCount: 3 },
+        { name: 'rules', fileCount: 2 },
+    ],
+};
+const skillWithoutResources = {
+    name: 'shep-kit:implement',
+    displayName: 'implement',
+    description: 'Validate specs and autonomously execute implementation tasks with status tracking. Use after /shep-kit:plan when ready to start implementation.',
+    category: 'Workflow',
+    source: 'project',
+    body: '## Usage\n\nRun /shep-kit:implement after planning is complete to start autonomous implementation.\n\n## What it does\n\n1. Pre-Implementation Validation Gate\n2. Autonomous Execution\n3. Status Tracking',
+    resources: [],
+};
+const minimalSkill = {
+    name: 'find-skills',
+    displayName: 'find-skills',
+    description: 'Helps users discover and install agent skills.',
+    category: 'Reference',
+    source: 'global',
+    body: '',
+    resources: [],
+};
+/* ---------------------------------------------------------------------------
+ * Trigger wrapper — starts closed, click to open
+ * ------------------------------------------------------------------------- */
+function DrawerTrigger({ skill, label }) {
+    const [selected, setSelected] = useState(null);
+    return (_jsxs("div", { className: "flex h-screen items-start p-4", children: [_jsx(Button, { variant: "outline", onClick: () => setSelected(skill), children: label }), _jsx(SkillDetailDrawer, { skill: selected, onClose: () => setSelected(null) })] }));
+}
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+export const Open = {
+    render: () => _jsx(DrawerTrigger, { skill: skillWithResources, label: "Open Skill Detail" }),
+};
+export const WithResources = {
+    render: () => _jsx(DrawerTrigger, { skill: skillWithResources, label: "Open With Resources" }),
+};
+export const WithoutResources = {
+    render: () => _jsx(DrawerTrigger, { skill: skillWithoutResources, label: "Open Without Resources" }),
+};
+export const MinimalSkill = {
+    render: () => _jsx(DrawerTrigger, { skill: minimalSkill, label: "Open Minimal Skill" }),
+};

package/dist/src/presentation/web/components/features/skills/skill-list.d.ts

@@ -0,0 +1,7 @@
+import type { SkillData } from '../../../lib/skills.js';
+export interface SkillListProps {
+    skills: SkillData[];
+    onSkillSelect: (skill: SkillData) => void;
+}
+export declare function SkillList({ skills, onSkillSelect }: SkillListProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=skill-list.d.ts.map

package/dist/src/presentation/web/components/features/skills/skill-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-list.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/skills/skill-list.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,cAAc,CAAC;AAI7D,MAAM,WAAW,cAAc;IAC7B,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CAC3C;AAYD,wBAAgB,SAAS,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,EAAE,cAAc,2CA2BlE"}

package/dist/src/presentation/web/components/features/skills/skill-list.js

@@ -0,0 +1,21 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { SkillCard } from './skill-card.js';
+const CATEGORY_ORDER = ['Workflow', 'Code Generation', 'Analysis', 'Reference'];
+function groupByCategory(skills) {
+    const groups = new Map();
+    for (const skill of skills) {
+        const group = groups.get(skill.category) ?? [];
+        group.push(skill);
+        groups.set(skill.category, group);
+    }
+    return groups;
+}
+export function SkillList({ skills, onSkillSelect }) {
+    const groups = groupByCategory(skills);
+    return (_jsx("div", { className: "space-y-8", children: CATEGORY_ORDER.map((category) => {
+            const categorySkills = groups.get(category);
+            if (!categorySkills || categorySkills.length === 0)
+                return null;
+            return (_jsxs("section", { children: [_jsxs("h2", { className: "mb-4 text-lg font-semibold", children: [category, ' ', _jsxs("span", { className: "text-muted-foreground text-sm font-normal", children: ["(", categorySkills.length, ")"] })] }), _jsx("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3", children: categorySkills.map((skill) => (_jsx(SkillCard, { skill: skill, onSelect: onSkillSelect }, skill.name))) })] }, category));
+        }) }));
+}

package/dist/src/presentation/web/components/features/skills/skill-list.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { SkillList } from './skill-list.js';
+declare const meta: Meta<typeof SkillList>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const SingleCategory: Story;
+export declare const Empty: Story;
+//# sourceMappingURL=skill-list.stories.d.ts.map

package/dist/src/presentation/web/components/features/skills/skill-list.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-list.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/skills/skill-list.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAUhC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAwGnC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAI5B,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAInB,CAAC"}