lynx-console 0.1.1 → 0.2.0

package/dist/assets/src/components/PerformancePanel.css.ts.vanilla-Bb3zG5G8.css

@@ -1,216 +0,0 @@
-.PerformancePanel_container__19p8bog0 {
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  padding-top: 4px;
-}
-.PerformancePanel_header__19p8bog1 {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 8px;
-  padding-bottom: 4px;
-  border-bottom-width: 1px;
-  border-bottom-color: var(--seed-color-stroke-neutral-subtle);
-  border-bottom-style: solid;
-}
-.PerformancePanel_count__19p8bog2 {
-  font-size: 0.8125rem;
-  line-height: 1.125rem;
-  font-weight: var(--seed-font-weight-regular);
-  color: var(--seed-color-fg-neutral-subtle);
-}
-.PerformancePanel_clearButton__19p8bog3 {
-  padding: 3px 6px;
-  background-color: var(--seed-color-bg-neutral-weak);
-  border-radius: 4px;
-}
-.PerformancePanel_clearButtonText__19p8bog4 {
-  font-size: 0.8125rem;
-  line-height: 1.125rem;
-  font-weight: var(--seed-font-weight-medium);
-  color: var(--seed-color-fg-neutral-muted);
-}
-.PerformancePanel_list__19p8bog5 {
-  flex: 1;
-}
-.PerformancePanel_placeholder__19p8bog6 {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-}
-.PerformancePanel_placeholderText__19p8bog7 {
-  font-size: 0.875rem;
-  line-height: 1.1875rem;
-  font-weight: var(--seed-font-weight-regular);
-  color: var(--seed-color-fg-disabled);
-}
-.PerformancePanel_item__19p8bog8 {
-  padding: 8px;
-  border-bottom-width: 1px;
-  border-bottom-color: var(--seed-color-stroke-neutral-weak);
-  border-bottom-style: solid;
-}
-.PerformancePanel_itemHeader__19p8bog9 {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  margin-bottom: 4px;
-  gap: 8px;
-}
-.PerformancePanel_entryType__19p8boga {
-  font-size: 0.75rem;
-  line-height: 1rem;
-  font-weight: var(--seed-font-weight-bold);
-  padding: 0 6px;
-  border-radius: 2px;
-  color: var(--seed-color-fg-neutral);
-  background-color: var(--seed-color-bg-neutral-weak);
-}
-.PerformancePanel_entryType_type_init__19p8bogb {
-  color: var(--seed-color-palette-blue-600);
-  background-color: var(--seed-color-palette-blue-100);
-}
-.PerformancePanel_entryType_type_metric__19p8bogc {
-  color: var(--seed-color-palette-green-600);
-  background-color: var(--seed-color-palette-green-100);
-}
-.PerformancePanel_entryType_type_pipeline__19p8bogd {
-  color: var(--seed-color-palette-purple-600);
-  background-color: var(--seed-color-palette-purple-100);
-}
-.PerformancePanel_entryType_type_resource__19p8boge {
-  color: var(--seed-color-palette-yellow-600);
-  background-color: var(--seed-color-palette-yellow-100);
-}
-.PerformancePanel_entryName__19p8bogf {
-  font-size: 0.75rem;
-  line-height: 1rem;
-  font-weight: var(--seed-font-weight-medium);
-  color: var(--seed-color-fg-neutral);
-}
-.PerformancePanel_timestamp__19p8bogg {
-  font-size: 0.75rem;
-  line-height: 1rem;
-  font-weight: var(--seed-font-weight-regular);
-  color: var(--seed-color-fg-neutral-subtle);
-}
-.PerformancePanel_fcpMetricHeader__19p8bogh {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  gap: 8px;
-}
-.PerformancePanel_fcpHighlight__19p8bogi {
-  font-size: 0.8125rem;
-  line-height: 1.125rem;
-  font-weight: var(--seed-font-weight-bold);
-  color: var(--seed-color-palette-blue-600);
-  background-color: var(--seed-color-palette-blue-100);
-  padding: 4px 8px;
-  border-radius: 4px;
-  margin-top: 4px;
-}
-.PerformancePanel_metrics__19p8bogj {
-  margin-top: 8px;
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-}
-.PerformancePanel_metric__19p8bogk {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  gap: 8px;
-  padding: 4px 8px;
-  background-color: var(--seed-color-bg-neutral-weak);
-  border-radius: 2px;
-}
-.PerformancePanel_metricName__19p8bogl {
-  font-size: 0.8125rem;
-  line-height: 1.125rem;
-  font-weight: var(--seed-font-weight-medium);
-  color: var(--seed-color-fg-neutral-subtle);
-  min-width: 100px;
-  flex-shrink: 0;
-}
-.PerformancePanel_metricValue__19p8bogm {
-  font-size: 0.8125rem;
-  line-height: 1.125rem;
-  font-weight: var(--seed-font-weight-bold);
-  color: var(--seed-color-palette-green-600);
-  flex: 1;
-}
-.PerformancePanel_detailsContainer__19p8bogn {
-  margin-top: 12px;
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-}
-.PerformancePanel_fcpSection__19p8bogo {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-}
-.PerformancePanel_fcpSectionDescription__19p8bogp {
-  font-size: 0.8125rem;
-  line-height: 1.125rem;
-  font-weight: var(--seed-font-weight-regular);
-  color: var(--seed-color-fg-neutral-subtle);
-  margin-bottom: 4px;
-}
-.PerformancePanel_fcpMetric__19p8bogq {
-  background-color: var(--seed-color-bg-layer-default);
-  border-radius: 4px;
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-}
-.PerformancePanel_fcpMetricName__19p8bogr {
-  font-size: 0.75rem;
-  line-height: 1rem;
-  font-weight: var(--seed-font-weight-bold);
-  color: var(--seed-color-fg-neutral);
-}
-.PerformancePanel_fcpMetricValue__19p8bogs {
-  font-size: 0.6875rem;
-  line-height: 0.9375rem;
-  font-weight: var(--seed-font-weight-bold);
-  color: var(--seed-color-palette-blue-600);
-}
-.PerformancePanel_fcpMetricDescription__19p8bogt {
-  font-size: 0.8125rem;
-  line-height: 1.125rem;
-  font-weight: var(--seed-font-weight-regular);
-  color: var(--seed-color-fg-neutral-subtle);
-}
-.PerformancePanel_fcpMetricFormula__19p8bogu {
-  font-size: 0.875rem;
-  line-height: 1.1875rem;
-  font-weight: var(--seed-font-weight-regular);
-  color: var(--seed-color-fg-disabled);
-  font-family: monospace;
-}
-.PerformancePanel_rawEntrySection__19p8bogv {
-  padding: 12px;
-  background-color: var(--seed-color-bg-neutral-weak);
-  border-radius: 4px;
-}
-.PerformancePanel_detailTitle__19p8bogw {
-  font-size: 0.8125rem;
-  line-height: 1.125rem;
-  font-weight: var(--seed-font-weight-bold);
-  color: var(--seed-color-fg-neutral);
-  margin-bottom: 8px;
-}
-.PerformancePanel_rawEntry__19p8bogx {
-  font-size: 0.8125rem;
-  line-height: 1.125rem;
-  font-weight: var(--seed-font-weight-regular);
-  color: var(--seed-color-fg-neutral-subtle);
-  font-family: monospace;
-  white-space: pre-wrap;
-  word-break: break-all;
-}

