gloomberb 0.10.0 → 0.10.2

package/src/plugins/builtin/chart-composer/editor/desktop-view.tsx

@@ -0,0 +1,134 @@
+import { type ReactNode } from "react";
+import { Box, Text } from "../../../../ui";
+import { Button, Checkbox } from "../../../../components/ui";
+import { NativeSelect } from "../../../../components/ui/native-select";
+import { colors } from "../../../../theme/colors";
+import type {
+  SeriesEditorActionModel,
+  SeriesEditorFieldId,
+  SeriesEditorFieldModel,
+} from "./model";
+
+function DesktopEditorField({
+  label,
+  children,
+  width = "calc(50% - 6px)",
+}: {
+  label: string;
+  children: ReactNode;
+  width?: string;
+}) {
+  return (
+    <Box flexDirection="column" width={width} minWidth="220px" style={{ gap: 4 }}>
+      <Text fg={colors.textDim} style={{ fontWeight: 600 }}>{label}</Text>
+      {children}
+    </Box>
+  );
+}
+
+const SECURITY_FIELD_ORDER: SeriesEditorFieldId[] = [
+  "style",
+  "transform",
+  "axis",
+  "period",
+  "timing",
+  "panel",
+  "scale",
+  "visibility",
+];
+
+const NON_SECURITY_FIELD_ORDER: SeriesEditorFieldId[] = [
+  "style",
+  "transform",
+  "axis",
+  "visibility",
+  "panel",
+  "scale",
+];
+
+export function DesktopSeriesEditorFields({ fields }: { fields: SeriesEditorFieldModel[] }) {
+  const fieldById = new Map(fields.map((field) => [field.id, field]));
+  const isSecurity = fieldById.has("period");
+  const orderedFields = (isSecurity ? SECURITY_FIELD_ORDER : NON_SECURITY_FIELD_ORDER)
+    .map((id) => fieldById.get(id))
+    .filter((field): field is SeriesEditorFieldModel => !!field);
+
+  return (
+    <Box
+      flexDirection="row"
+      flexWrap="wrap"
+      width="100%"
+      style={{ columnGap: 12, rowGap: 10 }}
+    >
+      {orderedFields.map((field) => (
+        <DesktopEditorField
+          key={field.id}
+          label={field.label}
+          width={field.id === "visibility" && isSecurity ? "100%" : undefined}
+        >
+          {field.kind === "visibility" ? (
+            <Box height="28px" justifyContent="center">
+              <Checkbox
+                label="Show series"
+                checked={field.value === "shown"}
+                variant="desktop"
+                onChange={(checked) => field.onChange(checked ? "shown" : "hidden")}
+              />
+            </Box>
+          ) : field.kind === "panel" ? (
+            <Box flexDirection="row" width="100%" style={{ gap: 6 }}>
+              <Box flexGrow={1} minWidth={0}>
+                <NativeSelect
+                  value={field.value}
+                  options={field.options}
+                  width="100%"
+                  onChange={field.onChange}
+                />
+              </Box>
+              <Button label="New Panel" onPress={field.onAddPanel} />
+            </Box>
+          ) : (
+            <NativeSelect
+              value={field.value}
+              options={field.options}
+              width="100%"
+              onChange={field.onChange}
+            />
+          )}
+        </DesktopEditorField>
+      ))}
+    </Box>
+  );
+}
+
+export function DesktopSeriesEditorActions({ actions }: { actions: SeriesEditorActionModel[] }) {
+  const seriesActions = actions.filter((action) => action.group === "series");
+  const confirmActions = actions.filter((action) => action.group === "confirm");
+  return (
+    <Box flexDirection="row" gap={1} width="100%" style={{ gap: 6, paddingTop: 2 }}>
+      <Box flexDirection="row" style={{ gap: 6 }}>
+        {seriesActions.map((action) => (
+          <Button
+            key={action.id}
+            label={action.label}
+            variant={action.variant}
+            disabled={action.disabled}
+            onPress={action.onPress}
+          />
+        ))}
+      </Box>
+      <Box flexGrow={1} />
+      <Box flexDirection="row" style={{ gap: 6 }}>
+        {confirmActions.map((action) => (
+          <Button
+            key={action.id}
+            label={action.label}
+            variant={action.variant}
+            disabled={action.disabled}
+            onPress={action.onPress}
+          />
+        ))}
+      </Box>
+    </Box>
+  );
+}

