courthive-components 3.0.1 → 3.2.0

package/README.md

@@ -18,13 +18,13 @@ This library provides a comprehensive set of UI components for building tourname
 ## Installation
 
 ```bash
-npm install courthive-components
-# or
-yarn add courthive-components
-# or
 pnpm add courthive-components
 ```
 
+(External consumers may also use `npm install courthive-components` or
+`yarn add courthive-components`. Inside the CourtHive monorepo,
+pnpm is the only supported manager.)
+
 ## Quick Start
 
 ```javascript

package/dist/components/ladderChart/index.d.ts

@@ -0,0 +1,2 @@
+export { buildLadderChart } from './ladderChart';
+export type { LadderChartDatum, LadderChartConfig, LadderChartMargins, LadderChartInstance, } from './types';

package/dist/components/ladderChart/ladderChart.d.ts

@@ -0,0 +1,2 @@
+import { LadderChartConfig, LadderChartInstance } from './types';
+export declare function buildLadderChart(container: HTMLElement, initialConfig: LadderChartConfig): LadderChartInstance;

package/dist/components/ladderChart/types.d.ts

@@ -0,0 +1,72 @@
+/**
+ * LadderChart — public types.
+ *
+ * Visualizes a player's (or any subject's) ordinal progression across a
+ * time series. Each datum places a mark at (date, rung), connected
+ * chronologically by an optional line.
+ *
+ * Originally a D3v3 "Ladder chart" in tennisvisuals. Rewritten for
+ * D3v7 + TypeScript + the courthive-components vanilla-component
+ * pattern (returns SVG element via factory function; no framework).
+ */
+export interface LadderChartDatum {
+    /** Mark X position. Pass a Date or an ISO-8601 string. */
+    date: Date | string;
+    /** Mark Y position: 0-based index into `rungs[]`. 0 is the bottom rung. */
+    rung: number;
+    /** Optional mark color override (CSS color string). Falls back to `markColor`. */
+    color?: string;
+    /** Optional mark radius override (px). Falls back to `markRadius`. */
+    radius?: number;
+    /** Optional label for the mark (used in tooltip/aria). Examples: tournament name. */
+    label?: string;
+    /** Optional secondary label (used in tooltip body). Examples: result string. */
+    detail?: string;
+    /** Arbitrary attached data, forwarded to onClick/onHover callbacks. */
+    meta?: Record<string, unknown>;
+}
+export interface LadderChartMargins {
+    top?: number;
+    right?: number;
+    bottom?: number;
+    left?: number;
+}
+export interface LadderChartConfig {
+    /** Ordinal rung labels, ordered bottom → top. Example: ['R128','R64','R32','R16','QF','SF','F','W']. */
+    rungs: string[];
+    /** Mark data. May be unsorted; the renderer sorts by date for the connector. */
+    data: LadderChartDatum[];
+    /** Chart width in px. Defaults to container's clientWidth (or 600). */
+    width?: number;
+    /** Chart height in px. Defaults to 240. */
+    height?: number;
+    margins?: LadderChartMargins;
+    /** Optional chart title rendered above the plot. */
+    title?: string;
+    /** Optional subtitle / source text rendered below the plot. */
+    source?: string;
+    /** Draw a connector line between marks in chronological order. Default: true. */
+    showConnector?: boolean;
+    /** Default mark color when datum has no `color` override. Default: `var(--sp-accent)` → `#3366cc`. */
+    markColor?: string;
+    /** Default mark radius in px when datum has no `radius`. Default: 6. */
+    markRadius?: number;
+    /** Connector line color. Default: `var(--sp-muted)` → `#94a3b8`. */
+    connectorColor?: string;
+    /** X-axis date format token (d3-time-format). Auto-selected if absent. */
+    xTickFormat?: string;
+    /** Maximum number of X-axis ticks. Default: 8. */
+    xMaxTicks?: number;
+    /** Click handler for a mark. */
+    onMarkClick?: (datum: LadderChartDatum, event: MouseEvent) => void;
+    /** Hover handler; receives null when the cursor leaves all marks. */
+    onMarkHover?: (datum: LadderChartDatum | null, event: MouseEvent | null) => void;
+}
+export interface LadderChartInstance {
+    /** The mounted SVG element (already inside the container). */
+    element: SVGSVGElement;
+    /** Re-render with new partial config (e.g. swap data on player change). */
+    update(next: Partial<LadderChartConfig>): void;
+    /** Remove the chart from its parent + detach listeners. */
+    destroy(): void;
+}

package/dist/components/policy-catalog/editors/seeding/domain/seedingProjections.d.ts

