@ryuenn3123/agentic-senior-core 2.0.5 → 2.0.8

package/.agent-context/skills/frontend/motion.md

@@ -1,67 +1,67 @@
-# Motion Design and Implementation
-
-Tier: EXPERT
-
-Motion is part of product behavior. It should clarify state changes, guide focus, and provide feedback without reducing accessibility or performance.
-
-## Motion Intent Model
-
-Use motion only for one of these intents:
-- Transition intent: communicate screen or state transition.
-- Feedback intent: confirm user action success/failure.
-- Focus intent: direct attention to newly relevant content.
-
-If a transition has no intent, remove it.
-
-## Timing and Consistency
-
-Adopt a small timing scale and reuse it across the product:
-- Fast: 120ms for micro-feedback.
-- Standard: 200ms to 260ms for component transitions.
-- Slow: 320ms to 420ms for route transitions.
-
-Avoid mixing unrelated easing curves in one flow.
-
-## Performance-Safe Animation Rules
-
-Prefer animating properties that do not trigger expensive layout and paint work:
-- Preferred: transform, opacity.
-- Avoid for frequent animation: top, left, width, height, box-shadow blur radius.
-
-Use CSS containment and selective `will-change` only for elements that actually animate.
-
-## Reduced Motion Compliance
-
-Always implement reduced-motion fallback:
-
-```css
-.panel {
-	transition: transform 220ms ease, opacity 220ms ease;
-}
-
-@media (prefers-reduced-motion: reduce) {
-	.panel {
-		transition: none;
-	}
-}
-```
-
-## Interaction Patterns
-
-Recommended patterns:
-- Enter/exit fade + translate for dialogs.
-- Staggered list reveal for scannability on load.
-- Subtle press/hover feedback for actionable controls.
-
-Avoid these patterns:
-- Continuous decorative motion on primary content.
-- Multiple competing animations in one viewport.
-- Looping movement that can distract reading flow.
-
-## Review Checklist
-
-- [ ] Every animation has explicit product intent.
-- [ ] Timing scale is consistent across components.
-- [ ] Heavy layout-triggering properties are avoided.
-- [ ] Reduced-motion mode is implemented and tested.
+# Motion Design and Implementation
+
+Tier: EXPERT
+
+Motion is part of product behavior. It should clarify state changes, guide focus, and provide feedback without reducing accessibility or performance.
+
+## Motion Intent Model
+
+Use motion only for one of these intents:
+- Transition intent: communicate screen or state transition.
+- Feedback intent: confirm user action success/failure.
+- Focus intent: direct attention to newly relevant content.
+
+If a transition has no intent, remove it.
+
+## Timing and Consistency
+
+Adopt a small timing scale and reuse it across the product:
+- Fast: 120ms for micro-feedback.
+- Standard: 200ms to 260ms for component transitions.
+- Slow: 320ms to 420ms for route transitions.
+
+Avoid mixing unrelated easing curves in one flow.
+
+## Performance-Safe Animation Rules
+
+Prefer animating properties that do not trigger expensive layout and paint work:
+- Preferred: transform, opacity.
+- Avoid for frequent animation: top, left, width, height, box-shadow blur radius.
+
+Use CSS containment and selective `will-change` only for elements that actually animate.
+
+## Reduced Motion Compliance
+
+Always implement reduced-motion fallback:
+
+```css
+.panel {
+	transition: transform 220ms ease, opacity 220ms ease;
+}
+
+@media (prefers-reduced-motion: reduce) {
+	.panel {
+		transition: none;
+	}
+}
+```
+
+## Interaction Patterns
+
+Recommended patterns:
+- Enter/exit fade + translate for dialogs.
+- Staggered list reveal for scannability on load.
+- Subtle press/hover feedback for actionable controls.
+
+Avoid these patterns:
+- Continuous decorative motion on primary content.
+- Multiple competing animations in one viewport.
+- Looping movement that can distract reading flow.
+
+## Review Checklist
+
+- [ ] Every animation has explicit product intent.
+- [ ] Timing scale is consistent across components.
+- [ ] Heavy layout-triggering properties are avoided.
+- [ ] Reduced-motion mode is implemented and tested.
 - [ ] Motion does not block keyboard or screen-reader flow.

package/.agent-context/skills/frontend/package.json

@@ -0,0 +1,5 @@
+{
+  "name": "@agentic-skills/frontend",
+  "version": "1.0.0",
+  "author": "agentic"
+}

