@semantic-components/code 0.63.0 → 0.64.0

package/esm2022/lib/components/code-editor/code-editor-header.js

@@ -0,0 +1,27 @@
+import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation, } from '@angular/core';
+import { cn } from '@semantic-components/ui';
+import * as i0 from "@angular/core";
+export class ScCodeEditorHeader {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('flex items-center justify-between border-b border-border bg-background/50 px-3 py-2', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeEditorHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.4", type: ScCodeEditorHeader, isStandalone: true, selector: "div[sc-code-editor-header]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "code-editor-header" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    <ng-content />
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeEditorHeader, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'div[sc-code-editor-header]',
+                    template: `
+    <ng-content />
+  `,
+                    host: {
+                        'data-slot': 'code-editor-header',
+                        '[class]': 'class()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=code-editor-header.js.map

package/esm2022/lib/components/code-editor/code-editor-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-editor-header.js","sourceRoot":"","sources":["../../../../../../../libs/code/src/lib/components/code-editor/code-editor-header.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;;AAc7C,MAAM,OAAO,kBAAkB;IACpB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,qFAAqF,EACrF,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGARS,kBAAkB;2FAAlB,kBAAkB,qUAVnB;;GAET;;2FAQU,kBAAkB;kBAZ9B,SAAS;mBAAC;oBACT,QAAQ,EAAE,4BAA4B;oBACtC,QAAQ,EAAE;;GAET;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,oBAAoB;wBACjC,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '@semantic-components/ui';\n\n@Component({\n  selector: 'div[sc-code-editor-header]',\n  template: `\n    <ng-content />\n  `,\n  host: {\n    'data-slot': 'code-editor-header',\n    '[class]': 'class()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScCodeEditorHeader {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn(\n      'flex items-center justify-between border-b border-border bg-background/50 px-3 py-2',\n      this.classInput(),\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/code-editor/code-editor-label.js

@@ -0,0 +1,27 @@
+import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation, } from '@angular/core';
+import { cn } from '@semantic-components/ui';
+import * as i0 from "@angular/core";
+export class ScCodeEditorLabel {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('text-xs font-medium text-muted-foreground', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeEditorLabel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.4", type: ScCodeEditorLabel, isStandalone: true, selector: "span[sc-code-editor-label]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "code-editor-label" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    <ng-content />
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeEditorLabel, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'span[sc-code-editor-label]',
+                    template: `
+    <ng-content />
+  `,
+                    host: {
+                        'data-slot': 'code-editor-label',
+                        '[class]': 'class()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=code-editor-label.js.map

package/esm2022/lib/components/code-editor/code-editor-label.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-editor-label.js","sourceRoot":"","sources":["../../../../../../../libs/code/src/lib/components/code-editor/code-editor-label.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;;AAc7C,MAAM,OAAO,iBAAiB;IACnB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CAAC,2CAA2C,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,iDACnE,CAAC;uGALS,iBAAiB;2FAAjB,iBAAiB,oUAVlB;;GAET;;2FAQU,iBAAiB;kBAZ7B,SAAS;mBAAC;oBACT,QAAQ,EAAE,4BAA4B;oBACtC,QAAQ,EAAE;;GAET;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,mBAAmB;wBAChC,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '@semantic-components/ui';\n\n@Component({\n  selector: 'span[sc-code-editor-label]',\n  template: `\n    <ng-content />\n  `,\n  host: {\n    'data-slot': 'code-editor-label',\n    '[class]': 'class()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScCodeEditorLabel {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn('text-xs font-medium text-muted-foreground', this.classInput()),\n  );\n}\n"]}

package/esm2022/lib/components/code-editor/code-editor.js

@@ -0,0 +1,27 @@
+import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation, } from '@angular/core';
+import { cn } from '@semantic-components/ui';
+import * as i0 from "@angular/core";
+export class ScCodeEditor {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('overflow-hidden rounded-lg border border-border bg-muted focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeEditor, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.4", type: ScCodeEditor, isStandalone: true, selector: "div[sc-code-editor]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "code-editor" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    <ng-content />
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeEditor, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'div[sc-code-editor]',
+                    template: `
+    <ng-content />
+  `,
+                    host: {
+                        'data-slot': 'code-editor',
+                        '[class]': 'class()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=code-editor.js.map

package/esm2022/lib/components/code-editor/code-editor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-editor.js","sourceRoot":"","sources":["../../../../../../../libs/code/src/lib/components/code-editor/code-editor.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;;AAc7C,MAAM,OAAO,YAAY;IACd,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,gIAAgI,EAChI,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGARS,YAAY;2FAAZ,YAAY,uTAVb;;GAET;;2FAQU,YAAY;kBAZxB,SAAS;mBAAC;oBACT,QAAQ,EAAE,qBAAqB;oBAC/B,QAAQ,EAAE;;GAET;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,aAAa;wBAC1B,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '@semantic-components/ui';\n\n@Component({\n  selector: 'div[sc-code-editor]',\n  template: `\n    <ng-content />\n  `,\n  host: {\n    'data-slot': 'code-editor',\n    '[class]': 'class()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScCodeEditor {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn(\n      'overflow-hidden rounded-lg border border-border bg-muted focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2',\n      this.classInput(),\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/code-editor/index.js

@@ -0,0 +1,7 @@
+export { ScCodeEditor } from './code-editor';
+export { ScCodeEditorHeader } from './code-editor-header';
+export { ScCodeEditorLabel } from './code-editor-label';
+export { ScCodeEditorFooter } from './code-editor-footer';
+export { ScCodeEditorContent, detectLanguage } from './code-editor-content';
+export { ScCodeEditorCopyButton } from './code-editor-copy-button';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/code-editor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/code/src/lib/components/code-editor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAC5E,OAAO,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC","sourcesContent":["export { ScCodeEditor } from './code-editor';\nexport { ScCodeEditorHeader } from './code-editor-header';\nexport { ScCodeEditorLabel } from './code-editor-label';\nexport { ScCodeEditorFooter } from './code-editor-footer';\nexport { ScCodeEditorContent, detectLanguage } from './code-editor-content';\nexport { ScCodeEditorCopyButton } from './code-editor-copy-button';\nexport type { ScCodeEditorLanguage } from './code-editor-content';\n"]}

package/esm2022/lib/components/code-viewer/code-viewer-content.js

@@ -0,0 +1,70 @@
+import { ChangeDetectionStrategy, Component, computed, effect, inject, input, signal, ViewEncapsulation, } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { codeToHtml } from 'shiki';
+import { cn } from '@semantic-components/ui';
+import * as i0 from "@angular/core";
+export class ScCodeViewerContent {
+    code = input.required(...(ngDevMode ? [{ debugName: "code" }] : []));
+    language = input('plaintext', ...(ngDevMode ? [{ debugName: "language" }] : []));
+    showLineNumbers = input(false, ...(ngDevMode ? [{ debugName: "showLineNumbers" }] : []));
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    sanitizer = inject(DomSanitizer);
+    highlightedHtml = signal(null, ...(ngDevMode ? [{ debugName: "highlightedHtml" }] : []));
+    wrapperClass = computed(() => cn('overflow-auto', this.classInput()), ...(ngDevMode ? [{ debugName: "wrapperClass" }] : []));
+    contentClass = computed(() => cn(this.showLineNumbers() && 'shiki-line-numbers'), ...(ngDevMode ? [{ debugName: "contentClass" }] : []));
+    constructor() {
+        effect(() => {
+            const code = this.code();
+            const lang = this.language();
+            this.highlight(code, lang);
+        });
+    }
+    async highlight(code, lang) {
+        try {
+            const html = await codeToHtml(code, {
+                lang,
+                themes: {
+                    light: 'github-light',
+                    dark: 'github-dark',
+                },
+                defaultColor: false,
+            });
+            this.highlightedHtml.set(this.sanitizer.bypassSecurityTrustHtml(html));
+        }
+        catch {
+            this.highlightedHtml.set(null);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeViewerContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.4", type: ScCodeViewerContent, isStandalone: true, selector: "div[sc-code-viewer-content]", inputs: { code: { classPropertyName: "code", publicName: "code", isSignal: true, isRequired: true, transformFunction: null }, language: { classPropertyName: "language", publicName: "language", isSignal: true, isRequired: false, transformFunction: null }, showLineNumbers: { classPropertyName: "showLineNumbers", publicName: "showLineNumbers", isSignal: true, isRequired: false, transformFunction: null }, classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "code-viewer-content" }, properties: { "class": "wrapperClass()" } }, ngImport: i0, template: `
+    @if (highlightedHtml()) {
+      <div [class]="contentClass()" [innerHTML]="highlightedHtml()"></div>
+    } @else {
+      <pre
+        class="m-0 p-4 text-sm leading-relaxed font-mono text-foreground"
+      ><code>{{ code() }}</code></pre>
+    }
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeViewerContent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'div[sc-code-viewer-content]',
+                    template: `
+    @if (highlightedHtml()) {
+      <div [class]="contentClass()" [innerHTML]="highlightedHtml()"></div>
+    } @else {
+      <pre
+        class="m-0 p-4 text-sm leading-relaxed font-mono text-foreground"
+      ><code>{{ code() }}</code></pre>
+    }
+  `,
+                    host: {
+                        'data-slot': 'code-viewer-content',
+                        '[class]': 'wrapperClass()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: () => [], propDecorators: { code: [{ type: i0.Input, args: [{ isSignal: true, alias: "code", required: true }] }], language: [{ type: i0.Input, args: [{ isSignal: true, alias: "language", required: false }] }], showLineNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLineNumbers", required: false }] }], classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=code-viewer-content.js.map

package/esm2022/lib/components/code-viewer/code-viewer-content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-viewer-content.js","sourceRoot":"","sources":["../../../../../../../libs/code/src/lib/components/code-viewer/code-viewer-content.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,MAAM,EACN,KAAK,EACL,MAAM,EACN,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,YAAY,EAAY,MAAM,2BAA2B,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;;AAsC7C,MAAM,OAAO,mBAAmB;IACrB,IAAI,GAAG,KAAK,CAAC,QAAQ,+CAAU,CAAC;IAChC,QAAQ,GAAG,KAAK,CAAuB,WAAW,oDAAC,CAAC;IACpD,eAAe,GAAG,KAAK,CAAC,KAAK,2DAAC,CAAC;IAC/B,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAE3C,SAAS,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC;IAE/B,eAAe,GAAG,MAAM,CAAkB,IAAI,2DAAC,CAAC;IAEhD,YAAY,GAAG,QAAQ,CAAC,GAAG,EAAE,CAC9C,EAAE,CAAC,eAAe,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,wDACvC,CAAC;IAEiB,YAAY,GAAG,QAAQ,CAAC,GAAG,EAAE,CAC9C,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,oBAAoB,CAAC,wDACnD,CAAC;IAEF;QACE,MAAM,CAAC,GAAG,EAAE;YACV,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC;YACzB,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;YAE7B,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;QAC7B,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,KAAK,CAAC,SAAS,CACrB,IAAY,EACZ,IAA0B;QAE1B,IAAI,CAAC;YACH,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,IAAI,EAAE;gBAClC,IAAI;gBACJ,MAAM,EAAE;oBACN,KAAK,EAAE,cAAc;oBACrB,IAAI,EAAE,aAAa;iBACpB;gBACD,YAAY,EAAE,KAAK;aACpB,CAAC,CAAC;YACH,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,uBAAuB,CAAC,IAAI,CAAC,CAAC,CAAC;QACzE,CAAC;QAAC,MAAM,CAAC;YACP,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC;IACH,CAAC;uGA5CU,mBAAmB;2FAAnB,mBAAmB,ytBAhBpB;;;;;;;;GAQT;;2FAQU,mBAAmB;kBAlB/B,SAAS;mBAAC;oBACT,QAAQ,EAAE,6BAA6B;oBACvC,QAAQ,EAAE;;;;;;;;GAQT;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,qBAAqB;wBAClC,SAAS,EAAE,gBAAgB;qBAC5B;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  effect,\n  inject,\n  input,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\nimport { codeToHtml } from 'shiki';\nimport { cn } from '@semantic-components/ui';\n\nexport type ScCodeViewerLanguage =\n  | 'angular-ts'\n  | 'typescript'\n  | 'javascript'\n  | 'html'\n  | 'css'\n  | 'json'\n  | 'python'\n  | 'bash'\n  | 'shell'\n  | 'markdown'\n  | 'yaml'\n  | 'sql'\n  | 'go'\n  | 'rust'\n  | 'java'\n  | 'plaintext';\n\n@Component({\n  selector: 'div[sc-code-viewer-content]',\n  template: `\n    @if (highlightedHtml()) {\n      <div [class]=\"contentClass()\" [innerHTML]=\"highlightedHtml()\"></div>\n    } @else {\n      <pre\n        class=\"m-0 p-4 text-sm leading-relaxed font-mono text-foreground\"\n      ><code>{{ code() }}</code></pre>\n    }\n  `,\n  host: {\n    'data-slot': 'code-viewer-content',\n    '[class]': 'wrapperClass()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScCodeViewerContent {\n  readonly code = input.required<string>();\n  readonly language = input<ScCodeViewerLanguage>('plaintext');\n  readonly showLineNumbers = input(false);\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  private readonly sanitizer = inject(DomSanitizer);\n\n  protected readonly highlightedHtml = signal<SafeHtml | null>(null);\n\n  protected readonly wrapperClass = computed(() =>\n    cn('overflow-auto', this.classInput()),\n  );\n\n  protected readonly contentClass = computed(() =>\n    cn(this.showLineNumbers() && 'shiki-line-numbers'),\n  );\n\n  constructor() {\n    effect(() => {\n      const code = this.code();\n      const lang = this.language();\n\n      this.highlight(code, lang);\n    });\n  }\n\n  private async highlight(\n    code: string,\n    lang: ScCodeViewerLanguage,\n  ): Promise<void> {\n    try {\n      const html = await codeToHtml(code, {\n        lang,\n        themes: {\n          light: 'github-light',\n          dark: 'github-dark',\n        },\n        defaultColor: false,\n      });\n      this.highlightedHtml.set(this.sanitizer.bypassSecurityTrustHtml(html));\n    } catch {\n      this.highlightedHtml.set(null);\n    }\n  }\n}\n"]}

package/esm2022/lib/components/code-viewer/code-viewer-header.js

@@ -0,0 +1,27 @@
+import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation, } from '@angular/core';
+import { cn } from '@semantic-components/ui';
+import * as i0 from "@angular/core";
+export class ScCodeViewerHeader {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('flex items-center justify-between border-b border-border px-4 py-2', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeViewerHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.4", type: ScCodeViewerHeader, isStandalone: true, selector: "div[sc-code-viewer-header]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "code-viewer-header" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    <ng-content />
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeViewerHeader, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'div[sc-code-viewer-header]',
+                    template: `
+    <ng-content />
+  `,
+                    host: {
+                        'data-slot': 'code-viewer-header',
+                        '[class]': 'class()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=code-viewer-header.js.map

package/esm2022/lib/components/code-viewer/code-viewer-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-viewer-header.js","sourceRoot":"","sources":["../../../../../../../libs/code/src/lib/components/code-viewer/code-viewer-header.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;;AAc7C,MAAM,OAAO,kBAAkB;IACpB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,oEAAoE,EACpE,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGARS,kBAAkB;2FAAlB,kBAAkB,qUAVnB;;GAET;;2FAQU,kBAAkB;kBAZ9B,SAAS;mBAAC;oBACT,QAAQ,EAAE,4BAA4B;oBACtC,QAAQ,EAAE;;GAET;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,oBAAoB;wBACjC,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '@semantic-components/ui';\n\n@Component({\n  selector: 'div[sc-code-viewer-header]',\n  template: `\n    <ng-content />\n  `,\n  host: {\n    'data-slot': 'code-viewer-header',\n    '[class]': 'class()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScCodeViewerHeader {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn(\n      'flex items-center justify-between border-b border-border px-4 py-2',\n      this.classInput(),\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/code-viewer/code-viewer-label.js

@@ -0,0 +1,27 @@
+import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation, } from '@angular/core';
+import { cn } from '@semantic-components/ui';
+import * as i0 from "@angular/core";
+export class ScCodeViewerLabel {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('text-xs font-medium text-muted-foreground', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeViewerLabel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.4", type: ScCodeViewerLabel, isStandalone: true, selector: "span[sc-code-viewer-label]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "code-viewer-label" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    <ng-content />
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeViewerLabel, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'span[sc-code-viewer-label]',
+                    template: `
+    <ng-content />
+  `,
+                    host: {
+                        'data-slot': 'code-viewer-label',
+                        '[class]': 'class()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=code-viewer-label.js.map

package/esm2022/lib/components/code-viewer/code-viewer-label.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-viewer-label.js","sourceRoot":"","sources":["../../../../../../../libs/code/src/lib/components/code-viewer/code-viewer-label.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;;AAc7C,MAAM,OAAO,iBAAiB;IACnB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CAAC,2CAA2C,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,iDACnE,CAAC;uGALS,iBAAiB;2FAAjB,iBAAiB,oUAVlB;;GAET;;2FAQU,iBAAiB;kBAZ7B,SAAS;mBAAC;oBACT,QAAQ,EAAE,4BAA4B;oBACtC,QAAQ,EAAE;;GAET;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,mBAAmB;wBAChC,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '@semantic-components/ui';\n\n@Component({\n  selector: 'span[sc-code-viewer-label]',\n  template: `\n    <ng-content />\n  `,\n  host: {\n    'data-slot': 'code-viewer-label',\n    '[class]': 'class()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScCodeViewerLabel {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn('text-xs font-medium text-muted-foreground', this.classInput()),\n  );\n}\n"]}

package/esm2022/lib/components/code-viewer/code-viewer.js

@@ -0,0 +1,27 @@
+import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation, } from '@angular/core';
+import { cn } from '@semantic-components/ui';
+import * as i0 from "@angular/core";
+export class ScCodeViewer {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('overflow-hidden rounded-lg border border-border', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeViewer, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.4", type: ScCodeViewer, isStandalone: true, selector: "div[sc-code-viewer]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "code-viewer" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    <ng-content />
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScCodeViewer, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'div[sc-code-viewer]',
+                    template: `
+    <ng-content />
+  `,
+                    host: {
+                        'data-slot': 'code-viewer',
+                        '[class]': 'class()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=code-viewer.js.map

package/esm2022/lib/components/code-viewer/code-viewer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-viewer.js","sourceRoot":"","sources":["../../../../../../../libs/code/src/lib/components/code-viewer/code-viewer.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;;AAc7C,MAAM,OAAO,YAAY;IACd,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CAAC,iDAAiD,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,iDACzE,CAAC;uGALS,YAAY;2FAAZ,YAAY,uTAVb;;GAET;;2FAQU,YAAY;kBAZxB,SAAS;mBAAC;oBACT,QAAQ,EAAE,qBAAqB;oBAC/B,QAAQ,EAAE;;GAET;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,aAAa;wBAC1B,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '@semantic-components/ui';\n\n@Component({\n  selector: 'div[sc-code-viewer]',\n  template: `\n    <ng-content />\n  `,\n  host: {\n    'data-slot': 'code-viewer',\n    '[class]': 'class()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScCodeViewer {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn('overflow-hidden rounded-lg border border-border', this.classInput()),\n  );\n}\n"]}

package/esm2022/lib/components/code-viewer/index.js

@@ -0,0 +1,5 @@
+export { ScCodeViewer } from './code-viewer';
+export { ScCodeViewerHeader } from './code-viewer-header';
+export { ScCodeViewerLabel } from './code-viewer-label';
+export { ScCodeViewerContent } from './code-viewer-content';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/code-viewer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/code/src/lib/components/code-viewer/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC","sourcesContent":["export type { ScCodeViewerLanguage } from './code-viewer-content';\nexport { ScCodeViewer } from './code-viewer';\nexport { ScCodeViewerHeader } from './code-viewer-header';\nexport { ScCodeViewerLabel } from './code-viewer-label';\nexport { ScCodeViewerContent } from './code-viewer-content';\n"]}

package/esm2022/lib/components/index.js

@@ -0,0 +1,3 @@
+export * from './code-editor';
+export * from './code-viewer';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../libs/code/src/lib/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC","sourcesContent":["export * from './code-editor';\nexport * from './code-viewer';\n"]}

package/esm2022/semantic-components-code.js

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=semantic-components-code.js.map

package/esm2022/semantic-components-code.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"semantic-components-code.js","sourceRoot":"","sources":["../../../../libs/code/src/semantic-components-code.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,cAAc,SAAS,CAAC","sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"]}

package/lib/components/code-editor/code-editor-content.d.ts

@@ -0,0 +1,57 @@
+import { SafeHtml } from '@angular/platform-browser';
+import * as i0 from "@angular/core";
+export type ScCodeEditorLanguage = 'angular-ts' | 'typescript' | 'javascript' | 'html' | 'css' | 'json' | 'python' | 'bash' | 'shell' | 'markdown' | 'yaml' | 'sql' | 'go' | 'rust' | 'java' | 'plaintext';
+export declare function detectLanguage(code: string, filename?: string): ScCodeEditorLanguage;
+export declare class ScCodeEditorContent {
+    readonly value: import("@angular/core").ModelSignal<string>;
+    readonly language: import("@angular/core").InputSignal<ScCodeEditorLanguage>;
+    readonly filename: import("@angular/core").InputSignal<string>;
+    readonly placeholder: import("@angular/core").InputSignal<string>;
+    readonly disabled: import("@angular/core").InputSignal<boolean>;
+    readonly readonly: import("@angular/core").InputSignal<boolean>;
+    readonly showLineNumbers: import("@angular/core").InputSignal<boolean>;
+    readonly tabSize: import("@angular/core").InputSignal<number>;
+    readonly insertSpaces: import("@angular/core").InputSignal<boolean>;
+    readonly wordWrap: import("@angular/core").InputSignal<boolean>;
+    readonly autoDetectLanguage: import("@angular/core").InputSignal<boolean>;
+    readonly ariaLabel: import("@angular/core").InputSignal<string>;
+    readonly ariaDescribedby: import("@angular/core").InputSignal<string>;
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    readonly valueChange: import("@angular/core").OutputEmitterRef<string>;
+    readonly languageDetected: import("@angular/core").OutputEmitterRef<ScCodeEditorLanguage>;
+    readonly cursorChange: import("@angular/core").OutputEmitterRef<{
+        line: number;
+        column: number;
+    }>;
+    readonly activeLine: import("@angular/core").WritableSignal<number>;
+    readonly activeColumn: import("@angular/core").WritableSignal<number>;
+    readonly isFocused: import("@angular/core").WritableSignal<boolean>;
+    protected readonly highlightedHtml: import("@angular/core").WritableSignal<SafeHtml | null>;
+    private scrollTop;
+    private scrollLeft;
+    private readonly sanitizer;
+    private readonly textarea;
+    protected readonly lines: import("@angular/core").Signal<string[]>;
+    protected readonly lineNumberWidth: import("@angular/core").Signal<number>;
+    protected readonly displayCode: import("@angular/core").Signal<string>;
+    protected readonly effectiveLanguage: import("@angular/core").Signal<ScCodeEditorLanguage>;
+    protected readonly wrapperClass: import("@angular/core").Signal<string>;
+    protected readonly textareaClass: import("@angular/core").Signal<string>;
+    protected readonly textareaStyle: import("@angular/core").Signal<{
+        whiteSpace: string;
+        wordBreak: string;
+        overflowWrap: string;
+    }>;
+    constructor();
+    private highlight;
+    focusTextarea(): void;
+    protected onInput(event: Event): void;
+    protected onKeydown(event: KeyboardEvent): void;
+    protected onScroll(event: Event): void;
+    protected onFocus(): void;
+    protected onBlur(): void;
+    protected updateActiveLine(event: Event): void;
+    private updateCursorPosition;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeEditorContent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeEditorContent, "div[sc-code-editor-content]", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "language": { "alias": "language"; "required": false; "isSignal": true; }; "filename": { "alias": "filename"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "showLineNumbers": { "alias": "showLineNumbers"; "required": false; "isSignal": true; }; "tabSize": { "alias": "tabSize"; "required": false; "isSignal": true; }; "insertSpaces": { "alias": "insertSpaces"; "required": false; "isSignal": true; }; "wordWrap": { "alias": "wordWrap"; "required": false; "isSignal": true; }; "autoDetectLanguage": { "alias": "autoDetectLanguage"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; "isSignal": true; }; "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "valueChange": "valueChange"; "languageDetected": "languageDetected"; "cursorChange": "cursorChange"; }, never, never, true, never>;
+}

package/lib/components/code-editor/code-editor-copy-button.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+export declare class ScCodeEditorCopyButton {
+    readonly code: import("@angular/core").InputSignal<string>;
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    readonly copied: import("@angular/core").WritableSignal<boolean>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    protected readonly ariaLabel: import("@angular/core").Signal<"Copied!" | "Copy code">;
+    protected copyCode(event: Event): Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeEditorCopyButton, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeEditorCopyButton, "button[sc-code-editor-copy-button]", never, { "code": { "alias": "code"; "required": true; "isSignal": true; }; "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/lib/components/code-editor/code-editor-footer.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class ScCodeEditorFooter {
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeEditorFooter, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeEditorFooter, "div[sc-code-editor-footer]", never, { "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/lib/components/code-editor/code-editor-header.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class ScCodeEditorHeader {
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeEditorHeader, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeEditorHeader, "div[sc-code-editor-header]", never, { "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/lib/components/code-editor/code-editor-label.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class ScCodeEditorLabel {
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeEditorLabel, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeEditorLabel, "span[sc-code-editor-label]", never, { "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/lib/components/code-editor/code-editor.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class ScCodeEditor {
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeEditor, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeEditor, "div[sc-code-editor]", never, { "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/lib/components/code-viewer/code-viewer-content.d.ts

@@ -0,0 +1,17 @@
+import { SafeHtml } from '@angular/platform-browser';
+import * as i0 from "@angular/core";
+export type ScCodeViewerLanguage = 'angular-ts' | 'typescript' | 'javascript' | 'html' | 'css' | 'json' | 'python' | 'bash' | 'shell' | 'markdown' | 'yaml' | 'sql' | 'go' | 'rust' | 'java' | 'plaintext';
+export declare class ScCodeViewerContent {
+    readonly code: import("@angular/core").InputSignal<string>;
+    readonly language: import("@angular/core").InputSignal<ScCodeViewerLanguage>;
+    readonly showLineNumbers: import("@angular/core").InputSignal<boolean>;
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    private readonly sanitizer;
+    protected readonly highlightedHtml: import("@angular/core").WritableSignal<SafeHtml | null>;
+    protected readonly wrapperClass: import("@angular/core").Signal<string>;
+    protected readonly contentClass: import("@angular/core").Signal<string>;
+    constructor();
+    private highlight;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeViewerContent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeViewerContent, "div[sc-code-viewer-content]", never, { "code": { "alias": "code"; "required": true; "isSignal": true; }; "language": { "alias": "language"; "required": false; "isSignal": true; }; "showLineNumbers": { "alias": "showLineNumbers"; "required": false; "isSignal": true; }; "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/lib/components/code-viewer/code-viewer-header.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class ScCodeViewerHeader {
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeViewerHeader, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeViewerHeader, "div[sc-code-viewer-header]", never, { "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/lib/components/code-viewer/code-viewer-label.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class ScCodeViewerLabel {
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeViewerLabel, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeViewerLabel, "span[sc-code-viewer-label]", never, { "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/lib/components/code-viewer/code-viewer.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class ScCodeViewer {
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScCodeViewer, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCodeViewer, "div[sc-code-viewer]", never, { "classInput": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@semantic-components/code",
-  "version": "0.63.0",
+  "version": "0.64.0",
   "private": false,
   "publishConfig": {
     "access": "public"
@@ -16,12 +16,24 @@
     "@angular/core": ">=21.1.0",
     "@angular/platform-browser": ">=21.1.4",
     "shiki": ">=3.21.0",
-    "@semantic-components/ui": "0.63.0"
+    "@semantic-components/ui": "0.64.0"
   },
   "exports": {
     "./styles": {
       "default": "./src/lib/styles/index.css"
+    },
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./semantic-components-code.d.ts",
+      "default": "./esm2022/semantic-components-code.js"
     }
   },
-  "sideEffects": false
+  "sideEffects": false,
+  "module": "esm2022/semantic-components-code.js",
+  "typings": "semantic-components-code.d.ts",
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
 }

package/semantic-components-code.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@semantic-components/code" />
+export * from './index';

package/eslint.config.mjs

@@ -1,48 +0,0 @@
-import nx from '@nx/eslint-plugin';
-import baseConfig from '../../eslint.config.mjs';
-
-export default [
-  ...baseConfig,
-  {
-    files: ['**/*.json'],
-    rules: {
-      '@nx/dependency-checks': [
-        'error',
-        {
-          ignoredFiles: ['{projectRoot}/eslint.config.{js,cjs,mjs,ts,cts,mts}'],
-        },
-      ],
-    },
-    languageOptions: {
-      parser: await import('jsonc-eslint-parser'),
-    },
-  },
-  ...nx.configs['flat/angular'],
-  ...nx.configs['flat/angular-template'],
-  {
-    files: ['**/*.ts'],
-    rules: {
-      '@angular-eslint/directive-selector': [
-        'error',
-        {
-          type: 'attribute',
-          prefix: 'sc',
-          style: 'camelCase',
-        },
-      ],
-      '@angular-eslint/component-selector': [
-        'error',
-        {
-          type: 'element',
-          prefix: 'sc',
-          style: 'kebab-case',
-        },
-      ],
-    },
-  },
-  {
-    files: ['**/*.html'],
-    // Override or add rules here
-    rules: {},
-  },
-];

package/ng-package.json

@@ -1,8 +0,0 @@
-{
-  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "../../dist/libs/code",
-  "assets": ["./src/lib/styles"],
-  "lib": {
-    "entryFile": "src/index.ts"
-  }
-}