@marimo-team/islands 0.24.1-dev20 → 0.24.1-dev21

package/dist/{vega-component-CioKuDut.js → vega-component-CTiCS_5w.js}

@@ -12,10 +12,10 @@ import { t as debounce_default } from "./debounce-D784bpms.js";
 import { A as useEvent_default, n as useTheme } from "./useTheme-BzEXeAR5.js";
 import { s as uniq } from "./arrays-C56grfjL.js";
 import { t as Objects } from "./objects-UzwQd5gx.js";
-import { a as isValid, i as AlertTitle, n as Alert, t as arrow } from "./formats-Dz0QNUEa.js";
-import { A as getContainerWidth, n as formats } from "./vega-loader.browser-CGb-2Kwi.js";
-import { a as tooltipHandler, n as vegaLoadData } from "./loader-DTnbNSVZ.js";
-import { t as j } from "./react-vega-zyfTF9SY.js";
+import { a as isValid, i as AlertTitle, n as Alert, t as arrow } from "./formats-BZtMpeQe.js";
+import { A as getContainerWidth, n as formats } from "./vega-loader.browser-VFQfHaoV.js";
+import { a as tooltipHandler, n as vegaLoadData } from "./loader-Chm6nOqy.js";
+import { t as j } from "./react-vega-BE2Uv1cq.js";
 import "./defaultLocale-CMezyvMc.js";
 import "./defaultLocale-DMZFeDB8.js";
 import { t as useAsyncData } from "./useAsyncData-CDcbh-Qv.js";

package/dist/{vega-embed-container-BRjjqRGz.js → vega-embed-container-B1tc-DoN.js}

@@ -2,8 +2,8 @@ import { o as __toESM } from "./chunk-Bfp04NdC.js";
 import { t as require_react } from "./react-DhGsCS90.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-DsR6imPN.js";
 import { t as require_jsx_runtime } from "./jsx-runtime-Dp_oQwaf.js";
-import { A as getContainerWidth } from "./vega-loader.browser-CGb-2Kwi.js";
-import { n as q } from "./react-vega-zyfTF9SY.js";
+import { A as getContainerWidth } from "./vega-loader.browser-VFQfHaoV.js";
+import { n as q } from "./react-vega-BE2Uv1cq.js";
 import "./defaultLocale-CMezyvMc.js";
 import "./defaultLocale-DMZFeDB8.js";
 import { t as useVegaContainerRemeasure } from "./use-vega-container-remeasure-B7OD7yUY.js";

package/dist/{vega-loader.browser-CGb-2Kwi.js → vega-loader.browser-VFQfHaoV.js}

@@ -410,7 +410,7 @@ function getContainerWidth(o) {
   }
 }
 function getVegaFieldTypes(F) {
-  return !F || Object.keys(F).length === 0 ? "auto" : Objects.mapValues(F, (o) => o === "date" || o === "time" ? "string" : o === "datetime" ? "date" : o);
+  return !F || Object.keys(F).length === 0 ? "auto" : Objects.mapValues(F, (o) => o === "geometry" || o === "date" || o === "time" ? "string" : o === "datetime" ? "date" : o);
 }
 var EOL = {}, EOF = {}, QUOTE = 34, NEWLINE = 10, RETURN = 13;
 function objectConverter(o) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marimo-team/islands",
-  "version": "0.24.1-dev20",
+  "version": "0.24.1-dev21",
   "main": "dist/main.js",
   "types": "dist/index.d.ts",
   "type": "module",

package/src/components/data-table/__tests__/column_formatting.test.ts

@@ -5,6 +5,7 @@ import {
   prettyScientificNumber,
 } from "@/utils/numbers";
 import { applyFormat } from "../column-formatting/feature";
+import { formatOptions } from "../column-formatting/types";
 
 const locale = "en-US";
 
@@ -128,3 +129,9 @@ describe("applyFormat", () => {
     ).toBe(123);
   });
 });