package/.agent-context/skills/frontend/performance.md

@@ -1,63 +1,63 @@
-# Frontend Performance Engineering
-
-Tier: EXPERT
-
-Performance work should be evidence-driven. Start with baseline metrics, optimize where bottlenecks are proven, then verify that user-facing indicators improved.
-
-## Core Metrics
-
-Track Core Web Vitals in CI and release checks:
-- LCP target: less than 2.5s on reference environments.
-- INP target: less than 200ms.
-- CLS target: less than 0.1.
-
-Also track bundle size and script execution time for key routes.
-
-## Render Efficiency
-
-Common controls:
-- Keep expensive computation outside render path with memoization.
-- Use stable callbacks for memoized child components.
-- Split large component trees by feature boundary.
-
-```javascript
-const visibleRows = useMemo(() => {
-	return allRows.filter((row) => row.isVisible);
-}, [allRows]);
-
-const handleRowOpen = useCallback((rowId) => {
-	openRowDetails(rowId);
-}, [openRowDetails]);
-```
-
-## Network and Caching Strategy
-
-- Treat server state separately from UI state.
-- Use query caching with explicit stale policies.
-- Avoid duplicate API calls by keying requests consistently.
-
-For route transitions, prefetch data for likely next navigation paths.
-
-## Bundle Governance
-
-Use route and component-level code splitting:
-- Lazy-load non-critical routes.
-- Defer optional heavy modules until needed.
-- Audit bundle growth at each release.
-
-Set a budget and fail CI on unapproved bundle-size regressions.
-
-## Diagnostics Workflow
-
-1. Capture baseline profile and web-vitals report.
-2. Apply one optimization change.
-3. Re-profile and compare deltas.
-4. Keep only changes with measurable improvement.
-
-## Review Checklist
-
-- [ ] Core metrics targets are monitored and reported.
-- [ ] Render-heavy paths are profiled with tooling evidence.
-- [ ] Data fetching uses cache and deduplication strategy.
-- [ ] Bundle-size budget is defined and enforced.
+# Frontend Performance Engineering
+
+Tier: EXPERT
+
+Performance work should be evidence-driven. Start with baseline metrics, optimize where bottlenecks are proven, then verify that user-facing indicators improved.
+
+## Core Metrics
+
+Track Core Web Vitals in CI and release checks:
+- LCP target: less than 2.5s on reference environments.
+- INP target: less than 200ms.
+- CLS target: less than 0.1.
+
+Also track bundle size and script execution time for key routes.
+
+## Render Efficiency
+
+Common controls:
+- Keep expensive computation outside render path with memoization.
+- Use stable callbacks for memoized child components.
+- Split large component trees by feature boundary.
+
+```javascript
+const visibleRows = useMemo(() => {
+	return allRows.filter((row) => row.isVisible);
+}, [allRows]);
+
+const handleRowOpen = useCallback((rowId) => {
+	openRowDetails(rowId);
+}, [openRowDetails]);
+```
+
+## Network and Caching Strategy
+
+- Treat server state separately from UI state.
+- Use query caching with explicit stale policies.
+- Avoid duplicate API calls by keying requests consistently.
+
+For route transitions, prefetch data for likely next navigation paths.
+
+## Bundle Governance
+
+Use route and component-level code splitting:
+- Lazy-load non-critical routes.
+- Defer optional heavy modules until needed.
+- Audit bundle growth at each release.
+
+Set a budget and fail CI on unapproved bundle-size regressions.
+
+## Diagnostics Workflow
+
+1. Capture baseline profile and web-vitals report.
+2. Apply one optimization change.
+3. Re-profile and compare deltas.
+4. Keep only changes with measurable improvement.
+
+## Review Checklist
+
+- [ ] Core metrics targets are monitored and reported.
+- [ ] Render-heavy paths are profiled with tooling evidence.
+- [ ] Data fetching uses cache and deduplication strategy.
+- [ ] Bundle-size budget is defined and enforced.
 - [ ] Performance regressions are blocked until reviewed.

package/.agent-context/skills/frontend/responsive-delivery.md

