@peasant-labs/fairtrade 0.0.0

package/dist/lib/types/MapCanvas.d.ts

@@ -0,0 +1,89 @@
+/**
+ * @typedef {Object} MapNode
+ * @property {string} id                       stable key (repo-relative path)
+ * @property {string} label                    display label (leaf of a path is shown)
+ * @property {'folder'|'file'} kind            folder vs file — distinguished by ICON
+ * @property {number} [loc=0]                   lines of code — node WIDTH ∝ loc
+ * @property {number} [coverage=0]             0..4 monochrome coverage ramp (the FILL)
+ * @property {string} [parent]                 parent id (forms the tree)
+ * @property {number} [violations=0]           violation count — a clay badge
+ */
+/**
+ * @typedef {Object} MapEdge
+ * @property {string} from
+ * @property {string} to
+ * @property {'structure'|'activity'} [kind='structure']  solid vs dashed
+ * @property {number} [weight=1]               stroke WIDTH ∝ weight (never hue)
+ */
+/**
+ * MapCanvas — an interactive code-structure map. Pan (drag), zoom (square controls /
+ * +/- keys, never wheel), semantic zoom (overview / folders / files) with edge
+ * ancestor-lifting, a minimap, and a node search combobox. Square metric-encoded
+ * nodes (width ∝ LOC, monochrome coverage fill, folder/file icon, amber selection +
+ * marker, clay violation badge) and square orthogonal edges (solid structure /
+ * dashed activity, width ∝ weight). Full roving-focus keyboard nav with an aria-live
+ * region. Pure: no data fetching, deterministic layout.
+ *
+ * @param {Object} props
+ * @param {{nodes: MapNode[], edges?: MapEdge[]}} [props.data]   the graph
+ * @param {'overview'|'folders'|'files'} [props.grain='folders'] initial semantic zoom
+ * @param {string} [props.selectedId]                            initial selection
+ * @param {(id:string|null, node:MapNode|null)=>void} [props.onSelect]  selection cb
+ * @param {number} [props.height=520]                            canvas height (px)
+ * @param {string} [props.ariaLabel='code map']                  application label
+ * @param {string} [props.className]                             extra container class
+ */
+export default function MapCanvas({ data, grain: initialGrain, selectedId: initialSelected, onSelect, height, ariaLabel, className, }: {
+    data?: {
+        nodes: MapNode[];
+        edges?: MapEdge[];
+    };
+    grain?: "overview" | "folders" | "files";
+    selectedId?: string;
+    onSelect?: (id: string | null, node: MapNode | null) => void;
+    height?: number;
+    ariaLabel?: string;
+    className?: string;
+}): any;
+export type MapNode = {
+    /**
+     * stable key (repo-relative path)
+     */
+    id: string;
+    /**
+     * display label (leaf of a path is shown)
+     */
+    label: string;
+    /**
+     * folder vs file — distinguished by ICON
+     */
+    kind: "folder" | "file";
+    /**
+     * lines of code — node WIDTH ∝ loc
+     */
+    loc?: number;
+    /**
+     * 0..4 monochrome coverage ramp (the FILL)
+     */
+    coverage?: number;
+    /**
+     * parent id (forms the tree)
+     */
+    parent?: string;
+    /**
+     * violation count — a clay badge
+     */
+    violations?: number;
+};
+export type MapEdge = {
+    from: string;
+    to: string;
+    /**
+     * solid vs dashed
+     */
+    kind?: "structure" | "activity";
+    /**
+     * stroke WIDTH ∝ weight (never hue)
+     */
+    weight?: number;
+};

package/dist/lib/types/MapCanvas.stories.d.ts

