@acorex/components 21.0.3-next.38 → 21.0.3-next.40

package/fesm2022/acorex-components-conversation-picker-header.component-BneIFjXq.mjs

@@ -0,0 +1,91 @@
+import { AXButtonComponent } from '@acorex/components/button';
+import * as i0 from '@angular/core';
+import { input, output, ChangeDetectionStrategy, Component } from '@angular/core';
+import * as i3 from '@acorex/core/translation';
+import { AXTranslationModule } from '@acorex/core/translation';
+import { AsyncPipe } from '@angular/common';
+
+/**
+ * Picker Footer Component
+ * Reusable footer for all picker components
+ */
+class AXConversationPickerFooterComponent {
+    constructor() {
+        this.sendText = input.required(...(ngDevMode ? [{ debugName: "sendText" }] : /* istanbul ignore next */ []));
+        this.sendDisabled = input(false, ...(ngDevMode ? [{ debugName: "sendDisabled" }] : /* istanbul ignore next */ []));
+        this.onCancel = output();
+        this.onSend = output();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXConversationPickerFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: AXConversationPickerFooterComponent, isStandalone: true, selector: "ax-conversation-picker-footer", inputs: { sendText: { classPropertyName: "sendText", publicName: "sendText", isSignal: true, isRequired: true, transformFunction: null }, sendDisabled: { classPropertyName: "sendDisabled", publicName: "sendDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCancel: "onCancel", onSend: "onSend" }, ngImport: i0, template: `
+    <div class="ax-conversation-picker-footer">
+      <ax-button text="Cancel" look="solid" color="danger" (onClick)="onCancel.emit()" />
+      <ax-button
+        [text]="sendText()"
+        look="outline"
+        color="primary"
+        [disabled]="sendDisabled()"
+        (onClick)="onSend.emit()"
+      />
+    </div>
+  `, isInline: true, styles: [".ax-conversation-picker-footer{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:.5rem;padding:.625rem .75rem;padding-bottom:calc(.625rem + env(safe-area-inset-bottom,0px));border-top:1px solid rgb(var(--ax-sys-color-border-light-surface));flex-shrink:0;background:rgb(var(--ax-sys-color-lightest-surface))}@container picker (max-width: 480px){.ax-conversation-picker-footer{flex-direction:column-reverse;align-items:stretch;gap:.375rem;padding-inline:.5rem}.ax-conversation-picker-footer ax-button{width:100%}}\n"], dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXConversationPickerFooterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-conversation-picker-footer', imports: [AXButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <div class="ax-conversation-picker-footer">
+      <ax-button text="Cancel" look="solid" color="danger" (onClick)="onCancel.emit()" />
+      <ax-button
+        [text]="sendText()"
+        look="outline"
+        color="primary"
+        [disabled]="sendDisabled()"
+        (onClick)="onSend.emit()"
+      />
+    </div>
+  `, styles: [".ax-conversation-picker-footer{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:.5rem;padding:.625rem .75rem;padding-bottom:calc(.625rem + env(safe-area-inset-bottom,0px));border-top:1px solid rgb(var(--ax-sys-color-border-light-surface));flex-shrink:0;background:rgb(var(--ax-sys-color-lightest-surface))}@container picker (max-width: 480px){.ax-conversation-picker-footer{flex-direction:column-reverse;align-items:stretch;gap:.375rem;padding-inline:.5rem}.ax-conversation-picker-footer ax-button{width:100%}}\n"] }]
+        }], propDecorators: { sendText: [{ type: i0.Input, args: [{ isSignal: true, alias: "sendText", required: true }] }], sendDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "sendDisabled", required: false }] }], onCancel: [{ type: i0.Output, args: ["onCancel"] }], onSend: [{ type: i0.Output, args: ["onSend"] }] } });
+
+/**
+ * Picker Header Component
+ * Reusable header for all picker components
+ */
+class AXConversationPickerHeaderComponent {
+    constructor() {
+        this.title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+        this.onClose = output();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXConversationPickerHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: AXConversationPickerHeaderComponent, isStandalone: true, selector: "ax-conversation-picker-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { onClose: "onClose" }, ngImport: i0, template: `
+    <div class="ax-conversation-picker-header">
+      <span class="ax-conversation-picker-header__title">{{ title() }}</span>
+      <button
+        type="button"
+        class="ax-conversation-picker-header__close"
+        (click)="onClose.emit()"
+        [attr.aria-label]="'@acorex:chat.actions.close' | translate | async"
+      >
+        <i class="fa-light fa-xmark"></i>
+      </button>
+    </div>
+  `, isInline: true, styles: [".ax-conversation-picker-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.625rem .75rem;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface));flex-shrink:0}.ax-conversation-picker-header__title{font-size:.8125rem;font-weight:600;color:rgb(var(--ax-sys-color-on-surface))}.ax-conversation-picker-header__close{display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;margin:-.375rem -.5rem -.375rem 0;border:none;border-radius:var(--ax-sys-border-radius, .25rem);background:transparent;color:rgba(var(--ax-sys-color-on-surface),.55);font-size:1.125rem;cursor:pointer;touch-action:manipulation;transition:background-color .15s ease,color .15s ease}.ax-conversation-picker-header__close:hover,.ax-conversation-picker-header__close:focus-visible{background:rgba(var(--ax-sys-color-danger-500),.1);color:rgb(var(--ax-sys-color-danger-500));outline:none}\n"], dependencies: [{ kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXConversationPickerHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ax-conversation-picker-header', imports: [AXTranslationModule, AsyncPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <div class="ax-conversation-picker-header">
+      <span class="ax-conversation-picker-header__title">{{ title() }}</span>
+      <button
+        type="button"
+        class="ax-conversation-picker-header__close"
+        (click)="onClose.emit()"
+        [attr.aria-label]="'@acorex:chat.actions.close' | translate | async"
+      >
+        <i class="fa-light fa-xmark"></i>
+      </button>
+    </div>
+  `, styles: [".ax-conversation-picker-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.625rem .75rem;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface));flex-shrink:0}.ax-conversation-picker-header__title{font-size:.8125rem;font-weight:600;color:rgb(var(--ax-sys-color-on-surface))}.ax-conversation-picker-header__close{display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;margin:-.375rem -.5rem -.375rem 0;border:none;border-radius:var(--ax-sys-border-radius, .25rem);background:transparent;color:rgba(var(--ax-sys-color-on-surface),.55);font-size:1.125rem;cursor:pointer;touch-action:manipulation;transition:background-color .15s ease,color .15s ease}.ax-conversation-picker-header__close:hover,.ax-conversation-picker-header__close:focus-visible{background:rgba(var(--ax-sys-color-danger-500),.1);color:rgb(var(--ax-sys-color-danger-500));outline:none}\n"] }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], onClose: [{ type: i0.Output, args: ["onClose"] }] } });
+
+export { AXConversationPickerHeaderComponent as A, AXConversationPickerFooterComponent as a };
+//# sourceMappingURL=acorex-components-conversation-picker-header.component-BneIFjXq.mjs.map