package/src/plugins/builtin/chart-composer/editor/model.test.ts

@@ -0,0 +1,85 @@
+import { describe, expect, test } from "bun:test";
+import { appendChartSeries, buildFundamentalChartPreset, buildPriceChartPreset } from "../presets";
+import {
+  buildSeriesEditorActions,
+  buildSeriesEditorFields,
+  type SeriesEditorActionHandlers,
+  type SeriesEditorFieldHandlers,
+} from "./model";
+
+const fieldHandlers: SeriesEditorFieldHandlers = {
+  setStyle() {},
+  setTransform() {},
+  setAxis() {},
+  setVisibility() {},
+  setPanel() {},
+  addPanel() {},
+  setScale() {},
+  setPeriod() {},
+  setTimestampMode() {},
+};
+
+const actionHandlers: SeriesEditorActionHandlers = {
+  add() {},
+  remove() {},
+  moveUp() {},
+  moveDown() {},
+  cancel() {},
+  save() {},
+};
+
+describe("series editor model", () => {
+  test("builds the full fundamental field sequence and guards the final visible series", () => {
+    const draft = buildFundamentalChartPreset(["AAPL"]);
+    const fields = buildSeriesEditorFields({
+      draft,
+      selected: draft.series[0]!,
+      handlers: fieldHandlers,
+    });
+
+    expect(fields.map((field) => field.id)).toEqual([
+      "style",
+      "transform",
+      "axis",
+      "visibility",
+      "panel",
+      "scale",
+      "period",
+      "timing",
+    ]);
+    expect(fields.find((field) => field.id === "visibility")?.options).toEqual([
+      { value: "shown", label: "Shown" },
+      { value: "hidden", label: "Hidden", disabled: true },
+    ]);
+  });
+
+  test("keeps series actions aligned with selection and final-series boundaries", () => {
+    const single = buildPriceChartPreset("AAPL");
+    const singleActions = buildSeriesEditorActions({
+      draft: single,
+      selected: single.series[0]!,
+      selectedIndex: 0,
+      handlers: actionHandlers,
+    });
+    expect(singleActions.filter((action) => action.disabled).map((action) => action.id)).toEqual([
+      "remove",
+      "move-up",
+      "move-down",
+    ]);
+
+    const appended = appendChartSeries(single, {
+      kind: "security",
+      symbol: "MSFT",
+      fieldId: "market.ohlcv",
+    }).spec;
+    const appendedActions = buildSeriesEditorActions({
+      draft: appended,
+      selected: appended.series[1]!,
+      selectedIndex: 1,
+      handlers: actionHandlers,
+    });
+    expect(appendedActions.filter((action) => action.disabled).map((action) => action.id)).toEqual([
+      "move-down",
+    ]);
+  });
+});

package/src/plugins/builtin/chart-composer/editor/model.ts

