valtech-components 2.0.554 → 2.0.557

package/esm2022/lib/components/molecules/docs-callout/docs-callout.component.mjs

@@ -0,0 +1,60 @@
+import { CommonModule } from '@angular/common';
+import { Component, input } from '@angular/core';
+import * as i0 from "@angular/core";
+export class DocsCalloutComponent {
+    constructor() {
+        this.props = input({});
+        this.variant = () => this.props().variant || 'note';
+        this.displayTitle = () => {
+            if (this.props().title)
+                return this.props().title;
+            const titles = {
+                note: 'Note',
+                warning: 'Warning',
+                tip: 'Tip',
+                danger: 'Danger',
+                info: 'Info',
+            };
+            return titles[this.variant()];
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DocsCalloutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: DocsCalloutComponent, isStandalone: true, selector: "val-docs-callout", inputs: { props: { classPropertyName: "props", publicName: "props", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <div
+      class="docs-callout"
+      [class.docs-callout--note]="variant() === 'note'"
+      [class.docs-callout--warning]="variant() === 'warning'"
+      [class.docs-callout--tip]="variant() === 'tip'"
+      [class.docs-callout--danger]="variant() === 'danger'"
+      [class.docs-callout--info]="variant() === 'info'"
+    >
+      @if (!props().hideTitle) {
+        <div class="docs-callout__title">{{ displayTitle() }}</div>
+      }
+      <div class="docs-callout__content">
+        <ng-content></ng-content>
+      </div>
+    </div>
+  `, isInline: true, styles: [".docs-callout{--callout-bg: #fffbeb;--callout-border: #f59e0b;--callout-title: #92400e;--callout-text: #78350f;margin:1.5rem 0;padding:1rem 1.25rem;border-left:4px solid var(--callout-border);border-radius:0 8px 8px 0;background:var(--callout-bg)}.docs-callout__title{font-size:.9375rem;font-weight:700;color:var(--callout-title);margin-bottom:.5rem}.docs-callout__content{font-size:.9375rem;line-height:1.7;color:var(--callout-text)}.docs-callout__content p{margin:0}.docs-callout__content p+p{margin-top:.75rem}.docs-callout__content code{font-family:SF Mono,Fira Code,Monaco,Consolas,monospace;font-size:.875rem;background:#0000000f;padding:.125rem .375rem;border-radius:4px}.docs-callout__content a{color:var(--callout-title);text-decoration:underline;text-underline-offset:2px}.docs-callout__content a:hover{text-decoration:none}.docs-callout--note{--callout-bg: #fffbeb;--callout-border: #f59e0b;--callout-title: #92400e;--callout-text: #78350f}.docs-callout--warning{--callout-bg: #fff7ed;--callout-border: #f97316;--callout-title: #c2410c;--callout-text: #9a3412}.docs-callout--tip{--callout-bg: #ecfdf5;--callout-border: #10b981;--callout-title: #065f46;--callout-text: #047857}.docs-callout--danger{--callout-bg: #fef2f2;--callout-border: #ef4444;--callout-title: #991b1b;--callout-text: #b91c1c}.docs-callout--info{--callout-bg: #eff6ff;--callout-border: #3b82f6;--callout-title: #1e40af;--callout-text: #1d4ed8}:host-context(.dark) .docs-callout--note,:host-context([color-scheme=dark]) .docs-callout--note{--callout-bg: rgba(245, 158, 11, .1);--callout-border: #f59e0b;--callout-title: #fbbf24;--callout-text: #fcd34d}:host-context(.dark) .docs-callout--warning,:host-context([color-scheme=dark]) .docs-callout--warning{--callout-bg: rgba(249, 115, 22, .1);--callout-border: #f97316;--callout-title: #fb923c;--callout-text: #fdba74}:host-context(.dark) .docs-callout--tip,:host-context([color-scheme=dark]) .docs-callout--tip{--callout-bg: rgba(16, 185, 129, .1);--callout-border: #10b981;--callout-title: #34d399;--callout-text: #6ee7b7}:host-context(.dark) .docs-callout--danger,:host-context([color-scheme=dark]) .docs-callout--danger{--callout-bg: rgba(239, 68, 68, .1);--callout-border: #ef4444;--callout-title: #f87171;--callout-text: #fca5a5}:host-context(.dark) .docs-callout--info,:host-context([color-scheme=dark]) .docs-callout--info{--callout-bg: rgba(59, 130, 246, .1);--callout-border: #3b82f6;--callout-title: #60a5fa;--callout-text: #93c5fd}:host-context(.dark) .docs-callout__content code,:host-context([color-scheme=dark]) .docs-callout__content code{background:#ffffff1a}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DocsCalloutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'val-docs-callout', standalone: true, imports: [CommonModule], template: `
+    <div
+      class="docs-callout"
+      [class.docs-callout--note]="variant() === 'note'"
+      [class.docs-callout--warning]="variant() === 'warning'"
+      [class.docs-callout--tip]="variant() === 'tip'"
+      [class.docs-callout--danger]="variant() === 'danger'"
+      [class.docs-callout--info]="variant() === 'info'"
+    >
+      @if (!props().hideTitle) {
+        <div class="docs-callout__title">{{ displayTitle() }}</div>
+      }
+      <div class="docs-callout__content">
+        <ng-content></ng-content>
+      </div>
+    </div>
+  `, styles: [".docs-callout{--callout-bg: #fffbeb;--callout-border: #f59e0b;--callout-title: #92400e;--callout-text: #78350f;margin:1.5rem 0;padding:1rem 1.25rem;border-left:4px solid var(--callout-border);border-radius:0 8px 8px 0;background:var(--callout-bg)}.docs-callout__title{font-size:.9375rem;font-weight:700;color:var(--callout-title);margin-bottom:.5rem}.docs-callout__content{font-size:.9375rem;line-height:1.7;color:var(--callout-text)}.docs-callout__content p{margin:0}.docs-callout__content p+p{margin-top:.75rem}.docs-callout__content code{font-family:SF Mono,Fira Code,Monaco,Consolas,monospace;font-size:.875rem;background:#0000000f;padding:.125rem .375rem;border-radius:4px}.docs-callout__content a{color:var(--callout-title);text-decoration:underline;text-underline-offset:2px}.docs-callout__content a:hover{text-decoration:none}.docs-callout--note{--callout-bg: #fffbeb;--callout-border: #f59e0b;--callout-title: #92400e;--callout-text: #78350f}.docs-callout--warning{--callout-bg: #fff7ed;--callout-border: #f97316;--callout-title: #c2410c;--callout-text: #9a3412}.docs-callout--tip{--callout-bg: #ecfdf5;--callout-border: #10b981;--callout-title: #065f46;--callout-text: #047857}.docs-callout--danger{--callout-bg: #fef2f2;--callout-border: #ef4444;--callout-title: #991b1b;--callout-text: #b91c1c}.docs-callout--info{--callout-bg: #eff6ff;--callout-border: #3b82f6;--callout-title: #1e40af;--callout-text: #1d4ed8}:host-context(.dark) .docs-callout--note,:host-context([color-scheme=dark]) .docs-callout--note{--callout-bg: rgba(245, 158, 11, .1);--callout-border: #f59e0b;--callout-title: #fbbf24;--callout-text: #fcd34d}:host-context(.dark) .docs-callout--warning,:host-context([color-scheme=dark]) .docs-callout--warning{--callout-bg: rgba(249, 115, 22, .1);--callout-border: #f97316;--callout-title: #fb923c;--callout-text: #fdba74}:host-context(.dark) .docs-callout--tip,:host-context([color-scheme=dark]) .docs-callout--tip{--callout-bg: rgba(16, 185, 129, .1);--callout-border: #10b981;--callout-title: #34d399;--callout-text: #6ee7b7}:host-context(.dark) .docs-callout--danger,:host-context([color-scheme=dark]) .docs-callout--danger{--callout-bg: rgba(239, 68, 68, .1);--callout-border: #ef4444;--callout-title: #f87171;--callout-text: #fca5a5}:host-context(.dark) .docs-callout--info,:host-context([color-scheme=dark]) .docs-callout--info{--callout-bg: rgba(59, 130, 246, .1);--callout-border: #3b82f6;--callout-title: #60a5fa;--callout-text: #93c5fd}:host-context(.dark) .docs-callout__content code,:host-context([color-scheme=dark]) .docs-callout__content code{background:#ffffff1a}\n"] }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZG9jcy1jYWxsb3V0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29tcG9uZW50cy9tb2xlY3VsZXMvZG9jcy1jYWxsb3V0L2RvY3MtY2FsbG91dC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQW9DakQsTUFBTSxPQUFPLG9CQUFvQjtJQXZCakM7UUF3QkUsVUFBSyxHQUFHLEtBQUssQ0FBc0IsRUFBRSxDQUFDLENBQUM7UUFFdkMsWUFBTyxHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQyxPQUFPLElBQUksTUFBTSxDQUFDO1FBRS9DLGlCQUFZLEdBQUcsR0FBRyxFQUFFO1lBQ2xCLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDLEtBQUs7Z0JBQUUsT0FBTyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUMsS0FBSyxDQUFDO1lBRWxELE1BQU0sTUFBTSxHQUF1QztnQkFDakQsSUFBSSxFQUFFLE1BQU07Z0JBQ1osT0FBTyxFQUFFLFNBQVM7Z0JBQ2xCLEdBQUcsRUFBRSxLQUFLO2dCQUNWLE1BQU0sRUFBRSxRQUFRO2dCQUNoQixJQUFJLEVBQUUsTUFBTTthQUNiLENBQUM7WUFDRixPQUFPLE1BQU0sQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUMsQ0FBQztRQUNoQyxDQUFDLENBQUM7S0FDSDsrR0FqQlksb0JBQW9CO21HQUFwQixvQkFBb0IsZ05BbkJyQjs7Ozs7Ozs7Ozs7Ozs7OztHQWdCVCxzbkZBakJTLFlBQVk7OzRGQW9CWCxvQkFBb0I7a0JBdkJoQyxTQUFTOytCQUNFLGtCQUFrQixjQUNoQixJQUFJLFdBQ1AsQ0FBQyxZQUFZLENBQUMsWUFDYjs7Ozs7Ozs7Ozs7Ozs7OztHQWdCVCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDb21wb25lbnQsIGlucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmV4cG9ydCB0eXBlIERvY3NDYWxsb3V0VmFyaWFudCA9ICdub3RlJyB8ICd3YXJuaW5nJyB8ICd0aXAnIHwgJ2RhbmdlcicgfCAnaW5mbyc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG9jc0NhbGxvdXRNZXRhZGF0YSB7XG4gIC8qKiBWYXJpYW50IGRldGVybWluZXMgdGhlIGNvbG9yIHNjaGVtZSAqL1xuICB2YXJpYW50PzogRG9jc0NhbGxvdXRWYXJpYW50O1xuICAvKiogT3B0aW9uYWwgdGl0bGUgKGRlZmF1bHRzIHRvIHZhcmlhbnQgbmFtZSBpZiBub3QgcHJvdmlkZWQpICovXG4gIHRpdGxlPzogc3RyaW5nO1xuICAvKiogSGlkZSB0aGUgdGl0bGUgY29tcGxldGVseSAqL1xuICBoaWRlVGl0bGU/OiBib29sZWFuO1xufVxuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd2YWwtZG9jcy1jYWxsb3V0JyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXG4gIHRlbXBsYXRlOiBgXG4gICAgPGRpdlxuICAgICAgY2xhc3M9XCJkb2NzLWNhbGxvdXRcIlxuICAgICAgW2NsYXNzLmRvY3MtY2FsbG91dC0tbm90ZV09XCJ2YXJpYW50KCkgPT09ICdub3RlJ1wiXG4gICAgICBbY2xhc3MuZG9jcy1jYWxsb3V0LS13YXJuaW5nXT1cInZhcmlhbnQoKSA9PT0gJ3dhcm5pbmcnXCJcbiAgICAgIFtjbGFzcy5kb2NzLWNhbGxvdXQtLXRpcF09XCJ2YXJpYW50KCkgPT09ICd0aXAnXCJcbiAgICAgIFtjbGFzcy5kb2NzLWNhbGxvdXQtLWRhbmdlcl09XCJ2YXJpYW50KCkgPT09ICdkYW5nZXInXCJcbiAgICAgIFtjbGFzcy5kb2NzLWNhbGxvdXQtLWluZm9dPVwidmFyaWFudCgpID09PSAnaW5mbydcIlxuICAgID5cbiAgICAgIEBpZiAoIXByb3BzKCkuaGlkZVRpdGxlKSB7XG4gICAgICAgIDxkaXYgY2xhc3M9XCJkb2NzLWNhbGxvdXRfX3RpdGxlXCI+e3sgZGlzcGxheVRpdGxlKCkgfX08L2Rpdj5cbiAgICAgIH1cbiAgICAgIDxkaXYgY2xhc3M9XCJkb2NzLWNhbGxvdXRfX2NvbnRlbnRcIj5cbiAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIGAsXG4gIHN0eWxlVXJsczogWycuL2RvY3MtY2FsbG91dC5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBEb2NzQ2FsbG91dENvbXBvbmVudCB7XG4gIHByb3BzID0gaW5wdXQ8RG9jc0NhbGxvdXRNZXRhZGF0YT4oe30pO1xuXG4gIHZhcmlhbnQgPSAoKSA9PiB0aGlzLnByb3BzKCkudmFyaWFudCB8fCAnbm90ZSc7XG5cbiAgZGlzcGxheVRpdGxlID0gKCkgPT4ge1xuICAgIGlmICh0aGlzLnByb3BzKCkudGl0bGUpIHJldHVybiB0aGlzLnByb3BzKCkudGl0bGU7XG5cbiAgICBjb25zdCB0aXRsZXM6IFJlY29yZDxEb2NzQ2FsbG91dFZhcmlhbnQsIHN0cmluZz4gPSB7XG4gICAgICBub3RlOiAnTm90ZScsXG4gICAgICB3YXJuaW5nOiAnV2FybmluZycsXG4gICAgICB0aXA6ICdUaXAnLFxuICAgICAgZGFuZ2VyOiAnRGFuZ2VyJyxcbiAgICAgIGluZm86ICdJbmZvJyxcbiAgICB9O1xuICAgIHJldHVybiB0aXRsZXNbdGhpcy52YXJpYW50KCldO1xuICB9O1xufVxuIl19