ng-hub-ui-forms 22.31.0 → 22.32.0

package/fesm2022/ng-hub-ui-forms.mjs

@@ -4,7 +4,7 @@ import * as i1 from '@angular/forms';
 import { FormControl, FormControlName, FormControlDirective, Validators, NgControl, ControlContainer, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { Observable, Subject, takeUntil, tap, animationFrameScheduler, asapScheduler, fromEvent } from 'rxjs';
 import { NgTemplateOutlet, KeyValuePipe, isPlatformBrowser, DOCUMENT, formatDate } from '@angular/common';
-import { HubTooltipDirective, resolveHubAccent, OverlayService, HUB_DROPDOWN_POSITIONS } from 'ng-hub-ui-utils';
+import { HubTooltipDirective, resolveHubAccent, OverlayService, HUB_DROPDOWN_POSITIONS, readableOn, toHex, parseColor } from 'ng-hub-ui-utils';
 import { auditTime, tap as tap$1, debounceTime, filter, map } from 'rxjs/operators';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { DomSanitizer } from '@angular/platform-browser';
@@ -9445,41 +9445,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
         }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], maxSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSize", required: false }] }], minSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "minSize", required: false }] }], maxTotalSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxTotalSize", required: false }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], dragDrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "dragDrop", required: false }] }], paste: [{ type: i0.Input, args: [{ isSignal: true, alias: "paste", required: false }] }], preview: [{ type: i0.Input, args: [{ isSignal: true, alias: "preview", required: false }] }], allowDuplicates: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowDuplicates", required: false }] }], capture: [{ type: i0.Input, args: [{ isSignal: true, alias: "capture", required: false }] }], autoUpload: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoUpload", required: false }] }], buttonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonLabel", required: false }] }], dropText: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropText", required: false }] }], dropSubtext: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropSubtext", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], classlist: [{ type: i0.Input, args: [{ isSignal: true, alias: "classlist", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], rejected: [{ type: i0.Output, args: ["rejected"] }], fileRemoved: [{ type: i0.Output, args: ["fileRemoved"] }], uploadStateChange: [{ type: i0.Output, args: ["uploadStateChange"] }], nativeInput: [{ type: i0.ViewChild, args: ['nativeInput', { isSignal: true }] }], iconTpt: [{ type: i0.ContentChild, args: [i0.forwardRef(() => HubFileIconDirective), { isSignal: true }] }], previewTpt: [{ type: i0.ContentChild, args: [i0.forwardRef(() => HubFilePreviewDirective), { isSignal: true }] }], noticeTpt: [{ type: i0.ContentChild, args: [i0.forwardRef(() => HubFileDropzoneNoticeDirective), { isSignal: true }] }] } });
 
 /**
- * Inverts a HEX color, or returns the best contrasting black/white when `bw` is enabled.
+ * Inverts a colour, or returns the best contrasting black/white when `bw` is enabled.
  */
 class HubInvertColorPipe {
     /**
-     * @param hex - HEX color (`#rgb` or `#rrggbb`).
-     * @param bw - When `true`, returns `#000000` or `#FFFFFF` for maximum contrast.
-     * @returns The inverted (or contrasting) HEX color.
-     */
-    transform(hex, bw = false) {
-        if (!hex) {
+     * @param color - Any CSS colour: hex (3/4/6/8 digits, `#` optional), `rgb()`, `hsl()`,
+     * `oklch()`, `oklab()` or a named colour.
+     * @param bw - When `true`, returns the black or white that reads best on `color`.
+     * @param metric - How `bw` decides. `'lightness'` (default) matches the
+     * `--hub-sys-color-*-on` design-system token; `'apca'` and `'wcag'` score the two
+     * candidates instead.
+     * @returns The inverted (or contrasting) colour as a hex string, or `#000000` when the
+     * input is empty or is not a colour this can resolve.
+     */
+    transform(color, bw = false, metric = 'lightness') {
+        const rgb = this.resolve(color);
+        if (!rgb) {
             return '#000000';
         }
-        if (hex.indexOf('#') === 0) {
-            hex = hex.slice(1);
-        }
-        // Convert 3-digit hex to 6-digits.
-        if (hex.length === 3) {
-            hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
+        if (bw) {
+            return readableOn(rgb, metric);
         }
-        if (hex.length !== 6) {
-            throw new Error('Invalid HEX color.');
+        return toHex({ r: 255 - rgb.r, g: 255 - rgb.g, b: 255 - rgb.b, a: rgb.a });
+    }
+    /**
+     * Resolves the input, retrying with a `#` prefix so bare hex digits keep working — the
+     * pipe has accepted `'336699'` since it shipped and consumers rely on it.
+     */
+    resolve(color) {
+        if (!color) {
+            return null;
         }
-        let r = parseInt(hex.slice(0, 2), 16);
-        let g = parseInt(hex.slice(2, 4), 16);
-        let b = parseInt(hex.slice(4, 6), 16);
-        if (bw) {
-            // http://stackoverflow.com/a/3943023/112731
-            return r * 0.299 + g * 0.587 + b * 0.114 > 186 ? '#000000' : '#FFFFFF';
-        }
-        // Invert color components.
-        r = (255 - r).toString(16);
-        g = (255 - g).toString(16);
-        b = (255 - b).toString(16);
-        // Pad each with zeros and return.
-        return '#' + r.padStart(2, '0') + g.padStart(2, '0') + b.padStart(2, '0');
+        return parseColor(color) ?? parseColor(`#${color}`);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: HubInvertColorPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
     static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: HubInvertColorPipe, isStandalone: true, name: "hubInvertColor" });