@cadriciel/ui 0.4.1 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/cadriciel-ui.mjs +144 -11
- package/fesm2022/cadriciel-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/types/cadriciel-ui.d.ts +86 -2
|
@@ -4090,6 +4090,19 @@ class CadDialogContainerComponent {
|
|
|
4090
4090
|
const vertical = c.drawerPosition === 'top' || c.drawerPosition === 'bottom';
|
|
4091
4091
|
return vertical ? '100%' : (CadDialogContainerComponent.DRAWER_SIZES[s] ?? s);
|
|
4092
4092
|
}
|
|
4093
|
+
// EN PLEIN ÉCRAN MOBILE, LA TAILLE DEMANDÉE N'A PLUS DE SENS : c'est l'écran qui décide.
|
|
4094
|
+
// Sans ça, `size="md"` continuait de valoir 480px et, plafonné par le `max-width: 92%`
|
|
4095
|
+
// ci-dessous, rendait un dialogue de 352px avec des marges — alors qu'un `size="sm"`
|
|
4096
|
+
// (360px) tenait, lui, dans les 390px et paraissait plein écran. Deux dialogues déclarés
|
|
4097
|
+
// dans le même mode s'affichaient donc différemment (signalé par SZU le 22/08/2026).
|
|
4098
|
+
// On corrige à la SOURCE : le CSS tentait de rattraper ça en aval avec des `!important`,
|
|
4099
|
+
// qui ne peuvent pas gagner contre une largeur en ligne dans la chaîne de dimensionnement.
|
|
4100
|
+
// « 100% » ne suffit PAS ici : le panneau CDK qui nous porte a une largeur AUTOMATIQUE,
|
|
4101
|
+
// donc un pourcentage se résout circulairement sur la largeur du contenu — mesuré à 352px
|
|
4102
|
+
// au lieu de 390. On vise donc le viewport. Pas de risque de gouttière d'ascenseur : ce
|
|
4103
|
+
// mode n'existe que sous le seuil mobile, où il n'y a pas d'ascenseur classique.
|
|
4104
|
+
if (this.mobileMode() === 'full')
|
|
4105
|
+
return '100dvw';
|
|
4093
4106
|
return c.width ?? CadDialogContainerComponent.SIZES[c.size ?? 'md'] ?? '480px';
|
|
4094
4107
|
}, ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
|
|
4095
4108
|
height = computed(() => {
|
|
@@ -4103,7 +4116,10 @@ class CadDialogContainerComponent {
|
|
|
4103
4116
|
}
|
|
4104
4117
|
return c.height ?? null;
|
|
4105
4118
|
}, ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
|
|
4106
|
-
|
|
4119
|
+
/** Le plafond à 92% laisse respirer un dialogue centré ; en plein écran mobile il n'a plus lieu d'être. */
|
|
4120
|
+
maxWidth = computed(() => this.config().kind === 'drawer' || this.mobileMode() === 'full'
|
|
4121
|
+
? '100%'
|
|
4122
|
+
: (this.config().maxWidth ?? (this.config().size === 'full' ? '100%' : '92%')), ...(ngDevMode ? [{ debugName: "maxWidth" }] : /* istanbul ignore next */ []));
|
|
4107
4123
|
drag = signal(null, ...(ngDevMode ? [{ debugName: "drag" }] : /* istanbul ignore next */ []));
|
|
4108
4124
|
dragTransform = computed(() => { const d = this.drag(); return d ? `translate(${d.x}px, ${d.y}px)` : null; }, ...(ngDevMode ? [{ debugName: "dragTransform" }] : /* istanbul ignore next */ []));
|
|
4109
4125
|
toggleMaximize() { this.maximized.set(!this.maximized()); this.drag.set(null); this.maximizeChange.emit(this.maximized()); }
|
|
@@ -4148,7 +4164,7 @@ class CadDialogContainerComponent {
|
|
|
4148
4164
|
<footer class="cad-dialog__footer"><ng-container *ngTemplateOutlet="config().footer!" /></footer>
|
|
4149
4165
|
}
|
|
4150
4166
|
</div>
|
|
4151
|
-
`, isInline: true, styles: [".cdk-overlay-container{position:fixed;z-index:var(--cad-z-overlay, 100002);pointer-events:none;top:0;left:0;width:100%;height:100%}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000;width:100%;height:100%}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;opacity:0;transition:opacity var(--cad-dur, .14s) var(--cad-ease, ease)}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{visibility:visible;opacity:0}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.cad-overlay-backdrop{background:var(--cad-backdrop, rgba(2, 6, 23, .45))}.cad-overlay-backdrop.is-hidden{display:none}.cad-overlay-pane{pointer-events:auto}.cad-overlay-pane.is-drawer-pane{height:100%}.cad-dialog-container{display:flex;outline:none;font-family:var(--cad-font);font-size:var(--cad-font-size);color:var(--cad-fg);max-height:100%;max-width:100%}.cad-dialog-container.is-hidden{display:none}.cad-dialog{display:flex;flex-direction:column;background:var(--cad-surface);border:1px solid var(--cad-border);border-radius:var(--cad-radius-lg);box-shadow:var(--cad-shadow-lg);max-height:92vh;min-width:0;outline:none;box-sizing:border-box;opacity:0;transform:translateY(6px) scale(.98);transition:opacity var(--cad-dur) var(--cad-ease),transform var(--cad-dur) var(--cad-ease)}.cad-dialog-container.is-open .cad-dialog{opacity:1;transform:none}.cad-dialog-container.is-maximized .cad-dialog{width:100%!important;max-width:100%!important;height:100vh!important;max-height:100vh;border-radius:0}.cad-dialog__header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 16px 10px;flex:none}.cad-dialog__header.is-draggable{cursor:move;-webkit-user-select:none;user-select:none}.cad-dialog__title{margin:0;font-size:14.5px;font-weight:600;color:var(--cad-fg);min-width:0}.cad-dialog__actions{display:inline-flex;gap:2px;margin-left:auto;flex:none}.cad-dialog__icon-btn{display:grid;place-items:center;width:26px;height:26px;border:0;border-radius:var(--cad-radius-sm);background:transparent;color:var(--cad-fg-muted);cursor:pointer;padding:0;transition:background var(--cad-dur),color var(--cad-dur)}.cad-dialog__icon-btn:hover{background:var(--cad-hover);color:var(--cad-fg)}.cad-dialog__icon-btn:focus-visible{outline:2px solid var(--cad-ring);outline-offset:1px}.cad-dialog__body{padding:4px 16px 14px;color:var(--cad-fg-secondary);font-size:var(--cad-font-size);overflow:auto;flex:1;min-height:0}.cad-dialog__body:first-child{padding-top:16px}.cad-dialog__footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--cad-border);background:var(--cad-bg-subtle);border-radius:0 0 var(--cad-radius-lg) var(--cad-radius-lg);flex:none}.cad-dialog-container.is-drawer{height:100%}.cad-dialog-container.is-drawer .cad-dialog{max-height:none;height:100%;border-radius:0;opacity:1;transform:none;transition:transform .18s var(--cad-ease)}.cad-dialog-container.is-drawer .cad-dialog__footer{border-radius:0}.cad-dialog-container.is-drawer.pos-right .cad-dialog{transform:translate(100%);border-width:0 0 0 1px}.cad-dialog-container.is-drawer.pos-left .cad-dialog{transform:translate(-100%);border-width:0 1px 0 0}.cad-dialog-container.is-drawer.pos-top .cad-dialog{transform:translateY(-100%);border-width:0 0 1px 0}.cad-dialog-container.is-drawer.pos-bottom .cad-dialog{transform:translateY(100%);border-width:1px 0 0 0}.cad-dialog-container.is-drawer.is-open .cad-dialog{transform:none}.cad-dialog-container.is-drawer.pos-top,.cad-dialog-container.is-drawer.pos-bottom{width:100%}.cad-dialog-container.is-drawer.pos-top .cad-dialog,.cad-dialog-container.is-drawer.pos-bottom .cad-dialog{width:100%!important;max-width:100%!important}.cad-dialog-container.is-mobile-full{width:
|
|
4167
|
+
`, isInline: true, styles: [".cdk-overlay-container{position:fixed;z-index:var(--cad-z-overlay, 100002);pointer-events:none;top:0;left:0;width:100%;height:100%}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000;width:100%;height:100%}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;opacity:0;transition:opacity var(--cad-dur, .14s) var(--cad-ease, ease)}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{visibility:visible;opacity:0}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.cad-overlay-backdrop{background:var(--cad-backdrop, rgba(2, 6, 23, .45))}.cad-overlay-backdrop.is-hidden{display:none}.cad-overlay-pane{pointer-events:auto}.cad-overlay-pane.is-drawer-pane{height:100%}.cad-dialog-container{display:flex;outline:none;font-family:var(--cad-font);font-size:var(--cad-font-size);color:var(--cad-fg);max-height:100%;max-width:100%}.cad-dialog-container.is-hidden{display:none}.cad-dialog{display:flex;flex-direction:column;background:var(--cad-surface);border:1px solid var(--cad-border);border-radius:var(--cad-radius-lg);box-shadow:var(--cad-shadow-lg);max-height:92vh;min-width:0;outline:none;box-sizing:border-box;opacity:0;transform:translateY(6px) scale(.98);transition:opacity var(--cad-dur) var(--cad-ease),transform var(--cad-dur) var(--cad-ease)}.cad-dialog-container.is-open .cad-dialog{opacity:1;transform:none}.cad-dialog-container.is-maximized .cad-dialog{width:100%!important;max-width:100%!important;height:100vh!important;max-height:100vh;border-radius:0}.cad-dialog__header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 16px 10px;flex:none}.cad-dialog__header.is-draggable{cursor:move;-webkit-user-select:none;user-select:none}.cad-dialog__title{margin:0;font-size:14.5px;font-weight:600;color:var(--cad-fg);min-width:0}.cad-dialog__actions{display:inline-flex;gap:2px;margin-left:auto;flex:none}.cad-dialog__icon-btn{display:grid;place-items:center;width:26px;height:26px;border:0;border-radius:var(--cad-radius-sm);background:transparent;color:var(--cad-fg-muted);cursor:pointer;padding:0;transition:background var(--cad-dur),color var(--cad-dur)}.cad-dialog__icon-btn:hover{background:var(--cad-hover);color:var(--cad-fg)}.cad-dialog__icon-btn:focus-visible{outline:2px solid var(--cad-ring);outline-offset:1px}.cad-dialog__body{padding:4px 16px 14px;color:var(--cad-fg-secondary);font-size:var(--cad-font-size);overflow:auto;flex:1;min-height:0}.cad-dialog__body:first-child{padding-top:16px}.cad-dialog__footer>[cadDialogFooter]{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;width:100%}.cad-dialog__footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--cad-border);background:var(--cad-bg-subtle);border-radius:0 0 var(--cad-radius-lg) var(--cad-radius-lg);flex:none}.cad-dialog-container.is-drawer{height:100%}.cad-dialog-container.is-drawer .cad-dialog{max-height:none;height:100%;border-radius:0;opacity:1;transform:none;transition:transform .18s var(--cad-ease)}.cad-dialog-container.is-drawer .cad-dialog__footer{border-radius:0}.cad-dialog-container.is-drawer.pos-right .cad-dialog{transform:translate(100%);border-width:0 0 0 1px}.cad-dialog-container.is-drawer.pos-left .cad-dialog{transform:translate(-100%);border-width:0 1px 0 0}.cad-dialog-container.is-drawer.pos-top .cad-dialog{transform:translateY(-100%);border-width:0 0 1px 0}.cad-dialog-container.is-drawer.pos-bottom .cad-dialog{transform:translateY(100%);border-width:1px 0 0 0}.cad-dialog-container.is-drawer.is-open .cad-dialog{transform:none}.cad-dialog-container.is-drawer.pos-top,.cad-dialog-container.is-drawer.pos-bottom{width:100%}.cad-dialog-container.is-drawer.pos-top .cad-dialog,.cad-dialog-container.is-drawer.pos-bottom .cad-dialog{width:100%!important;max-width:100%!important}.cad-dialog-container.is-mobile-full{width:100dvw;height:100dvh;max-height:100dvh;align-items:flex-start}.cad-dialog-container.is-mobile-full .cad-dialog{width:100dvw!important;max-width:100dvw!important;height:auto!important;max-height:100dvh;border-radius:0 0 var(--cad-radius-lg) var(--cad-radius-lg);border:0;box-shadow:none;padding-bottom:env(safe-area-inset-bottom)}.cad-dialog-container.is-mobile-full .cad-dialog__header{position:sticky;top:0;background:var(--cad-surface);z-index:1;padding-top:calc(14px + env(safe-area-inset-top))}.cad-dialog-container.is-mobile-full .cad-dialog__footer{border-radius:0}.cad-overlay-pane.is-mobile-sheet-pane{width:100%;max-width:100%}.cad-dialog-container.is-mobile-sheet{width:100%;align-items:flex-end}.cad-dialog-container.is-mobile-sheet .cad-dialog{position:relative;width:100%!important;max-width:100%!important;height:92dvh!important;max-height:92dvh;border-radius:16px 16px 0 0;border-bottom:0;box-shadow:0 -8px 32px #0000002e;padding-bottom:env(safe-area-inset-bottom);opacity:1;transform:translateY(100%);transition:transform .2s var(--cad-ease)}.cad-dialog-container.is-mobile-sheet.sheet-h-auto .cad-dialog{height:auto!important}.cad-dialog-container.is-mobile-sheet .cad-dialog:before{content:\"\";position:absolute;top:8px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:2px;background:var(--cad-border-strong)}.cad-dialog-container.is-mobile-sheet .cad-dialog__header{padding-top:20px}.cad-dialog-container.is-mobile-sheet .cad-dialog__body:first-child{padding-top:22px}.cad-dialog-container.is-mobile-sheet.is-open .cad-dialog{transform:none}.cad-dialog-container.is-mobile-sheet .cad-dialog__footer{border-radius:0}.cad-confirm-dialog.is-mobile-sheet .cad-dialog__footer{flex-direction:column-reverse;align-items:stretch;gap:8px}.cad-confirm-dialog.is-mobile-sheet .cad-dialog__footer>*{width:100%;height:44px}@media(prefers-reduced-motion:reduce){.cad-dialog,.cad-dialog-container.is-drawer .cad-dialog,.cad-dialog-container.is-mobile-sheet .cad-dialog,.cdk-overlay-backdrop{transition:none!important}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: CadIconComponent, selector: "cad-icon", inputs: ["name", "size", "strokeWidth", "label", "title", "spin", "filled", "flip", "rotate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4152
4168
|
}
|
|
4153
4169
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: CadDialogContainerComponent, decorators: [{
|
|
4154
4170
|
type: Component,
|
|
@@ -4194,7 +4210,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
|
|
|
4194
4210
|
<footer class="cad-dialog__footer"><ng-container *ngTemplateOutlet="config().footer!" /></footer>
|
|
4195
4211
|
}
|
|
4196
4212
|
</div>
|
|
4197
|
-
`, styles: [".cdk-overlay-container{position:fixed;z-index:var(--cad-z-overlay, 100002);pointer-events:none;top:0;left:0;width:100%;height:100%}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000;width:100%;height:100%}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;opacity:0;transition:opacity var(--cad-dur, .14s) var(--cad-ease, ease)}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{visibility:visible;opacity:0}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.cad-overlay-backdrop{background:var(--cad-backdrop, rgba(2, 6, 23, .45))}.cad-overlay-backdrop.is-hidden{display:none}.cad-overlay-pane{pointer-events:auto}.cad-overlay-pane.is-drawer-pane{height:100%}.cad-dialog-container{display:flex;outline:none;font-family:var(--cad-font);font-size:var(--cad-font-size);color:var(--cad-fg);max-height:100%;max-width:100%}.cad-dialog-container.is-hidden{display:none}.cad-dialog{display:flex;flex-direction:column;background:var(--cad-surface);border:1px solid var(--cad-border);border-radius:var(--cad-radius-lg);box-shadow:var(--cad-shadow-lg);max-height:92vh;min-width:0;outline:none;box-sizing:border-box;opacity:0;transform:translateY(6px) scale(.98);transition:opacity var(--cad-dur) var(--cad-ease),transform var(--cad-dur) var(--cad-ease)}.cad-dialog-container.is-open .cad-dialog{opacity:1;transform:none}.cad-dialog-container.is-maximized .cad-dialog{width:100%!important;max-width:100%!important;height:100vh!important;max-height:100vh;border-radius:0}.cad-dialog__header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 16px 10px;flex:none}.cad-dialog__header.is-draggable{cursor:move;-webkit-user-select:none;user-select:none}.cad-dialog__title{margin:0;font-size:14.5px;font-weight:600;color:var(--cad-fg);min-width:0}.cad-dialog__actions{display:inline-flex;gap:2px;margin-left:auto;flex:none}.cad-dialog__icon-btn{display:grid;place-items:center;width:26px;height:26px;border:0;border-radius:var(--cad-radius-sm);background:transparent;color:var(--cad-fg-muted);cursor:pointer;padding:0;transition:background var(--cad-dur),color var(--cad-dur)}.cad-dialog__icon-btn:hover{background:var(--cad-hover);color:var(--cad-fg)}.cad-dialog__icon-btn:focus-visible{outline:2px solid var(--cad-ring);outline-offset:1px}.cad-dialog__body{padding:4px 16px 14px;color:var(--cad-fg-secondary);font-size:var(--cad-font-size);overflow:auto;flex:1;min-height:0}.cad-dialog__body:first-child{padding-top:16px}.cad-dialog__footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--cad-border);background:var(--cad-bg-subtle);border-radius:0 0 var(--cad-radius-lg) var(--cad-radius-lg);flex:none}.cad-dialog-container.is-drawer{height:100%}.cad-dialog-container.is-drawer .cad-dialog{max-height:none;height:100%;border-radius:0;opacity:1;transform:none;transition:transform .18s var(--cad-ease)}.cad-dialog-container.is-drawer .cad-dialog__footer{border-radius:0}.cad-dialog-container.is-drawer.pos-right .cad-dialog{transform:translate(100%);border-width:0 0 0 1px}.cad-dialog-container.is-drawer.pos-left .cad-dialog{transform:translate(-100%);border-width:0 1px 0 0}.cad-dialog-container.is-drawer.pos-top .cad-dialog{transform:translateY(-100%);border-width:0 0 1px 0}.cad-dialog-container.is-drawer.pos-bottom .cad-dialog{transform:translateY(100%);border-width:1px 0 0 0}.cad-dialog-container.is-drawer.is-open .cad-dialog{transform:none}.cad-dialog-container.is-drawer.pos-top,.cad-dialog-container.is-drawer.pos-bottom{width:100%}.cad-dialog-container.is-drawer.pos-top .cad-dialog,.cad-dialog-container.is-drawer.pos-bottom .cad-dialog{width:100%!important;max-width:100%!important}.cad-dialog-container.is-mobile-full{width:
|
|
4213
|
+
`, styles: [".cdk-overlay-container{position:fixed;z-index:var(--cad-z-overlay, 100002);pointer-events:none;top:0;left:0;width:100%;height:100%}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000;width:100%;height:100%}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;opacity:0;transition:opacity var(--cad-dur, .14s) var(--cad-ease, ease)}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{visibility:visible;opacity:0}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.cad-overlay-backdrop{background:var(--cad-backdrop, rgba(2, 6, 23, .45))}.cad-overlay-backdrop.is-hidden{display:none}.cad-overlay-pane{pointer-events:auto}.cad-overlay-pane.is-drawer-pane{height:100%}.cad-dialog-container{display:flex;outline:none;font-family:var(--cad-font);font-size:var(--cad-font-size);color:var(--cad-fg);max-height:100%;max-width:100%}.cad-dialog-container.is-hidden{display:none}.cad-dialog{display:flex;flex-direction:column;background:var(--cad-surface);border:1px solid var(--cad-border);border-radius:var(--cad-radius-lg);box-shadow:var(--cad-shadow-lg);max-height:92vh;min-width:0;outline:none;box-sizing:border-box;opacity:0;transform:translateY(6px) scale(.98);transition:opacity var(--cad-dur) var(--cad-ease),transform var(--cad-dur) var(--cad-ease)}.cad-dialog-container.is-open .cad-dialog{opacity:1;transform:none}.cad-dialog-container.is-maximized .cad-dialog{width:100%!important;max-width:100%!important;height:100vh!important;max-height:100vh;border-radius:0}.cad-dialog__header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 16px 10px;flex:none}.cad-dialog__header.is-draggable{cursor:move;-webkit-user-select:none;user-select:none}.cad-dialog__title{margin:0;font-size:14.5px;font-weight:600;color:var(--cad-fg);min-width:0}.cad-dialog__actions{display:inline-flex;gap:2px;margin-left:auto;flex:none}.cad-dialog__icon-btn{display:grid;place-items:center;width:26px;height:26px;border:0;border-radius:var(--cad-radius-sm);background:transparent;color:var(--cad-fg-muted);cursor:pointer;padding:0;transition:background var(--cad-dur),color var(--cad-dur)}.cad-dialog__icon-btn:hover{background:var(--cad-hover);color:var(--cad-fg)}.cad-dialog__icon-btn:focus-visible{outline:2px solid var(--cad-ring);outline-offset:1px}.cad-dialog__body{padding:4px 16px 14px;color:var(--cad-fg-secondary);font-size:var(--cad-font-size);overflow:auto;flex:1;min-height:0}.cad-dialog__body:first-child{padding-top:16px}.cad-dialog__footer>[cadDialogFooter]{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;width:100%}.cad-dialog__footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--cad-border);background:var(--cad-bg-subtle);border-radius:0 0 var(--cad-radius-lg) var(--cad-radius-lg);flex:none}.cad-dialog-container.is-drawer{height:100%}.cad-dialog-container.is-drawer .cad-dialog{max-height:none;height:100%;border-radius:0;opacity:1;transform:none;transition:transform .18s var(--cad-ease)}.cad-dialog-container.is-drawer .cad-dialog__footer{border-radius:0}.cad-dialog-container.is-drawer.pos-right .cad-dialog{transform:translate(100%);border-width:0 0 0 1px}.cad-dialog-container.is-drawer.pos-left .cad-dialog{transform:translate(-100%);border-width:0 1px 0 0}.cad-dialog-container.is-drawer.pos-top .cad-dialog{transform:translateY(-100%);border-width:0 0 1px 0}.cad-dialog-container.is-drawer.pos-bottom .cad-dialog{transform:translateY(100%);border-width:1px 0 0 0}.cad-dialog-container.is-drawer.is-open .cad-dialog{transform:none}.cad-dialog-container.is-drawer.pos-top,.cad-dialog-container.is-drawer.pos-bottom{width:100%}.cad-dialog-container.is-drawer.pos-top .cad-dialog,.cad-dialog-container.is-drawer.pos-bottom .cad-dialog{width:100%!important;max-width:100%!important}.cad-dialog-container.is-mobile-full{width:100dvw;height:100dvh;max-height:100dvh;align-items:flex-start}.cad-dialog-container.is-mobile-full .cad-dialog{width:100dvw!important;max-width:100dvw!important;height:auto!important;max-height:100dvh;border-radius:0 0 var(--cad-radius-lg) var(--cad-radius-lg);border:0;box-shadow:none;padding-bottom:env(safe-area-inset-bottom)}.cad-dialog-container.is-mobile-full .cad-dialog__header{position:sticky;top:0;background:var(--cad-surface);z-index:1;padding-top:calc(14px + env(safe-area-inset-top))}.cad-dialog-container.is-mobile-full .cad-dialog__footer{border-radius:0}.cad-overlay-pane.is-mobile-sheet-pane{width:100%;max-width:100%}.cad-dialog-container.is-mobile-sheet{width:100%;align-items:flex-end}.cad-dialog-container.is-mobile-sheet .cad-dialog{position:relative;width:100%!important;max-width:100%!important;height:92dvh!important;max-height:92dvh;border-radius:16px 16px 0 0;border-bottom:0;box-shadow:0 -8px 32px #0000002e;padding-bottom:env(safe-area-inset-bottom);opacity:1;transform:translateY(100%);transition:transform .2s var(--cad-ease)}.cad-dialog-container.is-mobile-sheet.sheet-h-auto .cad-dialog{height:auto!important}.cad-dialog-container.is-mobile-sheet .cad-dialog:before{content:\"\";position:absolute;top:8px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:2px;background:var(--cad-border-strong)}.cad-dialog-container.is-mobile-sheet .cad-dialog__header{padding-top:20px}.cad-dialog-container.is-mobile-sheet .cad-dialog__body:first-child{padding-top:22px}.cad-dialog-container.is-mobile-sheet.is-open .cad-dialog{transform:none}.cad-dialog-container.is-mobile-sheet .cad-dialog__footer{border-radius:0}.cad-confirm-dialog.is-mobile-sheet .cad-dialog__footer{flex-direction:column-reverse;align-items:stretch;gap:8px}.cad-confirm-dialog.is-mobile-sheet .cad-dialog__footer>*{width:100%;height:44px}@media(prefers-reduced-motion:reduce){.cad-dialog,.cad-dialog-container.is-drawer .cad-dialog,.cad-dialog-container.is-mobile-sheet .cad-dialog,.cdk-overlay-backdrop{transition:none!important}}\n"] }]
|
|
4198
4214
|
}], propDecorators: { closeRequest: [{ type: i0.Output, args: ["closeRequest"] }], attached: [{ type: i0.Output, args: ["attached"] }], maximizeChange: [{ type: i0.Output, args: ["maximizeChange"] }] } });
|
|
4199
4215
|
|
|
4200
4216
|
const ANIM_MS = 180;
|
|
@@ -6314,6 +6330,44 @@ const CAD_SHELL = new InjectionToken('CAD_SHELL');
|
|
|
6314
6330
|
* <cad-bottom-nav cadShellBottom [items]="dest" [(value)]="page"/>
|
|
6315
6331
|
* </cad-app-shell>
|
|
6316
6332
|
* ```
|
|
6333
|
+
*
|
|
6334
|
+
* ⚠️ N'ENVELOPPEZ JAMAIS UN EMPLACEMENT DANS UN `@if` (ni `@for`, ni `<ng-template>`).
|
|
6335
|
+
*
|
|
6336
|
+
* La projection de contenu est STATIQUE : Angular apparie les nœuds aux sélecteurs de
|
|
6337
|
+
* `ng-content` sur la structure déclarée. Un `<header cadShellBar>` placé dans un bloc de
|
|
6338
|
+
* flux de contrôle n'est jamais apparié — il tombe dans l'emplacement PAR DÉFAUT, donc dans
|
|
6339
|
+
* la zone de CONTENU. Rien ne le signale : ça compile, ça s'affiche, et la barre se met à
|
|
6340
|
+
* défiler avec le contenu — exactement le défaut que cette coquille existe pour empêcher.
|
|
6341
|
+
* Constaté au navigateur le 22/08/2026 sur le showcase (`.cad-shell__bar` mesurait 0×0).
|
|
6342
|
+
*
|
|
6343
|
+
* ```html
|
|
6344
|
+
* <!-- FAUX : la barre atterrit dans le contenu -->
|
|
6345
|
+
* @if (connecte()) { <header cadShellBar>…</header> }
|
|
6346
|
+
*
|
|
6347
|
+
* <!-- JUSTE : l'emplacement est toujours rendu, c'est son CONTENU qui varie -->
|
|
6348
|
+
* <header cadShellBar [class.est-masque]="!connecte()">…</header>
|
|
6349
|
+
* ```
|
|
6350
|
+
*
|
|
6351
|
+
* Une rangée ou une colonne `auto` dont l'unique enfant est en `display: none` se replie à
|
|
6352
|
+
* zéro : masquer ainsi ne laisse aucune trace dans la mise en page.
|
|
6353
|
+
*
|
|
6354
|
+
* ⚠️ ZONES SÛRES — DEUX CONDITIONS, ET LA PREMIÈRE EST DANS `index.html`.
|
|
6355
|
+
*
|
|
6356
|
+
* 1. **`<meta name="viewport" content="…, viewport-fit=cover">`**. Sans lui, iOS encadre la
|
|
6357
|
+
* page : elle ne s'étend jamais sous l'encoche, la bande du haut est peinte par le SYSTÈME,
|
|
6358
|
+
* et **tous les `env(safe-area-inset-*)` valent 0**. Toute la mécanique de zone sûre de la
|
|
6359
|
+
* bibliothèque — celle de `cad-bottom-nav`, celle du tiroir en mode temporaire — est alors
|
|
6360
|
+
* inerte sans que rien ne le signale.
|
|
6361
|
+
* 2. **La barre peint sa propre zone sûre haute** : `padding-top: env(safe-area-inset-top)`
|
|
6362
|
+
* sur l'élément projeté, PAS sur la coquille. Le rembourrage est intérieur au fond, donc la
|
|
6363
|
+
* couleur de la barre monte jusqu'au bord de l'écran. Le poser côté coquille laisserait la
|
|
6364
|
+
* bande sous l'encoche au fond de la COQUILLE : la cassure resterait, d'une autre couleur.
|
|
6365
|
+
* Avec `box-sizing: border-box`, penser au `min-height: calc(52px + env(safe-area-inset-top))`
|
|
6366
|
+
* — sinon l'encoche mange la hauteur du contenu.
|
|
6367
|
+
*
|
|
6368
|
+
* En application autonome (ajoutée à l'écran d'accueil), la page ne passe pas sous la bande
|
|
6369
|
+
* d'état : `viewport-fit=cover` n'y suffit pas et c'est `<meta name="theme-color">`, tenu à
|
|
6370
|
+
* jour avec le thème, qui donne la continuité.
|
|
6317
6371
|
*/
|
|
6318
6372
|
class CadAppShellComponent {
|
|
6319
6373
|
bp = inject(CadBreakpointService);
|
|
@@ -9398,6 +9452,15 @@ class CadNavDrawerComponent {
|
|
|
9398
9452
|
open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
|
|
9399
9453
|
/** Entrée courante, comparée à `item.value`. */
|
|
9400
9454
|
value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
9455
|
+
/**
|
|
9456
|
+
* Clés des intertitres repliés (`item.value`, à défaut `item.label`).
|
|
9457
|
+
*
|
|
9458
|
+
* Un TABLEAU et non un `Set` : c'est ce qui se lie en deux sens, se compare, et surtout se
|
|
9459
|
+
* sérialise tel quel — l'hôte qui veut persister l'état le pose dans `localStorage` sans
|
|
9460
|
+
* conversion. Le composant ne persiste rien lui-même : il ne saurait pas sous quelle clé,
|
|
9461
|
+
* ni s'il a le droit.
|
|
9462
|
+
*/
|
|
9463
|
+
collapsed = model([], ...(ngDevMode ? [{ debugName: "collapsed" }] : /* istanbul ignore next */ []));
|
|
9401
9464
|
mode = input('auto', ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
|
|
9402
9465
|
/** Seuil de bascule permanent → tiroir, en mode `auto`. */
|
|
9403
9466
|
breakpoint = input('md', ...(ngDevMode ? [{ debugName: "breakpoint" }] : /* istanbul ignore next */ []));
|
|
@@ -9426,6 +9489,42 @@ class CadNavDrawerComponent {
|
|
|
9426
9489
|
}, ...(ngDevMode ? [{ debugName: "effective" }] : /* istanbul ignore next */ []));
|
|
9427
9490
|
temporary = computed(() => this.effective() === 'temporary', ...(ngDevMode ? [{ debugName: "temporary" }] : /* istanbul ignore next */ []));
|
|
9428
9491
|
rail = computed(() => this.effective() === 'rail', ...(ngDevMode ? [{ debugName: "rail" }] : /* istanbul ignore next */ []));
|
|
9492
|
+
/** Clé d'un intertitre. `value` d'abord : un libellé se renomme, une clé non. */
|
|
9493
|
+
cle(it) { return it.value ?? it.label; }
|
|
9494
|
+
/**
|
|
9495
|
+
* Les lignes à rendre : les intertitres toujours, les entrées seulement si leur intertitre
|
|
9496
|
+
* n'est pas replié. Une entrée qui précède tout intertitre n'appartient à aucun groupe et
|
|
9497
|
+
* ne se replie donc jamais — sans quoi elle serait masquée sans bouton pour la rouvrir.
|
|
9498
|
+
*/
|
|
9499
|
+
rows = computed(() => {
|
|
9500
|
+
const replies = new Set(this.collapsed());
|
|
9501
|
+
const rail = this.rail();
|
|
9502
|
+
const out = [];
|
|
9503
|
+
let courante = null;
|
|
9504
|
+
for (const item of this.items()) {
|
|
9505
|
+
if (item.section) {
|
|
9506
|
+
// En rail l'intertitre devient un filet : plus de bouton, donc rien ne se replie.
|
|
9507
|
+
const collapsible = !rail && !!item.collapsible;
|
|
9508
|
+
const key = this.cle(item);
|
|
9509
|
+
courante = { item, key, collapsible, collapsed: collapsible && replies.has(key), count: 0 };
|
|
9510
|
+
out.push(courante);
|
|
9511
|
+
continue;
|
|
9512
|
+
}
|
|
9513
|
+
// Le compte est celui du GROUPE, pas de ce qui est visible : il doit rester le même
|
|
9514
|
+
// une fois replié, sinon il annoncerait zéro au moment où il sert le plus.
|
|
9515
|
+
if (courante)
|
|
9516
|
+
courante.count++;
|
|
9517
|
+
if (courante?.collapsed)
|
|
9518
|
+
continue;
|
|
9519
|
+
out.push({ item, key: '', collapsible: false, collapsed: false, count: 0 });
|
|
9520
|
+
}
|
|
9521
|
+
return out;
|
|
9522
|
+
}, ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
9523
|
+
toggleSection(r) {
|
|
9524
|
+
const s = new Set(this.collapsed());
|
|
9525
|
+
s.has(r.key) ? s.delete(r.key) : s.add(r.key);
|
|
9526
|
+
this.collapsed.set([...s]);
|
|
9527
|
+
}
|
|
9429
9528
|
wasOpen = signal(false, ...(ngDevMode ? [{ debugName: "wasOpen" }] : /* istanbul ignore next */ []));
|
|
9430
9529
|
constructor() {
|
|
9431
9530
|
effect(() => {
|
|
@@ -9471,7 +9570,7 @@ class CadNavDrawerComponent {
|
|
|
9471
9570
|
this.open.set(false);
|
|
9472
9571
|
}
|
|
9473
9572
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: CadNavDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9474
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: CadNavDrawerComponent, isStandalone: true, selector: "cad-nav-drawer", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, breakpoint: { classPropertyName: "breakpoint", publicName: "breakpoint", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, closeOnNavigate: { classPropertyName: "closeOnNavigate", publicName: "closeOnNavigate", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, dismissableScrim: { classPropertyName: "dismissableScrim", publicName: "dismissableScrim", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", value: "valueChange", opened: "opened", closed: "closed", itemClick: "itemClick", changed: "changed" }, host: { listeners: { "document:keydown.escape": "onEscape()" }, properties: { "class.is-temporary": "temporary()", "class.is-permanent": "!temporary()", "class.is-rail": "rail()", "class.is-open": "open()", "class.is-right": "position() === \"right\"" }, classAttribute: "cad-nav-drawer" }, queries: [{ propertyName: "headerSlot", first: true, predicate: CadNavDrawerHeaderDirective, descendants: true, isSignal: true }, { propertyName: "footerSlot", first: true, predicate: CadNavDrawerFooterDirective, descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
9573
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: CadNavDrawerComponent, isStandalone: true, selector: "cad-nav-drawer", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, breakpoint: { classPropertyName: "breakpoint", publicName: "breakpoint", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, closeOnNavigate: { classPropertyName: "closeOnNavigate", publicName: "closeOnNavigate", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, dismissableScrim: { classPropertyName: "dismissableScrim", publicName: "dismissableScrim", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", value: "valueChange", collapsed: "collapsedChange", opened: "opened", closed: "closed", itemClick: "itemClick", changed: "changed" }, host: { listeners: { "document:keydown.escape": "onEscape()" }, properties: { "class.is-temporary": "temporary()", "class.is-permanent": "!temporary()", "class.is-rail": "rail()", "class.is-open": "open()", "class.is-right": "position() === \"right\"" }, classAttribute: "cad-nav-drawer" }, queries: [{ propertyName: "headerSlot", first: true, predicate: CadNavDrawerHeaderDirective, descendants: true, isSignal: true }, { propertyName: "footerSlot", first: true, predicate: CadNavDrawerFooterDirective, descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
9475
9574
|
<!-- Le voile n'existe qu'en mode tiroir : en permanent il n'y a rien à recouvrir. -->
|
|
9476
9575
|
@if (temporary() && open()) {
|
|
9477
9576
|
<div class="cad-nav-drawer__scrim" (click)="dismiss()" aria-hidden="true"></div>
|
|
@@ -9492,11 +9591,28 @@ class CadNavDrawerComponent {
|
|
|
9492
9591
|
</div>
|
|
9493
9592
|
|
|
9494
9593
|
<ul class="cad-nav-drawer__list" role="list">
|
|
9495
|
-
@for (
|
|
9594
|
+
@for (r of rows(); track $index) {
|
|
9595
|
+
@let it = r.item;
|
|
9496
9596
|
@if (it.section) {
|
|
9497
9597
|
<!-- En rail, un intertitre n'a plus de place : un filet le remplace. -->
|
|
9498
9598
|
@if (rail()) {
|
|
9499
9599
|
<li class="cad-nav-drawer__rule" role="separator"></li>
|
|
9600
|
+
} @else if (r.collapsible) {
|
|
9601
|
+
<li>
|
|
9602
|
+
<button
|
|
9603
|
+
type="button"
|
|
9604
|
+
class="cad-nav-drawer__section is-collapsible"
|
|
9605
|
+
[class.is-collapsed]="r.collapsed"
|
|
9606
|
+
[attr.aria-expanded]="!r.collapsed"
|
|
9607
|
+
(click)="toggleSection(r)"
|
|
9608
|
+
>
|
|
9609
|
+
<cad-icon name="chevron-down" [size]="12" class="cad-nav-drawer__chev"/>
|
|
9610
|
+
<span class="cad-nav-drawer__label">{{ it.label }}</span>
|
|
9611
|
+
<!-- Un compte DÉCLARÉ l'emporte sur le compte calculé : une valeur posée
|
|
9612
|
+
par l'hôte est une affirmation, pas un oubli à combler. -->
|
|
9613
|
+
<span class="cad-nav-drawer__badge">{{ it.badge ?? r.count }}</span>
|
|
9614
|
+
</button>
|
|
9615
|
+
</li>
|
|
9500
9616
|
} @else {
|
|
9501
9617
|
<li class="cad-nav-drawer__section">{{ it.label }}</li>
|
|
9502
9618
|
}
|
|
@@ -9547,7 +9663,7 @@ class CadNavDrawerComponent {
|
|
|
9547
9663
|
<span class="cad-nav-drawer__dot" [attr.title]="it.badge"></span>
|
|
9548
9664
|
}
|
|
9549
9665
|
</ng-template>
|
|
9550
|
-
`, isInline: true, styles: [":host{display:block}:host(.is-permanent){flex:none}.cad-nav-drawer__panel{display:flex;flex-direction:column;min-height:0;height:100%;width:var(--cad-nav-drawer-w, 240px);background:var(--cad-bg-subtle);border-right:1px solid var(--cad-border);transition:width var(--cad-dur) var(--cad-ease)}:host(.is-rail) .cad-nav-drawer__panel{width:var(--cad-nav-drawer-rail-w, 56px)}:host(.is-right) .cad-nav-drawer__panel{border-right:0;border-left:1px solid var(--cad-border)}:host(.is-temporary){position:fixed;inset:0 auto 0 0;z-index:var(--cad-z-overlay, 100002);pointer-events:none}:host(.is-temporary.is-right){inset:0 0 0 auto}:host(.is-temporary) .cad-nav-drawer__panel{pointer-events:auto;height:100%;box-shadow:var(--cad-shadow-lg, 0 12px 24px rgba(15,23,42,.18));transform:translate(-100%);transition:transform var(--cad-dur) var(--cad-ease)}:host(.is-temporary.is-right) .cad-nav-drawer__panel{transform:translate(100%)}:host(.is-temporary.is-open) .cad-nav-drawer__panel{transform:translate(0)}.cad-nav-drawer__scrim{position:fixed;inset:0;background:var(--cad-backdrop, rgba(2,6,23,.45));pointer-events:auto;z-index:-1}.cad-nav-drawer__head{display:flex;align-items:center;gap:9px;flex:none;padding:14px 14px 12px;border-bottom:1px solid var(--cad-border);min-height:48px;color:var(--cad-fg);font-size:13px}:host(.is-rail) .cad-nav-drawer__head{justify-content:center;padding:14px 0 12px}.cad-nav-drawer__head cad-icon{color:var(--cad-accent);flex:none}.cad-nav-drawer__list{list-style:none;margin:0;padding:8px 0;flex:1;min-height:0;overflow-y:auto}.cad-nav-drawer__section{padding:12px 14px 5px;font-size:10px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--cad-fg-muted)}.cad-nav-drawer__rule{height:1px;margin:8px 12px;background:var(--cad-border)}.cad-nav-drawer__item{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;cursor:pointer;padding:8px 14px;min-height:38px;color:var(--cad-fg-secondary);font:12.5px var(--cad-font);text-decoration:none}:host(.is-rail) .cad-nav-drawer__item{justify-content:center;padding:10px 0}.cad-nav-drawer__item:hover{background:var(--cad-hover);color:var(--cad-fg)}.cad-nav-drawer__item:focus-visible{outline:2px solid var(--cad-accent);outline-offset:-2px}.cad-nav-drawer__item.is-active{background:var(--cad-accent-soft);color:var(--cad-accent);font-weight:500;box-shadow:inset 3px 0 0 var(--cad-accent)}:host(.is-right) .cad-nav-drawer__item.is-active{box-shadow:inset -3px 0 0 var(--cad-accent)}.cad-nav-drawer__item.is-disabled,.cad-nav-drawer__item:disabled{opacity:.45;cursor:not-allowed}.cad-nav-drawer__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cad-nav-drawer__badge{flex:none;font-size:10.5px;font-family:var(--cad-font-mono);border-radius:var(--cad-radius-pill);padding:1px 7px;background:var(--cad-elevated, var(--cad-border));color:var(--cad-fg-secondary)}.cad-nav-drawer__item.is-active .cad-nav-drawer__badge{background:var(--cad-accent);color:var(--cad-fg-on-accent)}.cad-nav-drawer__dot{position:absolute;margin:-14px 0 0 14px;width:7px;height:7px;border-radius:50%;background:var(--cad-danger, #f85149)}.cad-nav-drawer__foot{flex:none;border-top:1px solid var(--cad-border);padding:10px 14px}.cad-nav-drawer__foot.is-empty{display:none}:host(.is-rail) .cad-nav-drawer__foot{padding:10px 0;display:flex;justify-content:center}:host-context(.cad-touch) .cad-nav-drawer__item{min-height:44px}@media(prefers-reduced-motion:reduce){.cad-nav-drawer__panel{transition:none}}\n"], dependencies: [{ kind: "component", type: CadIconComponent, selector: "cad-icon", inputs: ["name", "size", "strokeWidth", "label", "title", "spin", "filled", "flip", "rotate"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9666
|
+
`, isInline: true, styles: [":host{display:block}:host(.is-permanent){flex:none}.cad-nav-drawer__panel{display:flex;flex-direction:column;min-height:0;height:100%;width:var(--cad-nav-drawer-w, 240px);background:var(--cad-bg-subtle);border-right:1px solid var(--cad-border);transition:width var(--cad-dur) var(--cad-ease)}:host(.is-rail) .cad-nav-drawer__panel{width:var(--cad-nav-drawer-rail-w, 56px)}:host(.is-right) .cad-nav-drawer__panel{border-right:0;border-left:1px solid var(--cad-border)}:host(.is-temporary){position:fixed;inset:0 auto 0 0;z-index:var(--cad-z-overlay, 100002);pointer-events:none}:host(.is-temporary.is-right){inset:0 0 0 auto}:host(.is-temporary) .cad-nav-drawer__panel{pointer-events:auto;height:100%;box-shadow:var(--cad-shadow-lg, 0 12px 24px rgba(15,23,42,.18));transform:translate(-100%);transition:transform var(--cad-dur) var(--cad-ease);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}:host(.is-temporary.is-right) .cad-nav-drawer__panel{transform:translate(100%)}:host(.is-temporary.is-open) .cad-nav-drawer__panel{transform:translate(0)}.cad-nav-drawer__scrim{position:fixed;inset:0;background:var(--cad-backdrop, rgba(2,6,23,.45));pointer-events:auto;z-index:-1}.cad-nav-drawer__head{display:flex;align-items:center;gap:9px;flex:none;padding:14px 14px 12px;border-bottom:1px solid var(--cad-border);min-height:48px;color:var(--cad-fg);font-size:13px}:host(.is-rail) .cad-nav-drawer__head{justify-content:center;padding:14px 0 12px}.cad-nav-drawer__head cad-icon{color:var(--cad-accent);flex:none}.cad-nav-drawer__list{list-style:none;margin:0;padding:8px 0;flex:1;min-height:0;overflow-y:auto}.cad-nav-drawer__section{padding:12px 14px 5px;font-size:10px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--cad-fg-muted)}.cad-nav-drawer__rule{height:1px;margin:8px 12px;background:var(--cad-border)}.cad-nav-drawer__section.is-collapsible{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;cursor:pointer;padding:12px 14px 5px;font:500 10px var(--cad-font);letter-spacing:.07em;text-transform:uppercase;color:var(--cad-fg-muted)}.cad-nav-drawer__section.is-collapsible:hover{color:var(--cad-fg-secondary)}.cad-nav-drawer__section.is-collapsible:focus-visible{outline:2px solid var(--cad-accent);outline-offset:-2px}.cad-nav-drawer__chev{flex:none;transition:transform var(--cad-dur) var(--cad-ease)}.cad-nav-drawer__section.is-collapsed .cad-nav-drawer__chev{transform:rotate(-90deg)}@media(prefers-reduced-motion:reduce){.cad-nav-drawer__chev{transition:none}}.cad-nav-drawer__item{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;cursor:pointer;padding:8px 14px;min-height:38px;color:var(--cad-fg-secondary);font:12.5px var(--cad-font);text-decoration:none}:host(.is-rail) .cad-nav-drawer__item{justify-content:center;padding:10px 0}.cad-nav-drawer__item:hover{background:var(--cad-hover);color:var(--cad-fg)}.cad-nav-drawer__item:focus-visible{outline:2px solid var(--cad-accent);outline-offset:-2px}.cad-nav-drawer__item.is-active{background:var(--cad-accent-soft);color:var(--cad-accent);font-weight:500;box-shadow:inset 3px 0 0 var(--cad-accent)}:host(.is-right) .cad-nav-drawer__item.is-active{box-shadow:inset -3px 0 0 var(--cad-accent)}.cad-nav-drawer__item.is-disabled,.cad-nav-drawer__item:disabled{opacity:.45;cursor:not-allowed}.cad-nav-drawer__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cad-nav-drawer__badge{flex:none;font-size:10.5px;font-family:var(--cad-font-mono);border-radius:var(--cad-radius-pill);padding:1px 7px;background:var(--cad-elevated, var(--cad-border));color:var(--cad-fg-secondary)}.cad-nav-drawer__item.is-active .cad-nav-drawer__badge{background:var(--cad-accent);color:var(--cad-fg-on-accent)}.cad-nav-drawer__dot{position:absolute;margin:-14px 0 0 14px;width:7px;height:7px;border-radius:50%;background:var(--cad-danger, #f85149)}.cad-nav-drawer__foot{flex:none;border-top:1px solid var(--cad-border);padding:10px 14px}.cad-nav-drawer__foot.is-empty{display:none}:host(.is-rail) .cad-nav-drawer__foot{padding:10px 0;display:flex;justify-content:center}:host-context(.cad-touch) .cad-nav-drawer__item{min-height:44px}@media(prefers-reduced-motion:reduce){.cad-nav-drawer__panel{transition:none}}\n"], dependencies: [{ kind: "component", type: CadIconComponent, selector: "cad-icon", inputs: ["name", "size", "strokeWidth", "label", "title", "spin", "filled", "flip", "rotate"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9551
9667
|
}
|
|
9552
9668
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: CadNavDrawerComponent, decorators: [{
|
|
9553
9669
|
type: Component,
|
|
@@ -9579,11 +9695,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
|
|
|
9579
9695
|
</div>
|
|
9580
9696
|
|
|
9581
9697
|
<ul class="cad-nav-drawer__list" role="list">
|
|
9582
|
-
@for (
|
|
9698
|
+
@for (r of rows(); track $index) {
|
|
9699
|
+
@let it = r.item;
|
|
9583
9700
|
@if (it.section) {
|
|
9584
9701
|
<!-- En rail, un intertitre n'a plus de place : un filet le remplace. -->
|
|
9585
9702
|
@if (rail()) {
|
|
9586
9703
|
<li class="cad-nav-drawer__rule" role="separator"></li>
|
|
9704
|
+
} @else if (r.collapsible) {
|
|
9705
|
+
<li>
|
|
9706
|
+
<button
|
|
9707
|
+
type="button"
|
|
9708
|
+
class="cad-nav-drawer__section is-collapsible"
|
|
9709
|
+
[class.is-collapsed]="r.collapsed"
|
|
9710
|
+
[attr.aria-expanded]="!r.collapsed"
|
|
9711
|
+
(click)="toggleSection(r)"
|
|
9712
|
+
>
|
|
9713
|
+
<cad-icon name="chevron-down" [size]="12" class="cad-nav-drawer__chev"/>
|
|
9714
|
+
<span class="cad-nav-drawer__label">{{ it.label }}</span>
|
|
9715
|
+
<!-- Un compte DÉCLARÉ l'emporte sur le compte calculé : une valeur posée
|
|
9716
|
+
par l'hôte est une affirmation, pas un oubli à combler. -->
|
|
9717
|
+
<span class="cad-nav-drawer__badge">{{ it.badge ?? r.count }}</span>
|
|
9718
|
+
</button>
|
|
9719
|
+
</li>
|
|
9587
9720
|
} @else {
|
|
9588
9721
|
<li class="cad-nav-drawer__section">{{ it.label }}</li>
|
|
9589
9722
|
}
|
|
@@ -9634,8 +9767,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
|
|
|
9634
9767
|
<span class="cad-nav-drawer__dot" [attr.title]="it.badge"></span>
|
|
9635
9768
|
}
|
|
9636
9769
|
</ng-template>
|
|
9637
|
-
`, styles: [":host{display:block}:host(.is-permanent){flex:none}.cad-nav-drawer__panel{display:flex;flex-direction:column;min-height:0;height:100%;width:var(--cad-nav-drawer-w, 240px);background:var(--cad-bg-subtle);border-right:1px solid var(--cad-border);transition:width var(--cad-dur) var(--cad-ease)}:host(.is-rail) .cad-nav-drawer__panel{width:var(--cad-nav-drawer-rail-w, 56px)}:host(.is-right) .cad-nav-drawer__panel{border-right:0;border-left:1px solid var(--cad-border)}:host(.is-temporary){position:fixed;inset:0 auto 0 0;z-index:var(--cad-z-overlay, 100002);pointer-events:none}:host(.is-temporary.is-right){inset:0 0 0 auto}:host(.is-temporary) .cad-nav-drawer__panel{pointer-events:auto;height:100%;box-shadow:var(--cad-shadow-lg, 0 12px 24px rgba(15,23,42,.18));transform:translate(-100%);transition:transform var(--cad-dur) var(--cad-ease)}:host(.is-temporary.is-right) .cad-nav-drawer__panel{transform:translate(100%)}:host(.is-temporary.is-open) .cad-nav-drawer__panel{transform:translate(0)}.cad-nav-drawer__scrim{position:fixed;inset:0;background:var(--cad-backdrop, rgba(2,6,23,.45));pointer-events:auto;z-index:-1}.cad-nav-drawer__head{display:flex;align-items:center;gap:9px;flex:none;padding:14px 14px 12px;border-bottom:1px solid var(--cad-border);min-height:48px;color:var(--cad-fg);font-size:13px}:host(.is-rail) .cad-nav-drawer__head{justify-content:center;padding:14px 0 12px}.cad-nav-drawer__head cad-icon{color:var(--cad-accent);flex:none}.cad-nav-drawer__list{list-style:none;margin:0;padding:8px 0;flex:1;min-height:0;overflow-y:auto}.cad-nav-drawer__section{padding:12px 14px 5px;font-size:10px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--cad-fg-muted)}.cad-nav-drawer__rule{height:1px;margin:8px 12px;background:var(--cad-border)}.cad-nav-drawer__item{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;cursor:pointer;padding:8px 14px;min-height:38px;color:var(--cad-fg-secondary);font:12.5px var(--cad-font);text-decoration:none}:host(.is-rail) .cad-nav-drawer__item{justify-content:center;padding:10px 0}.cad-nav-drawer__item:hover{background:var(--cad-hover);color:var(--cad-fg)}.cad-nav-drawer__item:focus-visible{outline:2px solid var(--cad-accent);outline-offset:-2px}.cad-nav-drawer__item.is-active{background:var(--cad-accent-soft);color:var(--cad-accent);font-weight:500;box-shadow:inset 3px 0 0 var(--cad-accent)}:host(.is-right) .cad-nav-drawer__item.is-active{box-shadow:inset -3px 0 0 var(--cad-accent)}.cad-nav-drawer__item.is-disabled,.cad-nav-drawer__item:disabled{opacity:.45;cursor:not-allowed}.cad-nav-drawer__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cad-nav-drawer__badge{flex:none;font-size:10.5px;font-family:var(--cad-font-mono);border-radius:var(--cad-radius-pill);padding:1px 7px;background:var(--cad-elevated, var(--cad-border));color:var(--cad-fg-secondary)}.cad-nav-drawer__item.is-active .cad-nav-drawer__badge{background:var(--cad-accent);color:var(--cad-fg-on-accent)}.cad-nav-drawer__dot{position:absolute;margin:-14px 0 0 14px;width:7px;height:7px;border-radius:50%;background:var(--cad-danger, #f85149)}.cad-nav-drawer__foot{flex:none;border-top:1px solid var(--cad-border);padding:10px 14px}.cad-nav-drawer__foot.is-empty{display:none}:host(.is-rail) .cad-nav-drawer__foot{padding:10px 0;display:flex;justify-content:center}:host-context(.cad-touch) .cad-nav-drawer__item{min-height:44px}@media(prefers-reduced-motion:reduce){.cad-nav-drawer__panel{transition:none}}\n"] }]
|
|
9638
|
-
}], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], breakpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "breakpoint", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], closeOnNavigate: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnNavigate", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], dismissableScrim: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissableScrim", required: false }] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], changed: [{ type: i0.Output, args: ["changed"] }], headerSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => CadNavDrawerHeaderDirective), { isSignal: true }] }], footerSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => CadNavDrawerFooterDirective), { isSignal: true }] }], onEscape: [{
|
|
9770
|
+
`, styles: [":host{display:block}:host(.is-permanent){flex:none}.cad-nav-drawer__panel{display:flex;flex-direction:column;min-height:0;height:100%;width:var(--cad-nav-drawer-w, 240px);background:var(--cad-bg-subtle);border-right:1px solid var(--cad-border);transition:width var(--cad-dur) var(--cad-ease)}:host(.is-rail) .cad-nav-drawer__panel{width:var(--cad-nav-drawer-rail-w, 56px)}:host(.is-right) .cad-nav-drawer__panel{border-right:0;border-left:1px solid var(--cad-border)}:host(.is-temporary){position:fixed;inset:0 auto 0 0;z-index:var(--cad-z-overlay, 100002);pointer-events:none}:host(.is-temporary.is-right){inset:0 0 0 auto}:host(.is-temporary) .cad-nav-drawer__panel{pointer-events:auto;height:100%;box-shadow:var(--cad-shadow-lg, 0 12px 24px rgba(15,23,42,.18));transform:translate(-100%);transition:transform var(--cad-dur) var(--cad-ease);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}:host(.is-temporary.is-right) .cad-nav-drawer__panel{transform:translate(100%)}:host(.is-temporary.is-open) .cad-nav-drawer__panel{transform:translate(0)}.cad-nav-drawer__scrim{position:fixed;inset:0;background:var(--cad-backdrop, rgba(2,6,23,.45));pointer-events:auto;z-index:-1}.cad-nav-drawer__head{display:flex;align-items:center;gap:9px;flex:none;padding:14px 14px 12px;border-bottom:1px solid var(--cad-border);min-height:48px;color:var(--cad-fg);font-size:13px}:host(.is-rail) .cad-nav-drawer__head{justify-content:center;padding:14px 0 12px}.cad-nav-drawer__head cad-icon{color:var(--cad-accent);flex:none}.cad-nav-drawer__list{list-style:none;margin:0;padding:8px 0;flex:1;min-height:0;overflow-y:auto}.cad-nav-drawer__section{padding:12px 14px 5px;font-size:10px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--cad-fg-muted)}.cad-nav-drawer__rule{height:1px;margin:8px 12px;background:var(--cad-border)}.cad-nav-drawer__section.is-collapsible{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;cursor:pointer;padding:12px 14px 5px;font:500 10px var(--cad-font);letter-spacing:.07em;text-transform:uppercase;color:var(--cad-fg-muted)}.cad-nav-drawer__section.is-collapsible:hover{color:var(--cad-fg-secondary)}.cad-nav-drawer__section.is-collapsible:focus-visible{outline:2px solid var(--cad-accent);outline-offset:-2px}.cad-nav-drawer__chev{flex:none;transition:transform var(--cad-dur) var(--cad-ease)}.cad-nav-drawer__section.is-collapsed .cad-nav-drawer__chev{transform:rotate(-90deg)}@media(prefers-reduced-motion:reduce){.cad-nav-drawer__chev{transition:none}}.cad-nav-drawer__item{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;cursor:pointer;padding:8px 14px;min-height:38px;color:var(--cad-fg-secondary);font:12.5px var(--cad-font);text-decoration:none}:host(.is-rail) .cad-nav-drawer__item{justify-content:center;padding:10px 0}.cad-nav-drawer__item:hover{background:var(--cad-hover);color:var(--cad-fg)}.cad-nav-drawer__item:focus-visible{outline:2px solid var(--cad-accent);outline-offset:-2px}.cad-nav-drawer__item.is-active{background:var(--cad-accent-soft);color:var(--cad-accent);font-weight:500;box-shadow:inset 3px 0 0 var(--cad-accent)}:host(.is-right) .cad-nav-drawer__item.is-active{box-shadow:inset -3px 0 0 var(--cad-accent)}.cad-nav-drawer__item.is-disabled,.cad-nav-drawer__item:disabled{opacity:.45;cursor:not-allowed}.cad-nav-drawer__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cad-nav-drawer__badge{flex:none;font-size:10.5px;font-family:var(--cad-font-mono);border-radius:var(--cad-radius-pill);padding:1px 7px;background:var(--cad-elevated, var(--cad-border));color:var(--cad-fg-secondary)}.cad-nav-drawer__item.is-active .cad-nav-drawer__badge{background:var(--cad-accent);color:var(--cad-fg-on-accent)}.cad-nav-drawer__dot{position:absolute;margin:-14px 0 0 14px;width:7px;height:7px;border-radius:50%;background:var(--cad-danger, #f85149)}.cad-nav-drawer__foot{flex:none;border-top:1px solid var(--cad-border);padding:10px 14px}.cad-nav-drawer__foot.is-empty{display:none}:host(.is-rail) .cad-nav-drawer__foot{padding:10px 0;display:flex;justify-content:center}:host-context(.cad-touch) .cad-nav-drawer__item{min-height:44px}@media(prefers-reduced-motion:reduce){.cad-nav-drawer__panel{transition:none}}\n"] }]
|
|
9771
|
+
}], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }, { type: i0.Output, args: ["collapsedChange"] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], breakpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "breakpoint", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], closeOnNavigate: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnNavigate", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], dismissableScrim: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissableScrim", required: false }] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], changed: [{ type: i0.Output, args: ["changed"] }], headerSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => CadNavDrawerHeaderDirective), { isSignal: true }] }], footerSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => CadNavDrawerFooterDirective), { isSignal: true }] }], onEscape: [{
|
|
9639
9772
|
type: HostListener,
|
|
9640
9773
|
args: ['document:keydown.escape']
|
|
9641
9774
|
}] } });
|
|
@@ -12376,7 +12509,7 @@ class CadToastComponent {
|
|
|
12376
12509
|
}
|
|
12377
12510
|
</div>
|
|
12378
12511
|
}
|
|
12379
|
-
`, isInline: true, styles: [":host{position:fixed;display:flex;flex-direction:column;gap:8px;width:340px;max-width:calc(100% - 32px);pointer-events:none;font-family:var(--cad-font)}:host(.pos-top-right){top:
|
|
12512
|
+
`, isInline: true, styles: [":host{position:fixed;display:flex;flex-direction:column;gap:8px;width:340px;max-width:calc(100% - 32px);pointer-events:none;font-family:var(--cad-font)}:host{--_haut: calc(16px + max(var(--cad-shell-top, 0px), env(safe-area-inset-top, 0px))) ;--_bas: calc(16px + max(var(--cad-shell-bottom, 0px), env(safe-area-inset-bottom, 0px))) }:host(.pos-top-right){top:var(--_haut);right:16px}:host(.pos-top-left){top:var(--_haut);left:16px}:host(.pos-bottom-right){bottom:var(--_bas);right:16px;flex-direction:column-reverse}:host(.pos-bottom-left){bottom:var(--_bas);left:16px;flex-direction:column-reverse}:host(.pos-top-center){top:var(--_haut);left:50%;transform:translate(-50%)}:host(.pos-bottom-center){bottom:var(--_bas);left:50%;transform:translate(-50%);flex-direction:column-reverse}.cad-toast__item{--_c: var(--cad-accent);position:relative;overflow:hidden;pointer-events:auto;display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:10px;background:var(--cad-overlay);--cad-hover: var(--cad-overlay-hover);border:1px solid var(--cad-border);border-left:3px solid var(--_c);box-shadow:var(--cad-shadow-lg);color:var(--cad-fg);animation:cad-toast-in .18s var(--cad-ease)}.cad-toast__item.is-out{animation:cad-toast-out .16s var(--cad-ease) forwards}:host(.pos-top-left) .cad-toast__item,:host(.pos-bottom-left) .cad-toast__item{animation-name:cad-toast-in-l}.cad-toast__item.sev-success{--_c: var(--cad-success)}.cad-toast__item.sev-info{--_c: var(--cad-info)}.cad-toast__item.sev-warning{--_c: var(--cad-warning)}.cad-toast__item.sev-danger{--_c: var(--cad-danger)}.cad-toast__item.sev-secondary{--_c: var(--cad-fg-muted)}.cad-toast__item.sev-contrast{--_c: var(--cad-fg);background:var(--cad-fg);color:var(--cad-bg)}.cad-toast__icon{color:var(--_c);margin-top:1px;flex:none}.cad-toast__text{display:grid;gap:2px;flex:1;min-width:0}.cad-toast__text b{font-weight:600;font-size:13px}.cad-toast__text span{color:var(--cad-fg-secondary);font-size:12.5px;line-height:1.4}.sev-contrast .cad-toast__text span{color:inherit;opacity:.8}.cad-toast__actions{display:flex;gap:4px;margin-top:4px;margin-left:-8px}.cad-toast__close{border:0;background:transparent;color:var(--cad-fg-muted);cursor:pointer;padding:2px;border-radius:4px;display:grid;place-items:center;flex:none;margin:-2px -4px 0 0}.cad-toast__close:hover{color:var(--cad-fg);background:var(--cad-hover)}.cad-toast__progress{position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--_c);opacity:.5;transform-origin:left;animation:cad-toast-life linear forwards}@keyframes cad-toast-in{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:none}}@keyframes cad-toast-in-l{0%{opacity:0;transform:translate(-24px)}to{opacity:1;transform:none}}@keyframes cad-toast-out{to{opacity:0;transform:scale(.96)}}@keyframes cad-toast-life{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media(prefers-reduced-motion:reduce){.cad-toast__item,.cad-toast__item.is-out{animation-duration:1ms}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CadIconComponent, selector: "cad-icon", inputs: ["name", "size", "strokeWidth", "label", "title", "spin", "filled", "flip", "rotate"] }, { kind: "component", type: CadButtonComponent, selector: "button[cadButton], a[cadButton]", inputs: ["severity", "variant", "size", "loading", "disabled", "icon", "block", "value", "pressed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
12380
12513
|
}
|
|
12381
12514
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: CadToastComponent, decorators: [{
|
|
12382
12515
|
type: Component,
|
|
@@ -12409,7 +12542,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
|
|
|
12409
12542
|
}
|
|
12410
12543
|
</div>
|
|
12411
12544
|
}
|
|
12412
|
-
`, styles: [":host{position:fixed;display:flex;flex-direction:column;gap:8px;width:340px;max-width:calc(100% - 32px);pointer-events:none;font-family:var(--cad-font)}:host(.pos-top-right){top:
|
|
12545
|
+
`, styles: [":host{position:fixed;display:flex;flex-direction:column;gap:8px;width:340px;max-width:calc(100% - 32px);pointer-events:none;font-family:var(--cad-font)}:host{--_haut: calc(16px + max(var(--cad-shell-top, 0px), env(safe-area-inset-top, 0px))) ;--_bas: calc(16px + max(var(--cad-shell-bottom, 0px), env(safe-area-inset-bottom, 0px))) }:host(.pos-top-right){top:var(--_haut);right:16px}:host(.pos-top-left){top:var(--_haut);left:16px}:host(.pos-bottom-right){bottom:var(--_bas);right:16px;flex-direction:column-reverse}:host(.pos-bottom-left){bottom:var(--_bas);left:16px;flex-direction:column-reverse}:host(.pos-top-center){top:var(--_haut);left:50%;transform:translate(-50%)}:host(.pos-bottom-center){bottom:var(--_bas);left:50%;transform:translate(-50%);flex-direction:column-reverse}.cad-toast__item{--_c: var(--cad-accent);position:relative;overflow:hidden;pointer-events:auto;display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:10px;background:var(--cad-overlay);--cad-hover: var(--cad-overlay-hover);border:1px solid var(--cad-border);border-left:3px solid var(--_c);box-shadow:var(--cad-shadow-lg);color:var(--cad-fg);animation:cad-toast-in .18s var(--cad-ease)}.cad-toast__item.is-out{animation:cad-toast-out .16s var(--cad-ease) forwards}:host(.pos-top-left) .cad-toast__item,:host(.pos-bottom-left) .cad-toast__item{animation-name:cad-toast-in-l}.cad-toast__item.sev-success{--_c: var(--cad-success)}.cad-toast__item.sev-info{--_c: var(--cad-info)}.cad-toast__item.sev-warning{--_c: var(--cad-warning)}.cad-toast__item.sev-danger{--_c: var(--cad-danger)}.cad-toast__item.sev-secondary{--_c: var(--cad-fg-muted)}.cad-toast__item.sev-contrast{--_c: var(--cad-fg);background:var(--cad-fg);color:var(--cad-bg)}.cad-toast__icon{color:var(--_c);margin-top:1px;flex:none}.cad-toast__text{display:grid;gap:2px;flex:1;min-width:0}.cad-toast__text b{font-weight:600;font-size:13px}.cad-toast__text span{color:var(--cad-fg-secondary);font-size:12.5px;line-height:1.4}.sev-contrast .cad-toast__text span{color:inherit;opacity:.8}.cad-toast__actions{display:flex;gap:4px;margin-top:4px;margin-left:-8px}.cad-toast__close{border:0;background:transparent;color:var(--cad-fg-muted);cursor:pointer;padding:2px;border-radius:4px;display:grid;place-items:center;flex:none;margin:-2px -4px 0 0}.cad-toast__close:hover{color:var(--cad-fg);background:var(--cad-hover)}.cad-toast__progress{position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--_c);opacity:.5;transform-origin:left;animation:cad-toast-life linear forwards}@keyframes cad-toast-in{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:none}}@keyframes cad-toast-in-l{0%{opacity:0;transform:translate(-24px)}to{opacity:1;transform:none}}@keyframes cad-toast-out{to{opacity:0;transform:scale(.96)}}@keyframes cad-toast-life{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media(prefers-reduced-motion:reduce){.cad-toast__item,.cad-toast__item.is-out{animation-duration:1ms}}\n"] }]
|
|
12413
12546
|
}], ctorParameters: () => [], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], key: [{ type: i0.Input, args: [{ isSignal: true, alias: "key", required: false }] }], life: [{ type: i0.Input, args: [{ isSignal: true, alias: "life", required: false }] }], maxVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisible", required: false }] }], preventDuplicates: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventDuplicates", required: false }] }], showProgress: [{ type: i0.Input, args: [{ isSignal: true, alias: "showProgress", required: false }] }], zIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "zIndex", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], clicked: [{ type: i0.Output, args: ["clicked"] }], itemTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => CadToastItemDirective), { isSignal: true }] }] } });
|
|
12414
12547
|
|
|
12415
12548
|
/**
|