statusBar.ts

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