@lucca-front/ng 22.1.0-rc.4 → 22.1.0

package/fesm2022/lucca-front-ng-kbd.mjs

@@ -0,0 +1,306 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, input, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { intlInputOptions } from '@lucca-front/ng/core';
+import { NgTemplateOutlet } from '@angular/common';
+import { IconComponent } from '@lucca-front/ng/icon';
+
+const Translations = {
+    'nl-BE': {
+        alt: 'Alt',
+        option: 'Option',
+        control: 'Ctrl',
+        meta: 'Win',
+        command: 'Cmd',
+        shift: 'Shift',
+        tab: 'Tab',
+        space: 'Spatie',
+        enter: 'Enter',
+        escape: 'Esc',
+        backspace: 'Backspace',
+        delete: 'Delete',
+        home: 'Home',
+        end: 'End',
+        pageUp: 'Page Up',
+        pageDown: 'Page Down',
+        arrowUp: 'pijl omhoog',
+        arrowDown: 'pijl omlaag',
+        arrowLeft: 'pijl naar links',
+        arrowRight: 'pijl naar rechts',
+    },
+    fr: {
+        alt: 'Alt',
+        option: 'Option',
+        control: 'Ctrl',
+        meta: 'Win',
+        command: 'Cmd',
+        shift: 'Maj',
+        tab: 'Tab',
+        space: 'Espace',
+        enter: 'Entrée',
+        escape: 'Échap',
+        backspace: 'Retour arrière',
+        delete: 'Suppr',
+        home: 'Début',
+        end: 'Fin',
+        pageUp: 'Page préc',
+        pageDown: 'Page suiv',
+        arrowUp: 'flèche haut',
+        arrowDown: 'flèche bas',
+        arrowLeft: 'flèche gauche',
+        arrowRight: 'flèche droite',
+    },
+    de: {
+        alt: 'Alt',
+        option: 'Option',
+        control: 'Strg',
+        meta: 'Win',
+        command: 'Cmd',
+        shift: 'Umschalt',
+        tab: 'Tab',
+        space: 'Leertaste',
+        enter: 'Eingabe',
+        escape: 'Esc',
+        backspace: 'Rücktaste',
+        delete: 'Entf',
+        home: 'Pos1',
+        end: 'Ende',
+        pageUp: 'Bild auf',
+        pageDown: 'Bild ab',
+        arrowUp: 'Pfeil nach oben',
+        arrowDown: 'Pfeil nach unten',
+        arrowLeft: 'Pfeil nach links',
+        arrowRight: 'Pfeil nach rechts',
+    },
+    en: {
+        alt: 'Alt',
+        option: 'Option',
+        control: 'Ctrl',
+        meta: 'Win',
+        command: 'Cmd',
+        shift: 'Shift',
+        tab: 'Tab',
+        space: 'Space',
+        enter: 'Enter',
+        escape: 'Esc',
+        backspace: 'Backspace',
+        delete: 'Delete',
+        home: 'Home',
+        end: 'End',
+        pageUp: 'Page Up',
+        pageDown: 'Page Down',
+        arrowUp: 'up arrow',
+        arrowDown: 'down arrow',
+        arrowLeft: 'left arrow',
+        arrowRight: 'right arrow',
+    },
+    es: {
+        alt: 'Alt',
+        option: 'Opción',
+        control: 'Ctrl',
+        meta: 'Win',
+        command: 'Cmd',
+        shift: 'Mayús',
+        tab: 'Tab',
+        space: 'Espacio',
+        enter: 'Intro',
+        escape: 'Esc',
+        backspace: 'Retroceso',
+        delete: 'Supr',
+        home: 'Inicio',
+        end: 'Fin',
+        pageUp: 'Re Pág',
+        pageDown: 'Av Pág',
+        arrowUp: 'flecha arriba',
+        arrowDown: 'flecha abajo',
+        arrowLeft: 'flecha izquierda',
+        arrowRight: 'flecha derecha',
+    },
+    it: {
+        alt: 'Alt',
+        option: 'Opzione',
+        control: 'Ctrl',
+        meta: 'Win',
+        command: 'Cmd',
+        shift: 'Maiusc',
+        tab: 'Tab',
+        space: 'Spazio',
+        enter: 'Invio',
+        escape: 'Esc',
+        backspace: 'Backspace',
+        delete: 'Canc',
+        home: 'Home',
+        end: 'Fine',
+        pageUp: 'Pag su',
+        pageDown: 'Pag giù',
+        arrowUp: 'freccia su',
+        arrowDown: 'freccia giù',
+        arrowLeft: 'freccia sinistra',
+        arrowRight: 'freccia destra',
+    },
+    nl: {
+        alt: 'Alt',
+        option: 'Option',
+        control: 'Ctrl',
+        meta: 'Win',
+        command: 'Cmd',
+        shift: 'Shift',
+        tab: 'Tab',
+        space: 'Spatie',
+        enter: 'Enter',
+        escape: 'Esc',
+        backspace: 'Backspace',
+        delete: 'Delete',
+        home: 'Home',
+        end: 'End',
+        pageUp: 'Page Up',
+        pageDown: 'Page Down',
+        arrowUp: 'pijl omhoog',
+        arrowDown: 'pijl omlaag',
+        arrowLeft: 'pijl naar links',
+        arrowRight: 'pijl naar rechts',
+    },
+    pt: {
+        alt: 'Alt',
+        option: 'Option',
+        control: 'Ctrl',
+        meta: 'Win',
+        command: 'Cmd',
+        shift: 'Shift',
+        tab: 'Tab',
+        space: 'Espaço',
+        enter: 'Enter',
+        escape: 'Esc',
+        backspace: 'Backspace',
+        delete: 'Delete',
+        home: 'Home',
+        end: 'End',
+        pageUp: 'Page Up',
+        pageDown: 'Page Down',
+        arrowUp: 'seta para cima',
+        arrowDown: 'seta para baixo',
+        arrowLeft: 'seta para a esquerda',
+        arrowRight: 'seta para a direita',
+    },
+    pl: {
+        alt: 'Alt',
+        option: 'Option',
+        control: 'Ctrl',
+        meta: 'Win',
+        command: 'Cmd',
+        shift: 'Shift',
+        tab: 'Tab',
+        space: 'Spacja',
+        enter: 'Enter',
+        escape: 'Esc',
+        backspace: 'Backspace',
+        delete: 'Delete',
+        home: 'Home',
+        end: 'End',
+        pageUp: 'Page Up',
+        pageDown: 'Page Down',
+        arrowUp: 'strzałka w górę',
+        arrowDown: 'strzałka w dół',
+        arrowLeft: 'strzałka w lewo',
+        arrowRight: 'strzałka w prawo',
+    },
+};
+
+const LU_KBD_TRANSLATIONS = new InjectionToken('LuKbdTranslations', {
+    factory: () => luKbdTranslations,
+});
+const luKbdTranslations = Translations;
+
+const LABELS = {
+    Alt: 'alt',
+    Control: 'control',
+    Meta: 'meta',
+    ' ': 'space',
+    Escape: 'escape',
+    Home: 'home',
+    End: 'end',
+};
+const ICONS = {
+    Shift: ['arrowShift', 'shift'],
+    Tab: ['arrowLineRight', 'tab'],
+    Enter: ['arrowEnter', 'enter'],
+    Backspace: ['arrowBackspace', 'backspace'],
+    Delete: ['arrowDelete', 'delete'],
+    PageUp: ['arrowPageUp', 'pageUp'],
+    PageDown: ['arrowPageDown', 'pageDown'],
+    ArrowUp: ['arrowTop', 'arrowUp'],
+    ArrowDown: ['arrowBottom', 'arrowDown'],
+    ArrowLeft: ['arrowLeft', 'arrowLeft'],
+    ArrowRight: ['arrowRight', 'arrowRight'],
+};
+/**
+ * Apple displays its modifiers as symbols: ⌥ Option and ⌘ Command
+ */
+const MAC_ICONS = {
+    ...ICONS,
+    Alt: ['keyboardOption', 'option'],
+    Meta: ['keyboardCommand', 'command'],
+};
+/**
+ * Conventional order of the modifiers, displayed before the other keys whatever their order in `keys`:
+ * Control, Option, Shift, Command on Mac (Apple Human Interface Guidelines), Windows key, Ctrl, Alt, Shift elsewhere
+ */
+const MAC_MODIFIERS = ['Control', 'Alt', 'Shift', 'Meta'];
+const MODIFIERS = ['Meta', 'Control', 'Alt', 'Shift'];
+
+/**
+ * Whether the page runs on Apple platforms, whose modifiers differ (Option, Command)
+ */
+function isMacPlatform() {
+    return typeof navigator !== 'undefined' && /Mac|iPhone|iPad/.test(navigator.userAgent);
+}
+
+class KbdComponent {
+    constructor() {
+        this.#isMac = isMacPlatform();
+        /**
+         * Key, or combination of keys, to display, as named by `KeyboardEvent.key` (`'Escape'`, `['Control', 'n']`…).
+         * Keys follow the platform (Option and Command on Mac).
+         * Modifiers are displayed first, in the conventional order of the platform.
+         */
+        this.keys = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "keys" }] : /* istanbul ignore next */ []));
+        /**
+         * Overrides the default labels of the keys
+         */
+        this.intl = input(...intlInputOptions(LU_KBD_TRANSLATIONS), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "intl" }] : /* istanbul ignore next */ []));
+        this.displayedKeys = computed(() => {
+            const keys = this.keys();
+            const intl = this.intl();
+            const modifiers = this.#isMac ? MAC_MODIFIERS : MODIFIERS;
+            const given = typeof keys === 'string' ? [keys] : keys;
+            return [...modifiers.filter((modifier) => given.includes(modifier)), ...given.filter((key) => !modifiers.includes(key))].map((key) => this.#display(key, intl));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "displayedKeys" }] : /* istanbul ignore next */ []));
+    }
+    #isMac;
+    #display(key, intl) {
+        const icon = (this.#isMac ? MAC_ICONS : ICONS)[key];
+        if (icon) {
+            return { type: 'icon', icon: icon[0], label: intl[icon[1]] };
+        }
+        const label = LABELS[key];
+        if (label) {
+            return { type: 'text', label: intl[label] };
+        }
+        return { type: 'text', label: key.length === 1 ? key.toUpperCase() : key };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: KbdComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: KbdComponent, isStandalone: true, selector: "lu-kbd", inputs: { keys: { classPropertyName: "keys", publicName: "keys", isSignal: true, isRequired: true, transformFunction: null }, intl: { classPropertyName: "intl", publicName: "intl", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (displayedKeys().length === 1) {\n\t<span class=\"kbdWrapper\">\n\t\t<kbd class=\"kbd\">\n\t\t\t<ng-container *ngTemplateOutlet=\"content; context: { $implicit: displayedKeys()[0] }\" />\n\t\t</kbd>\n\t</span>\n} @else {\n\t<kbd class=\"kbdWrapper\">\n\t\t@for (key of displayedKeys(); track $index) {\n\t\t\t@if (!$first) {\n\t\t\t\t+\n\t\t\t}\n\t\t\t<kbd class=\"kbd\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"content; context: { $implicit: key }\" />\n\t\t\t</kbd>\n\t\t}\n\t</kbd>\n}\n\n<ng-template #content let-key>\n\t@switch (key.type) {\n\t\t@case (\"icon\") {\n\t\t\t<lu-icon [icon]=\"key.icon\" size=\"XXS\" [alt]=\"key.label\" />\n\t\t}\n\t\t@default {\n\t\t\t{{ key.label }}\n\t\t}\n\t}\n</ng-template>\n", styles: ["@layer components{.kbd{--components-kbd-paddingInline: var(--pr-t-spacings-50);--components-kbd-animationDelay: 0s;--components-kbd-animationDuration: calc(var(--components-kbd-animationPause) / .9);--components-kbd-animationName: var(--components-kbd-modifier-animationName);--components-kbd-animationOffset: 0s;--components-kbd-animationPause: calc(var(--commons-animations-durations-slow) * 3.5);--components-kbd-last-animationName: none;--components-kbd-modifier-animationName: none;align-items:center;background-color:var(--palettes-neutral-0);border:1px solid var(--palettes-neutral-200);border-radius:var(--pr-t-border-radius-small);box-shadow:inset 0 -1px 0 var(--palettes-neutral-200);color:var(--pr-t-color-text-subtle);display:inline-flex;font:var(--pr-t-font-body-XS);inset-block-start:0;justify-content:center;min-block-size:var(--pr-t-spacings-250);min-inline-size:var(--pr-t-spacings-250);padding-inline:var(--components-kbd-paddingInline);position:relative;white-space:nowrap;animation-delay:calc(var(--components-kbd-animationDelay) + var(--components-kbd-animationOffset));animation-duration:var(--components-kbd-animationDuration);animation-iteration-count:infinite;animation-name:var(--components-kbd-animationName);animation-timing-function:step-end}.kbd:has(.lucca-icon){--components-kbd-paddingInline: 0}.kbd:nth-of-type(2){--components-kbd-animationOffset: calc(var(--commons-animations-durations-fast) / 2 * 1)}.kbd:nth-of-type(3){--components-kbd-animationOffset: calc(var(--commons-animations-durations-fast) / 2 * 2)}.kbd:nth-of-type(4){--components-kbd-animationOffset: calc(var(--commons-animations-durations-fast) / 2 * 3)}.kbd:nth-of-type(5){--components-kbd-animationOffset: calc(var(--commons-animations-durations-fast) / 2 * 4)}.kbd:last-of-type{--components-kbd-animationName: var(--components-kbd-last-animationName)}@keyframes kbdHold{10%,35%{box-shadow:inset 0 0 0 var(--palettes-neutral-200);inset-block-start:1px}40%{box-shadow:inset 0 -1px 0 var(--palettes-neutral-200);inset-block-start:0}}@keyframes kbdTap{15%,25%{box-shadow:inset 0 -1px 0 var(--palettes-neutral-200);inset-block-start:0}20%{box-shadow:inset 0 0 0 var(--palettes-neutral-200);inset-block-start:1px}}}@layer mods{@media(prefers-reduced-motion:reduce){.kbd{--components-kbd-last-animationName: none;--components-kbd-modifier-animationName: none}}}@layer components{.kbdWrapper{align-items:center;color:var(--pr-t-color-text-subtle);display:inline-flex;font:var(--pr-t-font-body-S);gap:var(--pr-t-spacings-25);vertical-align:middle;white-space:nowrap}.kbdWrapper:has(.kbd:nth-of-type(2)) .kbd{--components-kbd-animationDuration: calc((var(--components-kbd-animationPause) + calc(var(--commons-animations-durations-fast) / 2 * 0)) / .6)}.kbdWrapper:has(.kbd:nth-of-type(3)) .kbd{--components-kbd-animationDuration: calc((var(--components-kbd-animationPause) + calc(var(--commons-animations-durations-fast) / 2 * 1)) / .6)}.kbdWrapper:has(.kbd:nth-of-type(4)) .kbd{--components-kbd-animationDuration: calc((var(--components-kbd-animationPause) + calc(var(--commons-animations-durations-fast) / 2 * 2)) / .6)}.kbdWrapper:has(.kbd:nth-of-type(5)) .kbd{--components-kbd-animationDuration: calc((var(--components-kbd-animationPause) + calc(var(--commons-animations-durations-fast) / 2 * 3)) / .6)}}lu-kbd{display:contents}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: KbdComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lu-kbd', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [IconComponent, NgTemplateOutlet], template: "@if (displayedKeys().length === 1) {\n\t<span class=\"kbdWrapper\">\n\t\t<kbd class=\"kbd\">\n\t\t\t<ng-container *ngTemplateOutlet=\"content; context: { $implicit: displayedKeys()[0] }\" />\n\t\t</kbd>\n\t</span>\n} @else {\n\t<kbd class=\"kbdWrapper\">\n\t\t@for (key of displayedKeys(); track $index) {\n\t\t\t@if (!$first) {\n\t\t\t\t+\n\t\t\t}\n\t\t\t<kbd class=\"kbd\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"content; context: { $implicit: key }\" />\n\t\t\t</kbd>\n\t\t}\n\t</kbd>\n}\n\n<ng-template #content let-key>\n\t@switch (key.type) {\n\t\t@case (\"icon\") {\n\t\t\t<lu-icon [icon]=\"key.icon\" size=\"XXS\" [alt]=\"key.label\" />\n\t\t}\n\t\t@default {\n\t\t\t{{ key.label }}\n\t\t}\n\t}\n</ng-template>\n", styles: ["@layer components{.kbd{--components-kbd-paddingInline: var(--pr-t-spacings-50);--components-kbd-animationDelay: 0s;--components-kbd-animationDuration: calc(var(--components-kbd-animationPause) / .9);--components-kbd-animationName: var(--components-kbd-modifier-animationName);--components-kbd-animationOffset: 0s;--components-kbd-animationPause: calc(var(--commons-animations-durations-slow) * 3.5);--components-kbd-last-animationName: none;--components-kbd-modifier-animationName: none;align-items:center;background-color:var(--palettes-neutral-0);border:1px solid var(--palettes-neutral-200);border-radius:var(--pr-t-border-radius-small);box-shadow:inset 0 -1px 0 var(--palettes-neutral-200);color:var(--pr-t-color-text-subtle);display:inline-flex;font:var(--pr-t-font-body-XS);inset-block-start:0;justify-content:center;min-block-size:var(--pr-t-spacings-250);min-inline-size:var(--pr-t-spacings-250);padding-inline:var(--components-kbd-paddingInline);position:relative;white-space:nowrap;animation-delay:calc(var(--components-kbd-animationDelay) + var(--components-kbd-animationOffset));animation-duration:var(--components-kbd-animationDuration);animation-iteration-count:infinite;animation-name:var(--components-kbd-animationName);animation-timing-function:step-end}.kbd:has(.lucca-icon){--components-kbd-paddingInline: 0}.kbd:nth-of-type(2){--components-kbd-animationOffset: calc(var(--commons-animations-durations-fast) / 2 * 1)}.kbd:nth-of-type(3){--components-kbd-animationOffset: calc(var(--commons-animations-durations-fast) / 2 * 2)}.kbd:nth-of-type(4){--components-kbd-animationOffset: calc(var(--commons-animations-durations-fast) / 2 * 3)}.kbd:nth-of-type(5){--components-kbd-animationOffset: calc(var(--commons-animations-durations-fast) / 2 * 4)}.kbd:last-of-type{--components-kbd-animationName: var(--components-kbd-last-animationName)}@keyframes kbdHold{10%,35%{box-shadow:inset 0 0 0 var(--palettes-neutral-200);inset-block-start:1px}40%{box-shadow:inset 0 -1px 0 var(--palettes-neutral-200);inset-block-start:0}}@keyframes kbdTap{15%,25%{box-shadow:inset 0 -1px 0 var(--palettes-neutral-200);inset-block-start:0}20%{box-shadow:inset 0 0 0 var(--palettes-neutral-200);inset-block-start:1px}}}@layer mods{@media(prefers-reduced-motion:reduce){.kbd{--components-kbd-last-animationName: none;--components-kbd-modifier-animationName: none}}}@layer components{.kbdWrapper{align-items:center;color:var(--pr-t-color-text-subtle);display:inline-flex;font:var(--pr-t-font-body-S);gap:var(--pr-t-spacings-25);vertical-align:middle;white-space:nowrap}.kbdWrapper:has(.kbd:nth-of-type(2)) .kbd{--components-kbd-animationDuration: calc((var(--components-kbd-animationPause) + calc(var(--commons-animations-durations-fast) / 2 * 0)) / .6)}.kbdWrapper:has(.kbd:nth-of-type(3)) .kbd{--components-kbd-animationDuration: calc((var(--components-kbd-animationPause) + calc(var(--commons-animations-durations-fast) / 2 * 1)) / .6)}.kbdWrapper:has(.kbd:nth-of-type(4)) .kbd{--components-kbd-animationDuration: calc((var(--components-kbd-animationPause) + calc(var(--commons-animations-durations-fast) / 2 * 2)) / .6)}.kbdWrapper:has(.kbd:nth-of-type(5)) .kbd{--components-kbd-animationDuration: calc((var(--components-kbd-animationPause) + calc(var(--commons-animations-durations-fast) / 2 * 3)) / .6)}}lu-kbd{display:contents}\n"] }]
+        }], propDecorators: { keys: [{ type: i0.Input, args: [{ isSignal: true, alias: "keys", required: true }] }], intl: [{ type: i0.Input, args: [{ isSignal: true, alias: "intl", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { KbdComponent, LU_KBD_TRANSLATIONS, luKbdTranslations };
+//# sourceMappingURL=lucca-front-ng-kbd.mjs.map

package/fesm2022/lucca-front-ng-kbd.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"lucca-front-ng-kbd.mjs","sources":["../../../packages/ng/kbd/translations.ts","../../../packages/ng/kbd/kbd.translate.ts","../../../packages/ng/kbd/kbd.type.ts","../../../packages/ng/kbd/kbd.utils.ts","../../../packages/ng/kbd/kbd.component.ts","../../../packages/ng/kbd/kbd.component.html","../../../packages/ng/kbd/lucca-front-ng-kbd.ts"],"sourcesContent":["export const Translations = {\n\t'nl-BE': {\n\t\talt: 'Alt',\n\t\toption: 'Option',\n\t\tcontrol: 'Ctrl',\n\t\tmeta: 'Win',\n\t\tcommand: 'Cmd',\n\t\tshift: 'Shift',\n\t\ttab: 'Tab',\n\t\tspace: 'Spatie',\n\t\tenter: 'Enter',\n\t\tescape: 'Esc',\n\t\tbackspace: 'Backspace',\n\t\tdelete: 'Delete',\n\t\thome: 'Home',\n\t\tend: 'End',\n\t\tpageUp: 'Page Up',\n\t\tpageDown: 'Page Down',\n\t\tarrowUp: 'pijl omhoog',\n\t\tarrowDown: 'pijl omlaag',\n\t\tarrowLeft: 'pijl naar links',\n\t\tarrowRight: 'pijl naar rechts',\n\t},\n\tfr: {\n\t\talt: 'Alt',\n\t\toption: 'Option',\n\t\tcontrol: 'Ctrl',\n\t\tmeta: 'Win',\n\t\tcommand: 'Cmd',\n\t\tshift: 'Maj',\n\t\ttab: 'Tab',\n\t\tspace: 'Espace',\n\t\tenter: 'Entrée',\n\t\tescape: 'Échap',\n\t\tbackspace: 'Retour arrière',\n\t\tdelete: 'Suppr',\n\t\thome: 'Début',\n\t\tend: 'Fin',\n\t\tpageUp: 'Page préc',\n\t\tpageDown: 'Page suiv',\n\t\tarrowUp: 'flèche haut',\n\t\tarrowDown: 'flèche bas',\n\t\tarrowLeft: 'flèche gauche',\n\t\tarrowRight: 'flèche droite',\n\t},\n\tde: {\n\t\talt: 'Alt',\n\t\toption: 'Option',\n\t\tcontrol: 'Strg',\n\t\tmeta: 'Win',\n\t\tcommand: 'Cmd',\n\t\tshift: 'Umschalt',\n\t\ttab: 'Tab',\n\t\tspace: 'Leertaste',\n\t\tenter: 'Eingabe',\n\t\tescape: 'Esc',\n\t\tbackspace: 'Rücktaste',\n\t\tdelete: 'Entf',\n\t\thome: 'Pos1',\n\t\tend: 'Ende',\n\t\tpageUp: 'Bild auf',\n\t\tpageDown: 'Bild ab',\n\t\tarrowUp: 'Pfeil nach oben',\n\t\tarrowDown: 'Pfeil nach unten',\n\t\tarrowLeft: 'Pfeil nach links',\n\t\tarrowRight: 'Pfeil nach rechts',\n\t},\n\ten: {\n\t\talt: 'Alt',\n\t\toption: 'Option',\n\t\tcontrol: 'Ctrl',\n\t\tmeta: 'Win',\n\t\tcommand: 'Cmd',\n\t\tshift: 'Shift',\n\t\ttab: 'Tab',\n\t\tspace: 'Space',\n\t\tenter: 'Enter',\n\t\tescape: 'Esc',\n\t\tbackspace: 'Backspace',\n\t\tdelete: 'Delete',\n\t\thome: 'Home',\n\t\tend: 'End',\n\t\tpageUp: 'Page Up',\n\t\tpageDown: 'Page Down',\n\t\tarrowUp: 'up arrow',\n\t\tarrowDown: 'down arrow',\n\t\tarrowLeft: 'left arrow',\n\t\tarrowRight: 'right arrow',\n\t},\n\tes: {\n\t\talt: 'Alt',\n\t\toption: 'Opción',\n\t\tcontrol: 'Ctrl',\n\t\tmeta: 'Win',\n\t\tcommand: 'Cmd',\n\t\tshift: 'Mayús',\n\t\ttab: 'Tab',\n\t\tspace: 'Espacio',\n\t\tenter: 'Intro',\n\t\tescape: 'Esc',\n\t\tbackspace: 'Retroceso',\n\t\tdelete: 'Supr',\n\t\thome: 'Inicio',\n\t\tend: 'Fin',\n\t\tpageUp: 'Re Pág',\n\t\tpageDown: 'Av Pág',\n\t\tarrowUp: 'flecha arriba',\n\t\tarrowDown: 'flecha abajo',\n\t\tarrowLeft: 'flecha izquierda',\n\t\tarrowRight: 'flecha derecha',\n\t},\n\tit: {\n\t\talt: 'Alt',\n\t\toption: 'Opzione',\n\t\tcontrol: 'Ctrl',\n\t\tmeta: 'Win',\n\t\tcommand: 'Cmd',\n\t\tshift: 'Maiusc',\n\t\ttab: 'Tab',\n\t\tspace: 'Spazio',\n\t\tenter: 'Invio',\n\t\tescape: 'Esc',\n\t\tbackspace: 'Backspace',\n\t\tdelete: 'Canc',\n\t\thome: 'Home',\n\t\tend: 'Fine',\n\t\tpageUp: 'Pag su',\n\t\tpageDown: 'Pag giù',\n\t\tarrowUp: 'freccia su',\n\t\tarrowDown: 'freccia giù',\n\t\tarrowLeft: 'freccia sinistra',\n\t\tarrowRight: 'freccia destra',\n\t},\n\tnl: {\n\t\talt: 'Alt',\n\t\toption: 'Option',\n\t\tcontrol: 'Ctrl',\n\t\tmeta: 'Win',\n\t\tcommand: 'Cmd',\n\t\tshift: 'Shift',\n\t\ttab: 'Tab',\n\t\tspace: 'Spatie',\n\t\tenter: 'Enter',\n\t\tescape: 'Esc',\n\t\tbackspace: 'Backspace',\n\t\tdelete: 'Delete',\n\t\thome: 'Home',\n\t\tend: 'End',\n\t\tpageUp: 'Page Up',\n\t\tpageDown: 'Page Down',\n\t\tarrowUp: 'pijl omhoog',\n\t\tarrowDown: 'pijl omlaag',\n\t\tarrowLeft: 'pijl naar links',\n\t\tarrowRight: 'pijl naar rechts',\n\t},\n\tpt: {\n\t\talt: 'Alt',\n\t\toption: 'Option',\n\t\tcontrol: 'Ctrl',\n\t\tmeta: 'Win',\n\t\tcommand: 'Cmd',\n\t\tshift: 'Shift',\n\t\ttab: 'Tab',\n\t\tspace: 'Espaço',\n\t\tenter: 'Enter',\n\t\tescape: 'Esc',\n\t\tbackspace: 'Backspace',\n\t\tdelete: 'Delete',\n\t\thome: 'Home',\n\t\tend: 'End',\n\t\tpageUp: 'Page Up',\n\t\tpageDown: 'Page Down',\n\t\tarrowUp: 'seta para cima',\n\t\tarrowDown: 'seta para baixo',\n\t\tarrowLeft: 'seta para a esquerda',\n\t\tarrowRight: 'seta para a direita',\n\t},\n\tpl: {\n\t\talt: 'Alt',\n\t\toption: 'Option',\n\t\tcontrol: 'Ctrl',\n\t\tmeta: 'Win',\n\t\tcommand: 'Cmd',\n\t\tshift: 'Shift',\n\t\ttab: 'Tab',\n\t\tspace: 'Spacja',\n\t\tenter: 'Enter',\n\t\tescape: 'Esc',\n\t\tbackspace: 'Backspace',\n\t\tdelete: 'Delete',\n\t\thome: 'Home',\n\t\tend: 'End',\n\t\tpageUp: 'Page Up',\n\t\tpageDown: 'Page Down',\n\t\tarrowUp: 'strzałka w górę',\n\t\tarrowDown: 'strzałka w dół',\n\t\tarrowLeft: 'strzałka w lewo',\n\t\tarrowRight: 'strzałka w prawo',\n\t},\n};\n","import { InjectionToken } from '@angular/core';\nimport { LuTranslation } from '@lucca-front/ng/core';\nimport { Translations } from './translations';\n\nexport const LU_KBD_TRANSLATIONS = new InjectionToken('LuKbdTranslations', {\n\tfactory: () => luKbdTranslations,\n});\n\nexport interface LuKbdTranslations {\n\talt: string;\n\toption: string;\n\tcontrol: string;\n\tmeta: string;\n\tcommand: string;\n\tshift: string;\n\ttab: string;\n\tspace: string;\n\tenter: string;\n\tescape: string;\n\tbackspace: string;\n\tdelete: string;\n\thome: string;\n\tend: string;\n\tpageUp: string;\n\tpageDown: string;\n\tarrowUp: string;\n\tarrowDown: string;\n\tarrowLeft: string;\n\tarrowRight: string;\n}\n\nexport const luKbdTranslations: LuTranslation<LuKbdTranslations> = Translations;\n","import { LuccaIcon } from '@lucca-front/ng/icon';\nimport { LuKbdTranslations } from './kbd.translate';\n\nexport type KbdKey =\n\t| 'Alt'\n\t| 'Control'\n\t| 'Meta'\n\t| 'Shift'\n\t| 'Tab'\n\t| ' '\n\t| 'Enter'\n\t| 'Escape'\n\t| 'Backspace'\n\t| 'Delete'\n\t| 'Home'\n\t| 'End'\n\t| 'PageUp'\n\t| 'PageDown'\n\t| 'ArrowUp'\n\t| 'ArrowDown'\n\t| 'ArrowLeft'\n\t| 'ArrowRight'\n\t| (string & Record<never, never>);\n\nexport type DisplayedKey = { type: 'text'; label: string } | { type: 'icon'; label: string; icon: LuccaIcon };\n\nexport const LABELS: Partial<Record<KbdKey, keyof LuKbdTranslations>> = {\n\tAlt: 'alt',\n\tControl: 'control',\n\tMeta: 'meta',\n\t' ': 'space',\n\tEscape: 'escape',\n\tHome: 'home',\n\tEnd: 'end',\n};\n\nexport const ICONS: Partial<Record<KbdKey, [LuccaIcon, keyof LuKbdTranslations]>> = {\n\tShift: ['arrowShift', 'shift'],\n\tTab: ['arrowLineRight', 'tab'],\n\tEnter: ['arrowEnter', 'enter'],\n\tBackspace: ['arrowBackspace', 'backspace'],\n\tDelete: ['arrowDelete', 'delete'],\n\tPageUp: ['arrowPageUp', 'pageUp'],\n\tPageDown: ['arrowPageDown', 'pageDown'],\n\tArrowUp: ['arrowTop', 'arrowUp'],\n\tArrowDown: ['arrowBottom', 'arrowDown'],\n\tArrowLeft: ['arrowLeft', 'arrowLeft'],\n\tArrowRight: ['arrowRight', 'arrowRight'],\n};\n\n/**\n * Apple displays its modifiers as symbols: ⌥ Option and ⌘ Command\n */\nexport const MAC_ICONS: Partial<Record<KbdKey, [LuccaIcon, keyof LuKbdTranslations]>> = {\n\t...ICONS,\n\tAlt: ['keyboardOption', 'option'],\n\tMeta: ['keyboardCommand', 'command'],\n};\n\n/**\n * Conventional order of the modifiers, displayed before the other keys whatever their order in `keys`:\n * Control, Option, Shift, Command on Mac (Apple Human Interface Guidelines), Windows key, Ctrl, Alt, Shift elsewhere\n */\nexport const MAC_MODIFIERS: KbdKey[] = ['Control', 'Alt', 'Shift', 'Meta'];\nexport const MODIFIERS: KbdKey[] = ['Meta', 'Control', 'Alt', 'Shift'];\n","/**\n * Whether the page runs on Apple platforms, whose modifiers differ (Option, Command)\n */\nexport function isMacPlatform(): boolean {\n\treturn typeof navigator !== 'undefined' && /Mac|iPhone|iPad/.test(navigator.userAgent);\n}\n","import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';\nimport { intlInputOptions } from '@lucca-front/ng/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { IconComponent } from '@lucca-front/ng/icon';\nimport { LU_KBD_TRANSLATIONS, LuKbdTranslations } from './kbd.translate';\nimport { DisplayedKey, ICONS, KbdKey, LABELS, MAC_ICONS, MAC_MODIFIERS, MODIFIERS } from './kbd.type';\nimport { isMacPlatform } from './kbd.utils';\n\n@Component({\n\tselector: 'lu-kbd',\n\ttemplateUrl: './kbd.component.html',\n\tstyleUrl: './kbd.component.scss',\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\tencapsulation: ViewEncapsulation.None,\n\timports: [IconComponent, NgTemplateOutlet],\n})\nexport class KbdComponent {\n\treadonly #isMac = isMacPlatform();\n\n\t/**\n\t * Key, or combination of keys, to display, as named by `KeyboardEvent.key` (`'Escape'`, `['Control', 'n']`…).\n\t * Keys follow the platform (Option and Command on Mac).\n\t * Modifiers are displayed first, in the conventional order of the platform.\n\t */\n\treadonly keys = input.required<KbdKey | readonly KbdKey[]>();\n\n\t/**\n\t * Overrides the default labels of the keys\n\t */\n\treadonly intl = input(...intlInputOptions(LU_KBD_TRANSLATIONS));\n\n\treadonly displayedKeys = computed<DisplayedKey[]>(() => {\n\t\tconst keys = this.keys();\n\t\tconst intl = this.intl();\n\t\tconst modifiers = this.#isMac ? MAC_MODIFIERS : MODIFIERS;\n\t\tconst given = typeof keys === 'string' ? [keys] : keys;\n\t\treturn [...modifiers.filter((modifier) => given.includes(modifier)), ...given.filter((key) => !modifiers.includes(key))].map((key) => this.#display(key, intl));\n\t});\n\n\t#display(key: KbdKey, intl: LuKbdTranslations): DisplayedKey {\n\t\tconst icon = (this.#isMac ? MAC_ICONS : ICONS)[key];\n\t\tif (icon) {\n\t\t\treturn { type: 'icon', icon: icon[0], label: intl[icon[1]] };\n\t\t}\n\t\tconst label = LABELS[key];\n\t\tif (label) {\n\t\t\treturn { type: 'text', label: intl[label] };\n\t\t}\n\t\treturn { type: 'text', label: key.length === 1 ? key.toUpperCase() : key };\n\t}\n}\n","@if (displayedKeys().length === 1) {\n\t<span class=\"kbdWrapper\">\n\t\t<kbd class=\"kbd\">\n\t\t\t<ng-container *ngTemplateOutlet=\"content; context: { $implicit: displayedKeys()[0] }\" />\n\t\t</kbd>\n\t</span>\n} @else {\n\t<kbd class=\"kbdWrapper\">\n\t\t@for (key of displayedKeys(); track $index) {\n\t\t\t@if (!$first) {\n\t\t\t\t+\n\t\t\t}\n\t\t\t<kbd class=\"kbd\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"content; context: { $implicit: key }\" />\n\t\t\t</kbd>\n\t\t}\n\t</kbd>\n}\n\n<ng-template #content let-key>\n\t@switch (key.type) {\n\t\t@case (\"icon\") {\n\t\t\t<lu-icon [icon]=\"key.icon\" size=\"XXS\" [alt]=\"key.label\" />\n\t\t}\n\t\t@default {\n\t\t\t{{ key.label }}\n\t\t}\n\t}\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/lucca-front-ng-link.mjs

@@ -47,10 +47,10 @@ class LuRouterLink extends RouterLink {
     get publicReactiveHref() {
         return this.reactiveHref;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuRouterLink, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: 'tabindex', attribute: true }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i2.LocationStrategy }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.4", type: LuRouterLink, isStandalone: true, selector: "[luRouterLink]", usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuRouterLink, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: 'tabindex', attribute: true }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i2.LocationStrategy }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.1", type: LuRouterLink, isStandalone: true, selector: "[luRouterLink]", usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuRouterLink, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuRouterLink, decorators: [{
             type: Directive,
             args: [{
                     selector: '[luRouterLink]',
@@ -165,10 +165,10 @@ class LinkComponent {
         // they all describe an internal route, so the serialized URL must carry the baseHref.
         return this.location.prepareExternalUrl(serializedUrl);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: LinkComponent, isStandalone: true, selector: "a[luLink], button[luLink]", inputs: { intl: { classPropertyName: "intl", publicName: "intl", isSignal: true, isRequired: false, transformFunction: null }, luHref: { classPropertyName: "luHref", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, routerLinkCommands: { classPropertyName: "routerLinkCommands", publicName: "luLink", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, decorationHover: { classPropertyName: "decorationHover", publicName: "decorationHover", isSignal: true, isRequired: false, transformFunction: null }, external: { classPropertyName: "external", publicName: "external", isSignal: true, isRequired: false, transformFunction: null }, hiddenIcon: { classPropertyName: "hiddenIcon", publicName: "hiddenIcon", isSignal: true, isRequired: false, transformFunction: null }, neutral: { classPropertyName: "neutral", publicName: "neutral", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "redirect()" }, properties: { "attr.href": "routerLink.publicReactiveHref()", "class.mod-decorationHover": "decorationHover()", "class.mod-icon": "external()", "class.mod-neutral": "neutral()", "class.mod-hiddenIcon": "hiddenIcon() || (this.insideIndexTable && external()) || (this.insideDataTable && external())", "class.is-disabled": "this.disabled()", "attr.rel": "external() && !disabled() ? \"noopener noreferrer\" : null", "attr.target": "external() && !disabled() ? \"_blank\" : null", "attr.role": "disabled() ? \"presentation\" : null" }, classAttribute: "link" }, hostDirectives: [{ directive: LuRouterLink, inputs: ["preserveFragment", "preserveFragment", "skipLocationChange", "skipLocationChange", "replaceUrl", "replaceUrl", "queryParams", "queryParams", "fragment", "fragment", "queryParamsHandling", "queryParamsHandling", "state", "state", "info", "info", "relativeTo", "relativeTo"] }], ngImport: i0, template: "<span class=\"link-text\"><ng-content /></span>\n@if (external()) {\n\t<span class=\"link-icon\">\n\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-arrowExternal\"></span>\n\t</span>\n\t<span class=\"pr-u-mask\">{{ intl().external }}</span>\n}\n", styles: ["@charset \"UTF-8\";@layer components{.link{--components-link-textDecoration: underline;--components-link-text-textDecoration: underline;--components-link-color: var(--commons-text-link-color);--components-link-color-hover: var(--commons-text-link-hover);--components-link-cursor: pointer;--components-link-icon-marginInlineStart: 0;--components-link-icon-opacity: 1;background-color:transparent;color:var(--components-link-color);cursor:var(--components-link-cursor);font-family:inherit;border:0;margin:0;padding:0;text-decoration:var(--components-link-textDecoration)}.link:not(:disabled,.is-disabled):hover{color:var(--components-link-color-hover)}.link:not(:disabled,.is-disabled):focus-visible{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:2px;border-radius:var(--pr-t-border-radius-small)}.link .lucca-icon{text-decoration:none;font-size:1em;vertical-align:baseline;position:relative;inset-block-start:.075rem;margin-inline-start:var(--components-link-icon-marginInlineStart)}.link .link-text{text-decoration:var(--components-link-text-textDecoration)}.link-icon{white-space:nowrap;opacity:var(--components-link-icon-opacity);transition-property:opacity;transition-duration:var(--commons-animations-durations-fast)}.link-icon:before{content:\"\\a0\"/\"\"}}@layer mods{.link.mod-decorationHover{--components-link-textDecoration: none;--components-link-text-textDecoration: none}.link.mod-decorationHover:hover{--components-link-text-textDecoration: underline}.link.mod-decorationHover:hover:not(:has(.link-text)){--components-link-textDecoration: underline}.link.mod-neutral{--components-link-color: var(--pr-t-color-text);--components-link-color-hover: var(--palettes-neutral-900)}@media not (any-pointer:coarse){.link.mod-hiddenIcon:not(:hover,:focus-visible){--components-link-icon-opacity: 0}}.link:is(:disabled,.is-disabled){--components-link-color: var(--pr-t-color-text-disabled);--components-link-cursor: not-allowed}.link:has(.link-text){--components-link-textDecoration: none}.link:not(:has(.link-icon)){--components-link-icon-marginInlineStart: .2em}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: LinkComponent, isStandalone: true, selector: "a[luLink], button[luLink]", inputs: { intl: { classPropertyName: "intl", publicName: "intl", isSignal: true, isRequired: false, transformFunction: null }, luHref: { classPropertyName: "luHref", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, routerLinkCommands: { classPropertyName: "routerLinkCommands", publicName: "luLink", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, decorationHover: { classPropertyName: "decorationHover", publicName: "decorationHover", isSignal: true, isRequired: false, transformFunction: null }, external: { classPropertyName: "external", publicName: "external", isSignal: true, isRequired: false, transformFunction: null }, hiddenIcon: { classPropertyName: "hiddenIcon", publicName: "hiddenIcon", isSignal: true, isRequired: false, transformFunction: null }, neutral: { classPropertyName: "neutral", publicName: "neutral", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "redirect()" }, properties: { "attr.href": "routerLink.publicReactiveHref()", "class.mod-decorationHover": "decorationHover()", "class.mod-icon": "external()", "class.mod-neutral": "neutral()", "class.mod-hiddenIcon": "hiddenIcon() || (this.insideIndexTable && external()) || (this.insideDataTable && external())", "class.is-disabled": "this.disabled()", "attr.rel": "external() && !disabled() ? \"noopener noreferrer\" : null", "attr.target": "external() && !disabled() ? \"_blank\" : null", "attr.role": "disabled() ? \"presentation\" : null" }, classAttribute: "link" }, hostDirectives: [{ directive: LuRouterLink, inputs: ["preserveFragment", "preserveFragment", "skipLocationChange", "skipLocationChange", "replaceUrl", "replaceUrl", "queryParams", "queryParams", "fragment", "fragment", "queryParamsHandling", "queryParamsHandling", "state", "state", "info", "info", "relativeTo", "relativeTo"] }], ngImport: i0, template: "<span class=\"link-text\"><ng-content /></span>\n@if (external()) {\n\t<span class=\"link-icon\">\n\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-arrowExternal\"></span>\n\t</span>\n\t<span class=\"pr-u-mask\">{{ intl().external }}</span>\n}\n", styles: ["@charset \"UTF-8\";@layer components{.link{--components-link-textDecoration: underline;--components-link-text-textDecoration: underline;--components-link-color: var(--commons-text-link-color);--components-link-color-hover: var(--commons-text-link-hover);--components-link-cursor: pointer;--components-link-icon-marginInlineStart: 0;--components-link-icon-opacity: 1;background-color:transparent;color:var(--components-link-color);cursor:var(--components-link-cursor);font-family:inherit;border:0;margin:0;padding:0;text-decoration:var(--components-link-textDecoration)}.link:not(:disabled,.is-disabled):hover{color:var(--components-link-color-hover)}.link:not(:disabled,.is-disabled):focus-visible{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:2px;border-radius:var(--pr-t-border-radius-small)}.link .lucca-icon{text-decoration:none;font-size:1em;vertical-align:baseline;position:relative;inset-block-start:.075rem;margin-inline-start:var(--components-link-icon-marginInlineStart)}.link .link-text{text-decoration:var(--components-link-text-textDecoration)}.link-icon{white-space:nowrap;opacity:var(--components-link-icon-opacity);transition-property:opacity;transition-duration:var(--commons-animations-durations-fast)}.link-icon:before{content:\"\\a0\"/\"\"}}@layer mods{.link.mod-decorationHover{--components-link-textDecoration: none;--components-link-text-textDecoration: none}.link.mod-decorationHover:hover{--components-link-text-textDecoration: underline}.link.mod-decorationHover:hover:not(:has(.link-text)){--components-link-textDecoration: underline}.link.mod-neutral{--components-link-color: var(--pr-t-color-text);--components-link-color-hover: var(--palettes-neutral-900)}@media not (any-pointer:coarse){.link.mod-hiddenIcon:not(:hover,:focus-visible){--components-link-icon-opacity: 0}}.link:is(:disabled,.is-disabled){--components-link-color: var(--pr-t-color-text-disabled);--components-link-cursor: not-allowed}.link:has(.link-text){--components-link-textDecoration: none}.link:not(:has(.link-icon)){--components-link-icon-marginInlineStart: .2em}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LinkComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LinkComponent, decorators: [{
             type: Component,
             args: [{ selector: 'a[luLink], button[luLink]', standalone: true, encapsulation: ViewEncapsulation.None, host: {
                         class: 'link',

package/fesm2022/lucca-front-ng-listbox.mjs

@@ -1,6 +1,7 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, Directive, inject, input, computed, contentChild, forwardRef, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
 import { luBooleanAttribute } from '@lucca-front/ng/core';
+import { ɵinjectRandomPercent as _injectRandomPercent } from '@lucca/prisme/core';
 import { IconComponent } from '@lucca-front/ng/icon';
 
 /**
@@ -13,10 +14,10 @@ const OPTION_INSTANCE = new InjectionToken('LuOptionInstance');
 
 let nextId$1 = 0;
 class Treeitem {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: Treeitem, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.4", type: Treeitem, isStandalone: true, selector: "[treeitem]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: Treeitem, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.1", type: Treeitem, isStandalone: true, selector: "[treeitem]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: Treeitem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: Treeitem, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -78,10 +79,10 @@ class OptionComponent {
     #listboxRef;
     #parentOptionRef;
     #defaultGroupId;
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: OptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: OptionComponent, isStandalone: true, selector: "lu-listbox-option", inputs: { elementId: { classPropertyName: "elementId", publicName: "elementId", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, mixed: { classPropertyName: "mixed", publicName: "mixed", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hovered: { classPropertyName: "hovered", publicName: "hovered", isSignal: true, isRequired: false, transformFunction: null }, add: { classPropertyName: "add", publicName: "add", isSignal: true, isRequired: false, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, groupId: { classPropertyName: "groupId", publicName: "groupId", isSignal: true, isRequired: false, transformFunction: null }, select: { classPropertyName: "select", publicName: "select", isSignal: true, isRequired: false, transformFunction: null }, selectAll: { classPropertyName: "selectAll", publicName: "selectAll", isSignal: true, isRequired: false, transformFunction: null }, treeitemLevel: { classPropertyName: "treeitemLevel", publicName: "treeitemLevel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "group() ? \"group\" : tree() ? \"treeitem\" : \"option\"", "attr.aria-labelledby": "group() ? groupLabelId() : null", "attr.aria-selected": "add() || group() || mixed() ? null : checked()", "attr.aria-checked": "!group() && mixed() ? \"mixed\" : null", "attr.aria-disabled": "disabled()", "attr.aria-hidden": "empty()", "attr.id": "empty() ? id() : elementId()", "class.is-selected": "checked()", "class.is-disabled": "disabled()", "class.mod-add": "add()", "class.mod-select": "select()" }, classAttribute: "listboxOption" }, providers: [{ provide: OPTION_INSTANCE, useExisting: forwardRef(() => OptionComponent) }], queries: [{ propertyName: "treeitemContent", first: true, predicate: Treeitem, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"listboxOption-content\" [class.is-hovered]=\"hovered()\" [attr.id]=\"group() ? groupLabelId() : null\">\n\t@if (multiple() && !add() && !selectAll() && !select()) {\n\t\t<span class=\"listboxOption-content-checkboxField checkboxField\" aria-hidden=\"true\">\n\t\t\t<span class=\"listboxOption-content-checkboxField-input checkboxField-input\"></span>\n\t\t\t<span class=\"checkboxField-icon\"><span class=\"checkboxField-icon-check\"></span></span>\n\t\t</span>\n\t}\n\t@if (add()) {\n\t\t<lu-icon icon=\"mathsPlus\" />\n\t}\n\t<ng-content />\n\t<ng-content select=\"[group-action]\" />\n\t@if (selectAll()) {\n\t\t<lu-listbox-option [elementId]=\"elementId() + '-selectAll'\" select>{{ selectAll() }}</lu-listbox-option>\n\t}\n</div>\n<ng-content select=\"[optgroup]\" />\n\n@if (hasTreeitems()) {\n\t<div class=\"listboxOptionWrapper\" role=\"group\" [attr.style]=\"'--components-listboxOptionWrapper-level: ' + wrapperLevel()\">\n\t\t<ng-content select=\"[treeitem]\" />\n\t</div>\n}\n", dependencies: [{ kind: "component", type: OptionComponent, selector: "lu-listbox-option", inputs: ["elementId", "checked", "mixed", "disabled", "hovered", "add", "group", "groupId", "select", "selectAll", "treeitemLevel"] }, { kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: OptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: OptionComponent, isStandalone: true, selector: "lu-listbox-option", inputs: { elementId: { classPropertyName: "elementId", publicName: "elementId", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, mixed: { classPropertyName: "mixed", publicName: "mixed", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hovered: { classPropertyName: "hovered", publicName: "hovered", isSignal: true, isRequired: false, transformFunction: null }, add: { classPropertyName: "add", publicName: "add", isSignal: true, isRequired: false, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, groupId: { classPropertyName: "groupId", publicName: "groupId", isSignal: true, isRequired: false, transformFunction: null }, select: { classPropertyName: "select", publicName: "select", isSignal: true, isRequired: false, transformFunction: null }, selectAll: { classPropertyName: "selectAll", publicName: "selectAll", isSignal: true, isRequired: false, transformFunction: null }, treeitemLevel: { classPropertyName: "treeitemLevel", publicName: "treeitemLevel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "group() ? \"group\" : tree() ? \"treeitem\" : \"option\"", "attr.aria-labelledby": "group() ? groupLabelId() : null", "attr.aria-selected": "add() || group() || mixed() ? null : checked()", "attr.aria-checked": "!group() && mixed() ? \"mixed\" : null", "attr.aria-disabled": "disabled()", "attr.aria-hidden": "empty()", "attr.id": "empty() ? id() : elementId()", "class.is-selected": "checked()", "class.is-disabled": "disabled()", "class.mod-add": "add()", "class.mod-select": "select()" }, classAttribute: "listboxOption" }, providers: [{ provide: OPTION_INSTANCE, useExisting: forwardRef(() => OptionComponent) }], queries: [{ propertyName: "treeitemContent", first: true, predicate: Treeitem, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"listboxOption-content\" [class.is-hovered]=\"hovered()\" [attr.id]=\"group() ? groupLabelId() : null\">\n\t@if (multiple() && !add() && !selectAll() && !select()) {\n\t\t<span class=\"listboxOption-content-checkboxField checkboxField\" aria-hidden=\"true\">\n\t\t\t<span class=\"listboxOption-content-checkboxField-input checkboxField-input\"></span>\n\t\t\t<span class=\"checkboxField-icon\"><span class=\"checkboxField-icon-check\"></span></span>\n\t\t</span>\n\t}\n\t@if (add()) {\n\t\t<lu-icon icon=\"mathsPlus\" />\n\t}\n\t<ng-content />\n\t<ng-content select=\"[group-action]\" />\n\t@if (selectAll()) {\n\t\t<lu-listbox-option [elementId]=\"elementId() + '-selectAll'\" select>{{ selectAll() }}</lu-listbox-option>\n\t}\n</div>\n<ng-content select=\"[optgroup]\" />\n\n@if (hasTreeitems()) {\n\t<div class=\"listboxOptionWrapper\" role=\"group\" [attr.style]=\"'--components-listboxOptionWrapper-level: ' + wrapperLevel()\">\n\t\t<ng-content select=\"[treeitem]\" />\n\t</div>\n}\n", dependencies: [{ kind: "component", type: OptionComponent, selector: "lu-listbox-option", inputs: ["elementId", "checked", "mixed", "disabled", "hovered", "add", "group", "groupId", "select", "selectAll", "treeitemLevel"] }, { kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: OptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: OptionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-listbox-option', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'listboxOption',
@@ -123,13 +124,15 @@ class ListboxComponent {
         this.statusMsg = input(null, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "statusMsg" }] : /* istanbul ignore next */ []));
         this.listboxId = `listbox${nextId++}`;
-        this.skeletonWidth = computed(() => (this.state() === 'loading' ? `${Math.floor(Math.random() * 60 + 20)}%` : null), /* @ts-ignore */
+        this.#randomPercent = _injectRandomPercent(20, 80);
+        this.skeletonWidth = computed(() => (this.state() === 'loading' ? this.#randomPercent() : null), /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "skeletonWidth" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: ListboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: ListboxComponent, isStandalone: true, selector: "lu-listbox", inputs: { multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, tree: { classPropertyName: "tree", publicName: "tree", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, statusMsg: { classPropertyName: "statusMsg", publicName: "statusMsg", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "tree() ? \"tree\" : \"listbox\"", "attr.aria-multiselectable": "multiple() ? true : null", "class.mod-multiple": "multiple()", "attr.aria-busy": "state() === \"loading\"", "attr.aria-describedby": "state() === \"empty\" ? listboxId : null" }, classAttribute: "listboxOptionWrapper" }, providers: [{ provide: LISTBOX_INSTANCE, useExisting: forwardRef(() => ListboxComponent) }], ngImport: i0, template: "<ng-content select=\"[listbox-header]\" />\n@if (state() !== \"empty\") {\n\t<ng-content />\n}\n@if (state() === \"empty\") {\n\t<lu-listbox-option empty>{{ statusMsg() }}</lu-listbox-option>\n} @else if (state() === \"loading\") {\n\t<lu-listbox-option class=\"skeleton is-loading\" inert=\"inert\">\n\t\t<span class=\"skeleton-item\" [style.--components-skeleton-text-width]=\"skeletonWidth()\"></span>\n\t</lu-listbox-option>\n\t<span class=\"pr-u-mask\">{{ statusMsg() }}</span>\n}\n", dependencies: [{ kind: "component", type: OptionComponent, selector: "lu-listbox-option", inputs: ["elementId", "checked", "mixed", "disabled", "hovered", "add", "group", "groupId", "select", "selectAll", "treeitemLevel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    #randomPercent;
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: ListboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: ListboxComponent, isStandalone: true, selector: "lu-listbox", inputs: { multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, tree: { classPropertyName: "tree", publicName: "tree", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, statusMsg: { classPropertyName: "statusMsg", publicName: "statusMsg", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "tree() ? \"tree\" : \"listbox\"", "attr.aria-multiselectable": "multiple() ? true : null", "class.mod-multiple": "multiple()", "attr.aria-busy": "state() === \"loading\"", "attr.aria-describedby": "state() === \"empty\" ? listboxId : null" }, classAttribute: "listboxOptionWrapper" }, providers: [{ provide: LISTBOX_INSTANCE, useExisting: forwardRef(() => ListboxComponent) }], ngImport: i0, template: "<ng-content select=\"[listbox-header]\" />\n@if (state() !== \"empty\") {\n\t<ng-content />\n}\n@if (state() === \"empty\") {\n\t<lu-listbox-option empty>{{ statusMsg() }}</lu-listbox-option>\n} @else if (state() === \"loading\") {\n\t<lu-listbox-option class=\"skeleton is-loading\" inert=\"inert\">\n\t\t<span class=\"skeleton-item\" [style.--components-skeleton-text-width]=\"skeletonWidth()\"></span>\n\t</lu-listbox-option>\n\t<span class=\"pr-u-mask\">{{ statusMsg() }}</span>\n}\n", dependencies: [{ kind: "component", type: OptionComponent, selector: "lu-listbox-option", inputs: ["elementId", "checked", "mixed", "disabled", "hovered", "add", "group", "groupId", "select", "selectAll", "treeitemLevel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: ListboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: ListboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-listbox', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'listboxOptionWrapper',

package/fesm2022/lucca-front-ng-listbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lucca-front-ng-listbox.mjs","sources":["../../../packages/ng/listbox/listbox.type.ts","../../../packages/ng/listbox/tokens.ts","../../../packages/ng/listbox/option/option.component.ts","../../../packages/ng/listbox/option/option.component.html","../../../packages/ng/listbox/listbox.component.ts","../../../packages/ng/listbox/listbox.component.html","../../../packages/ng/listbox/lucca-front-ng-listbox.ts"],"sourcesContent":["/**\n * Available ListboxComponent Types\n */\n\nexport const LISTBOX_STATE = ['loading', 'empty'] as const;\nexport type ListboxState = (typeof LISTBOX_STATE)[number];\n","import { InjectionToken } from '@angular/core';\nimport { ListboxComponent } from './listbox.component';\nimport { OptionComponent } from './option/option.component';\n\nexport const LISTBOX_INSTANCE = new InjectionToken<ListboxComponent>('LuListboxInstance');\nexport const OPTION_INSTANCE = new InjectionToken<OptionComponent>('LuOptionInstance');\n","import { ChangeDetectionStrategy, Component, computed, contentChild, Directive, forwardRef, inject, input, ViewEncapsulation } from '@angular/core';\nimport { luBooleanAttribute } from '@lucca-front/ng/core';\nimport { IconComponent } from '@lucca-front/ng/icon';\nimport { LISTBOX_INSTANCE, OPTION_INSTANCE } from '../tokens';\n\nlet nextId = 0;\n\n@Directive({\n\t// eslint-disable-next-line @angular-eslint/directive-selector\n\tselector: '[treeitem]',\n})\nexport class Treeitem {}\n\n@Component({\n\tselector: 'lu-listbox-option',\n\ttemplateUrl: './option.component.html',\n\tencapsulation: ViewEncapsulation.None,\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\thost: {\n\t\tclass: 'listboxOption',\n\t\t'[attr.role]': 'group() ? \"group\" : tree() ? \"treeitem\" : \"option\"',\n\t\t'[attr.aria-labelledby]': 'group() ? groupLabelId() : null',\n\t\t'[attr.aria-selected]': 'add() || group() || mixed() ? null : checked()',\n\t\t'[attr.aria-checked]': '!group() && mixed() ? \"mixed\" : null',\n\t\t'[attr.aria-disabled]': 'disabled()',\n\t\t'[attr.aria-hidden]': 'empty()',\n\t\t// The empty status option is the target of the listbox `aria-describedby`, so it must\n\t\t// carry the listbox id even though no consumer sets an elementId on it.\n\t\t'[attr.id]': 'empty() ? id() : elementId()',\n\t\t'[class.is-selected]': 'checked()',\n\t\t'[class.is-disabled]': 'disabled()',\n\t\t'[class.mod-add]': 'add()',\n\t\t'[class.mod-select]': 'select()',\n\t},\n\timports: [IconComponent],\n\tproviders: [{ provide: OPTION_INSTANCE, useExisting: forwardRef(() => OptionComponent) }],\n})\nexport class OptionComponent {\n\t// Optional so the option can live outside a lu-listbox, e.g. a sticky \"add option\" row\n\t// rendered next to the listbox but inside the same scroll container.\n\t#listboxRef = inject(LISTBOX_INSTANCE, { optional: true });\n\t#parentOptionRef = inject(OPTION_INSTANCE, { skipSelf: true, optional: true });\n\n\treadonly elementId = input<string | null>(null);\n\n\treadonly checked = input(false, { transform: luBooleanAttribute });\n\n\treadonly mixed = input(false, { transform: luBooleanAttribute });\n\n\treadonly disabled = input(false, { transform: luBooleanAttribute });\n\n\treadonly hovered = input(false, { transform: luBooleanAttribute });\n\n\treadonly add = input(false, { transform: luBooleanAttribute });\n\n\treadonly group = input(false, { transform: luBooleanAttribute });\n\n\t/**\n\t * Overrides the generated id used to label the group, so consumers can provide\n\t * a deterministic id (e.g. derived from a select id and a group key).\n\t */\n\treadonly groupId = input<string | null>(null);\n\n\treadonly select = input(false, { transform: luBooleanAttribute });\n\n\treadonly selectAll = input<'string' | null>();\n\n\treadonly multiple = computed(() => this.#listboxRef?.multiple() ?? false);\n\treadonly tree = computed(() => this.#listboxRef?.tree() ?? false);\n\treadonly empty = computed(() => this.#listboxRef?.state() === 'empty');\n\treadonly id = computed(() => this.#listboxRef?.listboxId ?? null);\n\n\treadonly groupLabelId = computed(() => this.groupId() ?? this.#defaultGroupId);\n\n\treadonly #defaultGroupId = `group${nextId++}`;\n\n\treadonly treeitemContent = contentChild(Treeitem);\n\n\t/**\n\t * Depth of the nested `[treeitem]` wrapper, for consumers that hand their own projected\n\t * content over to this option: a content query does not cross an `ng-content` boundary, so\n\t * the option can then neither see those children nor derive the depth it sits at. Setting it\n\t * renders the wrapper and pins its level; leave it null to let both be worked out here.\n\t */\n\treadonly treeitemLevel = input<number | null>(null);\n\n\treadonly level: number = (this.#parentOptionRef?.level || 0) + 1;\n\n\treadonly hasTreeitems = computed(() => !!this.treeitemContent() || this.treeitemLevel() !== null);\n\n\treadonly wrapperLevel = computed(() => this.treeitemLevel() ?? this.level);\n}\n","<div class=\"listboxOption-content\" [class.is-hovered]=\"hovered()\" [attr.id]=\"group() ? groupLabelId() : null\">\n\t@if (multiple() && !add() && !selectAll() && !select()) {\n\t\t<span class=\"listboxOption-content-checkboxField checkboxField\" aria-hidden=\"true\">\n\t\t\t<span class=\"listboxOption-content-checkboxField-input checkboxField-input\"></span>\n\t\t\t<span class=\"checkboxField-icon\"><span class=\"checkboxField-icon-check\"></span></span>\n\t\t</span>\n\t}\n\t@if (add()) {\n\t\t<lu-icon icon=\"mathsPlus\" />\n\t}\n\t<ng-content />\n\t<ng-content select=\"[group-action]\" />\n\t@if (selectAll()) {\n\t\t<lu-listbox-option [elementId]=\"elementId() + '-selectAll'\" select>{{ selectAll() }}</lu-listbox-option>\n\t}\n</div>\n<ng-content select=\"[optgroup]\" />\n\n@if (hasTreeitems()) {\n\t<div class=\"listboxOptionWrapper\" role=\"group\" [attr.style]=\"'--components-listboxOptionWrapper-level: ' + wrapperLevel()\">\n\t\t<ng-content select=\"[treeitem]\" />\n\t</div>\n}\n","import { ChangeDetectionStrategy, Component, computed, forwardRef, input, ViewEncapsulation } from '@angular/core';\n\nimport { luBooleanAttribute } from '@lucca-front/ng/core';\nimport { ListboxState } from './listbox.type';\nimport { OptionComponent } from './option/option.component';\nimport { LISTBOX_INSTANCE } from './tokens';\n\nlet nextId = 0;\n\n@Component({\n\tselector: 'lu-listbox',\n\ttemplateUrl: './listbox.component.html',\n\tencapsulation: ViewEncapsulation.None,\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\thost: {\n\t\tclass: 'listboxOptionWrapper',\n\t\t'[attr.role]': 'tree() ? \"tree\" : \"listbox\"',\n\t\t'[attr.aria-multiselectable]': 'multiple() ? true : null',\n\t\t'[class.mod-multiple]': 'multiple()',\n\t\t'[attr.aria-busy]': 'state() === \"loading\"',\n\t\t'[attr.aria-describedby]': 'state() === \"empty\" ? listboxId : null',\n\t},\n\timports: [OptionComponent],\n\tproviders: [{ provide: LISTBOX_INSTANCE, useExisting: forwardRef(() => ListboxComponent) }],\n})\nexport class ListboxComponent {\n\t/**\n\t * Applies multiple mod to the listbox\n\t */\n\treadonly multiple = input(false, { transform: luBooleanAttribute });\n\n\t/**\n\t * Defines listbox role tree or listbox by default\n\t */\n\treadonly tree = input(false, { transform: luBooleanAttribute });\n\n\t/**\n\t * Listbox state\n\t */\n\treadonly state = input<ListboxState | null>(null);\n\n\t/**\n\t * Add message when listbox state loading or empty\n\t */\n\treadonly statusMsg = input<string | null>(null);\n\n\treadonly listboxId = `listbox${nextId++}`;\n\n\treadonly skeletonWidth = computed(() => (this.state() === 'loading' ? `${Math.floor(Math.random() * 60 + 20)}%` : null));\n}\n","<ng-content select=\"[listbox-header]\" />\n@if (state() !== \"empty\") {\n\t<ng-content />\n}\n@if (state() === \"empty\") {\n\t<lu-listbox-option empty>{{ statusMsg() }}</lu-listbox-option>\n} @else if (state() === \"loading\") {\n\t<lu-listbox-option class=\"skeleton is-loading\" inert=\"inert\">\n\t\t<span class=\"skeleton-item\" [style.--components-skeleton-text-width]=\"skeletonWidth()\"></span>\n\t</lu-listbox-option>\n\t<span class=\"pr-u-mask\">{{ statusMsg() }}</span>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["nextId"],"mappings":"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"}
+{"version":3,"file":"lucca-front-ng-listbox.mjs","sources":["../../../packages/ng/listbox/listbox.type.ts","../../../packages/ng/listbox/tokens.ts","../../../packages/ng/listbox/option/option.component.ts","../../../packages/ng/listbox/option/option.component.html","../../../packages/ng/listbox/listbox.component.ts","../../../packages/ng/listbox/listbox.component.html","../../../packages/ng/listbox/lucca-front-ng-listbox.ts"],"sourcesContent":["/**\n * Available ListboxComponent Types\n */\n\nexport const LISTBOX_STATE = ['loading', 'empty'] as const;\nexport type ListboxState = (typeof LISTBOX_STATE)[number];\n","import { InjectionToken } from '@angular/core';\nimport { ListboxComponent } from './listbox.component';\nimport { OptionComponent } from './option/option.component';\n\nexport const LISTBOX_INSTANCE = new InjectionToken<ListboxComponent>('LuListboxInstance');\nexport const OPTION_INSTANCE = new InjectionToken<OptionComponent>('LuOptionInstance');\n","import { ChangeDetectionStrategy, Component, computed, contentChild, Directive, forwardRef, inject, input, ViewEncapsulation } from '@angular/core';\nimport { luBooleanAttribute } from '@lucca-front/ng/core';\nimport { IconComponent } from '@lucca-front/ng/icon';\nimport { LISTBOX_INSTANCE, OPTION_INSTANCE } from '../tokens';\n\nlet nextId = 0;\n\n@Directive({\n\t// eslint-disable-next-line @angular-eslint/directive-selector\n\tselector: '[treeitem]',\n})\nexport class Treeitem {}\n\n@Component({\n\tselector: 'lu-listbox-option',\n\ttemplateUrl: './option.component.html',\n\tencapsulation: ViewEncapsulation.None,\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\thost: {\n\t\tclass: 'listboxOption',\n\t\t'[attr.role]': 'group() ? \"group\" : tree() ? \"treeitem\" : \"option\"',\n\t\t'[attr.aria-labelledby]': 'group() ? groupLabelId() : null',\n\t\t'[attr.aria-selected]': 'add() || group() || mixed() ? null : checked()',\n\t\t'[attr.aria-checked]': '!group() && mixed() ? \"mixed\" : null',\n\t\t'[attr.aria-disabled]': 'disabled()',\n\t\t'[attr.aria-hidden]': 'empty()',\n\t\t// The empty status option is the target of the listbox `aria-describedby`, so it must\n\t\t// carry the listbox id even though no consumer sets an elementId on it.\n\t\t'[attr.id]': 'empty() ? id() : elementId()',\n\t\t'[class.is-selected]': 'checked()',\n\t\t'[class.is-disabled]': 'disabled()',\n\t\t'[class.mod-add]': 'add()',\n\t\t'[class.mod-select]': 'select()',\n\t},\n\timports: [IconComponent],\n\tproviders: [{ provide: OPTION_INSTANCE, useExisting: forwardRef(() => OptionComponent) }],\n})\nexport class OptionComponent {\n\t// Optional so the option can live outside a lu-listbox, e.g. a sticky \"add option\" row\n\t// rendered next to the listbox but inside the same scroll container.\n\t#listboxRef = inject(LISTBOX_INSTANCE, { optional: true });\n\t#parentOptionRef = inject(OPTION_INSTANCE, { skipSelf: true, optional: true });\n\n\treadonly elementId = input<string | null>(null);\n\n\treadonly checked = input(false, { transform: luBooleanAttribute });\n\n\treadonly mixed = input(false, { transform: luBooleanAttribute });\n\n\treadonly disabled = input(false, { transform: luBooleanAttribute });\n\n\treadonly hovered = input(false, { transform: luBooleanAttribute });\n\n\treadonly add = input(false, { transform: luBooleanAttribute });\n\n\treadonly group = input(false, { transform: luBooleanAttribute });\n\n\t/**\n\t * Overrides the generated id used to label the group, so consumers can provide\n\t * a deterministic id (e.g. derived from a select id and a group key).\n\t */\n\treadonly groupId = input<string | null>(null);\n\n\treadonly select = input(false, { transform: luBooleanAttribute });\n\n\treadonly selectAll = input<'string' | null>();\n\n\treadonly multiple = computed(() => this.#listboxRef?.multiple() ?? false);\n\treadonly tree = computed(() => this.#listboxRef?.tree() ?? false);\n\treadonly empty = computed(() => this.#listboxRef?.state() === 'empty');\n\treadonly id = computed(() => this.#listboxRef?.listboxId ?? null);\n\n\treadonly groupLabelId = computed(() => this.groupId() ?? this.#defaultGroupId);\n\n\treadonly #defaultGroupId = `group${nextId++}`;\n\n\treadonly treeitemContent = contentChild(Treeitem);\n\n\t/**\n\t * Depth of the nested `[treeitem]` wrapper, for consumers that hand their own projected\n\t * content over to this option: a content query does not cross an `ng-content` boundary, so\n\t * the option can then neither see those children nor derive the depth it sits at. Setting it\n\t * renders the wrapper and pins its level; leave it null to let both be worked out here.\n\t */\n\treadonly treeitemLevel = input<number | null>(null);\n\n\treadonly level: number = (this.#parentOptionRef?.level || 0) + 1;\n\n\treadonly hasTreeitems = computed(() => !!this.treeitemContent() || this.treeitemLevel() !== null);\n\n\treadonly wrapperLevel = computed(() => this.treeitemLevel() ?? this.level);\n}\n","<div class=\"listboxOption-content\" [class.is-hovered]=\"hovered()\" [attr.id]=\"group() ? groupLabelId() : null\">\n\t@if (multiple() && !add() && !selectAll() && !select()) {\n\t\t<span class=\"listboxOption-content-checkboxField checkboxField\" aria-hidden=\"true\">\n\t\t\t<span class=\"listboxOption-content-checkboxField-input checkboxField-input\"></span>\n\t\t\t<span class=\"checkboxField-icon\"><span class=\"checkboxField-icon-check\"></span></span>\n\t\t</span>\n\t}\n\t@if (add()) {\n\t\t<lu-icon icon=\"mathsPlus\" />\n\t}\n\t<ng-content />\n\t<ng-content select=\"[group-action]\" />\n\t@if (selectAll()) {\n\t\t<lu-listbox-option [elementId]=\"elementId() + '-selectAll'\" select>{{ selectAll() }}</lu-listbox-option>\n\t}\n</div>\n<ng-content select=\"[optgroup]\" />\n\n@if (hasTreeitems()) {\n\t<div class=\"listboxOptionWrapper\" role=\"group\" [attr.style]=\"'--components-listboxOptionWrapper-level: ' + wrapperLevel()\">\n\t\t<ng-content select=\"[treeitem]\" />\n\t</div>\n}\n","import { ChangeDetectionStrategy, Component, computed, forwardRef, input, ViewEncapsulation } from '@angular/core';\n\nimport { luBooleanAttribute } from '@lucca-front/ng/core';\nimport { ɵinjectRandomPercent } from '@lucca/prisme/core';\nimport { ListboxState } from './listbox.type';\nimport { OptionComponent } from './option/option.component';\nimport { LISTBOX_INSTANCE } from './tokens';\n\nlet nextId = 0;\n\n@Component({\n\tselector: 'lu-listbox',\n\ttemplateUrl: './listbox.component.html',\n\tencapsulation: ViewEncapsulation.None,\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\thost: {\n\t\tclass: 'listboxOptionWrapper',\n\t\t'[attr.role]': 'tree() ? \"tree\" : \"listbox\"',\n\t\t'[attr.aria-multiselectable]': 'multiple() ? true : null',\n\t\t'[class.mod-multiple]': 'multiple()',\n\t\t'[attr.aria-busy]': 'state() === \"loading\"',\n\t\t'[attr.aria-describedby]': 'state() === \"empty\" ? listboxId : null',\n\t},\n\timports: [OptionComponent],\n\tproviders: [{ provide: LISTBOX_INSTANCE, useExisting: forwardRef(() => ListboxComponent) }],\n})\nexport class ListboxComponent {\n\t/**\n\t * Applies multiple mod to the listbox\n\t */\n\treadonly multiple = input(false, { transform: luBooleanAttribute });\n\n\t/**\n\t * Defines listbox role tree or listbox by default\n\t */\n\treadonly tree = input(false, { transform: luBooleanAttribute });\n\n\t/**\n\t * Listbox state\n\t */\n\treadonly state = input<ListboxState | null>(null);\n\n\t/**\n\t * Add message when listbox state loading or empty\n\t */\n\treadonly statusMsg = input<string | null>(null);\n\n\treadonly listboxId = `listbox${nextId++}`;\n\n\treadonly #randomPercent = ɵinjectRandomPercent(20, 80);\n\n\treadonly skeletonWidth = computed(() => (this.state() === 'loading' ? this.#randomPercent() : null));\n}\n","<ng-content select=\"[listbox-header]\" />\n@if (state() !== \"empty\") {\n\t<ng-content />\n}\n@if (state() === \"empty\") {\n\t<lu-listbox-option empty>{{ statusMsg() }}</lu-listbox-option>\n} @else if (state() === \"loading\") {\n\t<lu-listbox-option class=\"skeleton is-loading\" inert=\"inert\">\n\t\t<span class=\"skeleton-item\" [style.--components-skeleton-text-width]=\"skeletonWidth()\"></span>\n\t</lu-listbox-option>\n\t<span class=\"pr-u-mask\">{{ statusMsg() }}</span>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["nextId","ɵinjectRandomPercent"],"mappings":"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"}