+
+describe("formatOptions", () => {
+  it("has no geometry format options", () => {
+    expect(formatOptions.geometry).toEqual([]);
+  });
+});

package/src/components/data-table/charts/__tests__/schemas.test.ts

@@ -14,7 +14,7 @@ describe("ChartSchema", () => {
 
   it("normalizes an unrecognized axis column type", () => {
     const result = ChartSchema.parse({
-      general: { xColumn: { field: "geom", type: "geometry" } },
+      general: { xColumn: { field: "geom", type: "bogus_type" } },
     });
 
     expect(result.general?.xColumn?.type).toBe("unknown");
@@ -24,7 +24,7 @@ describe("ChartSchema", () => {
     const result = ChartSchema.parse({
       tooltips: {
         auto: false,
-        fields: [{ field: "geom", type: "geometry" }],
+        fields: [{ field: "geom", type: "bogus_type" }],
       },
     });
 
@@ -32,4 +32,19 @@ describe("ChartSchema", () => {
       { field: "geom", type: "unknown" },
     ]);
   });
+
+  it("keeps geometry axis and tooltip field types", () => {
+    const result = ChartSchema.parse({
+      general: { xColumn: { field: "geom", type: "geometry" } },
+      tooltips: {
+        auto: false,
+        fields: [{ field: "geom", type: "geometry" }],
+      },
+    });
+
+    expect(result.general?.xColumn?.type).toBe("geometry");
+    expect(result.tooltips?.fields).toEqual([
+      { field: "geom", type: "geometry" },
+    ]);
+  });
 });

package/src/components/data-table/charts/chart-spec/types.ts

@@ -29,6 +29,7 @@ export function convertDataTypeToVega(
       return "quantitative";
     case "string":
     case "boolean":
+    case "geometry":
     case "unknown":
       return "nominal";
     case "date":
@@ -51,6 +52,7 @@ export function convertDataTypeToSelectable(
       return "number";
     case "string":
     case "boolean":
+    case "geometry":
     case "unknown":
       return "string";
     case "date":

package/src/components/data-table/column-formatting/feature.ts

@@ -214,6 +214,7 @@ export const applyFormat = (
           return value;
       }
     case undefined:
+    case "geometry":
     case "unknown":
       return value;
     default:

package/src/components/data-table/column-formatting/types.ts

@@ -13,6 +13,7 @@ export const formatOptions = {
   number: ["Auto", "Percent", "Scientific", "Engineering", "Integer"],
   string: ["Uppercase", "Lowercase", "Capitalize", "Title"],
   boolean: ["Yes/No", "On/Off"],
+  geometry: [],
   unknown: [],
 } as const satisfies Record<DataType, string[]>;
 

package/src/components/data-table/column-summary/chart-spec-model.tsx

@@ -836,6 +836,7 @@ export class ColumnChartSpecModel<T> {
           transform: transforms,
         };
       }
+      case "geometry":
       case "unknown":
         return null;
       default:

package/src/components/data-table/column-summary/column-summary.tsx

@@ -155,6 +155,7 @@ export const TableColumnSummary = <TData, TValue>({
           );
         }
         return null;
+      case "geometry":
       case "unknown":
         return (
           <div className="flex flex-col whitespace-pre">

package/src/components/data-table/columns.tsx

@@ -320,9 +320,8 @@ export function generateColumns<T>({
       },
       // Remove any default filtering
       filterFn: undefined,
-      // Can only sort if key is defined
-      // For example, unnamed index columns, won't be sortable
-      enableSorting: !!key,
+      // Unnamed index columns and geometry columns are not sortable
+      enableSorting: !!key && getMeta(key).dataType !== "geometry",
       meta: {
         ...getMeta(key),
         width: columnWidths?.[key],
@@ -485,6 +484,8 @@ function getFilterTypeForFieldType(
       return "time";
     case "boolean":
       return "boolean";
+    case "geometry":
+      return undefined;
     default:
       return undefined;
   }

package/src/components/datasets/__tests__/icons.test.ts

@@ -2,7 +2,7 @@
 
 import { describe, expect, it } from "vitest";
 import type { DataType } from "@/core/kernel/messages";
-import { DATA_TYPE_ICON, resolveDataType } from "../icons";
+import { DATA_TYPE_ICON, getDataTypeColor, resolveDataType } from "../icons";
 
 describe("resolveDataType", () => {
   it("passes through every mapped data type", () => {
@@ -12,7 +12,15 @@ describe("resolveDataType", () => {
   });
 
   it("resolves unmapped data types to unknown", () => {
-    expect(resolveDataType("geometry" as DataType)).toBe("unknown");
+    expect(resolveDataType("bogus_type" as DataType)).toBe("unknown");
+  });
+
+  it("resolves geometry with its icon and color", () => {
+    expect(resolveDataType("geometry")).toBe("geometry");
+    expect(DATA_TYPE_ICON.geometry).toBeDefined();
+    expect(getDataTypeColor("geometry")).toBe(
+      "bg-(--cyan-4) dark:bg-(--cyan-5)",
+    );
   });
 
   it("resolves data types shadowing Object.prototype keys to unknown", () => {

package/src/components/datasets/icons.tsx

@@ -7,6 +7,7 @@ import {
   CurlyBracesIcon,
   HashIcon,
   type LucideIcon,
+  MapPinIcon,
   ToggleLeftIcon,
   TypeIcon,
 } from "lucide-react";
@@ -27,6 +28,7 @@ export const DATA_TYPE_ICON: Record<DataType | SelectableDataType, LucideIcon> =
     number: HashIcon,
     string: TypeIcon,
     integer: HashIcon,
+    geometry: MapPinIcon,
     unknown: CurlyBracesIcon,
   };
 
@@ -56,6 +58,8 @@ export function getDataTypeColor(
       return "bg-(--purple-4)";
     case "string":
       return "bg-(--blue-4)";
+    case "geometry":
+      return "bg-(--cyan-4) dark:bg-(--cyan-5)";
     case "unknown":
       return "bg-(--slate-4) dark:bg-(--slate-6)";
     default:

package/src/components/datasources/__tests__/components.test.tsx

@@ -12,7 +12,7 @@ describe("ColumnName", () => {
 
     try {
       const unrecognized = render(
-        <ColumnName columnName="geom" dataType={"geometry" as DataType} />,
+        <ColumnName columnName="geom" dataType={"bogus_type" as DataType} />,
       );
       const unknown = render(
         <ColumnName columnName="geom" dataType="unknown" />,
@@ -26,4 +26,17 @@ describe("ColumnName", () => {
       warn.mockRestore();
     }
   });
+
+  it("renders geometry with a distinct icon", () => {
+    const geometry = render(
+      <ColumnName columnName="geom" dataType="geometry" />,
+    );
+    const unknown = render(<ColumnName columnName="geom" dataType="unknown" />);
+
+    expect(geometry.container.querySelector(".lucide-map-pin")).not.toBeNull();
+    expect(unknown.container.querySelector(".lucide-braces")).not.toBeNull();
+    expect(geometry.container.innerHTML).not.toEqual(
+      unknown.container.innerHTML,
+    );
+  });
 });

package/src/core/codemirror/language/languages/sql/__tests__/renderers.test.tsx

@@ -9,13 +9,18 @@ import type {
 } from "@/core/kernel/messages";
 import { renderColumnInfo, renderTableInfo } from "../renderers";
 
-const geometryColumn = {
+const bogusColumn = {
   name: "geom",
-  type: "geometry" as DataType,
+  type: "bogus_type" as DataType,
   external_type: "geometry",
   sample_values: [],
 } as DataTableColumn;
 
+const geometryColumn = {
+  ...bogusColumn,
+  type: "geometry" as DataType,
+} as DataTableColumn;
+
 describe("SQL renderers", () => {
   it("renders table information with an unrecognized column type", () => {
     const table: DataTable = {
@@ -26,7 +31,7 @@ describe("SQL renderers", () => {
       num_rows: null,
       num_columns: 1,
       variable_name: null,
-      columns: [geometryColumn],
+      columns: [bogusColumn],
       primary_keys: [],
       indexes: [],
     };
@@ -37,8 +42,14 @@ describe("SQL renderers", () => {
   });
 
   it("renders column information with an unrecognized column type", () => {
-    const result = render(renderColumnInfo(geometryColumn));
+    const result = render(renderColumnInfo(bogusColumn));
 
     expect(result.container.querySelector("svg")).not.toBeNull();
   });
+
+  it("renders geometry column information with the map pin icon", () => {
+    const result = render(renderColumnInfo(geometryColumn));
+
+    expect(result.container.querySelector(".lucide-map-pin")).not.toBeNull();
+  });
 });

package/src/core/codemirror/language/languages/sql/renderers.tsx

@@ -41,6 +41,7 @@ const DATA_TYPE_COLORS: Record<DataType, string> = {
   number: "bg-(--purple-4) text-(--purple-11)",
   integer: "bg-(--purple-4) text-(--purple-11)",
   string: "bg-(--blue-4) text-(--blue-11)",
+  geometry: "bg-(--cyan-4) text-(--cyan-11)",
   unknown: "bg-(--slate-4) text-(--slate-11)",
 };
 

package/src/core/kernel/messages.ts

@@ -11,6 +11,7 @@ export const DATA_TYPES = [
   "date",
   "datetime",
   "time",
+  "geometry",
   "unknown",
 ] as const;
 export type ModelLifecycle = NotificationMessageData<"model-lifecycle">;

package/src/plugins/impl/__tests__/DataEditorPlugin.test.ts

@@ -9,10 +9,22 @@ describe("DataEditorPlugin", () => {
       initialValue: { edits: [] },
       label: null,
       data: [],
-      fieldTypes: [["geom", ["geometry", "geometry"]]],
+      fieldTypes: [["geom", ["bogus_type", "geometry"]]],
       editableColumns: "all",
     });
 
     expect(result.fieldTypes).toEqual([["geom", ["unknown", "geometry"]]]);
   });
+
+  it("keeps the geometry field type", () => {
+    const result = DataEditorPlugin.validator.parse({
+      initialValue: { edits: [] },
+      label: null,
+      data: [],
+      fieldTypes: [["geom", ["geometry", "geometry"]]],
+      editableColumns: "all",
+    });
+
+    expect(result.fieldTypes).toEqual([["geom", ["geometry", "geometry"]]]);
+  });
 });

package/src/plugins/impl/data-editor/glide-data-editor.tsx

@@ -390,6 +390,7 @@ export const GlideDataEditor = <T,>({
             // TODO: Handle specific types
             return [column.title, new Date()];
           case "string":
+          case "geometry":
           case "unknown":
             return [column.title, ""];
           default:

package/src/plugins/impl/data-editor/glide-utils.ts

@@ -43,6 +43,7 @@ export function getColumnHeaderIcon(fieldType: DataType): GridColumnIcon {
       return GridColumnIcon.HeaderDate;
     case "time":
       return GridColumnIcon.HeaderTime;
+    case "geometry":
     case "unknown":
       return GridColumnIcon.HeaderString;
     default:

package/src/plugins/impl/data-frames/__tests__/schema.test.ts

@@ -18,7 +18,7 @@ describe("columnToFieldTypesSchema", () => {
 
   it("normalizes an unrecognized field type without discarding other fields", () => {
     const result = columnToFieldTypesSchema.parse([
-      ["geom", ["geometry", "geometry"]],
+      ["geom", ["bogus_type", "geometry"]],
       ["label", ["string", "object"]],
     ]);
 
@@ -27,4 +27,12 @@ describe("columnToFieldTypesSchema", () => {
       ["label", ["string", "object"]],
     ]);
   });
+
+  it("keeps the geometry field type", () => {
+    const result = columnToFieldTypesSchema.parse([
+      ["geom", ["geometry", "geometry"]],
+    ]);
+
+    expect(result).toEqual([["geom", ["geometry", "geometry"]]]);
+  });
 });

package/src/plugins/impl/data-frames/utils/__tests__/operators.test.ts

@@ -60,6 +60,10 @@ describe("getOperatorForDtype", () => {
   it("should return empty array for unknown dtype", () => {
     expect(getOperatorForDtype("unknown")).toEqual([]);
   });
+
+  it("should return no operators for geometry", () => {
+    expect(getOperatorForDtype("geometry")).toEqual([]);
+  });
 });
 
 describe("getSchemaForOperator", () => {
@@ -87,6 +91,10 @@ describe("getSchemaForOperator", () => {
     expect(getSchemaForOperator("unknown", "==")).toEqual([]);
     expect(getSchemaForOperator("int", "unknown")).toEqual([]);
   });
+
+  it("should return no operand schema for geometry", () => {
+    expect(getSchemaForOperator("geometry", "==")).toEqual([]);
+  });
 });
 
 describe("isConditionValueValid", () => {

package/src/plugins/impl/data-frames/utils/operators.ts

@@ -76,7 +76,7 @@ export const ALL_OPERATORS = {
 
 export type OperatorType = keyof typeof ALL_OPERATORS;
 
-function numpyTypeToDataType(type: string): DataType {
+function numpyTypeToDataType(type: string): Exclude<DataType, "geometry"> {
   if (!type) {
     return "unknown";
   }

package/src/plugins/impl/vega/__tests__/vega.test.ts

@@ -7,6 +7,7 @@ import {
   vegaLoadData,
   vegaLoader,
 } from "../loader";
+import { getVegaFieldTypes } from "../utils";
 
 const { ZERO_WIDTH_SPACE, replacePeriodsInColumnNames, uniquifyColumnNames } =
   exportedForTesting;
@@ -102,15 +103,32 @@ yield_error,yield_center
     `);
   });
 
-  it.each(DATA_TYPES)("should handle %s data-type", async (type) => {
-    const csvData = "name,value_column\nAlice,1";
+  it.each(DATA_TYPES.filter((type) => type !== "geometry"))(
+    "should handle %s data-type",
+    async (type) => {
+      const csvData = "name,value_column\nAlice,1";
+      vi.spyOn(vegaLoader, "load").mockReturnValue(Promise.resolve(csvData));
+
+      const result = await vegaLoadData(csvData, {
+        type: "csv",
+        parse: { value_column: type },
+      });
+      expect(result.length).toEqual(1);
+    },
+  );
+
+  it("should parse geometry as a WKT string", async () => {
+    const csvData = "name,value_column\nAlice,POINT (0 0)";
     vi.spyOn(vegaLoader, "load").mockReturnValue(Promise.resolve(csvData));
 
+    const fieldTypes = getVegaFieldTypes({ value_column: "geometry" });
+    expect(fieldTypes).toEqual({ value_column: "string" });
+
     const result = await vegaLoadData(csvData, {
       type: "csv",
-      parse: { value_column: type },
+      parse: fieldTypes,
     });
-    expect(result.length).toEqual(1);
+    expect(result).toEqual([{ name: "Alice", value_column: "POINT (0 0)" }]);
   });
 
   it("should parse csv data with out of bound integers", async () => {

package/src/plugins/impl/vega/utils.ts

@@ -55,6 +55,9 @@ export function getVegaFieldTypes(
   // the correct formatting. For example, a date like '2024-01-01' will
   // be formatted to '2024-01-01T00:00:00.000Z'.
   return Objects.mapValues(types, (type): VegaDataType => {
+    if (type === "geometry") {
+      return "string";
+    }
     if (type === "date") {
       return "string";
     }