@@ -0,0 +1,41 @@
+# Responsive Delivery
+
+Tier: ADVANCE
+
+Responsive delivery is not just resizing components. It defines how information hierarchy, interaction ergonomics, and loading behavior adapt across screen classes.
+
+## Breakpoint Contract
+
+Define a small set of supported breakpoints and explicitly map each critical screen to layout behavior:
+
+- Mobile baseline for primary one-handed flows.
+- Tablet landscape/portrait handling for mixed navigation density.
+- Desktop behavior for dense data views and power-user shortcuts.
+
+## Hierarchy and Readability
+
+- Keep primary value proposition and main action in first viewport.
+- Promote one primary CTA and one secondary CTA at most on conversion screens.
+- Prevent layout shift when optional content loads asynchronously.
+- Keep typography scaling consistent with design tokens.
+
+## Interaction Ergonomics
+
+- Maintain touch target minimum sizes for mobile.
+- Preserve keyboard navigability on desktop and tablet keyboard scenarios.
+- Avoid hover-only critical interactions.
+- Ensure sticky bars and bottom sheets do not hide required form controls.
+
+## Validation Workflow
+
+1. Capture screenshots for each breakpoint from the same scenario.
+2. Execute keyboard and pointer flow checks on critical journeys.
+3. Verify loading, empty, and error states for each breakpoint class.
+4. Attach responsive evidence to release artifact bundle.
+
+## Review Checklist
+
+- [ ] Breakpoint behavior is documented per critical screen.
+- [ ] Primary CTA remains clear on all supported viewports.
+- [ ] Touch and keyboard interactions are both functional.
+- [ ] Loading and error states preserve layout stability.

package/.agent-context/skills/frontend/tests/.gitkeep

@@ -0,0 +1 @@
+# Frontend skill test fixtures placeholder

package/.agent-context/skills/frontend/ui-architecture.md

