@vadem/ui 0.0.0-stage → 0.0.1

package/fesm2022/vadem-ui-character-count.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"vadem-ui-character-count.mjs","names":[],"sources":["../../../projects/ui/character-count/src/core/character-count.ts","../../../projects/ui/character-count/src/character-count.ts"],"sourcesContent":["/** UTF-16 units deliberately match native maxlength and Angular's maxLength validator. */\nexport function vdCharacterCount(value: string, maximum: number | null) {\n  const limit =\n    maximum !== null && Number.isFinite(maximum) && maximum >= 0 ? Math.floor(maximum) : null;\n  const used = value.length;\n  const remaining = limit === null ? null : limit - used;\n  const state =\n    remaining === null\n      ? 'unlimited'\n      : remaining < 0\n        ? 'over'\n        : remaining === 0\n          ? 'limit'\n          : 'within';\n  return { used, limit, remaining, state } as const;\n}\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  ViewEncapsulation,\n  computed,\n  effect,\n  inject,\n  input,\n  signal,\n} from '@angular/core';\nimport { vdUniqueId } from '@vadem/ui/field';\nimport { VdIcon } from '@vadem/ui/icon';\nimport { vdTexts } from '@vadem/ui/locale';\nimport { vdCharacterCount } from './core/character-count';\n\n/** Advisory text length; validation, native value binding and IME remain application-owned. */\n@Component({\n  selector: 'vd-character-count',\n  imports: [VdIcon],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'vd-character-count', '[attr.data-state]': 'count().state' },\n  template: `\n    <span class=\"vd-character-count__content\" [id]=\"descriptionId()\">\n      <bdi class=\"vd-character-count__used\" [attr.dir]=\"count().limit === null ? 'auto' : 'ltr'\">{{\n        t().countText(count().used, count().limit)\n      }}</bdi>\n      @if (message()) {\n        <span class=\"vd-character-count__message\">\n          @if (count().state === 'over') {\n            <vd-icon name=\"alert-circle\" />\n          }\n          <span>{{ message() }}</span>\n        </span>\n      }\n    </span>\n    <span class=\"vd-visually-hidden\" role=\"status\" aria-atomic=\"true\">{{ announcement() }}</span>\n  `,\n})\nexport class VdCharacterCount {\n  readonly value = input('');\n  readonly maxLength = input<number | null>(null);\n  readonly descriptionId = input(vdUniqueId('vd-character-count'));\n  readonly controlId = input<string>();\n  readonly countText = input<(used: number, limit: number | null) => string>();\n  readonly remainingText = input<(remaining: number) => string>();\n  readonly overText = input<(excess: number) => string>();\n  readonly limitText = input<string>();\n  protected readonly t = vdTexts('characterCount', {\n    countText: this.countText,\n    remainingText: this.remainingText,\n    overText: this.overText,\n    limitText: this.limitText,\n  });\n  protected readonly count = computed(() => vdCharacterCount(this.value(), this.maxLength()));\n  protected readonly message = computed(() => {\n    const { remaining } = this.count();\n    return remaining === null\n      ? ''\n      : remaining < 0\n        ? this.t().overText(-remaining)\n        : remaining === 0\n          ? this.t().limitText\n          : this.t().remainingText(remaining);\n  });\n  protected readonly announcement = signal('');\n  private readonly host: HTMLElement = inject(ElementRef).nativeElement;\n\n  constructor() {\n    let initial = true;\n    effect((onCleanup) => {\n      const id = this.controlId();\n      const { used, limit } = this.count();\n      const text = [this.t().countText(used, limit), this.message()].filter(Boolean).join('. ');\n      if (initial) {\n        initial = false;\n        return;\n      }\n      this.announcement.set('');\n      const view = this.host.ownerDocument.defaultView;\n      if (!id || !view) return;\n      const editable =\n        'input:not(:disabled):not([readonly]), textarea:not(:disabled):not([readonly])';\n      const control = this.host.ownerDocument.activeElement;\n      if (control?.id !== id || !control.matches(editable)) return;\n      const timer = view.setTimeout(() => {\n        if (this.host.ownerDocument.activeElement === control && control.matches(editable))\n          this.announcement.set(text);\n      }, 1000);\n      onCleanup(() => view.clearTimeout(timer));\n    });\n  }\n}\n"],"mappings":"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"}