@blackbaud/skyux-lib-code-block 10.0.0 → 11.0.0-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/modules/code/code.component.mjs +3 -3
- package/esm2022/lib/modules/code/code.module.mjs +4 -4
- package/esm2022/lib/modules/code-block/code-block.component.mjs +3 -3
- package/esm2022/lib/modules/code-block/code-block.module.mjs +4 -4
- package/esm2022/lib/modules/shared/sky-code-block-resources.module.mjs +4 -4
- package/fesm2022/blackbaud-skyux-lib-code-block.mjs +18 -18
- package/package.json +7 -7
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
export class SkyCodeComponent {
|
|
4
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
4
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: SkyCodeComponent, selector: "sky-code", ngImport: i0, template: "<code class=\"sky-code\"><ng-content></ng-content></code>\n", styles: [".sky-code{border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;overflow-wrap:break-word;font-family:Menlo,Monaco,Consolas,Courier New,monospace;font-size:90%;color:#d1282c;padding:0 4px;background-color:#f1eef6}.sky-code ::ng-deep a{color:#d93a3d;text-decoration:underline}::ng-deep a .sky-code{text-decoration:underline}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6
6
|
}
|
|
7
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
7
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeComponent, decorators: [{
|
|
8
8
|
type: Component,
|
|
9
9
|
args: [{ selector: 'sky-code', changeDetection: ChangeDetectionStrategy.OnPush, template: "<code class=\"sky-code\"><ng-content></ng-content></code>\n", styles: [".sky-code{border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;overflow-wrap:break-word;font-family:Menlo,Monaco,Consolas,Courier New,monospace;font-size:90%;color:#d1282c;padding:0 4px;background-color:#f1eef6}.sky-code ::ng-deep a{color:#d93a3d;text-decoration:underline}::ng-deep a .sky-code{text-decoration:underline}\n"] }]
|
|
10
10
|
}] });
|
|
@@ -3,11 +3,11 @@ import { NgModule } from '@angular/core';
|
|
|
3
3
|
import { SkyCodeComponent } from './code.component';
|
|
4
4
|
import * as i0 from "@angular/core";
|
|
5
5
|
export class SkyCodeModule {
|
|
6
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
7
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
8
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
6
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
7
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeModule, declarations: [SkyCodeComponent], imports: [CommonModule], exports: [SkyCodeComponent] }); }
|
|
8
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeModule, imports: [CommonModule] }); }
|
|
9
9
|
}
|
|
10
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
10
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeModule, decorators: [{
|
|
11
11
|
type: NgModule,
|
|
12
12
|
args: [{
|
|
13
13
|
declarations: [SkyCodeComponent],
|
|
@@ -95,10 +95,10 @@ export class SkyCodeBlockComponent {
|
|
|
95
95
|
this.#changeDetector.detectChanges();
|
|
96
96
|
}
|
|
97
97
|
}
|
|
98
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
99
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
98
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
99
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: SkyCodeBlockComponent, selector: "sky-code-block", inputs: { code: "code", fileName: "fileName", languageType: "languageType", hideCopyToClipboard: "hideCopyToClipboard", hideHeader: "hideHeader" }, viewQueries: [{ propertyName: "codeTemplateRef", first: true, predicate: ["codeFromContent"], descendants: true, read: ElementRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"sky-code-block\">\n <div *ngIf=\"!hideHeader\" class=\"sky-code-block-header\">\n <div>\n <span *ngIf=\"fileName\" class=\"sky-emphasized sky-margin-inline-default\">\n {{ fileName }}\n </span>\n <span *ngIf=\"displayName\" class=\"sky-deemphasized\">\n {{ displayName }}\n </span>\n </div>\n <sky-copy-to-clipboard\n *ngIf=\"!hideCopyToClipboard\"\n [copyTarget]=\"skyCodeOutput\"\n buttonText=\"{{ 'sky_copy_to_clipboard_button' | skyLibResources }}\"\n buttonClickedText=\"{{\n 'sky_copy_to_clipboard_button_success' | skyLibResources\n }}\"\n >\n </sky-copy-to-clipboard>\n </div>\n <div #codeFromContent class=\"sky-code-input\">\n <ng-content></ng-content>\n </div>\n <div>\n <pre #skyCodeOutput class=\"sky-code-output\"><code\n [ngClass]=\"codeBlockClassName\"\n [innerHTML]=\"output\"></code></pre>\n </div>\n</div>\n", styles: ["::ng-deep code[class*=language-],pre[class*=language-]{color:#000;text-shadow:0 1px white;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}::ng-deep code[class*=language-] .token.comment,::ng-deep code[class*=language-] .token.prolog,::ng-deep code[class*=language-] .token.doctype,::ng-deep code[class*=language-] .token.cdata,pre[class*=language-] .token.comment,pre[class*=language-] .token.prolog,pre[class*=language-] .token.doctype,pre[class*=language-] .token.cdata{color:#5f6c79}::ng-deep code[class*=language-] .token.punctuation,pre[class*=language-] .token.punctuation{color:#5f6c79}::ng-deep code[class*=language-] .namespace,pre[class*=language-] .namespace{color:#10776e}::ng-deep code[class*=language-] .token.property,::ng-deep code[class*=language-] .token.tag,::ng-deep code[class*=language-] .token.boolean,::ng-deep code[class*=language-] .token.number,::ng-deep code[class*=language-] .token.constant,::ng-deep code[class*=language-] .token.symbol,::ng-deep code[class*=language-] .token.deleted,pre[class*=language-] .token.property,pre[class*=language-] .token.tag,pre[class*=language-] .token.boolean,pre[class*=language-] .token.number,pre[class*=language-] .token.constant,pre[class*=language-] .token.symbol,pre[class*=language-] .token.deleted{color:#c50028}::ng-deep code[class*=language-] .token.selector,::ng-deep code[class*=language-] .token.attr-name,::ng-deep code[class*=language-] .token.string,::ng-deep code[class*=language-] .token.char,::ng-deep code[class*=language-] .token.builtin,::ng-deep code[class*=language-] .token.inserted,pre[class*=language-] .token.selector,pre[class*=language-] .token.attr-name,pre[class*=language-] .token.string,pre[class*=language-] .token.char,pre[class*=language-] .token.builtin,pre[class*=language-] .token.inserted{color:#627932}::ng-deep code[class*=language-] .token.operator,::ng-deep code[class*=language-] .token.entity,::ng-deep code[class*=language-] .token.url,::ng-deep code[class*=language-] .language-css .token.string,::ng-deep code[class*=language-] .style .token.string,pre[class*=language-] .token.operator,pre[class*=language-] .token.entity,pre[class*=language-] .token.url,pre[class*=language-] .language-css .token.string,pre[class*=language-] .style .token.string{color:#996525}::ng-deep code[class*=language-] .token.atrule,::ng-deep code[class*=language-] .token.attr-value,::ng-deep code[class*=language-] .token.keyword,pre[class*=language-] .token.atrule,pre[class*=language-] .token.attr-value,pre[class*=language-] .token.keyword{color:#07a}::ng-deep code[class*=language-] .token.function,::ng-deep code[class*=language-] .token.class-name,pre[class*=language-] .token.function,pre[class*=language-] .token.class-name{color:#c50028}::ng-deep code[class*=language-] .token.regex,::ng-deep code[class*=language-] .token.important,::ng-deep code[class*=language-] .token.variable,pre[class*=language-] .token.regex,pre[class*=language-] .token.important,pre[class*=language-] .token.variable{color:#9a690f}::ng-deep code[class*=language-] .token.important,::ng-deep code[class*=language-] .token.bold,pre[class*=language-] .token.important,pre[class*=language-] .token.bold{font-weight:700}::ng-deep code[class*=language-] .token.italic,pre[class*=language-] .token.italic{font-style:italic}::ng-deep code[class*=language-] .token.entity,pre[class*=language-] .token.entity{cursor:help}pre[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,code[class*=language-] ::-moz-selection{text-shadow:none;background:#b3d4fc}pre[class*=language-]::selection,pre[class*=language-] ::selection,code[class*=language-]::selection,code[class*=language-] ::selection{text-shadow:none;background:#b3d4fc}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}.sky-code-input{display:none}.sky-code-output{border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;margin-top:0;padding:20px;background-color:#fff;overflow-x:auto;margin-bottom:20px}.sky-code-block-header{height:45px;border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-left:1px solid #cdcfd2;background-color:#fff;display:flex;justify-content:space-between;align-items:center;padding:5px 5px 5px 20px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.λ1, selector: "sky-copy-to-clipboard", inputs: ["ariaLabel", "ariaLabelledBy", "copyTarget", "buttonText", "buttonClickedText", "title"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }] }); }
|
|
100
100
|
}
|
|
101
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
101
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockComponent, decorators: [{
|
|
102
102
|
type: Component,
|
|
103
103
|
args: [{ selector: 'sky-code-block', template: "<div class=\"sky-code-block\">\n <div *ngIf=\"!hideHeader\" class=\"sky-code-block-header\">\n <div>\n <span *ngIf=\"fileName\" class=\"sky-emphasized sky-margin-inline-default\">\n {{ fileName }}\n </span>\n <span *ngIf=\"displayName\" class=\"sky-deemphasized\">\n {{ displayName }}\n </span>\n </div>\n <sky-copy-to-clipboard\n *ngIf=\"!hideCopyToClipboard\"\n [copyTarget]=\"skyCodeOutput\"\n buttonText=\"{{ 'sky_copy_to_clipboard_button' | skyLibResources }}\"\n buttonClickedText=\"{{\n 'sky_copy_to_clipboard_button_success' | skyLibResources\n }}\"\n >\n </sky-copy-to-clipboard>\n </div>\n <div #codeFromContent class=\"sky-code-input\">\n <ng-content></ng-content>\n </div>\n <div>\n <pre #skyCodeOutput class=\"sky-code-output\"><code\n [ngClass]=\"codeBlockClassName\"\n [innerHTML]=\"output\"></code></pre>\n </div>\n</div>\n", styles: ["::ng-deep code[class*=language-],pre[class*=language-]{color:#000;text-shadow:0 1px white;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}::ng-deep code[class*=language-] .token.comment,::ng-deep code[class*=language-] .token.prolog,::ng-deep code[class*=language-] .token.doctype,::ng-deep code[class*=language-] .token.cdata,pre[class*=language-] .token.comment,pre[class*=language-] .token.prolog,pre[class*=language-] .token.doctype,pre[class*=language-] .token.cdata{color:#5f6c79}::ng-deep code[class*=language-] .token.punctuation,pre[class*=language-] .token.punctuation{color:#5f6c79}::ng-deep code[class*=language-] .namespace,pre[class*=language-] .namespace{color:#10776e}::ng-deep code[class*=language-] .token.property,::ng-deep code[class*=language-] .token.tag,::ng-deep code[class*=language-] .token.boolean,::ng-deep code[class*=language-] .token.number,::ng-deep code[class*=language-] .token.constant,::ng-deep code[class*=language-] .token.symbol,::ng-deep code[class*=language-] .token.deleted,pre[class*=language-] .token.property,pre[class*=language-] .token.tag,pre[class*=language-] .token.boolean,pre[class*=language-] .token.number,pre[class*=language-] .token.constant,pre[class*=language-] .token.symbol,pre[class*=language-] .token.deleted{color:#c50028}::ng-deep code[class*=language-] .token.selector,::ng-deep code[class*=language-] .token.attr-name,::ng-deep code[class*=language-] .token.string,::ng-deep code[class*=language-] .token.char,::ng-deep code[class*=language-] .token.builtin,::ng-deep code[class*=language-] .token.inserted,pre[class*=language-] .token.selector,pre[class*=language-] .token.attr-name,pre[class*=language-] .token.string,pre[class*=language-] .token.char,pre[class*=language-] .token.builtin,pre[class*=language-] .token.inserted{color:#627932}::ng-deep code[class*=language-] .token.operator,::ng-deep code[class*=language-] .token.entity,::ng-deep code[class*=language-] .token.url,::ng-deep code[class*=language-] .language-css .token.string,::ng-deep code[class*=language-] .style .token.string,pre[class*=language-] .token.operator,pre[class*=language-] .token.entity,pre[class*=language-] .token.url,pre[class*=language-] .language-css .token.string,pre[class*=language-] .style .token.string{color:#996525}::ng-deep code[class*=language-] .token.atrule,::ng-deep code[class*=language-] .token.attr-value,::ng-deep code[class*=language-] .token.keyword,pre[class*=language-] .token.atrule,pre[class*=language-] .token.attr-value,pre[class*=language-] .token.keyword{color:#07a}::ng-deep code[class*=language-] .token.function,::ng-deep code[class*=language-] .token.class-name,pre[class*=language-] .token.function,pre[class*=language-] .token.class-name{color:#c50028}::ng-deep code[class*=language-] .token.regex,::ng-deep code[class*=language-] .token.important,::ng-deep code[class*=language-] .token.variable,pre[class*=language-] .token.regex,pre[class*=language-] .token.important,pre[class*=language-] .token.variable{color:#9a690f}::ng-deep code[class*=language-] .token.important,::ng-deep code[class*=language-] .token.bold,pre[class*=language-] .token.important,pre[class*=language-] .token.bold{font-weight:700}::ng-deep code[class*=language-] .token.italic,pre[class*=language-] .token.italic{font-style:italic}::ng-deep code[class*=language-] .token.entity,pre[class*=language-] .token.entity{cursor:help}pre[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,code[class*=language-] ::-moz-selection{text-shadow:none;background:#b3d4fc}pre[class*=language-]::selection,pre[class*=language-] ::selection,code[class*=language-]::selection,code[class*=language-] ::selection{text-shadow:none;background:#b3d4fc}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}.sky-code-input{display:none}.sky-code-output{border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;margin-top:0;padding:20px;background-color:#fff;overflow-x:auto;margin-bottom:20px}.sky-code-block-header{height:45px;border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-left:1px solid #cdcfd2;background-color:#fff;display:flex;justify-content:space-between;align-items:center;padding:5px 5px 5px 20px}\n"] }]
|
|
104
104
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.DomSanitizer }], propDecorators: { code: [{
|
|
@@ -5,11 +5,11 @@ import { SkyCodeBlockResourcesModule } from '../shared/sky-code-block-resources.
|
|
|
5
5
|
import { SkyCodeBlockComponent } from './code-block.component';
|
|
6
6
|
import * as i0 from "@angular/core";
|
|
7
7
|
export class SkyCodeBlockModule {
|
|
8
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
9
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
10
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
8
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
9
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockModule, declarations: [SkyCodeBlockComponent], imports: [CommonModule, SkyClipboardModule, SkyCodeBlockResourcesModule], exports: [SkyCodeBlockComponent] }); }
|
|
10
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockModule, imports: [CommonModule, SkyClipboardModule, SkyCodeBlockResourcesModule] }); }
|
|
11
11
|
}
|
|
12
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
12
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockModule, decorators: [{
|
|
13
13
|
type: NgModule,
|
|
14
14
|
args: [{
|
|
15
15
|
declarations: [SkyCodeBlockComponent],
|
|
@@ -25,9 +25,9 @@ export class SkyCodeBlockResourcesProvider {
|
|
|
25
25
|
* Import into any component library module that needs to use resource strings.
|
|
26
26
|
*/
|
|
27
27
|
export class SkyCodeBlockResourcesModule {
|
|
28
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
29
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
30
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
28
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
29
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockResourcesModule, exports: [SkyI18nModule] }); }
|
|
30
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockResourcesModule, providers: [
|
|
31
31
|
{
|
|
32
32
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
33
33
|
useClass: SkyCodeBlockResourcesProvider,
|
|
@@ -35,7 +35,7 @@ export class SkyCodeBlockResourcesModule {
|
|
|
35
35
|
},
|
|
36
36
|
], imports: [SkyI18nModule] }); }
|
|
37
37
|
}
|
|
38
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
38
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockResourcesModule, decorators: [{
|
|
39
39
|
type: NgModule,
|
|
40
40
|
args: [{
|
|
41
41
|
exports: [SkyI18nModule],
|
|
@@ -185,9 +185,9 @@ class SkyCodeBlockResourcesProvider {
|
|
|
185
185
|
* Import into any component library module that needs to use resource strings.
|
|
186
186
|
*/
|
|
187
187
|
class SkyCodeBlockResourcesModule {
|
|
188
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
189
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
190
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
188
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
189
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockResourcesModule, exports: [SkyI18nModule] }); }
|
|
190
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockResourcesModule, providers: [
|
|
191
191
|
{
|
|
192
192
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
193
193
|
useClass: SkyCodeBlockResourcesProvider,
|
|
@@ -195,7 +195,7 @@ class SkyCodeBlockResourcesModule {
|
|
|
195
195
|
},
|
|
196
196
|
], imports: [SkyI18nModule] }); }
|
|
197
197
|
}
|
|
198
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
198
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockResourcesModule, decorators: [{
|
|
199
199
|
type: NgModule,
|
|
200
200
|
args: [{
|
|
201
201
|
exports: [SkyI18nModule],
|
|
@@ -453,10 +453,10 @@ class SkyCodeBlockComponent {
|
|
|
453
453
|
this.#changeDetector.detectChanges();
|
|
454
454
|
}
|
|
455
455
|
}
|
|
456
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
457
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
456
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
457
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: SkyCodeBlockComponent, selector: "sky-code-block", inputs: { code: "code", fileName: "fileName", languageType: "languageType", hideCopyToClipboard: "hideCopyToClipboard", hideHeader: "hideHeader" }, viewQueries: [{ propertyName: "codeTemplateRef", first: true, predicate: ["codeFromContent"], descendants: true, read: ElementRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"sky-code-block\">\n <div *ngIf=\"!hideHeader\" class=\"sky-code-block-header\">\n <div>\n <span *ngIf=\"fileName\" class=\"sky-emphasized sky-margin-inline-default\">\n {{ fileName }}\n </span>\n <span *ngIf=\"displayName\" class=\"sky-deemphasized\">\n {{ displayName }}\n </span>\n </div>\n <sky-copy-to-clipboard\n *ngIf=\"!hideCopyToClipboard\"\n [copyTarget]=\"skyCodeOutput\"\n buttonText=\"{{ 'sky_copy_to_clipboard_button' | skyLibResources }}\"\n buttonClickedText=\"{{\n 'sky_copy_to_clipboard_button_success' | skyLibResources\n }}\"\n >\n </sky-copy-to-clipboard>\n </div>\n <div #codeFromContent class=\"sky-code-input\">\n <ng-content></ng-content>\n </div>\n <div>\n <pre #skyCodeOutput class=\"sky-code-output\"><code\n [ngClass]=\"codeBlockClassName\"\n [innerHTML]=\"output\"></code></pre>\n </div>\n</div>\n", styles: ["::ng-deep code[class*=language-],pre[class*=language-]{color:#000;text-shadow:0 1px white;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}::ng-deep code[class*=language-] .token.comment,::ng-deep code[class*=language-] .token.prolog,::ng-deep code[class*=language-] .token.doctype,::ng-deep code[class*=language-] .token.cdata,pre[class*=language-] .token.comment,pre[class*=language-] .token.prolog,pre[class*=language-] .token.doctype,pre[class*=language-] .token.cdata{color:#5f6c79}::ng-deep code[class*=language-] .token.punctuation,pre[class*=language-] .token.punctuation{color:#5f6c79}::ng-deep code[class*=language-] .namespace,pre[class*=language-] .namespace{color:#10776e}::ng-deep code[class*=language-] .token.property,::ng-deep code[class*=language-] .token.tag,::ng-deep code[class*=language-] .token.boolean,::ng-deep code[class*=language-] .token.number,::ng-deep code[class*=language-] .token.constant,::ng-deep code[class*=language-] .token.symbol,::ng-deep code[class*=language-] .token.deleted,pre[class*=language-] .token.property,pre[class*=language-] .token.tag,pre[class*=language-] .token.boolean,pre[class*=language-] .token.number,pre[class*=language-] .token.constant,pre[class*=language-] .token.symbol,pre[class*=language-] .token.deleted{color:#c50028}::ng-deep code[class*=language-] .token.selector,::ng-deep code[class*=language-] .token.attr-name,::ng-deep code[class*=language-] .token.string,::ng-deep code[class*=language-] .token.char,::ng-deep code[class*=language-] .token.builtin,::ng-deep code[class*=language-] .token.inserted,pre[class*=language-] .token.selector,pre[class*=language-] .token.attr-name,pre[class*=language-] .token.string,pre[class*=language-] .token.char,pre[class*=language-] .token.builtin,pre[class*=language-] .token.inserted{color:#627932}::ng-deep code[class*=language-] .token.operator,::ng-deep code[class*=language-] .token.entity,::ng-deep code[class*=language-] .token.url,::ng-deep code[class*=language-] .language-css .token.string,::ng-deep code[class*=language-] .style .token.string,pre[class*=language-] .token.operator,pre[class*=language-] .token.entity,pre[class*=language-] .token.url,pre[class*=language-] .language-css .token.string,pre[class*=language-] .style .token.string{color:#996525}::ng-deep code[class*=language-] .token.atrule,::ng-deep code[class*=language-] .token.attr-value,::ng-deep code[class*=language-] .token.keyword,pre[class*=language-] .token.atrule,pre[class*=language-] .token.attr-value,pre[class*=language-] .token.keyword{color:#07a}::ng-deep code[class*=language-] .token.function,::ng-deep code[class*=language-] .token.class-name,pre[class*=language-] .token.function,pre[class*=language-] .token.class-name{color:#c50028}::ng-deep code[class*=language-] .token.regex,::ng-deep code[class*=language-] .token.important,::ng-deep code[class*=language-] .token.variable,pre[class*=language-] .token.regex,pre[class*=language-] .token.important,pre[class*=language-] .token.variable{color:#9a690f}::ng-deep code[class*=language-] .token.important,::ng-deep code[class*=language-] .token.bold,pre[class*=language-] .token.important,pre[class*=language-] .token.bold{font-weight:700}::ng-deep code[class*=language-] .token.italic,pre[class*=language-] .token.italic{font-style:italic}::ng-deep code[class*=language-] .token.entity,pre[class*=language-] .token.entity{cursor:help}pre[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,code[class*=language-] ::-moz-selection{text-shadow:none;background:#b3d4fc}pre[class*=language-]::selection,pre[class*=language-] ::selection,code[class*=language-]::selection,code[class*=language-] ::selection{text-shadow:none;background:#b3d4fc}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}.sky-code-input{display:none}.sky-code-output{border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;margin-top:0;padding:20px;background-color:#fff;overflow-x:auto;margin-bottom:20px}.sky-code-block-header{height:45px;border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-left:1px solid #cdcfd2;background-color:#fff;display:flex;justify-content:space-between;align-items:center;padding:5px 5px 5px 20px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.λ1, selector: "sky-copy-to-clipboard", inputs: ["ariaLabel", "ariaLabelledBy", "copyTarget", "buttonText", "buttonClickedText", "title"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }] }); }
|
|
458
458
|
}
|
|
459
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
459
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockComponent, decorators: [{
|
|
460
460
|
type: Component,
|
|
461
461
|
args: [{ selector: 'sky-code-block', template: "<div class=\"sky-code-block\">\n <div *ngIf=\"!hideHeader\" class=\"sky-code-block-header\">\n <div>\n <span *ngIf=\"fileName\" class=\"sky-emphasized sky-margin-inline-default\">\n {{ fileName }}\n </span>\n <span *ngIf=\"displayName\" class=\"sky-deemphasized\">\n {{ displayName }}\n </span>\n </div>\n <sky-copy-to-clipboard\n *ngIf=\"!hideCopyToClipboard\"\n [copyTarget]=\"skyCodeOutput\"\n buttonText=\"{{ 'sky_copy_to_clipboard_button' | skyLibResources }}\"\n buttonClickedText=\"{{\n 'sky_copy_to_clipboard_button_success' | skyLibResources\n }}\"\n >\n </sky-copy-to-clipboard>\n </div>\n <div #codeFromContent class=\"sky-code-input\">\n <ng-content></ng-content>\n </div>\n <div>\n <pre #skyCodeOutput class=\"sky-code-output\"><code\n [ngClass]=\"codeBlockClassName\"\n [innerHTML]=\"output\"></code></pre>\n </div>\n</div>\n", styles: ["::ng-deep code[class*=language-],pre[class*=language-]{color:#000;text-shadow:0 1px white;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}::ng-deep code[class*=language-] .token.comment,::ng-deep code[class*=language-] .token.prolog,::ng-deep code[class*=language-] .token.doctype,::ng-deep code[class*=language-] .token.cdata,pre[class*=language-] .token.comment,pre[class*=language-] .token.prolog,pre[class*=language-] .token.doctype,pre[class*=language-] .token.cdata{color:#5f6c79}::ng-deep code[class*=language-] .token.punctuation,pre[class*=language-] .token.punctuation{color:#5f6c79}::ng-deep code[class*=language-] .namespace,pre[class*=language-] .namespace{color:#10776e}::ng-deep code[class*=language-] .token.property,::ng-deep code[class*=language-] .token.tag,::ng-deep code[class*=language-] .token.boolean,::ng-deep code[class*=language-] .token.number,::ng-deep code[class*=language-] .token.constant,::ng-deep code[class*=language-] .token.symbol,::ng-deep code[class*=language-] .token.deleted,pre[class*=language-] .token.property,pre[class*=language-] .token.tag,pre[class*=language-] .token.boolean,pre[class*=language-] .token.number,pre[class*=language-] .token.constant,pre[class*=language-] .token.symbol,pre[class*=language-] .token.deleted{color:#c50028}::ng-deep code[class*=language-] .token.selector,::ng-deep code[class*=language-] .token.attr-name,::ng-deep code[class*=language-] .token.string,::ng-deep code[class*=language-] .token.char,::ng-deep code[class*=language-] .token.builtin,::ng-deep code[class*=language-] .token.inserted,pre[class*=language-] .token.selector,pre[class*=language-] .token.attr-name,pre[class*=language-] .token.string,pre[class*=language-] .token.char,pre[class*=language-] .token.builtin,pre[class*=language-] .token.inserted{color:#627932}::ng-deep code[class*=language-] .token.operator,::ng-deep code[class*=language-] .token.entity,::ng-deep code[class*=language-] .token.url,::ng-deep code[class*=language-] .language-css .token.string,::ng-deep code[class*=language-] .style .token.string,pre[class*=language-] .token.operator,pre[class*=language-] .token.entity,pre[class*=language-] .token.url,pre[class*=language-] .language-css .token.string,pre[class*=language-] .style .token.string{color:#996525}::ng-deep code[class*=language-] .token.atrule,::ng-deep code[class*=language-] .token.attr-value,::ng-deep code[class*=language-] .token.keyword,pre[class*=language-] .token.atrule,pre[class*=language-] .token.attr-value,pre[class*=language-] .token.keyword{color:#07a}::ng-deep code[class*=language-] .token.function,::ng-deep code[class*=language-] .token.class-name,pre[class*=language-] .token.function,pre[class*=language-] .token.class-name{color:#c50028}::ng-deep code[class*=language-] .token.regex,::ng-deep code[class*=language-] .token.important,::ng-deep code[class*=language-] .token.variable,pre[class*=language-] .token.regex,pre[class*=language-] .token.important,pre[class*=language-] .token.variable{color:#9a690f}::ng-deep code[class*=language-] .token.important,::ng-deep code[class*=language-] .token.bold,pre[class*=language-] .token.important,pre[class*=language-] .token.bold{font-weight:700}::ng-deep code[class*=language-] .token.italic,pre[class*=language-] .token.italic{font-style:italic}::ng-deep code[class*=language-] .token.entity,pre[class*=language-] .token.entity{cursor:help}pre[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,code[class*=language-] ::-moz-selection{text-shadow:none;background:#b3d4fc}pre[class*=language-]::selection,pre[class*=language-] ::selection,code[class*=language-]::selection,code[class*=language-] ::selection{text-shadow:none;background:#b3d4fc}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}.sky-code-input{display:none}.sky-code-output{border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;margin-top:0;padding:20px;background-color:#fff;overflow-x:auto;margin-bottom:20px}.sky-code-block-header{height:45px;border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-left:1px solid #cdcfd2;background-color:#fff;display:flex;justify-content:space-between;align-items:center;padding:5px 5px 5px 20px}\n"] }]
|
|
462
462
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.DomSanitizer }], propDecorators: { code: [{
|
|
@@ -475,11 +475,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
|
|
|
475
475
|
}] } });
|
|
476
476
|
|
|
477
477
|
class SkyCodeBlockModule {
|
|
478
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
479
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
480
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
478
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
479
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockModule, declarations: [SkyCodeBlockComponent], imports: [CommonModule, SkyClipboardModule, SkyCodeBlockResourcesModule], exports: [SkyCodeBlockComponent] }); }
|
|
480
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockModule, imports: [CommonModule, SkyClipboardModule, SkyCodeBlockResourcesModule] }); }
|
|
481
481
|
}
|
|
482
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
482
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeBlockModule, decorators: [{
|
|
483
483
|
type: NgModule,
|
|
484
484
|
args: [{
|
|
485
485
|
declarations: [SkyCodeBlockComponent],
|
|
@@ -489,20 +489,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
|
|
|
489
489
|
}] });
|
|
490
490
|
|
|
491
491
|
class SkyCodeComponent {
|
|
492
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
493
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
492
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
493
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: SkyCodeComponent, selector: "sky-code", ngImport: i0, template: "<code class=\"sky-code\"><ng-content></ng-content></code>\n", styles: [".sky-code{border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;overflow-wrap:break-word;font-family:Menlo,Monaco,Consolas,Courier New,monospace;font-size:90%;color:#d1282c;padding:0 4px;background-color:#f1eef6}.sky-code ::ng-deep a{color:#d93a3d;text-decoration:underline}::ng-deep a .sky-code{text-decoration:underline}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
494
494
|
}
|
|
495
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
495
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeComponent, decorators: [{
|
|
496
496
|
type: Component,
|
|
497
497
|
args: [{ selector: 'sky-code', changeDetection: ChangeDetectionStrategy.OnPush, template: "<code class=\"sky-code\"><ng-content></ng-content></code>\n", styles: [".sky-code{border-top:1px solid #cdcfd2;border-right:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;overflow-wrap:break-word;font-family:Menlo,Monaco,Consolas,Courier New,monospace;font-size:90%;color:#d1282c;padding:0 4px;background-color:#f1eef6}.sky-code ::ng-deep a{color:#d93a3d;text-decoration:underline}::ng-deep a .sky-code{text-decoration:underline}\n"] }]
|
|
498
498
|
}] });
|
|
499
499
|
|
|
500
500
|
class SkyCodeModule {
|
|
501
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
502
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
503
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
501
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
502
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeModule, declarations: [SkyCodeComponent], imports: [CommonModule], exports: [SkyCodeComponent] }); }
|
|
503
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeModule, imports: [CommonModule] }); }
|
|
504
504
|
}
|
|
505
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
505
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SkyCodeModule, decorators: [{
|
|
506
506
|
type: NgModule,
|
|
507
507
|
args: [{
|
|
508
508
|
declarations: [SkyCodeComponent],
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blackbaud/skyux-lib-code-block",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "11.0.0-alpha.1",
|
|
4
4
|
"author": "Blackbaud, Inc.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"blackbaud",
|
|
@@ -17,15 +17,15 @@
|
|
|
17
17
|
},
|
|
18
18
|
"homepage": "https://github.com/blackbaud/stache#readme",
|
|
19
19
|
"peerDependencies": {
|
|
20
|
-
"@angular/common": "^
|
|
21
|
-
"@angular/core": "^
|
|
22
|
-
"@angular/platform-browser": "^
|
|
23
|
-
"@blackbaud/skyux-lib-clipboard": "
|
|
24
|
-
"@skyux/i18n": "^
|
|
20
|
+
"@angular/common": "^18.1.2",
|
|
21
|
+
"@angular/core": "^18.1.2",
|
|
22
|
+
"@angular/platform-browser": "^18.1.2",
|
|
23
|
+
"@blackbaud/skyux-lib-clipboard": "11.0.0-alpha.1",
|
|
24
|
+
"@skyux/i18n": "^11.0.0-alpha.6"
|
|
25
25
|
},
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"prismjs": "1.29.0",
|
|
28
|
-
"tslib": "^2.6.
|
|
28
|
+
"tslib": "^2.6.3"
|
|
29
29
|
},
|
|
30
30
|
"module": "fesm2022/blackbaud-skyux-lib-code-block.mjs",
|
|
31
31
|
"typings": "index.d.ts",
|