zed-industries / zed

Code at the speed of thought – Zed is a high-performance, multiplayer code editor from the creators of Atom and Tree-sitter.
https://zed.dev
Other
47.33k stars 2.74k forks source link

Indent guides incorrect #12492

Closed und3fined closed 3 months ago

und3fined commented 3 months ago

Check for existing issues

Describe the bug / provide steps to reproduce it

Same title

Img

https://github.com/zed-industries/zed/assets/2163878/ef805786-e1cd-4154-80d2-21f130915a66

Environment

If applicable, add mockups / screenshots to help explain present your vision of the feature

File 1

<!--
 | Copyright (c) 2024 und3fy.dev. All rights reserved.
 | Created by und3fined <me@und3fy.dev> on 2024 May 15.
-->
<script lang="ts">
  import { mode, toggleMode } from 'mode-watcher';

  import SunIcon from 'lucide-svelte/icons/sun';
  import MoonIcon from 'lucide-svelte/icons/moon';

  type HeaderProps = {
    siteName: string;
  };

  let { siteName }: HeaderProps = $props();

  let themeMode = $state(mode);
</script>

<header>
  <div class="container">
    <div class="navbar">
      <div class="navbar-start">
        <a href="/" class=" flex flex-row items-center space-x-2">
          <img class="avatar h-12" src="/favicon/android-chrome-192x192.png" alt={siteName} />
          <h1 class="text-xl font-bold">{siteName}</h1>
        </a>
      </div>
      <div class="navbar-end">
        <ul class="menu menu-horizontal space-x-4 px-1">
          <li><a class="btn btn-outline btn-primary" href="/">Home</a></li>
          <li><a class="btn btn-outline btn-primary" href="/app">App</a></li>
        </ul>
        <button
          class="btn btn-ghost swap swap-rotate px-2.5"
          class:swap-active={$themeMode === 'dark'}
          onclick={toggleMode}
        >
          <SunIcon class="swap-on h-5 w-5" />
          <MoonIcon class="swap-off h-5 w-5" />
        </button>
      </div>
    </div>
  </div>
</header>

<style lang="postcss">
  header {
    @apply fixed left-0 top-0 z-50 w-screen bg-background;
  }
</style>

File 2

<!--
 | Copyright (c) 2024 und3fy.dev. All rights reserved.
 | Created by und3fined <me@und3fy.dev> on 2024 May 15.
-->
<script lang="ts">
  import { ModeWatcher, mode } from 'mode-watcher';

  import type { Snippet } from 'svelte';
  import type { LayoutServerData } from './$types';

  import '$styles/app.css';
  import { browser } from '$app/environment';

  type AuthProps = {
    children: Snippet;
    data: LayoutServerData;
  };

  let { children, data }: AuthProps = $props();

  mode.subscribe((val) => {
    if (browser) {
      document.body.dataset.theme = val || 'light';
    }
  });
</script>

<svelte:head>
  <title>{data.default_title}</title>
</svelte:head>

<ModeWatcher />

{@render children()}

settings.json

//...
  "tab_size": 2,
  "language_overrides": {
    "Shell Script": {
      "soft_wrap": "editor_width",
      "tab_size": 2,
      "hard_tabs": true
    },
    "Rust": {
      "soft_wrap": "preferred_line_length",
      "tab_size": 4,
      "hard_tabs": false
    },
    "Svelte": {
      "soft_wrap": "preferred_line_length",
      "tab_size": 2,
      "hard_tabs": false,
      "indent_guides": {
        "enabled": true
      }
    },
    "HTML": {
      "tab_size": 2,
      "hard_tabs": false
    }
  }

// ...

If applicable, attach your ~/Library/Logs/Zed/Zed.log file to this issue.

No response

baldwindavid commented 3 months ago
settings.json

