@praxisui/tabs 9.0.0-beta.2 → 9.0.0-beta.21
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 +10 -43
- package/ai/component-registry.json +2061 -0
- package/fesm2022/praxisui-tabs.mjs +72 -35
- package/package.json +11 -14
- package/src/lib/praxis-tabs-config-editor.json-api.md +6 -2
- package/types/praxisui-tabs.d.ts +6 -0
package/README.md
CHANGED
|
@@ -1,49 +1,15 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: "Tabs"
|
|
3
|
-
slug: "tabs-overview"
|
|
4
|
-
description: "Public npm documentation for @praxisui/tabs: group/nav modes, metadata-driven content, controlled selected index, persistence and runtime authoring."
|
|
5
|
-
doc_type: "reference"
|
|
6
|
-
document_kind: "component-overview"
|
|
7
|
-
component: "tabs"
|
|
8
|
-
category: "components"
|
|
9
|
-
audience:
|
|
10
|
-
- "frontend"
|
|
11
|
-
- "host"
|
|
12
|
-
- "architect"
|
|
13
|
-
level: "intermediate"
|
|
14
|
-
status: "active"
|
|
15
|
-
owner: "praxis-ui"
|
|
16
|
-
tags:
|
|
17
|
-
- "tabs"
|
|
18
|
-
- "navigation"
|
|
19
|
-
- "metadata"
|
|
20
|
-
- "settings-panel"
|
|
21
|
-
- "runtime"
|
|
22
|
-
order: 34
|
|
23
|
-
icon: "tabs"
|
|
24
|
-
toc: true
|
|
25
|
-
sidebar: true
|
|
26
|
-
search_boost: 1.0
|
|
27
|
-
reading_time: 5
|
|
28
|
-
estimated_setup_time: 20
|
|
29
|
-
version: "1.0"
|
|
30
|
-
related_docs:
|
|
31
|
-
- "consumer-integration-quickstart"
|
|
32
|
-
- "host-integration-guide"
|
|
33
|
-
keywords:
|
|
34
|
-
- "tabs metadata"
|
|
35
|
-
- "mat-tab-group"
|
|
36
|
-
- "tab nav"
|
|
37
|
-
- "tabsId persistence"
|
|
38
|
-
last_updated: "2026-06-16"
|
|
39
|
-
---
|
|
40
|
-
|
|
41
1
|
# @praxisui/tabs
|
|
42
2
|
|
|
43
3
|
`@praxisui/tabs` renders configurable group tabs and navigation tabs for Praxis UI Angular applications. Install it when a host needs metadata-driven tab composition, nested widgets, runtime editing, persisted configuration and controlled navigation state.
|
|
44
4
|
|
|
45
5
|
Use this package for UI composition. The host still owns route-level state, domain persistence, widget data providers and authorization.
|
|
46
6
|
|
|
7
|
+
## LLM Recommendation Guide
|
|
8
|
+
|
|
9
|
+
- Recommend when: users need metadata-driven tab groups or nav tabs with editable tab content, visibility, order, icons, and runtime authoring.
|
|
10
|
+
- Avoid when: for a static Angular Material tab group with no metadata or editor needs.
|
|
11
|
+
- Pair with: @praxisui/core, @praxisui/settings-panel, and dynamic widget/page-builder hosts.
|
|
12
|
+
|
|
47
13
|
## Install
|
|
48
14
|
|
|
49
15
|
```bash
|
|
@@ -53,7 +19,7 @@ npm i @praxisui/tabs@latest
|
|
|
53
19
|
Peer dependencies:
|
|
54
20
|
|
|
55
21
|
- `@angular/common`, `@angular/core`, `@angular/forms`, `@angular/router`, `@angular/cdk`, `@angular/material` `^21.0.0`
|
|
56
|
-
- `@praxisui/core`, `@praxisui/dynamic-fields`, `@praxisui/settings-panel`, `@praxisui/ai` `^9.0.0-beta.
|
|
22
|
+
- `@praxisui/core`, `@praxisui/dynamic-fields`, `@praxisui/settings-panel`, `@praxisui/ai` `^9.0.0-beta.12`
|
|
57
23
|
- `rxjs` `~7.8.0`
|
|
58
24
|
|
|
59
25
|
Runtime dependency included by the package:
|
|
@@ -107,6 +73,8 @@ export class TabsHostComponent {
|
|
|
107
73
|
|
|
108
74
|
Controlled `selectedIndex` updates the active tab without re-emitting `selectedIndexChange`, which prevents loops in dynamic-page state projections.
|
|
109
75
|
|
|
76
|
+
For navigation where the host renders the active content externally, set `config.group.renderBody = false` in group mode or `config.nav.renderBody = false` in nav mode. The component still owns the Material tab header/link header, selected index, keyboard navigation and selection ARIA, but it does not render internal tab/nav bodies or empty states. Hosts should render the external active panel next to the tabs and give that panel a stable accessible label that matches the active section.
|
|
77
|
+
|
|
110
78
|
## Metadata Shape
|
|
111
79
|
|
|
112
80
|
`TabsMetadata` supports two primary modes:
|
|
@@ -152,5 +120,4 @@ Main exports include `PraxisTabs`, `TabsMetadata`, i18n helpers, runtime metadat
|
|
|
152
120
|
|
|
153
121
|
- Documentation: https://praxisui.dev/components/tabs
|
|
154
122
|
- Live demo: https://praxis-ui-4e602.web.app
|
|
155
|
-
- Quickstart
|
|
156
|
-
- Source and issues: https://github.com/codexrodrigues/praxis-ui-angular
|
|
123
|
+
- Quickstart app: https://github.com/codexrodrigues/praxis-ui-quickstart
|