@geogdev/styles 0.1.0

package/src/layers/transit.ts

@@ -0,0 +1,232 @@
+import type { LayerSpecification } from "@maplibre/maplibre-gl-style-spec";
+import { ZOOM } from "../constants";
+import type { Style } from "../styles";
+
+/**
+ * Creates transit infrastructure layers (rail, bus, ferry)
+ * Progressive disclosure: main rail z10, freight z11, heritage/bus z13
+ */
+export function createTransitLayers(
+  source: string,
+  style: Style,
+): LayerSpecification[] {
+  return [
+    // 1. Freight rail - darker, wider, dashed (z11+)
+    {
+      id: "transit_freight_rail",
+      type: "line",
+      source,
+      "source-layer": "transportation",
+      minzoom: ZOOM.TRANSIT_FREIGHT_RAIL_MIN,
+      filter: [
+        "all",
+        ["==", ["get", "class"], "rail"],
+        ["==", ["get", "usage"], "freight"],
+        ["!", ["has", "service"]], // Exclude service tracks
+      ],
+      paint: {
+        "line-color":
+          style.transit_freight || style.transit_rail || style.railway,
+        "line-width": [
+          "interpolate",
+          ["exponential", 1.4],
+          ["zoom"],
+          11,
+          1.5,
+          13,
+          2.5,
+          16,
+          4.5,
+        ],
+        "line-dasharray": [0.5, 1.5],
+        "line-opacity": 0.6,
+      },
+    },
+
+    // 2. Bus infrastructure - orange, dashed, subtle (z13+)
+    {
+      id: "transit_bus_infrastructure",
+      type: "line",
+      source,
+      "source-layer": "transportation",
+      minzoom: ZOOM.TRANSIT_BUS_MIN,
+      filter: ["==", ["get", "class"], "bus"],
+      paint: {
+        "line-color": style.transit_bus || style.transit_rail || style.railway,
+        "line-width": [
+          "interpolate",
+          ["exponential", 1.4],
+          ["zoom"],
+          13,
+          1.2,
+          15,
+          2.0,
+          18,
+          4.0,
+        ],
+        "line-dasharray": [2, 1],
+        "line-opacity": 0.6,
+      },
+    },
+
+    // 3. Heritage/tourist rail - decorative dotted pattern (z13+)
+    {
+      id: "transit_heritage_rail",
+      type: "line",
+      source,
+      "source-layer": "transportation",
+      minzoom: ZOOM.TRANSIT_HERITAGE_MIN,
+      filter: [
+        "all",
+        ["==", ["get", "class"], "rail"],
+        ["==", ["get", "usage"], "heritage"],
+      ],
+      paint: {
+        "line-color":
+          style.transit_heritage || style.transit_rail || style.railway,
+        "line-width": 1.8,
+        "line-dasharray": [0.5, 0.5],
+        "line-opacity": 0.5,
+      },
+    },
+
+    // 4. Mixed-use rail corridors - intermediate styling (z11+)
+    {
+      id: "transit_mixed_rail",
+      type: "line",
+      source,
+      "source-layer": "transportation",
+      minzoom: ZOOM.TRANSIT_MIXED_RAIL_MIN,
+      filter: [
+        "all",
+        ["==", ["get", "class"], "rail"],
+        ["==", ["get", "usage"], "mixed"],
+      ],
+      paint: {
+        "line-color": style.transit_rail || style.railway,
+        "line-width": [
+          "interpolate",
+          ["exponential", 1.4],
+          ["zoom"],
+          11,
+          1.5,
+          13,
+          2.2,
+          16,
+          4.0,
+        ],
+        "line-dasharray": [0.4, 0.4],
+        "line-opacity": 0.6,
+      },
+    },
+
+    // 5. Urban transit (subway, light_rail, tram, monorail) - z11+
+    {
+      id: "transit_urban_rail",
+      type: "line",
+      source,
+      "source-layer": "transportation",
+      minzoom: ZOOM.TRANSIT_URBAN_RAIL_MIN,
+      filter: [
+        "all",
+        ["==", ["get", "class"], "rail"],
+        [
+          "in",
+          ["get", "subclass"],
+          ["literal", ["subway", "light_rail", "tram", "monorail"]],
+        ],
+      ],
+      paint: {
+        "line-color": style.transit_rail || style.railway,
+        "line-width": [
+          "interpolate",
+          ["exponential", 1.4],
+          ["zoom"],
+          11,
+          1.5,
+          14,
+          2.5,
+          18,
+          4.0,
+        ],
+        "line-dasharray": [0.4, 1.2],
+        "line-opacity": 0.6,
+      },
+    },
+
+    // 6. Passenger rail (default) - standard styling (z10+)
+    {
+      id: "transit_passenger_rail",
+      type: "line",
+      source,
+      "source-layer": "transportation",
+      minzoom: ZOOM.TRANSIT_PASSENGER_RAIL_MIN,
+      filter: [
+        "all",
+        ["==", ["get", "class"], "rail"],
+        ["!", ["has", "usage"]], // No usage attribute = passenger default
+        // Exclude urban transit types (handled above)
+        [
+          "!",
+          [
+            "in",
+            ["get", "subclass"],
+            ["literal", ["subway", "light_rail", "tram", "monorail"]],
+          ],
+        ],
+      ],
+      paint: {
+        "line-color": style.transit_rail || style.railway,
+        "line-width": [
+          "interpolate",
+          ["exponential", 1.4],
+          ["zoom"],
+          10,
+          1.5,
+          13,
+          2.2,
+          16,
+          3.5,
+        ],
+        "line-dasharray": [0.4, 1.2],
+        "line-opacity": 0.5,
+      },
+    },
+
+    // 7. Service tracks (yards, sidings) - very subtle, z14+ only
+    {
+      id: "transit_service_tracks",
+      type: "line",
+      source,
+      "source-layer": "transportation",
+      minzoom: ZOOM.TRANSIT_SERVICE_TRACKS_MIN,
+      filter: [
+        "all",
+        ["==", ["get", "class"], "rail"],
+        ["has", "service"], // Only service tracks
+      ],
+      paint: {
+        "line-color": style.transit_rail || style.railway,
+        "line-width": 1.0,
+        "line-dasharray": [0.3, 2.0],
+        "line-opacity": 0.3,
+      },
+    },
+
+    // 8. Ferry routes
+    {
+      id: "transit_ferry",
+      type: "line",
+      source,
+      "source-layer": "transportation",
+      minzoom: ZOOM.TRANSIT_FERRY_MIN,
+      filter: ["==", ["get", "class"], "ferry"],
+      paint: {
+        "line-color": style.railway,
+        "line-width": 1.5,
+        "line-dasharray": [4, 2],
+        "line-opacity": 0.6,
+      },
+    },
+  ];
+}