//...
  "tab_size": 2,
  "language_overrides": {
    "Shell Script": {

@und3fined Just to save a bit on back and forth, I'm almost certain @bennetbo will want your entire settings.json. I've personally run into cases where seemingly unrelated settings are at the root of an issue.

bennetbo commented 3 months ago

Thanks for opening a separate issue. I just tried this in the preview version and cannot reproduce the issue with either of the files, my guess would be that there is something else in your settings that's causing them to be invalid. Could you share your whole settings file?

https://github.com/zed-industries/zed/assets/53836821/d176f614-c546-4949-a06b-f579a9d755cc

bennetbo commented 3 months ago

@und3fined #12506 should fix your issue. It would still be interesting to figure out if there is something wrong with your setting file, so please share that if possible

und3fined commented 3 months ago

@bennetbo

settings.json

{
  "notification_panel": {
    "dock": "left"
  },
  "collaboration_panel": {
    "dock": "left"
  },
  "show_whitespaces": "selection",
  "confirm_quit": true,
  "ui_font_family": "FiraCode Nerd Font",
  "ui_font_size": 14,
  "buffer_font_family": "FiraCode Nerd Font",
  "buffer_font_size": 11.6,
  "format_on_save": "on",
  "tab_size": 2,
  "preferred_line_length": 160,
  "projects_online_by_default": false,
  "chat_panel": {
    "dock": "left"
  },
  "tab_bar": {
    "show_nav_history_buttons": false
  },
  "assistant": {
    "version": "1",
    "default_width": 360
  },
  "soft_wrap": "editor_width",
  "terminal": {
    "copy_on_select": true,
    "blinking": "on",
    "dock": "bottom",
    "default_height": 90
  },
  "toolbar": {
    "breadcrumbs": true,
    "quick_actions": true
  },
  "language_overrides": {
    "Shell Script": {
      "soft_wrap": "editor_width",
      "tab_size": 2,
      "hard_tabs": true
    },
    "Rust": {
      "soft_wrap": "preferred_line_length",
      "tab_size": 4,
      "hard_tabs": false
    },
    "Svelte": {
      "soft_wrap": "preferred_line_length",
      "tab_size": 2,
      "hard_tabs": false,
      "indent_guides": {
        "enabled": true
      }
    },
    "HTML": {
      "tab_size": 2,
      "hard_tabs": false
    }
  },
  "languages": {
    "TypeScript": {
      "code_actions_on_format": {
        "source.fixAll.eslint": true
      }
    }
  },
  "remove_trailing_whitespace_on_save": true,
  "project_panel": {
    "dock": "left",
    "default_width": 300,
    "file_icons": true,
    "folder_icons": true,
    "git_status": true,
    "indent_size": 12,
    "button": false
  },
  "tabs": {
    "git_status": true
  },
  "git": {
    "git_gutter": "hide",
    "gutter_debounce": 300,
    "inline_blame": {
      "delay_ms": 300,
      "min_column": 129
    }
  },
  "telemetry": {
    "diagnostics": false,
    "metrics": false
  },
  "files": {
    "associations": {
      "Makefile": "Shell Script",
      "Cargo.lock": "toml"
    }
  },
  "preview_tabs": {
    "enabled": true,
    "enable_preview_from_file_finder": true
  },
  "enable_preview_from_file_finder": true,
  "gutter": {
    "line_numbers": true,
    "show_whitespace": true,
    "code_actions": true,
    "folds": true
  },
  "semantic_index": {
    "enabled": true
  },
  "line_indicator_format": "short",
  "prettier": {
    "tab_width": 2,
    "use_tabs": false,
    "print_width": 140,
    "single_quote": true,
    "trailing_comma": "all",
    "bracket_spacing": true,
    "jsx_bracket_same_line": true,
    "arrow_parens": "always",
    "semi": true,
    "quote_props": "consistent",
    "end_of_line": "lf",
    "jsx_single_quote": false,
    "jsx_brackets": false,
    "prose_wrap": "preserve",
    "html_whitespace_sensitivity": "css",
    "embedded_language_formatting": "auto",
    "vue_indent_script_and_style": false,
    "space_before_function_paren": false,
    "require_config": false,
    "insert_final_newline": true,
    "ignore_path": ".prettierignore",
    "ignore": [
      "**/node_modules/**",
      "**/bower_components/**",
      "**/dist/**",
      "**/build/**",
      "**/coverage/**",
      "**/.git/**",
      "**/.hg/**",
      "**/.svn/**",
      "**/CVS/**",
      "**/.DS_Store/**",
      "**/Thumbs.db/**",
      "**/.eslintcache/**",
      "**/.vscode/**",
      "**/.yarn/**",
      "**/.yarnrc/**",
      "**/.yarn-integrity/**",
      "**/.yarn-metadata.json/**",
      "**/.yarnignore/**",
      "**/.pnp.js/**",
      "**/.pnp.cjs/**",
      "**/.pnp.mjs/**",
      "**/.pnp/**",
      "**/.tern-port/**",
      "**/npm-debug.log/**",
      "**/package-lock.json/**",
      "**/yarn.lock/**",
      "**/pnpm-lock.yaml/**",
      "**/pnpm-workspace.yaml/**",
      "**/coverage/**",
      "**/coverage/**",
      "**/coverage/**",
      "**/coverage/**"
    ]
  },
  "theme": "One Dark Pro",
  "experimental.theme_overrides": {
    "background.appearance": "blurred",
    "elevated_surface.background": "#262829",
    "surface.background": "#262829",
    "editor.highlighted_line.background": "#262829",
    "background": "#2c2e2fdc",
    "editor.background": "#242627cc",
    "editor.foreground": "#C1C4C5",
    "panel.background": "#23242510",
    "panel.focused_border": "#757A7C",
    "editor.gutter.background": "#222324cc",
    "editor.line_number": "#666B6D",
    "editor.active_line_number": "#D1D3D4",
    "editor.active_wrap_guide": "#494D4E",
    "toolbar.background": "#24262710",
    "border.variant": "#3B3D3F",
    "title_bar.background": "#23242510",
    "tab_bar.background": "#1E1F20",
    "tab.active_background": "#292B2C",
    "tab.inactive_background": "#232425",
    "status_bar.background": "#1E1F2010",
    "scrollbar.thumb.background": "#3B3D3F90",
    "scrollbar.thumb.border": "#23242580",
    "scrollbar.track.background": "#23242599",
    "scrollbar.track.border": "#232425",
    "editor.active_line.background": "#3B3D3F90",
    "border": "#757A7C30",
    "ghost_element.hover": "#3B3D3F90",
    "ghost_element.active": "#3B3D3F",
    "ghost_element.selected": "#3B3D3F",
    "ghost_element.disabled": "#292B2C",
    "terminal.background": "#23242590",
    "terminal.bright_foreground": "#c8ccd4ff",
    "terminal.dim_foreground": "#282c33ff",
    "terminal.ansi.black": "#282c33ff",
    "terminal.ansi.bright_black": "#525561ff",
    "terminal.ansi.dim_black": "#c8ccd4ff",
    "terminal.ansi.red": "#d07277ff",
    "terminal.ansi.bright_red": "#673a3cff",
    "terminal.ansi.dim_red": "#eab7b9ff",
    "terminal.ansi.green": "#a1c181ff",
    "terminal.ansi.bright_green": "#4d6140ff",
    "terminal.ansi.dim_green": "#d1e0bfff",
    "terminal.ansi.yellow": "#dec184ff",
    "terminal.ansi.bright_yellow": "#786441ff",
    "terminal.ansi.dim_yellow": "#f1dfc1ff",
    "terminal.ansi.blue": "#74ade8ff",
    "terminal.ansi.bright_blue": "#385378ff",
    "terminal.ansi.dim_blue": "#bed5f4ff",
    "terminal.ansi.magenta": "#be5046ff",
    "terminal.ansi.bright_magenta": "#5e2b26ff",
    "terminal.ansi.dim_magenta": "#e6a79eff",
    "terminal.ansi.cyan": "#6eb4bfff",
    "terminal.ansi.bright_cyan": "#3a565bff",
    "terminal.ansi.dim_cyan": "#b9d9dfff",
    "terminal.ansi.white": "#c8ccd4ff",
    "terminal.ansi.bright_white": "#c8ccd4ff",
    "terminal.ansi.dim_white": "#575d65ff",
    "search.match_background": "#666B6D80",
    "error": "#d07277ff",
    "error.background": "#301b1bff",
    "error.border": "#4c2b2cff",
    "warning": "#dec184ff",
    "warning.background": "#41321dff",
    "warning.border": "#5d4c2fff",
    "info": "#40BAF6",
    "info.background": "#e2e2fa",
    "info.border": "#076595",
    "success": "#a1c181ff",
    "success.background": "#222e1dff",
    "success.border": "#38482fff",
    "text": "#c8ccd4ff",
    "text.muted": "#838994ff",
    "text.placeholder": "#555a63ff",
    "text.disabled": "#555a63ff",
    "text.accent": "#74ade8ff",
    "hint": "#5a6f89ff",
    "hint.background": "#18243dff",
    "hint.border": "#293b5bff",
    "ignored": "#555a63ff",
    "ignored.background": "#3b414dff",
    "ignored.border": "#464b57ff",
    "link_text.hover": "#74ade8ff",
    "predictive": "#5a6a87ff",
    "predictive.background": "#222e1dff",
    "predictive.border": "#38482fff",
    "unreachable": "#838994ff",
    "unreachable.background": "#3b414dff",
    "unreachable.border": "#464b57ff",
    "players": [
      {
        "cursor": "#74ade8ff",
        "background": "#74ade8ff",
        "selection": "#434849"
      },
      {
        "cursor": "#be5046ff",
        "background": "#be5046ff",
        "selection": "#be50463d"
      },
      {
        "cursor": "#bf956aff",
        "background": "#bf956aff",
        "selection": "#bf956a3d"
      },
      {
        "cursor": "#b477cfff",
        "background": "#b477cfff",
        "selection": "#b477cf3d"
      },
      {
        "cursor": "#6eb4bfff",
        "background": "#6eb4bfff",
        "selection": "#6eb4bf3d"
      },
      {
        "cursor": "#d07277ff",
        "background": "#d07277ff",
        "selection": "#d072773d"
      },
      {
        "cursor": "#dec184ff",
        "background": "#dec184ff",
        "selection": "#dec1843d"
      },
      {
        "cursor": "#a1c181ff",
        "background": "#a1c181ff",
        "selection": "#a1c1813d"
      }
    ],
    "syntax": {}
  }
}
bennetbo commented 3 months ago

Thanks, there is indeed an error in your config. language_overrides is an alias for languages, therefore it breaks your settings if you specify both. You can put everything from language_overrides inside languages and it should work. We need to do a better job at highlighting that error (tracked in #4877)