@acorex/components 22.2.15 → 22.2.17

package/fesm2022/acorex-components-reaction.mjs

@@ -113,7 +113,7 @@ class AXReactionComponent {
         return `${item.emoji.name}, ${item.count}${selected}`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXReactionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXReactionComponent, isStandalone: true, selector: "ax-reaction", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, showPicker: { classPropertyName: "showPicker", publicName: "showPicker", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { add: "add", remove: "remove" }, host: { properties: { "class.ax-reaction-editable": "editable()" }, classAttribute: "ax-reaction-host" }, providers: [{ provide: AXComponent, useExisting: AXReactionComponent }], viewQueries: [{ propertyName: "pickerPopover", first: true, predicate: ["pickerPopover"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ax-reaction\">\n  @for (item of items(); track item.emoji.code) {\n    <button\n      type=\"button\"\n      class=\"ax-reaction-item\"\n      [class.ax-reaction-item-selected]=\"item.selected\"\n      [class.ax-reaction-item-interactive]=\"editable()\"\n      [attr.aria-label]=\"itemAriaLabel(item)\"\n      [attr.aria-pressed]=\"item.selected ? true : null\"\n      [title]=\"item.emoji.name\"\n      (click)=\"onItemClick(item)\"\n    >\n      <ax-emoji [emoji]=\"item.emoji\" [size]=\"size()\" />\n\n      <span class=\"ax-reaction-count\">\n        {{ item.count }}\n      </span>\n    </button>\n  }\n\n  @if (editable()) {\n    <button\n      #addButton\n      type=\"button\"\n      class=\"ax-reaction-item ax-reaction-add\"\n      [class.ax-reaction-item-selected]=\"isPickerVisible()\"\n      [attr.aria-label]=\"'Add reaction'\"\n      [attr.aria-expanded]=\"isPickerVisible()\"\n      [attr.aria-haspopup]=\"true\"\n      title=\"Add reaction\"\n      (click)=\"togglePicker($event)\"\n      (mousedown)=\"$event.stopPropagation()\"\n    >\n      <span class=\"ax-reaction-add-icon\" aria-hidden=\"true\"></span>\n    </button>\n\n    <ax-popover\n      #pickerPopover\n      [target]=\"addButton\"\n      [openOn]=\"'manual'\"\n      [closeOn]=\"'clickOut'\"\n      [placement]=\"'bottom-start'\"\n      panelClass=\"ax-reaction-picker-panel\"\n      (onOpened)=\"onPickerOpened()\"\n      (onClosed)=\"onPickerClosed()\"\n    >\n      <ax-emoji-picker (selected)=\"onPickerSelected($event)\" />\n    </ax-popover>\n  }\n</div>\n", styles: ["@layer properties;@layer components{ax-reaction{--ax-comp-reaction-gap: .25rem;--ax-comp-reaction-item-gap: .25rem;--ax-comp-reaction-item-padding-x: .4rem;--ax-comp-reaction-item-padding-y: .125rem;--ax-comp-reaction-item-min-height: 1.5rem;--ax-comp-reaction-item-radius: 9999px;--ax-comp-reaction-item-font-size: .6875rem;--ax-comp-reaction-item-bg: var(--color-surface);--ax-comp-reaction-item-border: var(--color-border-lightest);--ax-comp-reaction-item-color: var(--color-on-surface);--ax-comp-reaction-item-hover-bg: var(--color-lightest);--ax-comp-reaction-item-selected-bg: color-mix(in srgb, rgba(var(--ax-sys-color-primary-surface)) 18%, rgba(var(--ax-sys-color-surface)));--ax-comp-reaction-item-selected-border: var(--color-border-primary);position:relative;display:inline-flex;align-items:center}@supports (color: color-mix(in lab,red,red)){ax-reaction{--ax-comp-reaction-item-selected-bg: color-mix(in oklab, var(--color-primary) 18%, var(--color-surface))}}ax-reaction .ax-reaction{display:inline-flex;flex-wrap:wrap;align-items:center;gap:var(--ax-comp-reaction-gap)}ax-reaction .ax-reaction-item{display:inline-flex;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;gap:var(--ax-comp-reaction-item-gap);min-height:var(--ax-comp-reaction-item-min-height);padding:var(--ax-comp-reaction-item-padding-y) var(--ax-comp-reaction-item-padding-x);border-radius:var(--ax-comp-reaction-item-radius);border-color:var(--ax-comp-reaction-item-border);background-color:var(--ax-comp-reaction-item-bg);color:var(--ax-comp-reaction-item-color);font-size:var(--ax-comp-reaction-item-font-size);line-height:1;cursor:default}ax-reaction .ax-reaction-item ax-emoji{pointer-events:none}ax-reaction .ax-reaction-item-interactive,ax-reaction .ax-reaction-add{cursor:pointer}:is(ax-reaction .ax-reaction-item-interactive,ax-reaction .ax-reaction-add):hover{background-color:var(--ax-comp-reaction-item-hover-bg);border-color:var(--color-border-light)}:is(ax-reaction .ax-reaction-item-interactive,ax-reaction .ax-reaction-add):focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}ax-reaction .ax-reaction-item-selected{background-color:var(--ax-comp-reaction-item-selected-bg);border-color:var(--ax-comp-reaction-item-selected-border)}ax-reaction .ax-reaction-count{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);color:var(--ax-comp-reaction-item-color);opacity:.7}ax-reaction .ax-reaction-item-selected .ax-reaction-count{color:var(--color-primary);opacity:.95}ax-reaction .ax-reaction-add{aspect-ratio:1 / 1;min-width:1.5rem;padding-inline:calc(var(--spacing, .25rem) * 0)}ax-reaction .ax-reaction-add-icon{position:relative;display:block;width:calc(var(--spacing, .25rem) * 2.5);height:calc(var(--spacing, .25rem) * 2.5)}ax-reaction .ax-reaction-add-icon:before,ax-reaction .ax-reaction-add-icon:after{position:absolute;inset:calc(var(--spacing, .25rem) * 0);margin:auto;border-radius:calc(infinity * 1px);content:\"\";background-color:currentColor}ax-reaction .ax-reaction-add-icon:before{width:100%;height:1.5px}ax-reaction .ax-reaction-add-icon:after{width:1.5px;height:100%}ax-reaction ax-popover{display:contents}.ax-reaction-picker-panel ax-emoji-picker{width:min(22rem,92vw);border:none;box-shadow:none;border-radius:0}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXEmojiComponent, selector: "ax-emoji", inputs: ["emoji", "appearance", "size"] }, { kind: "component", type: AXEmojiPickerComponent, selector: "ax-emoji-picker", inputs: ["items", "size", "appearance", "showSearch", "showRecent", "columns", "searchPlaceholder", "excludeCategories", "excludeCodes", "excludeUnicode", "recentItems"], outputs: ["selected", "recentChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXReactionComponent, isStandalone: true, selector: "ax-reaction", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, showPicker: { classPropertyName: "showPicker", publicName: "showPicker", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { add: "add", remove: "remove" }, host: { properties: { "class.ax-reaction-editable": "editable()" }, classAttribute: "ax-reaction-host" }, providers: [{ provide: AXComponent, useExisting: AXReactionComponent }], viewQueries: [{ propertyName: "pickerPopover", first: true, predicate: ["pickerPopover"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ax-reaction\">\n  @for (item of items(); track item.emoji.code) {\n    <button\n      type=\"button\"\n      class=\"ax-reaction-item\"\n      [class.ax-reaction-item-selected]=\"item.selected\"\n      [class.ax-reaction-item-interactive]=\"editable()\"\n      [attr.aria-label]=\"itemAriaLabel(item)\"\n      [attr.aria-pressed]=\"item.selected ? true : null\"\n      [title]=\"item.emoji.name\"\n      (click)=\"onItemClick(item)\"\n    >\n      <ax-emoji [emoji]=\"item.emoji\" [size]=\"size()\" />\n\n      <span class=\"ax-reaction-count\">\n        {{ item.count }}\n      </span>\n    </button>\n  }\n\n  @if (editable()) {\n    <button\n      #addButton\n      type=\"button\"\n      class=\"ax-reaction-item ax-reaction-add\"\n      [class.ax-reaction-item-selected]=\"isPickerVisible()\"\n      [attr.aria-label]=\"'Add reaction'\"\n      [attr.aria-expanded]=\"isPickerVisible()\"\n      [attr.aria-haspopup]=\"true\"\n      title=\"Add reaction\"\n      (click)=\"togglePicker($event)\"\n      (mousedown)=\"$event.stopPropagation()\"\n    >\n      <span class=\"ax-reaction-add-icon\" aria-hidden=\"true\"></span>\n    </button>\n\n    <ax-popover\n      #pickerPopover\n      [target]=\"addButton\"\n      [openOn]=\"'manual'\"\n      [closeOn]=\"'clickOut'\"\n      [placement]=\"'bottom-start'\"\n      panelClass=\"ax-reaction-picker-panel\"\n      (onOpened)=\"onPickerOpened()\"\n      (onClosed)=\"onPickerClosed()\"\n    >\n      <ax-emoji-picker (selected)=\"onPickerSelected($event)\" />\n    </ax-popover>\n  }\n</div>\n", styles: ["@layer properties;@layer components{ax-reaction{--ax-comp-reaction-gap: .25rem;--ax-comp-reaction-item-gap: .25rem;--ax-comp-reaction-item-padding-x: .4rem;--ax-comp-reaction-item-padding-y: .125rem;--ax-comp-reaction-item-min-height: 1.5rem;--ax-comp-reaction-item-radius: 9999px;--ax-comp-reaction-item-font-size: .6875rem;--ax-comp-reaction-item-bg: var(--color-surface);--ax-comp-reaction-item-border: var(--color-border-lightest);--ax-comp-reaction-item-color: var(--color-on-surface);--ax-comp-reaction-item-hover-bg: var(--color-lightest);--ax-comp-reaction-item-selected-bg: color-mix(in srgb, rgba(var(--ax-sys-color-primary-surface)) 18%, rgba(var(--ax-sys-color-surface)));--ax-comp-reaction-item-selected-border: var(--color-border-primary);position:relative;display:inline-flex;align-items:center}@supports (color: color-mix(in lab,red,red)){ax-reaction{--ax-comp-reaction-item-selected-bg: color-mix(in oklab, var(--color-primary) 18%, var(--color-surface))}}ax-reaction .ax-reaction{display:inline-flex;flex-wrap:wrap;align-items:center;gap:var(--ax-comp-reaction-gap)}ax-reaction .ax-reaction-item{display:inline-flex;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;gap:var(--ax-comp-reaction-item-gap);min-height:var(--ax-comp-reaction-item-min-height);padding:var(--ax-comp-reaction-item-padding-y) var(--ax-comp-reaction-item-padding-x);border-radius:var(--ax-comp-reaction-item-radius);border-color:var(--ax-comp-reaction-item-border);background-color:var(--ax-comp-reaction-item-bg);color:var(--ax-comp-reaction-item-color);font-size:var(--ax-comp-reaction-item-font-size);line-height:1;cursor:default}ax-reaction .ax-reaction-item ax-emoji{pointer-events:none}ax-reaction .ax-reaction-item-interactive,ax-reaction .ax-reaction-add{cursor:pointer}:is(ax-reaction .ax-reaction-item-interactive,ax-reaction .ax-reaction-add):hover{background-color:var(--ax-comp-reaction-item-hover-bg);border-color:var(--color-border-light)}:is(ax-reaction .ax-reaction-item-interactive,ax-reaction .ax-reaction-add):focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}ax-reaction .ax-reaction-item-selected{background-color:var(--ax-comp-reaction-item-selected-bg);border-color:var(--ax-comp-reaction-item-selected-border)}ax-reaction .ax-reaction-count{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);color:var(--ax-comp-reaction-item-color);opacity:.7}ax-reaction .ax-reaction-item-selected .ax-reaction-count{color:var(--color-primary);opacity:.95}ax-reaction .ax-reaction-add{aspect-ratio:1 / 1;min-width:1.5rem;padding-inline:calc(var(--spacing, .25rem) * 0)}ax-reaction .ax-reaction-add-icon{position:relative;display:block;width:calc(var(--spacing, .25rem) * 2.5);height:calc(var(--spacing, .25rem) * 2.5)}ax-reaction .ax-reaction-add-icon:before,ax-reaction .ax-reaction-add-icon:after{position:absolute;inset:calc(var(--spacing, .25rem) * 0);margin:auto;border-radius:calc(infinity * 1px);content:\"\";background-color:currentColor}ax-reaction .ax-reaction-add-icon:before{width:100%;height:1.5px}ax-reaction .ax-reaction-add-icon:after{width:1.5px;height:100%}ax-reaction ax-popover{display:contents}.ax-reaction-picker-panel ax-emoji-picker{width:min(22rem,92vw);border:none;box-shadow:none;border-radius:0}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXEmojiComponent, selector: "ax-emoji", inputs: ["emoji", "appearance", "size"] }, { kind: "component", type: AXEmojiPickerComponent, selector: "ax-emoji-picker", inputs: ["items", "size", "appearance", "showSearch", "showRecent", "columns", "searchPlaceholder", "excludeCategories", "excludeCodes", "excludeUnicode", "recentItems"], outputs: ["selected", "recentChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "closeOnNavigation", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXReactionComponent, decorators: [{
             type: Component,

package/fesm2022/acorex-components-reaction.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-reaction.mjs","sources":["../../../../packages/components/reaction/src/lib/reaction.component.ts","../../../../packages/components/reaction/src/lib/reaction.component.html","../../../../packages/components/reaction/src/lib/reaction.module.ts","../../../../packages/components/reaction/src/acorex-components-reaction.ts"],"sourcesContent":["import { AXComponent } from '@acorex/cdk/common';\nimport { AXEmoji } from '@acorex/core/constants';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  effect,\n  input,\n  output,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { AXEmojiComponent } from '@acorex/components/emoji';\nimport { AXEmojiPickerComponent } from '@acorex/components/emojipicker';\nimport { AXPopoverComponent } from '@acorex/components/popover';\nimport { AXReactionItem } from './reaction.type';\n\n/**\n * Telegram-style reaction chips for chat messages.\n * Renders emojis with {@link AXEmojiComponent} and opens {@link AXEmojiPickerComponent}\n * inside {@link AXPopoverComponent} when editable.\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-reaction',\n  templateUrl: './reaction.component.html',\n  styleUrls: ['./reaction.component.css'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'ax-reaction-host',\n    '[class.ax-reaction-editable]': 'editable()',\n  },\n  imports: [AXEmojiComponent, AXEmojiPickerComponent, AXPopoverComponent],\n  providers: [{ provide: AXComponent, useExisting: AXReactionComponent }],\n})\nexport class AXReactionComponent {\n  /**\n   * Aggregated reactions to display.\n   *\n   * @defaultValue []\n   */\n  readonly items = input<readonly AXReactionItem[]>([]);\n\n  /**\n   * Rendered emoji size in pixels.\n   *\n   * @defaultValue 18\n   */\n  readonly size = input(18);\n\n  /**\n   * When true, reactions are interactive and an add button opens the emoji picker popover.\n   *\n   * @defaultValue false\n   */\n  readonly editable = input(false);\n\n  /**\n   * When true, the emoji picker popover is opened.\n   *\n   * @defaultValue false\n   */\n  readonly showPicker = input(false);\n\n  /**\n   * Emits when the user selects a new reaction or an unselected existing one.\n   */\n  readonly add = output<AXEmoji>();\n\n  /**\n   * Emits when the user removes their own reaction.\n   */\n  readonly remove = output<AXEmoji>();\n\n  private readonly pickerPopover = viewChild<AXPopoverComponent>('pickerPopover');\n\n  /** Whether the emoji picker popover is currently open. */\n  protected readonly pickerOpen = signal(false);\n\n  /** Whether the add button should appear pressed while the picker is open. */\n  protected readonly isPickerVisible = computed(() => this.showPicker() || this.pickerOpen());\n\n  constructor() {\n    effect(() => {\n      const show = this.showPicker();\n      const popover = this.pickerPopover();\n      if (!popover) {\n        return;\n      }\n\n      if (show && !popover.isOpen) {\n        void popover.open();\n      }\n    });\n  }\n\n  /** Toggles a reaction without mutating counts; parent owns state. */\n  protected onItemClick(item: AXReactionItem): void {\n    if (!this.editable()) {\n      return;\n    }\n\n    if (item.selected) {\n      this.remove.emit(item.emoji);\n      return;\n    }\n\n    this.add.emit(item.emoji);\n  }\n\n  /** Opens or closes the emoji picker popover. */\n  protected togglePicker(event?: Event): void {\n    event?.preventDefault();\n    event?.stopPropagation();\n\n    const popover = this.pickerPopover();\n    if (!popover) {\n      return;\n    }\n\n    if (popover.isOpen) {\n      popover.close();\n      return;\n    }\n\n    void popover.open();\n  }\n\n  /** Forwards a picker selection as `add` and closes the popover. */\n  protected onPickerSelected(emoji: AXEmoji): void {\n    this.add.emit(emoji);\n    this.pickerPopover()?.close();\n  }\n\n  /** Syncs the add-button pressed state when the popover opens. */\n  protected onPickerOpened(): void {\n    this.pickerOpen.set(true);\n  }\n\n  /** Syncs the add-button pressed state when the popover closes. */\n  protected onPickerClosed(): void {\n    this.pickerOpen.set(false);\n  }\n\n  /** Accessible name for an existing reaction chip. */\n  protected itemAriaLabel(item: AXReactionItem): string {\n    const selected = item.selected ? ', selected' : '';\n    return `${item.emoji.name}, ${item.count}${selected}`;\n  }\n}\n","<div class=\"ax-reaction\">\n  @for (item of items(); track item.emoji.code) {\n    <button\n      type=\"button\"\n      class=\"ax-reaction-item\"\n      [class.ax-reaction-item-selected]=\"item.selected\"\n      [class.ax-reaction-item-interactive]=\"editable()\"\n      [attr.aria-label]=\"itemAriaLabel(item)\"\n      [attr.aria-pressed]=\"item.selected ? true : null\"\n      [title]=\"item.emoji.name\"\n      (click)=\"onItemClick(item)\"\n    >\n      <ax-emoji [emoji]=\"item.emoji\" [size]=\"size()\" />\n\n      <span class=\"ax-reaction-count\">\n        {{ item.count }}\n      </span>\n    </button>\n  }\n\n  @if (editable()) {\n    <button\n      #addButton\n      type=\"button\"\n      class=\"ax-reaction-item ax-reaction-add\"\n      [class.ax-reaction-item-selected]=\"isPickerVisible()\"\n      [attr.aria-label]=\"'Add reaction'\"\n      [attr.aria-expanded]=\"isPickerVisible()\"\n      [attr.aria-haspopup]=\"true\"\n      title=\"Add reaction\"\n      (click)=\"togglePicker($event)\"\n      (mousedown)=\"$event.stopPropagation()\"\n    >\n      <span class=\"ax-reaction-add-icon\" aria-hidden=\"true\"></span>\n    </button>\n\n    <ax-popover\n      #pickerPopover\n      [target]=\"addButton\"\n      [openOn]=\"'manual'\"\n      [closeOn]=\"'clickOut'\"\n      [placement]=\"'bottom-start'\"\n      panelClass=\"ax-reaction-picker-panel\"\n      (onOpened)=\"onPickerOpened()\"\n      (onClosed)=\"onPickerClosed()\"\n    >\n      <ax-emoji-picker (selected)=\"onPickerSelected($event)\" />\n    </ax-popover>\n  }\n</div>\n","import { NgModule } from '@angular/core';\nimport { AXReactionComponent } from './reaction.component';\n\n@NgModule({\n  imports: [AXReactionComponent],\n  exports: [AXReactionComponent],\n})\nexport class AXReactionModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-reaction.mjs","sources":["../../../../packages/components/reaction/src/lib/reaction.component.ts","../../../../packages/components/reaction/src/lib/reaction.component.html","../../../../packages/components/reaction/src/lib/reaction.module.ts","../../../../packages/components/reaction/src/acorex-components-reaction.ts"],"sourcesContent":["import { AXComponent } from '@acorex/cdk/common';\nimport { AXEmoji } from '@acorex/core/constants';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  effect,\n  input,\n  output,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { AXEmojiComponent } from '@acorex/components/emoji';\nimport { AXEmojiPickerComponent } from '@acorex/components/emojipicker';\nimport { AXPopoverComponent } from '@acorex/components/popover';\nimport { AXReactionItem } from './reaction.type';\n\n/**\n * Telegram-style reaction chips for chat messages.\n * Renders emojis with {@link AXEmojiComponent} and opens {@link AXEmojiPickerComponent}\n * inside {@link AXPopoverComponent} when editable.\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-reaction',\n  templateUrl: './reaction.component.html',\n  styleUrls: ['./reaction.component.css'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'ax-reaction-host',\n    '[class.ax-reaction-editable]': 'editable()',\n  },\n  imports: [AXEmojiComponent, AXEmojiPickerComponent, AXPopoverComponent],\n  providers: [{ provide: AXComponent, useExisting: AXReactionComponent }],\n})\nexport class AXReactionComponent {\n  /**\n   * Aggregated reactions to display.\n   *\n   * @defaultValue []\n   */\n  readonly items = input<readonly AXReactionItem[]>([]);\n\n  /**\n   * Rendered emoji size in pixels.\n   *\n   * @defaultValue 18\n   */\n  readonly size = input(18);\n\n  /**\n   * When true, reactions are interactive and an add button opens the emoji picker popover.\n   *\n   * @defaultValue false\n   */\n  readonly editable = input(false);\n\n  /**\n   * When true, the emoji picker popover is opened.\n   *\n   * @defaultValue false\n   */\n  readonly showPicker = input(false);\n\n  /**\n   * Emits when the user selects a new reaction or an unselected existing one.\n   */\n  readonly add = output<AXEmoji>();\n\n  /**\n   * Emits when the user removes their own reaction.\n   */\n  readonly remove = output<AXEmoji>();\n\n  private readonly pickerPopover = viewChild<AXPopoverComponent>('pickerPopover');\n\n  /** Whether the emoji picker popover is currently open. */\n  protected readonly pickerOpen = signal(false);\n\n  /** Whether the add button should appear pressed while the picker is open. */\n  protected readonly isPickerVisible = computed(() => this.showPicker() || this.pickerOpen());\n\n  constructor() {\n    effect(() => {\n      const show = this.showPicker();\n      const popover = this.pickerPopover();\n      if (!popover) {\n        return;\n      }\n\n      if (show && !popover.isOpen) {\n        void popover.open();\n      }\n    });\n  }\n\n  /** Toggles a reaction without mutating counts; parent owns state. */\n  protected onItemClick(item: AXReactionItem): void {\n    if (!this.editable()) {\n      return;\n    }\n\n    if (item.selected) {\n      this.remove.emit(item.emoji);\n      return;\n    }\n\n    this.add.emit(item.emoji);\n  }\n\n  /** Opens or closes the emoji picker popover. */\n  protected togglePicker(event?: Event): void {\n    event?.preventDefault();\n    event?.stopPropagation();\n\n    const popover = this.pickerPopover();\n    if (!popover) {\n      return;\n    }\n\n    if (popover.isOpen) {\n      popover.close();\n      return;\n    }\n\n    void popover.open();\n  }\n\n  /** Forwards a picker selection as `add` and closes the popover. */\n  protected onPickerSelected(emoji: AXEmoji): void {\n    this.add.emit(emoji);\n    this.pickerPopover()?.close();\n  }\n\n  /** Syncs the add-button pressed state when the popover opens. */\n  protected onPickerOpened(): void {\n    this.pickerOpen.set(true);\n  }\n\n  /** Syncs the add-button pressed state when the popover closes. */\n  protected onPickerClosed(): void {\n    this.pickerOpen.set(false);\n  }\n\n  /** Accessible name for an existing reaction chip. */\n  protected itemAriaLabel(item: AXReactionItem): string {\n    const selected = item.selected ? ', selected' : '';\n    return `${item.emoji.name}, ${item.count}${selected}`;\n  }\n}\n","<div class=\"ax-reaction\">\n  @for (item of items(); track item.emoji.code) {\n    <button\n      type=\"button\"\n      class=\"ax-reaction-item\"\n      [class.ax-reaction-item-selected]=\"item.selected\"\n      [class.ax-reaction-item-interactive]=\"editable()\"\n      [attr.aria-label]=\"itemAriaLabel(item)\"\n      [attr.aria-pressed]=\"item.selected ? true : null\"\n      [title]=\"item.emoji.name\"\n      (click)=\"onItemClick(item)\"\n    >\n      <ax-emoji [emoji]=\"item.emoji\" [size]=\"size()\" />\n\n      <span class=\"ax-reaction-count\">\n        {{ item.count }}\n      </span>\n    </button>\n  }\n\n  @if (editable()) {\n    <button\n      #addButton\n      type=\"button\"\n      class=\"ax-reaction-item ax-reaction-add\"\n      [class.ax-reaction-item-selected]=\"isPickerVisible()\"\n      [attr.aria-label]=\"'Add reaction'\"\n      [attr.aria-expanded]=\"isPickerVisible()\"\n      [attr.aria-haspopup]=\"true\"\n      title=\"Add reaction\"\n      (click)=\"togglePicker($event)\"\n      (mousedown)=\"$event.stopPropagation()\"\n    >\n      <span class=\"ax-reaction-add-icon\" aria-hidden=\"true\"></span>\n    </button>\n\n    <ax-popover\n      #pickerPopover\n      [target]=\"addButton\"\n      [openOn]=\"'manual'\"\n      [closeOn]=\"'clickOut'\"\n      [placement]=\"'bottom-start'\"\n      panelClass=\"ax-reaction-picker-panel\"\n      (onOpened)=\"onPickerOpened()\"\n      (onClosed)=\"onPickerClosed()\"\n    >\n      <ax-emoji-picker (selected)=\"onPickerSelected($event)\" />\n    </ax-popover>\n  }\n</div>\n","import { NgModule } from '@angular/core';\nimport { AXReactionComponent } from './reaction.component';\n\n@NgModule({\n  imports: [AXReactionComponent],\n  exports: [AXReactionComponent],\n})\nexport class AXReactionModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}