@xui/rate 2.0.0-alpha.20 → 2.0.0-alpha.21

package/fesm2022/xui-rate.mjs

@@ -18,17 +18,28 @@ import { XuiIcon } from '@xui/icon';
  */
 class XuiRate {
     direction = injectXDirection();
+    /** Extra classes, merged into the component's own rather than replacing them. */
     class = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
     /** Names the control. Defaults to "Rating" so the slider is never anonymous. */
     ariaLabel = input(null, { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
+    /**
+     * The rating, from `0` to `count`. Halves are only reachable with `allowHalf`. Two-way bindable with `[(value)]`.
+     */
     value = model(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** How many stars there are, and so the maximum value. */
     count = input(5, { ...(ngDevMode ? { debugName: "count" } : /* istanbul ignore next */ {}), transform: numberAttribute });
+    /** Let a star be half-filled, halving the step for both clicks and arrow keys. */
     allowHalf = input(false, { ...(ngDevMode ? { debugName: "allowHalf" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /** Clicking the current value again resets it to 0. */
     allowClear = input(true, { ...(ngDevMode ? { debugName: "allowClear" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Show the rating without letting it be changed. Unlike `disabled`, it stays at full contrast — for displaying
+     * someone else's rating.
+     */
     readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Block interaction and dim the stars. */
     disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /** Star size in pixels. */
     starSize = input(20, { ...(ngDevMode ? { debugName: "starSize" } : /* istanbul ignore next */ {}), transform: numberAttribute });

package/fesm2022/xui-rate.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"xui-rate.mjs","sources":["../../../../../../libs/ui/rate/xui/src/lib/rate.ts","../../../../../../libs/ui/rate/xui/src/index.ts","../../../../../../libs/ui/rate/xui/src/xui-rate.ts"],"sourcesContent":["import { BooleanInput, NumberInput } from '@angular/cdk/coercion';\nimport {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n  model,\n  numberAttribute,\n  signal,\n  ViewEncapsulation\n} from '@angular/core';\nimport type { ControlValueAccessor } from '@angular/forms';\nimport { NgIcon, provideIcons } from '@ng-icons/core';\nimport { matStarRound } from '@ng-icons/material-icons/round';\nimport { xui } from '@xui/core';\nimport { arrowValueDirection, injectXDirection } from '@xui/core/a11y';\nimport { createXValueAccessor, provideXValueAccessor } from '@xui/core/forms';\nimport { XuiIcon } from '@xui/icon';\nimport type { ClassValue } from 'clsx';\n\n/**\n * A star-rating input. Two-way bindable `value`; supports `allowHalf`,\n * `allowClear` (click the current value to reset), `readonly`/`disabled`, hover\n * preview and arrow-key adjustment.\n *\n * ```html\n * <xui-rate [(value)]=\"score\" allowHalf />\n * ```\n */\n@Component({\n  selector: 'xui-rate',\n  // eslint-disable-next-line local/no-hand-z-index -- half-star hit areas layer above the star glyph inside the control\n  template: `\n    @for (star of stars(); track star) {\n      <span class=\"relative inline-block\" [style.width.px]=\"starPx()\" [style.height.px]=\"starPx()\">\n        <!-- empty base -->\n        <ng-icon xui [size]=\"starPx() + 'px'\" color=\"subtle\" name=\"matStarRound\" class=\"absolute inset-0\" />\n        <!-- filled overlay, clipped to the fill fraction -->\n        <span class=\"absolute inset-0 overflow-hidden\" [style.width.%]=\"fillPercent(star)\">\n          <ng-icon\n            xui\n            [size]=\"starPx() + 'px'\"\n            color=\"warning\"\n            name=\"matStarRound\"\n            class=\"absolute inset-y-0 start-0\"\n          />\n        </span>\n        @if (!readonly() && !isDisabled()) {\n          @if (allowHalf()) {\n            <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n            <span\n              class=\"absolute inset-y-0 start-0 z-10 w-1/2 cursor-pointer\"\n              (click)=\"pick(star - 0.5)\"\n              (mouseenter)=\"hover.set(star - 0.5)\"\n            ></span>\n          }\n          <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n          <span\n            class=\"absolute inset-y-0 end-0 z-10 cursor-pointer\"\n            [class]=\"allowHalf() ? 'w-1/2' : 'w-full'\"\n            (click)=\"pick(star)\"\n            (mouseenter)=\"hover.set(star)\"\n          ></span>\n        }\n      </span>\n    }\n  `,\n  host: {\n    '[class]': 'computedClass()',\n    role: 'slider',\n    '[attr.aria-label]': 'effectiveAriaLabel()',\n    '[attr.aria-valuemin]': '0',\n    '[attr.aria-valuemax]': 'count()',\n    '[attr.aria-valuenow]': 'value()',\n    '[attr.aria-valuetext]': 'valueText()',\n    '[attr.aria-readonly]': 'readonly() || null',\n    '[attr.aria-disabled]': 'isDisabled() || null',\n    '[attr.tabindex]': 'readonly() || isDisabled() ? null : 0',\n    '(keydown)': 'onKeydown($event)',\n    '(mouseleave)': 'hover.set(null)',\n    '(blur)': 'cva.markTouched()'\n  },\n  imports: [NgIcon, XuiIcon],\n  providers: [provideXValueAccessor(() => XuiRate)],\n  viewProviders: [provideIcons({ matStarRound })],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None\n})\nexport class XuiRate implements ControlValueAccessor {\n  protected readonly direction = injectXDirection();\n\n  readonly class = input<ClassValue>('');\n\n  /** Names the control. Defaults to \"Rating\" so the slider is never anonymous. */\n  readonly ariaLabel = input<string | null>(null, { alias: 'aria-label' });\n\n  readonly value = model<number>(0);\n  readonly count = input<number, NumberInput>(5, { transform: numberAttribute });\n  readonly allowHalf = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n  /** Clicking the current value again resets it to 0. */\n  readonly allowClear = input<boolean, BooleanInput>(true, { transform: booleanAttribute });\n  readonly readonly = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n  readonly disabled = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n  /** Star size in pixels. */\n  readonly starSize = input<number, NumberInput>(20, { transform: numberAttribute });\n\n  protected readonly cva = createXValueAccessor<number>({\n    onWrite: value => this.value.set(value ?? 0),\n    disabled: this.disabled\n  });\n  protected readonly isDisabled = this.cva.disabled;\n\n  protected readonly hover = signal<number | null>(null);\n\n  protected readonly effectiveAriaLabel = computed(() => this.ariaLabel() ?? 'Rating');\n\n  /** A bare number tells a screen-reader user nothing about the scale. */\n  protected readonly valueText = computed(() => `${this.value()} of ${this.count()}`);\n\n  protected readonly stars = computed(() => Array.from({ length: this.count() }, (_, i) => i + 1));\n  protected readonly starPx = computed(() => this.starSize());\n  private readonly display = computed(() => this.hover() ?? this.value());\n\n  protected fillPercent(star: number): number {\n    const display = this.display();\n    if (display >= star) {\n      return 100;\n    }\n    if (display >= star - 0.5) {\n      return 50;\n    }\n    return 0;\n  }\n\n  protected pick(next: number): void {\n    if (this.readonly() || this.isDisabled()) {\n      return;\n    }\n    this.commit(this.allowClear() && next === this.value() ? 0 : next);\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    if (this.readonly() || this.isDisabled()) {\n      return;\n    }\n    const step = this.allowHalf() ? 0.5 : 1;\n    const arrow = arrowValueDirection(event.key, this.direction());\n    if (!arrow) {\n      return;\n    }\n\n    const next = arrow === 'increase' ? Math.min(this.count(), this.value() + step) : Math.max(0, this.value() - step);\n\n    event.preventDefault();\n    this.commit(next);\n  }\n\n  /** Store and notify — the single write path for every user interaction. */\n  private commit(next: number): void {\n    this.value.set(next);\n    this.cva.notifyChange(next);\n  }\n\n  protected readonly computedClass = computed(() =>\n    xui(\n      'inline-flex items-center gap-1 rounded',\n      (this.readonly() || this.isDisabled()) && 'cursor-default',\n      this.isDisabled() && 'opacity-50',\n      this.class()\n    )\n  );\n\n  readonly writeValue = this.cva.writeValue;\n  readonly registerOnChange = this.cva.registerOnChange;\n  readonly registerOnTouched = this.cva.registerOnTouched;\n  readonly setDisabledState = this.cva.setDisabledState;\n}\n","import { XuiRate } from './lib/rate';\n\nexport * from './lib/rate';\n\nexport const XuiRateImports = [XuiRate] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"xui-rate.mjs","sources":["../../../../../../libs/ui/rate/xui/src/lib/rate.ts","../../../../../../libs/ui/rate/xui/src/index.ts","../../../../../../libs/ui/rate/xui/src/xui-rate.ts"],"sourcesContent":["import { BooleanInput, NumberInput } from '@angular/cdk/coercion';\nimport {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n  model,\n  numberAttribute,\n  signal,\n  ViewEncapsulation\n} from '@angular/core';\nimport type { ControlValueAccessor } from '@angular/forms';\nimport { NgIcon, provideIcons } from '@ng-icons/core';\nimport { matStarRound } from '@ng-icons/material-icons/round';\nimport { xui } from '@xui/core';\nimport { arrowValueDirection, injectXDirection } from '@xui/core/a11y';\nimport { createXValueAccessor, provideXValueAccessor } from '@xui/core/forms';\nimport { XuiIcon } from '@xui/icon';\nimport type { ClassValue } from 'clsx';\n\n/**\n * A star-rating input. Two-way bindable `value`; supports `allowHalf`,\n * `allowClear` (click the current value to reset), `readonly`/`disabled`, hover\n * preview and arrow-key adjustment.\n *\n * ```html\n * <xui-rate [(value)]=\"score\" allowHalf />\n * ```\n */\n@Component({\n  selector: 'xui-rate',\n  // eslint-disable-next-line local/no-hand-z-index -- half-star hit areas layer above the star glyph inside the control\n  template: `\n    @for (star of stars(); track star) {\n      <span class=\"relative inline-block\" [style.width.px]=\"starPx()\" [style.height.px]=\"starPx()\">\n        <!-- empty base -->\n        <ng-icon xui [size]=\"starPx() + 'px'\" color=\"subtle\" name=\"matStarRound\" class=\"absolute inset-0\" />\n        <!-- filled overlay, clipped to the fill fraction -->\n        <span class=\"absolute inset-0 overflow-hidden\" [style.width.%]=\"fillPercent(star)\">\n          <ng-icon\n            xui\n            [size]=\"starPx() + 'px'\"\n            color=\"warning\"\n            name=\"matStarRound\"\n            class=\"absolute inset-y-0 start-0\"\n          />\n        </span>\n        @if (!readonly() && !isDisabled()) {\n          @if (allowHalf()) {\n            <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n            <span\n              class=\"absolute inset-y-0 start-0 z-10 w-1/2 cursor-pointer\"\n              (click)=\"pick(star - 0.5)\"\n              (mouseenter)=\"hover.set(star - 0.5)\"\n            ></span>\n          }\n          <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n          <span\n            class=\"absolute inset-y-0 end-0 z-10 cursor-pointer\"\n            [class]=\"allowHalf() ? 'w-1/2' : 'w-full'\"\n            (click)=\"pick(star)\"\n            (mouseenter)=\"hover.set(star)\"\n          ></span>\n        }\n      </span>\n    }\n  `,\n  host: {\n    '[class]': 'computedClass()',\n    role: 'slider',\n    '[attr.aria-label]': 'effectiveAriaLabel()',\n    '[attr.aria-valuemin]': '0',\n    '[attr.aria-valuemax]': 'count()',\n    '[attr.aria-valuenow]': 'value()',\n    '[attr.aria-valuetext]': 'valueText()',\n    '[attr.aria-readonly]': 'readonly() || null',\n    '[attr.aria-disabled]': 'isDisabled() || null',\n    '[attr.tabindex]': 'readonly() || isDisabled() ? null : 0',\n    '(keydown)': 'onKeydown($event)',\n    '(mouseleave)': 'hover.set(null)',\n    '(blur)': 'cva.markTouched()'\n  },\n  imports: [NgIcon, XuiIcon],\n  providers: [provideXValueAccessor(() => XuiRate)],\n  viewProviders: [provideIcons({ matStarRound })],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None\n})\nexport class XuiRate implements ControlValueAccessor {\n  protected readonly direction = injectXDirection();\n\n  /** Extra classes, merged into the component's own rather than replacing them. */\n  readonly class = input<ClassValue>('');\n\n  /** Names the control. Defaults to \"Rating\" so the slider is never anonymous. */\n  readonly ariaLabel = input<string | null>(null, { alias: 'aria-label' });\n\n  /**\n   * The rating, from `0` to `count`. Halves are only reachable with `allowHalf`. Two-way bindable with `[(value)]`.\n   */\n  readonly value = model<number>(0);\n  /** How many stars there are, and so the maximum value. */\n  readonly count = input<number, NumberInput>(5, { transform: numberAttribute });\n  /** Let a star be half-filled, halving the step for both clicks and arrow keys. */\n  readonly allowHalf = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n  /** Clicking the current value again resets it to 0. */\n  readonly allowClear = input<boolean, BooleanInput>(true, { transform: booleanAttribute });\n  /**\n   * Show the rating without letting it be changed. Unlike `disabled`, it stays at full contrast — for displaying\n   * someone else's rating.\n   */\n  readonly readonly = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n  /** Block interaction and dim the stars. */\n  readonly disabled = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n  /** Star size in pixels. */\n  readonly starSize = input<number, NumberInput>(20, { transform: numberAttribute });\n\n  protected readonly cva = createXValueAccessor<number>({\n    onWrite: value => this.value.set(value ?? 0),\n    disabled: this.disabled\n  });\n  protected readonly isDisabled = this.cva.disabled;\n\n  protected readonly hover = signal<number | null>(null);\n\n  protected readonly effectiveAriaLabel = computed(() => this.ariaLabel() ?? 'Rating');\n\n  /** A bare number tells a screen-reader user nothing about the scale. */\n  protected readonly valueText = computed(() => `${this.value()} of ${this.count()}`);\n\n  protected readonly stars = computed(() => Array.from({ length: this.count() }, (_, i) => i + 1));\n  protected readonly starPx = computed(() => this.starSize());\n  private readonly display = computed(() => this.hover() ?? this.value());\n\n  protected fillPercent(star: number): number {\n    const display = this.display();\n    if (display >= star) {\n      return 100;\n    }\n    if (display >= star - 0.5) {\n      return 50;\n    }\n    return 0;\n  }\n\n  protected pick(next: number): void {\n    if (this.readonly() || this.isDisabled()) {\n      return;\n    }\n    this.commit(this.allowClear() && next === this.value() ? 0 : next);\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    if (this.readonly() || this.isDisabled()) {\n      return;\n    }\n    const step = this.allowHalf() ? 0.5 : 1;\n    const arrow = arrowValueDirection(event.key, this.direction());\n    if (!arrow) {\n      return;\n    }\n\n    const next = arrow === 'increase' ? Math.min(this.count(), this.value() + step) : Math.max(0, this.value() - step);\n\n    event.preventDefault();\n    this.commit(next);\n  }\n\n  /** Store and notify — the single write path for every user interaction. */\n  private commit(next: number): void {\n    this.value.set(next);\n    this.cva.notifyChange(next);\n  }\n\n  protected readonly computedClass = computed(() =>\n    xui(\n      'inline-flex items-center gap-1 rounded',\n      (this.readonly() || this.isDisabled()) && 'cursor-default',\n      this.isDisabled() && 'opacity-50',\n      this.class()\n    )\n  );\n\n  readonly writeValue = this.cva.writeValue;\n  readonly registerOnChange = this.cva.registerOnChange;\n  readonly registerOnTouched = this.cva.registerOnTouched;\n  readonly setDisabledState = this.cva.setDisabledState;\n}\n","import { XuiRate } from './lib/rate';\n\nexport * from './lib/rate';\n\nexport const XuiRateImports = [XuiRate] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xui/rate",
-  "version": "2.0.0-alpha.20",
+  "version": "2.0.0-alpha.21",
   "description": "Modern Angular 22 UI Library based on TailwindCSS",
   "keywords": [
     "angular",
@@ -41,8 +41,8 @@
     "@angular/forms": "22",
     "@ng-icons/core": "34",
     "@ng-icons/material-icons": "34",
-    "@xui/core": "2.0.0-alpha.20",
-    "@xui/icon": "2.0.0-alpha.20",
+    "@xui/core": "2.0.0-alpha.21",
+    "@xui/icon": "2.0.0-alpha.21",
     "clsx": "^2.1.1"
   },
   "publishConfig": {

package/types/xui-rate.d.ts

@@ -16,15 +16,26 @@ import { ClassValue } from 'clsx';
  */
 declare class XuiRate implements ControlValueAccessor {
     protected readonly direction: _angular_core.Signal<_xui_core_a11y.XDirection>;
+    /** Extra classes, merged into the component's own rather than replacing them. */
     readonly class: _angular_core.InputSignal<ClassValue>;
     /** Names the control. Defaults to "Rating" so the slider is never anonymous. */
     readonly ariaLabel: _angular_core.InputSignal<string | null>;
+    /**
+     * The rating, from `0` to `count`. Halves are only reachable with `allowHalf`. Two-way bindable with `[(value)]`.
+     */
     readonly value: _angular_core.ModelSignal<number>;
+    /** How many stars there are, and so the maximum value. */
     readonly count: _angular_core.InputSignalWithTransform<number, NumberInput>;
+    /** Let a star be half-filled, halving the step for both clicks and arrow keys. */
     readonly allowHalf: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /** Clicking the current value again resets it to 0. */
     readonly allowClear: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Show the rating without letting it be changed. Unlike `disabled`, it stays at full contrast — for displaying
+     * someone else's rating.
+     */
     readonly readonly: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** Block interaction and dim the stars. */
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /** Star size in pixels. */
     readonly starSize: _angular_core.InputSignalWithTransform<number, NumberInput>;