@@ -1,128 +1,128 @@
-# Component Architecture and State Management
-
-**Tier:** EXPERT | **Source:** awesome-copilot (smart/dumb) + minimax (design systems) + antigravity (React patterns)
-
-## Purpose
-
-UI architecture decides how state, behavior, and presentation are split. Good structure reduces re-render churn, keeps component boundaries stable, and makes features easier to test.
-
-## Part 1: Smart and Dumb Separation
-
-A smart component owns data flow, side effects, and orchestration. A dumb component renders input and emits events.
-
-```javascript
-function PaymentFormContainer() {
-  const [amount, setAmount] = useState('');
-  const [status, setStatus] = useState('idle');
-  const [errorMessage, setErrorMessage] = useState(null);
-
-  const handleSubmit = async (submittedAmount) => {
-    setStatus('loading');
-    try {
-      const response = await fetch('/api/payments', {
-        method: 'POST',
-        body: JSON.stringify({ amount: submittedAmount })
-      });
-
-      if (!response.ok) {
-        throw new Error('Payment request failed');
-      }
-
-      setStatus('success');
-    } catch (caughtError) {
-      setErrorMessage(caughtError.message);
-      setStatus('error');
-    }
-  };
-
-  return (
-    <PaymentFormView
-      amount={amount}
-      isLoading={status === 'loading'}
-      errorMessage={errorMessage}
-      onAmountChange={setAmount}
-      onSubmit={handleSubmit}
-    />
-  );
-}
-```
-
-```javascript
-function PaymentFormView({ amount, isLoading, errorMessage, onAmountChange, onSubmit }) {
-  return (
-    <form onSubmit={(event) => { event.preventDefault(); onSubmit(amount); }}>
-      <input
-        value={amount}
-        onChange={(event) => onAmountChange(event.target.value)}
-        disabled={isLoading}
-      />
-      <button disabled={isLoading}>
-        {isLoading ? 'Processing' : 'Pay'}
-      </button>
-      {errorMessage ? <p>{errorMessage}</p> : null}
-    </form>
-  );
-}
-```
-
-## Part 2: State Ownership Rules
-
-Use the smallest useful state scope.
-
-- Local component state: form fields, toggles, ephemeral UI state.
-- Shared UI state: theme, sidebar state, modal visibility.
-- Server state: remote data, caching, invalidation, refetching.
-- Derived state: compute from existing data instead of duplicating it.
-
-Recommended mapping:
-- `useState` for local state.
-- `Zustand` or context for global UI state.
-- `TanStack Query` for server state.
-- Avoid context for high-frequency server data when query caching is the better fit.
-
-## Part 3: Composition and Contracts
-
-A component contract should define what it accepts, what it renders, and what events it emits.
-
-```javascript
-interface ButtonProps {
-  variant?: 'primary' | 'secondary' | 'danger';
-  size?: 'small' | 'medium' | 'large';
-  disabled?: boolean;
-  loading?: boolean;
-  onClick: () => void;
-  children: React.ReactNode;
-}
-```
-
-Keep public component APIs stable. If the component grows many optional props, split it into smaller feature-specific components instead of adding more flags.
-
-## Part 4: Anti-Patterns
-
-- Prop drilling across many levels.
-- Global context for everything.
-- Mixing network calls into presentational views.
-- Repeating derived values in both state and render.
-- Reaching into another feature's internals instead of using the feature public API.
-
-## Part 5: Design System Integration
-
-Design tokens should drive spacing, color, and sizing. Avoid one-off values unless the design system explicitly allows them.
-
-```javascript
-const buttonStyles = {
-  primary: 'bg-primary text-on-primary',
-  secondary: 'bg-surface text-primary',
-  danger: 'bg-danger text-on-danger'
-};
-```
-
-## Review Checklist
-
-- [ ] Smart and dumb layers are separated.
-- [ ] State ownership is minimal and deliberate.
-- [ ] Server state uses a cache-aware tool.
-- [ ] Component contracts are explicit and stable.
-- [ ] Feature boundaries are respected.
-- [ ] Design tokens are used consistently.
-- [ ] Prop drilling does not replace composition or shared state.
+# Component Architecture and State Management
+
+**Tier:** EXPERT | **Source:** awesome-copilot (smart/dumb) + minimax (design systems) + antigravity (React patterns)
+
+## Purpose
+
+UI architecture decides how state, behavior, and presentation are split. Good structure reduces re-render churn, keeps component boundaries stable, and makes features easier to test.
+
+## Part 1: Smart and Dumb Separation
+
+A smart component owns data flow, side effects, and orchestration. A dumb component renders input and emits events.
+
+```javascript
+function PaymentFormContainer() {
+  const [amount, setAmount] = useState('');
+  const [status, setStatus] = useState('idle');
+  const [errorMessage, setErrorMessage] = useState(null);
+
+  const handleSubmit = async (submittedAmount) => {
+    setStatus('loading');
+    try {
+      const response = await fetch('/api/payments', {
+        method: 'POST',
+        body: JSON.stringify({ amount: submittedAmount })
+      });
+
+      if (!response.ok) {
+        throw new Error('Payment request failed');
+      }
+
+      setStatus('success');
+    } catch (caughtError) {
+      setErrorMessage(caughtError.message);
+      setStatus('error');
+    }
+  };
+
+  return (
+    <PaymentFormView
+      amount={amount}
+      isLoading={status === 'loading'}
+      errorMessage={errorMessage}
+      onAmountChange={setAmount}
+      onSubmit={handleSubmit}
+    />
+  );
+}
+```
+
+```javascript
+function PaymentFormView({ amount, isLoading, errorMessage, onAmountChange, onSubmit }) {
+  return (
+    <form onSubmit={(event) => { event.preventDefault(); onSubmit(amount); }}>
+      <input
+        value={amount}
+        onChange={(event) => onAmountChange(event.target.value)}
+        disabled={isLoading}
+      />
+      <button disabled={isLoading}>
+        {isLoading ? 'Processing' : 'Pay'}
+      </button>
+      {errorMessage ? <p>{errorMessage}</p> : null}
+    </form>
+  );
+}
+```
+
+## Part 2: State Ownership Rules
+
+Use the smallest useful state scope.
+
+- Local component state: form fields, toggles, ephemeral UI state.
+- Shared UI state: theme, sidebar state, modal visibility.
+- Server state: remote data, caching, invalidation, refetching.
+- Derived state: compute from existing data instead of duplicating it.
+
+Recommended mapping:
+- `useState` for local state.
+- `Zustand` or context for global UI state.
+- `TanStack Query` for server state.
+- Avoid context for high-frequency server data when query caching is the better fit.
+
+## Part 3: Composition and Contracts
+
+A component contract should define what it accepts, what it renders, and what events it emits.
+
+```javascript
+interface ButtonProps {
+  variant?: 'primary' | 'secondary' | 'danger';
+  size?: 'small' | 'medium' | 'large';
+  disabled?: boolean;
+  loading?: boolean;
+  onClick: () => void;
+  children: React.ReactNode;
+}
+```
+
+Keep public component APIs stable. If the component grows many optional props, split it into smaller feature-specific components instead of adding more flags.
+
+## Part 4: Anti-Patterns
+
+- Prop drilling across many levels.
+- Global context for everything.
+- Mixing network calls into presentational views.
+- Repeating derived values in both state and render.
+- Reaching into another feature's internals instead of using the feature public API.
+
+## Part 5: Design System Integration
+
+Design tokens should drive spacing, color, and sizing. Avoid one-off values unless the design system explicitly allows them.
+
+```javascript
+const buttonStyles = {
+  primary: 'bg-primary text-on-primary',
+  secondary: 'bg-surface text-primary',
+  danger: 'bg-danger text-on-danger'
+};
+```
+
+## Review Checklist
+
+- [ ] Smart and dumb layers are separated.
+- [ ] State ownership is minimal and deliberate.
+- [ ] Server state uses a cache-aware tool.
+- [ ] Component contracts are explicit and stable.
+- [ ] Feature boundaries are respected.
+- [ ] Design tokens are used consistently.
+- [ ] Prop drilling does not replace composition or shared state.

