-
Notifications
You must be signed in to change notification settings - Fork 425
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
35 changed files
with
631 additions
and
694 deletions.
There are no files selected for viewing
93 changes: 76 additions & 17 deletions
93
...jects/ui-showcase/jvm/src/main/kotlin/org/jetbrains/dokka/uitest/markdown/MarkdownCode.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,31 +1,90 @@ | ||
| package org.jetbrains.dokka.uitest.markdown | ||
|
|
||
| /** | ||
| * Contains examples of Markdown code showcasing Kotlin syntax highlighting. | ||
| * | ||
| * Contains examples of Markdown code. | ||
| * | ||
| * Here's a code block: | ||
| * Here's a code block with various Kotlin features to test syntax highlighting: | ||
| * | ||
| * ``` | ||
| * class MyUIClass { | ||
| * val scope = MainScope() // the scope of MyUIClass, uses Dispatchers.Main | ||
| * // Single-line comment token | ||
| * /* Multi-line comment token */ | ||
| * /** Documentation comment token */ | ||
| * | ||
| * // Package declaration to test namespace token | ||
| * package com.example.highlighting | ||
| * | ||
| * // Imports to test namespace tokens | ||
| * import kotlin.random.Random | ||
| * import kotlin.collections.List | ||
| * | ||
| * // Type alias to test symbol token | ||
| * typealias Handler<T> = (T) -> Unit | ||
| * typealias AsyncOperation = suspend () -> Unit | ||
| * | ||
| * // Sealed interface to test class-name and keyword tokens | ||
| * sealed interface State { | ||
| * object Loading : State | ||
| * data class Success(val data: String) : State | ||
| * data class Error(val message: String) : State | ||
| * } | ||
| * | ||
| * // Class with various token types | ||
| * class SyntaxDemo { | ||
| * // Properties to test property and symbol tokens | ||
| * private val number: Int = 42 // number token | ||
| * protected var text: String = "Hello" // string token | ||
| * internal const val PI = 3.14159 // number token | ||
| * | ||
| * fun destroy() { // destroys an instance of MyUIClass | ||
| * scope.cancel() // cancels all coroutines launched in this scope | ||
| * // ... do the rest of cleanup here ... | ||
| * } | ||
| * protected var url: String = "https://kotlinlang.org/api/core/kotlin-stdlib/kotlin.collections/min.html" | ||
| * | ||
| * /* | ||
| * * Note: if this instance is destroyed or any of the launched coroutines | ||
| * * in this method throws an exception, then all nested coroutines are cancelled. | ||
| * */ | ||
| * fun showSomeData() = scope.launch { // launched in the main thread | ||
| * // ... here we can use suspending functions or coroutine builders with other dispatchers | ||
| * draw(data) // draw in the main thread | ||
| * var pattern = Regex("""\b\d{3}-\d{3}-\d{4}\b""") | ||
| * | ||
| * // Companion with property tokens | ||
| * companion object { | ||
| * const val DEBUG = true // boolean token | ||
| * const val CHAR_SAMPLE = 'A' // char token | ||
| * @JvmField val EMPTY = "" // string token | ||
| * } | ||
| * | ||
| * // Function to test various tokens | ||
| * fun calculate(x: Double): Double { | ||
| * val multiplier = 2.5 // number token | ||
| * val enabled: Boolean = false // boolean token | ||
| * | ||
| * // Operators test | ||
| * val result = when { | ||
| * x <= 0 -> x * multiplier | ||
| * x >= 100 -> x / multiplier | ||
| * else -> x + multiplier | ||
| * } | ||
| * | ||
| * // Built-in types and functions test | ||
| * val numbers: List<Int> = listOf(1, 2, 3) | ||
| * val filtered = numbers | ||
| * .filter { it > 0 } // lambda and operator tokens | ||
| * .map { it.toString() } // function token | ||
| * .joinToString(separator = ", ") | ||
| * | ||
| * // String template and escape sequence tokens | ||
| * println("Result: $result\nFiltered: $filtered") | ||
| * | ||
| * return result | ||
| * } | ||
| * | ||
| * // Extension function with operator and symbol tokens | ||
| * infix fun Int.power(exponent: Int): Int { | ||
| * require(exponent >= 0) { "Exponent must be non-negative" } | ||
| * return when (exponent) { | ||
| * 0 -> 1 | ||
| * 1 -> this | ||
| * else -> this * (this power (exponent - 1)) | ||
| * } | ||
| * } | ||
| * } | ||
| * ``` | ||
| * | ||
| * Here's inline code: `this` and `that` and `fun foo()` and `class Omg : MyInterface` | ||
| * Here's inline code with various token types: | ||
| * `val x: Int = 0`, `fun interface EventHandler`, `object : Runnable`, | ||
| * `class Sample<T : Any>`, `@Deprecated fun old()`, `var name: String?` | ||
| */ | ||
| class MarkdownCode {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
64 changes: 64 additions & 0 deletions
64
dokka-subprojects/plugin-base-frontend/src/main/ui-kit/code-block/index.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| /* | ||
| * Copyright 2014-2025 JetBrains s.r.o. Use of this source code is governed by the Apache 2.0 license. | ||
| */ | ||
| import './styles.scss'; | ||
|
|
||
| // helps with some corner cases where <wbr> starts working already, | ||
| // but the signature is not yet long enough to be wrapped | ||
|
|
||
| const CODE_BLOCK_PADDING = 16 * 2; | ||
|
|
||
| const symbolsObserver = new ResizeObserver((entries) => entries.forEach(wrapSymbolParameters)); | ||
|
|
||
| function initHandlers() { | ||
| document.querySelectorAll('div.symbol').forEach((symbol) => symbolsObserver.observe(symbol)); | ||
| } | ||
|
|
||
| if (document.readyState === 'loading') { | ||
| window.addEventListener('DOMContentLoaded', initHandlers); | ||
| } else { | ||
| initHandlers(); | ||
| } | ||
|
|
||
| function createNbspIndent() { | ||
| const indent = document.createElement('span'); | ||
| indent.append(document.createTextNode('\u00A0\u00A0\u00A0\u00A0')); | ||
| indent.classList.add('nbsp-indent'); | ||
| return indent; | ||
| } | ||
|
|
||
| function wrapSymbolParameters(entry: ResizeObserverEntry) { | ||
| const symbol = entry.target; | ||
| const symbolBlockWidth = entry.borderBoxSize && entry.borderBoxSize[0] && entry.borderBoxSize[0].inlineSize; | ||
| const sourceButtonWidth = symbol.querySelector('[data-element-type="source-link"]')?.getBoundingClientRect().width || 0; | ||
|
|
||
| // Even though the script is marked as `defer` and we wait for `DOMContentLoaded` event, | ||
| // or if this block is a part of hidden tab, it can happen that `symbolBlockWidth` is 0, | ||
| // indicating that something hasn't been loaded. | ||
| // In this case, observer will be triggered onсe again when it will be ready. | ||
| if (symbolBlockWidth > 0) { | ||
| const node = symbol.querySelector('.parameters'); | ||
|
|
||
| if (node) { | ||
| // if window resize happened and observer was triggered, reset previously wrapped | ||
| // parameters as they might not need wrapping anymore, and check again | ||
| node.classList.remove('wrapped'); | ||
| node.querySelectorAll('.parameter .nbsp-indent').forEach((indent) => indent.remove()); | ||
|
|
||
| const innerTextWidth = Array.from(symbol.children) | ||
| .filter((it) => !it.classList.contains('block')) // blocks are usually on their own (like annotations), so ignore it | ||
| .map((it) => it.getBoundingClientRect().width) | ||
| .reduce((a, b) => a + b, 0); | ||
|
|
||
| // if signature text takes up more than a single line, wrap params for readability | ||
| if (innerTextWidth > symbolBlockWidth - CODE_BLOCK_PADDING - sourceButtonWidth) { | ||
| node.classList.add('wrapped'); | ||
| node.querySelectorAll('.parameter').forEach((param) => { | ||
| // has to be a physical indent so that it can be copied. styles like | ||
| // paddings and `::before { content: " " }` do not work for that | ||
| param.prepend(createNbspIndent()); | ||
| }); | ||
| } | ||
| } | ||
| } | ||
| } |
76 changes: 76 additions & 0 deletions
76
dokka-subprojects/plugin-base-frontend/src/main/ui-kit/code-block/styles.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,76 @@ | ||
| /*! | ||
| * Copyright 2014-2025 JetBrains s.r.o. Use of this source code is governed by the Apache 2.0 license. | ||
| */ | ||
| @import '../_tokens/index'; | ||
|
|
||
| /** | ||
| http://localhost:8001/jvm/org.jetbrains.dokka.uitest.markdown/-markdown-code/index.html | ||
| */ | ||
| .symbol:not(.token, .wrapped), code.block { | ||
| display: block; | ||
| box-sizing: border-box; | ||
| position: relative; | ||
| padding: 12px 16px; | ||
| border-radius: var(--size-s1); | ||
| background-color: var(--color-background-code-block); | ||
| font: var(--font-code); | ||
| white-space: pre-wrap; | ||
| overflow: scroll; | ||
| } | ||
|
|
||
| code.block { | ||
| overflow-x: auto; | ||
| max-width: 100%; | ||
| } | ||
|
|
||
| .source-link-wrapper::after { | ||
| display: block; | ||
| content: ''; | ||
| clear: both; | ||
| height: 0; | ||
| } | ||
|
|
||
| @media screen and (width <= 759px) { | ||
| .source-link-wrapper { | ||
| margin-top: 8px; | ||
| display: block; | ||
| } | ||
| } | ||
|
|
||
| .source-link { | ||
| float: right; | ||
| } | ||
|
|
||
| /** | ||
| http://localhost:8001/jvm/org.jetbrains.dokka.uitest.types/-simple-deprecated-kotlin-class/index.html | ||
| */ | ||
|
|
||
| .sample-container, div.CodeMirror { | ||
| position: relative; | ||
| display: flex; | ||
| flex-direction: column; | ||
| } | ||
|
|
||
| .sample-container span.copy-icon { | ||
| display: none; | ||
|
|
||
| &::before { | ||
| width: 24px; | ||
| height: 24px; | ||
| display: inline-block; | ||
| content: ''; | ||
| /* masks are required if you want to change color of the icon dynamically instead of using those provided with the SVG */ | ||
| mask: url("../_assets/copy-icon.svg") no-repeat 50% 50%; | ||
| -webkit-mask-size: cover; | ||
| mask-size: cover; | ||
| background-color: var(--copy-icon-color); | ||
| } | ||
|
|
||
| &:hover::before { | ||
| background-color: var(--copy-icon-hover-color); | ||
| } | ||
| } | ||
|
|
||
| .js .sample-container:hover span.copy-icon { | ||
| display: inline-block; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.