ray604638018/cursor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ok

Browse Source
This commit is contained in:
ray zhou
2026-06-29 14:51:55 +08:00
parent 225fb2bd28
commit 2dd9f17da9
319 changed files with 29461 additions and 9412 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
skills-cursor/canvas/sdk/callout-tone-icons.d.ts vendored Normal file
View File

@@ -0,0 +1,11 @@
import type { JSX } from "react";
type CalloutToneIconGlyph = "info" | "warning" | "circles-check" | "exclamation-circle";
type CalloutToneForIcon = "info" | "success" | "warning" | "danger" | "neutral";
/** Maps `Callout` tone to the same cursor icons used by `@anysphere/ui` toasts. */
export declare const calloutToneIconGlyph: Record<Exclude<CalloutToneForIcon, "neutral">, CalloutToneIconGlyph>;
export declare function CalloutToneIcon({ tone, color }: {
tone: CalloutToneForIcon;
color: string;
}): JSX.Element;
export {};
//# sourceMappingURL=callout-tone-icons.d.ts.map

52
skills-cursor/canvas/sdk/canvas-tokens.d.ts vendored
View File

@@ -19,6 +19,7 @@ export declare const canvasPaletteDark: {
readonly strokePrimary: "#E4E4E433";
readonly strokeSecondary: "#E4E4E41F";
readonly strokeTertiary: "#E4E4E414";
readonly strokeFocused: "#E4E4E4";
readonly accent: "#599CE7";
readonly buttonBackground: "#599CE7";
readonly buttonForeground: "#191c22";
@@ -50,6 +51,7 @@ export declare const canvasPaletteLight: {
readonly strokePrimary: "#14141433";
readonly strokeSecondary: "#1414141F";
readonly strokeTertiary: "#14141414";
readonly strokeFocused: "#3685BF";
readonly accent: "#3685BF";
readonly buttonBackground: "#3685BF";
readonly buttonForeground: "#FCFCFC";
@@ -76,6 +78,7 @@ export interface CanvasPalette {
readonly strokePrimary: string;
readonly strokeSecondary: string;
readonly strokeTertiary: string;
readonly strokeFocused: string;
readonly accent: string;
readonly buttonBackground: string;
readonly buttonForeground: string;
@@ -115,24 +118,45 @@ export declare const chartPalette: {
};
/**
* Shared category palette for canvas primitives that show categorical tints
* (`Swatch`, `UsageBar` segments, etc.). Uses a coherent subset of
* `chartPalette` so a category's color reads consistently across any
* primitive that consumes it.
* (`Swatch`, `UsageBar` segments, etc.). Hexes mirror the cursor core hues
* from `packages/ui/src/tokens/themes/cursor-core/{dark,light}.ts` (via the
* `text-{hue}-primary` semantic tokens); `gray` mirrors `text-tertiary`
* (`mixTransparent base 54%`).
*
* The insertion order here is the canonical category order — primitives
* that auto-assign colors (e.g. `UsageBar` segments without an explicit
* `color`) cycle through these keys in order.
*/
export declare const categoryPaletteDark: {
readonly gray: "#E4E4E48A";
readonly purple: "#9386F2";
readonly green: "#3FA266";
readonly yellow: "#F1B467";
readonly pink: "#B48EAD";
readonly blue: "#7BAFE9";
readonly orange: "#D08770";
};
export declare const categoryPaletteLight: {
readonly gray: "#1414148A";
readonly purple: "#7754D9";
readonly green: "#1F8A65";
readonly yellow: "#C08532";
readonly pink: "#B8448B";
readonly blue: "#3685BF";
readonly orange: "#DB704B";
};
/** Legacy `colorPalette` name kept for back-compat; per-theme tables are `categoryPalette{Dark,Light}`. React consumers should read `useHostTheme().category` so the color flips with the host theme. */
export declare const colorPalette: {
readonly gray: "#8888A8E0";
readonly purple: "#7B64B8F0";
readonly green: "#1F8A65E8";
readonly yellow: "#E8C030E0";
readonly pink: "#C85898E0";
readonly blue: "#2E79B5E0";
readonly orange: "#F0A040E0";
readonly gray: "#E4E4E48A";
readonly purple: "#9386F2";
readonly green: "#3FA266";
readonly yellow: "#F1B467";
readonly pink: "#B48EAD";
readonly blue: "#7BAFE9";
readonly orange: "#D08770";
};
export type Color = keyof typeof colorPalette;
export type CategoryPalette = Readonly<Record<Color, string>>;
/**
* Auto-color rotation for `UsageBar` segments without an explicit `color`.
* Decoupled from `colorPalette`'s declaration order so the palette can grow
@@ -147,7 +171,7 @@ export declare const usageColorSequence: readonly Color[];
* distinct hue families for maximum perceptual separation.
*/
export declare const chartColorSequence: readonly ["#1F8A65E8", "#70B0D8E0", "#5A6CC0F0", "#F0A040E0", "#C06028E0", "#E8C030E0", "#C85898E0", "#F0A088E0", "#7B64B8F0", "#7DCAB0E0", "#8888A8E0", "#2A9A8AE0"];
declare function buildTokens(palette: CanvasPalette): {
declare function buildTokens(palette: CanvasPalette, category: CategoryPalette): {
bg: {
editor: string;
chrome: string;
@@ -165,6 +189,7 @@ declare function buildTokens(palette: CanvasPalette): {
primary: string;
secondary: string;
tertiary: string;
focused: string;
};
fill: {
primary: string;
@@ -183,6 +208,7 @@ declare function buildTokens(palette: CanvasPalette): {
stripAdded: string;
stripRemoved: string;
};
category: Readonly<Record<"blue" | "gray" | "green" | "orange" | "pink" | "purple" | "yellow", string>>;
};
/** Semantic colors for components (spacing and radius live in `theme.ts`). */
export declare const canvasTokens: {
@@ -203,6 +229,7 @@ export declare const canvasTokens: {
primary: string;
secondary: string;
tertiary: string;
focused: string;
};
fill: {
primary: string;
@@ -221,6 +248,7 @@ export declare const canvasTokens: {
stripAdded: string;
stripRemoved: string;
};
category: Readonly<Record<"blue" | "gray" | "green" | "orange" | "pink" | "purple" | "yellow", string>>;
};
export declare const canvasTokensLight: {
bg: {
@@ -240,6 +268,7 @@ export declare const canvasTokensLight: {
primary: string;
secondary: string;
tertiary: string;
focused: string;
};
fill: {
primary: string;
@@ -258,6 +287,7 @@ export declare const canvasTokensLight: {
stripAdded: string;
stripRemoved: string;
};
category: Readonly<Record<"blue" | "gray" | "green" | "orange" | "pink" | "purple" | "yellow", string>>;
};
export type CanvasTokens = ReturnType<typeof buildTokens>;
export {};

86
skills-cursor/canvas/sdk/chart-primitives.d.ts vendored
View File

@@ -32,7 +32,41 @@ export type ChartSeries = {
data: number[];
tone?: ChartTone;
};
export type BarChartProps = {
/**
* A dashed marker line drawn across the plot at a fixed value — for targets,
* SLOs, budgets, means, or limits. Drawn horizontally on line / vertical-bar
* charts and vertically on `horizontal` bar charts; either way it marks the
* value axis and is folded into the auto domain so it stays on-canvas.
*/
export type ChartReferenceLine = {
/** Position on the value axis, in the same units as the series data. */
value: number;
/** Short label drawn in a chip at the line's end. */
label?: string;
/** Line color. Omit for a muted neutral; set to match other tonal elements. */
tone?: ChartTone;
};
/**
* Shared value-axis controls (the y-axis, or the x-axis on `horizontal` bar
* charts). By default the axis starts at zero; override to zoom into a tight
* range. On stacked / normalized bars these are ignored — those always start
* at zero.
*/
type ValueAxisProps = {
/**
* Start the value axis at zero. Defaults to `true`. Set `false` to
* auto-fit the axis to the data range — useful for tightly-clustered
* series (e.g. uptime 99.0–99.9%) that a zero baseline would flatten.
*/
beginAtZero?: boolean;
/** Explicit axis minimum. Overrides `beginAtZero`. */
yMin?: number;
/** Explicit axis maximum. */
yMax?: number;
/** Horizontal marker lines for targets / thresholds / means. */
referenceLines?: ChartReferenceLine[];
};
export type BarChartProps = ValueAxisProps & {
/** Category labels along the independent axis. */
categories: string[];
/** One or more data series. Values align by index with `categories`. */
@@ -44,24 +78,42 @@ export type BarChartProps = {
horizontal?: boolean;
/** Show as 100% stacked (implies `stacked`). */
normalized?: boolean;
/** Suffix for y-axis tick labels (e.g. "%"). */
/** Suffix for value labels (e.g. "%", " ms"). */
valueSuffix?: string;
/** Prefix for value labels (e.g. "$"). Ignored in `normalized` mode. */
valuePrefix?: string;
/**
* Print each bar's value as a label. Defaults to auto: on for a single
* series with ≤8 categories, off otherwise. Set `true` to force labels on
* (e.g. grouped multi-series), or `false` to force them off. No effect on
* `stacked` / `normalized` charts — use the hover tooltip there.
*/
showValues?: boolean;
style?: CSSProperties;
};
export type LineChartProps = {
export type LineChartProps = ValueAxisProps & {
categories: string[];
series: ChartSeries[];
height?: number;
/** Fill the area under each line with a soft tint. */
fill?: boolean;
/** Suffix for value labels (e.g. "%", " ms"). */
valueSuffix?: string;
/** Prefix for value labels (e.g. "$"). */
valuePrefix?: string;
/** Print the value next to every data point (≤20 categories). */
showValues?: boolean;
/** Draw a vertical guide through the cursor while hovering. Defaults to `true`. */
showHoverGuide?: boolean;
style?: CSSProperties;
};
export type PieChartProps = {
data: Array<ChartDataPoint & {
tone?: ChartTone;
}>;
/** Diameter in px. Defaults to 200. */
size?: number;
/** Render as a donut with the summed total shown in the hollow center. */
donut?: boolean;
style?: CSSProperties;
};
@@ -112,16 +164,25 @@ export type PieChartProps = {
* ]}
* stacked
* />
*
* // Mark a target with a reference line. Grouped/single bars also accept
* // `yMin` / `yMax` to frame the axis (stacked bars stay zero-based).
* <BarChart
* categories={["Mon", "Tue", "Wed", "Thu", "Fri"]}
* series={[{ name: "Latency", data: [180, 210, 240, 200, 220] }]}
* valueSuffix=" ms"
* referenceLines={[{ value: 200, label: "Budget", tone: "warning" }]}
* />
* ```
*/
export declare function BarChart({ categories, series, height, stacked, horizontal, normalized, valueSuffix, style }: BarChartProps): JSX.Element;
export declare function BarChart({ categories, series, height, stacked, horizontal, normalized, valueSuffix, valuePrefix, showValues, beginAtZero, yMin, yMax, referenceLines, style }: BarChartProps): JSX.Element;
/**
* Multi-series line chart with optional area fill. Distilled from the
* portal-website Highcharts analytics charts.
*
* Each series draws a polyline with dot markers at each data point.
* Set `fill` to shade the area under every line. Hover over any category
* column to see a tooltip with all series values at that point.
* column to see a tooltip with all series values and a vertical cursor guide.
*
* This is **not** a time-series component — it does not parse dates.
* Pass pre-formatted date strings as `categories` if plotting over time.
@@ -157,9 +218,19 @@ export declare function BarChart({ categories, series, height, stacked, horizont
* { name: "errors", data: [2, 4, 9, 3], tone: "danger" },
* ]}
* />
*
* // Zoom into a tight range and mark an SLO. `beginAtZero={false}`
* // auto-fits the axis; `referenceLines` draws the target.
* <LineChart
* categories={["Mon", "Tue", "Wed", "Thu", "Fri"]}
* series={[{ name: "Uptime", data: [99.91, 99.95, 99.7, 99.99, 99.96] }]}
* valueSuffix="%"
* beginAtZero={false}
* referenceLines={[{ value: 99.9, label: "SLO", tone: "danger" }]}
* />
* ```
*/
export declare function LineChart({ categories, series, height, fill, valueSuffix, style }: LineChartProps): JSX.Element;
export declare function LineChart({ categories, series, height, fill, valueSuffix, valuePrefix, showValues, showHoverGuide, beginAtZero, yMin, yMax, referenceLines, style }: LineChartProps): JSX.Element;
/**
* Pie (or donut) chart with hover highlighting. Distilled from the
* portal-website Highcharts analytics charts.
@@ -171,7 +242,7 @@ export declare function LineChart({ categories, series, height, fill, valueSuffi
*
* Hovering a slice expands it outward and dims the others; hovering a legend
* item does the same. A tooltip with value and percentage appears below the
* chart. Set `donut` for a hollow center.
* chart. Set `donut` for a hollow center that shows the summed total.
*
* **Do not** use for bar-style comparisons — use `BarChart` instead.
*
@@ -197,4 +268,5 @@ export declare function LineChart({ categories, series, height, fill, valueSuffi
* ```
*/
export declare function PieChart({ data, size, donut, style }: PieChartProps): JSX.Element;
export {};
//# sourceMappingURL=chart-primitives.d.ts.map

8
skills-cursor/canvas/sdk/collapsible-section.d.ts vendored
View File

@@ -27,11 +27,13 @@ export type CollapsibleSectionProps = {
trailing?: ReactNode;
/** Body shown when expanded. */
children?: ReactNode;
/** When true, the section starts expanded (uncontrolled). */
defaultOpen?: boolean;
style?: CSSProperties;
};
/**
* Borderless collapsible row with a structured header. Always starts closed
* (uncontrolled, no `defaultOpen`).
* Borderless collapsible row with a structured header. Starts closed unless
* `defaultOpen` is set.
*
* Compose with `<Swatch>` in the `leading` slot for a colored category icon,
* and put a token readout / pill / button in `trailing`. Body content is
@@ -61,5 +63,5 @@ export type CollapsibleSectionProps = {
* </CollapsibleSection>
* ```
*/
export declare function CollapsibleSection({ title, leading, count, trailing, children, style }: CollapsibleSectionProps): JSX.Element;
export declare function CollapsibleSection({ title, leading, count, trailing, children, defaultOpen, style }: CollapsibleSectionProps): JSX.Element;
//# sourceMappingURL=collapsible-section.d.ts.map

4
skills-cursor/canvas/sdk/hooks.d.ts vendored
View File

@@ -106,6 +106,10 @@ export type { CanvasAction };
* appended after the mention. The canvas file is resolved from the
* action route's `canvasId`; do not pass the path from canvas UI.
*
* **`openFile`** — Open an existing workspace file in the host IDE.
* `path` may be workspace-relative or absolute. Optional `selection`
* follows VS Code editor line/column fields.
*
* @example
* ```tsx
* function AgentLink({ agentId, title }: { agentId: string; title: string }) {

6
skills-cursor/canvas/sdk/index.d.ts vendored
View File

@@ -11,10 +11,10 @@
* - Run the pre-delivery self-check before returning code.
*/
/** Shared category color palette used by `Swatch`, `UsageBar`, etc. */
export type { Color } from "./canvas-tokens.js";
export { colorPalette, usageColorSequence } from "./canvas-tokens.js";
export type { CategoryPalette, Color } from "./canvas-tokens.js";
export { categoryPaletteDark, categoryPaletteLight, colorPalette, usageColorSequence, } from "./canvas-tokens.js";
/** Charts. */
export type { BarChartProps, ChartDataPoint, ChartSeries, ChartTone, LineChartProps, PieChartProps, } from "./chart-primitives.js";
export type { BarChartProps, ChartDataPoint, ChartReferenceLine, ChartSeries, ChartTone, LineChartProps, PieChartProps, } from "./chart-primitives.js";
export { BarChart, LineChart, PieChart } from "./chart-primitives.js";
/** Borderless collapsible disclosure row with a structured header. */
export type { CollapsibleSectionProps } from "./collapsible-section.js";

6
skills-cursor/canvas/sdk/swatch.d.ts vendored
View File

@@ -3,11 +3,11 @@
* list/row decoration (category badges, the leading slot of
* `CollapsibleSection`, etc.).
*
* Pulls colors from the shared `Color` palette so a category's swatch and
* its `UsageBar` segment for the same `color` stay visually coherent.
* Pulls colors from `useHostTheme().category` so a category's swatch and its
* `UsageBar` segment for the same `color` stay visually coherent.
*/
import type { CSSProperties, JSX } from "react";
import { type Color } from "./canvas-tokens.js";
import type { Color } from "./canvas-tokens.js";
export type SwatchProps = {
/** One of the 7 shared category hues. Matches `UsageBar` segment colors. */
color: Color;

25
skills-cursor/canvas/sdk/ui-primitives.d.ts vendored
View File

@@ -108,7 +108,7 @@ export declare function Divider({ style }: DividerProps): JSX.Element;
export declare function Spacer(): JSX.Element;
/** Horizontal alignment for a table column. */
export type TableColumnAlign = "left" | "center" | "right";
/** Semantic tone for a table row — renders a translucent tinted background. */
/** Semantic tone for a table row — marker dot in the first column. */
export type TableRowTone = "success" | "danger" | "warning" | "info" | "neutral";
export type TableProps = {
/** Column titles, left to right. Column count is fixed by this array. */
@@ -121,9 +121,9 @@ export type TableProps = {
/** Optional alignment per column index (headers/rows). Defaults to left. */
columnAlign?: Array<TableColumnAlign | undefined>;
/**
* Optional semantic tone per row index. Applies a translucent tinted
* background — use for status highlighting (e.g. failing services, warnings).
* Sparse: `undefined` entries are uncolored.
* Optional semantic tone per row index. Renders a small colored dot before
* the first column's content (no row fill or border). Sparse: `undefined`
* entries are unstyled.
*/
rowTone?: Array<TableRowTone | undefined>;
/** When true (default), bordered rounded shell with horizontal scroll if needed. */
@@ -451,17 +451,14 @@ export type ButtonProps = {
* ```
*/
export declare function Button({ children, variant, disabled, type, style, onClick }: ButtonProps): JSX.Element;
/** @deprecated Pills always render neutral now; tones are ignored. */
export type PillTone = "neutral" | "added" | "deleted" | "renamed" | "success" | "warning" | "info";
export type PillSize = "sm" | "md";
export type PillProps = {
children?: ReactNode;
/** Whether the pill is in its selected/active state (filled background). */
active?: boolean;
/**
* Semantic tone. Recolors the border and text. When `active` is also
* set, fills the background with the tone color at low opacity.
* Defaults to `neutral` (current stroke/text tokens).
*/
/** @deprecated Ignored — pills always render with neutral styling. */
tone?: PillTone;
/**
* Visual size. `"md"` (default) is the standard pill. `"sm"` is a
@@ -497,7 +494,7 @@ export type PillProps = {
* <Pill onClick={handlePlan} keyboardHint="⇧Tab">Plan new idea</Pill>
* ```
*/
export declare function Pill({ children, active, tone, size, leadingContent, keyboardHint, disabled, title, style, onClick }: PillProps): JSX.Element;
export declare function Pill({ children, active, size, leadingContent, keyboardHint, disabled, title, style, onClick }: PillProps): JSX.Element;
export type StatTone = "success" | "danger" | "warning" | "info";
export type StatProps = {
/** The primary metric value (number, percentage, short string). */
@@ -526,17 +523,17 @@ export type CalloutTone = "info" | "success" | "warning" | "danger" | "neutral";
export type CalloutProps = {
/** Body content. Plain strings, `<Text>`, `<Code>`, `<Link>`, or short lists. */
children?: ReactNode;
/** Semantic tone. Recolors the border, background tint, and title text. */
/** Semantic tone. Selects a default leading icon when `icon` is omitted. */
tone?: CalloutTone;
/** Optional bold title line, shown above the body in the tone color. */
/** Optional bold title line, shown above the body. */
title?: ReactNode;
/** Optional leading icon (emoji, inline SVG, or short text glyph). */
icon?: ReactNode;
style?: CSSProperties;
};
/**
* Tinted, bordered notice block for warnings, tips, or short status messages
* inline within a section.
* Inline notice for warnings, tips, or short status messages. Each `tone`
* renders a cursor icon matching `@anysphere/ui` toasts (override with `icon`).
*
* @example
* ```tsx