4 4 

5# Jelajahi direktori .claude5# Jelajahi direktori .claude

6 6 

7> Tempat Claude Code membaca CLAUDE.md, settings.json, hooks, skills, commands, subagents, rules, dan auto memory. Jelajahi direktori .claude di proyek Anda dan ~/.claude di direktori home Anda.7> Tempat Claude Code membaca CLAUDE.md, settings.json, hooks, skills, commands, subagents, workflows, rules, dan auto memory. Jelajahi direktori .claude di proyek Anda dan ~/.claude di direktori home Anda.

8 

9export const ClaudeExplorer = () => {

10 const A = useMemo(() => ({href, children}) => <a href={href} style={{

11 color: 'var(--ce-accent)',

12 textDecoration: 'none',

13 borderBottom: '1px dotted var(--ce-accent)'

14 }}>{children}</a>, []);

15 const C = useMemo(() => ({children}) => <code style={{

16 fontFamily: 'var(--ce-mono)',

17 fontSize: '0.92em',

18 padding: '1px 4px',

19 borderRadius: '3px',

20 background: 'var(--ce-surface)',

21 border: '0.5px solid var(--ce-border-subtle)'

22 }}>{children}</code>, []);

23 const commandsNote = useMemo(() => <>Commands and skills are now the same mechanism. For new workflows, use <A href="/en/skills">skills/</A> instead: same <C>/name</C> invocation, plus you can bundle supporting files.</>, []);

24 const FILE_TREE = useMemo(() => ({

25 project: {

26 label: 'your-project/',

27 children: [{

28 id: 'claude-md',

29 label: 'CLAUDE.md',

30 type: 'file',

31 icon: 'md',

32 color: '#6A9BCC',

33 badge: 'committed',

34 oneLiner: 'Project instructions Claude reads every session',

35 when: 'Loaded into context at the start of every session',

36 description: 'Project-specific instructions that shape how Claude works in this repository. Put your conventions, common commands, and architectural context here so Claude operates with the same assumptions your team does.',

37 tips: ['Target under 200 lines. Longer files still load in full but may reduce adherence', <>CLAUDE.md loads into every session. If something only matters for specific tasks, move it to a <A href="/en/skills">skill</A> or a path-scoped <A href="/en/memory#organize-rules-with-claude/rules/">rule</A> so it loads only when needed</>, 'List the commands you run most, like build, test, and format, so Claude knows them without you spelling them out each time', <>Run <C>/memory</C> to open and edit CLAUDE.md from within a session</>, <>Also works at <C>.claude/CLAUDE.md</C> if you prefer to keep the project root clean</>],

38 exampleIntro: 'This example is for a TypeScript and React project. It lists the build and test commands, the framework conventions Claude should follow, and project-specific rules like export style and file layout.',

39 example: `# Project conventions

40 

41## Commands

42- Build: \`npm run build\`

43- Test: \`npm test\`

44- Lint: \`npm run lint\`

45 

46## Stack

47- TypeScript with strict mode

48- React 19, functional components only

49 

50## Rules

51- Named exports, never default exports

52- Tests live next to source: \`foo.ts\` -> \`foo.test.ts\`

53- All API routes return \`{ data, error }\` shape`,

54 docsLink: '/en/memory'

55 }, {

56 id: 'mcp-json',

57 label: '.mcp.json',

58 type: 'file',

59 icon: 'json',

60 color: '#9B7BC4',

61 badge: 'committed',

62 oneLiner: 'Project-scoped MCP servers, shared with your team',

63 when: <>Servers connect when the session begins. Tool schemas are deferred by default and load on demand via <A href="/en/mcp#scale-with-mcp-tool-search">tool search</A></>,

64 description: <>Configures Model Context Protocol (MCP) servers that give Claude access to external tools: databases, APIs, browsers, and more. This file holds the project-scoped servers your whole team uses. Personal servers you want to keep to yourself go in <C>~/.claude.json</C> instead.</>,

65 tips: [<>Use environment variable references for secrets: <C>{'${GITHUB_TOKEN}'}</C></>, <>Lives at the project root, not inside <C>.claude/</C></>, <>For servers only you need, run <C>claude mcp add --scope user</C>. This writes to <C>~/.claude.json</C> instead of <C>.mcp.json</C></>],

66 exampleIntro: <>This example configures the GitHub MCP server so Claude can read issues and open pull requests. The <C>{'${GITHUB_TOKEN}'}</C> reference is read from your shell environment when Claude Code starts the server, so the token never lands in the file.</>,

67 example: `{

68 "mcpServers": {

69 "github": {

70 "command": "npx",

71 "args": ["-y", "@modelcontextprotocol/server-github"],

72 "env": {

73 "GITHUB_TOKEN": "\${GITHUB_TOKEN}"

74 }

75 }

76 }

77}`,

78 docsLink: '/en/mcp'

79 }, {

80 id: 'worktreeinclude',

81 label: '.worktreeinclude',

82 type: 'file',

83 icon: 'md',

84 color: '#8FA876',

85 badge: 'committed',

86 oneLiner: 'Gitignored files to copy into new worktrees',

87 when: <>Read when Claude creates a git worktree via <C>--worktree</C>, the <C>EnterWorktree</C> tool, or subagent <C>isolation: worktree</C></>,

88 description: <>Lists gitignored files to copy from your main repository into each new worktree. Worktrees are fresh checkouts, so untracked files like <C>.env</C> are missing by default. Patterns here use <C>.gitignore</C> syntax. Only files that match a pattern and are also gitignored get copied, so tracked files are never duplicated.</>,

89 tips: [<>Lives at the project root, not inside <C>.claude/</C></>, <>Git-only: if you configure a <A href="/en/hooks#worktreecreate">WorktreeCreate hook</A> for a different VCS, this file is not read. Copy files inside your hook script instead</>, <>Also applies to parallel sessions in the <A href="/en/desktop#work-in-parallel-with-sessions">desktop app</A></>],

90 exampleIntro: 'This example copies your local environment files and a secrets config into every worktree Claude creates. Comments start with # and blank lines are ignored, same as .gitignore.',

91 example: `# Local environment

92.env

93.env.local

94 

95# API credentials

96config/secrets.json`,

97 docsLink: '/en/worktrees#copy-gitignored-files-into-worktrees'

98 }, {

99 id: 'dot-claude',

100 label: '.claude/',

101 type: 'folder',

102 icon: 'folder',

103 color: 'var(--ce-accent)',

104 oneLiner: 'Project-level configuration, rules, and extensions',

105 description: 'Everything Claude Code reads that is specific to this project. If you use git, commit most files here so your team shares them; a few, like settings.local.json, are automatically gitignored. Each file badge shows which.',

106 children: [{

107 id: 'settings-json',

108 label: 'settings.json',

109 type: 'file',

110 icon: 'json',

111 color: 'var(--ce-text-3)',

112 badge: 'committed',

113 oneLiner: 'Permissions, hooks, and configuration',

114 when: <>Overrides global <C>~/.claude/settings.json</C>. Local settings, CLI flags, and managed settings override this</>,

115 description: 'Settings that Claude Code applies directly. Permissions control which commands and tools Claude can use; hooks run your scripts at specific points in a session. Unlike CLAUDE.md, which Claude reads as guidance, these are enforced whether Claude follows them or not.',

116 contains: [<><A href="/en/permissions">permissions</A>: allow, deny, or prompt before Claude uses specific tools or commands</>, <><A href="/en/hooks">hooks</A>: run your own scripts on events like before a tool call or after a file edit</>, <><A href="/en/statusline">statusLine</A>: customize the line shown at the bottom while Claude works</>, <><A href="/en/settings#available-settings">model</A>: pick a default model for this project</>, <><A href="/en/settings#environment-variables">env</A>: environment variables set in every session</>, <><A href="/en/output-styles">outputStyle</A>: select a custom system-prompt style from output-styles/</>],

117 tips: [<>Bash permission patterns support wildcards: <C>Bash(npm test *)</C> matches any command starting with <C>npm test</C></>, <>Array settings like <C>permissions.allow</C> combine across all scopes; scalar settings like <C>model</C> use the most specific value</>],

118 exampleIntro: <>This example allows <C>npm test</C> and <C>npm run</C> commands without prompting, blocks <C>rm -rf</C>, and runs Prettier on files after Claude edits or writes them.</>,

119 example: `{

120 "permissions": {

121 "allow": [

122 "Bash(npm test *)",

123 "Bash(npm run *)"

124 ],

125 "deny": [

126 "Bash(rm -rf *)"

127 ]

128 },

129 "hooks": {

130 "PostToolUse": [{

131 "matcher": "Edit|Write",

132 "hooks": [{

133 "type": "command",

134 "command": "jq -r '.tool_input.file_path' | xargs npx prettier --write"

135 }]

136 }]

137 }

138}`,

139 docsLink: '/en/settings'

140 }, {

141 id: 'settings-local-json',

142 label: 'settings.local.json',

143 type: 'file',

144 icon: 'json',

145 color: 'var(--ce-text-3)',

146 badge: 'gitignored',

147 oneLiner: 'Your personal settings overrides for this project',

148 when: 'Highest of the user-editable settings files; CLI flags and managed settings still take precedence',

149 description: 'Personal settings that take precedence over the project defaults. Same JSON format as settings.json, but not committed. Use this when you need different permissions or defaults than the team config.',

150 tips: [<>Same schema as settings.json. Array settings like <C>permissions.allow</C> combine across scopes; scalar settings like <C>model</C> use the local value</>, <>Claude Code adds this file to <C>~/.config/git/ignore</C> the first time it writes one. If you use a custom <C>core.excludesFile</C>, add the pattern there too. To share the ignore rule with your team, also add it to the project <C>.gitignore</C></>],

151 exampleIntro: 'This example adds Docker permissions on top of whatever the team settings.json allows.',

152 example: `{

153 "permissions": {

154 "allow": [

155 "Bash(docker *)"

156 ]

157 }

158}`,

159 docsLink: '/en/settings'

160 }, {

161 id: 'rules',

162 label: 'rules/',

163 type: 'folder',

164 icon: 'folder',

165 color: '#9B7BC4',

166 oneLiner: 'Topic-scoped instructions, optionally gated by file paths',

167 when: <>Rules without <C>paths:</C> load at session start. Rules with <C>paths:</C> load when a matching file enters context</>,

168 description: [<>Project instructions split into topic files that can load conditionally based on file paths. A rule without <C>paths:</C> frontmatter loads at session start like CLAUDE.md; a rule with <C>paths:</C> loads only when Claude reads a matching file.</>, <>Like CLAUDE.md, rules are guidance Claude reads, not configuration Claude Code enforces. For guaranteed behavior use <A href="/en/hooks">hooks</A> or <A href="/en/permissions">permissions</A>.</>],

169 tips: [<>Use <C>paths:</C> frontmatter with globs to scope rules to directories or file types</>, <>Subdirectories work: <C>.claude/rules/frontend/react.md</C> is discovered automatically</>, 'When CLAUDE.md approaches 200 lines, start splitting into rules'],

170 docsLink: '/en/memory#organize-rules-with-claude/rules/',

171 children: [{

172 id: 'rule-testing',

173 label: 'testing.md',

174 type: 'file',

175 icon: 'md',

176 color: '#9B7BC4',

177 badge: 'committed',

178 oneLiner: 'Test conventions scoped to test files',

179 when: <>Loaded when Claude reads a file matching the <C>paths:</C> globs below</>,

180 description: <>An example rule that only loads when Claude is working on test files. The <C>paths:</C> globs in the frontmatter define which files trigger it; here, anything ending in .test.ts or .test.tsx. For other files, this rule is not loaded into context.</>,

181 example: `---

182paths:

183 - "**/*.test.ts"

184 - "**/*.test.tsx"

185 

186# Testing Rules

187 

188- Use descriptive test names: "should [expected] when [condition]"

189- Mock external dependencies, not internal modules

190- Clean up side effects in afterEach`

191 }, {

192 id: 'rule-api',

193 label: 'api-design.md',

194 type: 'file',

195 icon: 'md',

196 color: '#9B7BC4',

197 badge: 'committed',

198 oneLiner: 'API conventions scoped to backend code',

199 when: <>Loaded when Claude reads a file matching the <C>paths:</C> glob below</>,

200 description: <>A second example showing a rule scoped to backend code. The <C>paths:</C> glob matches files under src/api/, so these conventions load only when Claude is editing API routes.</>,

201 example: `---

202paths:

203 - "src/api/**/*.ts"

204 

205# API Design Rules

206 

207- All endpoints must validate input with Zod schemas

208- Return shape: { data: T } | { error: string }

209- Rate limit all public endpoints`

210 }]

211 }, {

212 id: 'skills',

213 label: 'skills/',

214 type: 'folder',

215 icon: 'folder',

216 color: '#D4A843',

217 oneLiner: 'Reusable prompts you or Claude invoke by name',

218 when: <>Invoked with <C>/skill-name</C> or when Claude matches the task to a skill</>,

219 description: <>Each skill is a folder with a SKILL.md file plus any supporting files it needs. By default, both you and Claude can invoke a skill. Use frontmatter to control that: <C>disable-model-invocation: true</C> for user-only workflows like <C>/deploy</C>, or <C>user-invocable: false</C> to hide from the <C>/</C> menu while Claude can still invoke it.</>,

220 tips: [<>Skills accept arguments: <C>/deploy staging</C> passes "staging" as <C>$ARGUMENTS</C>. Use <C>$0</C>, <C>$1</C>, and so on for positional access</>, <>The <C>description</C> frontmatter determines when Claude auto-invokes the skill</>, 'Bundle reference docs alongside SKILL.md. Claude knows the skill directory path and can read supporting files when you mention them'],

221 docsLink: '/en/skills',

222 children: [{

223 id: 'skill-review',

224 label: 'security-review/',

225 type: 'folder',

226 icon: 'folder',

227 color: '#D4A843',

228 oneLiner: 'A skill bundling SKILL.md with supporting files',

229 children: [{

230 id: 'skill-review-md',

231 label: 'SKILL.md',

232 type: 'file',

233 icon: 'md',

234 color: '#D4A843',

235 badge: 'committed',

236 oneLiner: 'Entrypoint: trigger, invocability, instructions',

237 when: <>User types <C>/security-review &lt;target&gt;</C>; Claude cannot auto-invoke this skill</>,

238 description: [<>This skill uses <C>disable-model-invocation: true</C> so only you can trigger it; Claude never invokes it on its own.</>, <>The <C>!`...`</C> line runs a shell command and injects its output into the prompt. <C>$ARGUMENTS</C> substitutes whatever you typed after the skill name. Claude sees the skill directory path, so mentioning a bundled file like checklist.md lets Claude read it.</>],

239 example: `---

240description: Reviews code changes for security vulnerabilities, authentication gaps, and injection risks

241disable-model-invocation: true

242argument-hint: <branch-or-path>

243 

244## Diff to review

245 

246!\`git diff $ARGUMENTS\`

247 

248Audit the changes above for:

249 

2501. Injection vulnerabilities (SQL, XSS, command)

2512. Authentication and authorization gaps

2523. Hardcoded secrets or credentials

253 

254Use checklist.md in this skill directory for the full review checklist.

255 

256Report findings with severity ratings and remediation steps.`

257 }, {

258 id: 'skill-checklist',

259 label: 'checklist.md',

260 type: 'file',

261 icon: 'md',

262 color: '#D4A843',

263 badge: 'committed',

264 oneLiner: 'Supporting file bundled with the skill',

265 when: 'Claude reads it on demand while running the skill',

266 description: <>Skills can bundle any supporting files: reference docs, templates, scripts. The skill directory path is prepended to SKILL.md, so Claude can read bundled files by name. For scripts in bash injection commands, use the <C>{'${CLAUDE_SKILL_DIR}'}</C> placeholder.</>,

267 example: `# Security Review Checklist

268 

269## Input Validation

270- [ ] All user input sanitized before DB queries

271- [ ] File upload MIME types validated

272- [ ] Path traversal prevented on file operations

273 

274## Authentication

275- [ ] JWT tokens expire after 24 hours

276- [ ] API keys stored in environment variables

277- [ ] Passwords hashed with bcrypt or argon2`

278 }]

279 }]

280 }, {

281 id: 'commands',

282 label: 'commands/',

283 type: 'folder',

284 icon: 'folder',

285 color: '#788C5D',

286 oneLiner: <>Single-file prompts invoked with <C>/name</C></>,

287 note: commandsNote,

288 when: <>User types <C>/command-name</C></>,

289 description: <>A file at <C>commands/deploy.md</C> creates <C>/deploy</C> the same way a skill at <C>skills/deploy/SKILL.md</C> does, and both can be auto-invoked by Claude. Skills use a directory with SKILL.md, letting you bundle reference docs, templates, or scripts alongside the prompt.</>,

290 tips: [<>Use <C>$ARGUMENTS</C> in the file to accept parameters: <C>/fix-issue 123</C></>, 'If a skill and command share a name, the skill takes precedence', 'New commands should usually be skills instead; commands remain supported'],

291 docsLink: '/en/skills',

292 children: [{

293 id: 'cmd-example',

294 label: 'fix-issue.md',

295 type: 'file',

296 icon: 'md',

297 color: '#788C5D',

298 badge: 'committed',

299 oneLiner: <>Invoked as <C>/fix-issue &lt;number&gt;</C></>,

300 note: commandsNote,

301 description: [<>An example command for fixing a GitHub issue. Type <C>/fix-issue 123</C> and the <C>!`...`</C> line runs <C>gh issue view 123</C> in your shell, injecting the output into the prompt before Claude sees it.</>, <><C>$ARGUMENTS</C> substitutes whatever you typed after the command name. For positional access, use <C>$0</C> <C>$1</C> and so on.</>],

302 example: `---

303argument-hint: <issue-number>

304 

305!\`gh issue view $ARGUMENTS\`

306 

307Investigate and fix the issue above.

308 

3091. Trace the bug to its root cause

3102. Implement the fix

3113. Write or update tests

3124. Summarize what you changed and why`

313 }]

314 }, {

315 id: 'output-styles',

316 label: 'output-styles/',

317 type: 'folder',

318 icon: 'folder',

319 color: '#5AA7A7',

320 oneLiner: 'Project-scoped output styles, if your team shares any',

321 when: 'Applied at session start when selected via the outputStyle setting',

322 description: <>Output styles are usually personal, so most live in <C>~/.claude/output-styles/</C>. Put one here if your team shares a style, like a review mode everyone uses. See <A href="#ce-global-output-styles">the Global tab</A> for the full explanation and example.</>,

323 docsLink: '/en/output-styles',

324 children: []

325 }, {

326 id: 'agents',

327 label: 'agents/',

328 type: 'folder',

329 icon: 'folder',

330 color: '#C46686',

331 oneLiner: 'Specialized subagents with their own context window',

332 when: 'Runs in its own context window when you or Claude invoke it',

333 description: 'Each markdown file defines a subagent with its own system prompt, tool access, and optionally its own model. Subagents run in a fresh context window, keeping the main conversation clean. Useful for parallel work or isolated tasks.',

334 tips: ['Each agent gets a fresh context window, separate from your main session', <>Restrict tool access per agent with the <C>tools:</C> frontmatter field</>, 'Type @ and pick an agent from the autocomplete to delegate directly'],

335 docsLink: '/en/sub-agents',

336 children: [{

337 id: 'agent-reviewer',

338 label: 'code-reviewer.md',

339 type: 'file',

340 icon: 'md',

341 color: '#C46686',

342 badge: 'committed',

343 oneLiner: 'Subagent for isolated code review',

344 when: 'Claude spawns it for review tasks, or you @-mention it from the autocomplete',

345 description: <>An example subagent restricted to read-only tools. The <C>description</C> frontmatter tells Claude when to delegate to it automatically; <C>tools:</C> limits it to Read, Grep, and Glob so it can inspect code but never edit. The body becomes the subagent's system prompt.</>,

346 example: `---

347name: code-reviewer

348description: Reviews code for correctness, security, and maintainability

349tools: Read, Grep, Glob

350 

351You are a senior code reviewer. Review for:

352 

3531. Correctness: logic errors, edge cases, null handling

3542. Security: injection, auth bypass, data exposure

3553. Maintainability: naming, complexity, duplication

356 

357Every finding must include a concrete fix.`

358 }]

359 }, {

360 id: 'agent-memory',

361 label: 'agent-memory/',

362 type: 'folder',

363 icon: 'folder',

364 color: '#C46686',

365 badge: 'committed',

366 autogen: true,

367 oneLiner: 'Subagent persistent memory, separate from your main session auto memory',

368 when: 'First 200 lines (capped at 25KB) of MEMORY.md loaded into the subagent system prompt when it runs',

369 description: <>Subagents with <C>memory: project</C> in their frontmatter get a dedicated memory directory here. This is distinct from your <A href="/en/memory#auto-memory">main session auto memory</A> at <C>~/.claude/projects/</C>: each subagent reads and writes its own MEMORY.md, not yours.</>,

370 tips: [<>Only created for subagents that set the <C>memory:</C> frontmatter field</>, <>This directory holds project-scoped subagent memory, meant to be shared with your team. To keep memory out of version control use <C>memory: local</C>, which writes to <C>.claude/agent-memory-local/</C> instead. For cross-project memory use <C>memory: user</C>, which writes to <C>~/.claude/agent-memory/</C></>, <>The main session auto memory is a different feature; see <C>~/.claude/projects/</C> in the Global tab</>],

371 docsLink: '/en/sub-agents#enable-persistent-memory',

372 children: [{

373 id: 'agent-memory-sub',

374 label: '<agent-name>/',

375 type: 'folder',

376 icon: 'folder',

377 color: '#C46686',

378 autogen: true,

379 children: [{

380 id: 'agent-memory-md',

381 label: 'MEMORY.md',

382 type: 'file',

383 icon: 'md',

384 color: '#C46686',

385 badge: 'committed',

386 autogen: true,

387 oneLiner: 'The subagent writes and maintains this file automatically',

388 when: 'Loaded into the subagent system prompt when the subagent starts',

389 description: <>Works the same as your <A href="/en/memory#auto-memory">main auto memory</A>: the subagent creates and updates this file itself. You do not write it. The subagent reads it at the start of each task and writes back what it learns.</>,

390 example: `# code-reviewer memory

391 

392## Patterns seen

393- Project uses custom Result<T, E> type, not exceptions

394- Auth middleware expects Bearer token in Authorization header

395- Tests use factory functions in test/factories/

396 

397## Recurring issues

398- Missing null checks on API responses (src/api/*)

399- Unhandled promise rejections in background jobs`

400 }]

401 }]

402 }]

403 }]

404 },

405 global: {

406 label: '~/',

407 children: [{

408 id: 'claude-json',

409 label: '.claude.json',

410 type: 'file',

411 icon: 'json',

412 color: 'var(--ce-text-3)',

413 badge: 'local',

414 oneLiner: 'App state and UI preferences',

415 when: <>Read at session start for your preferences and MCP servers. Claude Code writes back to it when you change settings in <C>/config</C> or approve trust prompts</>,

416 description: <>Holds state that does not belong in settings.json: theme, OAuth session, per-project trust decisions, your personal MCP servers, and UI toggles. Mostly managed through <C>/config</C> rather than editing directly.</>,

417 tips: [<>IDE toggles like <C>autoConnectIde</C> and <C>externalEditorContext</C> live here, not in settings.json</>, <>The <C>projects</C> key tracks per-project state like trust-dialog acceptance and last-session metrics. Permission rules you approve in-session go to <C>.claude/settings.local.json</C> instead</>, <>MCP servers here are yours only: user scope applies across all projects, local scope is per-project but not committed. Team-shared servers go in <C>.mcp.json</C> at the project root instead</>],

418 example: `{

419 "autoConnectIde": true,

420 "externalEditorContext": true,

421 "mcpServers": {

422 "my-tools": {

423 "command": "npx",

424 "args": ["-y", "@example/mcp-server"]

425 }

426 }

427}`,

428 docsLink: '/en/settings#global-config-settings'

429 }, {

430 id: 'global-dot-claude',

431 label: '.claude/',

432 type: 'folder',

433 icon: 'folder',

434 color: 'var(--ce-accent)',

435 oneLiner: 'Your personal configuration across all projects',

436 description: 'The global counterpart to your project .claude/ directory. Files here apply to every project you work in and are never committed to any repository.',

437 children: [{

438 id: 'global-claude-md',

439 label: 'CLAUDE.md',

440 type: 'file',

441 icon: 'md',

442 color: '#6A9BCC',

443 badge: 'local',

444 oneLiner: 'Personal preferences across every project',

445 when: 'Loaded at the start of every session, in every project',

446 description: 'Your global instruction file. Loaded alongside the project CLAUDE.md at session start, so both are in context together. When instructions conflict, project-level instructions take priority. Keep this to preferences that apply everywhere: response style, commit format, personal conventions.',

447 tips: ['Keep it short since it loads into context for every project, alongside that project\'s own CLAUDE.md', 'Good for response style, commit format, and personal conventions'],

448 example: `# Global preferences

449 

450- Keep explanations concise

451- Use conventional commit format

452- Show the terminal command to verify changes

453- Prefer composition over inheritance`,

454 docsLink: '/en/memory'

455 }, {

456 id: 'global-settings',

457 label: 'settings.json',

458 type: 'file',

459 icon: 'json',

460 color: 'var(--ce-text-3)',

461 badge: 'local',

462 oneLiner: 'Default settings for all projects',

463 when: 'Your defaults. Project and local settings.json override any keys you also set there',

464 description: [<>Same keys as project <C>settings.json</C>: permissions, hooks, model, environment variables, and the rest. Put settings here that you want in every project, like permissions you always allow, a preferred model, or a notification hook that runs regardless of which project you're in.</>, <>Settings follow a precedence order: project <C>settings.json</C> overrides any matching keys you set here. This is different from CLAUDE.md, where global and project files are both loaded into context rather than merged key by key.</>],

465 example: `{

466 "permissions": {

467 "allow": [

468 "Bash(git log *)",

469 "Bash(git diff *)"

470 ]

471 }

472}`,

473 docsLink: '/en/settings'

474 }, {

475 id: 'keybindings',

476 label: 'keybindings.json',

477 type: 'file',

478 icon: 'json',

479 color: 'var(--ce-text-3)',

480 badge: 'local',

481 oneLiner: 'Custom keyboard shortcuts',

482 when: 'Read at session start and hot-reloaded when you edit the file',

483 description: <>Rebind keyboard shortcuts in the interactive CLI. Run <C>/keybindings</C> to create or open this file with a schema reference. Ctrl+C, Ctrl+D, Ctrl+M, and Caps Lock are reserved and cannot be rebound.</>,

484 exampleIntro: <>This example binds <C>Ctrl+E</C> to open your external editor and unbinds <C>Ctrl+U</C> by setting it to <C>null</C>. The <C>context</C> field scopes bindings to a specific part of the CLI, here the main chat input.</>,

485 example: `{

486 "$schema": "https://www.schemastore.org/claude-code-keybindings.json",

487 "$docs": "https://code.claude.com/docs/en/keybindings",

488 "bindings": [

489 {

490 "context": "Chat",

491 "bindings": {

492 "ctrl+e": "chat:externalEditor",

493 "ctrl+u": null

494 }

495 }

496 ]

497}`,

498 docsLink: '/en/keybindings'

499 }, {

500 id: 'themes',

501 label: 'themes/',

502 type: 'folder',

503 icon: 'folder',

504 color: '#5AA7A7',

505 oneLiner: 'Custom color themes',

506 when: <>Read at session start and hot-reloaded when files change. Listed in <C>/theme</C></>,

507 description: <>Each <C>.json</C> file defines a custom color theme: a built-in <C>base</C> preset plus an <C>overrides</C> map of color tokens. Create one interactively with <C>/theme</C> or write the JSON by hand. Selecting a custom theme stores <C>custom:&lt;slug&gt;</C> as your theme preference.</>,

508 example: `{

509 "name": "Dracula",

510 "base": "dark",

511 "overrides": {

512 "claude": "#bd93f9",

513 "error": "#ff5555",

514 "success": "#50fa7b"

515 }

516}`,

517 docsLink: '/en/terminal-config#create-a-custom-theme',

518 children: []

519 }, {

520 id: 'global-projects',

521 label: 'projects/',

522 type: 'folder',

523 icon: 'folder',

524 color: '#E8A45C',

525 autogen: true,

526 oneLiner: "Auto memory: Claude's notes to itself, per project",

527 when: 'MEMORY.md loaded at session start; topic files read on demand',

528 description: 'Auto memory lets Claude accumulate knowledge across sessions without you writing anything. Claude saves notes as it works: build commands, debugging insights, architecture notes. Each project gets its own memory directory keyed by the repository path.',

529 tips: [<>On by default. Toggle with <C>/memory</C> or <C>autoMemoryEnabled</C> in settings</>, 'MEMORY.md is the index loaded each session. The first 200 lines, or 25KB, whichever comes first, are read', 'Topic files like debugging.md are read on demand, not at startup', 'These are plain markdown. Edit or delete them anytime'],

530 docsLink: '/en/memory#auto-memory',

531 children: [{

532 id: 'memory-dir',

533 label: '<project>/memory/',

534 type: 'folder',

535 icon: 'folder',

536 color: '#E8A45C',

537 autogen: true,

538 oneLiner: "Claude's accumulated knowledge for one project",

539 children: [{

540 id: 'memory-md',

541 label: 'MEMORY.md',

542 type: 'file',

543 icon: 'md',

544 color: '#E8A45C',

545 badge: 'local',

546 autogen: true,

547 oneLiner: 'Claude writes and maintains this file automatically',

548 when: 'First 200 lines (capped at 25KB) loaded at session start',

549 description: 'Claude creates and updates this file as it works; you do not write it yourself. It acts as an index that Claude reads at the start of every session, pointing to topic files for detail. You can edit or delete it, but Claude will keep updating it.',

550 example: `# Memory Index

551 

552## Project

553- [build-and-test.md](build-and-test.md): npm run build (~45s), Vitest, dev server on 3001

554- [architecture.md](architecture.md): API client singleton, refresh-token auth

555 

556## Reference

557- [debugging.md](debugging.md): auth token rotation and DB connection troubleshooting`,

558 docsLink: '/en/memory'

559 }, {

560 id: 'memory-topic',

561 label: 'debugging.md',

562 type: 'file',

563 icon: 'md',

564 color: '#E8A45C',

565 badge: 'local',

566 autogen: true,

567 oneLiner: 'Topic notes Claude writes when MEMORY.md gets long',

568 when: 'Claude reads this when a related task comes up',

569 description: 'An example of a topic file Claude creates when MEMORY.md grows too long. Claude picks the filename based on what it splits out: debugging.md, architecture.md, build-commands.md, or similar. You never create these yourself. Claude reads a topic file back only when the current task relates to it.',

570 example: `---

571name: Debugging patterns

572description: Auth token rotation and database connection troubleshooting for this project

573type: reference

574 

575## Auth Token Issues

576- Refresh token rotation: old token invalidated immediately

577- If 401 after refresh: check clock skew between client and server

578 

579## Database Connection Drops

580- Connection pool: max 10 in dev, 50 in prod

581- Always check \`docker compose ps\` first`

582 }]

583 }]

584 }, {

585 id: 'global-rules',

586 label: 'rules/',

587 type: 'folder',

588 icon: 'folder',

589 color: '#9B7BC4',

590 oneLiner: 'User-level rules that apply to every project',

591 when: <>Rules without <C>paths:</C> load at session start. Rules with <C>paths:</C> load when a matching file enters context</>,

592 description: 'Same as project .claude/rules/ but applies everywhere. Use this for conventions you want across all your work, like personal code style or commit message format.',

593 docsLink: '/en/memory#organize-rules-with-claude/rules/',

594 children: []

595 }, {

596 id: 'global-skills',

597 label: 'skills/',

598 type: 'folder',

599 icon: 'folder',

600 color: '#D4A843',

601 oneLiner: 'Personal skills available in every project',

602 when: <>Invoked with <C>/skill-name</C> in any project</>,

603 description: 'Skills you built for yourself that work everywhere. Same structure as project skills: each is a folder with SKILL.md, scoped to your user account instead of a single project.',

604 docsLink: '/en/skills',

605 children: []

606 }, {

607 id: 'global-commands',

608 label: 'commands/',

609 type: 'folder',

610 icon: 'folder',

611 color: '#788C5D',

612 oneLiner: 'Personal single-file commands available in every project',

613 note: commandsNote,

614 when: <>User types <C>/command-name</C> in any project</>,

615 description: 'Same as project commands/ but scoped to your user account. Each markdown file becomes a command available everywhere.',

616 docsLink: '/en/skills',

617 children: []

618 }, {

619 id: 'global-output-styles',

620 label: 'output-styles/',

621 type: 'folder',

622 icon: 'folder',

623 color: '#5AA7A7',

624 oneLiner: 'Custom system-prompt sections that adjust how Claude works',

625 when: 'Applied at session start when selected via the outputStyle setting',

626 description: [<>Each markdown file defines an output style: a section appended to the system prompt that, by default, also drops the built-in software-engineering task instructions. Use this to adapt Claude Code for uses beyond coding, or to add teaching or review modes.</>, <>Select a built-in or custom style with <C>/config</C> or the <C>outputStyle</C> key in settings. Styles here are available in every project; project-level styles with the same name take precedence.</>],

627 tips: ['Built-in styles Explanatory and Learning are included with Claude Code; custom styles go here', <>Set <C>keep-coding-instructions: true</C> in frontmatter to keep the default task instructions alongside your additions</>, 'Changes take effect on the next session since the system prompt is fixed at startup for caching'],

628 docsLink: '/en/output-styles',

629 children: [{

630 id: 'output-style-example',

631 label: 'teaching.md',

632 type: 'file',

633 icon: 'md',

634 color: '#5AA7A7',

635 badge: 'local',

636 oneLiner: 'Example style that adds explanations and leaves small changes for you',

637 when: <>Active when <C>outputStyle</C> in settings is set to <C>teaching</C></>,

638 description: <>This style appends instructions to the system prompt: Claude adds a "Why this approach" note after each task and leaves TODO(human) markers for changes under 10 lines instead of writing them itself. Select it by setting <C>outputStyle</C> to the filename without .md, or to the <C>name</C> field if you set one in frontmatter.</>,

639 example: `---

640description: Explains reasoning and asks you to implement small pieces

641keep-coding-instructions: true

642 

643After completing each task, add a brief "Why this approach" note

644explaining the key design decision.

645 

646When a change is under 10 lines, ask the user to implement it

647themselves by leaving a TODO(human) marker instead of writing it.`

648 }]

649 }, {

650 id: 'global-agents',

651 label: 'agents/',

652 type: 'folder',

653 icon: 'folder',

654 color: '#C46686',

655 oneLiner: 'Personal subagents available in every project',

656 when: 'Claude delegates or you @-mention in any project',

657 description: 'Subagents defined here are available across all your projects. Same format as project agents.',

658 docsLink: '/en/sub-agents',

659 children: []

660 }, {

661 id: 'global-agent-memory',

662 label: 'agent-memory/',

663 type: 'folder',

664 icon: 'folder',

665 color: '#C46686',

666 autogen: true,

667 oneLiner: <>Persistent memory for subagents with <C>memory: user</C></>,

668 when: 'Loaded into the subagent system prompt when the subagent starts',

669 description: <>Subagents with <C>memory: user</C> in their frontmatter store knowledge here that persists across all projects. For project-scoped subagent memory, see <C>.claude/agent-memory/</C> instead.</>,

670 docsLink: '/en/sub-agents#enable-persistent-memory',

671 children: []

672 }]

673 }]

674 }

675 }), []);

676 const BADGE_STYLES = useMemo(() => ({

677 committed: {

678 bg: 'rgba(85,138,66,0.08)',

679 color: 'var(--ce-badge-committed)',

680 border: 'rgba(85,138,66,0.15)',

681 label: 'committed'

682 },

683 gitignored: {

684 bg: 'rgba(217,119,87,0.06)',

685 color: 'var(--ce-badge-gitignored)',

686 border: 'rgba(217,119,87,0.15)',

687 label: 'gitignored'

688 },

689 local: {

690 bg: 'rgba(115,114,108,0.06)',

691 color: 'var(--ce-badge-local)',

692 border: 'rgba(115,114,108,0.12)',

693 label: 'local only'

694 },

695 autogen: {

696 bg: 'rgba(232,164,92,0.1)',

697 color: 'var(--ce-badge-autogen)',

698 border: 'rgba(232,164,92,0.2)',

699 label: 'Claude writes'

700 }

701 }), []);

702 const allNodes = useMemo(() => {

703 const flatten = (nodes, acc, path, parentId) => {

704 for (const node of nodes) {

705 const nextPath = [...path, node.label];

706 acc[node.id] = {

707 ...node,

708 path: nextPath,

709 parentId

710 };

711 if (node.children) flatten(node.children, acc, nextPath, node.id);

712 }

713 return acc;

714 };

715 const project = flatten(FILE_TREE.project.children, {}, [FILE_TREE.project.label]);

716 const global = flatten(FILE_TREE.global.children, {}, [FILE_TREE.global.label]);

717 for (const id in project) project[id].root = 'project';

718 for (const id in global) global[id].root = 'global';

719 return {

720 ...project,

721 ...global

722 };

723 }, [FILE_TREE]);

724 const allFolderIds = useMemo(() => Object.keys(allNodes).filter(id => allNodes[id].type === 'folder'), [allNodes]);

725 const DEFAULT_EXPANDED = ['dot-claude', 'rules', 'skills', 'skill-review', 'commands', 'agents', 'agent-memory', 'agent-memory-sub', 'global-dot-claude', 'global-output-styles', 'global-projects', 'memory-dir'];

726 const [mounted, setMounted] = useState(false);

727 const [activeRoot, setActiveRoot] = useState('project');

728 const [selectedId, setSelectedId] = useState('claude-md');

729 const [expandedFolders, setExpandedFolders] = useState(() => new Set(DEFAULT_EXPANDED));

730 const [forceMobile, setForceMobile] = useState(false);

731 const [copiedId, setCopiedId] = useState(null);

732 const [isFullscreen, setIsFullscreen] = useState(false);

733 const copyTimeoutRef = useRef(null);

734 const rootRef = useRef(null);

735 useEffect(() => {

736 setMounted(true);

737 const applyHash = scroll => {

738 const hash = window.location.hash.slice(1);

739 if (!hash.startsWith('ce-')) return;

740 const id = hash.slice(3);

741 const node = allNodes[id];

742 if (!node) return;

743 setActiveRoot(node.root);

744 setSelectedId(id);

745 setExpandedFolders(new Set(allFolderIds));

746 if (scroll && rootRef.current) rootRef.current.scrollIntoView({

747 behavior: 'smooth',

748 block: 'start'

749 });

750 };

751 applyHash(false);

752 const onHashChange = () => applyHash(true);

753 const onFsChange = () => setIsFullscreen(!!document.fullscreenElement);

754 window.addEventListener('hashchange', onHashChange);

755 document.addEventListener('fullscreenchange', onFsChange);

756 return () => {

757 if (copyTimeoutRef.current) clearTimeout(copyTimeoutRef.current);

758 window.removeEventListener('hashchange', onHashChange);

759 document.removeEventListener('fullscreenchange', onFsChange);

760 };

761 }, []);

762 useEffect(() => {

763 if (!mounted || !rootRef.current) return;

764 const hash = window.location.hash.slice(1);

765 if (hash.startsWith('ce-') && allNodes[hash.slice(3)]) {

766 rootRef.current.scrollIntoView({

767 behavior: 'smooth',

768 block: 'start'

769 });

770 }

771 }, [mounted]);

772 if (!mounted) return null;

773 const selected = allNodes[selectedId];

774 const tree = FILE_TREE[activeRoot];

775 const isCopied = copiedId === selected.id;

776 const toggleFolder = id => {

777 const next = new Set(expandedFolders);

778 next.has(id) ? next.delete(id) : next.add(id);

779 setExpandedFolders(next);

780 };

781 const switchRoot = root => {

782 if (root === activeRoot) return;

783 setActiveRoot(root);

784 const firstId = FILE_TREE[root].children[0].id;

785 setSelectedId(firstId);

786 try {

787 history.replaceState(null, '', '#ce-' + firstId);

788 } catch (e) {}

789 };

790 const toggleFullscreen = () => {

791 if (!rootRef.current) return;

792 if (document.fullscreenElement) document.exitFullscreen(); else rootRef.current.requestFullscreen().catch(() => {});

793 };

794 const selectNode = n => {

795 setSelectedId(n.id);

796 if (n.type === 'folder' && !expandedFolders.has(n.id)) toggleFolder(n.id);

797 try {

798 history.replaceState(null, '', '#ce-' + n.id);

799 } catch (e) {}

800 };

801 const iconBtn = {

802 width: 28,

803 flexShrink: 0,

804 borderRadius: '6px',

805 border: 'none',

806 cursor: 'pointer',

807 background: 'transparent',

808 color: 'var(--ce-text-4)',

809 display: 'flex',

810 alignItems: 'center',

811 justifyContent: 'center'

812 };

813 const visibleFolderIds = allFolderIds.filter(id => allNodes[id].root === activeRoot);

814 const allExpanded = visibleFolderIds.every(id => expandedFolders.has(id));

815 const toggleAllFolders = () => {

816 const next = new Set(expandedFolders);

817 visibleFolderIds.forEach(id => allExpanded ? next.delete(id) : next.add(id));

818 setExpandedFolders(next);

819 };

820 const onTreeKeyDown = e => {

821 if (!['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft'].includes(e.key)) return;

822 const visible = [];

823 const walk = nodes => {

824 for (const n of nodes) {

825 visible.push(n.id);

826 if (n.children && expandedFolders.has(n.id)) walk(n.children);

827 }

828 };

829 walk(tree.children);

830 const i = visible.indexOf(selectedId);

831 if (i === -1) return;

832 e.preventDefault();

833 if (e.key === 'ArrowDown' && i < visible.length - 1) selectNode(allNodes[visible[i + 1]]); else if (e.key === 'ArrowUp' && i > 0) selectNode(allNodes[visible[i - 1]]); else if (e.key === 'ArrowRight' && selected.type === 'folder') {

834 if (!expandedFolders.has(selectedId)) toggleFolder(selectedId); else if (selected.children && selected.children.length) selectNode(allNodes[selected.children[0].id]);

835 } else if (e.key === 'ArrowLeft') {

836 if (selected.type === 'folder' && expandedFolders.has(selectedId)) toggleFolder(selectedId); else if (selected.parentId) selectNode(allNodes[selected.parentId]);

837 }

838 };

839 const copyExample = (id, text) => {

840 const done = () => {

841 setCopiedId(id);

842 if (copyTimeoutRef.current) clearTimeout(copyTimeoutRef.current);

843 copyTimeoutRef.current = setTimeout(() => setCopiedId(null), 2000);

844 };

845 const fallback = () => {

846 const ta = document.createElement('textarea');

847 ta.value = text;

848 ta.style.position = 'fixed';

849 ta.style.opacity = '0';

850 document.body.appendChild(ta);

851 ta.select();

852 try {

853 if (document.execCommand('copy')) done();

854 } catch (e) {}

855 document.body.removeChild(ta);

856 };

857 if (navigator.clipboard) {

858 navigator.clipboard.writeText(text).then(done, fallback);

859 } else {

860 fallback();

861 }

862 };

863 const renderIcon = (icon, color, size) => {

864 const sz = size || 14;

865 if (icon === 'folder') {

866 return <svg width={sz} height={sz} viewBox="0 0 14 14" fill="none">

867 <path d="M1.5 3.5a1 1 0 0 1 1-1h2.6l1 1.2h5.4a1 1 0 0 1 1 1v5.8a1 1 0 0 1-1 1h-9a1 1 0 0 1-1-1V3.5z" fill={color} fillOpacity="0.15" stroke={color} strokeWidth="1" />

868 </svg>;

869 }

870 if (icon === 'json') {

871 return <svg width={sz} height={sz} viewBox="0 0 14 14" fill="none">

872 <rect x="2" y="1.5" width="10" height="11" rx="1.5" fill={color} fillOpacity="0.15" stroke={color} strokeWidth="1" />

873 <text x="7" y="9" fontSize="6" fontFamily="monospace" fill={color} textAnchor="middle" fontWeight="700">{'{}'}</text>

874 </svg>;

875 }

876 return <svg width={sz} height={sz} viewBox="0 0 14 14" fill="none">

877 <rect x="2" y="1.5" width="10" height="11" rx="1.5" fill={color} fillOpacity="0.15" stroke={color} strokeWidth="1" />

878 <line x1="4.5" y1="5" x2="9.5" y2="5" stroke={color} strokeWidth="1" />

879 <line x1="4.5" y1="7" x2="9.5" y2="7" stroke={color} strokeWidth="1" />

880 <line x1="4.5" y1="9" x2="8" y2="9" stroke={color} strokeWidth="1" />

881 </svg>;

882 };

883 const renderNode = (node, depth) => {

884 const isFolder = node.type === 'folder';

885 const isExpanded = expandedFolders.has(node.id);

886 const isSelected = selectedId === node.id;

887 return <div key={node.id}>

888 <button role="treeitem" tabIndex={-1} onClick={() => selectNode(node)} aria-selected={isSelected} aria-expanded={isFolder ? isExpanded : undefined} style={{

889 display: 'flex',

890 alignItems: 'center',

891 gap: '5px',

892 width: '100%',

893 padding: `4px 8px 4px ${8 + depth * 16}px`,

894 background: isSelected ? 'var(--ce-accent-bg)' : 'transparent',

895 borderTop: 'none',

896 borderRight: 'none',

897 borderBottom: 'none',

898 borderLeft: isSelected ? '2px solid var(--ce-accent)' : '2px solid transparent',

899 outline: 'none',

900 cursor: 'pointer',

901 textAlign: 'left',

902 fontFamily: 'var(--ce-mono)',

903 fontSize: '13.5px',

904 color: isSelected ? 'var(--ce-accent)' : 'var(--ce-text-2)',

905 fontWeight: isSelected ? 550 : 400,

906 transition: 'all 0.1s'

907 }}>

908 {isFolder ? <span onClick={e => {

909 e.stopPropagation();

910 toggleFolder(node.id);

911 }} style={{

912 fontSize: '14px',

913 color: 'var(--ce-text-4)',

914 width: '20px',

915 height: '20px',

916 display: 'inline-flex',

917 alignItems: 'center',

918 justifyContent: 'center',

919 cursor: 'pointer',

920 borderRadius: '4px',

921 marginLeft: '-6px',

922 flexShrink: 0

923 }} onMouseEnter={e => {

924 e.currentTarget.style.background = 'var(--ce-arrow-hover)';

925 e.currentTarget.style.color = 'var(--ce-text-2)';

926 }} onMouseLeave={e => {

927 e.currentTarget.style.background = 'transparent';

928 e.currentTarget.style.color = 'var(--ce-text-4)';

929 }}>{isExpanded ? '▾' : '▸'}</span> : <span style={{

930 width: '14px',

931 flexShrink: 0

932 }} />}

933 {renderIcon(node.icon, node.color)}

934 <span style={{

935 flex: 1,

936 overflow: 'hidden',

937 textOverflow: 'ellipsis',

938 whiteSpace: 'nowrap'

939 }}>{node.label}</span>

940 {node.badge && BADGE_STYLES[node.badge] && <span title={BADGE_STYLES[node.badge].label} style={{

941 width: 6,

942 height: 6,

943 borderRadius: '50%',

944 background: BADGE_STYLES[node.badge].color,

945 flexShrink: 0,

946 opacity: 0.7

947 }} />}

948 </button>

949 {isFolder && isExpanded && node.children && <div role="group">{node.children.map(child => renderNode(child, depth + 1))}</div>}

950 </div>;

951 };

952 return <>

953 <style>{`

954 .ce-root {

955 --ce-mono: var(--font-mono, ui-monospace, monospace);

956 --ce-accent: #D97757;

957 --ce-accent-bg: rgba(217,119,87,0.06);

958 --ce-accent-border: rgba(217,119,87,0.12);

959 --ce-bg: #fff;

960 --ce-surface: #FAFAF7;

961 --ce-surface-hover: #F0EEE6;

962 --ce-border: #E8E6DC;

963 --ce-border-subtle: #F0EEE6;

964 --ce-text: #141413;

965 --ce-text-2: #5E5D59;

966 --ce-text-3: #73726C;

967 --ce-text-4: #9C9A92;

968 --ce-text-5: #B8B6AE;

969 --ce-sep: #D1CFC5;

970 --ce-code-header: #F5F4ED;

971 --ce-code-bg: #1A1918;

972 --ce-arrow-hover: rgba(0,0,0,0.08);

973 --ce-badge-committed: #3d6b2e;

974 --ce-badge-gitignored: #b85c3a;

975 --ce-badge-local: #5e5d59;

976 --ce-badge-autogen: #b07520;

977 --ce-when-text: #4a7fb5;

978 }

979 .dark .ce-root {

980 --ce-bg: #1a1918;

981 --ce-surface: #232221;

982 --ce-surface-hover: #2e2d2b;

983 --ce-border: #3a3936;

984 --ce-border-subtle: #2e2d2b;

985 --ce-text: #e8e6dc;

986 --ce-text-2: #c4c2b8;

987 --ce-text-3: #9c9a92;

988 --ce-text-4: #73726c;

989 --ce-text-5: #5e5d59;

990 --ce-sep: #4a4946;

991 --ce-code-header: #2e2d2b;

992 --ce-code-bg: #0d0d0c;

993 --ce-arrow-hover: rgba(255,255,255,0.08);

994 --ce-badge-committed: #6fa85c;

995 --ce-badge-gitignored: #e08a60;

996 --ce-badge-local: #9c9a92;

997 --ce-badge-autogen: #e8a45c;

998 --ce-when-text: #8bb4e0;

999 }

1000 .ce-mobile-fallback { display: none; border: 1px solid rgba(0,0,0,0.1); background: rgba(0,0,0,0.03); }

1001 .dark .ce-mobile-fallback { border-color: rgba(255,255,255,0.15); background: rgba(255,255,255,0.04); }

1002 @media (max-width: 700px) {

1003 .ce-root:not(.ce-force) { display: none !important; }

1004 .ce-mobile-fallback { display: block; }

1005 }

1006 `}</style>

1007 {!forceMobile && <div className="ce-mobile-fallback" style={{

1008 padding: '14px 16px',

1009 borderRadius: '8px',

1010 fontSize: '14px'

1011 }}>

1012 The interactive explorer works best on a larger screen. See the <a href="#file-reference" style={{

1013 color: '#D97757'

1014 }}>file reference table</a> below, or <button onClick={() => setForceMobile(true)} style={{

1015 border: 'none',

1016 background: 'none',

1017 padding: 0,

1018 color: '#D97757',

1019 textDecoration: 'underline',

1020 cursor: 'pointer',

1021 font: 'inherit'

1022 }}>show the explorer anyway</button>.

1023 </div>}

1024 <div ref={rootRef} className={forceMobile ? 'ce-root ce-force' : 'ce-root'} style={{

1025 borderRadius: isFullscreen ? 0 : '12px',

1026 border: '1px solid var(--ce-border)',

1027 background: 'var(--ce-bg)',

1028 display: 'flex',

1029 alignItems: 'stretch',

1030 overflow: 'hidden',

1031 fontFamily: 'var(--font-sans, -apple-system, sans-serif)',

1032 ...isFullscreen && ({

1033 height: '100vh'

1034 })

1035 }}>

1036 {}

1037 <div style={{

1038 width: 'min(240px, 35%)',

1039 minWidth: '180px',

1040 flexShrink: 0,

1041 borderRight: '1px solid var(--ce-border-subtle)',

1042 background: 'var(--ce-surface)',

1043 display: 'flex',

1044 flexDirection: 'column'

1045 }}>

1046 <div style={{

1047 padding: '8px 8px 4px',

1048 borderBottom: '1px solid var(--ce-border-subtle)',

1049 display: 'flex',

1050 gap: '4px'

1051 }}>

1052 {['project', 'global'].map(root => <button key={root} onClick={() => switchRoot(root)} style={{

1053 flex: 1,

1054 padding: '6px 0',

1055 borderRadius: '6px',

1056 border: 'none',

1057 cursor: 'pointer',

1058 fontFamily: 'var(--ce-mono)',

1059 fontSize: '11.5px',

1060 background: activeRoot === root ? 'var(--ce-accent-bg)' : 'transparent',

1061 color: activeRoot === root ? 'var(--ce-accent)' : 'var(--ce-text-4)',

1062 fontWeight: activeRoot === root ? 600 : 430

1063 }}>

1064 {root === 'project' ? 'Project' : 'Global (~/)'}

1065 </button>)}

1066 <button onClick={toggleAllFolders} title={allExpanded ? 'Collapse all' : 'Expand all'} style={{

1067 ...iconBtn,

1068 fontSize: 11

1069 }}>

1070 {allExpanded ? '⊟' : '⊞'}

1071 </button>

1072 <button onClick={toggleFullscreen} title={isFullscreen ? 'Exit fullscreen' : 'Fullscreen'} style={{

1073 ...iconBtn,

1074 fontSize: 13

1075 }}>

1076 {isFullscreen ? '⤡' : '⛶'}

1077 </button>

1078 </div>

1079 <div role="tree" aria-label="Configuration files" tabIndex={0} onKeyDown={onTreeKeyDown} style={{

1080 padding: '6px 0',

1081 overflowY: 'auto',

1082 flex: 1,

1083 outline: 'none'

1084 }}>

1085 {tree.children.map(node => renderNode(node, 0))}

1086 </div>

1087 </div>

1088 

1089 {}

1090 <div style={{

1091 flex: 1,

1092 minWidth: 0,

1093 padding: '20px 24px',

1094 minHeight: '400px',

1095 overflowY: 'auto'

1096 }}>

1097 <span aria-live="polite" style={{

1098 position: 'absolute',

1099 width: 1,

1100 height: 1,

1101 overflow: 'hidden',

1102 clip: 'rect(0 0 0 0)'

1103 }}>{selected.label} selected</span>

1104 {}

1105 <div style={{

1106 fontFamily: 'var(--ce-mono)',

1107 fontSize: '11px',

1108 color: 'var(--ce-text-4)',

1109 marginBottom: '10px',

1110 cursor: 'default'

1111 }}>

1112 {selected.path.map((seg, i) => <span key={i}>

1113 <span style={{

1114 color: i === selected.path.length - 1 ? 'var(--ce-accent)' : 'var(--ce-text-4)'

1115 }}>{seg.replace(/\/$/, '')}</span>

1116 {i < selected.path.length - 1 && <span style={{

1117 color: 'var(--ce-sep)'

1118 }}> / </span>}

1119 </span>)}

1120 </div>

1121 

1122 {}

1123 <div style={{

1124 display: 'flex',

1125 alignItems: 'flex-start',

1126 gap: '10px',

1127 marginBottom: '10px'

1128 }}>

1129 <span style={{

1130 flexShrink: 0,

1131 display: 'flex'

1132 }}>{renderIcon(selected.icon, selected.color, 24)}</span>

1133 <div style={{

1134 flex: 1,

1135 minWidth: 0

1136 }}>

1137 <div style={{

1138 fontSize: '22px',

1139 fontWeight: 600,

1140 color: 'var(--ce-text)',

1141 letterSpacing: '-0.3px',

1142 lineHeight: '26px'

1143 }}>{selected.label}</div>

1144 {selected.oneLiner && <div style={{

1145 fontSize: '15px',

1146 color: 'var(--ce-text-3)',

1147 marginTop: '3px'

1148 }}>{selected.oneLiner}</div>}

1149 </div>

1150 <div style={{

1151 display: 'flex',

1152 gap: '4px',

1153 flexShrink: 0

1154 }}>

1155 {[selected.autogen && 'autogen', selected.badge].filter(Boolean).map(k => {

1156 const s = BADGE_STYLES[k];

1157 if (!s) return null;

1158 return <span key={k} style={{

1159 fontFamily: 'var(--ce-mono)',

1160 fontSize: '10px',

1161 fontWeight: 600,

1162 textTransform: 'uppercase',

1163 letterSpacing: '0.3px',

1164 padding: '2px 6px',

1165 borderRadius: '4px',

1166 background: s.bg,

1167 color: s.color,

1168 border: `0.5px solid ${s.border}`

1169 }}>{s.label}</span>;

1170 })}

1171 </div>

1172 </div>

1173 

1174 {}

1175 {selected.note && <div style={{

1176 padding: '10px 12px',

1177 borderRadius: '8px',

1178 marginBottom: '14px',

1179 background: 'rgba(217,119,87,0.06)',

1180 border: '1px solid rgba(217,119,87,0.2)',

1181 borderLeft: '3px solid var(--ce-accent)',

1182 fontSize: '15px',

1183 color: 'var(--ce-text-2)',

1184 lineHeight: 1.6

1185 }}>

1186 {selected.note}

1187 </div>}

1188 

1189 {}

1190 {selected.when && <div style={{

1191 padding: '8px 12px',

1192 borderRadius: '6px',

1193 background: 'rgba(106,155,204,0.06)',

1194 border: '0.5px solid rgba(106,155,204,0.12)',

1195 fontSize: '15px',

1196 color: 'var(--ce-when-text)',

1197 marginBottom: '16px'

1198 }}>

1199 <div style={{

1200 fontSize: '10px',

1201 fontWeight: 700,

1202 textTransform: 'uppercase',

1203 letterSpacing: '0.4px',

1204 opacity: 0.65,

1205 marginBottom: '3px'

1206 }}>When it loads</div>

1207 <div style={{

1208 fontWeight: 500

1209 }}>{selected.when}</div>

1210 </div>}

1211 

1212 {}

1213 {selected.description && <div style={{

1214 fontSize: '16px',

1215 color: 'var(--ce-text-2)',

1216 lineHeight: 1.65,

1217 marginBottom: '16px'

1218 }}>

1219 {Array.isArray(selected.description) ? selected.description.map((para, i) => <div key={i} style={{

1220 marginBottom: i < selected.description.length - 1 ? '12px' : 0

1221 }}>{para}</div>) : selected.description}

1222 </div>}

1223 

1224 {}

1225 {selected.contains && selected.contains.length > 0 && <div style={{

1226 marginBottom: '16px'

1227 }}>

1228 <div style={{

1229 fontSize: '11px',

1230 fontWeight: 700,

1231 color: 'var(--ce-text-4)',

1232 textTransform: 'uppercase',

1233 letterSpacing: '0.4px',

1234 marginBottom: '8px'

1235 }}>Common keys</div>

1236 {selected.contains.map((item, i) => <div key={i} style={{

1237 display: 'flex',

1238 gap: '7px',

1239 fontSize: '15px',

1240 color: 'var(--ce-text-2)',

1241 lineHeight: 1.5,

1242 marginBottom: '5px'

1243 }}>

1244 <span style={{

1245 fontSize: '7px',

1246 color: 'var(--ce-text-4)',

1247 marginTop: '6px'

1248 }}>●</span>

1249 <span>{item}</span>

1250 </div>)}

1251 </div>}

1252 

1253 {}

1254 {selected.tips && selected.tips.length > 0 && <div style={{

1255 padding: '12px 14px',

1256 borderRadius: '8px',

1257 background: 'var(--ce-surface)',

1258 border: '1px solid var(--ce-border-subtle)',

1259 marginBottom: '16px'

1260 }}>

1261 <div style={{

1262 fontSize: '11px',

1263 fontWeight: 700,

1264 color: 'var(--ce-accent)',

1265 textTransform: 'uppercase',

1266 letterSpacing: '0.4px',

1267 marginBottom: '6px'

1268 }}>Tips</div>

1269 {selected.tips.map((tip, i) => <div key={i} style={{

1270 display: 'flex',

1271 gap: '7px',

1272 fontSize: '14.5px',

1273 color: 'var(--ce-text-2)',

1274 marginBottom: i < selected.tips.length - 1 ? '5px' : 0

1275 }}>

1276 <span style={{

1277 fontSize: '7px',

1278 color: 'var(--ce-accent)',

1279 marginTop: '6px'

1280 }}>●</span>

1281 <span>{tip}</span>

1282 </div>)}

1283 </div>}

1284 

1285 {}

1286 {selected.example && <div style={{

1287 marginBottom: '16px'

1288 }}>

1289 {selected.exampleIntro && <div style={{

1290 fontSize: '15px',

1291 color: 'var(--ce-text-2)',

1292 lineHeight: 1.6,

1293 marginBottom: '10px'

1294 }}>

1295 {selected.exampleIntro}

1296 </div>}

1297 <div style={{

1298 display: 'flex',

1299 justifyContent: 'space-between',

1300 alignItems: 'center',

1301 padding: '6px 10px',

1302 background: 'var(--ce-code-header)',

1303 border: '1px solid var(--ce-border)',

1304 borderRadius: '8px 8px 0 0'

1305 }}>

1306 <span style={{

1307 fontFamily: 'var(--ce-mono)',

1308 fontSize: '11px',

1309 fontWeight: 600,

1310 color: 'var(--ce-text-3)'

1311 }}>{selected.label}</span>

1312 <button onClick={() => copyExample(selected.id, selected.example)} style={{

1313 padding: '3px 8px',

1314 borderRadius: '4px',

1315 fontSize: '11px',

1316 fontWeight: 600,

1317 cursor: 'pointer',

1318 transition: 'all 0.15s',

1319 background: isCopied ? 'rgba(85,138,66,0.08)' : 'var(--ce-code-header)',

1320 border: isCopied ? '0.5px solid rgba(85,138,66,0.2)' : '0.5px solid var(--ce-border)',

1321 color: isCopied ? '#558A42' : 'var(--ce-text-3)'

1322 }}>

1323 {isCopied ? '✓ Copied' : 'Copy'}

1324 </button>

1325 </div>

1326 <pre style={{

1327 margin: 0,

1328 padding: '12px 14px',

1329 background: 'var(--ce-code-bg)',

1330 color: '#E8E6DC',

1331 fontFamily: 'var(--ce-mono)',

1332 fontSize: '13px',

1333 lineHeight: 1.65,

1334 borderRadius: '0 0 8px 8px',

1335 overflowX: 'auto',

1336 whiteSpace: 'pre'

1337 }}>{selected.example}</pre>

1338 </div>}

1339 

1340 {}

1341 {selected.docsLink && <a href={selected.docsLink} style={{

1342 display: 'inline-flex',

1343 padding: '5px 12px',

1344 borderRadius: '6px',

1345 background: 'var(--ce-accent-bg)',

1346 border: '1px solid var(--ce-accent-border)',

1347 color: 'var(--ce-accent)',

1348 fontSize: '12px',

1349 fontWeight: 600,

1350 textDecoration: 'none'

1351 }}>Full docs →</a>}

1352 

1353 {}

1354 {selected.children && selected.children.length > 0 && <div style={{

1355 marginTop: '20px'

1356 }}>

1357 <div style={{

1358 fontSize: '11px',

1359 fontWeight: 700,

1360 color: 'var(--ce-text-4)',

1361 textTransform: 'uppercase',

1362 letterSpacing: '0.4px',

1363 marginBottom: '8px'

1364 }}>Contents</div>

1365 <div style={{

1366 display: 'flex',

1367 flexDirection: 'column',

1368 gap: '4px'

1369 }}>

1370 {selected.children.map(child => <button key={child.id} onClick={() => selectNode(child)} style={{

1371 display: 'flex',

1372 alignItems: 'center',

1373 gap: '8px',

1374 padding: '6px 8px',

1375 width: '100%',

1376 background: 'var(--ce-surface)',

1377 borderRadius: '6px',

1378 border: 'none',

1379 cursor: 'pointer',

1380 textAlign: 'left',

1381 transition: 'background 0.1s'

1382 }} onMouseEnter={e => e.currentTarget.style.background = 'var(--ce-surface-hover)'} onMouseLeave={e => e.currentTarget.style.background = 'var(--ce-surface)'}>

1383 {renderIcon(child.icon, child.color, 13)}

1384 <span style={{

1385 fontFamily: 'var(--ce-mono)',

1386 fontSize: '12px',

1387 color: 'var(--ce-text-2)'

1388 }}>{child.label}</span>

1389 {child.oneLiner && <span style={{

1390 fontSize: '11px',

1391 color: 'var(--ce-text-4)',

1392 overflow: 'hidden',

1393 textOverflow: 'ellipsis',

1394 whiteSpace: 'nowrap'

1395 }}>{child.oneLiner}</span>}

1396 </button>)}

1397 </div>

1398 </div>}

1399 </div>

1400 </div>

1401 </>;

1402};

1403 8 

1404Claude Code membaca instruksi, pengaturan, skills, subagents, dan memory dari direktori proyek Anda dan dari `~/.claude` di direktori home Anda. Commit file proyek ke git untuk membagikannya dengan tim Anda; file di `~/.claude` adalah konfigurasi pribadi yang berlaku di semua proyek Anda.9Claude Code membaca instruksi, pengaturan, skills, subagents, dan memory dari direktori proyek Anda dan dari `~/.claude` di direktori home Anda. Commit file proyek ke git untuk membagikannya dengan tim Anda; file di `~/.claude` adalah konfigurasi pribadi yang berlaku di semua proyek Anda.

1405 10 

1414 12 

1415Sebagian besar pengguna hanya mengedit `CLAUDE.md` dan `settings.json`. Sisa direktori bersifat opsional: tambahkan skills, rules, atau subagents sesuai kebutuhan Anda.13Sebagian besar pengguna hanya mengedit `CLAUDE.md` dan `settings.json`. Sisa direktori bersifat opsional: tambahkan skills, rules, atau subagents sesuai kebutuhan Anda.

1416 14 

1417## Jelajahi direktori15<h2 id="explore-the-directory">

16 Jelajahi direktori

17</h2>

1418 18 

1419Klik file di pohon untuk melihat apa yang dilakukan masing-masing, kapan dimuat, dan contohnya.19Klik file di pohon untuk melihat apa yang dilakukan masing-masing, kapan dimuat, dan contohnya.

1420 20 

1421<ClaudeExplorer />21<h2 id="what-s-not-shown">

1422 22 Apa yang tidak ditampilkan

1423## Apa yang tidak ditampilkan23</h2>

1424 24 

1425Penjelajah mencakup file yang Anda buat dan edit. Beberapa file terkait berada di tempat lain:25Penjelajah mencakup file yang Anda buat dan edit. Beberapa file terkait berada di tempat lain:

1426 26 

1432 32 

1433`~/.claude` juga menyimpan data yang ditulis Claude Code saat Anda bekerja: transkrip, riwayat prompt, snapshot file, cache, dan log. Lihat [data aplikasi](#application-data) di bawah.33`~/.claude` juga menyimpan data yang ditulis Claude Code saat Anda bekerja: transkrip, riwayat prompt, snapshot file, cache, dan log. Lihat [data aplikasi](#application-data) di bawah.

1434 34 

1435## Pilih file yang tepat35<h2 id="choose-the-right-file">

36 Pilih file yang tepat

37</h2>

1436 38 

1437Berbagai jenis kustomisasi berada di file yang berbeda. Gunakan tabel ini untuk menemukan di mana perubahan harus dilakukan.39Berbagai jenis kustomisasi berada di file yang berbeda. Gunakan tabel ini untuk menemukan di mana perubahan harus dilakukan.

1438 40 

1445| Simpan penggantian pribadi di luar git | `settings.local.json` | proyek saja | [Settings scopes](/id/settings#settings-files) |47| Simpan penggantian pribadi di luar git | `settings.local.json` | proyek saja | [Settings scopes](/id/settings#settings-files) |

1446| Tambahkan prompt atau kemampuan yang Anda panggil dengan `/name` | `skills/<name>/SKILL.md` | proyek atau global | [Skills](/id/skills) |48| Tambahkan prompt atau kemampuan yang Anda panggil dengan `/name` | `skills/<name>/SKILL.md` | proyek atau global | [Skills](/id/skills) |

1447| Tentukan subagent khusus dengan tools-nya sendiri | `agents/*.md` | proyek atau global | [Subagents](/id/sub-agents) |49| Tentukan subagent khusus dengan tools-nya sendiri | `agents/*.md` | proyek atau global | [Subagents](/id/sub-agents) |

50| Orkestrasi banyak subagent dari skrip | `workflows/*.js` | proyek atau global | [Dynamic workflows](/id/workflows) |

1448| Hubungkan tools eksternal melalui MCP | `.mcp.json` | proyek saja | [MCP](/id/mcp) |51| Hubungkan tools eksternal melalui MCP | `.mcp.json` | proyek saja | [MCP](/id/mcp) |

1449| Ubah cara Claude memformat respons | `output-styles/*.md` | proyek atau global | [Output styles](/id/output-styles) |52| Ubah cara Claude memformat respons | `output-styles/*.md` | proyek atau global | [Output styles](/id/output-styles) |

1450 53 

1451## Referensi file54<h2 id="file-reference">

55 Referensi file

56</h2>

1452 57 

1453Tabel ini mencantumkan setiap file yang dicakup penjelajah. File dengan cakupan proyek berada di repo Anda di bawah `.claude/` (atau di akar untuk `CLAUDE.md`, `.mcp.json`, dan `.worktreeinclude`). File dengan cakupan global berada di `~/.claude/` dan berlaku di semua proyek.58Tabel ini mencantumkan setiap file yang dicakup penjelajah. File dengan cakupan proyek berada di repo Anda di bawah `.claude/` (atau di akar untuk `CLAUDE.md`, `.mcp.json`, dan `.worktreeinclude`). File dengan cakupan global berada di `~/.claude/` dan berlaku di semua proyek.

1454 59 

1465Klik nama file untuk membuka node itu di penjelajah di atas.70Klik nama file untuk membuka node itu di penjelajah di atas.

1466 71 

1467| File | Cakupan | Commit | Apa yang dilakukan | Referensi |72| File | Cakupan | Commit | Apa yang dilakukan | Referensi |

1468| --------------------------------------------------- | ----------------- | ------ | ------------------------------------------------------------------------------ | --------------------------------------------------------------- |73| --------------------------------------------------- | ----------------- | ------ | ---------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------- |

1469| [`CLAUDE.md`](#ce-claude-md) | Proyek dan global | ✓ | Instruksi dimuat setiap sesi | [Memory](/id/memory) |74| [`CLAUDE.md`](#ce-claude-md) | Proyek dan global | ✓ | Instruksi dimuat setiap sesi | [Memory](/id/memory) |

1470| [`rules/*.md`](#ce-rules) | Proyek dan global | ✓ | Instruksi dengan cakupan topik, opsional gated path | [Rules](/id/memory#organize-rules-with-claude/rules/) |75| [`rules/*.md`](#ce-rules) | Proyek dan global | ✓ | Instruksi dengan cakupan topik, opsional gated path | [Rules](/id/memory#organize-rules-with-claude/rules/) |

1471| [`settings.json`](#ce-settings-json) | Proyek dan global | ✓ | Izin, hooks, variabel env, default model | [Settings](/id/settings) |76| [`settings.json`](#ce-settings-json) | Proyek dan global | ✓ | Izin, hooks, variabel env, default model | [Settings](/id/settings) |

1476| [`commands/*.md`](#ce-commands) | Proyek dan global | ✓ | Prompt file tunggal; mekanisme yang sama dengan skills | [Skills](/id/skills) |81| [`commands/*.md`](#ce-commands) | Proyek dan global | ✓ | Prompt file tunggal; mekanisme yang sama dengan skills | [Skills](/id/skills) |

1477| [`output-styles/*.md`](#ce-output-styles) | Proyek dan global | ✓ | Bagian prompt sistem khusus | [Output styles](/id/output-styles) |82| [`output-styles/*.md`](#ce-output-styles) | Proyek dan global | ✓ | Bagian prompt sistem khusus | [Output styles](/id/output-styles) |

1478| [`agents/*.md`](#ce-agents) | Proyek dan global | ✓ | Definisi subagent dengan prompt dan tools mereka sendiri | [Subagents](/id/sub-agents) |83| [`agents/*.md`](#ce-agents) | Proyek dan global | ✓ | Definisi subagent dengan prompt dan tools mereka sendiri | [Subagents](/id/sub-agents) |

84| [`workflows/*.js`](#ce-workflows) | Proyek dan global | ✓ | Skrip workflow dinamis yang ditulis oleh Claude dan disimpan dari `/workflows`; setiap file menjadi perintah `/<name>` | [Dynamic workflows](/id/workflows) |

1479| [`agent-memory/<name>/`](#ce-agent-memory) | Proyek dan global | ✓ | Memory persisten untuk subagents | [Persistent memory](/id/sub-agents#enable-persistent-memory) |85| [`agent-memory/<name>/`](#ce-agent-memory) | Proyek dan global | ✓ | Memory persisten untuk subagents | [Persistent memory](/id/sub-agents#enable-persistent-memory) |

1480| [`~/.claude.json`](#ce-claude-json) | Global saja | | Status aplikasi, OAuth, toggle UI, server MCP pribadi | [Global config](/id/settings#global-config-settings) |86| [`~/.claude.json`](#ce-claude-json) | Global saja | | Status aplikasi, OAuth, toggle UI, server MCP pribadi | [Global config](/id/settings#global-config-settings) |

1481| [`projects/<project>/memory/`](#ce-global-projects) | Global saja | | Auto memory: catatan Claude untuk dirinya sendiri di seluruh sesi | [Auto memory](/id/memory#auto-memory) |87| [`projects/<project>/memory/`](#ce-global-projects) | Global saja | | Auto memory: catatan Claude untuk dirinya sendiri di seluruh sesi | [Auto memory](/id/memory#auto-memory) |

1482| [`keybindings.json`](#ce-keybindings) | Global saja | | Pintasan keyboard khusus | [Keybindings](/id/keybindings) |88| [`keybindings.json`](#ce-keybindings) | Global saja | | Pintasan keyboard khusus | [Keybindings](/id/keybindings) |

1483| [`themes/*.json`](#ce-themes) | Global saja | | Tema warna khusus | [Custom themes](/id/terminal-config#create-a-custom-theme) |89| [`themes/*.json`](#ce-themes) | Global saja | | Tema warna khusus | [Custom themes](/id/terminal-config#create-a-custom-theme) |

1484 90 

1485## Troubleshoot konfigurasi91<h2 id="troubleshoot-configuration">

92 Troubleshoot konfigurasi

93</h2>

1486 94 

1487Jika pengaturan, hook, atau file tidak berlaku, lihat [Debug konfigurasi Anda](/id/debug-your-config) untuk perintah inspeksi dan tabel pencarian berdasarkan gejala.95Jika pengaturan, hook, atau file tidak berlaku, lihat [Debug konfigurasi Anda](/id/debug-your-config) untuk perintah inspeksi dan tabel pencarian berdasarkan gejala.

1488 96 

1489## Data aplikasi97<h2 id="application-data">

98 Data aplikasi

99</h2>

1490 100 

1491Selain konfigurasi yang Anda buat, `~/.claude` menyimpan data yang ditulis Claude Code selama sesi. File-file ini adalah plaintext. Apa pun yang melewati tool mendarat di transkrip di disk: konten file, output perintah, teks yang ditempel.101Selain konfigurasi yang Anda buat, `~/.claude` menyimpan data yang ditulis Claude Code selama sesi. File-file ini adalah plaintext. Apa pun yang melewati tool mendarat di transkrip di disk: konten file, output perintah, teks yang ditempel.

1492 102 

1493### Dibersihkan secara otomatis103<h3 id="cleaned-up-automatically">

104 Dibersihkan secara otomatis

105</h3>

1494 106 

1495File di jalur di bawah dihapus saat startup setelah berusia lebih dari [`cleanupPeriodDays`](/id/settings#available-settings). Default adalah 30 hari.107File di jalur di bawah dihapus saat startup setelah berusia lebih dari [`cleanupPeriodDays`](/id/settings#available-settings). Default adalah 30 hari.

1496 108 

1508| `shell-snapshots/` | Lingkungan shell yang ditangkap digunakan oleh Bash tool. Dihapus saat keluar dengan bersih. Sweep membersihkan yang tertinggal setelah crash. |120| `shell-snapshots/` | Lingkungan shell yang ditangkap digunakan oleh Bash tool. Dihapus saat keluar dengan bersih. Sweep membersihkan yang tertinggal setelah crash. |

1509| `backups/` | Salinan `~/.claude.json` dengan stempel waktu yang diambil sebelum migrasi konfigurasi |121| `backups/` | Salinan `~/.claude.json` dengan stempel waktu yang diambil sebelum migrasi konfigurasi |

1510| `feedback-bundles/` | Arsip transkrip yang disunting ditulis oleh `/feedback` pada penyedia pihak ketiga, untuk dikirim ke tim akun Anthropic Anda |122| `feedback-bundles/` | Arsip transkrip yang disunting ditulis oleh `/feedback` pada penyedia pihak ketiga, untuk dikirim ke tim akun Anthropic Anda |

123| `todos/`, `statsig/`, `logs/` | Direktori warisan dari versi yang lebih lama. Tidak lagi ditulis. Sweep menghapus kontennya dan kemudian direktori kosong. |

1511 124 

1512### Disimpan sampai Anda menghapusnya125<h3 id="kept-until-you-delete-them">

126 Disimpan sampai Anda menghapusnya

127</h3>

1513 128 

1514Jalur berikut tidak tercakup oleh pembersihan otomatis dan bertahan selamanya.129Jalur berikut tidak tercakup oleh pembersihan otomatis dan bertahan selamanya.

1515 130 

1518| `history.jsonl` | Setiap prompt yang Anda ketik, dengan timestamp dan jalur proyek. Digunakan untuk recall panah atas. |133| `history.jsonl` | Setiap prompt yang Anda ketik, dengan timestamp dan jalur proyek. Digunakan untuk recall panah atas. |

1519| `stats-cache.json` | Hitungan token dan biaya agregat yang ditampilkan oleh `/usage` |134| `stats-cache.json` | Hitungan token dan biaya agregat yang ditampilkan oleh `/usage` |

1520| `remote-settings.json` | Salinan cache dari [pengaturan yang dikelola server](/id/server-managed-settings) untuk organisasi Anda. Hanya ada saat organisasi Anda telah mengonfigurasinya. Disegarkan pada setiap peluncuran. |135| `remote-settings.json` | Salinan cache dari [pengaturan yang dikelola server](/id/server-managed-settings) untuk organisasi Anda. Hanya ada saat organisasi Anda telah mengonfigurasinya. Disegarkan pada setiap peluncuran. |

1521| `todos/` | Daftar tugas per-sesi warisan. Tidak lagi ditulis oleh versi saat ini; aman untuk dihapus. |

1522 136 

1523File cache dan lock kecil lainnya muncul tergantung fitur mana yang Anda gunakan dan aman untuk dihapus.137File cache dan lock kecil lainnya muncul tergantung fitur mana yang Anda gunakan dan aman untuk dihapus.

1524 138 

1525### Penyimpanan plaintext139<h3 id="plaintext-storage">

140 Penyimpanan plaintext

141</h3>

1526 142 

1527Transkrip dan riwayat tidak dienkripsi saat istirahat. Izin file OS adalah satu-satunya perlindungan. Jika tool membaca file `.env` atau perintah mencetak kredensial, nilai itu ditulis ke `projects/<project>/<session>.jsonl`. Untuk mengurangi paparan:143Transkrip dan riwayat tidak dienkripsi saat istirahat. Izin file OS adalah satu-satunya perlindungan. Jika tool membaca file `.env` atau perintah mencetak kredensial, nilai itu ditulis ke `projects/<project>/<session>.jsonl`. Untuk mengurangi paparan:

1528 144 

1530* Atur variabel lingkungan [`CLAUDE_CODE_SKIP_PROMPT_HISTORY`](/id/env-vars) untuk melewati penulisan transkrip dan riwayat prompt dalam mode apa pun. Dalam mode non-interaktif, Anda dapat meneruskan `--no-session-persistence` bersama `-p`, atau atur `persistSession: false` di Agent SDK.146* Atur variabel lingkungan [`CLAUDE_CODE_SKIP_PROMPT_HISTORY`](/id/env-vars) untuk melewati penulisan transkrip dan riwayat prompt dalam mode apa pun. Dalam mode non-interaktif, Anda dapat meneruskan `--no-session-persistence` bersama `-p`, atau atur `persistSession: false` di Agent SDK.

1531* Gunakan [aturan izin](/id/permissions) untuk menolak pembacaan file kredensial147* Gunakan [aturan izin](/id/permissions) untuk menolak pembacaan file kredensial

1532 148 

1533### Hapus data lokal149<h3 id="clear-local-data">

150 Hapus data lokal

151</h3>

1534 152 

1535Jalankan `claude project purge` untuk menghapus status yang Claude Code simpan untuk satu proyek:153Jalankan `claude project purge` untuk menghapus status yang Claude Code simpan untuk satu proyek. Perintah memerlukan Claude Code v2.1.124 atau lebih baru. Ini menghapus:

1536 154 

1537* Transkrip dan memori otomatis di bawah `projects/`155* Transkrip dan memori otomatis di bawah `projects/`

1538* Entri `tasks/`, `debug/`, dan `file-history/` per-sesi156* Entri `tasks/`, `debug/`, dan `file-history/` per-sesi

1575| `~/.claude/stats-cache.json` | Total historis yang ditampilkan oleh `/usage` |193| `~/.claude/stats-cache.json` | Total historis yang ditampilkan oleh `/usage` |

1576| `~/.claude/remote-settings.json` | Tidak ada. Diambil kembali pada peluncuran berikutnya. |194| `~/.claude/remote-settings.json` | Tidak ada. Diambil kembali pada peluncuran berikutnya. |

1577| `~/.claude/debug/`, `~/.claude/plans/`, `~/.claude/paste-cache/`, `~/.claude/image-cache/`, `~/.claude/session-env/`, `~/.claude/tasks/`, `~/.claude/shell-snapshots/`, `~/.claude/backups/` | Tidak ada yang menghadap pengguna |195| `~/.claude/debug/`, `~/.claude/plans/`, `~/.claude/paste-cache/`, `~/.claude/image-cache/`, `~/.claude/session-env/`, `~/.claude/tasks/`, `~/.claude/shell-snapshots/`, `~/.claude/backups/` | Tidak ada yang menghadap pengguna |

1578| `~/.claude/todos/` | Tidak ada. Direktori warisan tidak ditulis oleh versi saat ini. |196| `~/.claude/todos/`, `~/.claude/statsig/`, `~/.claude/logs/` | Tidak ada. Direktori warisan tidak ditulis oleh versi saat ini. |

1579 197 

1580Jangan hapus `~/.claude.json`, `~/.claude/settings.json`, atau `~/.claude/plugins/`: file-file itu menyimpan auth, preferensi, dan plugin yang diinstal Anda.198Jangan hapus `~/.claude.json`, `~/.claude/settings.json`, atau `~/.claude/plugins/`: file-file itu menyimpan auth, preferensi, dan plugin yang diinstal Anda.

1581 199 

1582## Sumber daya terkait200<h2 id="related-resources">

201 Sumber daya terkait

202</h2>

1583 203 

1584* [Kelola memory Claude](/id/memory): tulis dan atur CLAUDE.md, rules, dan auto memory204* [Kelola memory Claude](/id/memory): tulis dan atur CLAUDE.md, rules, dan auto memory

1585* [Konfigurasi settings](/id/settings): atur izin, hooks, variabel lingkungan, dan default model205* [Konfigurasi settings](/id/settings): atur izin, hooks, variabel lingkungan, dan default model