@flexzap/overlay 1.1.0 → 1.2.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/README.md +35 -0
- package/fesm2022/flexzap-overlay.mjs +34 -8
- package/fesm2022/flexzap-overlay.mjs.map +1 -1
- package/package.json +5 -4
- package/types/flexzap-overlay.d.ts +12 -1
package/README.md
CHANGED
|
@@ -77,6 +77,41 @@ A helper directive that binds hover events (`mouseenter`, `mouseleave`) to toggl
|
|
|
77
77
|
|
|
78
78
|
**Selector:** `[ZapTooltipBind]`
|
|
79
79
|
|
|
80
|
+
### ZapModalShell Component
|
|
81
|
+
|
|
82
|
+
A modal shell component that displays content over a backdrop. It handles closing interactions (Escape key, close button, backdrop click) by emitting a `close` event, allowing the parent to control visibility state.
|
|
83
|
+
|
|
84
|
+
#### Inputs
|
|
85
|
+
|
|
86
|
+
| Property | Type | Default | Description |
|
|
87
|
+
| --------- | --------- | ------------ | ------------------------------------------ |
|
|
88
|
+
| `visible` | `boolean` | **Required** | Controls the visibility of the modal shell |
|
|
89
|
+
|
|
90
|
+
#### Outputs
|
|
91
|
+
|
|
92
|
+
| Property | Type | Description |
|
|
93
|
+
| -------- | ------ | ------------------------------------------------------------------------------------ |
|
|
94
|
+
| `close` | `void` | Emits when the modal requests to close (e.g. Escape key, close icon, backdrop click) |
|
|
95
|
+
|
|
96
|
+
#### Example Usage
|
|
97
|
+
|
|
98
|
+
```typescript
|
|
99
|
+
@Component({
|
|
100
|
+
imports: [ZapModalShell, ZapButton],
|
|
101
|
+
template: `
|
|
102
|
+
<zap-button (clicked)="showModal.set(true)">Open Modal</zap-button>
|
|
103
|
+
|
|
104
|
+
<zap-modal-shell [visible]="showModal()" (close)="showModal.set(false)">
|
|
105
|
+
<h2>My Modal</h2>
|
|
106
|
+
<p>Content goes here.</p>
|
|
107
|
+
</zap-modal-shell>
|
|
108
|
+
`
|
|
109
|
+
})
|
|
110
|
+
export class MyComponent {
|
|
111
|
+
showModal = signal(false);
|
|
112
|
+
}
|
|
113
|
+
```
|
|
114
|
+
|
|
80
115
|
## Styling
|
|
81
116
|
|
|
82
117
|
The component uses SCSS for styling. You can customize the appearance by overriding the default styles:
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, ChangeDetectionStrategy, Component, inject, ElementRef, Renderer2, Directive } from '@angular/core';
|
|
2
|
+
import { input, ChangeDetectionStrategy, Component, inject, ElementRef, Renderer2, Directive, output } from '@angular/core';
|
|
3
|
+
import { ZapSvgConfig, ZapSvg } from '@flexzap/symbols';
|
|
3
4
|
|
|
4
5
|
class ZapTooltip {
|
|
5
6
|
position = input.required(...(ngDevMode ? [{ debugName: "position" }] : []));
|
|
6
7
|
visible = input(false, ...(ngDevMode ? [{ debugName: "visible" }] : []));
|
|
7
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
8
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
8
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ZapTooltip, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: ZapTooltip, isStandalone: true, selector: "zap-tooltip", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: true, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.zap-position": "position()", "attr.zap-visible": "visible()" } }, ngImport: i0, template: "<div class=\"zap-tooltip\">\n <ng-content></ng-content>\n</div>\n", styles: [":host{width:max-content;display:none}:host[zap-visible=true]{display:table}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9
10
|
}
|
|
10
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
11
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ZapTooltip, decorators: [{
|
|
11
12
|
type: Component,
|
|
12
13
|
args: [{ selector: 'zap-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
13
14
|
'[attr.zap-position]': 'position()',
|
|
@@ -52,10 +53,10 @@ class ZapTooltipBind {
|
|
|
52
53
|
updateSibling(sibling, show) {
|
|
53
54
|
this.renderer.setAttribute(sibling, 'zap-visible', String(show));
|
|
54
55
|
}
|
|
55
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
56
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
56
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ZapTooltipBind, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
57
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: ZapTooltipBind, isStandalone: true, selector: "[ZapTooltipBind]", host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" } }, ngImport: i0 });
|
|
57
58
|
}
|
|
58
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ZapTooltipBind, decorators: [{
|
|
59
60
|
type: Directive,
|
|
60
61
|
args: [{
|
|
61
62
|
selector: '[ZapTooltipBind]',
|
|
@@ -66,6 +67,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
66
67
|
}]
|
|
67
68
|
}] });
|
|
68
69
|
|
|
70
|
+
class ZapModalShell {
|
|
71
|
+
visible = input.required(...(ngDevMode ? [{ debugName: "visible" }] : []));
|
|
72
|
+
close = output();
|
|
73
|
+
svgConfigIcon = ZapSvgConfig.createIcon();
|
|
74
|
+
closeModal() {
|
|
75
|
+
this.close.emit();
|
|
76
|
+
}
|
|
77
|
+
onKeyDown(e) {
|
|
78
|
+
const event = e;
|
|
79
|
+
if (event.key === 'Escape') {
|
|
80
|
+
event.preventDefault();
|
|
81
|
+
this.close.emit();
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ZapModalShell, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
85
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: ZapModalShell, isStandalone: true, selector: "zap-modal-shell", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { close: "close" }, host: { listeners: { "window:keydown.escape": "onKeyDown($event)" }, properties: { "attr.zap-visible": "visible()" } }, ngImport: i0, template: "<section class=\"zap-modal-shell\" (click)=\"closeModal()\">\n <div (click)=\"$event.stopPropagation()\">\n <button type=\"button\" (click)=\"closeModal()\">\n <zap-svg [name]=\"'close'\" [config]=\"svgConfigIcon\"></zap-svg>\n </button>\n <div>\n <ng-content></ng-content>\n </div>\n </div>\n</section>\n", styles: [":host{display:none}:host[zap-visible=true]{display:block}\n"], dependencies: [{ kind: "component", type: ZapSvg, selector: "zap-svg", inputs: ["name", "config"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
86
|
+
}
|
|
87
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ZapModalShell, decorators: [{
|
|
88
|
+
type: Component,
|
|
89
|
+
args: [{ selector: 'zap-modal-shell', imports: [ZapSvg], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
90
|
+
'[attr.zap-visible]': 'visible()',
|
|
91
|
+
'(window:keydown.escape)': 'onKeyDown($event)'
|
|
92
|
+
}, template: "<section class=\"zap-modal-shell\" (click)=\"closeModal()\">\n <div (click)=\"$event.stopPropagation()\">\n <button type=\"button\" (click)=\"closeModal()\">\n <zap-svg [name]=\"'close'\" [config]=\"svgConfigIcon\"></zap-svg>\n </button>\n <div>\n <ng-content></ng-content>\n </div>\n </div>\n</section>\n", styles: [":host{display:none}:host[zap-visible=true]{display:block}\n"] }]
|
|
93
|
+
}], propDecorators: { visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: true }] }], close: [{ type: i0.Output, args: ["close"] }] } });
|
|
94
|
+
|
|
69
95
|
/*
|
|
70
96
|
* Public API Surface of overlay
|
|
71
97
|
*/
|
|
@@ -74,5 +100,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
74
100
|
* Generated bundle index. Do not edit.
|
|
75
101
|
*/
|
|
76
102
|
|
|
77
|
-
export { ZapTooltip, ZapTooltipBind };
|
|
103
|
+
export { ZapModalShell, ZapTooltip, ZapTooltipBind };
|
|
78
104
|
//# sourceMappingURL=flexzap-overlay.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flexzap-overlay.mjs","sources":["../../../../projects/flexzap/overlay/src/lib/tooltip/tooltip.ts","../../../../projects/flexzap/overlay/src/lib/tooltip/tooltip.html","../../../../projects/flexzap/overlay/src/lib/tooltip-bind/tooltip-bind.ts","../../../../projects/flexzap/overlay/src/public-api.ts","../../../../projects/flexzap/overlay/src/flexzap-overlay.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input } from '@angular/core';\n\n@Component({\n selector: 'zap-tooltip',\n templateUrl: './tooltip.html',\n styleUrl: './tooltip.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n '[attr.zap-position]': 'position()',\n '[attr.zap-visible]': 'visible()'\n }\n})\nexport class ZapTooltip {\n position = input.required<'top' | 'right' | 'bottom' | 'left'>();\n visible = input(false);\n}\n","<div class=\"zap-tooltip\">\n <ng-content></ng-content>\n</div>\n","import { Directive, ElementRef, Renderer2, inject } from '@angular/core';\n\n@Directive({\n selector: '[ZapTooltipBind]',\n host: {\n '(mouseenter)': 'onMouseEnter()',\n '(mouseleave)': 'onMouseLeave()'\n }\n})\n/**\n * Directive that binds the visibility of a sibling `zap-tooltip` to the host element's hover events.\n *\n * It listens for `mouseenter` and `mouseleave` events on the host element and toggles the `zap-visible`\n * attribute of the immediate previous or next sibling if it matches the `zap-tooltip` tag.\n *\n * @usageNotes\n * Apply this directive to any element that has a `zap-tooltip` sibling.\n *\n * ```html\n * <button ZapTooltipBind>Hover me</button>\n * <zap-tooltip [position]=\"'top'\">I'm a tooltip</zap-tooltip>\n * ```\n */\nexport class ZapTooltipBind {\n private elementRef = inject(ElementRef);\n private renderer = inject(Renderer2);\n\n onMouseEnter() {\n this.toggleTooltip(true);\n }\n\n onMouseLeave() {\n this.toggleTooltip(false);\n }\n\n private toggleTooltip(show: boolean) {\n const element = this.elementRef.nativeElement;\n const nextSibling = element.nextElementSibling;\n const prevSibling = element.previousElementSibling;\n\n if (nextSibling && nextSibling.tagName.toLowerCase() === 'zap-tooltip') {\n this.updateSibling(nextSibling, show);\n }\n\n if (prevSibling && prevSibling.tagName.toLowerCase() === 'zap-tooltip') {\n this.updateSibling(prevSibling, show);\n }\n }\n\n private updateSibling(sibling: Element, show: boolean) {\n this.renderer.setAttribute(sibling, 'zap-visible', String(show));\n }\n}\n","/*\n * Public API Surface of overlay\n */\n\nexport * from './lib/tooltip/tooltip';\nexport * from './lib/tooltip-bind/tooltip-bind';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"flexzap-overlay.mjs","sources":["../../../../projects/flexzap/overlay/src/lib/tooltip/tooltip.ts","../../../../projects/flexzap/overlay/src/lib/tooltip/tooltip.html","../../../../projects/flexzap/overlay/src/lib/tooltip-bind/tooltip-bind.ts","../../../../projects/flexzap/overlay/src/lib/modal-shell/modal-shell.ts","../../../../projects/flexzap/overlay/src/lib/modal-shell/modal-shell.html","../../../../projects/flexzap/overlay/src/public-api.ts","../../../../projects/flexzap/overlay/src/flexzap-overlay.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input } from '@angular/core';\n\n@Component({\n selector: 'zap-tooltip',\n templateUrl: './tooltip.html',\n styleUrl: './tooltip.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n '[attr.zap-position]': 'position()',\n '[attr.zap-visible]': 'visible()'\n }\n})\nexport class ZapTooltip {\n position = input.required<'top' | 'right' | 'bottom' | 'left'>();\n visible = input(false);\n}\n","<div class=\"zap-tooltip\">\n <ng-content></ng-content>\n</div>\n","import { Directive, ElementRef, Renderer2, inject } from '@angular/core';\n\n@Directive({\n selector: '[ZapTooltipBind]',\n host: {\n '(mouseenter)': 'onMouseEnter()',\n '(mouseleave)': 'onMouseLeave()'\n }\n})\n/**\n * Directive that binds the visibility of a sibling `zap-tooltip` to the host element's hover events.\n *\n * It listens for `mouseenter` and `mouseleave` events on the host element and toggles the `zap-visible`\n * attribute of the immediate previous or next sibling if it matches the `zap-tooltip` tag.\n *\n * @usageNotes\n * Apply this directive to any element that has a `zap-tooltip` sibling.\n *\n * ```html\n * <button ZapTooltipBind>Hover me</button>\n * <zap-tooltip [position]=\"'top'\">I'm a tooltip</zap-tooltip>\n * ```\n */\nexport class ZapTooltipBind {\n private elementRef = inject(ElementRef);\n private renderer = inject(Renderer2);\n\n onMouseEnter() {\n this.toggleTooltip(true);\n }\n\n onMouseLeave() {\n this.toggleTooltip(false);\n }\n\n private toggleTooltip(show: boolean) {\n const element = this.elementRef.nativeElement;\n const nextSibling = element.nextElementSibling;\n const prevSibling = element.previousElementSibling;\n\n if (nextSibling && nextSibling.tagName.toLowerCase() === 'zap-tooltip') {\n this.updateSibling(nextSibling, show);\n }\n\n if (prevSibling && prevSibling.tagName.toLowerCase() === 'zap-tooltip') {\n this.updateSibling(prevSibling, show);\n }\n }\n\n private updateSibling(sibling: Element, show: boolean) {\n this.renderer.setAttribute(sibling, 'zap-visible', String(show));\n }\n}\n","import { ChangeDetectionStrategy, Component, input, output } from '@angular/core';\n\nimport { ZapSvg, ZapSvgConfig, ZapSvgInterface } from '@flexzap/symbols';\n\n@Component({\n selector: 'zap-modal-shell',\n imports: [ZapSvg],\n templateUrl: './modal-shell.html',\n styleUrl: './modal-shell.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n '[attr.zap-visible]': 'visible()',\n '(window:keydown.escape)': 'onKeyDown($event)'\n }\n})\nexport class ZapModalShell {\n visible = input.required<boolean>();\n close = output<void>();\n\n svgConfigIcon: ZapSvgInterface = ZapSvgConfig.createIcon();\n\n closeModal() {\n this.close.emit();\n }\n\n onKeyDown(e: Event) {\n const event = e as KeyboardEvent;\n if (event.key === 'Escape') {\n event.preventDefault();\n this.close.emit();\n }\n }\n}\n","<section class=\"zap-modal-shell\" (click)=\"closeModal()\">\n <div (click)=\"$event.stopPropagation()\">\n <button type=\"button\" (click)=\"closeModal()\">\n <zap-svg [name]=\"'close'\" [config]=\"svgConfigIcon\"></zap-svg>\n </button>\n <div>\n <ng-content></ng-content>\n </div>\n </div>\n</section>\n","/*\n * Public API Surface of overlay\n */\n\nexport * from './lib/tooltip/tooltip';\nexport * from './lib/tooltip-bind/tooltip-bind';\nexport * from './lib/modal-shell/modal-shell';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@flexzap/overlay",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"description": "All the overlay components that makes part of the flexzap library",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"flexzap",
|
|
@@ -19,11 +19,12 @@
|
|
|
19
19
|
"access": "public"
|
|
20
20
|
},
|
|
21
21
|
"peerDependencies": {
|
|
22
|
-
"@angular/common": "^21.
|
|
23
|
-
"@angular/core": "^21.
|
|
22
|
+
"@angular/common": "^21.1.0",
|
|
23
|
+
"@angular/core": "^21.1.0"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"tslib": "^2.8.1"
|
|
26
|
+
"tslib": "^2.8.1",
|
|
27
|
+
"@flexzap/symbols": "latest"
|
|
27
28
|
},
|
|
28
29
|
"sideEffects": false,
|
|
29
30
|
"module": "fesm2022/flexzap-overlay.mjs",
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
+
import { ZapSvgInterface } from '@flexzap/symbols';
|
|
2
3
|
|
|
3
4
|
declare class ZapTooltip {
|
|
4
5
|
position: i0.InputSignal<"top" | "right" | "bottom" | "left">;
|
|
@@ -18,4 +19,14 @@ declare class ZapTooltipBind {
|
|
|
18
19
|
static ɵdir: i0.ɵɵDirectiveDeclaration<ZapTooltipBind, "[ZapTooltipBind]", never, {}, {}, never, never, true, never>;
|
|
19
20
|
}
|
|
20
21
|
|
|
21
|
-
|
|
22
|
+
declare class ZapModalShell {
|
|
23
|
+
visible: i0.InputSignal<boolean>;
|
|
24
|
+
close: i0.OutputEmitterRef<void>;
|
|
25
|
+
svgConfigIcon: ZapSvgInterface;
|
|
26
|
+
closeModal(): void;
|
|
27
|
+
onKeyDown(e: Event): void;
|
|
28
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ZapModalShell, never>;
|
|
29
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ZapModalShell, "zap-modal-shell", never, { "visible": { "alias": "visible"; "required": true; "isSignal": true; }; }, { "close": "close"; }, never, ["*"], true, never>;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
export { ZapModalShell, ZapTooltip, ZapTooltipBind };
|