@memberjunction/ng-ui-components 6.1.0-edge.6 → 6.1.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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.service.d.ts","sourceRoot":"","sources":["../../../src/lib/dialog/dialog.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,YAAY,EACZ,IAAI,EACJ,gBAAgB,EAKjB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAW,UAAU,EAAE,MAAM,MAAM,CAAC;AA4D3C;;;GAGG;AACH,OAAO,EAA4B,YAAY,EAAE,MAAM,eAAe,CAAC;;AA9DvE;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;IACjC,yCAAyC;IACzC,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qCAAqC;IACrC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8BAA8B;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,gBAAgB,CAAC;CAC7B;AAED;;GAEG;AACH,qBAAa,WAAW;IACtB,OAAO,CAAC,aAAa,CAA0B;IAC/C,OAAO,CAAC,YAAY,CAAyD;IAE7E,yEAAyE;IACzE,OAAO,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;KAAE,GAAG,IAAI,CAAQ;IAE7D,sDAAsD;IACtD,IAAI,MAAM,IAAI,UAAU,CAAC,OAAO,CAAC,CAEhC;IAED,gBAAgB;IAChB,eAAe,CAAC,GAAG,EAAE,YAAY,CAAC,0BAA0B,CAAC,GAAG,IAAI;IAIpE,qCAAqC;IACrC,KAAK,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,IAAI;CAM9B;AAQD,
|
|
1
|
+
{"version":3,"file":"dialog.service.d.ts","sourceRoot":"","sources":["../../../src/lib/dialog/dialog.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,YAAY,EACZ,IAAI,EACJ,gBAAgB,EAKjB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAW,UAAU,EAAE,MAAM,MAAM,CAAC;AA4D3C;;;GAGG;AACH,OAAO,EAA4B,YAAY,EAAE,MAAM,eAAe,CAAC;;AA9DvE;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;IACjC,yCAAyC;IACzC,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qCAAqC;IACrC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8BAA8B;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,gBAAgB,CAAC;CAC7B;AAED;;GAEG;AACH,qBAAa,WAAW;IACtB,OAAO,CAAC,aAAa,CAA0B;IAC/C,OAAO,CAAC,YAAY,CAAyD;IAE7E,yEAAyE;IACzE,OAAO,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;KAAE,GAAG,IAAI,CAAQ;IAE7D,sDAAsD;IACtD,IAAI,MAAM,IAAI,UAAU,CAAC,OAAO,CAAC,CAEhC;IAED,gBAAgB;IAChB,eAAe,CAAC,GAAG,EAAE,YAAY,CAAC,0BAA0B,CAAC,GAAG,IAAI;IAIpE,qCAAqC;IACrC,KAAK,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,IAAI;CAM9B;AAQD,qBA+Ka,0BAA0B;IAC5B,KAAK,SAAM;IACX,aAAa,SAAM;IACnB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC5B,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC/B,MAAM,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC7B,OAAO,EAAE,cAAc,EAAE,CAAM;IAC9B,aAAa,+BAAsC;IACnD,YAAY,qBAA4B;IAElD,eAAe,IAAI,IAAI;IAIvB,YAAY,IAAI,IAAI;IAIpB,aAAa,CAAC,MAAM,EAAE,cAAc,GAAG,IAAI;yCAlBhC,0BAA0B;2CAA1B,0BAA0B;CAqBtC;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,qBACa,eAAe;IAC1B,OAAO,CAAC,MAAM,CAA0B;IACxC,OAAO,CAAC,QAAQ,CAAoB;IAEpC;;;;;OAKG;IACH,IAAI,CAAC,QAAQ,EAAE,gBAAgB,GAAG,WAAW;IAa7C,OAAO,CAAC,eAAe;IAOvB,OAAO,CAAC,kBAAkB;IAoB1B,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,sBAAsB;IAoB9B;;OAEG;IACH,IAAI,CAAC,QAAQ,EAAE,gBAAgB,GAAG,WAAW;yCAlFlC,eAAe;6CAAf,eAAe;CAqF3B"}
|
|
@@ -115,7 +115,7 @@ export class MJDialogContainerComponent {
|
|
|
115
115
|
i0.ɵɵconditional(ctx.StringContent ? 4 : -1);
|
|
116
116
|
i0.ɵɵadvance(3);
|
|
117
117
|
i0.ɵɵconditional(ctx.Actions && ctx.Actions.length > 0 ? 7 : -1);
|
|
118
|
-
} }, styles: [".mj-dialog-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n top: 0; left: 0; right: 0; bottom: 0;\n background: var(--mj-bg-overlay);\n z-index: 10001;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .mj-dialog-container[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-lg);\n box-shadow: var(--mj-shadow-xl, 0 20px 60px color-mix(in srgb, var(--mj-text-primary) 30%, transparent));\n display: flex;\n flex-direction: column;\n max-height: 90vh;\n max-width: 90vw;\n overflow: hidden;\n }\n\n .mj-dialog-titlebar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 20px;\n border-bottom: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-card);\n }\n\n .mj-dialog-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 1.1rem;\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-close[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n border: none;\n background: none;\n cursor: pointer;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-sm);\n transition: var(--mj-transition-colors);\n }\n .mj-dialog-close[_ngcontent-%COMP%]:hover {\n background: var(--mj-bg-surface-hover);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-body[_ngcontent-%COMP%] {\n flex: 1;\n padding: 0;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n min-height: 0;\n }\n\n .mj-dialog-body[_ngcontent-%COMP%] > p[_ngcontent-%COMP%] {\n padding: 20px;\n }\n\n .mj-dialog-body[_ngcontent-%COMP%] > div[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n min-height: 0;\n }\n\n .mj-dialog-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n color: var(--mj-text-primary);\n line-height: 1.5;\n }\n\n .mj-dialog-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 20px;\n border-top: 1px solid var(--mj-border-default);\n }\n\n .mj-btn[_ngcontent-%COMP%] {\n padding: 8px 16px;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm);\n background: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n cursor: pointer;\n font-size: 0.875rem;\n transition: var(--mj-transition-colors);\n }\n .mj-btn[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); }\n .mj-btn--primary[_ngcontent-%COMP%] {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n }\n .mj-btn--primary[_ngcontent-%COMP%]:hover { background: var(--mj-brand-primary-hover); }\n .mj-btn--danger[_ngcontent-%COMP%] {\n background: var(--mj-status-error);\n color: var(--mj-text-inverse);\n border-color: var(--mj-status-error);\n }\n\n @media (max-width: 767px) {\n .mj-dialog-container[_ngcontent-%COMP%] {\n width: 100vw !important;\n height: 100vh !important;\n max-width: 100vw;\n max-height: 100vh;\n border-radius: 0;\n }\n }"] });
|
|
118
|
+
} }, styles: [".mj-dialog-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n top: 0; left: 0; right: 0; bottom: 0;\n background: var(--mj-bg-overlay);\n z-index: 10001;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .mj-dialog-container[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-lg);\n box-shadow: var(--mj-shadow-xl, 0 20px 60px color-mix(in srgb, var(--mj-text-primary) 30%, transparent));\n display: flex;\n flex-direction: column;\n max-height: 90vh;\n max-width: 90vw;\n overflow: hidden;\n }\n\n .mj-dialog-titlebar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 20px;\n border-bottom: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-card);\n }\n\n .mj-dialog-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 1.1rem;\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-close[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n border: none;\n background: none;\n cursor: pointer;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-sm);\n transition: var(--mj-transition-colors);\n }\n .mj-dialog-close[_ngcontent-%COMP%]:hover {\n background: var(--mj-bg-surface-hover);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-body[_ngcontent-%COMP%] {\n flex: 1;\n \n\n\n\n\n padding: 0;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n min-height: 0;\n }\n\n .mj-dialog-body[_ngcontent-%COMP%] > p[_ngcontent-%COMP%] {\n padding: 20px;\n }\n\n .mj-dialog-body[_ngcontent-%COMP%] > div[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n min-height: 0;\n }\n\n .mj-dialog-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n color: var(--mj-text-primary);\n line-height: 1.5;\n }\n\n .mj-dialog-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 20px;\n border-top: 1px solid var(--mj-border-default);\n }\n\n .mj-btn[_ngcontent-%COMP%] {\n padding: 8px 16px;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm);\n background: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n cursor: pointer;\n font-size: 0.875rem;\n transition: var(--mj-transition-colors);\n }\n .mj-btn[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); }\n .mj-btn--primary[_ngcontent-%COMP%] {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n }\n .mj-btn--primary[_ngcontent-%COMP%]:hover { background: var(--mj-brand-primary-hover); }\n .mj-btn--danger[_ngcontent-%COMP%] {\n background: var(--mj-status-error);\n color: var(--mj-text-inverse);\n border-color: var(--mj-status-error);\n }\n\n @media (max-width: 767px) {\n .mj-dialog-container[_ngcontent-%COMP%] {\n width: 100vw !important;\n height: 100vh !important;\n max-width: 100vw;\n max-height: 100vh;\n border-radius: 0;\n }\n }"] });
|
|
119
119
|
}
|
|
120
120
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJDialogContainerComponent, [{
|
|
121
121
|
type: Component,
|
|
@@ -160,7 +160,7 @@ export class MJDialogContainerComponent {
|
|
|
160
160
|
}
|
|
161
161
|
</div>
|
|
162
162
|
</div>
|
|
163
|
-
`, styles: ["\n .mj-dialog-backdrop {\n position: fixed;\n top: 0; left: 0; right: 0; bottom: 0;\n background: var(--mj-bg-overlay);\n z-index: 10001;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .mj-dialog-container {\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-lg);\n box-shadow: var(--mj-shadow-xl, 0 20px 60px color-mix(in srgb, var(--mj-text-primary) 30%, transparent));\n display: flex;\n flex-direction: column;\n max-height: 90vh;\n max-width: 90vw;\n overflow: hidden;\n }\n\n .mj-dialog-titlebar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 20px;\n border-bottom: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-card);\n }\n\n .mj-dialog-title {\n margin: 0;\n font-size: 1.1rem;\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-close {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n border: none;\n background: none;\n cursor: pointer;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-sm);\n transition: var(--mj-transition-colors);\n }\n .mj-dialog-close:hover {\n background: var(--mj-bg-surface-hover);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-body {\n flex: 1;\n padding: 0;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n min-height: 0;\n }\n\n .mj-dialog-body > p {\n padding: 20px;\n }\n\n .mj-dialog-body > div {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n min-height: 0;\n }\n\n .mj-dialog-body p {\n margin: 0;\n color: var(--mj-text-primary);\n line-height: 1.5;\n }\n\n .mj-dialog-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 20px;\n border-top: 1px solid var(--mj-border-default);\n }\n\n .mj-btn {\n padding: 8px 16px;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm);\n background: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n cursor: pointer;\n font-size: 0.875rem;\n transition: var(--mj-transition-colors);\n }\n .mj-btn:hover { background: var(--mj-bg-surface-hover); }\n .mj-btn--primary {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n }\n .mj-btn--primary:hover { background: var(--mj-brand-primary-hover); }\n .mj-btn--danger {\n background: var(--mj-status-error);\n color: var(--mj-text-inverse);\n border-color: var(--mj-status-error);\n }\n\n @media (max-width: 767px) {\n .mj-dialog-container {\n width: 100vw !important;\n height: 100vh !important;\n max-width: 100vw;\n max-height: 100vh;\n border-radius: 0;\n }\n }\n "] }]
|
|
163
|
+
`, styles: ["\n .mj-dialog-backdrop {\n position: fixed;\n top: 0; left: 0; right: 0; bottom: 0;\n background: var(--mj-bg-overlay);\n z-index: 10001;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .mj-dialog-container {\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-lg);\n box-shadow: var(--mj-shadow-xl, 0 20px 60px color-mix(in srgb, var(--mj-text-primary) 30%, transparent));\n display: flex;\n flex-direction: column;\n max-height: 90vh;\n max-width: 90vw;\n overflow: hidden;\n }\n\n .mj-dialog-titlebar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 20px;\n border-bottom: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-card);\n }\n\n .mj-dialog-title {\n margin: 0;\n font-size: 1.1rem;\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-close {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n border: none;\n background: none;\n cursor: pointer;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-sm);\n transition: var(--mj-transition-colors);\n }\n .mj-dialog-close:hover {\n background: var(--mj-bg-surface-hover);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-body {\n flex: 1;\n /* CONTRACT: the body pads only STRING content (the \"> p\" rule below). A COMPONENT body arrives with no\n inset and pads itself \u2014 see rating-dialog and input-dialog in ng-conversations, which both apply\n 4px 20px 8px. Padding here would double-pad them and break deliberately full-bleed bodies (About,\n Profile, the action gallery, the sharing centre). If a third component rediscovers this, add a\n padded setting to MJDialogSettings rather than a special case. */\n padding: 0;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n min-height: 0;\n }\n\n .mj-dialog-body > p {\n padding: 20px;\n }\n\n .mj-dialog-body > div {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n min-height: 0;\n }\n\n .mj-dialog-body p {\n margin: 0;\n color: var(--mj-text-primary);\n line-height: 1.5;\n }\n\n .mj-dialog-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 20px;\n border-top: 1px solid var(--mj-border-default);\n }\n\n .mj-btn {\n padding: 8px 16px;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm);\n background: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n cursor: pointer;\n font-size: 0.875rem;\n transition: var(--mj-transition-colors);\n }\n .mj-btn:hover { background: var(--mj-bg-surface-hover); }\n .mj-btn--primary {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n }\n .mj-btn--primary:hover { background: var(--mj-brand-primary-hover); }\n .mj-btn--danger {\n background: var(--mj-status-error);\n color: var(--mj-text-inverse);\n border-color: var(--mj-status-error);\n }\n\n @media (max-width: 767px) {\n .mj-dialog-container {\n width: 100vw !important;\n height: 100vh !important;\n max-width: 100vw;\n max-height: 100vh;\n border-radius: 0;\n }\n }\n "] }]
|
|
164
164
|
}], null, { Title: [{
|
|
165
165
|
type: Input
|
|
166
166
|
}], StringContent: [{
|
|
@@ -178,7 +178,7 @@ export class MJDialogContainerComponent {
|
|
|
178
178
|
}], CloseClicked: [{
|
|
179
179
|
type: Output
|
|
180
180
|
}] }); })();
|
|
181
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJDialogContainerComponent, { className: "MJDialogContainerComponent", filePath: "lib/dialog/dialog.service.ts", lineNumber:
|
|
181
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJDialogContainerComponent, { className: "MJDialogContainerComponent", filePath: "lib/dialog/dialog.service.ts", lineNumber: 252 }); })();
|
|
182
182
|
/**
|
|
183
183
|
* MJDialogService — Programmatic dialog opening. Replaces Kendo `DialogService`.
|
|
184
184
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.service.js","sourceRoot":"","sources":["../../../src/lib/dialog/dialog.service.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Injectable,\n ComponentRef,\n Type,\n ViewContainerRef,\n ApplicationRef,\n Injector,\n createComponent,\n inject\n} from '@angular/core';\nimport { Subject, Observable } from 'rxjs';\n\n/**\n * Result returned when a dialog action button is clicked.\n */\nexport interface MJDialogAction {\n text: string;\n primary?: boolean;\n themeColor?: string;\n}\n\n/**\n * Options for opening a dialog programmatically.\n */\nexport interface MJDialogSettings {\n /** Dialog title */\n title?: string;\n /** Content: either a string message or a Component class */\n content?: string | Type<unknown>;\n /** Action buttons shown in the footer */\n actions?: MJDialogAction[];\n /** Dialog width in pixels */\n width?: number;\n /** Dialog minimum width in pixels */\n minWidth?: number;\n /** Dialog height in pixels */\n height?: number;\n /** ViewContainerRef to attach the dialog to (for proper DI context) */\n appendTo?: ViewContainerRef;\n}\n\n/**\n * Reference to an open dialog. Used to access content instance and subscribe to results.\n */\nexport class MJDialogRef {\n private resultSubject = new Subject<unknown>();\n private containerRef: ComponentRef<MJDialogContainerComponent> | null = null;\n\n /** The content component instance (when content is a Component class) */\n Content: { instance: Record<string, unknown> } | null = null;\n\n /** Observable that emits when the dialog is closed */\n get Result(): Observable<unknown> {\n return this.resultSubject.asObservable();\n }\n\n /** @internal */\n SetContainerRef(ref: ComponentRef<MJDialogContainerComponent>): void {\n this.containerRef = ref;\n }\n\n /** Close the dialog with a result */\n Close(result?: unknown): void {\n this.resultSubject.next(result);\n this.resultSubject.complete();\n this.containerRef?.location.nativeElement.remove();\n this.containerRef?.destroy();\n }\n}\n\n/**\n * Internal container component that wraps dialog content.\n * This is dynamically created by MJDialogService.\n */\nimport { Component, Input, Output, EventEmitter } from '@angular/core';\n\n@Component({\n selector: 'mj-dialog-container-internal',\n standalone: true,\n template: `\n <div class=\"mj-dialog-backdrop\" (click)=\"OnBackdropClick()\">\n <div class=\"mj-dialog-container\"\n [style.width]=\"Width ? Width + 'px' : '450px'\"\n [style.min-width]=\"MinWidth ? MinWidth + 'px' : null\"\n [style.height]=\"Height ? Height + 'px' : null\"\n (click)=\"$event.stopPropagation()\"\n role=\"dialog\"\n aria-modal=\"true\">\n\n @if (Title) {\n <div class=\"mj-dialog-titlebar\">\n <h3 class=\"mj-dialog-title\">{{ Title }}</h3>\n <button class=\"mj-dialog-close\" (click)=\"OnCloseClick()\" aria-label=\"Close\">\n <i class=\"fa-solid fa-times\"></i>\n </button>\n </div>\n }\n\n <div class=\"mj-dialog-body\">\n @if (StringContent) {\n <p>{{ StringContent }}</p>\n }\n <div #contentHost></div>\n </div>\n\n @if (Actions && Actions.length > 0) {\n <div class=\"mj-dialog-actions\">\n @for (action of Actions; track action.text) {\n <button\n class=\"mj-btn\"\n [class.mj-btn--primary]=\"action.primary\"\n [class.mj-btn--danger]=\"action.themeColor === 'error'\"\n (click)=\"OnActionClick(action)\">\n {{ action.text }}\n </button>\n }\n </div>\n }\n </div>\n </div>\n `,\n styles: [`\n .mj-dialog-backdrop {\n position: fixed;\n top: 0; left: 0; right: 0; bottom: 0;\n background: var(--mj-bg-overlay);\n z-index: 10001;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .mj-dialog-container {\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-lg);\n box-shadow: var(--mj-shadow-xl, 0 20px 60px color-mix(in srgb, var(--mj-text-primary) 30%, transparent));\n display: flex;\n flex-direction: column;\n max-height: 90vh;\n max-width: 90vw;\n overflow: hidden;\n }\n\n .mj-dialog-titlebar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 20px;\n border-bottom: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-card);\n }\n\n .mj-dialog-title {\n margin: 0;\n font-size: 1.1rem;\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-close {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n border: none;\n background: none;\n cursor: pointer;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-sm);\n transition: var(--mj-transition-colors);\n }\n .mj-dialog-close:hover {\n background: var(--mj-bg-surface-hover);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-body {\n flex: 1;\n padding: 0;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n min-height: 0;\n }\n\n .mj-dialog-body > p {\n padding: 20px;\n }\n\n .mj-dialog-body > div {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n min-height: 0;\n }\n\n .mj-dialog-body p {\n margin: 0;\n color: var(--mj-text-primary);\n line-height: 1.5;\n }\n\n .mj-dialog-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 20px;\n border-top: 1px solid var(--mj-border-default);\n }\n\n .mj-btn {\n padding: 8px 16px;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm);\n background: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n cursor: pointer;\n font-size: 0.875rem;\n transition: var(--mj-transition-colors);\n }\n .mj-btn:hover { background: var(--mj-bg-surface-hover); }\n .mj-btn--primary {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n }\n .mj-btn--primary:hover { background: var(--mj-brand-primary-hover); }\n .mj-btn--danger {\n background: var(--mj-status-error);\n color: var(--mj-text-inverse);\n border-color: var(--mj-status-error);\n }\n\n @media (max-width: 767px) {\n .mj-dialog-container {\n width: 100vw !important;\n height: 100vh !important;\n max-width: 100vw;\n max-height: 100vh;\n border-radius: 0;\n }\n }\n `]\n})\nexport class MJDialogContainerComponent {\n @Input() Title = '';\n @Input() StringContent = '';\n @Input() Width: number | null = null;\n @Input() MinWidth: number | null = null;\n @Input() Height: number | null = null;\n @Input() Actions: MJDialogAction[] = [];\n @Output() ActionClicked = new EventEmitter<MJDialogAction>();\n @Output() CloseClicked = new EventEmitter<void>();\n\n OnBackdropClick(): void {\n this.CloseClicked.emit();\n }\n\n OnCloseClick(): void {\n this.CloseClicked.emit();\n }\n\n OnActionClick(action: MJDialogAction): void {\n this.ActionClicked.emit(action);\n }\n}\n\n/**\n * MJDialogService — Programmatic dialog opening. Replaces Kendo `DialogService`.\n *\n * @example\n * ```typescript\n * // Simple confirm\n * const dialogRef = this.dialogService.Open({\n * title: 'Confirm',\n * content: 'Are you sure?',\n * actions: [\n * { text: 'OK', primary: true },\n * { text: 'Cancel' }\n * ]\n * });\n * dialogRef.Result.subscribe(result => { ... });\n *\n * // Component content\n * const dialogRef = this.dialogService.Open({\n * content: MyDialogComponent,\n * width: 500\n * });\n * dialogRef.Content.instance.someInput = 'value';\n * dialogRef.Result.subscribe(result => { ... });\n * ```\n */\n@Injectable({ providedIn: 'root' })\nexport class MJDialogService {\n private appRef = inject(ApplicationRef);\n private injector = inject(Injector);\n\n /**\n * Open a dialog programmatically.\n *\n * Kendo-compatible API: accepts `content` as string or Component class,\n * returns a ref with `.Content.instance` and `.Result` observable.\n */\n Open(settings: MJDialogSettings): MJDialogRef {\n const dialogRef = new MJDialogRef();\n const injector = settings.appendTo?.injector ?? this.injector;\n\n const containerRef = this.createContainer(injector);\n this.configureContainer(containerRef, settings, dialogRef);\n this.attachToDOM(containerRef, settings);\n this.attachContentComponent(containerRef, settings, dialogRef, injector);\n\n containerRef.changeDetectorRef.detectChanges();\n return dialogRef;\n }\n\n private createContainer(injector: Injector): ComponentRef<MJDialogContainerComponent> {\n return createComponent(MJDialogContainerComponent, {\n environmentInjector: this.appRef.injector,\n elementInjector: injector\n });\n }\n\n private configureContainer(\n containerRef: ComponentRef<MJDialogContainerComponent>,\n settings: MJDialogSettings,\n dialogRef: MJDialogRef\n ): void {\n containerRef.instance.Title = settings.title ?? '';\n containerRef.instance.Width = settings.width ?? null;\n containerRef.instance.MinWidth = settings.minWidth ?? null;\n containerRef.instance.Height = settings.height ?? null;\n containerRef.instance.Actions = settings.actions ?? [];\n\n if (typeof settings.content === 'string') {\n containerRef.instance.StringContent = settings.content;\n }\n\n containerRef.instance.CloseClicked.subscribe(() => dialogRef.Close(undefined));\n containerRef.instance.ActionClicked.subscribe((action: MJDialogAction) => dialogRef.Close(action));\n dialogRef.SetContainerRef(containerRef);\n }\n\n private attachToDOM(containerRef: ComponentRef<MJDialogContainerComponent>, settings: MJDialogSettings): void {\n if (settings.appendTo) {\n settings.appendTo.insert(containerRef.hostView);\n } else {\n document.body.appendChild(containerRef.location.nativeElement);\n this.appRef.attachView(containerRef.hostView);\n }\n }\n\n private attachContentComponent(\n containerRef: ComponentRef<MJDialogContainerComponent>,\n settings: MJDialogSettings,\n dialogRef: MJDialogRef,\n injector: Injector\n ): void {\n if (!settings.content || typeof settings.content === 'string') return;\n\n const contentHost = containerRef.location.nativeElement.querySelector('.mj-dialog-body div');\n if (!contentHost) return;\n\n const contentRef = createComponent(settings.content as Type<unknown>, {\n environmentInjector: this.appRef.injector,\n elementInjector: injector,\n hostElement: contentHost\n });\n this.appRef.attachView(contentRef.hostView);\n dialogRef.Content = { instance: contentRef.instance as Record<string, unknown> };\n }\n\n /**\n * Kendo-compatible alias — lowercase `open` for easier migration.\n */\n open(settings: MJDialogSettings): MJDialogRef {\n return this.Open(settings);\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"dialog.service.js","sourceRoot":"","sources":["../../../src/lib/dialog/dialog.service.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Injectable,\n ComponentRef,\n Type,\n ViewContainerRef,\n ApplicationRef,\n Injector,\n createComponent,\n inject\n} from '@angular/core';\nimport { Subject, Observable } from 'rxjs';\n\n/**\n * Result returned when a dialog action button is clicked.\n */\nexport interface MJDialogAction {\n text: string;\n primary?: boolean;\n themeColor?: string;\n}\n\n/**\n * Options for opening a dialog programmatically.\n */\nexport interface MJDialogSettings {\n /** Dialog title */\n title?: string;\n /** Content: either a string message or a Component class */\n content?: string | Type<unknown>;\n /** Action buttons shown in the footer */\n actions?: MJDialogAction[];\n /** Dialog width in pixels */\n width?: number;\n /** Dialog minimum width in pixels */\n minWidth?: number;\n /** Dialog height in pixels */\n height?: number;\n /** ViewContainerRef to attach the dialog to (for proper DI context) */\n appendTo?: ViewContainerRef;\n}\n\n/**\n * Reference to an open dialog. Used to access content instance and subscribe to results.\n */\nexport class MJDialogRef {\n private resultSubject = new Subject<unknown>();\n private containerRef: ComponentRef<MJDialogContainerComponent> | null = null;\n\n /** The content component instance (when content is a Component class) */\n Content: { instance: Record<string, unknown> } | null = null;\n\n /** Observable that emits when the dialog is closed */\n get Result(): Observable<unknown> {\n return this.resultSubject.asObservable();\n }\n\n /** @internal */\n SetContainerRef(ref: ComponentRef<MJDialogContainerComponent>): void {\n this.containerRef = ref;\n }\n\n /** Close the dialog with a result */\n Close(result?: unknown): void {\n this.resultSubject.next(result);\n this.resultSubject.complete();\n this.containerRef?.location.nativeElement.remove();\n this.containerRef?.destroy();\n }\n}\n\n/**\n * Internal container component that wraps dialog content.\n * This is dynamically created by MJDialogService.\n */\nimport { Component, Input, Output, EventEmitter } from '@angular/core';\n\n@Component({\n selector: 'mj-dialog-container-internal',\n standalone: true,\n template: `\n <div class=\"mj-dialog-backdrop\" (click)=\"OnBackdropClick()\">\n <div class=\"mj-dialog-container\"\n [style.width]=\"Width ? Width + 'px' : '450px'\"\n [style.min-width]=\"MinWidth ? MinWidth + 'px' : null\"\n [style.height]=\"Height ? Height + 'px' : null\"\n (click)=\"$event.stopPropagation()\"\n role=\"dialog\"\n aria-modal=\"true\">\n\n @if (Title) {\n <div class=\"mj-dialog-titlebar\">\n <h3 class=\"mj-dialog-title\">{{ Title }}</h3>\n <button class=\"mj-dialog-close\" (click)=\"OnCloseClick()\" aria-label=\"Close\">\n <i class=\"fa-solid fa-times\"></i>\n </button>\n </div>\n }\n\n <div class=\"mj-dialog-body\">\n @if (StringContent) {\n <p>{{ StringContent }}</p>\n }\n <div #contentHost></div>\n </div>\n\n @if (Actions && Actions.length > 0) {\n <div class=\"mj-dialog-actions\">\n @for (action of Actions; track action.text) {\n <button\n class=\"mj-btn\"\n [class.mj-btn--primary]=\"action.primary\"\n [class.mj-btn--danger]=\"action.themeColor === 'error'\"\n (click)=\"OnActionClick(action)\">\n {{ action.text }}\n </button>\n }\n </div>\n }\n </div>\n </div>\n `,\n styles: [`\n .mj-dialog-backdrop {\n position: fixed;\n top: 0; left: 0; right: 0; bottom: 0;\n background: var(--mj-bg-overlay);\n z-index: 10001;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .mj-dialog-container {\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-lg);\n box-shadow: var(--mj-shadow-xl, 0 20px 60px color-mix(in srgb, var(--mj-text-primary) 30%, transparent));\n display: flex;\n flex-direction: column;\n max-height: 90vh;\n max-width: 90vw;\n overflow: hidden;\n }\n\n .mj-dialog-titlebar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 20px;\n border-bottom: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-card);\n }\n\n .mj-dialog-title {\n margin: 0;\n font-size: 1.1rem;\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-close {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n border: none;\n background: none;\n cursor: pointer;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-sm);\n transition: var(--mj-transition-colors);\n }\n .mj-dialog-close:hover {\n background: var(--mj-bg-surface-hover);\n color: var(--mj-text-primary);\n }\n\n .mj-dialog-body {\n flex: 1;\n /* CONTRACT: the body pads only STRING content (the \"> p\" rule below). A COMPONENT body arrives with no\n inset and pads itself — see rating-dialog and input-dialog in ng-conversations, which both apply\n 4px 20px 8px. Padding here would double-pad them and break deliberately full-bleed bodies (About,\n Profile, the action gallery, the sharing centre). If a third component rediscovers this, add a\n padded setting to MJDialogSettings rather than a special case. */\n padding: 0;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n min-height: 0;\n }\n\n .mj-dialog-body > p {\n padding: 20px;\n }\n\n .mj-dialog-body > div {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n min-height: 0;\n }\n\n .mj-dialog-body p {\n margin: 0;\n color: var(--mj-text-primary);\n line-height: 1.5;\n }\n\n .mj-dialog-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 20px;\n border-top: 1px solid var(--mj-border-default);\n }\n\n .mj-btn {\n padding: 8px 16px;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm);\n background: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n cursor: pointer;\n font-size: 0.875rem;\n transition: var(--mj-transition-colors);\n }\n .mj-btn:hover { background: var(--mj-bg-surface-hover); }\n .mj-btn--primary {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n }\n .mj-btn--primary:hover { background: var(--mj-brand-primary-hover); }\n .mj-btn--danger {\n background: var(--mj-status-error);\n color: var(--mj-text-inverse);\n border-color: var(--mj-status-error);\n }\n\n @media (max-width: 767px) {\n .mj-dialog-container {\n width: 100vw !important;\n height: 100vh !important;\n max-width: 100vw;\n max-height: 100vh;\n border-radius: 0;\n }\n }\n `]\n})\nexport class MJDialogContainerComponent {\n @Input() Title = '';\n @Input() StringContent = '';\n @Input() Width: number | null = null;\n @Input() MinWidth: number | null = null;\n @Input() Height: number | null = null;\n @Input() Actions: MJDialogAction[] = [];\n @Output() ActionClicked = new EventEmitter<MJDialogAction>();\n @Output() CloseClicked = new EventEmitter<void>();\n\n OnBackdropClick(): void {\n this.CloseClicked.emit();\n }\n\n OnCloseClick(): void {\n this.CloseClicked.emit();\n }\n\n OnActionClick(action: MJDialogAction): void {\n this.ActionClicked.emit(action);\n }\n}\n\n/**\n * MJDialogService — Programmatic dialog opening. Replaces Kendo `DialogService`.\n *\n * @example\n * ```typescript\n * // Simple confirm\n * const dialogRef = this.dialogService.Open({\n * title: 'Confirm',\n * content: 'Are you sure?',\n * actions: [\n * { text: 'OK', primary: true },\n * { text: 'Cancel' }\n * ]\n * });\n * dialogRef.Result.subscribe(result => { ... });\n *\n * // Component content\n * const dialogRef = this.dialogService.Open({\n * content: MyDialogComponent,\n * width: 500\n * });\n * dialogRef.Content.instance.someInput = 'value';\n * dialogRef.Result.subscribe(result => { ... });\n * ```\n */\n@Injectable({ providedIn: 'root' })\nexport class MJDialogService {\n private appRef = inject(ApplicationRef);\n private injector = inject(Injector);\n\n /**\n * Open a dialog programmatically.\n *\n * Kendo-compatible API: accepts `content` as string or Component class,\n * returns a ref with `.Content.instance` and `.Result` observable.\n */\n Open(settings: MJDialogSettings): MJDialogRef {\n const dialogRef = new MJDialogRef();\n const injector = settings.appendTo?.injector ?? this.injector;\n\n const containerRef = this.createContainer(injector);\n this.configureContainer(containerRef, settings, dialogRef);\n this.attachToDOM(containerRef, settings);\n this.attachContentComponent(containerRef, settings, dialogRef, injector);\n\n containerRef.changeDetectorRef.detectChanges();\n return dialogRef;\n }\n\n private createContainer(injector: Injector): ComponentRef<MJDialogContainerComponent> {\n return createComponent(MJDialogContainerComponent, {\n environmentInjector: this.appRef.injector,\n elementInjector: injector\n });\n }\n\n private configureContainer(\n containerRef: ComponentRef<MJDialogContainerComponent>,\n settings: MJDialogSettings,\n dialogRef: MJDialogRef\n ): void {\n containerRef.instance.Title = settings.title ?? '';\n containerRef.instance.Width = settings.width ?? null;\n containerRef.instance.MinWidth = settings.minWidth ?? null;\n containerRef.instance.Height = settings.height ?? null;\n containerRef.instance.Actions = settings.actions ?? [];\n\n if (typeof settings.content === 'string') {\n containerRef.instance.StringContent = settings.content;\n }\n\n containerRef.instance.CloseClicked.subscribe(() => dialogRef.Close(undefined));\n containerRef.instance.ActionClicked.subscribe((action: MJDialogAction) => dialogRef.Close(action));\n dialogRef.SetContainerRef(containerRef);\n }\n\n private attachToDOM(containerRef: ComponentRef<MJDialogContainerComponent>, settings: MJDialogSettings): void {\n if (settings.appendTo) {\n settings.appendTo.insert(containerRef.hostView);\n } else {\n document.body.appendChild(containerRef.location.nativeElement);\n this.appRef.attachView(containerRef.hostView);\n }\n }\n\n private attachContentComponent(\n containerRef: ComponentRef<MJDialogContainerComponent>,\n settings: MJDialogSettings,\n dialogRef: MJDialogRef,\n injector: Injector\n ): void {\n if (!settings.content || typeof settings.content === 'string') return;\n\n const contentHost = containerRef.location.nativeElement.querySelector('.mj-dialog-body div');\n if (!contentHost) return;\n\n const contentRef = createComponent(settings.content as Type<unknown>, {\n environmentInjector: this.appRef.injector,\n elementInjector: injector,\n hostElement: contentHost\n });\n this.appRef.attachView(contentRef.hostView);\n dialogRef.Content = { instance: contentRef.instance as Record<string, unknown> };\n }\n\n /**\n * Kendo-compatible alias — lowercase `open` for easier migration.\n */\n open(settings: MJDialogSettings): MJDialogRef {\n return this.Open(settings);\n }\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@memberjunction/ng-ui-components",
|
|
3
|
-
"version": "6.1.0
|
|
3
|
+
"version": "6.1.0",
|
|
4
4
|
"description": "MemberJunction: Angular UI Components - reusable standalone components replacing Kendo UI dependencies.",
|
|
5
5
|
"main": "./dist/public-api.js",
|
|
6
6
|
"typings": "./dist/public-api.d.ts",
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
"devDependencies": {
|
|
17
17
|
"@angular/compiler": "21.2.22",
|
|
18
18
|
"@angular/compiler-cli": "21.2.22",
|
|
19
|
-
"@memberjunction/ng-test-utils": "6.1.0
|
|
19
|
+
"@memberjunction/ng-test-utils": "6.1.0",
|
|
20
20
|
"vitest": "^4.0.18"
|
|
21
21
|
},
|
|
22
22
|
"peerDependencies": {
|