@@ -0,0 +1,174 @@
+declare namespace _default {
+    export let title: string;
+    export { MapCanvas as component };
+    export namespace parameters {
+        let layout: string;
+        namespace docs {
+            namespace description {
+                let component: string;
+            }
+        }
+    }
+    export let decorators: Function[];
+    export namespace argTypes {
+        namespace grain {
+            namespace control {
+                let type: string;
+            }
+            let options: string[];
+        }
+        namespace height {
+            export namespace control_1 {
+                let type_1: string;
+                export { type_1 as type };
+                export let min: number;
+                export let max: number;
+                export let step: number;
+            }
+            export { control_1 as control };
+        }
+        namespace onSelect {
+            let action: string;
+        }
+        namespace data {
+            let control_2: boolean;
+            export { control_2 as control };
+        }
+        namespace selectedId {
+            let control_3: boolean;
+            export { control_3 as control };
+        }
+        namespace ariaLabel {
+            let control_4: string;
+            export { control_4 as control };
+        }
+    }
+}
+export default _default;
+export namespace Default {
+    namespace args {
+        export namespace data_1 {
+            export { NODES as nodes };
+            export { EDGES as edges };
+        }
+        export { data_1 as data };
+        let grain_1: string;
+        export { grain_1 as grain };
+        let height_1: number;
+        export { height_1 as height };
+        let onSelect_1: import("storybook/test").Mock<(...args: any[]) => any>;
+        export { onSelect_1 as onSelect };
+        let ariaLabel_1: string;
+        export { ariaLabel_1 as ariaLabel };
+    }
+    function play({ args, canvasElement }: {
+        args: any;
+        canvasElement: any;
+    }): Promise<void>;
+}
+export namespace Overview {
+    export namespace args_1 {
+        let grain_2: string;
+        export { grain_2 as grain };
+        let ariaLabel_2: string;
+        export { ariaLabel_2 as ariaLabel };
+    }
+    export { args_1 as args };
+    export function play_1({ canvasElement }: {
+        canvasElement: any;
+    }): Promise<void>;
+    export { play_1 as play };
+}
+export namespace Violations {
+    export namespace args_2 {
+        export namespace data_2 {
+            export { VIOLATION_NODES as nodes };
+            export { EDGES as edges };
+        }
+        export { data_2 as data };
+        let grain_3: string;
+        export { grain_3 as grain };
+        let ariaLabel_3: string;
+        export { ariaLabel_3 as ariaLabel };
+    }
+    export { args_2 as args };
+    export function play_2({ canvasElement }: {
+        canvasElement: any;
+    }): Promise<void>;
+    export { play_2 as play };
+}
+export namespace Light {
+    export namespace args_3 { }
+    export { args_3 as args };
+    export namespace globals {
+        let theme: string;
+        namespace backgrounds {
+            let value: string;
+        }
+    }
+}
+import MapCanvas from './MapCanvas.jsx';
+declare const NODES: ({
+    id: string;
+    label: string;
+    kind: string;
+    loc?: undefined;
+    coverage?: undefined;
+    parent?: undefined;
+    violations?: undefined;
+} | {
+    id: string;
+    label: string;
+    kind: string;
+    loc: number;
+    coverage: number;
+    parent: string;
+    violations?: undefined;
+} | {
+    id: string;
+    label: string;
+    kind: string;
+    loc: number;
+    coverage: number;
+    parent: string;
+    violations: number;
+})[];
+declare const EDGES: {
+    from: string;
+    to: string;
+    kind: string;
+    weight: number;
+}[];
+declare const VIOLATION_NODES: ({
+    id: string;
+    label: string;
+    kind: string;
+    loc?: undefined;
+    coverage?: undefined;
+    parent?: undefined;
+    violations?: undefined;
+} | {
+    id: string;
+    label: string;
+    kind: string;
+    loc: number;
+    coverage: number;
+    parent: string;
+    violations?: undefined;
+} | {
+    id: string;
+    label: string;
+    kind: string;
+    loc: number;
+    coverage: number;
+    parent: string;
+    violations: number;
+} | {
+    violations: number;
+    id: string;
+    label: string;
+    kind: string;
+    loc?: undefined;
+    coverage?: undefined;
+    parent?: undefined;
+})[];

package/dist/lib/types/Menu.d.ts