package/dist/assets/src/components/Tabs.css.ts.vanilla-DD7L2oXt.css

@@ -1,50 +0,0 @@
-.Tabs_tabs__ud1j9z0 {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-}
-.Tabs_tabHeader__ud1j9z1 {
-  display: flex;
-  box-shadow: inset 0 -1px 0 0 var(--seed-color-stroke-neutral-subtle);
-}
-.Tabs_tabTriggerButton__ud1j9z2 {
-  flex: 1;
-  color: var(--seed-color-fg-neutral-subtle);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  padding: 12px 0 10px 0;
-  position: relative;
-}
-.Tabs_tabTriggerButtonText__ud1j9z3 {
-  font-size: 1rem;
-  line-height: 1.375rem;
-  font-weight: var(--seed-font-weight-bold);
-  color: var(--seed-color-fg-neutral-subtle);
-}
-.Tabs_tabTriggerButtonText_active_true__ud1j9z4 {
-  color: var(--seed-color-fg-neutral);
-}
-.Tabs_tabTriggerIndicator__ud1j9z5 {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  padding: 0 16px;
-  width: 100%;
-  transition: 200ms;
-  transition-timing-function: cubic-bezier(.35, 0, .35, 1);
-}
-.Tabs_tabTriggerIndicatorLine__ud1j9z6 {
-  background-color: var(--seed-color-fg-neutral);
-  width: 100%;
-  height: 2px;
-}
-.Tabs_tabContents__ud1j9z7 {
-  flex: 1;
-  width: 100%;
-}
-.Tabs_tabContent__ud1j9z8 {
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-}

