81 | #else
82 | byte[]
83 | #endif
84 | s_wasmWrapperSuffix = new byte[] {
85 | 0x00, 0x1b, 0x04, 0x6e, 0x61, 0x6d, 0x65, 0x02, 0x14, 0x02, 0x00, 0x01, 0x00, 0x07, 0x64, 0x65, 0x73, 0x74, 0x50, 0x74, 0x72, 0x01, 0x02, 0x00, 0x01, 0x64, 0x01, 0x01, 0x6e,
86 | };
87 |
88 | private static void WriteWasmHeader(Stream outputStream)
89 | {
90 | #if NET7_0_OR_GREATER
91 | outputStream.Write(s_wasmWrapperPrefix.Span);
92 | #else
93 | outputStream.Write(s_wasmWrapperPrefix, 0, s_wasmWrapperPrefix.Length);
94 | #endif
95 | }
96 |
97 | private static void WriteWasmSuffix(Stream outputStream)
98 | {
99 | #if NET7_0_OR_GREATER
100 | outputStream.Write(s_wasmWrapperSuffix.Span);
101 | #else
102 | outputStream.Write(s_wasmWrapperSuffix, 0, s_wasmWrapperSuffix.Length);
103 | #endif
104 | }
105 |
106 | // 1 byte to encode "passive" data segment
107 | private const uint SegmentCodeSize = 1;
108 |
109 | // Align the payload start to a 4-byte boundary within the wrapper. If the runtime reads the
110 | // payload directly, instead of by instantiatng the wasm module, we don't want the WebAssembly
111 | // prefix to push some of the values inside the image to odd byte offsets as the runtime assumes
112 | // the image will be aligned.
113 | //
114 | // There are requirements in ECMA-335 (Section II.25.4) that fat method headers and method data
115 | // sections be 4-byte aligned.
116 | private const uint WebcilPayloadInternalAlignment = 4;
117 |
118 | private void WriteDataSection(BinaryWriter writer)
119 | {
120 |
121 | uint dataSectionSize = 0;
122 | // uleb128 encoding of number of segments
123 | dataSectionSize += 1; // there's always 2 segments which encodes to 1 byte
124 | // compute the segment 0 size:
125 | // segment 0 has 1 byte segment code, 1 byte of size and at least 4 bytes of payload
126 | uint segment0MinimumSize = SegmentCodeSize + 1 + 4;
127 | dataSectionSize += segment0MinimumSize;
128 |
129 | // encode webcil size as a uleb128
130 | byte[] ulebWebcilPayloadSize = ULEB128Encode(_webcilPayloadSize);
131 |
132 | // compute the segment 1 size:
133 | // segment 1 has 1 byte segment code, a uleb128 encoding of the webcilPayloadSize, and the payload
134 | // don't count the size of the payload yet
135 | checked
136 | {
137 | dataSectionSize += SegmentCodeSize + (uint)ulebWebcilPayloadSize.Length;
138 | }
139 |
140 | // at this point the data section size includes everything except the data section code, the data section size and the webcil payload itself
141 | // and any extra padding that we may want to add to segment 0.
142 | // So we can compute the offset of the payload within the wasm module.
143 | byte[] putativeULEBDataSectionSize = ULEB128Encode(dataSectionSize + _webcilPayloadSize);
144 | uint payloadOffset = (uint)s_wasmWrapperPrefix.Length + 1 + (uint)putativeULEBDataSectionSize.Length + dataSectionSize ;
145 |
146 | uint paddingSize = PadTo(payloadOffset, WebcilPayloadInternalAlignment);
147 |
148 | if (paddingSize > 0)
149 | {
150 | checked
151 | {
152 | dataSectionSize += paddingSize;
153 | }
154 | }
155 |
156 | checked
157 | {
158 | dataSectionSize += _webcilPayloadSize;
159 | }
160 |
161 | byte[] ulebSectionSize = ULEB128Encode(dataSectionSize);
162 |
163 | if (putativeULEBDataSectionSize.Length != ulebSectionSize.Length)
164 | throw new InvalidOperationException ("adding padding would cause data section's encoded length to chane"); // TODO: fixme: there's upto one extra byte to encode the section length - take away a padding byte.
165 | writer.Write((byte)11); // section Data
166 | writer.Write(ulebSectionSize, 0, ulebSectionSize.Length);
167 |
168 | writer.Write((byte)2); // number of segments
169 |
170 | // write segment 0
171 | writer.Write((byte)1); // passive segment
172 | if (paddingSize + 4 > 127) {
173 | throw new InvalidOperationException ("padding would cause segment 0 to need a multi-byte ULEB128 size encoding");
174 | }
175 | writer.Write((byte)(4 + paddingSize)); // segment size: 4 plus any padding
176 | writer.Write((uint)_webcilPayloadSize); // payload is an unsigned 32 bit number
177 | for (int i = 0; i < paddingSize; i++)
178 | writer.Write((byte)0);
179 |
180 | // write segment 1
181 | writer.Write((byte)1); // passive segment
182 | writer.Write(ulebWebcilPayloadSize, 0, ulebWebcilPayloadSize.Length); // segment size: _webcilPayloadSize
183 | if (writer.BaseStream.Position % WebcilPayloadInternalAlignment != 0) {
184 | throw new Exception ($"predited offset {payloadOffset}, actual position {writer.BaseStream.Position}");
185 | }
186 | _webcilPayloadStream.CopyTo(writer.BaseStream); // payload is the entire webcil content
187 | }
188 |
189 | private static byte[] ULEB128Encode(uint value)
190 | {
191 | uint n = value;
192 | int len = 0;
193 | do
194 | {
195 | n >>= 7;
196 | len++;
197 | } while (n != 0);
198 | byte[] arr = new byte[len];
199 | int i = 0;
200 | n = value;
201 | do
202 | {
203 | byte b = (byte)(n & 0x7f);
204 | n >>= 7;
205 | if (n != 0)
206 | b |= 0x80;
207 | arr[i++] = b;
208 | } while (n != 0);
209 | return arr;
210 | }
211 |
212 | private static uint PadTo (uint value, uint align)
213 | {
214 | uint newValue = AlignTo(value, align);
215 | return newValue - value;
216 | }
217 |
218 | private static uint AlignTo (uint value, uint align)
219 | {
220 | return (value + (align - 1)) & ~(align - 1);
221 | }
222 | }
223 | }
--------------------------------------------------------------------------------
/BlazorCodeEditor/_Imports.razor:
--------------------------------------------------------------------------------
1 | @using System.Net.Http
2 | @using System.Net.Http.Json
3 | @using Microsoft.AspNetCore.Components.Forms
4 | @using Microsoft.AspNetCore.Components.Routing
5 | @using Microsoft.AspNetCore.Components.Web
6 | @using Microsoft.AspNetCore.Components.Web.Virtualization
7 | @using Microsoft.AspNetCore.Components.WebAssembly.Http
8 | @using Microsoft.JSInterop
9 | @using BlazorCodeEditor
10 | @using BlazorCodeEditor.Layout
--------------------------------------------------------------------------------
/BlazorCodeEditor/wwwroot/app.js:
--------------------------------------------------------------------------------
1 | export function captureConsoleOutput(dotnetHelper) {
2 | // Save the original console methods
3 | const originalLog = console.log;
4 | const originalError = console.error;
5 | const originalWarn = console.warn;
6 |
7 | console.log = function (...args) {
8 | const message = args.map(arg => (typeof arg === 'object' ? JSON.stringify(arg) : arg)).join(' ');
9 | dotnetHelper.invokeMethodAsync("OnConsoleLog", message);
10 | originalLog.apply(console, args);
11 | };
12 |
13 | console.error = function (...args) {
14 | const message = args.map(arg => (typeof arg === 'object' ? JSON.stringify(arg) : arg)).join(' ');
15 | dotnetHelper.invokeMethodAsync("OnConsoleError", message);
16 | originalError.apply(console, args);
17 | };
18 |
19 | console.warn = function (...args) {
20 | const message = args.map(arg => (typeof arg === 'object' ? JSON.stringify(arg) : arg)).join(' ');
21 | dotnetHelper.invokeMethodAsync("OnConsoleWarn", message);
22 | originalWarn.apply(console, args);
23 | };
24 | }
--------------------------------------------------------------------------------
/BlazorCodeEditor/wwwroot/css/app.css:
--------------------------------------------------------------------------------
1 | html, body {
2 | font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
3 | }
4 |
5 | h1:focus {
6 | outline: none;
7 | }
8 |
9 | a, .btn-link {
10 | color: #0071c1;
11 | }
12 |
13 | .btn-primary {
14 | color: #fff;
15 | background-color: #1b6ec2;
16 | border-color: #1861ac;
17 | }
18 |
19 | .btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
20 | box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
21 | }
22 |
23 | .content {
24 | padding-top: 1.1rem;
25 | }
26 |
27 | .valid.modified:not([type=checkbox]) {
28 | outline: 1px solid #26b050;
29 | }
30 |
31 | .invalid {
32 | outline: 1px solid red;
33 | }
34 |
35 | .validation-message {
36 | color: red;
37 | }
38 |
39 | #blazor-error-ui {
40 | color-scheme: light only;
41 | background: lightyellow;
42 | bottom: 0;
43 | box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
44 | box-sizing: border-box;
45 | display: none;
46 | left: 0;
47 | padding: 0.6rem 1.25rem 0.7rem 1.25rem;
48 | position: fixed;
49 | width: 100%;
50 | z-index: 1000;
51 | }
52 |
53 | #blazor-error-ui .dismiss {
54 | cursor: pointer;
55 | position: absolute;
56 | right: 0.75rem;
57 | top: 0.5rem;
58 | }
59 |
60 | .blazor-error-boundary {
61 | background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
62 | padding: 1rem 1rem 1rem 3.7rem;
63 | color: white;
64 | }
65 |
66 | .blazor-error-boundary::after {
67 | content: "An error has occurred."
68 | }
69 |
70 | .loading-progress {
71 | position: relative;
72 | display: block;
73 | width: 8rem;
74 | height: 8rem;
75 | margin: 20vh auto 1rem auto;
76 | }
77 |
78 | .loading-progress circle {
79 | fill: none;
80 | stroke: #e0e0e0;
81 | stroke-width: 0.6rem;
82 | transform-origin: 50% 50%;
83 | transform: rotate(-90deg);
84 | }
85 |
86 | .loading-progress circle:last-child {
87 | stroke: #1b6ec2;
88 | stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
89 | transition: stroke-dasharray 0.05s ease-in-out;
90 | }
91 |
92 | .loading-progress-text {
93 | position: absolute;
94 | text-align: center;
95 | font-weight: bold;
96 | inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
97 | }
98 |
99 | .loading-progress-text:after {
100 | content: var(--blazor-load-percentage-text, "Loading");
101 | }
102 |
103 | code {
104 | color: #c02d76;
105 | }
106 |
107 | .form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
108 | color: var(--bs-secondary-color);
109 | text-align: end;
110 | }
111 |
112 | .form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
113 | text-align: start;
114 | }
115 |
116 | .monaco-editor-container {
117 | height:60dvh;
118 | width:100%;
119 | }
--------------------------------------------------------------------------------
/BlazorCodeEditor/wwwroot/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/thatplatypus/BlazorCodeEditor/82b08c3c71f8d4834ef55236b162311ac2f56bb4/BlazorCodeEditor/wwwroot/favicon.png
--------------------------------------------------------------------------------
/BlazorCodeEditor/wwwroot/icon-192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/thatplatypus/BlazorCodeEditor/82b08c3c71f8d4834ef55236b162311ac2f56bb4/BlazorCodeEditor/wwwroot/icon-192.png
--------------------------------------------------------------------------------
/BlazorCodeEditor/wwwroot/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | BlazorCodeEditor
8 |
17 |
18 |
21 |
22 |
25 | An unhandled error has occurred.
26 |
Reload
27 |
🗙
28 |
`-`` all receive top and bottom margins. We nuke the top\n// margin for easier control within type scales as it avoids margin collapsing.\n\n%heading {\n margin-top: 0; // 1\n margin-bottom: $headings-margin-bottom;\n font-family: $headings-font-family;\n font-style: $headings-font-style;\n font-weight: $headings-font-weight;\n line-height: $headings-line-height;\n color: var(--#{$prefix}heading-color);\n}\n\nh1 {\n @extend %heading;\n @include font-size($h1-font-size);\n}\n\nh2 {\n @extend %heading;\n @include font-size($h2-font-size);\n}\n\nh3 {\n @extend %heading;\n @include font-size($h3-font-size);\n}\n\nh4 {\n @extend %heading;\n @include font-size($h4-font-size);\n}\n\nh5 {\n @extend %heading;\n @include font-size($h5-font-size);\n}\n\nh6 {\n @extend %heading;\n @include font-size($h6-font-size);\n}\n\n\n// Reset margins on paragraphs\n//\n// Similarly, the top margin on ` `s get reset. However, we also reset the\n// bottom margin to use `rem` units instead of `em`.\n\np {\n margin-top: 0;\n margin-bottom: $paragraph-margin-bottom;\n}\n\n\n// Abbreviations\n//\n// 1. Add the correct text decoration in Chrome, Edge, Opera, and Safari.\n// 2. Add explicit cursor to indicate changed behavior.\n// 3. Prevent the text-decoration to be skipped.\n\nabbr[title] {\n text-decoration: underline dotted; // 1\n cursor: help; // 2\n text-decoration-skip-ink: none; // 3\n}\n\n\n// Address\n\naddress {\n margin-bottom: 1rem;\n font-style: normal;\n line-height: inherit;\n}\n\n\n// Lists\n\nol,\nul {\n padding-left: 2rem;\n}\n\nol,\nul,\ndl {\n margin-top: 0;\n margin-bottom: 1rem;\n}\n\nol ol,\nul ul,\nol ul,\nul ol {\n margin-bottom: 0;\n}\n\ndt {\n font-weight: $dt-font-weight;\n}\n\n// 1. Undo browser default\n\ndd {\n margin-bottom: .5rem;\n margin-left: 0; // 1\n}\n\n\n// Blockquote\n\nblockquote {\n margin: 0 0 1rem;\n}\n\n\n// Strong\n//\n// Add the correct font weight in Chrome, Edge, and Safari\n\nb,\nstrong {\n font-weight: $font-weight-bolder;\n}\n\n\n// Small\n//\n// Add the correct font size in all browsers\n\nsmall {\n @include font-size($small-font-size);\n}\n\n\n// Mark\n\nmark {\n padding: $mark-padding;\n color: var(--#{$prefix}highlight-color);\n background-color: var(--#{$prefix}highlight-bg);\n}\n\n\n// Sub and Sup\n//\n// Prevent `sub` and `sup` elements from affecting the line height in\n// all browsers.\n\nsub,\nsup {\n position: relative;\n @include font-size($sub-sup-font-size);\n line-height: 0;\n vertical-align: baseline;\n}\n\nsub { bottom: -.25em; }\nsup { top: -.5em; }\n\n\n// Links\n\na {\n color: rgba(var(--#{$prefix}link-color-rgb), var(--#{$prefix}link-opacity, 1));\n text-decoration: $link-decoration;\n\n &:hover {\n --#{$prefix}link-color-rgb: var(--#{$prefix}link-hover-color-rgb);\n text-decoration: $link-hover-decoration;\n }\n}\n\n// And undo these styles for placeholder links/named anchors (without href).\n// It would be more straightforward to just use a[href] in previous block, but that\n// causes specificity issues in many other styles that are too complex to fix.\n// See https://github.com/twbs/bootstrap/issues/19402\n\na:not([href]):not([class]) {\n &,\n &:hover {\n color: inherit;\n text-decoration: none;\n }\n}\n\n\n// Code\n\npre,\ncode,\nkbd,\nsamp {\n font-family: $font-family-code;\n @include font-size(1em); // Correct the odd `em` font sizing in all browsers.\n}\n\n// 1. Remove browser default top margin\n// 2. Reset browser default of `1em` to use `rem`s\n// 3. Don't allow content to break outside\n\npre {\n display: block;\n margin-top: 0; // 1\n margin-bottom: 1rem; // 2\n overflow: auto; // 3\n @include font-size($code-font-size);\n color: $pre-color;\n\n // Account for some code outputs that place code tags in pre tags\n code {\n @include font-size(inherit);\n color: inherit;\n word-break: normal;\n }\n}\n\ncode {\n @include font-size($code-font-size);\n color: var(--#{$prefix}code-color);\n word-wrap: break-word;\n\n // Streamline the style when inside anchors to avoid broken underline and more\n a > & {\n color: inherit;\n }\n}\n\nkbd {\n padding: $kbd-padding-y $kbd-padding-x;\n @include font-size($kbd-font-size);\n color: $kbd-color;\n background-color: $kbd-bg;\n @include border-radius($border-radius-sm);\n\n kbd {\n padding: 0;\n @include font-size(1em);\n font-weight: $nested-kbd-font-weight;\n }\n}\n\n\n// Figures\n//\n// Apply a consistent margin strategy (matches our type styles).\n\nfigure {\n margin: 0 0 1rem;\n}\n\n\n// Images and content\n\nimg,\nsvg {\n vertical-align: middle;\n}\n\n\n// Tables\n//\n// Prevent double borders\n\ntable {\n caption-side: bottom;\n border-collapse: collapse;\n}\n\ncaption {\n padding-top: $table-cell-padding-y;\n padding-bottom: $table-cell-padding-y;\n color: $table-caption-color;\n text-align: left;\n}\n\n// 1. Removes font-weight bold by inheriting\n// 2. Matches default `
` alignment by inheriting `text-align`.\n// 3. Fix alignment for Safari\n\nth {\n font-weight: $table-th-font-weight; // 1\n text-align: inherit; // 2\n text-align: -webkit-match-parent; // 3\n}\n\nthead,\ntbody,\ntfoot,\ntr,\ntd,\nth {\n border-color: inherit;\n border-style: solid;\n border-width: 0;\n}\n\n\n// Forms\n//\n// 1. Allow labels to use `margin` for spacing.\n\nlabel {\n display: inline-block; // 1\n}\n\n// Remove the default `border-radius` that macOS Chrome adds.\n// See https://github.com/twbs/bootstrap/issues/24093\n\nbutton {\n // stylelint-disable-next-line property-disallowed-list\n border-radius: 0;\n}\n\n// Explicitly remove focus outline in Chromium when it shouldn't be\n// visible (e.g. as result of mouse click or touch tap). It already\n// should be doing this automatically, but seems to currently be\n// confused and applies its very visible two-tone outline anyway.\n\nbutton:focus:not(:focus-visible) {\n outline: 0;\n}\n\n// 1. Remove the margin in Firefox and Safari\n\ninput,\nbutton,\nselect,\noptgroup,\ntextarea {\n margin: 0; // 1\n font-family: inherit;\n @include font-size(inherit);\n line-height: inherit;\n}\n\n// Remove the inheritance of text transform in Firefox\nbutton,\nselect {\n text-transform: none;\n}\n// Set the cursor for non-`` buttons\n//\n// Details at https://github.com/twbs/bootstrap/pull/30562\n[role=\"button\"] {\n cursor: pointer;\n}\n\nselect {\n // Remove the inheritance of word-wrap in Safari.\n // See https://github.com/twbs/bootstrap/issues/24990\n word-wrap: normal;\n\n // Undo the opacity change from Chrome\n &:disabled {\n opacity: 1;\n }\n}\n\n// Remove the dropdown arrow only from text type inputs built with datalists in Chrome.\n// See https://stackoverflow.com/a/54997118\n\n[list]:not([type=\"date\"]):not([type=\"datetime-local\"]):not([type=\"month\"]):not([type=\"week\"]):not([type=\"time\"])::-webkit-calendar-picker-indicator {\n display: none !important;\n}\n\n// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`\n// controls in Android 4.\n// 2. Correct the inability to style clickable types in iOS and Safari.\n// 3. Opinionated: add \"hand\" cursor to non-disabled button elements.\n\nbutton,\n[type=\"button\"], // 1\n[type=\"reset\"],\n[type=\"submit\"] {\n -webkit-appearance: button; // 2\n\n @if $enable-button-pointers {\n &:not(:disabled) {\n cursor: pointer; // 3\n }\n }\n}\n\n// Remove inner border and padding from Firefox, but don't restore the outline like Normalize.\n\n::-moz-focus-inner {\n padding: 0;\n border-style: none;\n}\n\n// 1. Textareas should really only resize vertically so they don't break their (horizontal) containers.\n\ntextarea {\n resize: vertical; // 1\n}\n\n// 1. Browsers set a default `min-width: min-content;` on fieldsets,\n// unlike e.g. ``s, which have `min-width: 0;` by default.\n// So we reset that to ensure fieldsets behave more like a standard block element.\n// See https://github.com/twbs/bootstrap/issues/12359\n// and https://html.spec.whatwg.org/multipage/#the-fieldset-and-legend-elements\n// 2. Reset the default outline behavior of fieldsets so they don't affect page layout.\n\nfieldset {\n min-width: 0; // 1\n padding: 0; // 2\n margin: 0; // 2\n border: 0; // 2\n}\n\n// 1. By using `float: left`, the legend will behave like a block element.\n// This way the border of a fieldset wraps around the legend if present.\n// 2. Fix wrapping bug.\n// See https://github.com/twbs/bootstrap/issues/29712\n\nlegend {\n float: left; // 1\n width: 100%;\n padding: 0;\n margin-bottom: $legend-margin-bottom;\n @include font-size($legend-font-size);\n font-weight: $legend-font-weight;\n line-height: inherit;\n\n + * {\n clear: left; // 2\n }\n}\n\n// Fix height of inputs with a type of datetime-local, date, month, week, or time\n// See https://github.com/twbs/bootstrap/issues/18842\n\n::-webkit-datetime-edit-fields-wrapper,\n::-webkit-datetime-edit-text,\n::-webkit-datetime-edit-minute,\n::-webkit-datetime-edit-hour-field,\n::-webkit-datetime-edit-day-field,\n::-webkit-datetime-edit-month-field,\n::-webkit-datetime-edit-year-field {\n padding: 0;\n}\n\n::-webkit-inner-spin-button {\n height: auto;\n}\n\n// 1. This overrides the extra rounded corners on search inputs in iOS so that our\n// `.form-control` class can properly style them. Note that this cannot simply\n// be added to `.form-control` as it's not specific enough. For details, see\n// https://github.com/twbs/bootstrap/issues/11586.\n// 2. Correct the outline style in Safari.\n\n[type=\"search\"] {\n -webkit-appearance: textfield; // 1\n outline-offset: -2px; // 2\n}\n\n// 1. A few input types should stay LTR\n// See https://rtlstyling.com/posts/rtl-styling#form-inputs\n// 2. RTL only output\n// See https://rtlcss.com/learn/usage-guide/control-directives/#raw\n\n/* rtl:raw:\n[type=\"tel\"],\n[type=\"url\"],\n[type=\"email\"],\n[type=\"number\"] {\n direction: ltr;\n}\n*/\n\n// Remove the inner padding in Chrome and Safari on macOS.\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n// Remove padding around color pickers in webkit browsers\n\n::-webkit-color-swatch-wrapper {\n padding: 0;\n}\n\n\n// 1. Inherit font family and line height for file input buttons\n// 2. Correct the inability to style clickable types in iOS and Safari.\n\n::file-selector-button {\n font: inherit; // 1\n -webkit-appearance: button; // 2\n}\n\n// Correct element displays\n\noutput {\n display: inline-block;\n}\n\n// Remove border from iframe\n\niframe {\n border: 0;\n}\n\n// Summary\n//\n// 1. Add the correct display in all browsers\n\nsummary {\n display: list-item; // 1\n cursor: pointer;\n}\n\n\n// Progress\n//\n// Add the correct vertical alignment in Chrome, Firefox, and Opera.\n\nprogress {\n vertical-align: baseline;\n}\n\n\n// Hidden attribute\n//\n// Always hide an element with the `hidden` HTML attribute.\n\n[hidden] {\n display: none !important;\n}\n","// stylelint-disable property-disallowed-list\n// Single side border-radius\n\n// Helper function to replace negative values with 0\n@function valid-radius($radius) {\n $return: ();\n @each $value in $radius {\n @if type-of($value) == number {\n $return: append($return, max($value, 0));\n } @else {\n $return: append($return, $value);\n }\n }\n @return $return;\n}\n\n// scss-docs-start border-radius-mixins\n@mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {\n @if $enable-rounded {\n border-radius: valid-radius($radius);\n }\n @else if $fallback-border-radius != false {\n border-radius: $fallback-border-radius;\n }\n}\n\n@mixin border-top-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-left-radius: valid-radius($radius);\n border-top-right-radius: valid-radius($radius);\n }\n}\n\n@mixin border-end-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-right-radius: valid-radius($radius);\n border-bottom-right-radius: valid-radius($radius);\n }\n}\n\n@mixin border-bottom-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-bottom-right-radius: valid-radius($radius);\n border-bottom-left-radius: valid-radius($radius);\n }\n}\n\n@mixin border-start-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-left-radius: valid-radius($radius);\n border-bottom-left-radius: valid-radius($radius);\n }\n}\n\n@mixin border-top-start-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-left-radius: valid-radius($radius);\n }\n}\n\n@mixin border-top-end-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-right-radius: valid-radius($radius);\n }\n}\n\n@mixin border-bottom-end-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-bottom-right-radius: valid-radius($radius);\n }\n}\n\n@mixin border-bottom-start-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-bottom-left-radius: valid-radius($radius);\n }\n}\n// scss-docs-end border-radius-mixins\n"]}
--------------------------------------------------------------------------------
/BlazorCodeEditor/wwwroot/lib/bootstrap/dist/css/bootstrap-reboot.rtl.css:
--------------------------------------------------------------------------------
1 | /*!
2 | * Bootstrap Reboot v5.3.3 (https://getbootstrap.com/)
3 | * Copyright 2011-2024 The Bootstrap Authors
4 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
5 | */
6 | :root,
7 | [data-bs-theme=light] {
8 | --bs-blue: #0d6efd;
9 | --bs-indigo: #6610f2;
10 | --bs-purple: #6f42c1;
11 | --bs-pink: #d63384;
12 | --bs-red: #dc3545;
13 | --bs-orange: #fd7e14;
14 | --bs-yellow: #ffc107;
15 | --bs-green: #198754;
16 | --bs-teal: #20c997;
17 | --bs-cyan: #0dcaf0;
18 | --bs-black: #000;
19 | --bs-white: #fff;
20 | --bs-gray: #6c757d;
21 | --bs-gray-dark: #343a40;
22 | --bs-gray-100: #f8f9fa;
23 | --bs-gray-200: #e9ecef;
24 | --bs-gray-300: #dee2e6;
25 | --bs-gray-400: #ced4da;
26 | --bs-gray-500: #adb5bd;
27 | --bs-gray-600: #6c757d;
28 | --bs-gray-700: #495057;
29 | --bs-gray-800: #343a40;
30 | --bs-gray-900: #212529;
31 | --bs-primary: #0d6efd;
32 | --bs-secondary: #6c757d;
33 | --bs-success: #198754;
34 | --bs-info: #0dcaf0;
35 | --bs-warning: #ffc107;
36 | --bs-danger: #dc3545;
37 | --bs-light: #f8f9fa;
38 | --bs-dark: #212529;
39 | --bs-primary-rgb: 13, 110, 253;
40 | --bs-secondary-rgb: 108, 117, 125;
41 | --bs-success-rgb: 25, 135, 84;
42 | --bs-info-rgb: 13, 202, 240;
43 | --bs-warning-rgb: 255, 193, 7;
44 | --bs-danger-rgb: 220, 53, 69;
45 | --bs-light-rgb: 248, 249, 250;
46 | --bs-dark-rgb: 33, 37, 41;
47 | --bs-primary-text-emphasis: #052c65;
48 | --bs-secondary-text-emphasis: #2b2f32;
49 | --bs-success-text-emphasis: #0a3622;
50 | --bs-info-text-emphasis: #055160;
51 | --bs-warning-text-emphasis: #664d03;
52 | --bs-danger-text-emphasis: #58151c;
53 | --bs-light-text-emphasis: #495057;
54 | --bs-dark-text-emphasis: #495057;
55 | --bs-primary-bg-subtle: #cfe2ff;
56 | --bs-secondary-bg-subtle: #e2e3e5;
57 | --bs-success-bg-subtle: #d1e7dd;
58 | --bs-info-bg-subtle: #cff4fc;
59 | --bs-warning-bg-subtle: #fff3cd;
60 | --bs-danger-bg-subtle: #f8d7da;
61 | --bs-light-bg-subtle: #fcfcfd;
62 | --bs-dark-bg-subtle: #ced4da;
63 | --bs-primary-border-subtle: #9ec5fe;
64 | --bs-secondary-border-subtle: #c4c8cb;
65 | --bs-success-border-subtle: #a3cfbb;
66 | --bs-info-border-subtle: #9eeaf9;
67 | --bs-warning-border-subtle: #ffe69c;
68 | --bs-danger-border-subtle: #f1aeb5;
69 | --bs-light-border-subtle: #e9ecef;
70 | --bs-dark-border-subtle: #adb5bd;
71 | --bs-white-rgb: 255, 255, 255;
72 | --bs-black-rgb: 0, 0, 0;
73 | --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
74 | --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
75 | --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
76 | --bs-body-font-family: var(--bs-font-sans-serif);
77 | --bs-body-font-size: 1rem;
78 | --bs-body-font-weight: 400;
79 | --bs-body-line-height: 1.5;
80 | --bs-body-color: #212529;
81 | --bs-body-color-rgb: 33, 37, 41;
82 | --bs-body-bg: #fff;
83 | --bs-body-bg-rgb: 255, 255, 255;
84 | --bs-emphasis-color: #000;
85 | --bs-emphasis-color-rgb: 0, 0, 0;
86 | --bs-secondary-color: rgba(33, 37, 41, 0.75);
87 | --bs-secondary-color-rgb: 33, 37, 41;
88 | --bs-secondary-bg: #e9ecef;
89 | --bs-secondary-bg-rgb: 233, 236, 239;
90 | --bs-tertiary-color: rgba(33, 37, 41, 0.5);
91 | --bs-tertiary-color-rgb: 33, 37, 41;
92 | --bs-tertiary-bg: #f8f9fa;
93 | --bs-tertiary-bg-rgb: 248, 249, 250;
94 | --bs-heading-color: inherit;
95 | --bs-link-color: #0d6efd;
96 | --bs-link-color-rgb: 13, 110, 253;
97 | --bs-link-decoration: underline;
98 | --bs-link-hover-color: #0a58ca;
99 | --bs-link-hover-color-rgb: 10, 88, 202;
100 | --bs-code-color: #d63384;
101 | --bs-highlight-color: #212529;
102 | --bs-highlight-bg: #fff3cd;
103 | --bs-border-width: 1px;
104 | --bs-border-style: solid;
105 | --bs-border-color: #dee2e6;
106 | --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
107 | --bs-border-radius: 0.375rem;
108 | --bs-border-radius-sm: 0.25rem;
109 | --bs-border-radius-lg: 0.5rem;
110 | --bs-border-radius-xl: 1rem;
111 | --bs-border-radius-xxl: 2rem;
112 | --bs-border-radius-2xl: var(--bs-border-radius-xxl);
113 | --bs-border-radius-pill: 50rem;
114 | --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
115 | --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
116 | --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
117 | --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
118 | --bs-focus-ring-width: 0.25rem;
119 | --bs-focus-ring-opacity: 0.25;
120 | --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
121 | --bs-form-valid-color: #198754;
122 | --bs-form-valid-border-color: #198754;
123 | --bs-form-invalid-color: #dc3545;
124 | --bs-form-invalid-border-color: #dc3545;
125 | }
126 |
127 | [data-bs-theme=dark] {
128 | color-scheme: dark;
129 | --bs-body-color: #dee2e6;
130 | --bs-body-color-rgb: 222, 226, 230;
131 | --bs-body-bg: #212529;
132 | --bs-body-bg-rgb: 33, 37, 41;
133 | --bs-emphasis-color: #fff;
134 | --bs-emphasis-color-rgb: 255, 255, 255;
135 | --bs-secondary-color: rgba(222, 226, 230, 0.75);
136 | --bs-secondary-color-rgb: 222, 226, 230;
137 | --bs-secondary-bg: #343a40;
138 | --bs-secondary-bg-rgb: 52, 58, 64;
139 | --bs-tertiary-color: rgba(222, 226, 230, 0.5);
140 | --bs-tertiary-color-rgb: 222, 226, 230;
141 | --bs-tertiary-bg: #2b3035;
142 | --bs-tertiary-bg-rgb: 43, 48, 53;
143 | --bs-primary-text-emphasis: #6ea8fe;
144 | --bs-secondary-text-emphasis: #a7acb1;
145 | --bs-success-text-emphasis: #75b798;
146 | --bs-info-text-emphasis: #6edff6;
147 | --bs-warning-text-emphasis: #ffda6a;
148 | --bs-danger-text-emphasis: #ea868f;
149 | --bs-light-text-emphasis: #f8f9fa;
150 | --bs-dark-text-emphasis: #dee2e6;
151 | --bs-primary-bg-subtle: #031633;
152 | --bs-secondary-bg-subtle: #161719;
153 | --bs-success-bg-subtle: #051b11;
154 | --bs-info-bg-subtle: #032830;
155 | --bs-warning-bg-subtle: #332701;
156 | --bs-danger-bg-subtle: #2c0b0e;
157 | --bs-light-bg-subtle: #343a40;
158 | --bs-dark-bg-subtle: #1a1d20;
159 | --bs-primary-border-subtle: #084298;
160 | --bs-secondary-border-subtle: #41464b;
161 | --bs-success-border-subtle: #0f5132;
162 | --bs-info-border-subtle: #087990;
163 | --bs-warning-border-subtle: #997404;
164 | --bs-danger-border-subtle: #842029;
165 | --bs-light-border-subtle: #495057;
166 | --bs-dark-border-subtle: #343a40;
167 | --bs-heading-color: inherit;
168 | --bs-link-color: #6ea8fe;
169 | --bs-link-hover-color: #8bb9fe;
170 | --bs-link-color-rgb: 110, 168, 254;
171 | --bs-link-hover-color-rgb: 139, 185, 254;
172 | --bs-code-color: #e685b5;
173 | --bs-highlight-color: #dee2e6;
174 | --bs-highlight-bg: #664d03;
175 | --bs-border-color: #495057;
176 | --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
177 | --bs-form-valid-color: #75b798;
178 | --bs-form-valid-border-color: #75b798;
179 | --bs-form-invalid-color: #ea868f;
180 | --bs-form-invalid-border-color: #ea868f;
181 | }
182 |
183 | *,
184 | *::before,
185 | *::after {
186 | box-sizing: border-box;
187 | }
188 |
189 | @media (prefers-reduced-motion: no-preference) {
190 | :root {
191 | scroll-behavior: smooth;
192 | }
193 | }
194 |
195 | body {
196 | margin: 0;
197 | font-family: var(--bs-body-font-family);
198 | font-size: var(--bs-body-font-size);
199 | font-weight: var(--bs-body-font-weight);
200 | line-height: var(--bs-body-line-height);
201 | color: var(--bs-body-color);
202 | text-align: var(--bs-body-text-align);
203 | background-color: var(--bs-body-bg);
204 | -webkit-text-size-adjust: 100%;
205 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
206 | }
207 |
208 | hr {
209 | margin: 1rem 0;
210 | color: inherit;
211 | border: 0;
212 | border-top: var(--bs-border-width) solid;
213 | opacity: 0.25;
214 | }
215 |
216 | h6, h5, h4, h3, h2, h1 {
217 | margin-top: 0;
218 | margin-bottom: 0.5rem;
219 | font-weight: 500;
220 | line-height: 1.2;
221 | color: var(--bs-heading-color);
222 | }
223 |
224 | h1 {
225 | font-size: calc(1.375rem + 1.5vw);
226 | }
227 | @media (min-width: 1200px) {
228 | h1 {
229 | font-size: 2.5rem;
230 | }
231 | }
232 |
233 | h2 {
234 | font-size: calc(1.325rem + 0.9vw);
235 | }
236 | @media (min-width: 1200px) {
237 | h2 {
238 | font-size: 2rem;
239 | }
240 | }
241 |
242 | h3 {
243 | font-size: calc(1.3rem + 0.6vw);
244 | }
245 | @media (min-width: 1200px) {
246 | h3 {
247 | font-size: 1.75rem;
248 | }
249 | }
250 |
251 | h4 {
252 | font-size: calc(1.275rem + 0.3vw);
253 | }
254 | @media (min-width: 1200px) {
255 | h4 {
256 | font-size: 1.5rem;
257 | }
258 | }
259 |
260 | h5 {
261 | font-size: 1.25rem;
262 | }
263 |
264 | h6 {
265 | font-size: 1rem;
266 | }
267 |
268 | p {
269 | margin-top: 0;
270 | margin-bottom: 1rem;
271 | }
272 |
273 | abbr[title] {
274 | -webkit-text-decoration: underline dotted;
275 | text-decoration: underline dotted;
276 | cursor: help;
277 | -webkit-text-decoration-skip-ink: none;
278 | text-decoration-skip-ink: none;
279 | }
280 |
281 | address {
282 | margin-bottom: 1rem;
283 | font-style: normal;
284 | line-height: inherit;
285 | }
286 |
287 | ol,
288 | ul {
289 | padding-right: 2rem;
290 | }
291 |
292 | ol,
293 | ul,
294 | dl {
295 | margin-top: 0;
296 | margin-bottom: 1rem;
297 | }
298 |
299 | ol ol,
300 | ul ul,
301 | ol ul,
302 | ul ol {
303 | margin-bottom: 0;
304 | }
305 |
306 | dt {
307 | font-weight: 700;
308 | }
309 |
310 | dd {
311 | margin-bottom: 0.5rem;
312 | margin-right: 0;
313 | }
314 |
315 | blockquote {
316 | margin: 0 0 1rem;
317 | }
318 |
319 | b,
320 | strong {
321 | font-weight: bolder;
322 | }
323 |
324 | small {
325 | font-size: 0.875em;
326 | }
327 |
328 | mark {
329 | padding: 0.1875em;
330 | color: var(--bs-highlight-color);
331 | background-color: var(--bs-highlight-bg);
332 | }
333 |
334 | sub,
335 | sup {
336 | position: relative;
337 | font-size: 0.75em;
338 | line-height: 0;
339 | vertical-align: baseline;
340 | }
341 |
342 | sub {
343 | bottom: -0.25em;
344 | }
345 |
346 | sup {
347 | top: -0.5em;
348 | }
349 |
350 | a {
351 | color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
352 | text-decoration: underline;
353 | }
354 | a:hover {
355 | --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
356 | }
357 |
358 | a:not([href]):not([class]), a:not([href]):not([class]):hover {
359 | color: inherit;
360 | text-decoration: none;
361 | }
362 |
363 | pre,
364 | code,
365 | kbd,
366 | samp {
367 | font-family: var(--bs-font-monospace);
368 | font-size: 1em;
369 | }
370 |
371 | pre {
372 | display: block;
373 | margin-top: 0;
374 | margin-bottom: 1rem;
375 | overflow: auto;
376 | font-size: 0.875em;
377 | }
378 | pre code {
379 | font-size: inherit;
380 | color: inherit;
381 | word-break: normal;
382 | }
383 |
384 | code {
385 | font-size: 0.875em;
386 | color: var(--bs-code-color);
387 | word-wrap: break-word;
388 | }
389 | a > code {
390 | color: inherit;
391 | }
392 |
393 | kbd {
394 | padding: 0.1875rem 0.375rem;
395 | font-size: 0.875em;
396 | color: var(--bs-body-bg);
397 | background-color: var(--bs-body-color);
398 | border-radius: 0.25rem;
399 | }
400 | kbd kbd {
401 | padding: 0;
402 | font-size: 1em;
403 | }
404 |
405 | figure {
406 | margin: 0 0 1rem;
407 | }
408 |
409 | img,
410 | svg {
411 | vertical-align: middle;
412 | }
413 |
414 | table {
415 | caption-side: bottom;
416 | border-collapse: collapse;
417 | }
418 |
419 | caption {
420 | padding-top: 0.5rem;
421 | padding-bottom: 0.5rem;
422 | color: var(--bs-secondary-color);
423 | text-align: right;
424 | }
425 |
426 | th {
427 | text-align: inherit;
428 | text-align: -webkit-match-parent;
429 | }
430 |
431 | thead,
432 | tbody,
433 | tfoot,
434 | tr,
435 | td,
436 | th {
437 | border-color: inherit;
438 | border-style: solid;
439 | border-width: 0;
440 | }
441 |
442 | label {
443 | display: inline-block;
444 | }
445 |
446 | button {
447 | border-radius: 0;
448 | }
449 |
450 | button:focus:not(:focus-visible) {
451 | outline: 0;
452 | }
453 |
454 | input,
455 | button,
456 | select,
457 | optgroup,
458 | textarea {
459 | margin: 0;
460 | font-family: inherit;
461 | font-size: inherit;
462 | line-height: inherit;
463 | }
464 |
465 | button,
466 | select {
467 | text-transform: none;
468 | }
469 |
470 | [role=button] {
471 | cursor: pointer;
472 | }
473 |
474 | select {
475 | word-wrap: normal;
476 | }
477 | select:disabled {
478 | opacity: 1;
479 | }
480 |
481 | [list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator {
482 | display: none !important;
483 | }
484 |
485 | button,
486 | [type=button],
487 | [type=reset],
488 | [type=submit] {
489 | -webkit-appearance: button;
490 | }
491 | button:not(:disabled),
492 | [type=button]:not(:disabled),
493 | [type=reset]:not(:disabled),
494 | [type=submit]:not(:disabled) {
495 | cursor: pointer;
496 | }
497 |
498 | ::-moz-focus-inner {
499 | padding: 0;
500 | border-style: none;
501 | }
502 |
503 | textarea {
504 | resize: vertical;
505 | }
506 |
507 | fieldset {
508 | min-width: 0;
509 | padding: 0;
510 | margin: 0;
511 | border: 0;
512 | }
513 |
514 | legend {
515 | float: right;
516 | width: 100%;
517 | padding: 0;
518 | margin-bottom: 0.5rem;
519 | font-size: calc(1.275rem + 0.3vw);
520 | line-height: inherit;
521 | }
522 | @media (min-width: 1200px) {
523 | legend {
524 | font-size: 1.5rem;
525 | }
526 | }
527 | legend + * {
528 | clear: right;
529 | }
530 |
531 | ::-webkit-datetime-edit-fields-wrapper,
532 | ::-webkit-datetime-edit-text,
533 | ::-webkit-datetime-edit-minute,
534 | ::-webkit-datetime-edit-hour-field,
535 | ::-webkit-datetime-edit-day-field,
536 | ::-webkit-datetime-edit-month-field,
537 | ::-webkit-datetime-edit-year-field {
538 | padding: 0;
539 | }
540 |
541 | ::-webkit-inner-spin-button {
542 | height: auto;
543 | }
544 |
545 | [type=search] {
546 | -webkit-appearance: textfield;
547 | outline-offset: -2px;
548 | }
549 |
550 | [type="tel"],
551 | [type="url"],
552 | [type="email"],
553 | [type="number"] {
554 | direction: ltr;
555 | }
556 | ::-webkit-search-decoration {
557 | -webkit-appearance: none;
558 | }
559 |
560 | ::-webkit-color-swatch-wrapper {
561 | padding: 0;
562 | }
563 |
564 | ::-webkit-file-upload-button {
565 | font: inherit;
566 | -webkit-appearance: button;
567 | }
568 |
569 | ::file-selector-button {
570 | font: inherit;
571 | -webkit-appearance: button;
572 | }
573 |
574 | output {
575 | display: inline-block;
576 | }
577 |
578 | iframe {
579 | border: 0;
580 | }
581 |
582 | summary {
583 | display: list-item;
584 | cursor: pointer;
585 | }
586 |
587 | progress {
588 | vertical-align: baseline;
589 | }
590 |
591 | [hidden] {
592 | display: none !important;
593 | }
594 | /*# sourceMappingURL=bootstrap-reboot.rtl.css.map */
--------------------------------------------------------------------------------
/BlazorCodeEditor/wwwroot/lib/bootstrap/dist/css/bootstrap-reboot.rtl.min.css:
--------------------------------------------------------------------------------
1 | /*!
2 | * Bootstrap Reboot v5.3.3 (https://getbootstrap.com/)
3 | * Copyright 2011-2024 The Bootstrap Authors
4 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
5 | */:root,[data-bs-theme=light]{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-black:#000;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-primary-text-emphasis:#052c65;--bs-secondary-text-emphasis:#2b2f32;--bs-success-text-emphasis:#0a3622;--bs-info-text-emphasis:#055160;--bs-warning-text-emphasis:#664d03;--bs-danger-text-emphasis:#58151c;--bs-light-text-emphasis:#495057;--bs-dark-text-emphasis:#495057;--bs-primary-bg-subtle:#cfe2ff;--bs-secondary-bg-subtle:#e2e3e5;--bs-success-bg-subtle:#d1e7dd;--bs-info-bg-subtle:#cff4fc;--bs-warning-bg-subtle:#fff3cd;--bs-danger-bg-subtle:#f8d7da;--bs-light-bg-subtle:#fcfcfd;--bs-dark-bg-subtle:#ced4da;--bs-primary-border-subtle:#9ec5fe;--bs-secondary-border-subtle:#c4c8cb;--bs-success-border-subtle:#a3cfbb;--bs-info-border-subtle:#9eeaf9;--bs-warning-border-subtle:#ffe69c;--bs-danger-border-subtle:#f1aeb5;--bs-light-border-subtle:#e9ecef;--bs-dark-border-subtle:#adb5bd;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-color-rgb:33,37,41;--bs-body-bg:#fff;--bs-body-bg-rgb:255,255,255;--bs-emphasis-color:#000;--bs-emphasis-color-rgb:0,0,0;--bs-secondary-color:rgba(33, 37, 41, 0.75);--bs-secondary-color-rgb:33,37,41;--bs-secondary-bg:#e9ecef;--bs-secondary-bg-rgb:233,236,239;--bs-tertiary-color:rgba(33, 37, 41, 0.5);--bs-tertiary-color-rgb:33,37,41;--bs-tertiary-bg:#f8f9fa;--bs-tertiary-bg-rgb:248,249,250;--bs-heading-color:inherit;--bs-link-color:#0d6efd;--bs-link-color-rgb:13,110,253;--bs-link-decoration:underline;--bs-link-hover-color:#0a58ca;--bs-link-hover-color-rgb:10,88,202;--bs-code-color:#d63384;--bs-highlight-color:#212529;--bs-highlight-bg:#fff3cd;--bs-border-width:1px;--bs-border-style:solid;--bs-border-color:#dee2e6;--bs-border-color-translucent:rgba(0, 0, 0, 0.175);--bs-border-radius:0.375rem;--bs-border-radius-sm:0.25rem;--bs-border-radius-lg:0.5rem;--bs-border-radius-xl:1rem;--bs-border-radius-xxl:2rem;--bs-border-radius-2xl:var(--bs-border-radius-xxl);--bs-border-radius-pill:50rem;--bs-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-box-shadow-sm:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);--bs-box-shadow-lg:0 1rem 3rem rgba(0, 0, 0, 0.175);--bs-box-shadow-inset:inset 0 1px 2px rgba(0, 0, 0, 0.075);--bs-focus-ring-width:0.25rem;--bs-focus-ring-opacity:0.25;--bs-focus-ring-color:rgba(13, 110, 253, 0.25);--bs-form-valid-color:#198754;--bs-form-valid-border-color:#198754;--bs-form-invalid-color:#dc3545;--bs-form-invalid-border-color:#dc3545}[data-bs-theme=dark]{color-scheme:dark;--bs-body-color:#dee2e6;--bs-body-color-rgb:222,226,230;--bs-body-bg:#212529;--bs-body-bg-rgb:33,37,41;--bs-emphasis-color:#fff;--bs-emphasis-color-rgb:255,255,255;--bs-secondary-color:rgba(222, 226, 230, 0.75);--bs-secondary-color-rgb:222,226,230;--bs-secondary-bg:#343a40;--bs-secondary-bg-rgb:52,58,64;--bs-tertiary-color:rgba(222, 226, 230, 0.5);--bs-tertiary-color-rgb:222,226,230;--bs-tertiary-bg:#2b3035;--bs-tertiary-bg-rgb:43,48,53;--bs-primary-text-emphasis:#6ea8fe;--bs-secondary-text-emphasis:#a7acb1;--bs-success-text-emphasis:#75b798;--bs-info-text-emphasis:#6edff6;--bs-warning-text-emphasis:#ffda6a;--bs-danger-text-emphasis:#ea868f;--bs-light-text-emphasis:#f8f9fa;--bs-dark-text-emphasis:#dee2e6;--bs-primary-bg-subtle:#031633;--bs-secondary-bg-subtle:#161719;--bs-success-bg-subtle:#051b11;--bs-info-bg-subtle:#032830;--bs-warning-bg-subtle:#332701;--bs-danger-bg-subtle:#2c0b0e;--bs-light-bg-subtle:#343a40;--bs-dark-bg-subtle:#1a1d20;--bs-primary-border-subtle:#084298;--bs-secondary-border-subtle:#41464b;--bs-success-border-subtle:#0f5132;--bs-info-border-subtle:#087990;--bs-warning-border-subtle:#997404;--bs-danger-border-subtle:#842029;--bs-light-border-subtle:#495057;--bs-dark-border-subtle:#343a40;--bs-heading-color:inherit;--bs-link-color:#6ea8fe;--bs-link-hover-color:#8bb9fe;--bs-link-color-rgb:110,168,254;--bs-link-hover-color-rgb:139,185,254;--bs-code-color:#e685b5;--bs-highlight-color:#dee2e6;--bs-highlight-bg:#664d03;--bs-border-color:#495057;--bs-border-color-translucent:rgba(255, 255, 255, 0.15);--bs-form-valid-color:#75b798;--bs-form-valid-border-color:#75b798;--bs-form-invalid-color:#ea868f;--bs-form-invalid-border-color:#ea868f}*,::after,::before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}hr{margin:1rem 0;color:inherit;border:0;border-top:var(--bs-border-width) solid;opacity:.25}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2;color:var(--bs-heading-color)}h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){h1{font-size:2.5rem}}h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){h2{font-size:2rem}}h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){h3{font-size:1.75rem}}h4{font-size:calc(1.275rem + .3vw)}@media (min-width:1200px){h4{font-size:1.5rem}}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-right:2rem}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-right:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:.875em}mark{padding:.1875em;color:var(--bs-highlight-color);background-color:var(--bs-highlight-bg)}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,1));text-decoration:underline}a:hover{--bs-link-color-rgb:var(--bs-link-hover-color-rgb)}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code,kbd,pre,samp{font-family:var(--bs-font-monospace);font-size:1em}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:.875em;color:var(--bs-code-color);word-wrap:break-word}a>code{color:inherit}kbd{padding:.1875rem .375rem;font-size:.875em;color:var(--bs-body-bg);background-color:var(--bs-body-color);border-radius:.25rem}kbd kbd{padding:0;font-size:1em}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:.5rem;padding-bottom:.5rem;color:var(--bs-secondary-color);text-align:right}th{text-align:inherit;text-align:-webkit-match-parent}tbody,td,tfoot,th,thead,tr{border-color:inherit;border-style:solid;border-width:0}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator{display:none!important}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:right;width:100%;padding:0;margin-bottom:.5rem;font-size:calc(1.275rem + .3vw);line-height:inherit}@media (min-width:1200px){legend{font-size:1.5rem}}legend+*{clear:right}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=email],[type=number],[type=tel],[type=url]{direction:ltr}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}::file-selector-button{font:inherit;-webkit-appearance:button}output{display:inline-block}iframe{border:0}summary{display:list-item;cursor:pointer}progress{vertical-align:baseline}[hidden]{display:none!important}
6 | /*# sourceMappingURL=bootstrap-reboot.rtl.min.css.map */
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2024 thatplatypus
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # BlazorCodeEditor
2 | A fully client side c# code editor with blazor and roslyn
3 |
4 | ## Overview
5 | Blazor Code Editor is a minimal, client-side web application built with Blazor WebAssembly. It demonstrates a novel approach to dynamically compiling and executing C# code entirely in the browser. This project is a lightweight public version of Apollo, showcasing its core capabilities in a simplified form.
6 |
7 | Features include:
8 | - Client-side compilation and execution of C# code.
9 | - Lightweight, browser-based IDE experience.
10 | - Monaco-based code editor with syntax highlighting and support for C#.
11 | - Support for multiple files within a solution.
12 | - Educational value as an example of dynamic code execution in WebAssembly.
13 |
14 | ## Prerequisites
15 | - Visual Studio 2022 17.9 or later.
16 | - .NET 9 SDK installed.
17 | - Basic knowledge of C# and Blazor.
18 |
19 | ## Installation & Build
20 | Clone the repository and build the project using:
21 |
22 | ```bash
23 | # Clone the repository
24 | git clone https://github.com/thatplatypus/BlazorCodeEditor.git
25 |
26 | # Navigate to the project directory
27 | cd BlazorCodeEditor
28 |
29 | # Build the project
30 | dotnet build
31 | ```
32 |
33 | ## Setup & Configuration
34 | Blazor Code Editor relies on the following approach to handling WebAssembly with .NET:
35 |
36 | - **Webcil Integration**: This project makes use of the [Webcil format](https://github.com/dotnet/runtime/blob/main/docs/design/mono/webcil.md), a WebAssembly-compatible representation of .NET assemblies, enabling C# code to compile and execute dynamically within the browser.
37 | - **Roslyn in WebAssembly**: The project invokes the Roslyn compiler at runtime, resolving metadata references and transpiling assemblies back into a format suitable for execution in the browser.
38 |
39 | No server setup is required as the entire application runs within the browser's sandbox.
40 |
41 | ## Running the Application
42 | To run the application locally:
43 |
44 | 1. Build the project as shown in the Installation section.
45 | 2. Use the following command to launch the application:
46 |
47 | ```bash
48 | dotnet run --project BlazorCodeEditor
49 | ```
50 |
51 | 3. Open the provided URL in your browser (e.g., `http://localhost:5000`).
52 |
53 | ## Technical Details
54 | - The application leverages [Mono's Webcil format](https://github.com/dotnet/runtime/blob/main/docs/design/mono/webcil.md) to enable native .NET assembly execution in WebAssembly.
55 | - Metadata references are dynamically resolved at runtime, eliminating the need for pre-bundled DLLs.
56 | - The project adopts a reflection-heavy architecture due to browser runtime constraints, supporting only browser-compatible APIs.
57 |
58 | ## Educational Use Case
59 | Blazor Code Editor is a perfect starting point for:
60 | - Exploring WebAssembly and Blazor capabilities.
61 | - Understanding dynamic code compilation and execution in a browser environment.
62 | - Building educational tools or demos for teaching C#.
63 |
64 | ## Contributing
65 | Pull requests are welcome. For major changes, please open an issue to discuss what you would like to change.
66 |
67 | ## License
68 | This project is licensed under the [MIT License](https://choosealicense.com/licenses/mit/).
69 |
--------------------------------------------------------------------------------