package/.agent-context/skills/frontend.md

@@ -1,30 +1,36 @@
-# Frontend Skill Pack
-
-Default tier: `advance`
-
-## Purpose
-Deliver frontend experiences that are visually intentional, accessible, and efficient.
-
-## In Scope
-- UI architecture and component composition
-- Responsive layouts and breakpoints
-- Motion, animation, and interaction polish
-- Accessibility and keyboard flows
-- Conversion clarity and onboarding flow
-
-## Must-Have Checks
-- Feature-driven folder structure
-- Smart and dumb component separation
-- Server state and client state separation
-- Reduced-motion fallback
-- Accessibility baseline pass
-- Responsive behavior verified on mobile and desktop
-
-## Evidence
-- Usability audit result
-- Visual regression output
-- Accessibility checklist result
-- Release notes for motion and interaction changes
-
-## Fallback
+# Frontend Skill Pack
+
+Default tier: `advance`
+
+## Purpose
+Deliver frontend experiences that are visually intentional, accessible, and efficient.
+
+## In Scope
+- UI architecture and component composition
+- Responsive layouts and breakpoints
+- Motion, animation, and interaction polish
+- Accessibility and keyboard flows
+- Conversion clarity and onboarding flow
+- Performance budgets and render diagnostics
+- Release evidence for visual and interaction quality
+
+## Must-Have Checks
+- Feature-driven folder structure
+- Smart and dumb component separation
+- Server state and client state separation
+- Reduced-motion fallback
+- Accessibility baseline pass
+- Responsive behavior verified on mobile and desktop
+- First viewport communicates value proposition and primary action clearly
+- Error and empty states provide explicit next actions
+- Performance budget and regression thresholds are documented per release
+
+## Evidence
+- Usability audit result
+- Visual regression output
+- Accessibility checklist result
+- Release notes for motion and interaction changes
+- Performance trend snapshot and remediation notes when regressions occur
+
+## Fallback
 - If a feature cannot meet the advance tier, ship standard mode only as a temporary compatibility path.

package/.agent-context/skills/fullstack/.evidence/compatibility-manifest.json

@@ -0,0 +1,9 @@
+{
+  "schemaVersion": "compatibility-manifest-v1",
+  "artifactType": "skill-domain-evidence",
+  "domain": "fullstack",
+  "ides": ["cursor", "windsurf", "copilot", "gemini", "claude", "codex", "cline"],
+  "nodeMin": "18",
+  "platforms": ["windows", "linux", "macos"],
+  "validatedAt": "2026-04-11T12:00:00Z"
+}

package/.agent-context/skills/fullstack/.evidence/sbom-excerpt.json

@@ -0,0 +1,6 @@
+{
+  "format": "cyclonedx",
+  "component": "@agentic-skills/fullstack",
+  "version": "1.0.0",
+  "dependencies": []
+}

package/.agent-context/skills/fullstack/.evidence/test-report.json

@@ -0,0 +1,8 @@
+{
+  "passed": true,
+  "total": 18,
+  "failed": 0,
+  "skipped": 0,
+  "durationMs": 1600,
+  "lastRun": "2026-04-11T12:00:00Z"
+}

package/.agent-context/skills/fullstack/CHANGELOG.md

@@ -0,0 +1,7 @@
+---
+tier: production
+---
+# Changelog
+## 1.0.0
+- Expanded fullstack skill depth with release coordination guidance.
+- Added evidence bundle metadata for trust-tier verification.