Core changes: - Add @defgroup/@ingroup to 1791 C2+ contracts (555 files) for HCA 128× pre-training DSA grouping - Add §0.1 Pre-Training Frequency matrix to semantics-core - Add §VIII Attention Architecture rules (ATTN_1-4) with MLA/CSA/HCA/DSA mechanics - Add @defgroup/@ingroup to canonical syntax (§II) and all contract examples Agent prompts (5 files): - Add ZERO-STATE RATIONALE with MLA/CSA/HCA/DSA compression mechanics - Add pre-training note: @RATIONALE/@REJECTED are in-context learned tags - svelte-coder: add missing #region contract, fix Svelte rule violations - python-coder/fullstack-coder: honor function contracts from speckit plan - qa-tester: add attention compliance audit (P3 ATTN_1-4 checks) Skills (6 files): - Translate all axiom_config descriptions to English - Fix doc_dirs to index .opencode/ and .specify/ - Deduplicate 5× complexity_rules → single global_tags catalog - Reduce semantics-svelte 591→485 lines (remove duplicate code blocks) - Fix semantics-testing: 'Short IDs' → 'Short hierarchical IDs' - Fix all examples: flat IDs → hierarchical Domain.Name format - Fix Svelte examples: replace raw Tailwind + <button> with semantic tokens + /ui Speckit workflow (commands + templates): - speckit.plan: add Function-Level Contracts for C3+ with @PRE/@POST/@TEST_EDGE - speckit.plan: add Attention Compliance Gate (ATTN_1-4 before contract generation) - speckit.tasks: add function contract inlining format (constraints in task description) - speckit.specify: load semantics-core for spec density rules - spec-template: add #region contract, @SEMANTICS grouping, hierarchical IDs - ux-reference-template: add #region wrapper - plan-template: add attention gate, @defgroup/@ingroup guidance - tasks-template: add attention audit + rebuild + orphan check tasks - constitution.md: translate to English, add Principle VIII (attention-optimized contracts) Reference modules rewritten (hierarchical IDs + full contracts): - Auth.Jwt: 6 child contracts with @RATIONALE/@REJECTED/@TEST_EDGE - Api.Auth: 5 endpoints with @TEST_EDGE + molecular CoT markers - Migration.Model: @defgroup Migration with 18 @ACTION + 6 @INVARIANT Scripts: - add_defgroup_ingroup.py: zero-risk additive @ingroup migration (1791 insertions) - migrate_hierarchical.py: flat→hierarchical ID dry-run analysis (792 contracts) - merge_prompts.py: merge all prompts/skills/commands into one review file Config: - axiom_config.yaml: 749→395 lines (-47%), English, doc_dirs include prompts - Fix test_datasets.py import collision (rename → test_datasets_routes.py) - Fix test_preview.py: SupersetClient→get_superset_client, AsyncMock, logger f-string
78 lines
3.0 KiB
Svelte
78 lines
3.0 KiB
Svelte
<!-- #region Button [C:2] [TYPE Component] [SEMANTICS button, variant, loading, interactive, atom] -->
|
|
<!-- @ingroup UI -->
|
|
<!-- @BRIEF Standardized button component with primary/secondary/destructive/ghost variants and loading state. @variant "danger" is a deprecated alias for "destructive". -->
|
|
<!-- @LAYER UI -->
|
|
<!-- @UX_STATE Idle -> Button renders with requested variant, interactive. -->
|
|
<!-- @UX_STATE Loading -> Spinner replaces leading area, interaction disabled. -->
|
|
<!--
|
|
@SEMANTICS: button, ui-atom, interactive
|
|
@PURPOSE: Standardized button component with variants and loading states.
|
|
@LAYER Atom
|
|
@RELATION DEPENDS_ON -> [EXT:frontend:Utils]
|
|
|
|
@UX_STATE: Idle -> Button renders with the requested variant and remains interactive.
|
|
@UX_STATE: Loading -> Spinner replaces the leading area and interaction is disabled.
|
|
|
|
@INVARIANT: Always uses Tailwind for styling.
|
|
@INVARIANT: Supports accessible labels and keyboard navigation.
|
|
-->
|
|
|
|
<script lang="ts">
|
|
// [SECTION: IMPORTS]
|
|
import { cn } from '$lib/utils.js';
|
|
// [/SECTION: IMPORTS]
|
|
|
|
// [SECTION: PROPS]
|
|
/**
|
|
* @purpose Define component interface and default values (Svelte 5 Runes).
|
|
*/
|
|
let {
|
|
variant = 'primary',
|
|
size = 'md',
|
|
isLoading = false,
|
|
disabled = false,
|
|
type = /** @type {'button' | 'submit' | 'reset'} */ ('button'),
|
|
class: className = '',
|
|
children,
|
|
onclick = undefined,
|
|
...rest
|
|
} = $props();
|
|
// [/SECTION: PROPS]
|
|
|
|
const baseStyles = 'inline-flex items-center justify-center font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 rounded-md';
|
|
|
|
const variants = {
|
|
primary: 'bg-primary text-white hover:bg-primary-hover focus-visible:ring-primary-ring',
|
|
secondary: 'bg-secondary text-secondary-text hover:bg-secondary-hover focus-visible:ring-secondary-ring',
|
|
destructive: 'bg-destructive text-white hover:bg-destructive-hover focus-visible:ring-destructive-ring',
|
|
danger: 'bg-destructive text-white hover:bg-destructive-hover focus-visible:ring-destructive-ring', // DEPRECATED alias — prefer "destructive"
|
|
ghost: 'bg-transparent hover:bg-ghost-hover text-ghost-text focus-visible:ring-ghost-ring',
|
|
};
|
|
|
|
const sizes = {
|
|
sm: 'h-8 px-3 text-xs',
|
|
md: 'h-10 px-4 py-2 text-sm',
|
|
lg: 'h-12 px-6 text-base',
|
|
};
|
|
</script>
|
|
|
|
<!-- [SECTION: TEMPLATE] -->
|
|
<button
|
|
{type}
|
|
class={cn(baseStyles, variants[variant], sizes[size], className)}
|
|
disabled={disabled || isLoading}
|
|
{onclick}
|
|
{...rest}
|
|
>
|
|
{#if isLoading}
|
|
<svg class="animate-spin -ml-1 mr-2 h-4 w-4 text-current" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
|
|
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
|
|
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
|
|
</svg>
|
|
{/if}
|
|
{@render children?.()}
|
|
</button>
|
|
<!-- [/SECTION: TEMPLATE] -->
|
|
|
|
<!-- #endregion Button -->
|