@@ -0,0 +1,62 @@
+/**
+ * @typedef {Object} MenuItem
+ * @property {string}   label            row label (passed-through children case preserved)
+ * @property {React.ComponentType<any>} [icon]    leading lucide icon component (e.g. icon={Copy})
+ * @property {string}   [brand]          leading provider mark (e.g. brand="claude-code"); takes precedence over icon
+ * @property {string}   [kbd]            right-aligned shortcut hint (e.g. "⌘D")
+ * @property {boolean}  [danger]         destructive (.menu-danger) variant - clay, keeps icon + label
+ * @property {boolean}  [disabled]       aria-disabled row, skipped by arrow keys, not selectable
+ * @property {boolean}  [separator]      a role="separator" .menu-sep hairline row, skipped by keyboard nav
+ * @property {() => void} [onSelect]     invoked when the row is chosen (click or Enter/Space)
+ */
+/**
+ * Menu - a dropdown menu controlled by a single trigger button.
+ *
+ * @param {Object} props
+ * @param {React.ReactNode} props.label             trigger label (lowercase chrome by default)
+ * @param {MenuItem[]} [props.items=[]]             menu rows
+ * @param {'start'|'end'} [props.align='start']     which edge of the trigger the popout aligns to
+ * @param {React.ReactNode} [props.caption]         optional .menu-cap caption rendered inside the popout before the list
+ * @param {boolean} [props.defaultOpen=false]       render with the popout already open (specimen / screenshot state)
+ */
+export default function Menu({ label, items, align, caption, defaultOpen }: {
+    label: React.ReactNode;
+    items?: MenuItem[];
+    align?: "start" | "end";
+    caption?: React.ReactNode;
+    defaultOpen?: boolean;
+}): any;
+export type MenuItem = {
+    /**
+     * row label (passed-through children case preserved)
+     */
+    label: string;
+    /**
+     * leading lucide icon component (e.g. icon={Copy})
+     */
+    icon?: React.ComponentType<any>;
+    /**
+     * leading provider mark (e.g. brand="claude-code"); takes precedence over icon
+     */
+    brand?: string;
+    /**
+     * right-aligned shortcut hint (e.g. "⌘D")
+     */
+    kbd?: string;
+    /**
+     * destructive (.menu-danger) variant - clay, keeps icon + label
+     */
+    danger?: boolean;
+    /**
+     * aria-disabled row, skipped by arrow keys, not selectable
+     */
+    disabled?: boolean;
+    /**
+     * a role="separator" .menu-sep hairline row, skipped by keyboard nav
+     */
+    separator?: boolean;
+    /**
+     * invoked when the row is chosen (click or Enter/Space)
+     */
+    onSelect?: () => void;
+};

package/dist/lib/types/Menu.stories.d.ts

@@ -0,0 +1,173 @@
+export default meta;
+export const Playground: {};
+export namespace Aligned {
+    namespace args {
+        let align: string;
+        let label: string;
+    }
+}
+export namespace Providers {
+    export namespace args_1 {
+        let label_1: string;
+        export { label_1 as label };
+        export let items: ({
+            label: string;
+            brand: string;
+            kbd: string;
+            disabled?: undefined;
+        } | {
+            label: string;
+            brand: string;
+            kbd: string;
+            disabled: boolean;
+        })[];
+    }
+    export { args_1 as args };
+}
+export namespace WithDangerItem {
+    export namespace args_2 {
+        let label_2: string;
+        export { label_2 as label };
+        let items_1: ({
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            disabled?: undefined;
+            danger?: undefined;
+            kbd?: undefined;
+        } | {
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            disabled: boolean;
+            danger?: undefined;
+            kbd?: undefined;
+        } | {
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            danger: boolean;
+            kbd: string;
+            disabled?: undefined;
+        })[];
+        export { items_1 as items };
+    }
+    export { args_2 as args };
+}
+export namespace Empty {
+    export namespace args_3 {
+        let label_3: string;
+        export { label_3 as label };
+        let items_2: any[];
+        export { items_2 as items };
+    }
+    export { args_3 as args };
+}
+export namespace WithCaptionAndSeparator {
+    export namespace args_4 {
+        let label_4: string;
+        export { label_4 as label };
+        export let caption: string;
+        let items_3: ({
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            kbd: string;
+            disabled?: undefined;
+            separator?: undefined;
+            danger?: undefined;
+        } | {
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            kbd: string;
+            disabled: boolean;
+            separator?: undefined;
+            danger?: undefined;
+        } | {
+            separator: boolean;
+            label?: undefined;
+            icon?: undefined;
+            kbd?: undefined;
+            disabled?: undefined;
+            danger?: undefined;
+        } | {
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            kbd: string;
+            danger: boolean;
+            disabled?: undefined;
+            separator?: undefined;
+        })[];
+        export { items_3 as items };
+    }
+    export { args_4 as args };
+}
+export namespace OpensAndSelects {
+    export namespace args_5 {
+        let defaultOpen: boolean;
+    }
+    export { args_5 as args };
+    export function play({ canvasElement }: {
+        canvasElement: any;
+    }): Promise<void>;
+}
+declare namespace meta {
+    export let title: string;
+    export { Menu as component };
+    export let tags: string[];
+    export let decorators: Function[];
+    export namespace argTypes {
+        export namespace label_5 {
+            let control: string;
+        }
+        export { label_5 as label };
+        export namespace align_1 {
+            let control_1: string;
+            export { control_1 as control };
+            export let options: string[];
+        }
+        export { align_1 as align };
+        export namespace defaultOpen_1 {
+            let control_2: string;
+            export { control_2 as control };
+        }
+        export { defaultOpen_1 as defaultOpen };
+        export namespace items_4 {
+            let control_3: boolean;
+            export { control_3 as control };
+        }
+        export { items_4 as items };
+    }
+    export namespace args_6 {
+        let label_6: string;
+        export { label_6 as label };
+        let align_2: string;
+        export { align_2 as align };
+        let defaultOpen_2: boolean;
+        export { defaultOpen_2 as defaultOpen };
+        let items_5: ({
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            kbd: string;
+            disabled?: undefined;
+            danger?: undefined;
+        } | {
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            kbd?: undefined;
+            disabled?: undefined;
+            danger?: undefined;
+        } | {
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            disabled: boolean;
+            kbd?: undefined;
+            danger?: undefined;
+        } | {
+            label: string;
+            icon: react.ForwardRefExoticComponent<any>;
+            danger: boolean;
+            kbd: string;
+            disabled?: undefined;
+        })[];
+        export { items_5 as items };
+    }
+    export { args_6 as args };
+}
+import Menu from './Menu.jsx';

