statusBar.ts

  1import { ColorScheme } from "../themes/common/colorScheme"
  2import { background, border, foreground, text } from "./components"
  3
  4export default function statusBar(colorScheme: ColorScheme) {
  5    let layer = colorScheme.lowest
  6
  7    const statusContainer = {
  8        cornerRadius: 6,
  9        padding: { top: 3, bottom: 3, left: 6, right: 6 },
 10    }
 11
 12    const diagnosticStatusContainer = {
 13        cornerRadius: 6,
 14        padding: { top: 1, bottom: 1, left: 6, right: 6 },
 15    }
 16
 17    return {
 18        height: 30,
 19        itemSpacing: 8,
 20        padding: {
 21            top: 1,
 22            bottom: 1,
 23            left: 6,
 24            right: 6,
 25        },
 26        border: border(layer, { top: true, overlay: true }),
 27        cursorPosition: text(layer, "sans", "variant"),
 28        activeLanguage: {
 29            padding: { left: 6, right: 6 },
 30            ...text(layer, "sans", "variant"),
 31            hover: {
 32                ...text(layer, "sans", "on"),
 33            },
 34        },
 35        autoUpdateProgressMessage: text(layer, "sans", "variant"),
 36        autoUpdateDoneMessage: text(layer, "sans", "variant"),
 37        lspStatus: {
 38            ...diagnosticStatusContainer,
 39            iconSpacing: 4,
 40            iconWidth: 14,
 41            height: 18,
 42            message: text(layer, "sans"),
 43            iconColor: foreground(layer),
 44            hover: {
 45                message: text(layer, "sans"),
 46                iconColor: foreground(layer),
 47                background: background(layer, "hovered"),
 48            },
 49        },
 50        diagnosticMessage: {
 51            ...text(layer, "sans"),
 52            hover: text(layer, "sans", "hovered"),
 53        },
 54        diagnosticSummary: {
 55            height: 20,
 56            iconWidth: 16,
 57            iconSpacing: 2,
 58            summarySpacing: 6,
 59            text: text(layer, "sans", { size: "sm" }),
 60            iconColorOk: foreground(layer, "variant"),
 61            iconColorWarning: foreground(layer, "warning"),
 62            iconColorError: foreground(layer, "negative"),
 63            containerOk: {
 64                cornerRadius: 6,
 65                padding: { top: 3, bottom: 3, left: 7, right: 7 },
 66            },
 67            containerWarning: {
 68                ...diagnosticStatusContainer,
 69                background: background(layer, "warning"),
 70                border: border(layer, "warning"),
 71            },
 72            containerError: {
 73                ...diagnosticStatusContainer,
 74                background: background(layer, "negative"),
 75                border: border(layer, "negative"),
 76            },
 77            hover: {
 78                iconColorOk: foreground(layer, "on"),
 79                containerOk: {
 80                    cornerRadius: 6,
 81                    padding: { top: 3, bottom: 3, left: 7, right: 7 },
 82                    background: background(layer, "on", "hovered"),
 83                },
 84                containerWarning: {
 85                    ...diagnosticStatusContainer,
 86                    background: background(layer, "warning", "hovered"),
 87                    border: border(layer, "warning", "hovered"),
 88                },
 89                containerError: {
 90                    ...diagnosticStatusContainer,
 91                    background: background(layer, "negative", "hovered"),
 92                    border: border(layer, "negative", "hovered"),
 93                },
 94            },
 95        },
 96        sidebarButtons: {
 97            groupLeft: {},
 98            groupRight: {},
 99            item: {
100                ...statusContainer,
101                iconSize: 16,
102                iconColor: foreground(layer, "variant"),
103                label: {
104                    margin: { left: 6 },
105                    ...text(layer, "sans", { size: "sm" }),
106                },
107                hover: {
108                    iconColor: foreground(layer, "hovered"),
109                    background: background(layer, "variant"),
110                },
111                active: {
112                    iconColor: foreground(layer, "active"),
113                    background: background(layer, "active"),
114                },
115            },
116            badge: {
117                cornerRadius: 3,
118                padding: 2,
119                margin: { bottom: -1, right: -1 },
120                border: border(layer),
121                background: background(layer, "accent"),
122            },
123        },
124    }
125}