@@ -0,0 +1,10 @@
+import { SeedingPolicyData, SeedingPositioning } from '../types';
+export declare const POSITIONING_OPTIONS: {
+    value: SeedingPositioning;
+    label: string;
+    description: string;
+}[];
+/** Draw types that meaningfully use a positioning override. Mirrors factory drawDefinitionConstants. */
+export declare const DRAW_TYPE_OPTIONS: string[];
+export declare function emptySeedingPolicy(): SeedingPolicyData;
+export declare function positioningLabel(value: SeedingPositioning | undefined): string;

package/dist/components/policy-catalog/editors/seeding/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Seeding Editor — Public API
+ */
+export { SeedingEditorControl, createSeedingEditor } from './seedingEditorControl';
+export { SeedingEditorStore } from './seedingEditorStore';
+export { buildSeedingEditorPanel } from './seedingEditorPanel';
+export { emptySeedingPolicy, POSITIONING_OPTIONS, DRAW_TYPE_OPTIONS } from './domain/seedingProjections';
+export type { SeedingPolicyData, SeedingProfile, SeedingPositioning, SeedsCountThreshold, SeedingEditorState, SeedingEditorSection, SeedingEditorChangeListener, SeedingEditorConfig } from './types';

package/dist/components/policy-catalog/editors/seeding/sections/drawTypeOverridesSection.d.ts

@@ -0,0 +1,6 @@
+import { SeedingEditorConfig, SeedingEditorState } from '../types';
+import { SeedingEditorStore } from '../seedingEditorStore';
+export declare function buildDrawTypeOverridesSection(store: SeedingEditorStore, config: SeedingEditorConfig): {
+    element: HTMLElement;
+    update(state: SeedingEditorState): void;
+};

package/dist/components/policy-catalog/editors/seeding/sections/flagsSection.d.ts

@@ -0,0 +1,6 @@
+import { SeedingEditorState } from '../types';
+import { SeedingEditorStore } from '../seedingEditorStore';
+export declare function buildFlagsSection(store: SeedingEditorStore): {
+    element: HTMLElement;
+    update(state: SeedingEditorState): void;
+};

package/dist/components/policy-catalog/editors/seeding/sections/profileSection.d.ts

@@ -0,0 +1,6 @@
+import { SeedingEditorState } from '../types';
+import { SeedingEditorStore } from '../seedingEditorStore';
+export declare function buildProfileSection(store: SeedingEditorStore): {
+    element: HTMLElement;
+    update(state: SeedingEditorState): void;
+};

package/dist/components/policy-catalog/editors/seeding/sections/thresholdsSection.d.ts

@@ -0,0 +1,6 @@
+import { SeedingEditorState } from '../types';
+import { SeedingEditorStore } from '../seedingEditorStore';
+export declare function buildThresholdsSection(store: SeedingEditorStore): {
+    element: HTMLElement;
+    update(state: SeedingEditorState): void;
+};

package/dist/components/policy-catalog/editors/seeding/seedingEditorControl.d.ts

@@ -0,0 +1,20 @@
+import { SeedingEditorStore } from './seedingEditorStore';
+import { SeedingPolicyData, SeedingEditorConfig } from './types';
+import { PolicyEditorInstance as CatalogEditorInstance } from '../../types';
+export declare class SeedingEditorControl {
+    private readonly store;
+    private readonly panel;
+    private readonly unsubscribe;
+    private container;
+    constructor(config: SeedingEditorConfig);
+    render(container: HTMLElement): void;
+    destroy(): void;
+    getData(): SeedingPolicyData;
+    setData(data: SeedingPolicyData): void;
+    getStore(): SeedingEditorStore;
+    static createEditorInstance(config: {
+        initialData: Record<string, unknown>;
+        onChange: (data: Record<string, unknown>) => void;
+    }): CatalogEditorInstance;
+}
+export declare function createSeedingEditor(config: SeedingEditorConfig, container: HTMLElement): SeedingEditorControl;

package/dist/components/policy-catalog/editors/seeding/seedingEditorPanel.d.ts

@@ -0,0 +1,6 @@
+import { SeedingEditorState, SeedingEditorConfig } from './types';
+import { SeedingEditorStore } from './seedingEditorStore';
+export declare function buildSeedingEditorPanel(store: SeedingEditorStore, config: SeedingEditorConfig): {
+    element: HTMLElement;
+    update(state: SeedingEditorState): void;
+};

package/dist/components/policy-catalog/editors/seeding/seedingEditorStore.d.ts