package/dist/lib/types/ModerationQueue.d.ts

@@ -0,0 +1,135 @@
+/**
+ * ApprovalBar — a sticky top bar for reviewing a single pending item. Once acted on it collapses
+ * to a one-line resolved acknowledgement (icon + word) rather than disappearing outright.
+ * @typedef {Object} ApprovalBarProps
+ * @property {React.ReactNode} subject  the thing under review, e.g. "pending share to {collective}";
+ *                                      the collective/title inside is USER CONTENT (case preserved).
+ * @property {() => void} [onApprove]   called when approve is clicked (after the optimistic resolve).
+ * @property {() => void} [onReject]    called when reject is clicked (after the optimistic resolve).
+ * @property {string} [approveLabel='approve'] lowercase label for the approve action.
+ * @property {string} [rejectLabel='reject']   lowercase label for the reject action.
+ * @property {string} [className]       extra classes appended to the .mod-bar root.
+ */
+/**
+ * @param {ApprovalBarProps} props
+ */
+export function ApprovalBar({ subject, onApprove, onReject, approveLabel, rejectLabel, className, }: ApprovalBarProps): any;
+/**
+ * ModerationQueue — a panel listing pending items (member requests OR shares). Each row shows who +
+ * detail + relative time, with approve/reject buttons. Acting on a row resolves it OPTIMISTICALLY in
+ * place: the buttons swap for an approved/rejected pill (olive/clay + icon) and the row is struck +
+ * dimmed, never removed — so the reviewer keeps an audit trail of what they just decided. When no
+ * items remain pending an empty state is shown.
+ * @typedef {Object} QueueItem
+ * @property {string} id                stable key.
+ * @property {'member'|'share'} [kind]  picks the leading icon (user-plus / inbox). defaults to share.
+ * @property {React.ReactNode} who       the actor — a handle/name. USER CONTENT (case preserved).
+ * @property {React.ReactNode} [detail]  the secondary line (org, title, …). USER CONTENT.
+ * @property {React.ReactNode} [when]    relative time, e.g. "2h ago". rendered tabular + lowercased.
+ *
+ * @typedef {Object} ModerationQueueProps
+ * @property {React.ReactNode} [title='pending review'] the panel header label (lowercase chrome).
+ * @property {QueueItem[]} [items=[]]   the pending items.
+ * @property {(item: QueueItem) => void} [onApprove] called with the item when approved.
+ * @property {(item: QueueItem) => void} [onReject]  called with the item when rejected.
+ * @property {React.ReactNode} [emptyLabel='nothing pending'] message for the empty state.
+ * @property {string} [className]       extra classes appended to the .mod-queue root.
+ */
+/**
+ * @param {ModerationQueueProps} props
+ */
+export function ModerationQueue({ title, items, onApprove, onReject, emptyLabel, className, }: ModerationQueueProps): any;
+export default ModerationQueue;
+/**
+ * ApprovalBar — a sticky top bar for reviewing a single pending item. Once acted on it collapses
+ * to a one-line resolved acknowledgement (icon + word) rather than disappearing outright.
+ */
+export type ApprovalBarProps = {
+    /**
+     * the thing under review, e.g. "pending share to {collective}";
+     * the collective/title inside is USER CONTENT (case preserved).
+     */
+    subject: React.ReactNode;
+    /**
+     * called when approve is clicked (after the optimistic resolve).
+     */
+    onApprove?: () => void;
+    /**
+     * called when reject is clicked (after the optimistic resolve).
+     */
+    onReject?: () => void;
+    /**
+     * lowercase label for the approve action.
+     */
+    approveLabel?: string;
+    /**
+     * lowercase label for the reject action.
+     */
+    rejectLabel?: string;
+    /**
+     * extra classes appended to the .mod-bar root.
+     */
+    className?: string;
+};
+/**
+ * ModerationQueue — a panel listing pending items (member requests OR shares). Each row shows who +
+ * detail + relative time, with approve/reject buttons. Acting on a row resolves it OPTIMISTICALLY in
+ * place: the buttons swap for an approved/rejected pill (olive/clay + icon) and the row is struck +
+ * dimmed, never removed — so the reviewer keeps an audit trail of what they just decided. When no
+ * items remain pending an empty state is shown.
+ */
+export type QueueItem = {
+    /**
+     * stable key.
+     */
+    id: string;
+    /**
+     * picks the leading icon (user-plus / inbox). defaults to share.
+     */
+    kind?: "member" | "share";
+    /**
+     * the actor — a handle/name. USER CONTENT (case preserved).
+     */
+    who: React.ReactNode;
+    /**
+     * the secondary line (org, title, …). USER CONTENT.
+     */
+    detail?: React.ReactNode;
+    /**
+     * relative time, e.g. "2h ago". rendered tabular + lowercased.
+     */
+    when?: React.ReactNode;
+};
+/**
+ * ModerationQueue — a panel listing pending items (member requests OR shares). Each row shows who +
+ * detail + relative time, with approve/reject buttons. Acting on a row resolves it OPTIMISTICALLY in
+ * place: the buttons swap for an approved/rejected pill (olive/clay + icon) and the row is struck +
+ * dimmed, never removed — so the reviewer keeps an audit trail of what they just decided. When no
+ * items remain pending an empty state is shown.
+ */
+export type ModerationQueueProps = {
+    /**
+     * the panel header label (lowercase chrome).
+     */
+    title?: React.ReactNode;
+    /**
+     * the pending items.
+     */
+    items?: QueueItem[];
+    /**
+     * called with the item when approved.
+     */
+    onApprove?: (item: QueueItem) => void;
+    /**
+     * called with the item when rejected.
+     */
+    onReject?: (item: QueueItem) => void;
+    /**
+     * message for the empty state.
+     */
+    emptyLabel?: React.ReactNode;
+    /**
+     * extra classes appended to the .mod-queue root.
+     */
+    className?: string;
+};

package/dist/lib/types/ModerationQueue.stories.d.ts

@@ -0,0 +1,34 @@
+export default meta;
+export namespace MemberRequests {
+    function render(): any;
+    function play({ canvasElement }: {
+        canvasElement: any;
+    }): Promise<void>;
+}
+export namespace PendingShares {
+    export function render_1(): any;
+    export { render_1 as render };
+}
+export namespace ApprovalBarSticky {
+    export let decorators: Function[];
+    export function render_2(): any;
+    export { render_2 as render };
+    export function play_1({ canvasElement }: {
+        canvasElement: any;
+    }): Promise<void>;
+    export { play_1 as play };
+}
+export namespace Empty {
+    export function render_3(): any;
+    export { render_3 as render };
+}
+declare namespace meta {
+    export let title: string;
+    export { ModerationQueue as component };
+    let decorators_1: Function[];
+    export { decorators_1 as decorators };
+    export namespace parameters {
+        let layout: string;
+    }
+}
+import { ModerationQueue } from './ModerationQueue.jsx';