@mercurjs/docs 2.3.6-canary.8 → 2.3.6-canary.9
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.
|
@@ -70,6 +70,7 @@ finds it at build time. There is no manifest to edit and no route to register.
|
|
|
70
70
|
| ------ | -------------------------------- | ----------------------------------------------------------------------- |
|
|
71
71
|
| `zone` | `WidgetZoneId \| WidgetZoneId[]` | The zone or zones to render in. Multiple widgets in one zone stack in registration order. |
|
|
72
72
|
| `id` | `string` (optional) | A stable id. Derived from the file path at build time when omitted. |
|
|
73
|
+
| `label` | `string` (optional) | The tab label, as an i18n key or a literal. Only used by [tab zones](#tabs). |
|
|
73
74
|
|
|
74
75
|
## Component props
|
|
75
76
|
|
|
@@ -93,6 +94,40 @@ const ProductDetailNote = ({ data }: { data?: HttpTypes.AdminProduct }) => (
|
|
|
93
94
|
authentication and receive no `data`.
|
|
94
95
|
</Note>
|
|
95
96
|
|
|
97
|
+
## Tabs
|
|
98
|
+
|
|
99
|
+
Some detail pages group their content into tabs. A tab zone lets a widget add a
|
|
100
|
+
tab of its own: the widget's `label` names the tab and its component renders as
|
|
101
|
+
the tab's panel. The placement decides whether the tab sits before or after the
|
|
102
|
+
built-in ones.
|
|
103
|
+
|
|
104
|
+
```tsx apps/admin-test/src/widgets/store-loyalty-tab.tsx
|
|
105
|
+
import { defineWidgetConfig } from "@mercurjs/dashboard-sdk"
|
|
106
|
+
import { Container, Heading } from "@medusajs/ui"
|
|
107
|
+
import type { SellerDTO } from "@mercurjs/types"
|
|
108
|
+
|
|
109
|
+
const StoreLoyaltyTab = ({ data }: { data?: SellerDTO }) => (
|
|
110
|
+
<Container>
|
|
111
|
+
<Heading level="h2">Loyalty for {data?.name}</Heading>
|
|
112
|
+
</Container>
|
|
113
|
+
)
|
|
114
|
+
|
|
115
|
+
export const config = defineWidgetConfig({
|
|
116
|
+
zone: "stores.detail.tabs.after",
|
|
117
|
+
id: "loyalty",
|
|
118
|
+
label: "Loyalty",
|
|
119
|
+
})
|
|
120
|
+
|
|
121
|
+
export default StoreLoyaltyTab
|
|
122
|
+
```
|
|
123
|
+
|
|
124
|
+
A widget that targets a tab zone without a `label` is not shown. `permission`
|
|
125
|
+
works as on any other widget and hides the tab from actors who lack it.
|
|
126
|
+
|
|
127
|
+
| Panel | Tab zone | Page |
|
|
128
|
+
| ----- | ------------------- | ------------------------------------------------------- |
|
|
129
|
+
| Admin | `stores.detail.tabs` | Store detail, next to Orders, Offers, Users and Time off. |
|
|
130
|
+
|
|
96
131
|
## Zone ids
|
|
97
132
|
|
|
98
133
|
A zone id reads `<domain>.<view>.<placement>`.
|