@neural-ui/core 1.2.1 → 1.3.0

package/fesm2022/neural-ui-core-color-picker.mjs

@@ -0,0 +1,435 @@
+import * as i0 from '@angular/core';
+import { input, output, signal, inject, ElementRef, effect, computed, forwardRef, HostListener, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+
+/** Parse hex → { r, g, b } */
+function hexToRgb(hex) {
+    const clean = hex.replace('#', '').padEnd(6, '0');
+    if (!/^[0-9a-fA-F]{6}$/.test(clean))
+        return null;
+    return {
+        r: parseInt(clean.slice(0, 2), 16),
+        g: parseInt(clean.slice(2, 4), 16),
+        b: parseInt(clean.slice(4, 6), 16),
+    };
+}
+function rgbToHex(r, g, b) {
+    return ('#' +
+        [r, g, b]
+            .map((v) => Math.round(Math.max(0, Math.min(255, v)))
+            .toString(16)
+            .padStart(2, '0'))
+            .join(''));
+}
+function rgbToHsl(r, g, b) {
+    const _r = r / 255, _g = g / 255, _b = b / 255;
+    const max = Math.max(_r, _g, _b), min = Math.min(_r, _g, _b);
+    let h = 0, s = 0;
+    const l = (max + min) / 2;
+    if (max !== min) {
+        const d = max - min;
+        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+        switch (max) {
+            case _r:
+                h = ((_g - _b) / d + (_g < _b ? 6 : 0)) / 6;
+                break;
+            case _g:
+                h = ((_b - _r) / d + 2) / 6;
+                break;
+            case _b:
+                h = ((_r - _g) / d + 4) / 6;
+                break;
+        }
+    }
+    return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) };
+}
+function rgbToHsv(r, g, b) {
+    const _r = r / 255, _g = g / 255, _b = b / 255;
+    const max = Math.max(_r, _g, _b), min = Math.min(_r, _g, _b);
+    const v = max;
+    const s = max === 0 ? 0 : (max - min) / max;
+    let h = 0;
+    if (max !== min) {
+        const d = max - min;
+        switch (max) {
+            case _r:
+                h = ((_g - _b) / d + (_g < _b ? 6 : 0)) / 6;
+                break;
+            case _g:
+                h = ((_b - _r) / d + 2) / 6;
+                break;
+            case _b:
+                h = ((_r - _g) / d + 4) / 6;
+                break;
+        }
+    }
+    return { h: Math.round(h * 360), s: Math.round(s * 100), v: Math.round(v * 100) };
+}
+function hsvToHex(h, s, v) {
+    const _s = s / 100, _v = v / 100;
+    const f = (n) => {
+        const k = (n + h / 60) % 6;
+        const val = _v - _v * _s * Math.max(0, Math.min(k, 4 - k, 1));
+        return Math.round(val * 255)
+            .toString(16)
+            .padStart(2, '0');
+    };
+    return `#${f(5)}${f(3)}${f(1)}`;
+}
+function hslToHex(h, s, l) {
+    const _s = s / 100, _l = l / 100;
+    const a = _s * Math.min(_l, 1 - _l);
+    const f = (n) => {
+        const k = (n + h / 30) % 12;
+        const color = _l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+        return Math.round(255 * color)
+            .toString(16)
+            .padStart(2, '0');
+    };
+    return `#${f(0)}${f(8)}${f(4)}`;
+}
+let _seq = 0;
+/**
+ * NeuralUI ColorPicker
+ *
+ * Selector de color con swatch, hue slider y modos hex/rgb/hsl. CVA.
+ *
+ * Uso:
+ *   <neu-color-picker [formControl]="colorCtrl" mode="hex" />
+ */
+class NeuColorPickerComponent {
+    // ── Inputs / Outputs ────────────────────────────────────────────
+    mode = input('hex', ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
+    /** Emitido al cambiar el color / Emitted when color changes */
+    colorChange = output();
+    // ── Internal state ───────────────────────────────────────────────
+    _id = `neu-cp-${++_seq}`;
+    _modes = ['hex', 'rgb', 'hsl'];
+    _swatches = [
+        '#ef4444',
+        '#f97316',
+        '#eab308',
+        '#22c55e',
+        '#10b981',
+        '#06b6d4',
+        '#3b82f6',
+        '#6366f1',
+        '#a855f7',
+        '#ec4899',
+    ];
+    _isOpen = signal(false, ...(ngDevMode ? [{ debugName: "_isOpen" }] : /* istanbul ignore next */ []));
+    _cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "_cvaDisabled" }] : /* istanbul ignore next */ []));
+    _hue = signal(210, ...(ngDevMode ? [{ debugName: "_hue" }] : /* istanbul ignore next */ []));
+    _sv = signal({ s: 80, v: 90 }, ...(ngDevMode ? [{ debugName: "_sv" }] : /* istanbul ignore next */ []));
+    _activeMode = signal('hex', ...(ngDevMode ? [{ debugName: "_activeMode" }] : /* istanbul ignore next */ []));
+    _dragging = false;
+    _onChange = () => { };
+    _onTouched = () => { };
+    _el = inject((ElementRef));
+    constructor() {
+        // Sync mode input → internal active mode
+        effect(() => {
+            this._activeMode.set(this.mode());
+        });
+    }
+    // ── Close on outside click ─────────────────────────────────────
+    _outsideClick(e) {
+        if (!this._el.nativeElement.contains(e.target)) {
+            this._isOpen.set(false);
+        }
+    }
+    // ── Computed ──────────────────────────────────────────────────
+    _hexValue = computed(() => hsvToHex(this._hue(), this._sv().s, this._sv().v), ...(ngDevMode ? [{ debugName: "_hexValue" }] : /* istanbul ignore next */ []));
+    _textValue = computed(() => {
+        const hex = this._hexValue();
+        const rgb = hexToRgb(hex);
+        if (!rgb)
+            return hex;
+        switch (this._activeMode()) {
+            case 'rgb':
+                return `rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`;
+            case 'hsl': {
+                const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);
+                return `hsl(${hsl.h}, ${hsl.s}%, ${hsl.l}%)`;
+            }
+            default:
+                return hex;
+        }
+    }, ...(ngDevMode ? [{ debugName: "_textValue" }] : /* istanbul ignore next */ []));
+    // ── Canvas interactions ───────────────────────────────────────
+    _canvasDown(e) {
+        this._dragging = true;
+        e.currentTarget.setPointerCapture(e.pointerId);
+        this._updateFromCanvas(e);
+    }
+    _canvasDrag(e) {
+        if (!this._dragging)
+            return;
+        this._updateFromCanvas(e);
+    }
+    _canvasUp(e) {
+        this._dragging = false;
+        e.currentTarget.releasePointerCapture(e.pointerId);
+    }
+    _updateFromCanvas(e) {
+        const rect = e.currentTarget.getBoundingClientRect();
+        const s = Math.round(Math.max(0, Math.min(1, (e.clientX - rect.left) / rect.width)) * 100);
+        const v = Math.round(Math.max(0, Math.min(1, 1 - (e.clientY - rect.top) / rect.height)) * 100);
+        this._sv.set({ s, v });
+        this._emit();
+    }
+    // ── Event handlers ────────────────────────────────────────────
+    _toggle() {
+        this._isOpen.update((v) => !v);
+    }
+    _onHueChange(v) {
+        this._hue.set(Number(v));
+        this._emit();
+    }
+    _pickSwatch(hex) {
+        this._applyHex(hex);
+        this._emit();
+    }
+    _onTextChange(text) {
+        const t = text.trim();
+        if (t.startsWith('#')) {
+            this._applyHex(t);
+        }
+        else if (t.startsWith('rgb')) {
+            const m = t.match(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/);
+            if (m)
+                this._applyHex(rgbToHex(+m[1], +m[2], +m[3]));
+        }
+        else if (t.startsWith('hsl')) {
+            const m = t.match(/hsl\((\d+),\s*(\d+)%?,\s*(\d+)%?\)/);
+            if (m)
+                this._applyHex(hslToHex(+m[1], +m[2], +m[3]));
+        }
+        this._emit();
+    }
+    // ── Helpers ───────────────────────────────────────────────────
+    _applyHex(hex) {
+        const rgb = hexToRgb(hex);
+        if (!rgb)
+            return;
+        const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);
+        this._hue.set(hsv.h);
+        this._sv.set({ s: hsv.s, v: hsv.v });
+    }
+    _emit() {
+        const val = this._textValue();
+        this._onChange(val);
+        this.colorChange.emit(val);
+    }
+    // ── CVA ──────────────────────────────────────────────────────
+    writeValue(val) {
+        if (!val)
+            return;
+        this._onTextChange(val);
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(d) {
+        this._cvaDisabled.set(d);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuColorPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NeuColorPickerComponent, isStandalone: true, selector: "neu-color-picker", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { colorChange: "colorChange" }, host: { listeners: { "document:mousedown": "_outsideClick($event)" }, properties: { "class.neu-cp--open": "_isOpen()", "class.neu-cp--disabled": "_cvaDisabled()" }, classAttribute: "neu-cp" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => NeuColorPickerComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: `
+    <!-- Swatch trigger -->
+    <button
+      type="button"
+      class="neu-cp__trigger"
+      [attr.aria-expanded]="_isOpen()"
+      [attr.aria-label]="'Color: ' + _hexValue()"
+      [disabled]="_cvaDisabled()"
+      (click)="_toggle()"
+    >
+      <span class="neu-cp__swatch" [style.background]="_hexValue()"></span>
+      <span class="neu-cp__hex-label">{{ _hexValue() }}</span>
+    </button>
+
+    @if (_isOpen()) {
+      <div class="neu-cp__panel" role="dialog" aria-label="Selector de color">
+        <!-- HSV Canvas -->
+        <div
+          class="neu-cp__canvas-wrap"
+          [style.background-color]="'hsl(' + _hue() + ', 100%, 50%)'"
+          (pointerdown)="_canvasDown($event)"
+          (pointermove)="_canvasDrag($event)"
+          (pointerup)="_canvasUp($event)"
+        >
+          <div
+            class="neu-cp__canvas-cursor"
+            [style.left]="_sv().s + '%'"
+            [style.top]="100 - _sv().v + '%'"
+          ></div>
+        </div>
+
+        <!-- Hue slider -->
+        <input
+          type="range"
+          class="neu-cp__hue-slider"
+          min="0"
+          max="360"
+          [value]="_hue()"
+          (input)="_onHueChange(+$any($event.target).value)"
+          [attr.aria-label]="'Tono ' + _hue() + '°'"
+        />
+
+        <!-- Swatches -->
+        <div class="neu-cp__swatches" role="group" aria-label="Colores predefinidos">
+          @for (sw of _swatches; track sw) {
+            <button
+              type="button"
+              class="neu-cp__sw"
+              [style.background]="sw"
+              [attr.aria-label]="'Color ' + sw"
+              (click)="_pickSwatch(sw)"
+            ></button>
+          }
+        </div>
+
+        <!-- Mode tabs -->
+        <div class="neu-cp__mode-tabs">
+          @for (m of _modes; track m) {
+            <button
+              type="button"
+              class="neu-cp__mode-btn"
+              [class.neu-cp__mode-btn--active]="_activeMode() === m"
+              (click)="_activeMode.set(m)"
+            >
+              {{ m.toUpperCase() }}
+            </button>
+          }
+        </div>
+
+        <!-- Value input -->
+        <div class="neu-cp__input-row">
+          <input
+            class="neu-cp__text-input"
+            type="text"
+            [value]="_textValue()"
+            (input)="_onTextChange($any($event.target).value)"
+            [attr.aria-label]="'Valor ' + _activeMode()"
+          />
+          <span class="neu-cp__swatch-sm" [style.background]="_hexValue()"></span>
+        </div>
+      </div>
+    }
+  `, isInline: true, styles: ["@charset \"UTF-8\";.neu-cp{position:relative;display:inline-block}.neu-cp--disabled{opacity:.55;pointer-events:none}.neu-cp__trigger{all:unset;display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border:1px solid var(--neu-border-color, #d1d5db);border-radius:var(--neu-radius-md, 8px);background:var(--neu-surface-1, #ffffff);cursor:pointer;box-sizing:border-box;transition:border-color .12s}.neu-cp__trigger:hover:not([disabled]){border-color:var(--neu-color-primary, #0ea5e9)}.neu-cp__trigger[disabled]{background:var(--neu-surface-2, #f3f4f6)}.neu-cp__swatch{width:22px;height:22px;border-radius:var(--neu-radius-sm, 4px);border:1px solid rgba(0,0,0,.1);display:inline-block}.neu-cp__swatch-sm{width:28px;height:28px;border-radius:var(--neu-radius-md, 8px);border:1px solid rgba(0,0,0,.1);display:inline-block;flex-shrink:0}.neu-cp__hex-label{font-size:.8125rem;color:var(--neu-text-primary, #111);font-family:monospace}.neu-cp__panel{position:absolute;top:calc(100% + 6px);left:0;width:272px;background:var(--neu-surface-1, #ffffff);border:1px solid var(--neu-border-color, #e5e7eb);border-radius:var(--neu-radius-xl, 16px);box-shadow:0 10px 24px -4px #00000024;padding:16px;z-index:1001;display:flex;flex-direction:column;gap:12px;animation:neu-cp-in 80ms ease}@keyframes neu-cp-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.neu-cp__canvas-wrap{position:relative;width:100%;height:150px;border-radius:var(--neu-radius-md, 8px);overflow:hidden;cursor:crosshair;-webkit-user-select:none;user-select:none;touch-action:none}.neu-cp__canvas-wrap:before{content:\"\";position:absolute;inset:0;background:linear-gradient(to right,#fff,transparent)}.neu-cp__canvas-wrap:after{content:\"\";position:absolute;inset:0;background:linear-gradient(to top,#000,transparent)}.neu-cp__canvas-cursor{position:absolute;width:14px;height:14px;border-radius:50%;border:2px solid #fff;box-shadow:0 1px 4px #00000073;transform:translate(-50%,-50%);pointer-events:none;z-index:1}.neu-cp__hue-slider{width:100%;height:10px;border-radius:999px;cursor:pointer;appearance:none;-webkit-appearance:none;background:linear-gradient(to right,red,#ff8000,#ff0,#80ff00,#0f0,#00ff80,#0ff,#0080ff,#00f,#7f00ff,#f0f,#ff0080,red)}.neu-cp__hue-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid rgba(0,0,0,.25);box-shadow:0 1px 3px #0003;cursor:pointer}.neu-cp__hue-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid rgba(0,0,0,.25);box-shadow:0 1px 3px #0003;cursor:pointer}.neu-cp__swatches{display:flex;gap:5px;flex-wrap:wrap}.neu-cp__sw{all:unset;box-sizing:border-box;width:20px;height:20px;border-radius:4px;cursor:pointer;border:1.5px solid rgba(0,0,0,.1);transition:transform 80ms}.neu-cp__sw:hover{transform:scale(1.2)}.neu-cp__sw:focus-visible{outline:2px solid var(--neu-color-primary, #0ea5e9);outline-offset:1px}.neu-cp__mode-tabs{display:flex;background:var(--neu-surface-2, #f3f4f6);border-radius:var(--neu-radius-md, 8px);padding:3px;gap:2px}.neu-cp__mode-btn{all:unset;flex:1;text-align:center;font-size:.6875rem;font-weight:600;padding:4px 0;border-radius:6px;cursor:pointer;transition:background 80ms,color 80ms}.neu-cp__mode-btn--active{background:var(--neu-surface-1, #ffffff);color:var(--neu-color-primary, #0ea5e9);box-shadow:0 1px 4px #00000014}.neu-cp__input-row{display:flex;gap:8px;align-items:center}.neu-cp__text-input{flex:1;padding:6px 10px;border:1px solid var(--neu-border-color, #d1d5db);border-radius:var(--neu-radius-md, 8px);font-size:.8125rem;font-family:monospace;background:var(--neu-surface-1, #fff);color:var(--neu-text-primary, #111);outline:none}.neu-cp__text-input:focus{border-color:var(--neu-color-primary, #0ea5e9)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuColorPickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'neu-color-picker', imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => NeuColorPickerComponent),
+                            multi: true,
+                        },
+                    ], host: {
+                        class: 'neu-cp',
+                        '[class.neu-cp--open]': '_isOpen()',
+                        '[class.neu-cp--disabled]': '_cvaDisabled()',
+                    }, template: `
+    <!-- Swatch trigger -->
+    <button
+      type="button"
+      class="neu-cp__trigger"
+      [attr.aria-expanded]="_isOpen()"
+      [attr.aria-label]="'Color: ' + _hexValue()"
+      [disabled]="_cvaDisabled()"
+      (click)="_toggle()"
+    >
+      <span class="neu-cp__swatch" [style.background]="_hexValue()"></span>
+      <span class="neu-cp__hex-label">{{ _hexValue() }}</span>
+    </button>
+
+    @if (_isOpen()) {
+      <div class="neu-cp__panel" role="dialog" aria-label="Selector de color">
+        <!-- HSV Canvas -->
+        <div
+          class="neu-cp__canvas-wrap"
+          [style.background-color]="'hsl(' + _hue() + ', 100%, 50%)'"
+          (pointerdown)="_canvasDown($event)"
+          (pointermove)="_canvasDrag($event)"
+          (pointerup)="_canvasUp($event)"
+        >
+          <div
+            class="neu-cp__canvas-cursor"
+            [style.left]="_sv().s + '%'"
+            [style.top]="100 - _sv().v + '%'"
+          ></div>
+        </div>
+
+        <!-- Hue slider -->
+        <input
+          type="range"
+          class="neu-cp__hue-slider"
+          min="0"
+          max="360"
+          [value]="_hue()"
+          (input)="_onHueChange(+$any($event.target).value)"
+          [attr.aria-label]="'Tono ' + _hue() + '°'"
+        />
+
+        <!-- Swatches -->
+        <div class="neu-cp__swatches" role="group" aria-label="Colores predefinidos">
+          @for (sw of _swatches; track sw) {
+            <button
+              type="button"
+              class="neu-cp__sw"
+              [style.background]="sw"
+              [attr.aria-label]="'Color ' + sw"
+              (click)="_pickSwatch(sw)"
+            ></button>
+          }
+        </div>
+
+        <!-- Mode tabs -->
+        <div class="neu-cp__mode-tabs">
+          @for (m of _modes; track m) {
+            <button
+              type="button"
+              class="neu-cp__mode-btn"
+              [class.neu-cp__mode-btn--active]="_activeMode() === m"
+              (click)="_activeMode.set(m)"
+            >
+              {{ m.toUpperCase() }}
+            </button>
+          }
+        </div>
+
+        <!-- Value input -->
+        <div class="neu-cp__input-row">
+          <input
+            class="neu-cp__text-input"
+            type="text"
+            [value]="_textValue()"
+            (input)="_onTextChange($any($event.target).value)"
+            [attr.aria-label]="'Valor ' + _activeMode()"
+          />
+          <span class="neu-cp__swatch-sm" [style.background]="_hexValue()"></span>
+        </div>
+      </div>
+    }
+  `, styles: ["@charset \"UTF-8\";.neu-cp{position:relative;display:inline-block}.neu-cp--disabled{opacity:.55;pointer-events:none}.neu-cp__trigger{all:unset;display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border:1px solid var(--neu-border-color, #d1d5db);border-radius:var(--neu-radius-md, 8px);background:var(--neu-surface-1, #ffffff);cursor:pointer;box-sizing:border-box;transition:border-color .12s}.neu-cp__trigger:hover:not([disabled]){border-color:var(--neu-color-primary, #0ea5e9)}.neu-cp__trigger[disabled]{background:var(--neu-surface-2, #f3f4f6)}.neu-cp__swatch{width:22px;height:22px;border-radius:var(--neu-radius-sm, 4px);border:1px solid rgba(0,0,0,.1);display:inline-block}.neu-cp__swatch-sm{width:28px;height:28px;border-radius:var(--neu-radius-md, 8px);border:1px solid rgba(0,0,0,.1);display:inline-block;flex-shrink:0}.neu-cp__hex-label{font-size:.8125rem;color:var(--neu-text-primary, #111);font-family:monospace}.neu-cp__panel{position:absolute;top:calc(100% + 6px);left:0;width:272px;background:var(--neu-surface-1, #ffffff);border:1px solid var(--neu-border-color, #e5e7eb);border-radius:var(--neu-radius-xl, 16px);box-shadow:0 10px 24px -4px #00000024;padding:16px;z-index:1001;display:flex;flex-direction:column;gap:12px;animation:neu-cp-in 80ms ease}@keyframes neu-cp-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.neu-cp__canvas-wrap{position:relative;width:100%;height:150px;border-radius:var(--neu-radius-md, 8px);overflow:hidden;cursor:crosshair;-webkit-user-select:none;user-select:none;touch-action:none}.neu-cp__canvas-wrap:before{content:\"\";position:absolute;inset:0;background:linear-gradient(to right,#fff,transparent)}.neu-cp__canvas-wrap:after{content:\"\";position:absolute;inset:0;background:linear-gradient(to top,#000,transparent)}.neu-cp__canvas-cursor{position:absolute;width:14px;height:14px;border-radius:50%;border:2px solid #fff;box-shadow:0 1px 4px #00000073;transform:translate(-50%,-50%);pointer-events:none;z-index:1}.neu-cp__hue-slider{width:100%;height:10px;border-radius:999px;cursor:pointer;appearance:none;-webkit-appearance:none;background:linear-gradient(to right,red,#ff8000,#ff0,#80ff00,#0f0,#00ff80,#0ff,#0080ff,#00f,#7f00ff,#f0f,#ff0080,red)}.neu-cp__hue-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid rgba(0,0,0,.25);box-shadow:0 1px 3px #0003;cursor:pointer}.neu-cp__hue-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid rgba(0,0,0,.25);box-shadow:0 1px 3px #0003;cursor:pointer}.neu-cp__swatches{display:flex;gap:5px;flex-wrap:wrap}.neu-cp__sw{all:unset;box-sizing:border-box;width:20px;height:20px;border-radius:4px;cursor:pointer;border:1.5px solid rgba(0,0,0,.1);transition:transform 80ms}.neu-cp__sw:hover{transform:scale(1.2)}.neu-cp__sw:focus-visible{outline:2px solid var(--neu-color-primary, #0ea5e9);outline-offset:1px}.neu-cp__mode-tabs{display:flex;background:var(--neu-surface-2, #f3f4f6);border-radius:var(--neu-radius-md, 8px);padding:3px;gap:2px}.neu-cp__mode-btn{all:unset;flex:1;text-align:center;font-size:.6875rem;font-weight:600;padding:4px 0;border-radius:6px;cursor:pointer;transition:background 80ms,color 80ms}.neu-cp__mode-btn--active{background:var(--neu-surface-1, #ffffff);color:var(--neu-color-primary, #0ea5e9);box-shadow:0 1px 4px #00000014}.neu-cp__input-row{display:flex;gap:8px;align-items:center}.neu-cp__text-input{flex:1;padding:6px 10px;border:1px solid var(--neu-border-color, #d1d5db);border-radius:var(--neu-radius-md, 8px);font-size:.8125rem;font-family:monospace;background:var(--neu-surface-1, #fff);color:var(--neu-text-primary, #111);outline:none}.neu-cp__text-input:focus{border-color:var(--neu-color-primary, #0ea5e9)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], colorChange: [{ type: i0.Output, args: ["colorChange"] }], _outsideClick: [{
+                type: HostListener,
+                args: ['document:mousedown', ['$event']]
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NeuColorPickerComponent };
+//# sourceMappingURL=neural-ui-core-color-picker.mjs.map

package/fesm2022/neural-ui-core-color-picker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"neural-ui-core-color-picker.mjs","sources":["../../../../projects/ui-core/color-picker/neu-color-picker.component.ts","../../../../projects/ui-core/color-picker/neural-ui-core-color-picker.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  HostListener,\n  ViewEncapsulation,\n  computed,\n  effect,\n  forwardRef,\n  inject,\n  input,\n  output,\n  signal,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nexport type NeuColorMode = 'hex' | 'rgb' | 'hsl';\n\n/** Parse hex → { r, g, b } */\nfunction hexToRgb(hex: string): { r: number; g: number; b: number } | null {\n  const clean = hex.replace('#', '').padEnd(6, '0');\n  if (!/^[0-9a-fA-F]{6}$/.test(clean)) return null;\n  return {\n    r: parseInt(clean.slice(0, 2), 16),\n    g: parseInt(clean.slice(2, 4), 16),\n    b: parseInt(clean.slice(4, 6), 16),\n  };\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n  return (\n    '#' +\n    [r, g, b]\n      .map((v) =>\n        Math.round(Math.max(0, Math.min(255, v)))\n          .toString(16)\n          .padStart(2, '0'),\n      )\n      .join('')\n  );\n}\n\nfunction rgbToHsl(r: number, g: number, b: number): { h: number; s: number; l: number } {\n  const _r = r / 255,\n    _g = g / 255,\n    _b = b / 255;\n  const max = Math.max(_r, _g, _b),\n    min = Math.min(_r, _g, _b);\n  let h = 0,\n    s = 0;\n  const l = (max + min) / 2;\n  if (max !== min) {\n    const d = max - min;\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n    switch (max) {\n      case _r:\n        h = ((_g - _b) / d + (_g < _b ? 6 : 0)) / 6;\n        break;\n      case _g:\n        h = ((_b - _r) / d + 2) / 6;\n        break;\n      case _b:\n        h = ((_r - _g) / d + 4) / 6;\n        break;\n    }\n  }\n  return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) };\n}\n\nfunction rgbToHsv(r: number, g: number, b: number): { h: number; s: number; v: number } {\n  const _r = r / 255,\n    _g = g / 255,\n    _b = b / 255;\n  const max = Math.max(_r, _g, _b),\n    min = Math.min(_r, _g, _b);\n  const v = max;\n  const s = max === 0 ? 0 : (max - min) / max;\n  let h = 0;\n  if (max !== min) {\n    const d = max - min;\n    switch (max) {\n      case _r:\n        h = ((_g - _b) / d + (_g < _b ? 6 : 0)) / 6;\n        break;\n      case _g:\n        h = ((_b - _r) / d + 2) / 6;\n        break;\n      case _b:\n        h = ((_r - _g) / d + 4) / 6;\n        break;\n    }\n  }\n  return { h: Math.round(h * 360), s: Math.round(s * 100), v: Math.round(v * 100) };\n}\n\nfunction hsvToHex(h: number, s: number, v: number): string {\n  const _s = s / 100,\n    _v = v / 100;\n  const f = (n: number) => {\n    const k = (n + h / 60) % 6;\n    const val = _v - _v * _s * Math.max(0, Math.min(k, 4 - k, 1));\n    return Math.round(val * 255)\n      .toString(16)\n      .padStart(2, '0');\n  };\n  return `#${f(5)}${f(3)}${f(1)}`;\n}\n\nfunction hslToHex(h: number, s: number, l: number): string {\n  const _s = s / 100,\n    _l = l / 100;\n  const a = _s * Math.min(_l, 1 - _l);\n  const f = (n: number) => {\n    const k = (n + h / 30) % 12;\n    const color = _l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);\n    return Math.round(255 * color)\n      .toString(16)\n      .padStart(2, '0');\n  };\n  return `#${f(0)}${f(8)}${f(4)}`;\n}\n\nlet _seq = 0;\n\n/**\n * NeuralUI ColorPicker\n *\n * Selector de color con swatch, hue slider y modos hex/rgb/hsl. CVA.\n *\n * Uso:\n *   <neu-color-picker [formControl]=\"colorCtrl\" mode=\"hex\" />\n */\n@Component({\n  selector: 'neu-color-picker',\n  imports: [],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => NeuColorPickerComponent),\n      multi: true,\n    },\n  ],\n  host: {\n    class: 'neu-cp',\n    '[class.neu-cp--open]': '_isOpen()',\n    '[class.neu-cp--disabled]': '_cvaDisabled()',\n  },\n  template: `\n    <!-- Swatch trigger -->\n    <button\n      type=\"button\"\n      class=\"neu-cp__trigger\"\n      [attr.aria-expanded]=\"_isOpen()\"\n      [attr.aria-label]=\"'Color: ' + _hexValue()\"\n      [disabled]=\"_cvaDisabled()\"\n      (click)=\"_toggle()\"\n    >\n      <span class=\"neu-cp__swatch\" [style.background]=\"_hexValue()\"></span>\n      <span class=\"neu-cp__hex-label\">{{ _hexValue() }}</span>\n    </button>\n\n    @if (_isOpen()) {\n      <div class=\"neu-cp__panel\" role=\"dialog\" aria-label=\"Selector de color\">\n        <!-- HSV Canvas -->\n        <div\n          class=\"neu-cp__canvas-wrap\"\n          [style.background-color]=\"'hsl(' + _hue() + ', 100%, 50%)'\"\n          (pointerdown)=\"_canvasDown($event)\"\n          (pointermove)=\"_canvasDrag($event)\"\n          (pointerup)=\"_canvasUp($event)\"\n        >\n          <div\n            class=\"neu-cp__canvas-cursor\"\n            [style.left]=\"_sv().s + '%'\"\n            [style.top]=\"100 - _sv().v + '%'\"\n          ></div>\n        </div>\n\n        <!-- Hue slider -->\n        <input\n          type=\"range\"\n          class=\"neu-cp__hue-slider\"\n          min=\"0\"\n          max=\"360\"\n          [value]=\"_hue()\"\n          (input)=\"_onHueChange(+$any($event.target).value)\"\n          [attr.aria-label]=\"'Tono ' + _hue() + '°'\"\n        />\n\n        <!-- Swatches -->\n        <div class=\"neu-cp__swatches\" role=\"group\" aria-label=\"Colores predefinidos\">\n          @for (sw of _swatches; track sw) {\n            <button\n              type=\"button\"\n              class=\"neu-cp__sw\"\n              [style.background]=\"sw\"\n              [attr.aria-label]=\"'Color ' + sw\"\n              (click)=\"_pickSwatch(sw)\"\n            ></button>\n          }\n        </div>\n\n        <!-- Mode tabs -->\n        <div class=\"neu-cp__mode-tabs\">\n          @for (m of _modes; track m) {\n            <button\n              type=\"button\"\n              class=\"neu-cp__mode-btn\"\n              [class.neu-cp__mode-btn--active]=\"_activeMode() === m\"\n              (click)=\"_activeMode.set(m)\"\n            >\n              {{ m.toUpperCase() }}\n            </button>\n          }\n        </div>\n\n        <!-- Value input -->\n        <div class=\"neu-cp__input-row\">\n          <input\n            class=\"neu-cp__text-input\"\n            type=\"text\"\n            [value]=\"_textValue()\"\n            (input)=\"_onTextChange($any($event.target).value)\"\n            [attr.aria-label]=\"'Valor ' + _activeMode()\"\n          />\n          <span class=\"neu-cp__swatch-sm\" [style.background]=\"_hexValue()\"></span>\n        </div>\n      </div>\n    }\n  `,\n  styleUrl: './neu-color-picker.component.scss',\n})\nexport class NeuColorPickerComponent implements ControlValueAccessor {\n  // ── Inputs / Outputs ────────────────────────────────────────────\n  readonly mode = input<NeuColorMode>('hex');\n\n  /** Emitido al cambiar el color / Emitted when color changes */\n  readonly colorChange = output<string>();\n\n  // ── Internal state ───────────────────────────────────────────────\n  readonly _id = `neu-cp-${++_seq}`;\n  readonly _modes: NeuColorMode[] = ['hex', 'rgb', 'hsl'];\n  readonly _swatches: string[] = [\n    '#ef4444',\n    '#f97316',\n    '#eab308',\n    '#22c55e',\n    '#10b981',\n    '#06b6d4',\n    '#3b82f6',\n    '#6366f1',\n    '#a855f7',\n    '#ec4899',\n  ];\n\n  readonly _isOpen = signal(false);\n  readonly _cvaDisabled = signal(false);\n  readonly _hue = signal(210);\n  readonly _sv = signal({ s: 80, v: 90 });\n  readonly _activeMode = signal<NeuColorMode>('hex');\n\n  private _dragging = false;\n  private _onChange: (v: string) => void = () => {};\n  private _onTouched: () => void = () => {};\n\n  private readonly _el = inject(ElementRef<HTMLElement>);\n\n  constructor() {\n    // Sync mode input → internal active mode\n    effect(() => {\n      this._activeMode.set(this.mode());\n    });\n  }\n\n  // ── Close on outside click ─────────────────────────────────────\n  @HostListener('document:mousedown', ['$event'])\n  _outsideClick(e: MouseEvent): void {\n    if (!this._el.nativeElement.contains(e.target as Node)) {\n      this._isOpen.set(false);\n    }\n  }\n\n  // ── Computed ──────────────────────────────────────────────────\n  readonly _hexValue = computed(() => hsvToHex(this._hue(), this._sv().s, this._sv().v));\n\n  readonly _textValue = computed(() => {\n    const hex = this._hexValue();\n    const rgb = hexToRgb(hex);\n    if (!rgb) return hex;\n    switch (this._activeMode()) {\n      case 'rgb':\n        return `rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`;\n      case 'hsl': {\n        const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);\n        return `hsl(${hsl.h}, ${hsl.s}%, ${hsl.l}%)`;\n      }\n      default:\n        return hex;\n    }\n  });\n\n  // ── Canvas interactions ───────────────────────────────────────\n  _canvasDown(e: PointerEvent): void {\n    this._dragging = true;\n    (e.currentTarget as HTMLElement).setPointerCapture(e.pointerId);\n    this._updateFromCanvas(e);\n  }\n\n  _canvasDrag(e: PointerEvent): void {\n    if (!this._dragging) return;\n    this._updateFromCanvas(e);\n  }\n\n  _canvasUp(e: PointerEvent): void {\n    this._dragging = false;\n    (e.currentTarget as HTMLElement).releasePointerCapture(e.pointerId);\n  }\n\n  private _updateFromCanvas(e: PointerEvent): void {\n    const rect = (e.currentTarget as HTMLElement).getBoundingClientRect();\n    const s = Math.round(Math.max(0, Math.min(1, (e.clientX - rect.left) / rect.width)) * 100);\n    const v = Math.round(Math.max(0, Math.min(1, 1 - (e.clientY - rect.top) / rect.height)) * 100);\n    this._sv.set({ s, v });\n    this._emit();\n  }\n\n  // ── Event handlers ────────────────────────────────────────────\n  _toggle(): void {\n    this._isOpen.update((v) => !v);\n  }\n\n  _onHueChange(v: number): void {\n    this._hue.set(Number(v));\n    this._emit();\n  }\n\n  _pickSwatch(hex: string): void {\n    this._applyHex(hex);\n    this._emit();\n  }\n\n  _onTextChange(text: string): void {\n    const t = text.trim();\n    if (t.startsWith('#')) {\n      this._applyHex(t);\n    } else if (t.startsWith('rgb')) {\n      const m = t.match(/rgb\\((\\d+),\\s*(\\d+),\\s*(\\d+)\\)/);\n      if (m) this._applyHex(rgbToHex(+m[1], +m[2], +m[3]));\n    } else if (t.startsWith('hsl')) {\n      const m = t.match(/hsl\\((\\d+),\\s*(\\d+)%?,\\s*(\\d+)%?\\)/);\n      if (m) this._applyHex(hslToHex(+m[1], +m[2], +m[3]));\n    }\n    this._emit();\n  }\n\n  // ── Helpers ───────────────────────────────────────────────────\n  private _applyHex(hex: string): void {\n    const rgb = hexToRgb(hex);\n    if (!rgb) return;\n    const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n    this._hue.set(hsv.h);\n    this._sv.set({ s: hsv.s, v: hsv.v });\n  }\n\n  private _emit(): void {\n    const val = this._textValue();\n    this._onChange(val);\n    this.colorChange.emit(val);\n  }\n\n  // ── CVA ──────────────────────────────────────────────────────\n  writeValue(val: string | null): void {\n    if (!val) return;\n    this._onTextChange(val);\n  }\n\n  registerOnChange(fn: (v: string) => void): void {\n    this._onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this._onTouched = fn;\n  }\n\n  setDisabledState(d: boolean): void {\n    this._cvaDisabled.set(d);\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}