package/src/components/BottomSheet.css.ts

@@ -1,93 +0,0 @@
-import { style } from "@vanilla-extract/css";
-import { typography } from "../styles/typography";
-import { vars } from "../styles/vars";
-
-export const overlay = style({
-  position: "fixed",
-  top: 0,
-  right: 0,
-  bottom: 0,
-  left: 0,
-  display: "flex",
-  justifyContent: "center",
-  alignItems: "flex-end",
-  zIndex: 9999,
-});
-
-export const backdrop = style({
-  position: "fixed",
-  top: 0,
-  right: 0,
-  bottom: 0,
-  left: 0,
-  zIndex: 9998,
-  background: vars.$color.bg.overlay,
-  transition: `opacity ${vars.$duration.d6} cubic-bezier(0.4, 0, 0.2, 1)`,
-});
-
-export const content = style({
-  position: "relative",
-  display: "flex",
-  flex: 1,
-  flexDirection: "column",
-  boxSizing: "border-box",
-  wordBreak: "break-all",
-  background: vars.$color.bg.layerFloating,
-  borderTopLeftRadius: vars.$radius.r6,
-  borderTopRightRadius: vars.$radius.r6,
-  transition: `transform ${vars.$duration.d6} cubic-bezier(0.4, 0, 0.2, 1)`,
-  height: "500px",
-  overflow: "hidden",
-});
-
-export const handleContainer = style({
-  position: "absolute",
-  top: 0,
-  left: 0,
-  right: 0,
-  height: "48px",
-  display: "flex",
-  justifyContent: "center",
-  zIndex: 10,
-});
-
-export const handle = style({
-  width: "36px",
-  height: 4,
-  backgroundColor: vars.$color.palette.gray400,
-  borderRadius: "9999px",
-  marginTop: "12px",
-});
-
-export const header = style({
-  display: "flex",
-  flexDirection: "column",
-  gap: vars.$dimension.x2,
-  paddingTop: vars.$dimension.x6,
-  paddingBottom: vars.$dimension.x4,
-  justifyContent: "flex-start",
-  paddingLeft: vars.$dimension.spacingX.globalGutter,
-  paddingRight: "50px",
-});
-
-export const title = style({
-  ...typography("t7", "bold"),
-  color: vars.$color.fg.neutral,
-});
-
-export const body = style({
-  display: "flex",
-  flexDirection: "column",
-  flex: 1,
-  padding: `0 ${vars.$dimension.x4}`,
-  overflow: "hidden",
-});
-
-export const footer = style({
-  display: "flex",
-  flexDirection: "column",
-  paddingLeft: vars.$dimension.spacingX.globalGutter,
-  paddingRight: vars.$dimension.spacingX.globalGutter,
-  paddingTop: vars.$dimension.x3,
-  paddingBottom: vars.$dimension.x4,
-});

package/src/components/ConsolePanel.css.ts