@@ -0,0 +1,292 @@
+import { isFundamentalFieldId } from "../../../../time-series/field-catalog";
+import type {
+  ChartSeriesSpec,
+  ChartSpec,
+  PanelScale,
+  SeriesAxis,
+  SeriesPeriod,
+  SeriesStyle,
+  SeriesTimestampMode,
+  SeriesTransform,
+} from "../../../../time-series/types";
+import { canToggleChartSeries, MAX_CHART_COMPOSER_SERIES } from "../chart-spec";
+import {
+  defaultFinancialTimestampMode,
+  getCompatibleSeriesStyles,
+  getCompatibleSeriesTransforms,
+} from "../presets";
+
+export type SeriesEditorFieldId =
+  | "style"
+  | "transform"
+  | "axis"
+  | "visibility"
+  | "panel"
+  | "scale"
+  | "period"
+  | "timing";
+
+export type SeriesEditorFocus = "add" | "series" | "source" | SeriesEditorFieldId;
+
+export interface SeriesEditorOption {
+  value: string;
+  label: string;
+  disabled?: boolean;
+}
+
+export interface SeriesEditorFieldModel {
+  id: SeriesEditorFieldId;
+  label: string;
+  kind: "select" | "visibility" | "panel";
+  value: string;
+  options: SeriesEditorOption[];
+  onChange(value: string): void;
+  onAddPanel?: () => void;
+}
+
+export interface SeriesEditorActionModel {
+  id: "add" | "remove" | "move-up" | "move-down" | "cancel" | "save";
+  label: string;
+  group: "series" | "confirm";
+  variant?: "danger" | "ghost" | "primary";
+  shortcut?: string;
+  disabled?: boolean;
+  onPress(): void;
+}
+
+const AXES: SeriesAxis[] = ["auto", "left", "right"];
+const MARKET_PERIODS: SeriesPeriod[] = ["auto", "daily", "weekly", "monthly", "quarterly", "annual"];
+const FINANCIAL_PERIODS: SeriesPeriod[] = ["auto", "quarterly", "annual", "ttm"];
+const TIMING_OPTIONS: Array<{ value: SeriesTimestampMode; label: string }> = [
+  { value: "available-at", label: "Available Date" },
+  { value: "period-end", label: "Period End" },
+];
+
+export function titleCaseSeriesEditorValue(value: string): string {
+  return value
+    .replaceAll("-", " ")
+    .replace(/\b\w/g, (character) => character.toUpperCase());
+}
+
+function seriesFieldId(series: ChartSeriesSpec): string {
+  return series.source.kind === "security" ? series.source.fieldId : series.source.seriesId;
+}
+
+function compatiblePeriods(series: ChartSeriesSpec): SeriesPeriod[] {
+  if (series.source.kind !== "security") return [];
+  return series.source.fieldId.startsWith("market.") ? MARKET_PERIODS : FINANCIAL_PERIODS;
+}
+
+export function supportsSeriesTimestampMode(series: ChartSeriesSpec | null): boolean {
+  return !!series
+    && series.source.kind === "security"
+    && isFundamentalFieldId(series.source.fieldId);
+}
+
+export function getSeriesEditorFieldIds(selected: ChartSeriesSpec | null): SeriesEditorFieldId[] {
+  if (!selected) return [];
+  return [
+    "style",
+    "transform",
+    "axis",
+    "visibility",
+    "panel",
+    "scale",
+    ...(selected.source.kind === "security" ? ["period" as const] : []),
+    ...(supportsSeriesTimestampMode(selected) ? ["timing" as const] : []),
+  ];
+}
+
+export function getSeriesTimestampMode(series: ChartSeriesSpec): SeriesTimestampMode {
+  return series.source.kind === "security"
+    ? series.source.timestampMode
+      ?? defaultFinancialTimestampMode(series.source.fieldId)
+      ?? "available-at"
+    : "available-at";
+}
+
+export interface SeriesEditorFieldHandlers {
+  setStyle(value: SeriesStyle): void;
+  setTransform(value: SeriesTransform): void;
+  setAxis(value: SeriesAxis): void;
+  setVisibility(visible: boolean): void;
+  setPanel(panelId: string): void;
+  addPanel(): void;
+  setScale(scale: PanelScale): void;
+  setPeriod(period: SeriesPeriod): void;
+  setTimestampMode(mode: SeriesTimestampMode): void;
+}
+
+export function buildSeriesEditorFields({
+  draft,
+  selected,
+  handlers,
+}: {
+  draft: ChartSpec;
+  selected: ChartSeriesSpec | null;
+  handlers: SeriesEditorFieldHandlers;
+}): SeriesEditorFieldModel[] {
+  if (!selected) return [];
+  const fieldId = seriesFieldId(selected);
+  const selectedPanel = draft.panels.find((panel) => panel.id === selected.panelId);
+  const fields: SeriesEditorFieldModel[] = [
+    {
+      id: "style",
+      label: "Style",
+      kind: "select",
+      value: selected.style,
+      options: getCompatibleSeriesStyles(fieldId).map((value) => ({
+        value,
+        label: titleCaseSeriesEditorValue(value),
+      })),
+      onChange: (value) => handlers.setStyle(value as SeriesStyle),
+    },
+    {
+      id: "transform",
+      label: "Transform",
+      kind: "select",
+      value: selected.transform,
+      options: getCompatibleSeriesTransforms(fieldId).map((value) => ({
+        value,
+        label: value === "index100" ? "Index 100" : value.toUpperCase(),
+      })),
+      onChange: (value) => handlers.setTransform(value as SeriesTransform),
+    },
+    {
+      id: "axis",
+      label: "Axis",
+      kind: "select",
+      value: selected.axis,
+      options: AXES.map((value) => ({ value, label: titleCaseSeriesEditorValue(value) })),
+      onChange: (value) => handlers.setAxis(value as SeriesAxis),
+    },
+    {
+      id: "visibility",
+      label: "Visibility",
+      kind: "visibility",
+      value: selected.visible === false ? "hidden" : "shown",
+      options: [
+        { value: "shown", label: "Shown" },
+        {
+          value: "hidden",
+          label: "Hidden",
+          disabled: selected.visible !== false && !canToggleChartSeries(draft, selected.id),
+        },
+      ],
+      onChange: (value) => handlers.setVisibility(value !== "hidden"),
+    },
+    {
+      id: "panel",
+      label: "Panel",
+      kind: "panel",
+      value: selected.panelId,
+      options: draft.panels.map((panel) => ({
+        value: panel.id,
+        label: panel.label ?? titleCaseSeriesEditorValue(panel.id),
+      })),
+      onChange: handlers.setPanel,
+      onAddPanel: handlers.addPanel,
+    },
+    {
+      id: "scale",
+      label: `Scale (${selectedPanel?.label ?? selected.panelId})`,
+      kind: "select",
+      value: selectedPanel?.scale ?? "linear",
+      options: [
+        { value: "linear", label: "Linear" },
+        { value: "log", label: "Log" },
+      ],
+      onChange: (value) => handlers.setScale(value as PanelScale),
+    },
+    ...(selected.source.kind === "security" ? [{
+      id: "period" as const,
+      label: "Period",
+      kind: "select" as const,
+      value: selected.source.period ?? "auto",
+      options: compatiblePeriods(selected).map((value) => ({
+        value,
+        label: value === "ttm" ? "TTM" : titleCaseSeriesEditorValue(value),
+      })),
+      onChange: (value: string) => handlers.setPeriod(value as SeriesPeriod),
+    }] : []),
+    ...(supportsSeriesTimestampMode(selected) ? [{
+      id: "timing" as const,
+      label: "Timing",
+      kind: "select" as const,
+      value: getSeriesTimestampMode(selected),
+      options: TIMING_OPTIONS,
+      onChange: (value: string) => handlers.setTimestampMode(value as SeriesTimestampMode),
+    }] : []),
+  ];
+  const fieldsById = new Map(fields.map((field) => [field.id, field]));
+  return getSeriesEditorFieldIds(selected).map((id) => fieldsById.get(id)!);
+}
+
+export interface SeriesEditorActionHandlers {
+  add(): void;
+  remove(): void;
+  moveUp(): void;
+  moveDown(): void;
+  cancel(): void;
+  save(): void;
+}
+
+export function buildSeriesEditorActions({
+  draft,
+  selected,
+  selectedIndex,
+  handlers,
+}: {
+  draft: ChartSpec;
+  selected: ChartSeriesSpec | null;
+  selectedIndex: number;
+  handlers: SeriesEditorActionHandlers;
+}): SeriesEditorActionModel[] {
+  return [
+    {
+      id: "add",
+      label: "Add Series",
+      group: "series",
+      shortcut: "A",
+      disabled: draft.series.length >= MAX_CHART_COMPOSER_SERIES,
+      onPress: handlers.add,
+    },
+    {
+      id: "remove",
+      label: "Remove",
+      group: "series",
+      variant: "danger",
+      shortcut: "D",
+      disabled: !selected || draft.series.length <= 1,
+      onPress: handlers.remove,
+    },
+    {
+      id: "move-up",
+      label: "Move Up",
+      group: "series",
+      disabled: selectedIndex <= 0,
+      onPress: handlers.moveUp,
+    },
+    {
+      id: "move-down",
+      label: "Move Down",
+      group: "series",
+      disabled: selectedIndex < 0 || selectedIndex >= draft.series.length - 1,
+      onPress: handlers.moveDown,
+    },
+    {
+      id: "cancel",
+      label: "Cancel",
+      group: "confirm",
+      variant: "ghost",
+      onPress: handlers.cancel,
+    },
+    {
+      id: "save",
+      label: "Save",
+      group: "confirm",
+      variant: "primary",
+      onPress: handlers.save,
+    },
+  ];
+}