@@ -0,0 +1,26 @@
+import { SeedingPolicyData, SeedingEditorState, SeedingEditorSection, SeedingEditorChangeListener, SeedingEditorConfig, SeedsCountThreshold, SeedingPositioning } from './types';
+export declare class SeedingEditorStore {
+    private state;
+    private readonly listeners;
+    private readonly config;
+    constructor(config: SeedingEditorConfig);
+    getState(): SeedingEditorState;
+    getData(): SeedingPolicyData;
+    setData(data: SeedingPolicyData): void;
+    toggleSection(sectionId: SeedingEditorSection): void;
+    setPolicyName(value: string): void;
+    setPositioning(value: SeedingPositioning): void;
+    setValidSeedPositionsIgnore(value: boolean): void;
+    setDuplicateSeedNumbers(value: boolean): void;
+    setDrawSizeProgression(value: boolean): void;
+    addThreshold(): void;
+    removeThreshold(index: number): void;
+    setThresholdField(index: number, field: keyof SeedsCountThreshold, value: number): void;
+    sortThresholds(): void;
+    addDrawTypeOverride(drawType: string, positioning: SeedingPositioning): void;
+    removeDrawTypeOverride(drawType: string): void;
+    setDrawTypeOverridePositioning(drawType: string, positioning: SeedingPositioning): void;
+    subscribe(listener: SeedingEditorChangeListener): () => void;
+    private commitDraft;
+    private emit;
+}

package/dist/components/policy-catalog/editors/seeding/styles.d.ts

@@ -0,0 +1,24 @@
+export declare const sdEditorStyle: () => string;
+export declare const sdSectionStyle: () => string;
+export declare const sdSectionHeaderStyle: () => string;
+export declare const sdSectionChevronStyle: () => string;
+export declare const sdSectionBodyStyle: () => string;
+export declare const sdFieldRowStyle: () => string;
+export declare const sdFieldLabelStyle: () => string;
+export declare const sdFieldInputStyle: () => string;
+export declare const sdCheckboxRowStyle: () => string;
+export declare const sdCheckboxDescStyle: () => string;
+export declare const sdRadioGroupStyle: () => string;
+export declare const sdRadioOptionStyle: () => string;
+export declare const sdAddBtnStyle: () => string;
+export declare const sdSortBtnStyle: () => string;
+export declare const sdRemoveBtnStyle: () => string;
+export declare const sdTableWrapStyle: () => string;
+export declare const sdTableStyle: () => string;
+export declare const sdNumberCellInputStyle: () => string;
+export declare const sdEmptyStyle: () => string;
+export declare const sdActionsRowStyle: () => string;
+export declare const sdOverrideRowStyle: () => string;
+export declare const sdOverrideAddRowStyle: () => string;
+export declare const sdOverrideDrawTypeStyle: () => string;
+export declare const sdSelectStyle: () => string;

package/dist/components/policy-catalog/editors/seeding/types.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Seeding Policy Editor — Type Definitions
+ *
+ * Mirrors the factory's seeding policy data shape (see
+ * factory/src/fixtures/policies/POLICY_SEEDING_*.ts).
+ */
+export type SeedingPositioning = 'SEPARATE' | 'WATERFALL' | 'CLUSTER';
+export interface SeedsCountThreshold {
+    drawSize: number;
+    minimumParticipantCount: number;
+    seedsCount: number;
+}
+export interface SeedingProfile {
+    positioning?: SeedingPositioning;
+    drawTypes?: Record<string, {
+        positioning: SeedingPositioning;
+    }>;
+}
+export interface SeedingPolicyData {
+    policyName?: string;
+    seedingProfile?: SeedingProfile;
+    validSeedPositions?: {
+        ignore: boolean;
+    };
+    duplicateSeedNumbers?: boolean;
+    drawSizeProgression?: boolean;
+    seedsCountThresholds?: SeedsCountThreshold[];
+}
+export type SeedingEditorSection = 'profile' | 'flags' | 'thresholds' | 'drawTypeOverrides';
+export interface SeedingEditorState {
+    draft: SeedingPolicyData;
+    expandedSections: Set<SeedingEditorSection>;
+    dirty: boolean;
+}
+export type SeedingEditorChangeListener = (state: SeedingEditorState) => void;
+export interface SeedingEditorConfig {
+    initialPolicy?: SeedingPolicyData;
+    /** Override the list of drawTypes offered in the overrides picker. */
+    drawTypes?: string[];
+    onChange?: (policy: SeedingPolicyData) => void;
+}

package/dist/components/policy-catalog/index.d.ts

