@nova-ui/bits
Version:
SolarWinds Nova Framework
82 lines • 11.6 kB
JavaScript
// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to
// deal in the Software without restriction, including without limitation the
// rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
// sell copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.
/** @ignore */
import { Component, Input, ViewEncapsulation, } from "@angular/core";
import hljs from "highlight.js";
import * as i0 from "@angular/core";
/**
* <example-url>./../examples/index.html#/code</example-url><br />
*/
/**
* @ignore
* Purpose of this component is to format and colorize your source code snippets.
* Optionally you can
* specify a programming language to be used for highlighting, otherwise an automated detection will be used. This
* directive is encapsulating Highlight.js library.
*
* Consumer needs to set up languages which need to be supported. It must happen before CodeComponent is rendered.
* The best place is parent page/component's onInit() or in app initializer
* example:
*
* import hljs from "highlight.js";
*
* where "highlight.js" should be used as alias to regular "highlight.js/lib/core.js"
* to avoid loading all languages. And then just load what you really need, e.g. typescript
*
*
* __Name:__
*
* NUI Code component.
*
* __Usage:__
*
* ```html
* <nui-example-code [code]=[code]><nui-example-code>
* ```
*
*/
export class ExampleCodeComponent {
constructor() {
/**
* Programming language used (auto-detect if not present) - see
* https://highlightjs.org/static/demo/ for possible values
*/
this.language = "typescript";
this.codeText = "";
}
set code(c) {
const code = c.trim();
if (!code) {
return;
}
this.codeText = hljs.highlight(code, { language: this.language }).value;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ExampleCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ExampleCodeComponent, selector: "nui-example-code", inputs: { language: "language", code: "code" }, ngImport: i0, template: "<div class=\"hljs nui-example-code\" [innerHTML]=\"codeText\"></div>\n", styles: [".nui-example-code{white-space:pre;font-family:Source Code Pro,monospace;padding:.5em}.nui-example-code--no-padding.hljs{padding:0}.nui-example-code--transparent-background.hljs,.nui-example-code--transparent-background>.hljs{background:none}.hljs{display:block;overflow-x:auto;color:#fff;background-color:#333}.hljs-name,.hljs-strong{font-weight:700}.hljs-code,.hljs-emphasis{font-style:italic}.hljs-tag{color:#62c8f3}.hljs-variable,.hljs-template-variable,.hljs-selector-id,.hljs-selector-class{color:#ade5fc}.hljs-string,.hljs-bullet{color:#a2fca2}.hljs-type,.hljs-title,.hljs-section,.hljs-attribute,.hljs-quote,.hljs-built_in,.hljs-builtin-name{color:#ffa}.hljs-number,.hljs-symbol,.hljs-bullet{color:#d36363}.hljs-keyword,.hljs-selector-tag,.hljs-literal{color:#fcc28c}.hljs-comment,.hljs-deletion,.hljs-code{color:#888}.hljs-regexp,.hljs-link{color:#c6b4f0}.hljs-meta{color:#fc9b9b}.hljs-deletion{background-color:#fc9b9b;color:#333}.hljs-addition{background-color:#a2fca2;color:#333}.hljs a{color:inherit}.hljs a:focus,.hljs a:hover{color:inherit;text-decoration:underline}\n"], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ExampleCodeComponent, decorators: [{
type: Component,
args: [{ selector: "nui-example-code", encapsulation: ViewEncapsulation.None, template: "<div class=\"hljs nui-example-code\" [innerHTML]=\"codeText\"></div>\n", styles: [".nui-example-code{white-space:pre;font-family:Source Code Pro,monospace;padding:.5em}.nui-example-code--no-padding.hljs{padding:0}.nui-example-code--transparent-background.hljs,.nui-example-code--transparent-background>.hljs{background:none}.hljs{display:block;overflow-x:auto;color:#fff;background-color:#333}.hljs-name,.hljs-strong{font-weight:700}.hljs-code,.hljs-emphasis{font-style:italic}.hljs-tag{color:#62c8f3}.hljs-variable,.hljs-template-variable,.hljs-selector-id,.hljs-selector-class{color:#ade5fc}.hljs-string,.hljs-bullet{color:#a2fca2}.hljs-type,.hljs-title,.hljs-section,.hljs-attribute,.hljs-quote,.hljs-built_in,.hljs-builtin-name{color:#ffa}.hljs-number,.hljs-symbol,.hljs-bullet{color:#d36363}.hljs-keyword,.hljs-selector-tag,.hljs-literal{color:#fcc28c}.hljs-comment,.hljs-deletion,.hljs-code{color:#888}.hljs-regexp,.hljs-link{color:#c6b4f0}.hljs-meta{color:#fc9b9b}.hljs-deletion{background-color:#fc9b9b;color:#333}.hljs-addition{background-color:#a2fca2;color:#333}.hljs a{color:inherit}.hljs a:focus,.hljs a:hover{color:inherit;text-decoration:underline}\n"] }]
}], propDecorators: { language: [{
type: Input
}], code: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXhhbXBsZS1jb2RlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9saWIvZG9jcy9leGFtcGxlLWNvZGUvZXhhbXBsZS1jb2RlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3NyYy9saWIvZG9jcy9leGFtcGxlLWNvZGUvZXhhbXBsZS1jb2RlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHlEQUF5RDtBQUN6RCxFQUFFO0FBQ0YsK0VBQStFO0FBQy9FLDRFQUE0RTtBQUM1RSw4RUFBOEU7QUFDOUUsK0VBQStFO0FBQy9FLDhFQUE4RTtBQUM5RSw0REFBNEQ7QUFDNUQsRUFBRTtBQUNGLDZFQUE2RTtBQUM3RSx1REFBdUQ7QUFDdkQsRUFBRTtBQUNGLDZFQUE2RTtBQUM3RSw0RUFBNEU7QUFDNUUsK0VBQStFO0FBQy9FLDBFQUEwRTtBQUMxRSxpRkFBaUY7QUFDakYsNkVBQTZFO0FBQzdFLGlCQUFpQjtBQUVqQixjQUFjO0FBQ2QsT0FBTyxFQUNILFNBQVMsRUFDVCxLQUFLLEVBQ0wsaUJBQWlCLEdBQ3BCLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sSUFBSSxNQUFNLGNBQWMsQ0FBQzs7QUFFaEM7O0dBRUc7QUFFSDs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBMkJHO0FBT0gsTUFBTSxPQUFPLG9CQUFvQjtJQU5qQztRQU9JOzs7V0FHRztRQUNhLGFBQVEsR0FBVyxZQUFZLENBQUM7UUFFekMsYUFBUSxHQUFHLEVBQUUsQ0FBQztLQVF4QjtJQVBHLElBQWEsSUFBSSxDQUFDLENBQVM7UUFDdkIsTUFBTSxJQUFJLEdBQUcsQ0FBQyxDQUFDLElBQUksRUFBRSxDQUFDO1FBQ3RCLElBQUksQ0FBQyxJQUFJLEVBQUU7WUFDUCxPQUFPO1NBQ1Y7UUFDRCxJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxFQUFFLEVBQUUsUUFBUSxFQUFFLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQyxDQUFDLEtBQUssQ0FBQztJQUM1RSxDQUFDOytHQWRRLG9CQUFvQjttR0FBcEIsb0JBQW9CLHdHQ2xFakMsd0VBQ0E7OzRGRGlFYSxvQkFBb0I7a0JBTmhDLFNBQVM7K0JBQ0ksa0JBQWtCLGlCQUdiLGlCQUFpQixDQUFDLElBQUk7OEJBT3JCLFFBQVE7c0JBQXZCLEtBQUs7Z0JBR08sSUFBSTtzQkFBaEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbIi8vIMKpIDIwMjIgU29sYXJXaW5kcyBXb3JsZHdpZGUsIExMQy4gQWxsIHJpZ2h0cyByZXNlcnZlZC5cbi8vXG4vLyBQZXJtaXNzaW9uIGlzIGhlcmVieSBncmFudGVkLCBmcmVlIG9mIGNoYXJnZSwgdG8gYW55IHBlcnNvbiBvYnRhaW5pbmcgYSBjb3B5XG4vLyAgb2YgdGhpcyBzb2Z0d2FyZSBhbmQgYXNzb2NpYXRlZCBkb2N1bWVudGF0aW9uIGZpbGVzICh0aGUgXCJTb2Z0d2FyZVwiKSwgdG9cbi8vICBkZWFsIGluIHRoZSBTb2Z0d2FyZSB3aXRob3V0IHJlc3RyaWN0aW9uLCBpbmNsdWRpbmcgd2l0aG91dCBsaW1pdGF0aW9uIHRoZVxuLy8gIHJpZ2h0cyB0byB1c2UsIGNvcHksIG1vZGlmeSwgbWVyZ2UsIHB1Ymxpc2gsIGRpc3RyaWJ1dGUsIHN1YmxpY2Vuc2UsIGFuZC9vclxuLy8gIHNlbGwgY29waWVzIG9mIHRoZSBTb2Z0d2FyZSwgYW5kIHRvIHBlcm1pdCBwZXJzb25zIHRvIHdob20gdGhlIFNvZnR3YXJlIGlzXG4vLyAgZnVybmlzaGVkIHRvIGRvIHNvLCBzdWJqZWN0IHRvIHRoZSBmb2xsb3dpbmcgY29uZGl0aW9uczpcbi8vXG4vLyBUaGUgYWJvdmUgY29weXJpZ2h0IG5vdGljZSBhbmQgdGhpcyBwZXJtaXNzaW9uIG5vdGljZSBzaGFsbCBiZSBpbmNsdWRlZCBpblxuLy8gIGFsbCBjb3BpZXMgb3Igc3Vic3RhbnRpYWwgcG9ydGlvbnMgb2YgdGhlIFNvZnR3YXJlLlxuLy9cbi8vIFRIRSBTT0ZUV0FSRSBJUyBQUk9WSURFRCBcIkFTIElTXCIsIFdJVEhPVVQgV0FSUkFOVFkgT0YgQU5ZIEtJTkQsIEVYUFJFU1MgT1Jcbi8vICBJTVBMSUVELCBJTkNMVURJTkcgQlVUIE5PVCBMSU1JVEVEIFRPIFRIRSBXQVJSQU5USUVTIE9GIE1FUkNIQU5UQUJJTElUWSxcbi8vICBGSVRORVNTIEZPUiBBIFBBUlRJQ1VMQVIgUFVSUE9TRSBBTkQgTk9OSU5GUklOR0VNRU5ULiBJTiBOTyBFVkVOVCBTSEFMTCBUSEVcbi8vICBBVVRIT1JTIE9SIENPUFlSSUdIVCBIT0xERVJTIEJFIExJQUJMRSBGT1IgQU5ZIENMQUlNLCBEQU1BR0VTIE9SIE9USEVSXG4vLyAgTElBQklMSVRZLCBXSEVUSEVSIElOIEFOIEFDVElPTiBPRiBDT05UUkFDVCwgVE9SVCBPUiBPVEhFUldJU0UsIEFSSVNJTkcgRlJPTSxcbi8vICBPVVQgT0YgT1IgSU4gQ09OTkVDVElPTiBXSVRIIFRIRSBTT0ZUV0FSRSBPUiBUSEUgVVNFIE9SIE9USEVSIERFQUxJTkdTIElOXG4vLyAgVEhFIFNPRlRXQVJFLlxuXG4vKiogQGlnbm9yZSAqL1xuaW1wb3J0IHtcbiAgICBDb21wb25lbnQsXG4gICAgSW5wdXQsXG4gICAgVmlld0VuY2Fwc3VsYXRpb24sXG59IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgaGxqcyBmcm9tIFwiaGlnaGxpZ2h0LmpzXCI7XG5cbi8qKlxuICogPGV4YW1wbGUtdXJsPi4vLi4vZXhhbXBsZXMvaW5kZXguaHRtbCMvY29kZTwvZXhhbXBsZS11cmw+PGJyIC8+XG4gKi9cblxuLyoqXG4gKiBAaWdub3JlXG4gKiBQdXJwb3NlIG9mIHRoaXMgY29tcG9uZW50IGlzIHRvIGZvcm1hdCBhbmQgY29sb3JpemUgeW91ciBzb3VyY2UgY29kZSBzbmlwcGV0cy5cbiAqIE9wdGlvbmFsbHkgeW91IGNhblxuICogc3BlY2lmeSBhIHByb2dyYW1taW5nIGxhbmd1YWdlIHRvIGJlIHVzZWQgZm9yIGhpZ2hsaWdodGluZywgb3RoZXJ3aXNlIGFuIGF1dG9tYXRlZCBkZXRlY3Rpb24gd2lsbCBiZSB1c2VkLiBUaGlzXG4gKiBkaXJlY3RpdmUgaXMgZW5jYXBzdWxhdGluZyBIaWdobGlnaHQuanMgbGlicmFyeS5cbiAqXG4gKiBDb25zdW1lciBuZWVkcyB0byBzZXQgdXAgbGFuZ3VhZ2VzIHdoaWNoIG5lZWQgdG8gYmUgc3VwcG9ydGVkLiBJdCBtdXN0IGhhcHBlbiBiZWZvcmUgQ29kZUNvbXBvbmVudCBpcyByZW5kZXJlZC5cbiAqIFRoZSBiZXN0IHBsYWNlIGlzIHBhcmVudCBwYWdlL2NvbXBvbmVudCdzIG9uSW5pdCgpIG9yIGluIGFwcCBpbml0aWFsaXplclxuICogZXhhbXBsZTpcbiAqXG4gKiBpbXBvcnQgaGxqcyBmcm9tIFwiaGlnaGxpZ2h0LmpzXCI7XG4gKlxuICogd2hlcmUgXCJoaWdobGlnaHQuanNcIiBzaG91bGQgYmUgdXNlZCBhcyBhbGlhcyB0byByZWd1bGFyIFwiaGlnaGxpZ2h0LmpzL2xpYi9jb3JlLmpzXCJcbiAqIHRvIGF2b2lkIGxvYWRpbmcgYWxsIGxhbmd1YWdlcy4gQW5kIHRoZW4ganVzdCBsb2FkIHdoYXQgeW91IHJlYWxseSBuZWVkLCBlLmcuIHR5cGVzY3JpcHRcbiAqXG4gKlxuICogX19OYW1lOl9fXG4gKlxuICogTlVJIENvZGUgY29tcG9uZW50LlxuICpcbiAqIF9fVXNhZ2U6X19cbiAqXG4gKiBgYGBodG1sXG4gKiA8bnVpLWV4YW1wbGUtY29kZSBbY29kZV09W2NvZGVdPjxudWktZXhhbXBsZS1jb2RlPlxuICogYGBgXG4gKlxuICovXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogXCJudWktZXhhbXBsZS1jb2RlXCIsXG4gICAgdGVtcGxhdGVVcmw6IFwiLi9leGFtcGxlLWNvZGUuY29tcG9uZW50Lmh0bWxcIixcbiAgICBzdHlsZVVybHM6IFtcIi4vZXhhbXBsZS1jb2RlLmNvbXBvbmVudC5sZXNzXCJdLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG59KVxuZXhwb3J0IGNsYXNzIEV4YW1wbGVDb2RlQ29tcG9uZW50IHtcbiAgICAvKipcbiAgICAgKiBQcm9ncmFtbWluZyBsYW5ndWFnZSB1c2VkIChhdXRvLWRldGVjdCBpZiBub3QgcHJlc2VudCkgLSBzZWVcbiAgICAgKiBodHRwczovL2hpZ2hsaWdodGpzLm9yZy9zdGF0aWMvZGVtby8gZm9yIHBvc3NpYmxlIHZhbHVlc1xuICAgICAqL1xuICAgIEBJbnB1dCgpIHB1YmxpYyBsYW5ndWFnZTogc3RyaW5nID0gXCJ0eXBlc2NyaXB0XCI7XG5cbiAgICBwdWJsaWMgY29kZVRleHQgPSBcIlwiO1xuICAgIEBJbnB1dCgpIHNldCBjb2RlKGM6IHN0cmluZykge1xuICAgICAgICBjb25zdCBjb2RlID0gYy50cmltKCk7XG4gICAgICAgIGlmICghY29kZSkge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG4gICAgICAgIHRoaXMuY29kZVRleHQgPSBobGpzLmhpZ2hsaWdodChjb2RlLCB7IGxhbmd1YWdlOiB0aGlzLmxhbmd1YWdlIH0pLnZhbHVlO1xuICAgIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJobGpzIG51aS1leGFtcGxlLWNvZGVcIiBbaW5uZXJIVE1MXT1cImNvZGVUZXh0XCI+PC9kaXY+XG4iXX0=