xref: /aosp_15_r20/external/ktfmt/website/index.html (revision 5be3f65c8cf0e6db0a7e312df5006e8e93cdf9ec) 
1<!-- Forked from https://microsoft.github.io/monaco-editor/ -->
2
3<!DOCTYPE html>
4<html lang="en">
5  <head>
6    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
7    <meta name="viewport" content="width=device-width" />
8
9    <title>ktfmt - the Kotlin code formatter</title>
10
11    <link data-inline="yes-please" href="./lib/bootstrap-cosmo.css" rel="stylesheet"/>
12    <link data-inline="yes-please" href="./lib/bootstrap-responsive.min.css" rel="stylesheet"/>
13    <link data-inline="yes-please" href="./all.css" rel="stylesheet" />
14    <link data-inline="yes-please" href="./index/index.css" rel="stylesheet" />
15
16    <link data-name="vs/editor/editor.main"
17      rel="stylesheet"
18      href="node_modules/monaco-editor/min/vs/editor/editor.main.css"
19    />
20  </head>
21
22  <body>
23    <a id="gh-link" href="https://github.com/facebook/ktfmt"
24      ><img
25        loading="lazy"
26        width="149"
27        height="149"
28        src="https://github.blog/wp-content/uploads/2008/12/forkme_right_white_ffffff.png?resize=149%2C149"
29        class="attachment-full size-full"
30        alt="Fork me on GitHub"
31        data-recalc-dims="1"
32    /></a>
33    <nav class="navbar navbar-inverse navbar-fixed-top">
34      <div class="navbar-inner">
35        <div class="container">
36          <div class="logo">
37            ktfmt
38          </div>
39          <div class="logo">
40            <a href="index.html">- the Kotlin code formatter</a>
41          </div>
42          <!-- collapse button for smaller screens -->
43          <button
44            type="button"
45            class="btn btn-navbar"
46            data-toggle="collapse"
47            data-target=".nav-collapse"
48          >
49            <span class="icon-bar"></span>
50            <span class="icon-bar"></span>
51            <span class="icon-bar"></span>
52          </button>
53
54          <!-- navbar title -->
55          <div class="nav-collapse collapse">
56            <ul class="nav">
57              <li>
58                <a
59                  class="nav-item"
60                  href="https://github.com/facebook/ktfmt"
61                  >GitHub</a
62                >
63              </li>
64              <li>
65                <a
66                  class="nav-item"
67                  href="https://kotlinlang.slack.com/archives/C01GZCU0QNB"
68                  >Slack</a
69                >
70              </li>
71              <li>
72                <a
73                  class="nav-item"
74                  href="https://search.maven.org/artifact/com.facebook/ktfmt/{{version}}/jar"
75                  >Maven Central</a
76                >
77              </li>
78            </ul>
79          </div>
80        </div>
81      </div>
82    </nav>
83    <section class="try">
84      <div class="container">
85        <h3>About</h3>
86        <div class="row">
87          <div class="span12">
88            <br />
89            <p>
90              <code>ktfmt</code> is a program that pretty-prints (formats)
91              Kotlin code.
92            </p>
93            <p>
94              It always produces the same result, regardless of how the code
95              looks initially, freeing developers to focus on essence.
96            </p>
97            <p>
98                It is by design non-customizable in order to promote consistency.
99              </p>
100            </div>
101        </div>
102        <hr />
103        <h3>Usage</h3>
104        <div class="row">
105          <div class="span12">
106            <br />
107            <ul class="nav nav-tabs" id="usage_tab">
108              <li class="active">
109                <a href="#usage_intellij" data-toggle="tab"
110                  >IntelliJ / Android Studio</a
111                >
112              </li>
113              <li>
114                <a href="#usage_gradle" data-toggle="tab">Gradle</a>
115              </li>
116              <li><a href="#usage_maven" data-toggle="tab">Maven</a></li>
117              <li><a href="#usage_cli" data-toggle="tab">Command line</a></li>
118            </ul>
119            <div class="tab-content">
120              <div class="tab-pane active" id="usage_intellij">
121                <p>
122                  A ktfmt plugin that augments the Reformat Code action (<code>⌥⌘L</code>) is available from JetBrains Marketplace.
123                </p>
124                <a class="btn btn-info" href="https://plugins.jetbrains.com/plugin/14912-ktfmt" target="_blank">Install</a>
125              </div>
126              <div class="tab-pane" id="usage_gradle">
127                <p>
128                  <u><b>Spotless</b></u> (<a
129                    href="https://github.com/diffplug/spotless/tree/main/plugin-gradle#ktfmt"
130                    >details</a
131                  >):
132                </p>
133
134                <pre>
135# build.gradle.kts
136plugins { id("com.diffplug.spotless") }
137
138// version and style are optional
139spotless { kotlin { ktfmt('{{version}}').kotlinlangStyle() } }
140</pre
141                >
142
143                <p>or,</p>
144                <p>
145                  <u><b>ktfmt-gradle</b></u> (<a
146                    href="https://github.com/cortinico/ktfmt-gradle#how-to-use-"
147                    >details</a
148                  >):
149                </p>
150                <pre>
151# build.gradle.kts
152plugins { id("com.ncorti.ktfmt.gradle") }
153
154ktfmt { kotlinLangStyle() }
155</pre
156                >
157              </div>
158              <div class="tab-pane" id="usage_maven">
159                <p>
160                  <u><b>Spotless</b></u> (<a
161                    href="https://github.com/diffplug/spotless/tree/main/plugin-maven#ktfmt"
162                    >details</a
163                  >):
164                </p>
165
166                <pre>
167# pom.xml
168&lt;configuration&gt;
169  &lt;kotlin&gt;
170    &lt;ktfmt&gt;
171      &lt;version&gt;{{version}}&lt;/version&gt;
172    &lt;/ktfmt&gt;
173  &lt;/kotlin&gt;
174&lt;/configuration&gt;
175</pre
176                >
177              </div>
178              <div class="tab-pane" id="usage_cli">
179                <p>
180                  Download the jar from Maven Central and invoke it using
181                  <code>java</code>:
182                </p>
183                <pre>
184$ wget https://repo1.maven.org/maven2/com/facebook/ktfmt/{{version}}/ktfmt-{{version}}-jar-with-dependencies.jar
185$ java -jar ktfmt-{{version}}-jar-with-dependencies.jar [--kotlinlang-style] [files...]
186</pre
187                >
188              </div>
189            </div>
190          </div>
191        </div>
192        <hr />
193        <h3>Try It Online</h3>
194        <small>Running v{{version}}</small>
195        <div class="editor row">
196          <div class="span12">
197            <div class="row">
198              <form id="editorForm" name="editorForm">
199                <div class="span3">
200                  <label class="control-label">Style</label>
201                  <select class="style-picker input-medium">
202                    <option>kotlinlang</option>
203                    <option>Java-like</option>
204                  </select>
205                </div>
206                <div class="span3">
207                  <label class="control-label">Column Limit</label>
208                  <input
209                    class="input-small column-limit-picker"
210                    type="number"
211                    min="50"
212                    max="140"
213                    class="form-control"
214                    id="column_limit"
215                    value="100"
216                    required
217                  />
218                </div>
219                <div class="span4 pull-right">
220                  <button class="btn btn-primary pull-right" type="submit">
221                    Format
222                  </button>
223                  <p
224                    id="error-message"
225                    class="text-error"
226                    style="display: none"
227                  >
228                    Donec ullamcorper nulla non metus auctor fringilla.
229                  </p>
230                </div>
231              </form>
232            </div>
233            <div class="editor-frame">
234              <div class="loading editor" style="display: none">
235                <div class="progress progress-striped active">
236                  <div class="bar"></div>
237                </div>
238              </div>
239              <div id="editor"></div>
240            </div>
241          </div>
242        </div>
243      </div>
244    </section>
245
246    <footer class="container">
247      <hr />
248      <p class="text-center">
249        [
250        <a
251          target="_blank"
252          rel="noopener noreferrer"
253          href="https://opensource.facebook.com/legal/privacy/"
254          >Privacy</a
255        >
256        ] [
257        <a
258          target="_blank"
259          rel="noopener noreferrer"
260          href="https://opensource.facebook.com/legal/terms/"
261          >Terms</a
262        >
263        ] [
264        <a
265          target="_blank"
266          rel="noopener noreferrer"
267          href="https://opensource.facebook.com/legal/data-policy/"
268          >Data Policy</a
269        >
270        ] [
271        <a
272          target="_blank"
273          rel="noopener noreferrer"
274          href="https://opensource.facebook.com/legal/cookie-policy/"
275          >Cookie Policy</a
276        >
277        ]
278      </p>
279      <p class="text-center">
280        <a href="https://opensource.facebook.com/" title="Facebook Open Source">
281          <img
282            src="img/oss_logo.png"
283            alt="Facebook Open Source"
284            style="max-height: 50px; margin-bottom: 12px"
285          />
286        </a>
287        <br />
288        <small>Copyright &copy; Meta Platforms, Inc. Based on <a href="https://microsoft.github.io/monaco-editor">https://microsoft.github.io/monaco-editor</a></small>
289      </p>
290    </footer>
291
292    <script
293      src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"
294      integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
295      crossorigin="anonymous"
296    ></script>
297    <script
298      src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.0/bootstrap.min.js"
299      integrity="sha256-u+l2mGjpmGK/mFgUncmMcFKdMijvV+J3odlDJZSNUu8="
300      crossorigin="anonymous"
301    ></script>
302
303    <script src="node_modules/monaco-editor/min/vs/loader.js"></script>
304    <script src="node_modules/monaco-editor/min/vs/editor/editor.main.nls.js"></script>
305    <script src="node_modules/monaco-editor/min/vs/editor/editor.main.js"></script>
306    <script data-inline="yes-please" src="./index/index.js"></script>
307  </body>
308</html>
309