@@ -16,7 +16,9 @@ export { buildPolicyCatalogLayout } from './ui/policyCatalogLayout';
 export { buildJsonEditor } from './ui/jsonEditor';
 export { SchedulingEditorControl, createSchedulingEditor, SchedulingEditorStore, validateSchedulingPolicy, formatCodeLabel, emptySchedulingPolicy, buildSchedulingEditorPanel } from './editors/scheduling';
 export { RankingPointsEditorControl, createRankingPointsEditor, RankingPointsEditorStore, buildRankingPointsEditorPanel, emptyRankingPolicy } from './editors/ranking';
+export { SeedingEditorControl, createSeedingEditor, SeedingEditorStore, buildSeedingEditorPanel, emptySeedingPolicy, POSITIONING_OPTIONS, DRAW_TYPE_OPTIONS } from './editors/seeding';
 export type { PolicyCatalogItem, PolicyCatalogState, PolicyCatalogChangeListener, PolicyCatalogConfig, PolicyEditorInstance, PolicyEditorPlugin, PolicySource, PolicyTypeGroup, PolicyTypeMeta, CatalogGroupBy, UIPanel } from './types';
 export type { SchedulingPolicyData, SchedulingEditorState, SchedulingEditorSection, SchedulingEditorChangeListener, SchedulingEditorConfig, SchedulingValidationResult, ValidationSeverity, MinutesEntry, AverageTimeEntry, RecoveryTimeEntry, MatchUpAverageTime, MatchUpRecoveryTime } from './editors/scheduling';
 export type { RankingPolicyData, RankingPointsEditorState, RankingEditorSection, RankingPointsEditorChangeListener, RankingPointsEditorConfig, AwardProfileData, QualityWinProfileData, AggregationRulesData, TableLayout } from './editors/ranking';
+export type { SeedingPolicyData, SeedingProfile, SeedingPositioning, SeedsCountThreshold, SeedingEditorState, SeedingEditorSection, SeedingEditorChangeListener, SeedingEditorConfig } from './editors/seeding';
 export declare function createPolicyCatalog(config: PolicyCatalogConfig, container: HTMLElement): PolicyCatalogControl;

package/dist/components/tournament-card/styles.d.ts

@@ -18,6 +18,7 @@ export declare const tcFooterStyle: () => string;
 export declare const tcFeeBadgeStyle: () => string;
 export declare const tcPlayerCountStyle: () => string;
 export declare const tcEventCountStyle: () => string;
+export declare const tcTierBadgeStyle: () => string;
 export declare const tcSkeletonStyle: () => string;
 export declare const tcSkeletonLineStyle: () => string;
 export declare const tcSkeletonBlockStyle: () => string;

package/dist/components/tournament-card/types.d.ts

@@ -4,6 +4,23 @@ export interface TournamentStatusPill {
     kind: TournamentStatusKind;
     label: string;
 }
+/**
+ * Federation-specific competitive tier. Mirrors the factory's
+ * `TierClassification` shape (kept in lockstep but duplicated here to
+ * avoid pulling tods-competition-factory into the component's runtime
+ * dependency graph).
+ *
+ * - `system`: federation namespace, e.g. `'ITF_JUNIOR'`, `'ATP'`, `'PPA'`.
+ * - `value`: the tier within that system, e.g. `'J500'`, `'Masters 1000'`, `'Gold'`.
+ * - `numericRank`: optional sort key — lower = more prestigious. Used by
+ *   the card / table column to sort tournaments without round-tripping
+ *   through a ranking policy.
+ */
+export interface TierClassification {
+    system: string;
+    value: string;
+    numericRank?: number;
+}
 export interface TournamentEntryFee {
     amount: number;
     currencyCode?: string;
@@ -39,8 +56,16 @@ export interface TournamentCardData {
     updatedAt?: string;
     /** When true, render an offline/local indicator */
     offline?: boolean;
+    /**
+     * Competitive tier classification (federation-specific). When present
+     * and the `'tier'` field is in `TournamentCardConfig.body` (default), the
+     * card renders a small chip displaying `tournamentTier.value`. The
+     * Tabulator list view sorts on `numericRank` ascending with `value`
+     * lex fallback.
+     */
+    tournamentTier?: TierClassification;
 }
-export type TournamentCardField = 'title' | 'location' | 'dateRange' | 'feeBadge' | 'playerCount' | 'eventCount' | 'organizerName' | 'updatedAt';
+export type TournamentCardField = 'title' | 'tier' | 'location' | 'dateRange' | 'feeBadge' | 'playerCount' | 'eventCount' | 'organizerName' | 'updatedAt';
 export type TournamentCardCornerField = 'status' | 'offline';
 export interface TournamentCardConfig {
     /** Whether to render the image zone. Defaults to true. */