@@ -1,349 +0,0 @@
-import { style } from "@vanilla-extract/css";
-import { recipe } from "@vanilla-extract/recipes";
-import { typography } from "../styles/typography";
-import { vars } from "../styles/vars";
-
-export const container = style({
-  display: "flex",
-  flexDirection: "column",
-  height: "100%",
-});
-
-export const placeholder = style({
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  height: "100%",
-});
-
-export const placeholderText = style({
-  ...typography("t4", "regular"),
-  color: vars.$color.fg.disabled,
-});
-
-export const logContainer = style({
-  display: "flex",
-  flexDirection: "column",
-  flex: 1,
-  paddingTop: 4,
-});
-
-export const logHeader = style({
-  display: "flex",
-  flexDirection: "row",
-  alignItems: "center",
-  justifyContent: "space-between",
-  paddingBottom: 3,
-});
-
-export const filterWrapper = style({
-  position: "relative",
-});
-
-export const filterButton = style({
-  display: "flex",
-  flexDirection: "row",
-  alignItems: "center",
-  padding: "3px 6px",
-  backgroundColor: vars.$color.bg.neutralWeak,
-  borderRadius: 4,
-});
-
-export const filterButtonText = style({
-  ...typography("t3", "medium"),
-  color: vars.$color.fg.neutralMuted,
-});
-
-export const filterDropdown = style({
-  position: "absolute",
-  top: "100%",
-  left: 0,
-  marginTop: 4,
-  backgroundColor: vars.$color.bg.layerFloating,
-  borderWidth: 1,
-  borderColor: vars.$color.stroke.neutralSubtle,
-  borderStyle: "solid",
-  borderRadius: 8,
-  padding: "4px 0",
-  zIndex: 100,
-  minWidth: 90,
-});
-
-export const filterOption = style({
-  display: "flex",
-  flexDirection: "row",
-  alignItems: "center",
-  gap: 4,
-  padding: "8px 12px",
-});
-
-export const filterCheckbox = recipe({
-  base: {
-    ...typography("t3", "medium"),
-    width: 16,
-  },
-  variants: {
-    level: {
-      log: { color: vars.$color.palette.green600 },
-      info: { color: vars.$color.palette.blue600 },
-      warn: { color: vars.$color.palette.yellow600 },
-      error: { color: vars.$color.palette.red600 },
-    },
-  },
-});
-
-export const filterLabel = recipe({
-  base: {
-    ...typography("t3", "medium"),
-  },
-  variants: {
-    level: {
-      log: { color: vars.$color.palette.green600 },
-      info: { color: vars.$color.palette.blue600 },
-      warn: { color: vars.$color.palette.yellow600 },
-      error: { color: vars.$color.palette.red600 },
-    },
-  },
-});
-
-export const searchWrapper = style({
-  display: "flex",
-  flexDirection: "row",
-  alignItems: "center",
-  flex: 1,
-  marginLeft: 8,
-  marginRight: 8,
-  borderBottomWidth: 1,
-  borderBottomColor: vars.$color.stroke.neutralSubtle,
-  borderBottomStyle: "solid",
-  gap: 8,
-});
-
-export const searchPrompt = style({
-  ...typography("t6", "medium"),
-  color: vars.$color.fg.placeholder,
-});
-
-export const searchInput = style({
-  flex: 1,
-  ...typography("t3", "regular"),
-  color: vars.$color.fg.neutral,
-  caretColor: vars.$color.palette.green600,
-});
-
-export const searchClear = style({
-  padding: "2px 4px",
-});
-
-export const searchClearText = style({
-  ...typography("t3", "medium"),
-  color: vars.$color.fg.placeholder,
-});
-
-export const clearButton = style({
-  padding: "3px 6px",
-  backgroundColor: vars.$color.bg.neutralWeak,
-  borderRadius: 4,
-});
-
-export const clearButtonText = style({
-  ...typography("t3", "medium"),
-  color: vars.$color.fg.neutralMuted,
-});
-
-export const logList = style({
-  flex: 1,
-  paddingTop: 0,
-  paddingBottom: 0,
-});
-
-export const logItem = recipe({
-  base: {
-    padding: "8px",
-    borderBottomWidth: 1,
-    borderBottomColor: vars.$color.stroke.neutralWeak,
-    borderBottomStyle: "solid",
-  },
-  variants: {
-    level: {
-      log: {},
-      info: {},
-      warn: {
-        backgroundColor: vars.$color.palette.yellow100,
-      },
-      error: {
-        backgroundColor: vars.$color.palette.red100,
-      },
-    },
-  },
-});
-
-export const logItemHeader = style({
-  display: "flex",
-  flexDirection: "row",
-  alignItems: "center",
-  marginBottom: 4,
-});
-
-export const logLevel = recipe({
-  base: {
-    ...typography("t2", "bold"),
-    marginRight: 8,
-  },
-  variants: {
-    level: {
-      log: {
-        color: vars.$color.palette.green600,
-      },
-      info: {
-        color: vars.$color.palette.blue600,
-      },
-      warn: {
-        color: vars.$color.palette.yellow600,
-      },
-      error: {
-        color: vars.$color.palette.red600,
-      },
-    },
-  },
-});
-
-export const logTime = style({
-  ...typography("t2", "regular"),
-  color: vars.$color.fg.neutralSubtle,
-});
-
-export const toggleIndicator = style({
-  ...typography("t2", "regular"),
-  color: vars.$color.fg.neutralSubtle,
-  marginLeft: 4,
-  alignSelf: "flex-start",
-});
-
-export const logMessage = style({
-  ...typography("t3", "regular"),
-  color: vars.$color.fg.neutral,
-  wordBreak: "break-all",
-});
-
-export const logArgsContainer = style({
-  display: "flex",
-  flexDirection: "row",
-  flexWrap: "wrap",
-  gap: 8,
-});
-
-export const logArgItem = style({
-  ...typography("t3", "regular"),
-});
-
-export const argNull = style({
-  color: vars.$color.fg.neutralSubtle,
-});
-
-export const argUndefined = style({
-  color: vars.$color.fg.neutralSubtle,
-});
-
-export const argString = recipe({
-  base: {
-    ...typography("t3", "regular"),
-  },
-  variants: {
-    level: {
-      log: { color: vars.$color.fg.neutral },
-      info: { color: vars.$color.fg.neutral },
-      warn: { color: vars.$color.palette.yellow900 },
-      error: { color: vars.$color.palette.red900 },
-    },
-  },
-});
-
-export const argPrimitive = recipe({
-  base: {
-    ...typography("t3", "regular"),
-  },
-  variants: {
-    level: {
-      log: { color: vars.$color.palette.blue600 },
-      info: { color: vars.$color.palette.blue600 },
-      warn: { color: vars.$color.palette.yellow900 },
-      error: { color: vars.$color.palette.red900 },
-    },
-  },
-});
-
-export const argObject = style({
-  display: "flex",
-  flexDirection: "column",
-});
-
-export const argObjectHeader = style({
-  display: "flex",
-  flexDirection: "row",
-  alignItems: "center",
-  gap: 4,
-});
-
-export const argObjectPreview = style({
-  ...typography("t3", "medium"),
-  color: vars.$color.fg.neutral,
-});
-
-export const argObjectContent = style({
-  marginTop: 4,
-  display: "flex",
-  flexDirection: "column",
-  gap: 4,
-});
-
-export const argObjectProperty = style({
-  display: "flex",
-  flexDirection: "row",
-  alignItems: "flex-start",
-});
-
-export const argObjectKey = style({
-  ...typography("t3", "medium"),
-  color: vars.$color.palette.purple600,
-});
-
-export const argObjectJson = style({
-  ...typography("t3", "regular"),
-  color: vars.$color.fg.neutral,
-});
-
-export const replInputRow = style({
-  display: "flex",
-  flexDirection: "row",
-  alignItems: "center",
-  gap: 8,
-  paddingTop: 0,
-  paddingBottom: 8,
-});
-
-export const replPrompt = style({
-  ...typography("t10", "medium"),
-  color: vars.$color.fg.placeholder,
-  paddingBottom: 8,
-});
-
-export const replInput = style({
-  flex: 1,
-  ...typography("t5", "regular"),
-  color: vars.$color.fg.neutral,
-  caretColor: vars.$color.palette.green600,
-  paddingBottom: 8,
-});
-
-export const replRunButton = style({
-  padding: "4px 10px",
-  backgroundColor: vars.$color.palette.green100,
-  borderRadius: 4,
-  marginBottom: 8,
-});
-
-export const replRunButtonText = style({
-  ...typography("t3", "medium"),
-  color: vars.$color.palette.green600,
-});

package/src/components/FadeList.css.ts

@@ -1,16 +0,0 @@
-import { style } from "@vanilla-extract/css";
-import { vars } from "../styles/vars";
-
-export const fadeTop = style({
-  height: 20,
-  marginBottom: -20,
-  zIndex: 1,
-  background: `linear-gradient(to bottom, ${vars.$color.bg.layerFloating}, #ffffff00)`,
-});
-
-export const fadeBottom = style({
-  height: 20,
-  marginTop: -20,
-  zIndex: 1,
-  background: `linear-gradient(to top, ${vars.$color.bg.layerFloating}, #ffffff00)`,
-});