@ngrok/mantle 0.79.3 → 0.80.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/dist/accordion.d.ts +169 -12
- package/dist/accordion.js +1 -1
- package/dist/agent.json +1 -1
- package/dist/alert-dialog.d.ts +496 -30
- package/dist/alert-dialog.js +1 -1
- package/dist/alert.d.ts +129 -9
- package/dist/alert.js +1 -1
- package/dist/anchor-_2meGDfj.js +1 -0
- package/dist/anchor.d.ts +2 -2
- package/dist/anchor.js +1 -1
- package/dist/as-child-D23mGo4f.d.ts +49 -0
- package/dist/badge.d.ts +44 -5
- package/dist/badge.js +1 -1
- package/dist/breadcrumb.d.ts +214 -14
- package/dist/breadcrumb.js +1 -1
- package/dist/button-5WsvzIQ6.js +1 -0
- package/dist/{button-DcXOWUYo.d.ts → button-BPMwa2jN.d.ts} +3 -3
- package/dist/button-D9n09xUg.js +1 -0
- package/dist/button.d.ts +3 -3
- package/dist/button.js +1 -1
- package/dist/calendar.d.ts +0 -3
- package/dist/calendar.js +1 -1
- package/dist/card.d.ts +146 -9
- package/dist/card.js +1 -1
- package/dist/centered-layout.d.ts +224 -8
- package/dist/centered-layout.js +1 -1
- package/dist/checkbox-Cq17y0-R.js +1 -0
- package/dist/checkbox.d.ts +12 -10
- package/dist/checkbox.js +1 -1
- package/dist/choice-Cc8dA5r8.js +1 -0
- package/dist/choice-Ct0KK8jw.d.ts +269 -0
- package/dist/choice.d.ts +1 -252
- package/dist/choice.js +1 -1
- package/dist/code-block.d.ts +270 -50
- package/dist/code-block.js +6 -6
- package/dist/code.d.ts +3 -2
- package/dist/code.js +1 -1
- package/dist/combobox.d.ts +190 -11
- package/dist/combobox.js +1 -1
- package/dist/command.d.ts +285 -81
- package/dist/command.js +1 -1
- package/dist/compose-refs-BdBMM9ga.js +1 -0
- package/dist/data-table.d.ts +33 -5
- package/dist/data-table.js +1 -1
- package/dist/description-list.d.ts +79 -6
- package/dist/description-list.js +1 -1
- package/dist/dialog-CQ2C6vkE.js +1 -0
- package/dist/dialog.d.ts +239 -18
- package/dist/dialog.js +1 -1
- package/dist/dropdown-menu-CSCDdA3K.js +1 -0
- package/dist/{dropdown-menu-DP_Ne9Mr.d.ts → dropdown-menu-CoyozLzy.d.ts} +170 -29
- package/dist/dropdown-menu.d.ts +2 -2
- package/dist/dropdown-menu.js +1 -1
- package/dist/empty.d.ts +1 -1
- package/dist/empty.js +1 -1
- package/dist/field.d.ts +596 -45
- package/dist/field.js +1 -1
- package/dist/flag.d.ts +0 -3
- package/dist/flag.js +1 -1
- package/dist/hooks.d.ts +3 -4
- package/dist/hooks.js +1 -1
- package/dist/hover-card.d.ts +54 -4
- package/dist/hover-card.js +1 -1
- package/dist/{icon-Cevjo93X.d.ts → icon-BDqpcZ-n.d.ts} +1 -1
- package/dist/icon-CGgMKpJg.js +1 -0
- package/dist/{icon-button-BvQvT790.d.ts → icon-button-C1AfGnQx.d.ts} +6 -60
- package/dist/icon-button-DiOhreJD.js +1 -0
- package/dist/icon.d.ts +2 -2
- package/dist/icon.js +1 -1
- package/dist/icons.d.ts +5 -13
- package/dist/icons.js +1 -1
- package/dist/{in-view-nkSOdED2.d.ts → in-view-DDEGUKDR.d.ts} +17 -9
- package/dist/index-B8mIWKIU.d.ts +211 -0
- package/dist/{index-Rv8RL7xy.d.ts → index-BtwKJTLq.d.ts} +1 -1
- package/dist/{index-BSAizFod.d.ts → index-C2jj8U4a.d.ts} +5 -5
- package/dist/index-CdPXa9h1.d.ts +1 -0
- package/dist/{index-D47aqlpz.d.ts → index-DA4ig3gj.d.ts} +1 -1
- package/dist/input-CVyAVbim.js +1 -0
- package/dist/{types-C19IR7jf.d.ts → input-DV9M6K4v.d.ts} +42 -2
- package/dist/input.d.ts +4 -55
- package/dist/input.js +1 -1
- package/dist/{label-v2-bv98k.d.ts → label-C6YH9skg.d.ts} +8 -6
- package/dist/label-D-D11mlp.js +1 -0
- package/dist/label.d.ts +1 -1
- package/dist/label.js +1 -1
- package/dist/list.d.ts +150 -6
- package/dist/list.js +1 -1
- package/dist/llms.txt +1 -1
- package/dist/main.d.ts +20 -4
- package/dist/main.js +1 -1
- package/dist/media-object.d.ts +27 -4
- package/dist/media-object.js +1 -1
- package/dist/multi-select.d.ts +312 -15
- package/dist/multi-select.js +1 -1
- package/dist/otp-input.d.ts +129 -5
- package/dist/otp-input.js +1 -1
- package/dist/pagination.d.ts +70 -6
- package/dist/pagination.js +1 -1
- package/dist/popover-CBMADtjV.js +1 -0
- package/dist/popover.d.ts +1 -181
- package/dist/popover.js +1 -1
- package/dist/primitive-CJRIlrLz.d.ts +31 -0
- package/dist/primitive-DCPHJsRs.js +1 -0
- package/dist/progress.js +1 -1
- package/dist/qr-code.d.ts +113 -5
- package/dist/qr-code.js +1 -1
- package/dist/radio-group.d.ts +128 -23
- package/dist/radio-group.js +1 -1
- package/dist/sandboxed-on-click.d.ts +2 -2
- package/dist/sandboxed-on-click.js +1 -1
- package/dist/select-SR_9-bxA.js +1 -0
- package/dist/select-idm1jy7y.d.ts +600 -0
- package/dist/select.d.ts +1 -1
- package/dist/select.js +1 -1
- package/dist/selectable-list.d.ts +252 -298
- package/dist/selectable-list.js +1 -1
- package/dist/separator-B5UmkVRL.d.ts +75 -0
- package/dist/separator-bpE_kooz.js +1 -0
- package/dist/separator.d.ts +1 -52
- package/dist/separator.js +1 -1
- package/dist/sheet.d.ts +295 -21
- package/dist/sheet.js +1 -1
- package/dist/skeleton-CsbUHbBA.js +1 -0
- package/dist/skeleton.d.ts +4 -7
- package/dist/skeleton.js +1 -1
- package/dist/skip-to-main-link.d.ts +24 -4
- package/dist/skip-to-main-link.js +1 -1
- package/dist/slot-CDk0Bb9z.js +1 -0
- package/dist/slot.d.ts +1 -1
- package/dist/slot.js +1 -1
- package/dist/{sort-BPX2Fk9t.js → sort-B_DDQcVD.js} +1 -1
- package/dist/split-button.d.ts +28 -13
- package/dist/split-button.js +1 -1
- package/dist/{svg-only-BFeFS1aa.d.ts → svg-only-CdI_v82i.d.ts} +1 -1
- package/dist/svg-only-d-nMCfAI.js +1 -0
- package/dist/switch.d.ts +9 -6
- package/dist/switch.js +1 -1
- package/dist/table-DUSvU_Jw.d.ts +875 -0
- package/dist/table-GDkapNFi.js +1 -0
- package/dist/table.d.ts +1 -1
- package/dist/table.js +1 -1
- package/dist/tabs.d.ts +135 -21
- package/dist/tabs.js +1 -1
- package/dist/text-area.d.ts +1 -1
- package/dist/text-area.js +1 -1
- package/dist/theme-provider-BftkIiZn.js +1 -0
- package/dist/theme-switcher.d.ts +110 -29
- package/dist/theme-switcher.js +1 -1
- package/dist/theme-wVnzzx2F.js +1 -0
- package/dist/theme.d.ts +53 -14
- package/dist/theme.js +1 -1
- package/dist/toast-DKgMRv4F.js +1 -0
- package/dist/toast.d.ts +98 -10
- package/dist/toast.js +1 -1
- package/dist/tooltip.d.ts +28 -1
- package/dist/tooltip.js +1 -1
- package/dist/{traffic-policy-file-0g5RXFqu.js → traffic-policy-file-CF1lbWtp.js} +1 -1
- package/dist/types.d.ts +2 -2
- package/dist/utils.d.ts +1 -1
- package/dist/utils.js +1 -1
- package/dist/virtual-UrzmaSQm.js +1 -0
- package/dist/well.d.ts +3 -3
- package/dist/well.js +1 -1
- package/package.json +3 -3
- package/dist/anchor-C_tjSVy6.js +0 -1
- package/dist/as-child-CYEVu1WY.d.ts +0 -23
- package/dist/button-5t6-JS_I.js +0 -1
- package/dist/button-ClC60Nzg.js +0 -1
- package/dist/checkbox-DJ2xl7Rc.js +0 -1
- package/dist/choice-DOdyNzFC.js +0 -1
- package/dist/compose-refs-Cjf2gfB8.js +0 -1
- package/dist/dialog-vxLIvB8M.js +0 -1
- package/dist/dropdown-menu-Bt1aKF1g.js +0 -1
- package/dist/icon-CDtYjF_H.js +0 -1
- package/dist/icon-button-DV2-GZHf.js +0 -1
- package/dist/index-g2rfwNCH.d.ts +0 -1
- package/dist/input-Ct1YOqSy.js +0 -1
- package/dist/label-BMlHW_2D.js +0 -1
- package/dist/popover-D5WxxnBY.js +0 -1
- package/dist/primitive-C64-m48O.d.ts +0 -13
- package/dist/primitive-IKruV2iB.js +0 -1
- package/dist/select-Bwt2YduR.d.ts +0 -345
- package/dist/select-D-5u0Blc.js +0 -1
- package/dist/separator-kBnnv3Cw.js +0 -1
- package/dist/skeleton-Bu3tgNcW.js +0 -1
- package/dist/slot-DmPrjM7N.js +0 -1
- package/dist/svg-only-DDx6FtJd.js +0 -1
- package/dist/table-CPH2md2-.js +0 -1
- package/dist/table-CwFHXC-G.d.ts +0 -414
- package/dist/theme-D3MDng6U.js +0 -1
- package/dist/theme-provider-C9zpDyJW.js +0 -1
- package/dist/toast-BsCjaMVS.js +0 -1
- package/dist/virtual-DZMBu7Ch.js +0 -1
package/dist/table-CwFHXC-G.d.ts
DELETED
|
@@ -1,414 +0,0 @@
|
|
|
1
|
-
//#region src/components/table/table.d.ts
|
|
2
|
-
/**
|
|
3
|
-
* Use `Table` for STATIC, layout-driven tabular data — read-only data dumps,
|
|
4
|
-
* simple key/value displays, plain markup tables. The API matches the HTML
|
|
5
|
-
* `<table>` element 1:1, with no built-in sorting, filtering, or pagination.
|
|
6
|
-
*
|
|
7
|
-
* For INTERACTIVE tabular data with sorting / filtering / pagination / row
|
|
8
|
-
* selection, use `DataTable` (built on TanStack Table) instead.
|
|
9
|
-
*
|
|
10
|
-
* @see https://mantle.ngrok.com/components/data-display/table
|
|
11
|
-
*
|
|
12
|
-
* @example
|
|
13
|
-
* Composition:
|
|
14
|
-
* ```
|
|
15
|
-
* Table.Root
|
|
16
|
-
* └── Table.Element
|
|
17
|
-
* ├── Table.Caption
|
|
18
|
-
* ├── Table.Head
|
|
19
|
-
* │ └── Table.Row
|
|
20
|
-
* │ └── Table.Header
|
|
21
|
-
* ├── Table.Body
|
|
22
|
-
* │ └── Table.Row
|
|
23
|
-
* │ └── Table.Cell
|
|
24
|
-
* └── Table.Foot
|
|
25
|
-
* ```
|
|
26
|
-
*
|
|
27
|
-
* @example
|
|
28
|
-
* ```tsx
|
|
29
|
-
* <Table.Root>
|
|
30
|
-
* <Table.Element>
|
|
31
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
32
|
-
* <Table.Head>
|
|
33
|
-
* <Table.Row>
|
|
34
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
35
|
-
* <Table.Header>Status</Table.Header>
|
|
36
|
-
* <Table.Header>Method</Table.Header>
|
|
37
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
38
|
-
* </Table.Row>
|
|
39
|
-
* </Table.Head>
|
|
40
|
-
* <Table.Body>
|
|
41
|
-
* {invoices.map((invoice) => (
|
|
42
|
-
* <Table.Row key={invoice.invoice}>
|
|
43
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
44
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
45
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
46
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
47
|
-
* </Table.Row>
|
|
48
|
-
* ))}
|
|
49
|
-
* </Table.Body>
|
|
50
|
-
* <Table.Foot>
|
|
51
|
-
* <Table.Row>
|
|
52
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
53
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
54
|
-
* </Table.Row>
|
|
55
|
-
* </Table.Foot>
|
|
56
|
-
* </Table.Element>
|
|
57
|
-
* </Table.Root>
|
|
58
|
-
* ```
|
|
59
|
-
*/
|
|
60
|
-
declare const Table: {
|
|
61
|
-
/**
|
|
62
|
-
* The body section of the table. Encapsulates a set of table rows comprising the body of a table's main data.
|
|
63
|
-
*
|
|
64
|
-
* @see https://mantle.ngrok.com/components/data-display/table#tablebody
|
|
65
|
-
*
|
|
66
|
-
* @example
|
|
67
|
-
* ```tsx
|
|
68
|
-
* <Table.Root>
|
|
69
|
-
* <Table.Element>
|
|
70
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
71
|
-
* <Table.Head>
|
|
72
|
-
* <Table.Row>
|
|
73
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
74
|
-
* <Table.Header>Status</Table.Header>
|
|
75
|
-
* <Table.Header>Method</Table.Header>
|
|
76
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
77
|
-
* </Table.Row>
|
|
78
|
-
* </Table.Head>
|
|
79
|
-
* <Table.Body>
|
|
80
|
-
* {invoices.map((invoice) => (
|
|
81
|
-
* <Table.Row key={invoice.invoice}>
|
|
82
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
83
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
84
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
85
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
86
|
-
* </Table.Row>
|
|
87
|
-
* ))}
|
|
88
|
-
* </Table.Body>
|
|
89
|
-
* <Table.Foot>
|
|
90
|
-
* <Table.Row>
|
|
91
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
92
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
93
|
-
* </Table.Row>
|
|
94
|
-
* </Table.Foot>
|
|
95
|
-
* </Table.Element>
|
|
96
|
-
* </Table.Root>
|
|
97
|
-
* ```
|
|
98
|
-
*/
|
|
99
|
-
readonly Body: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
100
|
-
/**
|
|
101
|
-
* An optional caption that specifies the caption (or title) of a table, providing an accessible description.
|
|
102
|
-
*
|
|
103
|
-
* @see https://mantle.ngrok.com/components/data-display/table#tablecaption
|
|
104
|
-
*
|
|
105
|
-
* @example
|
|
106
|
-
* ```tsx
|
|
107
|
-
* <Table.Root>
|
|
108
|
-
* <Table.Element>
|
|
109
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
110
|
-
* <Table.Head>
|
|
111
|
-
* <Table.Row>
|
|
112
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
113
|
-
* <Table.Header>Status</Table.Header>
|
|
114
|
-
* <Table.Header>Method</Table.Header>
|
|
115
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
116
|
-
* </Table.Row>
|
|
117
|
-
* </Table.Head>
|
|
118
|
-
* <Table.Body>
|
|
119
|
-
* {invoices.map((invoice) => (
|
|
120
|
-
* <Table.Row key={invoice.invoice}>
|
|
121
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
122
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
123
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
124
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
125
|
-
* </Table.Row>
|
|
126
|
-
* ))}
|
|
127
|
-
* </Table.Body>
|
|
128
|
-
* <Table.Foot>
|
|
129
|
-
* <Table.Row>
|
|
130
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
131
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
132
|
-
* </Table.Row>
|
|
133
|
-
* </Table.Foot>
|
|
134
|
-
* </Table.Element>
|
|
135
|
-
* </Table.Root>
|
|
136
|
-
* ```
|
|
137
|
-
*/
|
|
138
|
-
readonly Caption: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
139
|
-
/**
|
|
140
|
-
* A cell that contains data and may be used as a child of a table row.
|
|
141
|
-
*
|
|
142
|
-
* @see https://mantle.ngrok.com/components/data-display/table#tablecell
|
|
143
|
-
*
|
|
144
|
-
* @example
|
|
145
|
-
* ```tsx
|
|
146
|
-
* <Table.Root>
|
|
147
|
-
* <Table.Element>
|
|
148
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
149
|
-
* <Table.Head>
|
|
150
|
-
* <Table.Row>
|
|
151
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
152
|
-
* <Table.Header>Status</Table.Header>
|
|
153
|
-
* <Table.Header>Method</Table.Header>
|
|
154
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
155
|
-
* </Table.Row>
|
|
156
|
-
* </Table.Head>
|
|
157
|
-
* <Table.Body>
|
|
158
|
-
* {invoices.map((invoice) => (
|
|
159
|
-
* <Table.Row key={invoice.invoice}>
|
|
160
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
161
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
162
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
163
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
164
|
-
* </Table.Row>
|
|
165
|
-
* ))}
|
|
166
|
-
* </Table.Body>
|
|
167
|
-
* <Table.Foot>
|
|
168
|
-
* <Table.Row>
|
|
169
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
170
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
171
|
-
* </Table.Row>
|
|
172
|
-
* </Table.Foot>
|
|
173
|
-
* </Table.Element>
|
|
174
|
-
* </Table.Root>
|
|
175
|
-
* ```
|
|
176
|
-
*/
|
|
177
|
-
readonly Cell: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, "ref"> & import("react").RefAttributes<HTMLTableDataCellElement>>;
|
|
178
|
-
/**
|
|
179
|
-
* A structured way to display data in rows and columns. The API matches the HTML table element 1:1.
|
|
180
|
-
*
|
|
181
|
-
* @see https://mantle.ngrok.com/components/data-display/table#tableelement
|
|
182
|
-
*
|
|
183
|
-
* @example
|
|
184
|
-
* ```tsx
|
|
185
|
-
* <Table.Root>
|
|
186
|
-
* <Table.Element>
|
|
187
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
188
|
-
* <Table.Head>
|
|
189
|
-
* <Table.Row>
|
|
190
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
191
|
-
* <Table.Header>Status</Table.Header>
|
|
192
|
-
* <Table.Header>Method</Table.Header>
|
|
193
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
194
|
-
* </Table.Row>
|
|
195
|
-
* </Table.Head>
|
|
196
|
-
* <Table.Body>
|
|
197
|
-
* {invoices.map((invoice) => (
|
|
198
|
-
* <Table.Row key={invoice.invoice}>
|
|
199
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
200
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
201
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
202
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
203
|
-
* </Table.Row>
|
|
204
|
-
* ))}
|
|
205
|
-
* </Table.Body>
|
|
206
|
-
* <Table.Foot>
|
|
207
|
-
* <Table.Row>
|
|
208
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
209
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
210
|
-
* </Table.Row>
|
|
211
|
-
* </Table.Foot>
|
|
212
|
-
* </Table.Element>
|
|
213
|
-
* </Table.Root>
|
|
214
|
-
* ```
|
|
215
|
-
*/
|
|
216
|
-
readonly Element: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, "ref"> & import("react").RefAttributes<HTMLTableElement>>;
|
|
217
|
-
/**
|
|
218
|
-
* The foot section of a table. Encapsulates a set of table rows comprising the foot with summary information.
|
|
219
|
-
*
|
|
220
|
-
* @see https://mantle.ngrok.com/components/data-display/table#tablefoot
|
|
221
|
-
*
|
|
222
|
-
* @example
|
|
223
|
-
* ```tsx
|
|
224
|
-
* <Table.Root>
|
|
225
|
-
* <Table.Element>
|
|
226
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
227
|
-
* <Table.Head>
|
|
228
|
-
* <Table.Row>
|
|
229
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
230
|
-
* <Table.Header>Status</Table.Header>
|
|
231
|
-
* <Table.Header>Method</Table.Header>
|
|
232
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
233
|
-
* </Table.Row>
|
|
234
|
-
* </Table.Head>
|
|
235
|
-
* <Table.Body>
|
|
236
|
-
* {invoices.map((invoice) => (
|
|
237
|
-
* <Table.Row key={invoice.invoice}>
|
|
238
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
239
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
240
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
241
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
242
|
-
* </Table.Row>
|
|
243
|
-
* ))}
|
|
244
|
-
* </Table.Body>
|
|
245
|
-
* <Table.Foot>
|
|
246
|
-
* <Table.Row>
|
|
247
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
248
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
249
|
-
* </Table.Row>
|
|
250
|
-
* </Table.Foot>
|
|
251
|
-
* </Table.Element>
|
|
252
|
-
* </Table.Root>
|
|
253
|
-
* ```
|
|
254
|
-
*/
|
|
255
|
-
readonly Foot: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
256
|
-
/**
|
|
257
|
-
* The head section of a table. Contains the table's column headers information.
|
|
258
|
-
*
|
|
259
|
-
* @see https://mantle.ngrok.com/components/data-display/table#tableheader
|
|
260
|
-
*
|
|
261
|
-
* @example
|
|
262
|
-
* ```tsx
|
|
263
|
-
* <Table.Root>
|
|
264
|
-
* <Table.Element>
|
|
265
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
266
|
-
* <Table.Head>
|
|
267
|
-
* <Table.Row>
|
|
268
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
269
|
-
* <Table.Header>Status</Table.Header>
|
|
270
|
-
* <Table.Header>Method</Table.Header>
|
|
271
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
272
|
-
* </Table.Row>
|
|
273
|
-
* </Table.Head>
|
|
274
|
-
* <Table.Body>
|
|
275
|
-
* {invoices.map((invoice) => (
|
|
276
|
-
* <Table.Row key={invoice.invoice}>
|
|
277
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
278
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
279
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
280
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
281
|
-
* </Table.Row>
|
|
282
|
-
* ))}
|
|
283
|
-
* </Table.Body>
|
|
284
|
-
* <Table.Foot>
|
|
285
|
-
* <Table.Row>
|
|
286
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
287
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
288
|
-
* </Table.Row>
|
|
289
|
-
* </Table.Foot>
|
|
290
|
-
* </Table.Element>
|
|
291
|
-
* </Table.Root>
|
|
292
|
-
* ```
|
|
293
|
-
*/
|
|
294
|
-
readonly Head: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
295
|
-
/**
|
|
296
|
-
* A cell that defines the header of a group of table cells as a child of a table row.
|
|
297
|
-
*
|
|
298
|
-
* @see https://mantle.ngrok.com/components/data-display/table#tableheader
|
|
299
|
-
*
|
|
300
|
-
* @example
|
|
301
|
-
* ```tsx
|
|
302
|
-
* <Table.Root>
|
|
303
|
-
* <Table.Element>
|
|
304
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
305
|
-
* <Table.Head>
|
|
306
|
-
* <Table.Row>
|
|
307
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
308
|
-
* <Table.Header>Status</Table.Header>
|
|
309
|
-
* <Table.Header>Method</Table.Header>
|
|
310
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
311
|
-
* </Table.Row>
|
|
312
|
-
* </Table.Head>
|
|
313
|
-
* <Table.Body>
|
|
314
|
-
* {invoices.map((invoice) => (
|
|
315
|
-
* <Table.Row key={invoice.invoice}>
|
|
316
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
317
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
318
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
319
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
320
|
-
* </Table.Row>
|
|
321
|
-
* ))}
|
|
322
|
-
* </Table.Body>
|
|
323
|
-
* <Table.Foot>
|
|
324
|
-
* <Table.Row>
|
|
325
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
326
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
327
|
-
* </Table.Row>
|
|
328
|
-
* </Table.Foot>
|
|
329
|
-
* </Table.Element>
|
|
330
|
-
* </Table.Root>
|
|
331
|
-
* ```
|
|
332
|
-
*/
|
|
333
|
-
readonly Header: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, "ref"> & import("react").RefAttributes<HTMLTableHeaderCellElement>>;
|
|
334
|
-
/**
|
|
335
|
-
* The root container element for all tables. Provides styling and additional functionality like horizontal overflow detection.
|
|
336
|
-
*
|
|
337
|
-
* @see https://mantle.ngrok.com/components/data-display/table#tableroot
|
|
338
|
-
*
|
|
339
|
-
* @example
|
|
340
|
-
* ```tsx
|
|
341
|
-
* <Table.Root>
|
|
342
|
-
* <Table.Element>
|
|
343
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
344
|
-
* <Table.Head>
|
|
345
|
-
* <Table.Row>
|
|
346
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
347
|
-
* <Table.Header>Status</Table.Header>
|
|
348
|
-
* <Table.Header>Method</Table.Header>
|
|
349
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
350
|
-
* </Table.Row>
|
|
351
|
-
* </Table.Head>
|
|
352
|
-
* <Table.Body>
|
|
353
|
-
* {invoices.map((invoice) => (
|
|
354
|
-
* <Table.Row key={invoice.invoice}>
|
|
355
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
356
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
357
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
358
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
359
|
-
* </Table.Row>
|
|
360
|
-
* ))}
|
|
361
|
-
* </Table.Body>
|
|
362
|
-
* <Table.Foot>
|
|
363
|
-
* <Table.Row>
|
|
364
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
365
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
366
|
-
* </Table.Row>
|
|
367
|
-
* </Table.Foot>
|
|
368
|
-
* </Table.Element>
|
|
369
|
-
* </Table.Root>
|
|
370
|
-
* ```
|
|
371
|
-
*/
|
|
372
|
-
readonly Root: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
373
|
-
/**
|
|
374
|
-
* Defines a row of cells in a table. Contains a mix of table cells and table headers.
|
|
375
|
-
*
|
|
376
|
-
* @see https://mantle.ngrok.com/components/data-display/table#tablerow
|
|
377
|
-
*
|
|
378
|
-
* @example
|
|
379
|
-
* ```tsx
|
|
380
|
-
* <Table.Root>
|
|
381
|
-
* <Table.Element>
|
|
382
|
-
* <Table.Caption>A list of your recent invoices.</Table.Caption>
|
|
383
|
-
* <Table.Head>
|
|
384
|
-
* <Table.Row>
|
|
385
|
-
* <Table.Header className="w-25">Invoice</Table.Header>
|
|
386
|
-
* <Table.Header>Status</Table.Header>
|
|
387
|
-
* <Table.Header>Method</Table.Header>
|
|
388
|
-
* <Table.Header className="text-right">Amount</Table.Header>
|
|
389
|
-
* </Table.Row>
|
|
390
|
-
* </Table.Head>
|
|
391
|
-
* <Table.Body>
|
|
392
|
-
* {invoices.map((invoice) => (
|
|
393
|
-
* <Table.Row key={invoice.invoice}>
|
|
394
|
-
* <Table.Cell className="font-medium">{invoice.invoice}</Table.Cell>
|
|
395
|
-
* <Table.Cell>{invoice.paymentStatus}</Table.Cell>
|
|
396
|
-
* <Table.Cell>{invoice.paymentMethod}</Table.Cell>
|
|
397
|
-
* <Table.Cell className="text-right">{invoice.totalAmount}</Table.Cell>
|
|
398
|
-
* </Table.Row>
|
|
399
|
-
* ))}
|
|
400
|
-
* </Table.Body>
|
|
401
|
-
* <Table.Foot>
|
|
402
|
-
* <Table.Row>
|
|
403
|
-
* <Table.Cell colSpan={3}>Total</Table.Cell>
|
|
404
|
-
* <Table.Cell className="text-right">$2,500.00</Table.Cell>
|
|
405
|
-
* </Table.Row>
|
|
406
|
-
* </Table.Foot>
|
|
407
|
-
* </Table.Element>
|
|
408
|
-
* </Table.Root>
|
|
409
|
-
* ```
|
|
410
|
-
*/
|
|
411
|
-
readonly Row: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "ref"> & import("react").RefAttributes<HTMLTableRowElement>>;
|
|
412
|
-
};
|
|
413
|
-
//#endregion
|
|
414
|
-
export { Table as t };
|
package/dist/theme-D3MDng6U.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{s as e}from"./theme-provider-C9zpDyJW.js";import{jsx as t}from"react/jsx-runtime";import{DesktopIcon as n}from"@phosphor-icons/react/Desktop";import{MoonIcon as r}from"@phosphor-icons/react/Moon";import{SunIcon as i}from"@phosphor-icons/react/Sun";function a(n){return t(o,{theme:e(),...n})}a.displayName=`AutoThemeIcon`;function o({theme:e,...a}){switch(e){case`system`:return t(n,{...a});case`light`:return t(i,{...a});case`dark`:return t(r,{...a});case`light-high-contrast`:return t(i,{...a,weight:`fill`});case`dark-high-contrast`:return t(r,{...a,weight:`fill`})}}o.displayName=`ThemeIcon`;export{o as n,a as t};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./use-matches-media-query-CMSxHR9n.js";import{n}from"./browser-only-CPH56Xw_.js";import{createContext as r,useContext as i,useEffect as a,useMemo as o,useRef as s,useState as c}from"react";import l from"tiny-invariant";import{jsx as u}from"react/jsx-runtime";const d=[`light`,`dark`,`light-high-contrast`,`dark-high-contrast`],f=[`system`,...d],p=e=>e;function m(e){return typeof e==`string`&&f.includes(e)}const h=e=>e;function g(e){return typeof e==`string`&&d.includes(e)}const _=`(prefers-color-scheme: dark)`,v=`(prefers-contrast: more)`,y=`mantle-ui-theme`,b=`system`,x=r([`system`,()=>null]);function S({children:e}){let[t,r]=c(()=>{let e=N({cookie:n()?document.cookie:null});return w(e),e}),i=s(null);a(()=>{function e(e){let t=e??N({cookie:document.cookie});r(t),w(t)}e();try{`BroadcastChannel`in window&&(i.current=new BroadcastChannel(y),i.current.addEventListener(`message`,t=>{let n=t?.data?.theme;m(n)&&e(n)}))}catch{}function t(t){t.key===`${y}__ping`&&e()}window.addEventListener(`storage`,t);let n=window.matchMedia(_),a=window.matchMedia(v);function o(){e()}function s(){document.visibilityState===`visible`&&e()}return n.addEventListener(`change`,o),a.addEventListener(`change`,o),window.addEventListener(`pageshow`,o),document.addEventListener(`visibilitychange`,s),()=>{window.removeEventListener(`storage`,t),n.removeEventListener(`change`,o),a.removeEventListener(`change`,o),window.removeEventListener(`pageshow`,o),document.removeEventListener(`visibilitychange`,s);try{i.current?.close()}catch{}i.current=null}},[]);let l=o(()=>[t,e=>{L(e),r(e),w(e),F(e,{broadcastChannel:i.current,pingKey:`${y}__ping`})}],[t]);return u(x.Provider,{value:l,children:e})}S.displayName=`ThemeProvider`;function C(){let e=i(x);return l(e,`useTheme must be used within a ThemeProvider`),e}function w(e){if(!n())return;let t=window.document.documentElement,r=window.matchMedia(_).matches,i=window.matchMedia(v).matches,a=E(e,{prefersDarkMode:r,prefersHighContrast:i}),o=t.dataset.theme,s=t.dataset.appliedTheme,c=m(o)?o:void 0,l=g(s)?s:void 0;(c!==e||l!==a)&&(t.classList.remove(...d),t.classList.add(a),t.dataset.theme=e,t.dataset.appliedTheme=a)}function T(){if(!n())return{appliedTheme:void 0,theme:void 0};let e=window.document.documentElement,t=m(e.dataset.theme)?e.dataset.theme:void 0;return{appliedTheme:g(e.dataset.appliedTheme)?e.dataset.appliedTheme:void 0,theme:t}}function E(e,{prefersDarkMode:t,prefersHighContrast:n}){return e===`system`?O({prefersDarkMode:t,prefersHighContrast:n}):e}function D(){let e=i(x);return E(e==null?`system`:e[0],{prefersDarkMode:t(_),prefersHighContrast:t(v)})}function O({prefersDarkMode:e,prefersHighContrast:t}){return t?e?`dark-high-contrast`:`light-high-contrast`:e?`dark`:`light`}function k(e){let{storageKey:t,defaultTheme:n,themes:r,resolvedThemes:i,prefersDarkModeMediaQuery:a,prefersHighContrastMediaQuery:o}=e;function s(e){return typeof e==`string`&&r.includes(e)}function c(e){let t=document.cookie;if(!t)return null;try{let n=t.split(`;`).find(t=>t.trim().startsWith(`${e}=`))?.split(`=`)[1];return n?decodeURIComponent(n):null}catch{return null}}function l(e,t){let n=new Date;n.setFullYear(n.getFullYear()+1);let r=window.location.hostname,i=window.location.protocol,a=r===`ngrok.com`||r.endsWith(`.ngrok.com`)?`; domain=.ngrok.com`:``,o=i===`https:`?`; Secure`:``;return`${e}=${encodeURIComponent(t)}; expires=${n.toUTCString()}; path=/${a}; SameSite=Lax${o}`}function u(e,t){try{document.cookie=l(e,t)}catch{}}function d(e,t,n){return e===`system`?n?t?`dark-high-contrast`:`light-high-contrast`:t?`dark`:`light`:e}let f=null,p=null,m=null;try{f=c(t)}catch{}if(s(f))m=f;else{try{p=window.localStorage?.getItem(t)??null}catch{}s(p)&&(m=p)}let h=s(m)?m:n,g=matchMedia(a).matches,_=matchMedia(o).matches,v=d(h,g,_),y=document.documentElement;if(y.dataset.appliedTheme!==v||y.dataset.theme!==h){for(let e of i)y.classList.remove(e);y.classList.add(v),y.dataset.theme=h,y.dataset.appliedTheme=v}let b=s(f);try{if(s(p)&&!b){u(t,p);try{window.localStorage.removeItem(t)}catch{}}else b||u(t,h)}catch{}}function A(){let e={storageKey:y,defaultTheme:b,themes:f,resolvedThemes:d,prefersDarkModeMediaQuery:_,prefersHighContrastMediaQuery:v};return`(${k.toString()})(${JSON.stringify(e)})`}const j=({nonce:e})=>u(`script`,{dangerouslySetInnerHTML:{__html:A()},nonce:e,suppressHydrationWarning:!0});j.displayName=`PreventWrongThemeFlashScript`;function M(t={}){let{className:r=``,ssrCookie:i}=t??{};return o(()=>{let t,a;if(!n())t=N({cookie:i}),a=E(t,{prefersDarkMode:!1,prefersHighContrast:!1});else{let e=window.matchMedia(_).matches,n=window.matchMedia(v).matches;t=N({cookie:document.cookie}),a=E(t,{prefersDarkMode:e,prefersHighContrast:n})}return{className:e(r,a),"data-applied-theme":a,"data-theme":t}},[r,i])}function N({cookie:e}){if(!e)return b;try{let t=e.split(`;`).find(e=>e.trim().startsWith(`${y}=`))?.split(`=`)[1],n=t?globalThis.decodeURIComponent(t):null;return m(n)?n:b}catch{return b}}function P(e){if(e)return e.split(`;`).map(e=>e.trim()).find(e=>e.startsWith(`${y}=`))}function F(e,t){let{broadcastChannel:n,pingKey:r}=t;try{if(n){n.postMessage({theme:e,timestamp:Date.now()});return}}catch{}try{localStorage.setItem(r,JSON.stringify({theme:e,timestamp:Date.now()}))}catch{}}function I(e){let t=new Date;t.setFullYear(t.getFullYear()+1);let{hostname:n,protocol:r}=window.location,i=n===`ngrok.com`||n.endsWith(`.ngrok.com`)?`; domain=.ngrok.com`:``,a=r===`https:`?`; Secure`:``;return`${y}=${encodeURIComponent(e)}; expires=${t.toUTCString()}; path=/${i}; SameSite=Lax${a}`}function L(e){if(n())try{document.cookie=I(e)}catch{}}export{A as a,M as c,p as d,g as f,f as h,N as i,C as l,d as m,S as n,T as o,m as p,P as r,D as s,j as t,h as u};
|
package/dist/toast-BsCjaMVS.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-CDtYjF_H.js";import{t as n}from"./slot-DmPrjM7N.js";import{s as r}from"./theme-provider-C9zpDyJW.js";import{createContext as i,forwardRef as a,useContext as o,useMemo as s}from"react";import{jsx as c,jsxs as l}from"react/jsx-runtime";import{CheckCircleIcon as u}from"@phosphor-icons/react/CheckCircle";import{InfoIcon as d}from"@phosphor-icons/react/Info";import{WarningIcon as f}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as p}from"@phosphor-icons/react/WarningDiamond";import*as m from"sonner";const h=({className:t,containerAriaLabel:n,dir:i,duration_ms:a=4e3,position:o=`top-center`,style:s})=>{let l=r();return c(m.Toaster,{"data-slot":`toaster`,className:e(`toaster overlay-prompt pointer-events-auto *:duration-200`,t),containerAriaLabel:n,dir:i,duration:a,gap:12,position:o??`top-center`,style:s,theme:l,toastOptions:{unstyled:!0}})};h.displayName=`Toaster`;const g=i(``);function _(e,t){let n=t?.duration_ms;return typeof n==`number`&&n<=0&&(n=1/0),m.toast.custom(t=>c(g.Provider,{value:t,children:e}),{duration:n,...t?.id?{id:t.id}:{},unstyled:!0})}const v=i({intent:`info`}),y=a(({asChild:t,children:r,className:i,intent:a,...o},u)=>{let d=t?n:`div`,f=s(()=>({intent:a}),[a]);return c(v.Provider,{value:f,children:l(d,{"data-slot":`toast`,className:e(`relative flex items-start gap-2 text-sm font-sans`,`p-3 pl-3.75`,`bg-popover high-contrast:border-popover rounded rounded-r-[0.3125rem] border border-gray-500/35 shadow-lg`,i),ref:u,...o,children:[c(E,{intent:a}),r]})})});y.displayName=`Toast`;const b=a(({className:n,svg:r,...i},a)=>{let s=o(v);switch(s.intent){case`danger`:return c(t,{"data-slot":`toast-icon`,className:e(`text-danger-600`,n),ref:a,svg:r??c(f,{weight:`fill`}),...i});case`warning`:return c(t,{"data-slot":`toast-icon`,className:e(`text-warning-600`,n),ref:a,svg:r??c(p,{weight:`fill`}),...i});case`success`:return c(t,{"data-slot":`toast-icon`,className:e(`text-success-600`,n),ref:a,svg:r??c(u,{weight:`fill`}),...i});case`info`:return c(t,{"data-slot":`toast-icon`,className:e(`text-accent-600`,n),ref:a,svg:c(d,{weight:`fill`}),...i});default:throw Error(`Unreachable Case: ${s.intent}`)}});b.displayName=`ToastIcon`;const x=a(({asChild:t,className:r,onClick:i,...a},s)=>{let l=o(g);return c(t?n:`button`,{"data-slot":`toast-action`,className:e(`shrink-0`,`data-icon-button:-mr-0.5 data-icon-button:-mt-0.5 data-icon-button:rounded-xs`,r),onClick:e=>{i?.(e),!e.defaultPrevented&&m.toast.dismiss(l)},ref:s,...a})});x.displayName=`ToastAction`;const S=a(({asChild:t,className:r,...i},a)=>c(t?n:`p`,{"data-slot":`toast-message`,className:e(`text-strong flex-1 text-sm font-body`,r),ref:a,...i}));S.displayName=`ToastMessage`;const C={Root:y,Action:x,Icon:b,Message:S};function w(e){e.target instanceof Element&&e.target.closest(`.overlay-prompt`)&&e.preventDefault()}const T={info:`bg-accent-600`,warning:`bg-warning-600`,success:`bg-success-600`,danger:`bg-danger-600`};function E({className:t,intent:n,...r}){return c(`div`,{"aria-hidden":!0,className:e(`z-1 absolute -inset-px right-auto w-1.5 rounded-l`,T[n],t),...r})}export{w as i,h as n,_ as r,C as t};
|
package/dist/virtual-DZMBu7Ch.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{n as e}from"./compose-refs-Cjf2gfB8.js";import{t}from"./cx-IiQEAKf5.js";import{t as n}from"./slot-DmPrjM7N.js";import{Children as r,createContext as i,forwardRef as a,isValidElement as o,useCallback as s,useContext as c,useEffect as l,useId as u,useMemo as d,useRef as f,useState as p}from"react";import m from"tiny-invariant";import{jsx as h}from"react/jsx-runtime";import{useVirtualizer as g}from"@tanstack/react-virtual";const _=i(null);function v(e){let t=c(_);return m(t,`List.${e} must be composed inside List.Root / List.VirtualRoot (or a SelectableList viewport).`),t}const y=i(null),b=i(null);function x(e){return o(e)?e.props.disabled===!0:!1}function S({start:e,step:t,count:n,isItemDisabled:r}){for(let i=e;i>=0&&i<n;i+=t)if(!r(i))return i;return-1}const C=`a[href]:not([tabindex="-1"]), button:not(:disabled):not([tabindex="-1"]), [tabindex]:not([tabindex="-1"])`;function w(e){let t=e.matches(C)?e:e.querySelector(C);return t instanceof HTMLElement?t:null}function T(e){let t=e instanceof Element?e.closest(`[data-index]`):null;if(t==null)return null;let n=Number(t.getAttribute(`data-index`));return!Number.isInteger(n)||n<0?null:{item:t,index:n}}function E(e,t){if(!(e instanceof Element))return!1;let n=e.closest(`a[href], button, input, select, textarea, label, [role="button"], [role="link"], [role="menuitem"], [contenteditable="true"]`);return n!=null&&t.contains(n)}function D({count:e,isItemDisabled:t,focusItemAt:n}){return{onKeyDown:r=>{if(r.target instanceof HTMLElement&&(r.target.isContentEditable||r.target.tagName===`INPUT`||r.target.tagName===`TEXTAREA`||r.target.tagName===`SELECT`)||r.altKey||r.ctrlKey||r.metaKey)return;let i=T(r.target);if(i==null)return;let a=-1,o=1;switch(r.key){case`ArrowDown`:o=1,a=S({start:i.index+1,step:o,count:e,isItemDisabled:t});break;case`ArrowUp`:o=-1,a=S({start:i.index-1,step:o,count:e,isItemDisabled:t});break;case`Home`:o=1,a=S({start:0,step:o,count:e,isItemDisabled:t});break;case`End`:o=-1,a=S({start:e-1,step:o,count:e,isItemDisabled:t});break;default:return}r.preventDefault(),a>=0&&a!==i.index&&n(a,o)}}}function O({count:e,enabled:t,isItemDisabled:n,onActivate:r,itemId:i,scrollToIndex:a}){let[o,s]=p(-1),c=f(!1),u=o>=e?e-1:o;if(l(()=>{o>=e&&s(e-1)},[o,e]),!t)return{activeIndex:-1,collectionProps:{}};let d=e=>n?.(e)??!1,m=(t,n)=>S({start:t,step:n,count:e,isItemDisabled:d}),h=e=>{e<0||(s(e),a(e))};return{activeIndex:u,collectionProps:{tabIndex:0,"aria-activedescendant":u>=0?i(u):void 0,onMouseDown:e=>{let t=T(e.target);if(t!=null&&!d(t.index)){s(t.index),c.current=!1;return}c.current=!0},onClick:e=>{if(e.defaultPrevented)return;let t=T(e.target);t==null||d(t.index)||E(e.target,t.item)||(s(t.index),r?.(t.index))},onFocus:t=>{if(t.target!==t.currentTarget){let e=T(t.target);e!=null&&!d(e.index)&&s(e.index),t.target instanceof HTMLElement&&t.target.tabIndex>=0||t.currentTarget.focus({preventScroll:!0}),c.current=!1;return}let n=c.current;c.current=!1,e>0&&!n&&s(e=>e<0?m(0,1):e)},onBlur:e=>{e.currentTarget.contains(e.relatedTarget)||(s(-1),c.current=!1)},onKeyDown:t=>{if(t.target===t.currentTarget&&!(t.altKey||t.ctrlKey||t.metaKey))switch(c.current=!1,t.key){case`ArrowDown`:t.preventDefault(),h(m(u<0?0:u+1,1));break;case`ArrowUp`:t.preventDefault(),h(u<0?m(0,1):m(u-1,-1));break;case`Home`:t.preventDefault(),h(m(0,1));break;case`End`:t.preventDefault(),h(m(e-1,-1));break;case` `:case`Enter`:!t.repeat&&u>=0&&!d(u)&&(t.preventDefault(),r?.(u));break;default:break}}}}}function k({count:e,focusItemAt:t,isItemDisabled:n,onActivate:r,itemId:i,scrollToIndex:a,semantics:o}){let s=u(),c=d(()=>({semantics:o}),[o]),l=d(()=>i??(e=>`${s}-item-${e}`),[i,s]),{activeIndex:f,collectionProps:p}=O({count:e,enabled:o===`grid`,isItemDisabled:n,onActivate:r,itemId:l,scrollToIndex:a}),m=d(()=>({activeIndex:f,stampItemId:i==null?l:null}),[f,l,i]);return{collectionProps:o===`list`?D({count:e,isItemDisabled:n,focusItemAt:t}):p,gridNav:m,listContext:c}}function A({"aria-label":e,"aria-labelledby":n,"aria-multiselectable":r,children:i,className:a,collectionProps:o,gridNav:s,listContext:c,viewportProps:l,viewportRef:u}){return h(_.Provider,{value:c,children:h(b.Provider,{value:s,children:h(`div`,{ref:u,"data-slot":`list`,className:t(`border-popover bg-popover scrollbar overscroll-none overflow-x-hidden overflow-y-auto rounded-md border p-1`,a),...l,children:h(`div`,{"data-slot":`list-collection`,role:c.semantics===`grid`?`grid`:`list`,"aria-label":e,"aria-labelledby":n,"aria-multiselectable":r,className:`relative flex w-full flex-col gap-px outline-hidden`,...o,children:i})})})})}A.displayName=`ListPrimitiveShell`;const j=a(({asChild:r,children:i,className:a,disabled:o=!1,selected:s=!1,style:l,...u},d)=>{let{semantics:f}=v(`Item`),p=c(y),m=c(b),g=f===`grid`,_=r?n:`div`,x=p?.placement??null,S=p?.index,C=g&&m!=null&&S!=null&&m.activeIndex===S;return h(_,{ref:e(d,x?.measureRef??null),"data-slot":`list-item`,...u,id:g&&S!=null&&m?.stampItemId!=null?m.stampItemId(S):u.id,"data-index":S,"data-state":s?`selected`:`unselected`,"data-disabled":o||void 0,"data-active":C||void 0,role:g?`row`:`listitem`,"aria-selected":g?s:void 0,"aria-disabled":g&&o?!0:u[`aria-disabled`],"aria-rowindex":g?x?.posInSet:void 0,"aria-posinset":g?void 0:x?.posInSet,"aria-setsize":g?void 0:x?.setSize,className:t(`rounded-md data-[state=selected]:bg-selected-menu-item data-[active]:bg-active-menu-item data-[active]:data-[state=selected]:bg-active-selected-menu-item`,!o&&`hover:bg-active-menu-item hover:data-[state=selected]:bg-active-selected-menu-item`,!g&&!o&&`has-[:focus-visible]:bg-active-menu-item has-[:focus-visible]:data-[state=selected]:bg-active-selected-menu-item`,a),style:x?{...l,...x.style}:l,children:i})});j.displayName=`ListPrimitiveItem`;function M({children:e,index:t}){let n=d(()=>({index:t,placement:null}),[t]);return h(y.Provider,{value:n,children:e})}M.displayName=`ListPrimitivePlainItem`;const N=a(({"aria-label":t,"aria-labelledby":n,"aria-multiselectable":i,children:a,className:c,isItemDisabled:l,onActivate:u,itemId:p,semantics:m=`list`,...g},_)=>{let v=f(null),y=e(v,_),b=d(()=>r.toArray(a).filter(o),[a]),S=s(e=>{v.current?.querySelector(`[data-index="${e}"]`)?.scrollIntoView({block:`nearest`})},[]),C=s((e,t)=>{let n=v.current;if(n!=null)for(let r=e;r>=0&&r<b.length;r+=t){let e=n.querySelector(`[data-index="${r}"]`);if(e==null)continue;let t=w(e);if(t!=null){t.focus({preventScroll:!0}),e.scrollIntoView({block:`nearest`});return}}},[b.length]),{collectionProps:T,gridNav:E,listContext:D}=k({count:b.length,focusItemAt:C,isItemDisabled:l??(e=>x(b[e])),onActivate:u,itemId:p,scrollToIndex:S,semantics:m});return h(A,{"aria-label":t,"aria-labelledby":n,"aria-multiselectable":i,className:c,collectionProps:T,gridNav:E,listContext:D,viewportProps:g,viewportRef:y,children:b.map((e,t)=>h(M,{index:t,children:e},e.key??t))})});N.displayName=`ListPrimitiveRoot`;function P({virtualItem:e,count:t,measureRef:n}){return{posInSet:e.index+1,setSize:t,measureRef:n,style:{position:`absolute`,left:0,top:0,width:`100%`,transform:`translateY(${e.start}px)`}}}function F({children:e,count:t,measureRef:n,virtualItem:r}){let i=d(()=>({index:r.index,placement:P({virtualItem:r,count:t,measureRef:n})}),[r,t,n]);return h(y.Provider,{value:i,children:e})}F.displayName=`ListPrimitiveWindowedItem`;const I=a(({"aria-label":t,"aria-labelledby":n,"aria-multiselectable":i,children:a,className:c,estimateItemHeight:u=44,isItemDisabled:p,onActivate:m,overscan:_=8,itemId:v,semantics:y=`list`,...b},S)=>{let C=f(null),T=e(C,S),E=d(()=>r.toArray(a).filter(o),[a]),D=E.length,O=g({count:D,getScrollElement:()=>C.current,estimateSize:()=>u,getItemKey:e=>E[e]?.key??e,overscan:_,gap:1}),j=s(e=>O.scrollToIndex(e,{align:`auto`}),[O]),M=f(null);l(()=>()=>{M.current!=null&&cancelAnimationFrame(M.current)},[]);let{collectionProps:N,gridNav:P,listContext:I}=k({count:D,focusItemAt:s((e,t)=>{M.current!=null&&(cancelAnimationFrame(M.current),M.current=null);let n=e,r=0,i=()=>{M.current=null;let e=C.current;if(e==null||n<0||n>=D)return;O.scrollToIndex(n,{align:`auto`});let a=e.querySelector(`[data-index="${n}"]`);if(a!=null){let e=w(a);if(e!=null){e.focus({preventScroll:!0});return}n+=t,r=0}r+=1,r<10&&(M.current=requestAnimationFrame(i))};i()},[D,O]),isItemDisabled:p??(e=>x(E[e])),onActivate:m,itemId:v,scrollToIndex:j,semantics:y}),L=O.getVirtualItems(),R=L.some(e=>e.index===P.activeIndex);return h(A,{"aria-label":t,"aria-labelledby":n,"aria-multiselectable":i,className:c,collectionProps:{...N,"aria-activedescendant":R?N[`aria-activedescendant`]:void 0,"aria-rowcount":y===`grid`?D:void 0,style:{height:`${O.getTotalSize()}px`}},gridNav:P,listContext:I,viewportProps:b,viewportRef:T,children:L.map(e=>{let t=E[e.index];return t==null?null:h(F,{virtualItem:e,count:D,measureRef:O.measureElement,children:t},e.key)})})});I.displayName=`ListPrimitiveVirtualRoot`;export{j as n,N as r,I as t};
|