@eric-emg/symphiq-components 1.2.12 → 1.2.14
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 +7 -3
- package/fesm2022/symphiq-components.mjs +353 -351
- package/fesm2022/symphiq-components.mjs.map +1 -1
- package/index.d.ts +4 -3
- package/index.d.ts.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -50,6 +50,7 @@ export class AppComponent {
|
|
|
50
50
|
| `viewMode` | `ViewModeEnum` | `LIGHT` | Theme mode (LIGHT or DARK) |
|
|
51
51
|
| `requestedByUser` | `UserInterface` | `undefined` | Optional user context |
|
|
52
52
|
| `embedded` | `boolean` | `false` | Enable embedded mode for use within existing page layouts |
|
|
53
|
+
| `scrollContainerId` | `string` | `undefined` | ID of the external scroll container element (only used when `embedded` is true) |
|
|
53
54
|
|
|
54
55
|
### Embedded Mode
|
|
55
56
|
|
|
@@ -62,10 +63,11 @@ When using the dashboard within an existing page that has its own header, toolba
|
|
|
62
63
|
<div class="my-page-header">
|
|
63
64
|
<!-- Your existing header -->
|
|
64
65
|
</div>
|
|
65
|
-
<div class="my-page-content" style="overflow-y: auto; height: calc(100vh - 64px);">
|
|
66
|
+
<div id="mainContentArea" class="my-page-content" style="overflow-y: auto; height: calc(100vh - 64px);">
|
|
66
67
|
<symphiq-funnel-analysis-dashboard
|
|
67
68
|
[funnelAnalysis]="data"
|
|
68
|
-
[embedded]="true"
|
|
69
|
+
[embedded]="true"
|
|
70
|
+
[scrollContainerId]="'mainContentArea'">
|
|
69
71
|
</symphiq-funnel-analysis-dashboard>
|
|
70
72
|
</div>
|
|
71
73
|
`
|
|
@@ -75,9 +77,11 @@ When using the dashboard within an existing page that has its own header, toolba
|
|
|
75
77
|
Embedded mode:
|
|
76
78
|
- Disables the fixed scroll progress bar at the top of the viewport
|
|
77
79
|
- Disables the full-page animated background bubbles
|
|
78
|
-
- Listens to scroll events on the
|
|
80
|
+
- Listens to scroll events on the specified container (via `scrollContainerId`) instead of the internal dashboard container
|
|
79
81
|
- Uses absolute positioning for backgrounds instead of fixed positioning
|
|
80
82
|
|
|
83
|
+
**Note:** When `embedded` is `true` and you have a custom scrolling container outside the dashboard component, you should provide the `scrollContainerId` input with the ID of that container element. If `scrollContainerId` is not provided, the component will fall back to using its internal container for scroll tracking.
|
|
84
|
+
|
|
81
85
|
### Preview Component
|
|
82
86
|
|
|
83
87
|
The library includes a compact preview component for displaying funnel analysis summaries:
|