package/fesm2022/acorex-components-conversation-picker-header.component-BneIFjXq.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-components-conversation-picker-header.component-BneIFjXq.mjs","sources":["../../../../packages/components/conversation/src/lib/plugins/composer/components/picker-footer/picker-footer.component.ts","../../../../packages/components/conversation/src/lib/plugins/composer/components/picker-header/picker-header.component.ts"],"sourcesContent":["/**\n * Picker Footer Component\n * Reusable footer for all picker components\n */\n\nimport { AXButtonComponent } from '@acorex/components/button';\nimport { ChangeDetectionStrategy, Component, input, output } from '@angular/core';\n\n@Component({\n  selector: 'ax-conversation-picker-footer',\n  imports: [AXButtonComponent],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  template: `\n    <div class=\"ax-conversation-picker-footer\">\n      <ax-button text=\"Cancel\" look=\"solid\" color=\"danger\" (onClick)=\"onCancel.emit()\" />\n      <ax-button\n        [text]=\"sendText()\"\n        look=\"outline\"\n        color=\"primary\"\n        [disabled]=\"sendDisabled()\"\n        (onClick)=\"onSend.emit()\"\n      />\n    </div>\n  `,\n  styles: [\n    `\n      .ax-conversation-picker-footer {\n        display: flex;\n        align-items: center;\n        justify-content: flex-end;\n        flex-wrap: wrap;\n        gap: 0.5rem;\n        padding: 0.625rem 0.75rem;\n        padding-bottom: calc(0.625rem + env(safe-area-inset-bottom, 0px));\n        border-top: 1px solid rgb(var(--ax-sys-color-border-light-surface));\n        flex-shrink: 0;\n        background: rgb(var(--ax-sys-color-lightest-surface));\n      }\n\n      @container picker (max-width: 480px) {\n        .ax-conversation-picker-footer {\n          flex-direction: column-reverse;\n          align-items: stretch;\n          gap: 0.375rem;\n          padding-inline: 0.5rem;\n        }\n\n        .ax-conversation-picker-footer ax-button {\n          width: 100%;\n        }\n      }\n    `,\n  ],\n})\nexport class AXConversationPickerFooterComponent {\n  readonly sendText = input.required<string>();\n  readonly sendDisabled = input<boolean>(false);\n  readonly onCancel = output<void>();\n  readonly onSend = output<void>();\n}\n","/**\n * Picker Header Component\n * Reusable header for all picker components\n */\n\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { AsyncPipe } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, input, output } from '@angular/core';\n\n@Component({\n  selector: 'ax-conversation-picker-header',\n  imports: [AXTranslationModule, AsyncPipe],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  template: `\n    <div class=\"ax-conversation-picker-header\">\n      <span class=\"ax-conversation-picker-header__title\">{{ title() }}</span>\n      <button\n        type=\"button\"\n        class=\"ax-conversation-picker-header__close\"\n        (click)=\"onClose.emit()\"\n        [attr.aria-label]=\"'@acorex:chat.actions.close' | translate | async\"\n      >\n        <i class=\"fa-light fa-xmark\"></i>\n      </button>\n    </div>\n  `,\n  styles: [\n    `\n      .ax-conversation-picker-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 0.5rem;\n        padding: 0.625rem 0.75rem;\n        border-bottom: 1px solid rgb(var(--ax-sys-color-border-light-surface));\n        flex-shrink: 0;\n      }\n\n      .ax-conversation-picker-header__title {\n        font-size: 0.8125rem;\n        font-weight: 600;\n        color: rgb(var(--ax-sys-color-on-surface));\n      }\n\n      .ax-conversation-picker-header__close {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        width: 2.75rem;\n        height: 2.75rem;\n        margin: -0.375rem -0.5rem -0.375rem 0;\n        border: none;\n        border-radius: var(--ax-sys-border-radius, 0.25rem);\n        background: transparent;\n        color: rgba(var(--ax-sys-color-on-surface), 0.55);\n        font-size: 1.125rem;\n        cursor: pointer;\n        touch-action: manipulation;\n        transition: background-color 0.15s ease, color 0.15s ease;\n      }\n\n      .ax-conversation-picker-header__close:hover,\n      .ax-conversation-picker-header__close:focus-visible {\n        background: rgba(var(--ax-sys-color-danger-500), 0.1);\n        color: rgb(var(--ax-sys-color-danger-500));\n        outline: none;\n      }\n    `,\n  ],\n})\nexport class AXConversationPickerHeaderComponent {\n  readonly title = input.required<string>();\n  readonly onClose = output<void>();\n}\n"],"names":[],"mappings":"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"}