@kaufmann-lab/ui 0.1.17 → 0.1.18

package/README.md

@@ -7,7 +7,7 @@ Ionic, que por debajo sigue siendo Angular.
 > **Nota sobre este README**: por ahora solo documenta `<kf-button>` en
 > detalle. La librería ya tiene muchos más componentes (`Input`, `Checkbox`,
 > `Select`, `Modal`, `Card`, `Tabs`, `Toast`, y otros) — para verlos, mirá el
-> código fuente en `projects/ui/src/lib/` en el
+> código fuente en `projects/ui/core/src/lib/` en el
 > [repositorio](https://github.com/kaufmann-lab/kaufmann-ui-angular) hasta
 > que esta tabla se complete. Ver también el
 > [CHANGELOG](https://github.com/kaufmann-lab/kaufmann-ui-angular/blob/main/CHANGELOG.md)

package/fesm2022/kaufmann-lab-ui-auth.mjs

@@ -0,0 +1,322 @@
+import * as i0 from '@angular/core';
+import { Directive, input, booleanAttribute, contentChild, Component, output, computed } from '@angular/core';
+import { Divider, Text, Icon, Avatar, Spinner } from '@kaufmann-lab/ui/core';
+
+/**
+ * Marca el contenido que va en el slot de SSO de `kf-auth-layout` (típico:
+ * un `kf-sso-button`, o varios si el ecosistema suma más de un proveedor).
+ * `AuthLayout` la detecta vía `contentChild` para decidir si renderiza el
+ * separador "o" entre el bloque de SSO y el formulario tradicional
+ * proyectado en el slot por defecto — sin este marcador, `AuthLayout`
+ * tendría que adivinar si hubo proyección leyendo el DOM a mano.
+ *
+ *   <kf-auth-layout brand="Mi Portal">
+ *     <div kfAuthLayoutSso>
+ *       <kf-sso-button provider="microsoft" (click)="loginWithMicrosoft()" />
+ *     </div>
+ *     <form ...>...</form>
+ *   </kf-auth-layout>
+ */
+class AuthLayoutSso {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: AuthLayoutSso, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.0", type: AuthLayoutSso, isStandalone: true, selector: "[kfAuthLayoutSso]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: AuthLayoutSso, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kfAuthLayoutSso]',
+                }]
+        }] });
+
+/**
+ * Layout a pantalla completa para pantallas de autenticación (login,
+ * recuperar contraseña, confirmación de envío) — panel de marca a la
+ * izquierda, contenido libre a la derecha en desktop; en mobile el panel de
+ * marca se oculta y un logo compacto queda visible arriba del formulario.
+ *
+ * Resuelve solo el "cascarón": cada portal arma su propio `<form>` con los
+ * componentes de la librería y lo proyecta en el slot por defecto.
+ *
+ *   <kf-auth-layout
+ *     brand="Mi Portal"
+ *     brandLogoSrc="images/mi-portal-logo-white.png"
+ *     brandLogoMobileSrc="images/mi-portal-logo-black.png"
+ *     brandTagline="Frase corta de marca, propia de cada portal."
+ *   >
+ *     <form (ngSubmit)="onSubmit()">
+ *       <kf-input label="Correo" type="email" />
+ *       <kf-input label="Contraseña" type="password" toggleable />
+ *       <kf-button type="submit">Ingresar</kf-button>
+ *     </form>
+ *   </kf-auth-layout>
+ *
+ * `backgroundVariant` controla la superficie del panel derecho:
+ * `'plain'` (fondo liso, comportamiento histórico), `'gradient'` (default —
+ * degradé sutil derivado de `--kf-color-primary`/`--kf-color-surface` vía
+ * `color-mix()`, ningún color hardcodeado) o `'pattern'` (el mismo degradé
+ * más una textura de puntos, también resuelta con tokens). Los tres se
+ * resuelven contra los tokens de tema ACTIVOS — cambiar de tema
+ * (`andes-maq`, `divemotor-star`, `kaufmann-ar`, futuros) no requiere tocar
+ * este componente ni pasarle un color a mano.
+ *
+ * `card`, en `false` por defecto (comportamiento histórico: el contenido
+ * proyectado flota sin superficie propia), envuelve el slot por defecto con
+ * la misma superficie de `kf-card` (fondo, borde, sombra, radio) para que
+ * el formulario deje de verse suelto sobre el fondo del panel.
+ *
+ * `title`/`subtitle` renderizan un encabezado de bienvenida DENTRO de la
+ * card, antes que cualquier otro contenido (jerarquía ya resuelta:
+ * `title-lg` + `body-muted`, ver `Text.ts`) — así ningún consumidor tiene
+ * que adivinar la variante de `kf-text` correcta ni terminar con un
+ * "Iniciar sesión" repetido y suelto dentro de su propio `<form>`. Sin
+ * `title`, no se renderiza ningún encabezado (comportamiento histórico).
+ *
+ * El slot `[kfAuthLayoutSso]` (ver `AuthLayoutSso`) es para el patrón
+ * "SSO primero, credenciales como alternativa secundaria" — típicamente un
+ * `kf-sso-button`. Cuando hay contenido ahí, `AuthLayout` resuelve el
+ * separador "o" automáticamente entre ese bloque y el contenido por
+ * defecto; sin ese slot, nada cambia frente al comportamiento actual.
+ *
+ *   <kf-auth-layout
+ *     brand="Mi Portal"
+ *     backgroundVariant="pattern"
+ *     card
+ *     title="Iniciar sesión"
+ *     subtitle="Usa tu cuenta corporativa o ingresa con contraseña"
+ *   >
+ *     <div kfAuthLayoutSso>
+ *       <kf-sso-button provider="microsoft" (click)="loginWithMicrosoft()" />
+ *     </div>
+ *     <form (ngSubmit)="onSubmit()">
+ *       <kf-input label="Correo" type="email" />
+ *       <kf-input label="Contraseña" type="password" toggleable />
+ *       <kf-button type="submit">Ingresar</kf-button>
+ *     </form>
+ *   </kf-auth-layout>
+ */
+class AuthLayout {
+    /** Nombre de marca/portal — wordmark de respaldo si no hay logo, y `alt` de ambos logos. */
+    brand = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "brand" }] : /* istanbul ignore next */ []));
+    /** Logo en blanco para el panel oscuro de desktop. Sin esto, se muestra `brand()` como wordmark. */
+    brandLogoSrc = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "brandLogoSrc" }] : /* istanbul ignore next */ []));
+    /** Frase corta bajo el logo. */
+    brandTagline = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "brandTagline" }] : /* istanbul ignore next */ []));
+    /** Logo compacto para mobile, sobre fondo claro. Sin esto, reutiliza `brandLogoSrc`. */
+    brandLogoMobileSrc = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "brandLogoMobileSrc" }] : /* istanbul ignore next */ []));
+    /** Superficie del panel derecho. Default `'gradient'`; `'plain'` preserva el fondo liso histórico. */
+    backgroundVariant = input('gradient', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "backgroundVariant" }] : /* istanbul ignore next */ []));
+    /** Envuelve el contenido proyectado con la superficie de `kf-card` (fondo, borde, sombra). Default `false` — preserva el comportamiento histórico. */
+    card = input(false, { ...(ngDevMode ? { debugName: "card" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Título del encabezado dentro de la card (`title-lg`). Sin este input, no se renderiza ningún encabezado. */
+    title = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "title" }] : /* istanbul ignore next */ []));
+    /** Subtítulo del encabezado (`body-muted`), debajo de `title`. Sin efecto si `title` no está presente. */
+    subtitle = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "subtitle" }] : /* istanbul ignore next */ []));
+    /** Presencia de contenido en el slot `[kfAuthLayoutSso]` — controla si se renderiza el separador "o". */
+    ssoContent = contentChild(AuthLayoutSso, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ssoContent" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: AuthLayout, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: AuthLayout, isStandalone: true, selector: "kf-auth-layout", inputs: { brand: { classPropertyName: "brand", publicName: "brand", isSignal: true, isRequired: true, transformFunction: null }, brandLogoSrc: { classPropertyName: "brandLogoSrc", publicName: "brandLogoSrc", isSignal: true, isRequired: false, transformFunction: null }, brandTagline: { classPropertyName: "brandTagline", publicName: "brandTagline", isSignal: true, isRequired: false, transformFunction: null }, brandLogoMobileSrc: { classPropertyName: "brandLogoMobileSrc", publicName: "brandLogoMobileSrc", isSignal: true, isRequired: false, transformFunction: null }, backgroundVariant: { classPropertyName: "backgroundVariant", publicName: "backgroundVariant", isSignal: true, isRequired: false, transformFunction: null }, card: { classPropertyName: "card", publicName: "card", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-background": "backgroundVariant()" } }, queries: [{ propertyName: "ssoContent", first: true, predicate: AuthLayoutSso, descendants: true, isSignal: true }], ngImport: i0, template: "<aside class=\"kf-auth-layout__brand\">\n  @if (brandLogoSrc()) {\n    <img class=\"kf-auth-layout__logo\" [src]=\"brandLogoSrc()\" [alt]=\"brand()\" />\n  } @else {\n    <span class=\"kf-auth-layout__wordmark\">{{ brand() }}</span>\n  }\n  @if (brandTagline()) {\n    <p class=\"kf-auth-layout__tagline\">{{ brandTagline() }}</p>\n  }\n</aside>\n\n<main class=\"kf-auth-layout__content\">\n  <div class=\"kf-auth-layout__panel\" [class.kf-auth-layout__panel--card]=\"card()\">\n    <div class=\"kf-auth-layout__mobile-brand\">\n      @if (brandLogoMobileSrc() || brandLogoSrc()) {\n        <img\n          class=\"kf-auth-layout__logo kf-auth-layout__logo--mobile\"\n          [src]=\"brandLogoMobileSrc() || brandLogoSrc()\"\n          [alt]=\"brand()\"\n        />\n      } @else {\n        <span class=\"kf-auth-layout__wordmark kf-auth-layout__wordmark--mobile\">{{ brand() }}</span>\n      }\n    </div>\n\n    @if (title(); as headerTitle) {\n      <div class=\"kf-auth-layout__header\">\n        <kf-text as=\"h1\" variant=\"title-lg\">{{ headerTitle }}</kf-text>\n        @if (subtitle(); as headerSubtitle) {\n          <kf-text as=\"p\" variant=\"body-muted\">{{ headerSubtitle }}</kf-text>\n        }\n      </div>\n    }\n\n    <div class=\"kf-auth-layout__sso\">\n      <ng-content select=\"[kfAuthLayoutSso]\" />\n    </div>\n\n    @if (ssoContent()) {\n      <div class=\"kf-auth-layout__divider\">\n        <kf-divider />\n        <kf-text as=\"span\" variant=\"caption\" class=\"kf-auth-layout__divider-label\">o</kf-text>\n        <kf-divider />\n      </div>\n    }\n\n    <div class=\"kf-auth-layout__body\">\n      <ng-content />\n    </div>\n  </div>\n</main>\n", styles: ["@charset \"UTF-8\";:host{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);min-height:100dvh}.kf-auth-layout__brand{display:flex;flex-direction:column;justify-content:center;gap:var(--kf-space-md);padding:var(--kf-space-xl);background:linear-gradient(190deg,var(--kf-color-primary-active) 0%,var(--kf-color-tertiary-deep) 100%);color:var(--kf-color-white)}.kf-auth-layout__logo{height:1.75rem;width:fit-content}.kf-auth-layout__wordmark{font-family:var(--kf-font-title);font-weight:var(--kf-font-weight-title);font-size:var(--kf-font-size-title-lg);letter-spacing:-.01em}.kf-auth-layout__tagline{max-width:34ch;margin:0;font-family:var(--kf-font-body);font-size:var(--kf-font-size-body);color:#ffffffb8}.kf-auth-layout__content{display:flex;align-items:center;justify-content:center;padding:var(--kf-space-xl);background:var(--kf-color-surface)}:host([data-background=gradient]) .kf-auth-layout__content{background:linear-gradient(165deg,color-mix(in srgb,var(--kf-color-primary) 6%,var(--kf-color-surface)) 0%,var(--kf-color-surface) 55%,color-mix(in srgb,var(--kf-color-primary) 10%,var(--kf-color-surface)) 100%)}:host([data-background=pattern]) .kf-auth-layout__content{background-color:var(--kf-color-surface);background-image:radial-gradient(circle at 1px 1px,color-mix(in srgb,var(--kf-color-primary) 16%,transparent) 1px,transparent 0),linear-gradient(165deg,color-mix(in srgb,var(--kf-color-primary) 6%,var(--kf-color-surface)) 0%,var(--kf-color-surface) 55%,color-mix(in srgb,var(--kf-color-primary) 10%,var(--kf-color-surface)) 100%);background-size:18px 18px,100% 100%}.kf-auth-layout__panel{width:100%;max-width:360px;display:flex;flex-direction:column;gap:var(--kf-space-xl)}.kf-auth-layout__header{display:flex;flex-direction:column;gap:var(--kf-space-xs)}.kf-auth-layout__sso,.kf-auth-layout__body{display:flex;flex-direction:column;gap:var(--kf-space-sm)}.kf-auth-layout__panel--card{padding:var(--kf-space-xl);background:var(--kf-color-white);border:1px solid var(--kf-color-border);border-radius:var(--kf-radius-md);box-shadow:var(--kf-shadow-md)}.kf-auth-layout__divider{display:flex;align-items:center;gap:var(--kf-space-sm)}.kf-auth-layout__divider kf-divider{flex:1 1 0}.kf-auth-layout__divider-label{flex:none}.kf-auth-layout__mobile-brand{display:none;text-align:center}.kf-auth-layout__logo--mobile{margin-inline:auto;height:1.5rem}.kf-auth-layout__wordmark--mobile{color:var(--kf-color-ink)}@media(max-width:900px){:host{grid-template-columns:1fr}.kf-auth-layout__brand{display:none}.kf-auth-layout__content{padding:var(--kf-space-lg) var(--kf-space-md)}.kf-auth-layout__mobile-brand{display:block;margin-bottom:var(--kf-space-md)}}@media(max-width:480px){.kf-auth-layout__panel{max-width:none}}\n"], dependencies: [{ kind: "component", type: Divider, selector: "kf-divider", inputs: ["orientation"] }, { kind: "component", type: Text, selector: "kf-text", inputs: ["as", "variant", "tone"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: AuthLayout, decorators: [{
+            type: Component,
+            args: [{ selector: 'kf-auth-layout', imports: [Divider, Text], host: {
+                        '[attr.data-background]': 'backgroundVariant()',
+                    }, template: "<aside class=\"kf-auth-layout__brand\">\n  @if (brandLogoSrc()) {\n    <img class=\"kf-auth-layout__logo\" [src]=\"brandLogoSrc()\" [alt]=\"brand()\" />\n  } @else {\n    <span class=\"kf-auth-layout__wordmark\">{{ brand() }}</span>\n  }\n  @if (brandTagline()) {\n    <p class=\"kf-auth-layout__tagline\">{{ brandTagline() }}</p>\n  }\n</aside>\n\n<main class=\"kf-auth-layout__content\">\n  <div class=\"kf-auth-layout__panel\" [class.kf-auth-layout__panel--card]=\"card()\">\n    <div class=\"kf-auth-layout__mobile-brand\">\n      @if (brandLogoMobileSrc() || brandLogoSrc()) {\n        <img\n          class=\"kf-auth-layout__logo kf-auth-layout__logo--mobile\"\n          [src]=\"brandLogoMobileSrc() || brandLogoSrc()\"\n          [alt]=\"brand()\"\n        />\n      } @else {\n        <span class=\"kf-auth-layout__wordmark kf-auth-layout__wordmark--mobile\">{{ brand() }}</span>\n      }\n    </div>\n\n    @if (title(); as headerTitle) {\n      <div class=\"kf-auth-layout__header\">\n        <kf-text as=\"h1\" variant=\"title-lg\">{{ headerTitle }}</kf-text>\n        @if (subtitle(); as headerSubtitle) {\n          <kf-text as=\"p\" variant=\"body-muted\">{{ headerSubtitle }}</kf-text>\n        }\n      </div>\n    }\n\n    <div class=\"kf-auth-layout__sso\">\n      <ng-content select=\"[kfAuthLayoutSso]\" />\n    </div>\n\n    @if (ssoContent()) {\n      <div class=\"kf-auth-layout__divider\">\n        <kf-divider />\n        <kf-text as=\"span\" variant=\"caption\" class=\"kf-auth-layout__divider-label\">o</kf-text>\n        <kf-divider />\n      </div>\n    }\n\n    <div class=\"kf-auth-layout__body\">\n      <ng-content />\n    </div>\n  </div>\n</main>\n", styles: ["@charset \"UTF-8\";:host{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);min-height:100dvh}.kf-auth-layout__brand{display:flex;flex-direction:column;justify-content:center;gap:var(--kf-space-md);padding:var(--kf-space-xl);background:linear-gradient(190deg,var(--kf-color-primary-active) 0%,var(--kf-color-tertiary-deep) 100%);color:var(--kf-color-white)}.kf-auth-layout__logo{height:1.75rem;width:fit-content}.kf-auth-layout__wordmark{font-family:var(--kf-font-title);font-weight:var(--kf-font-weight-title);font-size:var(--kf-font-size-title-lg);letter-spacing:-.01em}.kf-auth-layout__tagline{max-width:34ch;margin:0;font-family:var(--kf-font-body);font-size:var(--kf-font-size-body);color:#ffffffb8}.kf-auth-layout__content{display:flex;align-items:center;justify-content:center;padding:var(--kf-space-xl);background:var(--kf-color-surface)}:host([data-background=gradient]) .kf-auth-layout__content{background:linear-gradient(165deg,color-mix(in srgb,var(--kf-color-primary) 6%,var(--kf-color-surface)) 0%,var(--kf-color-surface) 55%,color-mix(in srgb,var(--kf-color-primary) 10%,var(--kf-color-surface)) 100%)}:host([data-background=pattern]) .kf-auth-layout__content{background-color:var(--kf-color-surface);background-image:radial-gradient(circle at 1px 1px,color-mix(in srgb,var(--kf-color-primary) 16%,transparent) 1px,transparent 0),linear-gradient(165deg,color-mix(in srgb,var(--kf-color-primary) 6%,var(--kf-color-surface)) 0%,var(--kf-color-surface) 55%,color-mix(in srgb,var(--kf-color-primary) 10%,var(--kf-color-surface)) 100%);background-size:18px 18px,100% 100%}.kf-auth-layout__panel{width:100%;max-width:360px;display:flex;flex-direction:column;gap:var(--kf-space-xl)}.kf-auth-layout__header{display:flex;flex-direction:column;gap:var(--kf-space-xs)}.kf-auth-layout__sso,.kf-auth-layout__body{display:flex;flex-direction:column;gap:var(--kf-space-sm)}.kf-auth-layout__panel--card{padding:var(--kf-space-xl);background:var(--kf-color-white);border:1px solid var(--kf-color-border);border-radius:var(--kf-radius-md);box-shadow:var(--kf-shadow-md)}.kf-auth-layout__divider{display:flex;align-items:center;gap:var(--kf-space-sm)}.kf-auth-layout__divider kf-divider{flex:1 1 0}.kf-auth-layout__divider-label{flex:none}.kf-auth-layout__mobile-brand{display:none;text-align:center}.kf-auth-layout__logo--mobile{margin-inline:auto;height:1.5rem}.kf-auth-layout__wordmark--mobile{color:var(--kf-color-ink)}@media(max-width:900px){:host{grid-template-columns:1fr}.kf-auth-layout__brand{display:none}.kf-auth-layout__content{padding:var(--kf-space-lg) var(--kf-space-md)}.kf-auth-layout__mobile-brand{display:block;margin-bottom:var(--kf-space-md)}}@media(max-width:480px){.kf-auth-layout__panel{max-width:none}}\n"] }]
+        }], propDecorators: { brand: [{ type: i0.Input, args: [{ isSignal: true, alias: "brand", required: true }] }], brandLogoSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandLogoSrc", required: false }] }], brandTagline: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandTagline", required: false }] }], brandLogoMobileSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandLogoMobileSrc", required: false }] }], backgroundVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "backgroundVariant", required: false }] }], card: [{ type: i0.Input, args: [{ isSignal: true, alias: "card", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], ssoContent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => AuthLayoutSso), { isSignal: true }] }] } });
+
+/**
+ * Botón de cerrar sesión, pensado para proyectarse dentro de
+ * `[kf-drawer-footer]` de `kf-drawer`, o junto a `kf-drawer-session` dentro
+ * de `[kf-sidebar-footer]` de `kf-sidebar-shell` — separado de
+ * `kf-drawer-session` (que solo muestra identidad: brand, avatar, nombre,
+ * email), no anidado dentro de ella.
+ *
+ * Ícono `log-out` + label, color `--kf-color-error` con hover en
+ * `--kf-color-error-soft` y foco visible con `--kf-shadow-focus`. Separado
+ * de `kf-drawer-session` (solo identidad) por responsabilidad única.
+ *
+ * No sabe nada de autenticación real — solo emite `logoutClick` cuando el
+ * consumidor debe cerrar la sesión real.
+ *
+ * `collapsed` oculta el label y centra el ícono, exponiéndolo vía `title`
+ * — mismo criterio que `SidebarNavItem.collapsed` y
+ * `DrawerSession.collapsed`, para cuando este botón vive dentro de un
+ * `kf-sidebar-shell` colapsado.
+ *
+ *   <kf-drawer-logout kf-portal-header-footer (logoutClick)="onLogout()" />
+ */
+class DrawerLogout {
+    /** Label del botón, en español neutro por defecto. Input opcional por si
+     * algún consumidor futuro necesita otro texto. */
+    label = input('Cerrar sesión', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Oculta el label y centra el ícono — ver comentario de la clase. */
+    collapsed = input(false, { ...(ngDevMode ? { debugName: "collapsed" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    logoutClick = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DrawerLogout, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DrawerLogout, isStandalone: true, selector: "kf-drawer-logout", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { logoutClick: "logoutClick" }, ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"kf-drawer-logout__button\"\n  [class.kf-drawer-logout__button--collapsed]=\"collapsed()\"\n  [attr.title]=\"collapsed() ? label() : null\"\n  (click)=\"logoutClick.emit()\"\n>\n  <kf-icon name=\"log-out\" size=\"sm\" />\n  @if (!collapsed()) {\n    {{ label() }}\n  }\n</button>\n", styles: [":host{display:block;font-family:var(--kf-font-body)}.kf-drawer-logout__button{display:flex;align-items:center;gap:var(--kf-space-xs);width:100%;border:none;background:transparent;padding:0;font:inherit;font-size:.875rem;font-weight:600;color:var(--kf-color-error);cursor:pointer}.kf-drawer-logout__button--collapsed{justify-content:center}.kf-drawer-logout__button:hover{color:var(--kf-color-error-strong);background:var(--kf-color-error-soft)}.kf-drawer-logout__button:focus-visible{outline:none;box-shadow:var(--kf-shadow-focus)}\n"], dependencies: [{ kind: "component", type: Icon, selector: "kf-icon", inputs: ["name", "size", "rotate", "filled"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DrawerLogout, decorators: [{
+            type: Component,
+            args: [{ selector: 'kf-drawer-logout', imports: [Icon], template: "<button\n  type=\"button\"\n  class=\"kf-drawer-logout__button\"\n  [class.kf-drawer-logout__button--collapsed]=\"collapsed()\"\n  [attr.title]=\"collapsed() ? label() : null\"\n  (click)=\"logoutClick.emit()\"\n>\n  <kf-icon name=\"log-out\" size=\"sm\" />\n  @if (!collapsed()) {\n    {{ label() }}\n  }\n</button>\n", styles: [":host{display:block;font-family:var(--kf-font-body)}.kf-drawer-logout__button{display:flex;align-items:center;gap:var(--kf-space-xs);width:100%;border:none;background:transparent;padding:0;font:inherit;font-size:.875rem;font-weight:600;color:var(--kf-color-error);cursor:pointer}.kf-drawer-logout__button--collapsed{justify-content:center}.kf-drawer-logout__button:hover{color:var(--kf-color-error-strong);background:var(--kf-color-error-soft)}.kf-drawer-logout__button:focus-visible{outline:none;box-shadow:var(--kf-shadow-focus)}\n"] }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }], logoutClick: [{ type: i0.Output, args: ["logoutClick"] }] } });
+
+/**
+ * Bloque de identidad para `[kf-drawer-header]` de `kf-drawer` o
+ * `[kf-sidebar-footer]` de `kf-sidebar-shell`: avatar + nombre + email,
+ * brand opcional arriba. Solo identidad — el logout vive aparte, en
+ * `kf-drawer-logout`.
+ *
+ * `collapsed` oculta brand/nombre/email y deja solo el avatar (para un
+ * `kf-sidebar-shell` colapsado). `interactive` convierte la tarjeta en un
+ * botón real que emite `cardClick`, para cuando la identidad es el
+ * disparador de un menú de acciones (ej. envuelta en `kf-dropdown`).
+ *
+ *   <kf-dropdown [(open)]="menuOpen">
+ *     <kf-drawer-session interactive name="Juan Pérez" email="juan@empresa.com" (cardClick)="menuOpen.set(!menuOpen())" />
+ *     <kf-dropdown-panel variant="dark">
+ *       <kf-dropdown-item icon="log-out" tone="error" (click)="onLogout()">Cerrar sesión</kf-dropdown-item>
+ *     </kf-dropdown-panel>
+ *   </kf-dropdown>
+ */
+class DrawerSession {
+    name = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    email = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "email" }] : /* istanbul ignore next */ []));
+    /**
+     * Etiqueta de rol o función del usuario dentro de la sesión (ej.
+     * "Coordinador", "Supervisor"). Se muestra como badge dentro de la
+     * identidad, debajo del email — distinto de `brand`, que es la marca o
+     * cliente mostrada como encabezado de todo el bloque, no un atributo de
+     * la persona.
+     */
+    role = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "role" }] : /* istanbul ignore next */ []));
+    initials = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "initials" }] : /* istanbul ignore next */ []));
+    avatarUrl = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "avatarUrl" }] : /* istanbul ignore next */ []));
+    /** Label superior opcional, ej. "Portal Kaufmann LATAM". */
+    brand = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "brand" }] : /* istanbul ignore next */ []));
+    /** Oculta brand/nombre/email y centra el avatar — ver comentario de la clase. */
+    collapsed = input(false, { ...(ngDevMode ? { debugName: "collapsed" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Convierte la tarjeta en un botón real con ícono de kebab — ver comentario de la clase. */
+    interactive = input(false, { ...(ngDevMode ? { debugName: "interactive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Se emite al clickear la tarjeta, solo cuando `interactive` es `true`. */
+    cardClick = output();
+    /** Si no se pasa `initials`, se derivan de `name`: primera letra de cada
+     * una de las primeras 2 palabras, en mayúscula. */
+    displayInitials = computed(() => {
+        const explicit = this.initials();
+        if (explicit) {
+            return explicit;
+        }
+        return this.name()
+            .trim()
+            .split(/\s+/)
+            .slice(0, 2)
+            .map((word) => word.charAt(0).toUpperCase())
+            .join('');
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "displayInitials" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DrawerSession, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DrawerSession, isStandalone: true, selector: "kf-drawer-session", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, email: { classPropertyName: "email", publicName: "email", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, initials: { classPropertyName: "initials", publicName: "initials", isSignal: true, isRequired: false, transformFunction: null }, avatarUrl: { classPropertyName: "avatarUrl", publicName: "avatarUrl", isSignal: true, isRequired: false, transformFunction: null }, brand: { classPropertyName: "brand", publicName: "brand", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cardClick: "cardClick" }, ngImport: i0, template: "@if (brand() && !collapsed()) {\n  <span class=\"kf-drawer-session__brand\">{{ brand() }}</span>\n}\n\n@if (interactive()) {\n  <button\n    type=\"button\"\n    class=\"kf-drawer-session__card kf-drawer-session__card--interactive\"\n    [class.kf-drawer-session__card--collapsed]=\"collapsed()\"\n    (click)=\"cardClick.emit()\"\n  >\n    <kf-avatar [initials]=\"displayInitials()\" [src]=\"avatarUrl()\" />\n    @if (!collapsed()) {\n      <div class=\"kf-drawer-session__identity\">\n        <span class=\"kf-drawer-session__name\">{{ name() }}</span>\n        @if (email()) {\n          <span class=\"kf-drawer-session__email\">{{ email() }}</span>\n        }\n        @if (role()) {\n          <span class=\"kf-drawer-session__role\">{{ role() }}</span>\n        }\n      </div>\n      <kf-icon name=\"more-vertical\" size=\"sm\" />\n    }\n  </button>\n} @else {\n  <div class=\"kf-drawer-session__card\" [class.kf-drawer-session__card--collapsed]=\"collapsed()\">\n    <kf-avatar [initials]=\"displayInitials()\" [src]=\"avatarUrl()\" />\n    @if (!collapsed()) {\n      <div class=\"kf-drawer-session__identity\">\n        <span class=\"kf-drawer-session__name\">{{ name() }}</span>\n        @if (email()) {\n          <span class=\"kf-drawer-session__email\">{{ email() }}</span>\n        }\n        @if (role()) {\n          <span class=\"kf-drawer-session__role\">{{ role() }}</span>\n        }\n      </div>\n    }\n  </div>\n}\n", styles: [":host{display:block;font-family:var(--kf-font-body)}.kf-drawer-session__brand{display:block;margin-bottom:var(--kf-space-sm);font-family:var(--kf-font-mono);font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#ffffffa6}.kf-drawer-session__card{box-sizing:border-box;display:flex;align-items:center;gap:var(--kf-space-sm);width:100%;padding:var(--kf-space-sm);border:1px solid rgba(255,255,255,.14);border-radius:var(--kf-radius-md);background:#ffffff0a}.kf-drawer-session__card--interactive{font:inherit;color:inherit;cursor:pointer;text-align:left;transition:background .14s}.kf-drawer-session__card--interactive:hover{background:#ffffff17}.kf-drawer-session__card--interactive:focus-visible{outline:none;box-shadow:var(--kf-shadow-focus)}.kf-drawer-session__card--interactive kf-icon{flex:none;color:#ffffff73}.kf-drawer-session__card--collapsed{justify-content:center;width:40px;height:40px;padding:0;border-color:transparent;background:transparent}.kf-drawer-session__card--collapsed:hover{background:#ffffff17}.kf-drawer-session__identity{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto}.kf-drawer-session__name{font-size:.9375rem;font-weight:600;color:var(--kf-color-white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kf-drawer-session__email{font-size:.8125rem;color:#ffffffa6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kf-drawer-session__role{display:inline-block;margin-top:2px;padding:2px var(--kf-space-xs);border:1px solid rgba(255,255,255,.16);border-radius:var(--kf-radius-pill);font-family:var(--kf-font-mono);font-size:.625rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#ffffffd9;background:#ffffff14;width:fit-content}\n"], dependencies: [{ kind: "component", type: Avatar, selector: "kf-avatar", inputs: ["initials", "src", "round", "pill"] }, { kind: "component", type: Icon, selector: "kf-icon", inputs: ["name", "size", "rotate", "filled"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DrawerSession, decorators: [{
+            type: Component,
+            args: [{ selector: 'kf-drawer-session', imports: [Avatar, Icon], template: "@if (brand() && !collapsed()) {\n  <span class=\"kf-drawer-session__brand\">{{ brand() }}</span>\n}\n\n@if (interactive()) {\n  <button\n    type=\"button\"\n    class=\"kf-drawer-session__card kf-drawer-session__card--interactive\"\n    [class.kf-drawer-session__card--collapsed]=\"collapsed()\"\n    (click)=\"cardClick.emit()\"\n  >\n    <kf-avatar [initials]=\"displayInitials()\" [src]=\"avatarUrl()\" />\n    @if (!collapsed()) {\n      <div class=\"kf-drawer-session__identity\">\n        <span class=\"kf-drawer-session__name\">{{ name() }}</span>\n        @if (email()) {\n          <span class=\"kf-drawer-session__email\">{{ email() }}</span>\n        }\n        @if (role()) {\n          <span class=\"kf-drawer-session__role\">{{ role() }}</span>\n        }\n      </div>\n      <kf-icon name=\"more-vertical\" size=\"sm\" />\n    }\n  </button>\n} @else {\n  <div class=\"kf-drawer-session__card\" [class.kf-drawer-session__card--collapsed]=\"collapsed()\">\n    <kf-avatar [initials]=\"displayInitials()\" [src]=\"avatarUrl()\" />\n    @if (!collapsed()) {\n      <div class=\"kf-drawer-session__identity\">\n        <span class=\"kf-drawer-session__name\">{{ name() }}</span>\n        @if (email()) {\n          <span class=\"kf-drawer-session__email\">{{ email() }}</span>\n        }\n        @if (role()) {\n          <span class=\"kf-drawer-session__role\">{{ role() }}</span>\n        }\n      </div>\n    }\n  </div>\n}\n", styles: [":host{display:block;font-family:var(--kf-font-body)}.kf-drawer-session__brand{display:block;margin-bottom:var(--kf-space-sm);font-family:var(--kf-font-mono);font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#ffffffa6}.kf-drawer-session__card{box-sizing:border-box;display:flex;align-items:center;gap:var(--kf-space-sm);width:100%;padding:var(--kf-space-sm);border:1px solid rgba(255,255,255,.14);border-radius:var(--kf-radius-md);background:#ffffff0a}.kf-drawer-session__card--interactive{font:inherit;color:inherit;cursor:pointer;text-align:left;transition:background .14s}.kf-drawer-session__card--interactive:hover{background:#ffffff17}.kf-drawer-session__card--interactive:focus-visible{outline:none;box-shadow:var(--kf-shadow-focus)}.kf-drawer-session__card--interactive kf-icon{flex:none;color:#ffffff73}.kf-drawer-session__card--collapsed{justify-content:center;width:40px;height:40px;padding:0;border-color:transparent;background:transparent}.kf-drawer-session__card--collapsed:hover{background:#ffffff17}.kf-drawer-session__identity{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto}.kf-drawer-session__name{font-size:.9375rem;font-weight:600;color:var(--kf-color-white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kf-drawer-session__email{font-size:.8125rem;color:#ffffffa6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kf-drawer-session__role{display:inline-block;margin-top:2px;padding:2px var(--kf-space-xs);border:1px solid rgba(255,255,255,.16);border-radius:var(--kf-radius-pill);font-family:var(--kf-font-mono);font-size:.625rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#ffffffd9;background:#ffffff14;width:fit-content}\n"] }]
+        }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], email: [{ type: i0.Input, args: [{ isSignal: true, alias: "email", required: false }] }], role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: false }] }], initials: [{ type: i0.Input, args: [{ isSignal: true, alias: "initials", required: false }] }], avatarUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarUrl", required: false }] }], brand: [{ type: i0.Input, args: [{ isSignal: true, alias: "brand", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], cardClick: [{ type: i0.Output, args: ["cardClick"] }] } });
+
+const PROVIDER_CONFIG = {
+    microsoft: { label: 'Continuar con Microsoft' },
+};
+/**
+ * Botón de inicio de sesión vía SSO corporativo — pensado como pieza suelta,
+ * no acoplada a `kf-auth-layout`: cualquier consumidor puede usarlo solo,
+ * dentro o fuera del slot `[sso]` de `AuthLayout`.
+ *
+ * `provider` resuelve copy y glyph — hoy solo `'microsoft'` (el método
+ * principal de acceso del ecosistema, cuenta corporativa de Grupo Kaufmann),
+ * con la puerta abierta a sumar otros a futuro sin romper la API existente.
+ *
+ * El glyph es el ícono GENÉRICO de 4 cuadrados de colores que Microsoft
+ * publica en sus propias guías de marca para botones de terceros ("Sign in
+ * with Microsoft") — nunca el logotipo/wordmark oficial completo. No vive en
+ * el sprite de `kf-icon` (`icon-sprite.ts`) a propósito: ese catálogo es
+ * monocromático (`currentColor`, ver `Icon.ts`), pensado para trazos de un
+ * solo color — este glyph necesita sus 4 colores fijos tal como los define
+ * la guía de marca, así que un SVG inline propio es la opción correcta, no
+ * un glyph nuevo forzado al sprite compartido.
+ *
+ * El label por defecto viene de `provider` — pasar contenido propio via
+ * `<ng-content>` lo reemplaza (ej. un texto más corto en un lugar angosto).
+ *
+ *   <kf-sso-button provider="microsoft" (ssoClick)="loginWithMicrosoft()" />
+ *   <kf-sso-button provider="microsoft" [loading]="loggingIn()">
+ *     Ingresar con cuenta corporativa
+ *   </kf-sso-button>
+ */
+class SsoButton {
+    provider = input('microsoft', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "provider" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Reemplaza el glyph + label por `kf-spinner` y fuerza `disabled` — mismo
+     * patrón que `kf-button[loading]`. */
+    loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Igual que `kf-button`: por defecto `submit` dentro de un `<form>`, pero
+     * este botón normalmente vive fuera de cualquier form (dispara un
+     * redirect a Microsoft Entra ID), así que casi siempre conviene `button`. */
+    type = input('button', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    config = computed(() => PROVIDER_CONFIG[this.provider()], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: SsoButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: SsoButton, isStandalone: true, selector: "kf-sso-button", inputs: { provider: { classPropertyName: "provider", publicName: "provider", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<button\n  class=\"kf-sso-button\"\n  [type]=\"type()\"\n  [disabled]=\"disabled() || loading()\"\n  [attr.aria-label]=\"config().label\"\n>\n  @if (loading()) {\n    <kf-spinner size=\"sm\" />\n  } @else {\n    <!--\n      \u00CDcono gen\u00E9rico \"Sign in with Microsoft\" de 4 cuadrados de colores\n      (rojo, verde, azul, amarillo) \u2014 no el logotipo/wordmark oficial.\n      Ver justificaci\u00F3n completa en el JSDoc de SsoButton.ts.\n    -->\n    <svg\n      class=\"kf-sso-button__glyph\"\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 18 18\"\n      aria-hidden=\"true\"\n      focusable=\"false\"\n    >\n      <rect x=\"0\" y=\"0\" width=\"8.5\" height=\"8.5\" fill=\"#f25022\" />\n      <rect x=\"9.5\" y=\"0\" width=\"8.5\" height=\"8.5\" fill=\"#7fba00\" />\n      <rect x=\"0\" y=\"9.5\" width=\"8.5\" height=\"8.5\" fill=\"#00a4ef\" />\n      <rect x=\"9.5\" y=\"9.5\" width=\"8.5\" height=\"8.5\" fill=\"#ffb900\" />\n    </svg>\n  }\n  <span class=\"kf-sso-button__label\">\n    <ng-content>{{ config().label }}</ng-content>\n  </span>\n</button>\n", styles: [":host{display:block}.kf-sso-button{display:flex;align-items:center;justify-content:center;gap:var(--kf-space-sm);width:100%;font:inherit;font-weight:600;padding:var(--kf-space-sm) var(--kf-space-md);border:1px solid var(--kf-color-border-strong);border-radius:var(--kf-radius-sm);background:var(--kf-color-white);color:var(--kf-color-text);cursor:pointer;transition:background .14s,border-color .14s}.kf-sso-button:hover:not(:disabled){background:var(--kf-color-surface);border-color:var(--kf-color-text-muted)}.kf-sso-button:focus-visible{outline:none;box-shadow:var(--kf-shadow-focus)}.kf-sso-button:disabled{opacity:.5;cursor:not-allowed}.kf-sso-button__glyph{flex:none}.kf-sso-button__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "component", type: Spinner, selector: "kf-spinner", inputs: ["size", "label", "onDark"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: SsoButton, decorators: [{
+            type: Component,
+            args: [{ selector: 'kf-sso-button', imports: [Spinner], template: "<button\n  class=\"kf-sso-button\"\n  [type]=\"type()\"\n  [disabled]=\"disabled() || loading()\"\n  [attr.aria-label]=\"config().label\"\n>\n  @if (loading()) {\n    <kf-spinner size=\"sm\" />\n  } @else {\n    <!--\n      \u00CDcono gen\u00E9rico \"Sign in with Microsoft\" de 4 cuadrados de colores\n      (rojo, verde, azul, amarillo) \u2014 no el logotipo/wordmark oficial.\n      Ver justificaci\u00F3n completa en el JSDoc de SsoButton.ts.\n    -->\n    <svg\n      class=\"kf-sso-button__glyph\"\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 18 18\"\n      aria-hidden=\"true\"\n      focusable=\"false\"\n    >\n      <rect x=\"0\" y=\"0\" width=\"8.5\" height=\"8.5\" fill=\"#f25022\" />\n      <rect x=\"9.5\" y=\"0\" width=\"8.5\" height=\"8.5\" fill=\"#7fba00\" />\n      <rect x=\"0\" y=\"9.5\" width=\"8.5\" height=\"8.5\" fill=\"#00a4ef\" />\n      <rect x=\"9.5\" y=\"9.5\" width=\"8.5\" height=\"8.5\" fill=\"#ffb900\" />\n    </svg>\n  }\n  <span class=\"kf-sso-button__label\">\n    <ng-content>{{ config().label }}</ng-content>\n  </span>\n</button>\n", styles: [":host{display:block}.kf-sso-button{display:flex;align-items:center;justify-content:center;gap:var(--kf-space-sm);width:100%;font:inherit;font-weight:600;padding:var(--kf-space-sm) var(--kf-space-md);border:1px solid var(--kf-color-border-strong);border-radius:var(--kf-radius-sm);background:var(--kf-color-white);color:var(--kf-color-text);cursor:pointer;transition:background .14s,border-color .14s}.kf-sso-button:hover:not(:disabled){background:var(--kf-color-surface);border-color:var(--kf-color-text-muted)}.kf-sso-button:focus-visible{outline:none;box-shadow:var(--kf-shadow-focus)}.kf-sso-button:disabled{opacity:.5;cursor:not-allowed}.kf-sso-button__glyph{flex:none}.kf-sso-button__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
+        }], propDecorators: { provider: [{ type: i0.Input, args: [{ isSignal: true, alias: "provider", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }] } });
+
+/*
+ * Public API Surface of ui/auth — entry point secundario, `@kaufmann-lab/ui/auth`.
+ *
+ * Piezas del flujo de login y de la identidad de sesión: el esqueleto de la
+ * pantalla de login (`AuthLayout` + su slot `AuthLayoutSso`), el botón de
+ * acceso por proveedor (`SsoButton`) y los bloques de sesión que se proyectan
+ * en un `kf-drawer` (`DrawerSession`, `DrawerLogout`). Ver `ENTRY-POINTS.md`
+ * en la raíz del repo para el criterio.
+ *
+ * `AdminBadge` NO vive acá aunque temáticamente encajaría: `PortalHeader`
+ * (`@kaufmann-lab/ui/core`) lo compone, y un `AdminBadge` en `/auth` (que
+ * importa `Icon`/`Text` de `/core`) cerraría el ciclo `/core` -> `/auth` ->
+ * `/core`, que ng-packagr rechaza en build.
+ *
+ * Consume sus piezas base (`Avatar`, `Divider`, `Icon`, `Spinner`, `Text`)
+ * desde `'@kaufmann-lab/ui/core'`, nunca desde la raíz `'@kaufmann-lab/ui'`
+ * (agregador que depende de todos los entry points — importarla desde acá
+ * cerraría un ciclo) ni por ruta relativa cruzando la frontera entre entry
+ * points (ng-packagr calcula un `rootDir` propio por entry point y rechaza
+ * archivos fuente fuera de él). La única ruta relativa cruzada es el `@use`
+ * de SCSS de `AuthLayout.scss` hacia el parcial de breakpoints de `/core`:
+ * se resuelve en compilación y no genera dependencia de runtime.
+ *
+ * La raíz `'@kaufmann-lab/ui'` los reexporta, así que
+ * `import { AuthLayout } from '@kaufmann-lab/ui'` sigue funcionando igual.
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AuthLayout, AuthLayoutSso, DrawerLogout, DrawerSession, SsoButton };
+//# sourceMappingURL=kaufmann-lab-ui-auth.mjs.map

package/fesm2022/kaufmann-lab-ui-auth.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"kaufmann-lab-ui-auth.mjs","sources":["../../../projects/ui/auth/src/lib/auth-layout/AuthLayoutSso.ts","../../../projects/ui/auth/src/lib/auth-layout/AuthLayout.ts","../../../projects/ui/auth/src/lib/auth-layout/AuthLayout.html","../../../projects/ui/auth/src/lib/drawer-logout/DrawerLogout.ts","../../../projects/ui/auth/src/lib/drawer-logout/DrawerLogout.html","../../../projects/ui/auth/src/lib/drawer-session/DrawerSession.ts","../../../projects/ui/auth/src/lib/drawer-session/DrawerSession.html","../../../projects/ui/auth/src/lib/sso-button/SsoButton.ts","../../../projects/ui/auth/src/lib/sso-button/SsoButton.html","../../../projects/ui/auth/src/public-api.ts","../../../projects/ui/auth/src/kaufmann-lab-ui-auth.ts"],"sourcesContent":["import { Directive } from '@angular/core';\n\n/**\n * Marca el contenido que va en el slot de SSO de `kf-auth-layout` (típico:\n * un `kf-sso-button`, o varios si el ecosistema suma más de un proveedor).\n * `AuthLayout` la detecta vía `contentChild` para decidir si renderiza el\n * separador \"o\" entre el bloque de SSO y el formulario tradicional\n * proyectado en el slot por defecto — sin este marcador, `AuthLayout`\n * tendría que adivinar si hubo proyección leyendo el DOM a mano.\n *\n *   <kf-auth-layout brand=\"Mi Portal\">\n *     <div kfAuthLayoutSso>\n *       <kf-sso-button provider=\"microsoft\" (click)=\"loginWithMicrosoft()\" />\n *     </div>\n *     <form ...>...</form>\n *   </kf-auth-layout>\n */\n@Directive({\n  selector: '[kfAuthLayoutSso]',\n})\nexport class AuthLayoutSso {}\n","import { booleanAttribute, Component, contentChild, input } from '@angular/core';\nimport { Divider, Text } from '@kaufmann-lab/ui/core';\nimport { AuthLayoutSso } from './AuthLayoutSso';\n\nexport type AuthLayoutBackground = 'plain' | 'gradient' | 'pattern';\n\n/**\n * Layout a pantalla completa para pantallas de autenticación (login,\n * recuperar contraseña, confirmación de envío) — panel de marca a la\n * izquierda, contenido libre a la derecha en desktop; en mobile el panel de\n * marca se oculta y un logo compacto queda visible arriba del formulario.\n *\n * Resuelve solo el \"cascarón\": cada portal arma su propio `<form>` con los\n * componentes de la librería y lo proyecta en el slot por defecto.\n *\n *   <kf-auth-layout\n *     brand=\"Mi Portal\"\n *     brandLogoSrc=\"images/mi-portal-logo-white.png\"\n *     brandLogoMobileSrc=\"images/mi-portal-logo-black.png\"\n *     brandTagline=\"Frase corta de marca, propia de cada portal.\"\n *   >\n *     <form (ngSubmit)=\"onSubmit()\">\n *       <kf-input label=\"Correo\" type=\"email\" />\n *       <kf-input label=\"Contraseña\" type=\"password\" toggleable />\n *       <kf-button type=\"submit\">Ingresar</kf-button>\n *     </form>\n *   </kf-auth-layout>\n *\n * `backgroundVariant` controla la superficie del panel derecho:\n * `'plain'` (fondo liso, comportamiento histórico), `'gradient'` (default —\n * degradé sutil derivado de `--kf-color-primary`/`--kf-color-surface` vía\n * `color-mix()`, ningún color hardcodeado) o `'pattern'` (el mismo degradé\n * más una textura de puntos, también resuelta con tokens). Los tres se\n * resuelven contra los tokens de tema ACTIVOS — cambiar de tema\n * (`andes-maq`, `divemotor-star`, `kaufmann-ar`, futuros) no requiere tocar\n * este componente ni pasarle un color a mano.\n *\n * `card`, en `false` por defecto (comportamiento histórico: el contenido\n * proyectado flota sin superficie propia), envuelve el slot por defecto con\n * la misma superficie de `kf-card` (fondo, borde, sombra, radio) para que\n * el formulario deje de verse suelto sobre el fondo del panel.\n *\n * `title`/`subtitle` renderizan un encabezado de bienvenida DENTRO de la\n * card, antes que cualquier otro contenido (jerarquía ya resuelta:\n * `title-lg` + `body-muted`, ver `Text.ts`) — así ningún consumidor tiene\n * que adivinar la variante de `kf-text` correcta ni terminar con un\n * \"Iniciar sesión\" repetido y suelto dentro de su propio `<form>`. Sin\n * `title`, no se renderiza ningún encabezado (comportamiento histórico).\n *\n * El slot `[kfAuthLayoutSso]` (ver `AuthLayoutSso`) es para el patrón\n * \"SSO primero, credenciales como alternativa secundaria\" — típicamente un\n * `kf-sso-button`. Cuando hay contenido ahí, `AuthLayout` resuelve el\n * separador \"o\" automáticamente entre ese bloque y el contenido por\n * defecto; sin ese slot, nada cambia frente al comportamiento actual.\n *\n *   <kf-auth-layout\n *     brand=\"Mi Portal\"\n *     backgroundVariant=\"pattern\"\n *     card\n *     title=\"Iniciar sesión\"\n *     subtitle=\"Usa tu cuenta corporativa o ingresa con contraseña\"\n *   >\n *     <div kfAuthLayoutSso>\n *       <kf-sso-button provider=\"microsoft\" (click)=\"loginWithMicrosoft()\" />\n *     </div>\n *     <form (ngSubmit)=\"onSubmit()\">\n *       <kf-input label=\"Correo\" type=\"email\" />\n *       <kf-input label=\"Contraseña\" type=\"password\" toggleable />\n *       <kf-button type=\"submit\">Ingresar</kf-button>\n *     </form>\n *   </kf-auth-layout>\n */\n@Component({\n  selector: 'kf-auth-layout',\n  imports: [Divider, Text],\n  templateUrl: './AuthLayout.html',\n  styleUrl: './AuthLayout.scss',\n  host: {\n    '[attr.data-background]': 'backgroundVariant()',\n  },\n})\nexport class AuthLayout {\n  /** Nombre de marca/portal — wordmark de respaldo si no hay logo, y `alt` de ambos logos. */\n  readonly brand = input.required<string>();\n\n  /** Logo en blanco para el panel oscuro de desktop. Sin esto, se muestra `brand()` como wordmark. */\n  readonly brandLogoSrc = input<string>();\n\n  /** Frase corta bajo el logo. */\n  readonly brandTagline = input<string>();\n\n  /** Logo compacto para mobile, sobre fondo claro. Sin esto, reutiliza `brandLogoSrc`. */\n  readonly brandLogoMobileSrc = input<string>();\n\n  /** Superficie del panel derecho. Default `'gradient'`; `'plain'` preserva el fondo liso histórico. */\n  readonly backgroundVariant = input<AuthLayoutBackground>('gradient');\n\n  /** Envuelve el contenido proyectado con la superficie de `kf-card` (fondo, borde, sombra). Default `false` — preserva el comportamiento histórico. */\n  readonly card = input(false, { transform: booleanAttribute });\n\n  /** Título del encabezado dentro de la card (`title-lg`). Sin este input, no se renderiza ningún encabezado. */\n  readonly title = input<string>();\n\n  /** Subtítulo del encabezado (`body-muted`), debajo de `title`. Sin efecto si `title` no está presente. */\n  readonly subtitle = input<string>();\n\n  /** Presencia de contenido en el slot `[kfAuthLayoutSso]` — controla si se renderiza el separador \"o\". */\n  protected readonly ssoContent = contentChild(AuthLayoutSso);\n}\n","<aside class=\"kf-auth-layout__brand\">\n  @if (brandLogoSrc()) {\n    <img class=\"kf-auth-layout__logo\" [src]=\"brandLogoSrc()\" [alt]=\"brand()\" />\n  } @else {\n    <span class=\"kf-auth-layout__wordmark\">{{ brand() }}</span>\n  }\n  @if (brandTagline()) {\n    <p class=\"kf-auth-layout__tagline\">{{ brandTagline() }}</p>\n  }\n</aside>\n\n<main class=\"kf-auth-layout__content\">\n  <div class=\"kf-auth-layout__panel\" [class.kf-auth-layout__panel--card]=\"card()\">\n    <div class=\"kf-auth-layout__mobile-brand\">\n      @if (brandLogoMobileSrc() || brandLogoSrc()) {\n        <img\n          class=\"kf-auth-layout__logo kf-auth-layout__logo--mobile\"\n          [src]=\"brandLogoMobileSrc() || brandLogoSrc()\"\n          [alt]=\"brand()\"\n        />\n      } @else {\n        <span class=\"kf-auth-layout__wordmark kf-auth-layout__wordmark--mobile\">{{ brand() }}</span>\n      }\n    </div>\n\n    @if (title(); as headerTitle) {\n      <div class=\"kf-auth-layout__header\">\n        <kf-text as=\"h1\" variant=\"title-lg\">{{ headerTitle }}</kf-text>\n        @if (subtitle(); as headerSubtitle) {\n          <kf-text as=\"p\" variant=\"body-muted\">{{ headerSubtitle }}</kf-text>\n        }\n      </div>\n    }\n\n    <div class=\"kf-auth-layout__sso\">\n      <ng-content select=\"[kfAuthLayoutSso]\" />\n    </div>\n\n    @if (ssoContent()) {\n      <div class=\"kf-auth-layout__divider\">\n        <kf-divider />\n        <kf-text as=\"span\" variant=\"caption\" class=\"kf-auth-layout__divider-label\">o</kf-text>\n        <kf-divider />\n      </div>\n    }\n\n    <div class=\"kf-auth-layout__body\">\n      <ng-content />\n    </div>\n  </div>\n</main>\n","import { Component, booleanAttribute, input, output } from '@angular/core';\nimport { Icon } from '@kaufmann-lab/ui/core';\n\n/**\n * Botón de cerrar sesión, pensado para proyectarse dentro de\n * `[kf-drawer-footer]` de `kf-drawer`, o junto a `kf-drawer-session` dentro\n * de `[kf-sidebar-footer]` de `kf-sidebar-shell` — separado de\n * `kf-drawer-session` (que solo muestra identidad: brand, avatar, nombre,\n * email), no anidado dentro de ella.\n *\n * Ícono `log-out` + label, color `--kf-color-error` con hover en\n * `--kf-color-error-soft` y foco visible con `--kf-shadow-focus`. Separado\n * de `kf-drawer-session` (solo identidad) por responsabilidad única.\n *\n * No sabe nada de autenticación real — solo emite `logoutClick` cuando el\n * consumidor debe cerrar la sesión real.\n *\n * `collapsed` oculta el label y centra el ícono, exponiéndolo vía `title`\n * — mismo criterio que `SidebarNavItem.collapsed` y\n * `DrawerSession.collapsed`, para cuando este botón vive dentro de un\n * `kf-sidebar-shell` colapsado.\n *\n *   <kf-drawer-logout kf-portal-header-footer (logoutClick)=\"onLogout()\" />\n */\n@Component({\n  selector: 'kf-drawer-logout',\n  imports: [Icon],\n  templateUrl: './DrawerLogout.html',\n  styleUrl: './DrawerLogout.css',\n})\nexport class DrawerLogout {\n  /** Label del botón, en español neutro por defecto. Input opcional por si\n   * algún consumidor futuro necesita otro texto. */\n  readonly label = input('Cerrar sesión');\n\n  /** Oculta el label y centra el ícono — ver comentario de la clase. */\n  readonly collapsed = input(false, { transform: booleanAttribute });\n\n  readonly logoutClick = output<void>();\n}\n","<button\n  type=\"button\"\n  class=\"kf-drawer-logout__button\"\n  [class.kf-drawer-logout__button--collapsed]=\"collapsed()\"\n  [attr.title]=\"collapsed() ? label() : null\"\n  (click)=\"logoutClick.emit()\"\n>\n  <kf-icon name=\"log-out\" size=\"sm\" />\n  @if (!collapsed()) {\n    {{ label() }}\n  }\n</button>\n","import { Component, booleanAttribute, computed, input, output } from '@angular/core';\nimport { Avatar, Icon } from '@kaufmann-lab/ui/core';\n\n/**\n * Bloque de identidad para `[kf-drawer-header]` de `kf-drawer` o\n * `[kf-sidebar-footer]` de `kf-sidebar-shell`: avatar + nombre + email,\n * brand opcional arriba. Solo identidad — el logout vive aparte, en\n * `kf-drawer-logout`.\n *\n * `collapsed` oculta brand/nombre/email y deja solo el avatar (para un\n * `kf-sidebar-shell` colapsado). `interactive` convierte la tarjeta en un\n * botón real que emite `cardClick`, para cuando la identidad es el\n * disparador de un menú de acciones (ej. envuelta en `kf-dropdown`).\n *\n *   <kf-dropdown [(open)]=\"menuOpen\">\n *     <kf-drawer-session interactive name=\"Juan Pérez\" email=\"juan@empresa.com\" (cardClick)=\"menuOpen.set(!menuOpen())\" />\n *     <kf-dropdown-panel variant=\"dark\">\n *       <kf-dropdown-item icon=\"log-out\" tone=\"error\" (click)=\"onLogout()\">Cerrar sesión</kf-dropdown-item>\n *     </kf-dropdown-panel>\n *   </kf-dropdown>\n */\n@Component({\n  selector: 'kf-drawer-session',\n  imports: [Avatar, Icon],\n  templateUrl: './DrawerSession.html',\n  styleUrl: './DrawerSession.css',\n})\nexport class DrawerSession {\n  readonly name = input.required<string>();\n  readonly email = input<string>('');\n  /**\n   * Etiqueta de rol o función del usuario dentro de la sesión (ej.\n   * \"Coordinador\", \"Supervisor\"). Se muestra como badge dentro de la\n   * identidad, debajo del email — distinto de `brand`, que es la marca o\n   * cliente mostrada como encabezado de todo el bloque, no un atributo de\n   * la persona.\n   */\n  readonly role = input<string>('');\n  readonly initials = input<string>('');\n  readonly avatarUrl = input<string>('');\n  /** Label superior opcional, ej. \"Portal Kaufmann LATAM\". */\n  readonly brand = input<string>('');\n\n  /** Oculta brand/nombre/email y centra el avatar — ver comentario de la clase. */\n  readonly collapsed = input(false, { transform: booleanAttribute });\n\n  /** Convierte la tarjeta en un botón real con ícono de kebab — ver comentario de la clase. */\n  readonly interactive = input(false, { transform: booleanAttribute });\n\n  /** Se emite al clickear la tarjeta, solo cuando `interactive` es `true`. */\n  readonly cardClick = output<void>();\n\n  /** Si no se pasa `initials`, se derivan de `name`: primera letra de cada\n   * una de las primeras 2 palabras, en mayúscula. */\n  protected readonly displayInitials = computed(() => {\n    const explicit = this.initials();\n    if (explicit) {\n      return explicit;\n    }\n    return this.name()\n      .trim()\n      .split(/\\s+/)\n      .slice(0, 2)\n      .map((word) => word.charAt(0).toUpperCase())\n      .join('');\n  });\n}\n","@if (brand() && !collapsed()) {\n  <span class=\"kf-drawer-session__brand\">{{ brand() }}</span>\n}\n\n@if (interactive()) {\n  <button\n    type=\"button\"\n    class=\"kf-drawer-session__card kf-drawer-session__card--interactive\"\n    [class.kf-drawer-session__card--collapsed]=\"collapsed()\"\n    (click)=\"cardClick.emit()\"\n  >\n    <kf-avatar [initials]=\"displayInitials()\" [src]=\"avatarUrl()\" />\n    @if (!collapsed()) {\n      <div class=\"kf-drawer-session__identity\">\n        <span class=\"kf-drawer-session__name\">{{ name() }}</span>\n        @if (email()) {\n          <span class=\"kf-drawer-session__email\">{{ email() }}</span>\n        }\n        @if (role()) {\n          <span class=\"kf-drawer-session__role\">{{ role() }}</span>\n        }\n      </div>\n      <kf-icon name=\"more-vertical\" size=\"sm\" />\n    }\n  </button>\n} @else {\n  <div class=\"kf-drawer-session__card\" [class.kf-drawer-session__card--collapsed]=\"collapsed()\">\n    <kf-avatar [initials]=\"displayInitials()\" [src]=\"avatarUrl()\" />\n    @if (!collapsed()) {\n      <div class=\"kf-drawer-session__identity\">\n        <span class=\"kf-drawer-session__name\">{{ name() }}</span>\n        @if (email()) {\n          <span class=\"kf-drawer-session__email\">{{ email() }}</span>\n        }\n        @if (role()) {\n          <span class=\"kf-drawer-session__role\">{{ role() }}</span>\n        }\n      </div>\n    }\n  </div>\n}\n","import { booleanAttribute, Component, computed, input } from '@angular/core';\nimport { Spinner } from '@kaufmann-lab/ui/core';\n\nexport type SsoProvider = 'microsoft';\n\n/** Copy y glyph por proveedor — agregar una entrada acá es todo lo que hace\n * falta para soportar un proveedor nuevo (ej. `google`), sin tocar el\n * template ni los estilos del componente. */\ninterface SsoProviderConfig {\n  readonly label: string;\n}\n\nconst PROVIDER_CONFIG: Record<SsoProvider, SsoProviderConfig> = {\n  microsoft: { label: 'Continuar con Microsoft' },\n};\n\n/**\n * Botón de inicio de sesión vía SSO corporativo — pensado como pieza suelta,\n * no acoplada a `kf-auth-layout`: cualquier consumidor puede usarlo solo,\n * dentro o fuera del slot `[sso]` de `AuthLayout`.\n *\n * `provider` resuelve copy y glyph — hoy solo `'microsoft'` (el método\n * principal de acceso del ecosistema, cuenta corporativa de Grupo Kaufmann),\n * con la puerta abierta a sumar otros a futuro sin romper la API existente.\n *\n * El glyph es el ícono GENÉRICO de 4 cuadrados de colores que Microsoft\n * publica en sus propias guías de marca para botones de terceros (\"Sign in\n * with Microsoft\") — nunca el logotipo/wordmark oficial completo. No vive en\n * el sprite de `kf-icon` (`icon-sprite.ts`) a propósito: ese catálogo es\n * monocromático (`currentColor`, ver `Icon.ts`), pensado para trazos de un\n * solo color — este glyph necesita sus 4 colores fijos tal como los define\n * la guía de marca, así que un SVG inline propio es la opción correcta, no\n * un glyph nuevo forzado al sprite compartido.\n *\n * El label por defecto viene de `provider` — pasar contenido propio via\n * `<ng-content>` lo reemplaza (ej. un texto más corto en un lugar angosto).\n *\n *   <kf-sso-button provider=\"microsoft\" (ssoClick)=\"loginWithMicrosoft()\" />\n *   <kf-sso-button provider=\"microsoft\" [loading]=\"loggingIn()\">\n *     Ingresar con cuenta corporativa\n *   </kf-sso-button>\n */\n@Component({\n  selector: 'kf-sso-button',\n  imports: [Spinner],\n  templateUrl: './SsoButton.html',\n  styleUrl: './SsoButton.css',\n})\nexport class SsoButton {\n  readonly provider = input<SsoProvider>('microsoft');\n  readonly disabled = input(false, { transform: booleanAttribute });\n  /** Reemplaza el glyph + label por `kf-spinner` y fuerza `disabled` — mismo\n   * patrón que `kf-button[loading]`. */\n  readonly loading = input(false, { transform: booleanAttribute });\n  /** Igual que `kf-button`: por defecto `submit` dentro de un `<form>`, pero\n   * este botón normalmente vive fuera de cualquier form (dispara un\n   * redirect a Microsoft Entra ID), así que casi siempre conviene `button`. */\n  readonly type = input<'button' | 'submit'>('button');\n\n  protected readonly config = computed(() => PROVIDER_CONFIG[this.provider()]);\n}\n","<button\n  class=\"kf-sso-button\"\n  [type]=\"type()\"\n  [disabled]=\"disabled() || loading()\"\n  [attr.aria-label]=\"config().label\"\n>\n  @if (loading()) {\n    <kf-spinner size=\"sm\" />\n  } @else {\n    <!--\n      Ícono genérico \"Sign in with Microsoft\" de 4 cuadrados de colores\n      (rojo, verde, azul, amarillo) — no el logotipo/wordmark oficial.\n      Ver justificación completa en el JSDoc de SsoButton.ts.\n    -->\n    <svg\n      class=\"kf-sso-button__glyph\"\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 18 18\"\n      aria-hidden=\"true\"\n      focusable=\"false\"\n    >\n      <rect x=\"0\" y=\"0\" width=\"8.5\" height=\"8.5\" fill=\"#f25022\" />\n      <rect x=\"9.5\" y=\"0\" width=\"8.5\" height=\"8.5\" fill=\"#7fba00\" />\n      <rect x=\"0\" y=\"9.5\" width=\"8.5\" height=\"8.5\" fill=\"#00a4ef\" />\n      <rect x=\"9.5\" y=\"9.5\" width=\"8.5\" height=\"8.5\" fill=\"#ffb900\" />\n    </svg>\n  }\n  <span class=\"kf-sso-button__label\">\n    <ng-content>{{ config().label }}</ng-content>\n  </span>\n</button>\n","/*\n * Public API Surface of ui/auth — entry point secundario, `@kaufmann-lab/ui/auth`.\n *\n * Piezas del flujo de login y de la identidad de sesión: el esqueleto de la\n * pantalla de login (`AuthLayout` + su slot `AuthLayoutSso`), el botón de\n * acceso por proveedor (`SsoButton`) y los bloques de sesión que se proyectan\n * en un `kf-drawer` (`DrawerSession`, `DrawerLogout`). Ver `ENTRY-POINTS.md`\n * en la raíz del repo para el criterio.\n *\n * `AdminBadge` NO vive acá aunque temáticamente encajaría: `PortalHeader`\n * (`@kaufmann-lab/ui/core`) lo compone, y un `AdminBadge` en `/auth` (que\n * importa `Icon`/`Text` de `/core`) cerraría el ciclo `/core` -> `/auth` ->\n * `/core`, que ng-packagr rechaza en build.\n *\n * Consume sus piezas base (`Avatar`, `Divider`, `Icon`, `Spinner`, `Text`)\n * desde `'@kaufmann-lab/ui/core'`, nunca desde la raíz `'@kaufmann-lab/ui'`\n * (agregador que depende de todos los entry points — importarla desde acá\n * cerraría un ciclo) ni por ruta relativa cruzando la frontera entre entry\n * points (ng-packagr calcula un `rootDir` propio por entry point y rechaza\n * archivos fuente fuera de él). La única ruta relativa cruzada es el `@use`\n * de SCSS de `AuthLayout.scss` hacia el parcial de breakpoints de `/core`:\n * se resuelve en compilación y no genera dependencia de runtime.\n *\n * La raíz `'@kaufmann-lab/ui'` los reexporta, así que\n * `import { AuthLayout } from '@kaufmann-lab/ui'` sigue funcionando igual.\n */\n\nexport * from './lib/auth-layout/AuthLayout';\nexport * from './lib/auth-layout/AuthLayoutSso';\nexport * from './lib/drawer-logout/DrawerLogout';\nexport * from './lib/drawer-session/DrawerSession';\nexport * from './lib/sso-button/SsoButton';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}