package/src/styles.ts

@@ -0,0 +1,182 @@
+// ============================================
+// JSON CONFIG IMPORTS
+// ============================================
+
+import darkConfig from "./config/styles/dark.json";
+import grayConfig from "./config/styles/gray.json";
+import lightConfig from "./config/styles/light.json";
+import warmConfig from "./config/styles/warm.json";
+
+// ============================================
+// STYLE NAME TYPE
+// ============================================
+
+/**
+ * Valid style name strings
+ */
+export const STYLE_NAMES = ["light", "dark", "gray", "warm"] as const;
+
+/**
+ * Type for valid style names
+ */
+export type StyleName = (typeof STYLE_NAMES)[number];
+
+/**
+ * Type guard to check if a string is a valid style name
+ */
+export function isValidStyleName(name: string): name is StyleName {
+  return STYLE_NAMES.includes(name as StyleName);
+}
+
+// ============================================
+// STYLE INTERFACES
+// ============================================
+
+export interface Style {
+  background: string;
+  earth: string;
+  park_a: string;
+  park_b: string;
+  hospital: string;
+  industrial: string;
+  school: string;
+  wood_a: string;
+  wood_b: string;
+  pedestrian: string;
+  scrub_a: string;
+  scrub_b: string;
+  glacier: string;
+  sand: string;
+  beach: string;
+  aerodrome: string;
+  runway: string;
+  water: string;
+  zoo: string;
+  military: string;
+
+  tunnel_other_casing: string;
+  tunnel_minor_casing: string;
+  tunnel_link_casing: string;
+  tunnel_major_casing: string;
+  tunnel_highway_casing: string;
+  tunnel_other: string;
+  tunnel_minor: string;
+  tunnel_link: string;
+  tunnel_major: string;
+  tunnel_highway: string;
+
+  pier: string;
+  buildings: string;
+
+  minor_service_casing: string;
+  minor_casing: string;
+  link_casing: string;
+  major_casing_late: string;
+  highway_casing_late: string;
+  other: string;
+  minor_service: string;
+  minor_a: string;
+  minor_b: string;
+  link: string;
+  major_casing_early: string;
+  major: string;
+  highway_casing_early: string;
+  highway: string;
+
+  railway: string;
+  boundaries: string;
+
+  bridges_other_casing: string;
+  bridges_minor_casing: string;
+  bridges_link_casing: string;
+  bridges_major_casing: string;
+  bridges_highway_casing: string;
+  bridges_other: string;
+  bridges_minor: string;
+  bridges_link: string;
+  bridges_major: string;
+  bridges_highway: string;
+
+  roads_label_minor: string;
+  roads_label_minor_halo: string;
+  roads_label_major: string;
+  roads_label_major_halo: string;
+  ocean_label: string;
+  subplace_label: string;
+  subplace_label_halo: string;
+  city_label: string;
+  city_label_halo: string;
+  state_label: string;
+  state_label_halo: string;
+  country_label: string;
+
+  address_label: string;
+  address_label_halo: string;
+
+  regular?: string;
+  bold?: string;
+  italic?: string;
+  medium?: string;
+
+  pois?: Pois;
+  landcover?: Landcover;
+  shields?: Shields;
+
+  // Transit (optional for backward compatibility)
+  transit_rail?: string;
+  transit_freight?: string; // Darker gray for freight rail
+  transit_bus?: string; // Orange/warm for bus infrastructure
+  transit_heritage?: string; // Lighter/decorative for heritage
+}
+
+export interface Pois {
+  blue: string;
+  green: string;
+  lapis: string;
+  pink: string;
+  red: string;
+  slategray: string;
+  tangerine: string;
+  turquoise: string;
+}
+
+export interface Landcover {
+  barren: string;
+  farmland: string;
+  forest: string;
+  glacier: string;
+  grassland: string;
+  scrub: string;
+  urban_area: string;
+  rock: string;
+  wetland: string;
+}
+
+export interface Shields {
+  interstate_fill: string;
+  interstate_stroke: string;
+  interstate_text: string;
+  us_highway_fill: string;
+  us_highway_stroke: string;
+  us_highway_text: string;
+  state_fill: string;
+  state_stroke: string;
+  state_text: string;
+  county_fill: string;
+  county_stroke: string;
+  county_text: string;
+  default_fill: string;
+  default_stroke: string;
+  default_text: string;
+  banner_text: string;
+  banner_text_halo: string;
+}
+
+// ============================================
+// STYLE INSTANCES (from JSON configs)
+// ============================================
+
+export const LIGHT: Style = lightConfig as Style;
+export const DARK: Style = darkConfig as Style;
+export const GRAY: Style = grayConfig as Style;
+export const WARM: Style = warmConfig as Style;