package/src/plugins/builtin/chart-composer/editor/opentui-view.tsx

@@ -0,0 +1,108 @@
+import { type ReactNode } from "react";
+import { Box, Text } from "../../../../ui";
+import { SegmentedControl } from "../../../../components";
+import { Button } from "../../../../components/ui";
+import { colors } from "../../../../theme/colors";
+import type {
+  SeriesEditorActionModel,
+  SeriesEditorFieldModel,
+  SeriesEditorFocus,
+} from "./model";
+
+function TuiEditorField({
+  label,
+  focused,
+  onFocus,
+  children,
+}: {
+  label: string;
+  focused: boolean;
+  onFocus: () => void;
+  children: ReactNode;
+}) {
+  return (
+    <Box
+      flexDirection="column"
+      width="100%"
+      overflow="hidden"
+      onMouseDown={onFocus}
+    >
+      <Text fg={focused ? colors.textBright : colors.textDim}>
+        {focused ? `› ${label}` : label}
+      </Text>
+      {children}
+    </Box>
+  );
+}
+
+export function OpenTuiSeriesEditorFields({
+  fields,
+  keyboardFocus,
+  dialogId,
+  onFocus,
+}: {
+  fields: SeriesEditorFieldModel[];
+  keyboardFocus: SeriesEditorFocus;
+  dialogId?: string;
+  onFocus: (focus: SeriesEditorFocus) => void;
+}) {
+  return (
+    <>
+      {fields.map((field) => {
+        const focused = keyboardFocus === field.id;
+        return (
+          <TuiEditorField
+            key={field.id}
+            label={field.label}
+            focused={focused}
+            onFocus={() => onFocus(field.id)}
+          >
+            {field.kind === "panel" ? (
+              <Box flexDirection="row" width="100%" minWidth={0} gap={1} overflow="hidden">
+                <Box flexGrow={1} minWidth={0} overflow="hidden">
+                  <SegmentedControl
+                    options={field.options}
+                    value={field.value}
+                    onChange={field.onChange}
+                    focused={focused}
+                    shortcutScope={dialogId}
+                    width="100%"
+                    wrap
+                  />
+                </Box>
+                <Button label="New Panel" shortcut="N" onPress={field.onAddPanel} />
+              </Box>
+            ) : (
+              <SegmentedControl
+                options={field.options}
+                value={field.value}
+                onChange={field.onChange}
+                focused={focused}
+                shortcutScope={dialogId}
+                width="100%"
+                wrap
+              />
+            )}
+          </TuiEditorField>
+        );
+      })}
+    </>
+  );
+}
+
+export function OpenTuiSeriesEditorActions({ actions }: { actions: SeriesEditorActionModel[] }) {
+  return (
+    <Box flexDirection="row" gap={1} width="100%">
+      {actions.map((action) => (
+        <Button
+          key={action.id}
+          label={action.label}
+          shortcut={action.shortcut}
+          variant={action.variant}
+          disabled={action.disabled}
+          onPress={action.onPress}
+        />
+      ))}
+    </Box>
+  );
+}