@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
|
@@ -1,345 +0,0 @@
|
|
|
1
|
-
import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
|
|
2
|
-
import { o as WithValidation } from "./validation-7QeiTFwl.js";
|
|
3
|
-
import { FocusEvent, ReactNode, SelectHTMLAttributes } from "react";
|
|
4
|
-
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
5
|
-
//#region src/components/select/select.d.ts
|
|
6
|
-
type WithAriaInvalid = Pick<SelectHTMLAttributes<HTMLSelectElement>, "aria-invalid">;
|
|
7
|
-
/**
|
|
8
|
-
* Displays a list of options for the user to pick from—triggered by a button.
|
|
9
|
-
*
|
|
10
|
-
* Use Select for a small, finite list of options (~2-15) where the user picks exactly one
|
|
11
|
-
* and search/filtering is unnecessary. For larger lists or async/searchable data, use
|
|
12
|
-
* Combobox. For picking multiple options, use MultiSelect.
|
|
13
|
-
*
|
|
14
|
-
* `Select.Content` renders at Tailwind `z-50`, Mantle's shared floating
|
|
15
|
-
* z-index. When multiple shared layers are open, the most recently mounted
|
|
16
|
-
* layer renders on top.
|
|
17
|
-
*
|
|
18
|
-
* @see https://mantle.ngrok.com/components/forms/select
|
|
19
|
-
*
|
|
20
|
-
* @example
|
|
21
|
-
* Composition:
|
|
22
|
-
* ```
|
|
23
|
-
* Select.Root
|
|
24
|
-
* ├── Select.Trigger
|
|
25
|
-
* │ └── Select.Value
|
|
26
|
-
* └── Select.Content
|
|
27
|
-
* ├── Select.Group
|
|
28
|
-
* │ ├── Select.Label
|
|
29
|
-
* │ └── Select.Item
|
|
30
|
-
* └── Select.Separator
|
|
31
|
-
* ```
|
|
32
|
-
*
|
|
33
|
-
* @example
|
|
34
|
-
* ```tsx
|
|
35
|
-
* <Select.Root>
|
|
36
|
-
* <Select.Trigger>
|
|
37
|
-
* <Select.Value placeholder="Select a fruit" />
|
|
38
|
-
* </Select.Trigger>
|
|
39
|
-
* <Select.Content>
|
|
40
|
-
* <Select.Group>
|
|
41
|
-
* <Select.Label>Fruits</Select.Label>
|
|
42
|
-
* <Select.Item value="apple">Apple</Select.Item>
|
|
43
|
-
* <Select.Item value="banana">Banana</Select.Item>
|
|
44
|
-
* <Select.Item value="cherry">Cherry</Select.Item>
|
|
45
|
-
* </Select.Group>
|
|
46
|
-
* <Select.Separator />
|
|
47
|
-
* <Select.Group>
|
|
48
|
-
* <Select.Label>Veggies</Select.Label>
|
|
49
|
-
* <Select.Item value="carrot">Carrot</Select.Item>
|
|
50
|
-
* <Select.Item value="cucumber">Cucumber</Select.Item>
|
|
51
|
-
* </Select.Group>
|
|
52
|
-
* </Select.Content>
|
|
53
|
-
* </Select.Root>
|
|
54
|
-
* ```
|
|
55
|
-
*/
|
|
56
|
-
declare const Select: {
|
|
57
|
-
/**
|
|
58
|
-
* Displays a list of options for the user to pick from—triggered by a button.
|
|
59
|
-
*
|
|
60
|
-
* Use Select for a small, finite list of options (~2-15) where the user picks exactly one
|
|
61
|
-
* and search/filtering is unnecessary. For larger lists or async/searchable data, use
|
|
62
|
-
* Combobox. For picking multiple options, use MultiSelect.
|
|
63
|
-
*
|
|
64
|
-
* `Select.Content` renders at Tailwind `z-50`, Mantle's shared floating
|
|
65
|
-
* z-index. When multiple shared layers are open, the most recently mounted
|
|
66
|
-
* layer renders on top.
|
|
67
|
-
*
|
|
68
|
-
* @see https://mantle.ngrok.com/components/forms/select#selectroot
|
|
69
|
-
*
|
|
70
|
-
* @example
|
|
71
|
-
* ```tsx
|
|
72
|
-
* <Select.Root>
|
|
73
|
-
* <Select.Trigger>
|
|
74
|
-
* <Select.Value placeholder="Select a fruit" />
|
|
75
|
-
* </Select.Trigger>
|
|
76
|
-
* <Select.Content>
|
|
77
|
-
* <Select.Group>
|
|
78
|
-
* <Select.Label>Fruits</Select.Label>
|
|
79
|
-
* <Select.Item value="apple">Apple</Select.Item>
|
|
80
|
-
* <Select.Item value="banana">Banana</Select.Item>
|
|
81
|
-
* <Select.Item value="cherry">Cherry</Select.Item>
|
|
82
|
-
* </Select.Group>
|
|
83
|
-
* <Select.Separator />
|
|
84
|
-
* <Select.Group>
|
|
85
|
-
* <Select.Label>Veggies</Select.Label>
|
|
86
|
-
* <Select.Item value="carrot">Carrot</Select.Item>
|
|
87
|
-
* <Select.Item value="cucumber">Cucumber</Select.Item>
|
|
88
|
-
* </Select.Group>
|
|
89
|
-
* </Select.Content>
|
|
90
|
-
* </Select.Root>
|
|
91
|
-
* ```
|
|
92
|
-
*/
|
|
93
|
-
readonly Root: import("react").ForwardRefExoticComponent<{
|
|
94
|
-
children?: ReactNode | undefined;
|
|
95
|
-
} & {
|
|
96
|
-
autoComplete?: string;
|
|
97
|
-
defaultOpen?: boolean;
|
|
98
|
-
defaultValue?: string;
|
|
99
|
-
dir?: "ltr" | "rtl";
|
|
100
|
-
disabled?: boolean;
|
|
101
|
-
form?: string;
|
|
102
|
-
id?: string;
|
|
103
|
-
name?: string;
|
|
104
|
-
/**
|
|
105
|
-
* Event handler called when Select blurs.
|
|
106
|
-
* @note this is a no-op for now until we can guarantee that it works identically to a native select onBlur
|
|
107
|
-
*/
|
|
108
|
-
onBlur?: (event: FocusEvent<HTMLButtonElement>) => void;
|
|
109
|
-
/**
|
|
110
|
-
* Event handler called when the value changes.
|
|
111
|
-
* @deprecated Use `onValueChange` instead.
|
|
112
|
-
*/
|
|
113
|
-
onChange?: (value: string) => void;
|
|
114
|
-
onOpenChange?(open: boolean): void;
|
|
115
|
-
onValueChange?(value: string): void;
|
|
116
|
-
open?: boolean;
|
|
117
|
-
required?: boolean;
|
|
118
|
-
value?: string;
|
|
119
|
-
} & WithValidation & WithAriaInvalid & import("react").RefAttributes<HTMLButtonElement>>;
|
|
120
|
-
/**
|
|
121
|
-
* The component that pops out when the select is open as a portal adjacent to the trigger button.
|
|
122
|
-
* It contains a scrolling viewport of the select items.
|
|
123
|
-
*
|
|
124
|
-
* `Select.Content` renders at Tailwind `z-50`, Mantle's shared floating
|
|
125
|
-
* z-index. When multiple shared layers are open, the most recently mounted
|
|
126
|
-
* layer renders on top.
|
|
127
|
-
*
|
|
128
|
-
* @see https://mantle.ngrok.com/components/forms/select#selectcontent
|
|
129
|
-
*
|
|
130
|
-
* @example
|
|
131
|
-
* ```tsx
|
|
132
|
-
* <Select.Root>
|
|
133
|
-
* <Select.Trigger>
|
|
134
|
-
* <Select.Value placeholder="Select a fruit" />
|
|
135
|
-
* </Select.Trigger>
|
|
136
|
-
* <Select.Content>
|
|
137
|
-
* <Select.Group>
|
|
138
|
-
* <Select.Label>Fruits</Select.Label>
|
|
139
|
-
* <Select.Item value="apple">Apple</Select.Item>
|
|
140
|
-
* <Select.Item value="banana">Banana</Select.Item>
|
|
141
|
-
* <Select.Item value="cherry">Cherry</Select.Item>
|
|
142
|
-
* </Select.Group>
|
|
143
|
-
* <Select.Separator />
|
|
144
|
-
* <Select.Group>
|
|
145
|
-
* <Select.Label>Veggies</Select.Label>
|
|
146
|
-
* <Select.Item value="carrot">Carrot</Select.Item>
|
|
147
|
-
* <Select.Item value="cucumber">Cucumber</Select.Item>
|
|
148
|
-
* </Select.Group>
|
|
149
|
-
* </Select.Content>
|
|
150
|
-
* </Select.Root>
|
|
151
|
-
* ```
|
|
152
|
-
*/
|
|
153
|
-
readonly Content: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
154
|
-
/**
|
|
155
|
-
* The width of the content. Defaults to the width of the trigger.
|
|
156
|
-
* If set to "content", the content will use the intrinsic content width; it will be the width of the longest/widest item.
|
|
157
|
-
* @default "trigger"
|
|
158
|
-
*/
|
|
159
|
-
width?: "trigger" | "content";
|
|
160
|
-
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
161
|
-
/**
|
|
162
|
-
* A group of related options within a select menu. Similar to an html `<optgroup>` element.
|
|
163
|
-
* Use in conjunction with Select.Label to ensure good accessibility via automatic labelling.
|
|
164
|
-
*
|
|
165
|
-
* @see https://mantle.ngrok.com/components/forms/select#selectgroup
|
|
166
|
-
*
|
|
167
|
-
* @example
|
|
168
|
-
* ```tsx
|
|
169
|
-
* <Select.Root>
|
|
170
|
-
* <Select.Trigger>
|
|
171
|
-
* <Select.Value placeholder="Select a fruit" />
|
|
172
|
-
* </Select.Trigger>
|
|
173
|
-
* <Select.Content>
|
|
174
|
-
* <Select.Group>
|
|
175
|
-
* <Select.Label>Fruits</Select.Label>
|
|
176
|
-
* <Select.Item value="apple">Apple</Select.Item>
|
|
177
|
-
* <Select.Item value="banana">Banana</Select.Item>
|
|
178
|
-
* <Select.Item value="cherry">Cherry</Select.Item>
|
|
179
|
-
* </Select.Group>
|
|
180
|
-
* <Select.Separator />
|
|
181
|
-
* <Select.Group>
|
|
182
|
-
* <Select.Label>Veggies</Select.Label>
|
|
183
|
-
* <Select.Item value="carrot">Carrot</Select.Item>
|
|
184
|
-
* <Select.Item value="cucumber">Cucumber</Select.Item>
|
|
185
|
-
* </Select.Group>
|
|
186
|
-
* </Select.Content>
|
|
187
|
-
* </Select.Root>
|
|
188
|
-
* ```
|
|
189
|
-
*/
|
|
190
|
-
readonly Group: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.SelectGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
191
|
-
/**
|
|
192
|
-
* An option within a select menu. Similar to an html `<option>` element.
|
|
193
|
-
* Has a required `value` prop that will be passed to the `onChange` handler of the `Select` component when this item is selected.
|
|
194
|
-
* Displays the children as the option's text.
|
|
195
|
-
*
|
|
196
|
-
* @see https://mantle.ngrok.com/components/forms/select#selectitem
|
|
197
|
-
*
|
|
198
|
-
* @example
|
|
199
|
-
* ```tsx
|
|
200
|
-
* <Select.Root>
|
|
201
|
-
* <Select.Trigger>
|
|
202
|
-
* <Select.Value placeholder="Select a fruit" />
|
|
203
|
-
* </Select.Trigger>
|
|
204
|
-
* <Select.Content>
|
|
205
|
-
* <Select.Group>
|
|
206
|
-
* <Select.Label>Fruits</Select.Label>
|
|
207
|
-
* <Select.Item value="apple">Apple</Select.Item>
|
|
208
|
-
* <Select.Item value="banana">Banana</Select.Item>
|
|
209
|
-
* <Select.Item value="cherry">Cherry</Select.Item>
|
|
210
|
-
* </Select.Group>
|
|
211
|
-
* <Select.Separator />
|
|
212
|
-
* <Select.Group>
|
|
213
|
-
* <Select.Label>Veggies</Select.Label>
|
|
214
|
-
* <Select.Item value="carrot">Carrot</Select.Item>
|
|
215
|
-
* <Select.Item value="cucumber">Cucumber</Select.Item>
|
|
216
|
-
* </Select.Group>
|
|
217
|
-
* </Select.Content>
|
|
218
|
-
* </Select.Root>
|
|
219
|
-
* ```
|
|
220
|
-
*/
|
|
221
|
-
readonly Item: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
222
|
-
icon?: ReactNode;
|
|
223
|
-
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
224
|
-
/**
|
|
225
|
-
* Used to render the label of a group. It won't be focusable using arrow keys.
|
|
226
|
-
*
|
|
227
|
-
* @see https://mantle.ngrok.com/components/forms/select#selectlabel
|
|
228
|
-
*
|
|
229
|
-
* @example
|
|
230
|
-
* ```tsx
|
|
231
|
-
* <Select.Root>
|
|
232
|
-
* <Select.Trigger>
|
|
233
|
-
* <Select.Value placeholder="Select a fruit" />
|
|
234
|
-
* </Select.Trigger>
|
|
235
|
-
* <Select.Content>
|
|
236
|
-
* <Select.Group>
|
|
237
|
-
* <Select.Label>Fruits</Select.Label>
|
|
238
|
-
* <Select.Item value="apple">Apple</Select.Item>
|
|
239
|
-
* <Select.Item value="banana">Banana</Select.Item>
|
|
240
|
-
* <Select.Item value="cherry">Cherry</Select.Item>
|
|
241
|
-
* </Select.Group>
|
|
242
|
-
* <Select.Separator />
|
|
243
|
-
* <Select.Group>
|
|
244
|
-
* <Select.Label>Veggies</Select.Label>
|
|
245
|
-
* <Select.Item value="carrot">Carrot</Select.Item>
|
|
246
|
-
* <Select.Item value="cucumber">Cucumber</Select.Item>
|
|
247
|
-
* </Select.Group>
|
|
248
|
-
* </Select.Content>
|
|
249
|
-
* </Select.Root>
|
|
250
|
-
* ```
|
|
251
|
-
*/
|
|
252
|
-
readonly Label: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
253
|
-
/**
|
|
254
|
-
* Used to visually separate items or groups of items in the select content.
|
|
255
|
-
*
|
|
256
|
-
* @see https://mantle.ngrok.com/components/forms/select#selectseparator
|
|
257
|
-
*
|
|
258
|
-
* @example
|
|
259
|
-
* ```tsx
|
|
260
|
-
* <Select.Root>
|
|
261
|
-
* <Select.Trigger>
|
|
262
|
-
* <Select.Value placeholder="Select a fruit" />
|
|
263
|
-
* </Select.Trigger>
|
|
264
|
-
* <Select.Content>
|
|
265
|
-
* <Select.Group>
|
|
266
|
-
* <Select.Label>Fruits</Select.Label>
|
|
267
|
-
* <Select.Item value="apple">Apple</Select.Item>
|
|
268
|
-
* <Select.Item value="banana">Banana</Select.Item>
|
|
269
|
-
* <Select.Item value="cherry">Cherry</Select.Item>
|
|
270
|
-
* </Select.Group>
|
|
271
|
-
* <Select.Separator />
|
|
272
|
-
* <Select.Group>
|
|
273
|
-
* <Select.Label>Veggies</Select.Label>
|
|
274
|
-
* <Select.Item value="carrot">Carrot</Select.Item>
|
|
275
|
-
* <Select.Item value="cucumber">Cucumber</Select.Item>
|
|
276
|
-
* </Select.Group>
|
|
277
|
-
* </Select.Content>
|
|
278
|
-
* </Select.Root>
|
|
279
|
-
* ```
|
|
280
|
-
*/
|
|
281
|
-
readonly Separator: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & WithAsChild & {
|
|
282
|
-
orientation?: "horizontal" | "vertical";
|
|
283
|
-
semantic?: boolean;
|
|
284
|
-
}, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
285
|
-
/**
|
|
286
|
-
* The button that toggles the select. The Select.Content will position itself adjacent to the trigger.
|
|
287
|
-
*
|
|
288
|
-
* @see https://mantle.ngrok.com/components/forms/select#selecttrigger
|
|
289
|
-
*
|
|
290
|
-
* @example
|
|
291
|
-
* ```tsx
|
|
292
|
-
* <Select.Root>
|
|
293
|
-
* <Select.Trigger>
|
|
294
|
-
* <Select.Value placeholder="Select a fruit" />
|
|
295
|
-
* </Select.Trigger>
|
|
296
|
-
* <Select.Content>
|
|
297
|
-
* <Select.Group>
|
|
298
|
-
* <Select.Label>Fruits</Select.Label>
|
|
299
|
-
* <Select.Item value="apple">Apple</Select.Item>
|
|
300
|
-
* <Select.Item value="banana">Banana</Select.Item>
|
|
301
|
-
* <Select.Item value="cherry">Cherry</Select.Item>
|
|
302
|
-
* </Select.Group>
|
|
303
|
-
* <Select.Separator />
|
|
304
|
-
* <Select.Group>
|
|
305
|
-
* <Select.Label>Veggies</Select.Label>
|
|
306
|
-
* <Select.Item value="carrot">Carrot</Select.Item>
|
|
307
|
-
* <Select.Item value="cucumber">Cucumber</Select.Item>
|
|
308
|
-
* </Select.Group>
|
|
309
|
-
* </Select.Content>
|
|
310
|
-
* </Select.Root>
|
|
311
|
-
* ```
|
|
312
|
-
*/
|
|
313
|
-
readonly Trigger: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & WithAriaInvalid & WithValidation & import("react").RefAttributes<HTMLButtonElement>>;
|
|
314
|
-
/**
|
|
315
|
-
* The part that reflects the selected value. By default the selected item's text will be rendered. if you require more control, you can instead control the select and pass your own children. It should not be styled to ensure correct positioning. An optional placeholder prop is also available for when the select has no value.
|
|
316
|
-
*
|
|
317
|
-
* @see https://mantle.ngrok.com/components/forms/select#selectvalue
|
|
318
|
-
*
|
|
319
|
-
* @example
|
|
320
|
-
* ```tsx
|
|
321
|
-
* <Select.Root>
|
|
322
|
-
* <Select.Trigger>
|
|
323
|
-
* <Select.Value placeholder="Select a fruit" />
|
|
324
|
-
* </Select.Trigger>
|
|
325
|
-
* <Select.Content>
|
|
326
|
-
* <Select.Group>
|
|
327
|
-
* <Select.Label>Fruits</Select.Label>
|
|
328
|
-
* <Select.Item value="apple">Apple</Select.Item>
|
|
329
|
-
* <Select.Item value="banana">Banana</Select.Item>
|
|
330
|
-
* <Select.Item value="cherry">Cherry</Select.Item>
|
|
331
|
-
* </Select.Group>
|
|
332
|
-
* <Select.Separator />
|
|
333
|
-
* <Select.Group>
|
|
334
|
-
* <Select.Label>Veggies</Select.Label>
|
|
335
|
-
* <Select.Item value="carrot">Carrot</Select.Item>
|
|
336
|
-
* <Select.Item value="cucumber">Cucumber</Select.Item>
|
|
337
|
-
* </Select.Group>
|
|
338
|
-
* </Select.Content>
|
|
339
|
-
* </Select.Root>
|
|
340
|
-
* ```
|
|
341
|
-
*/
|
|
342
|
-
readonly Value: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
343
|
-
};
|
|
344
|
-
//#endregion
|
|
345
|
-
export { Select as t };
|
package/dist/select-D-5u0Blc.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./compose-refs-Cjf2gfB8.js";import{t}from"./cx-IiQEAKf5.js";import{t as n}from"./icon-CDtYjF_H.js";import{a as r,r as i}from"./validation-Bpptk_9t.js";import{t as a}from"./field-context-BR01g789.js";import{n as o}from"./separator-kBnnv3Cw.js";import{CaretDownIcon as s}from"@phosphor-icons/react/CaretDown";import{createContext as c,forwardRef as l,useContext as u,useMemo as d}from"react";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{CheckIcon as m}from"@phosphor-icons/react/Check";import{CaretUpIcon as h}from"@phosphor-icons/react/CaretUp";import*as g from"@radix-ui/react-select";const _=c({}),v=l(({"aria-invalid":e,children:t,id:n,validation:r,onBlur:i,onValueChange:a,onChange:o,...s},c)=>{let l=d(()=>({"aria-invalid":e,id:n,validation:r,onBlur:i,ref:c}),[e,n,r,i,c]);return f(g.Root,{...s,onValueChange:e=>{o?.(e),a?.(e)},children:f(_.Provider,{value:l,children:t})})});v.displayName=`Select`;const y=l(({className:e,...n},r)=>f(g.Group,{ref:r,"data-slot":`select-group`,className:t(`space-y-px`,e),...n}));y.displayName=`SelectGroup`;const b=g.Value;b.displayName=`SelectValue`;const x=l(({"aria-invalid":o,className:c,children:l,id:d,validation:m,...h},v)=>{let y=u(_),b=u(a),x=r(),{ariaInvalid:S,validation:C}=i({"aria-invalid":b?b[`aria-invalid`]:y[`aria-invalid`]??o,validation:y.validation??m??x}),w=b?b.id:y.id??d;return p(g.Trigger,{"data-slot":`select-trigger`,className:t(`h-9 text-sm`,`border-form bg-form text-strong font-sans placeholder:text-placeholder hover:bg-form-hover hover:text-strong flex w-full items-center justify-between gap-1.5 rounded-md border px-3 py-2 disabled:pointer-events-none disabled:opacity-50 [&>span]:line-clamp-1 [&>span]:text-left`,`hover:border-neutral-400`,`focus:outline-hidden focus:ring-4 aria-expanded:ring-4`,`focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent`,`data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success`,`data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning`,`data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger`,c),"data-validation":C||void 0,id:w,ref:e(v,y.ref),...h,...b?{"aria-describedby":b[`aria-describedby`],"aria-errormessage":b[`aria-errormessage`]}:void 0,"aria-invalid":S,children:[l,f(g.Icon,{asChild:!0,children:f(n,{svg:f(s,{weight:`bold`}),className:`size-4`})})]})});x.displayName=`SelectTrigger`;const S=l(({className:e,...r},i)=>f(g.ScrollUpButton,{ref:i,className:t(`flex cursor-default items-center justify-center py-1`,e),...r,children:f(n,{svg:f(h,{weight:`bold`}),className:`size-4`})}));S.displayName=`SelectScrollUpButton`;const C=l(({className:e,...r},i)=>f(g.ScrollDownButton,{ref:i,className:t(`flex cursor-default items-center justify-center py-1`,e),...r,children:f(n,{svg:f(s,{weight:`bold`}),className:`size-4`})}));C.displayName=`SelectScrollDownButton`;const w=l(({className:e,children:n,position:r=`popper`,width:i=`trigger`,...a},o)=>f(g.Portal,{children:p(g.Content,{ref:o,"data-slot":`select-content`,className:t(`border-popover data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 relative z-50 max-h-96 min-w-32 overflow-hidden rounded-md border shadow-md`,`bg-popover font-sans`,r===`popper`&&`data-side-bottom:translate-y-2 data-side-left:-translate-x-2 data-side-right:translate-x-2 data-side-top:-translate-y-2 max-h-(--radix-select-content-available-height)`,i===`trigger`&&`w-(--radix-select-trigger-width)`,e),position:r,...a,children:[f(S,{}),f(g.Viewport,{className:t(`p-1 space-y-px`,r===`popper`&&`h-(--radix-select-trigger-height) w-full`),children:n}),f(C,{})]})}));w.displayName=`SelectContent`;const T=l(({className:e,...n},r)=>f(g.Label,{ref:r,"data-slot":`select-label`,className:t(`px-2 py-1.5 text-sm font-medium`,e),...n}));T.displayName=`SelectLabel`;const E=l(({className:e,children:r,icon:i,...a},o)=>p(g.Item,{ref:o,"data-slot":`select-item`,className:t(`relative flex gap-2 w-full cursor-pointer select-none items-center rounded-md py-1.5 pl-2 pr-8 text-strong text-sm outline-hidden`,`focus:bg-active-menu-item`,`data-disabled:pointer-events-none data-disabled:opacity-50`,`data-state-checked:bg-selected-menu-item`,`focus:data-state-checked:bg-active-selected-menu-item`,e),...a,children:[i&&f(n,{svg:i}),f(g.ItemText,{children:r}),f(g.ItemIndicator,{className:`absolute right-2 flex h-3.5 w-3.5 items-center justify-center`,children:f(n,{svg:f(m,{weight:`bold`}),className:`size-4 text-accent-600`})})]}));E.displayName=`SelectItem`;const D=l(({className:e,...n},r)=>f(o,{ref:r,"data-slot":`select-separator`,className:t(`-mx-1 my-1 h-px w-auto`,e),...n}));D.displayName=`SelectSeparator`;const O={Root:v,Content:w,Group:y,Item:E,Label:T,Separator:D,Trigger:x,Value:b};export{O as t};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./slot-DmPrjM7N.js";import{createContext as n,forwardRef as r,useContext as i}from"react";import{jsx as a}from"react/jsx-runtime";const o=[`horizontal`,`vertical`],s=n({}),c={orientation:`horizontal`},l=({className:n,children:r,asChild:i,...o})=>{let l=i?t:`div`;return a(s.Provider,{value:c,children:a(l,{"data-slot":`horizontal-separator-group`,"data-horizontal-separator-group":!0,className:e(`group flex items-center gap-2 [&>*:not([data-separator])]:shrink-0`,n),...o,children:r})})};l.displayName=`HorizontalSeparatorGroup`;const u=r(({asChild:n=!1,children:r,className:o,orientation:c,semantic:l=!1,...u},f)=>{let p=n?t:`div`,m=i(s).orientation??(d(c)?c:`horizontal`),h=l?{"aria-orientation":m===`vertical`?m:void 0,role:`separator`}:{role:`none`};return a(p,{"data-slot":`separator`,className:e(`separator`,`bg-separator`,m===`horizontal`?`h-px w-full group-data-horizontal-separator-group:flex-1`:`h-full w-px`,o),"data-orientation":m,"data-separator":!0,...h,ref:f,...n?{children:r}:{},...u})});u.displayName=`Separator`;function d(e){return typeof e==`string`&&o.includes(e)}export{u as n,l as t};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./slot-DmPrjM7N.js";import{forwardRef as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=n(({asChild:n=!1,className:i,...a},o)=>r(n?t:`div`,{"data-slot":`skeleton`,className:e(`dark-high-contrast:bg-black/30 high-contrast:bg-black/30 h-4 animate-pulse rounded-md bg-gray-300/25 dark:bg-gray-950/10`,i),ref:o,...a}));i.displayName=`Skeleton`;export{i as t};
|
package/dist/slot-DmPrjM7N.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{Children as t,cloneElement as n,forwardRef as r,isValidElement as i}from"react";import{jsx as a}from"react/jsx-runtime";import{Slot as o}from"@radix-ui/react-slot";function s(...e){let t=e.filter(e=>e!=null&&e!==``).join(` `);return t===``?void 0:t}const c=r(function({children:r,className:c,"data-slot":l,...u},d){return i(r)?a(o,{ref:d,...u,children:n(r,{...r.props,className:e(c,r.props.className),"data-slot":s(l,r.props[`data-slot`])})}):t.only(r)});export{s as n,c as t};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{Children as t,cloneElement as n,forwardRef as r,isValidElement as i}from"react";import a from"tiny-invariant";const o=r(({className:r,style:o,svg:s,...c},l)=>(a(i(s)&&t.only(s),`SvgOnly must be passed a single SVG icon as a JSX tag.`),n(s,{"data-slot":`svg-only`,...c,className:e(`shrink-0`,r,s.props.className),style:{...o,...s.props.style},ref:l})));o.displayName=`SvgOnly`;export{o as t};
|
package/dist/table-CPH2md2-.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./compose-refs-Cjf2gfB8.js";import{t}from"./cx-IiQEAKf5.js";import{forwardRef as n,useLayoutEffect as r,useMemo as i,useRef as a,useState as o}from"react";import{jsx as s}from"react/jsx-runtime";const c=n(({children:n,className:r,...i},a)=>{let o=v();return s(`div`,{"data-slot":`table`,className:t(`group/table relative w-full overflow-hidden rounded-lg border border-card bg-white dark:bg-gray-100`,r),"data-sticky-active":o.state.hasOverflow&&!o.state.scrolledToEnd||void 0,"data-x-overflow":o.state.hasOverflow,"data-x-scroll-end":o.state.hasOverflow&&o.state.scrolledToEnd,...i,children:s(`div`,{className:t(`scrollbar scroll-fade-x overflow-x-auto overflow-y-clip overscroll-x-none`,`has-data-mantle-table-sticky-right:[--_fade-right:black]`),ref:e(o.ref,a),children:n})})});c.displayName=`TableRoot`;const l=n(({children:e,className:n,...r},i)=>s(`table`,{"data-slot":`table-element`,ref:i,className:t(`table-auto border-separate border-spacing-0 caption-bottom w-full min-w-full text-left`,n),...r,children:e}));l.displayName=`TableElement`;const u=n(({children:e,className:n,...r},i)=>s(`thead`,{"data-slot":`table-head`,ref:i,className:t(`[&>tr:last-child>*]:border-b [&>tr:last-child>*]:border-card-muted`,`[&>tr+tr>*]:border-t [&>tr+tr>*]:border-card-muted`,`text-muted bg-base`,`[&>tr]:bg-base`,n),...r,children:e}));u.displayName=`TableHead`;const d=n(({children:e,className:n,...r},i)=>s(`tbody`,{"data-slot":`table-body`,className:t(`[&>tr+tr>*]:border-t [&>tr+tr>*]:border-card-muted`,`text-body`,`[&>tr]:bg-card [&>tr]:not-only:hover:bg-card-hover`,n),ref:i,...r,children:e}));d.displayName=`TableBody`;const f=n(({children:e,className:n,...r},i)=>s(`tfoot`,{"data-slot":`table-foot`,ref:i,className:t(`font-medium text-body`,`[&>tr:first-child>*]:border-t [&>tr:first-child>*]:border-card-muted`,`[&>tr+tr>*]:border-t [&>tr+tr>*]:border-card-muted`,`[&>tr]:bg-gray-50/50 [&>tr]:hover:bg-card-hover`,n),...r,children:e}));f.displayName=`TableFoot`;const p=n(({children:e,className:n,...r},i)=>s(`tr`,{"data-slot":`table-row`,ref:i,className:t(n),...r,children:e}));p.displayName=`TableRow`;const m=n(({children:e,className:n,...r},i)=>s(`th`,{"data-slot":`table-header`,ref:i,className:t(`h-11 px-4 text-left align-middle text-sm font-medium [&:has([role=checkbox])]:pr-0`,n),...r,children:e}));m.displayName=`TableHeader`;const h=n(({children:e,className:n,...r},i)=>s(`td`,{"data-slot":`table-cell`,ref:i,className:t(`p-3 align-middle [&:has([role=checkbox])]:pr-0 font-mono text-mono`,n),...r,children:e}));h.displayName=`TableCell`;const g=n(({children:e,className:n,...r},i)=>s(`caption`,{"data-slot":`table-caption`,ref:i,className:t(`py-4 text-sm text-gray-500`,`border-t border-card-muted`,n),...r,children:e}));g.displayName=`TableCaption`;const _={Body:d,Caption:g,Cell:h,Element:l,Foot:f,Head:u,Header:m,Root:c,Row:p};function v(){let e=a(null),[t,n]=o({hasOverflow:!1,scrolledToStart:!0,scrolledToEnd:!1});return r(()=>{let t=e.current;if(!t)return;let r=0,i=()=>{let e=t.scrollWidth>t.clientWidth,r=t.scrollLeft<1,i=Math.abs(t.scrollWidth-t.scrollLeft-t.clientWidth)<1;n(t=>t.hasOverflow!==e||t.scrolledToStart!==r||t.scrolledToEnd!==i?{hasOverflow:e,scrolledToStart:r,scrolledToEnd:i}:t)},a=()=>{r===0&&(r=requestAnimationFrame(()=>{r=0,i()}))},o=new ResizeObserver(a);o.observe(t);let s=new MutationObserver(a);return s.observe(t,{childList:!0,subtree:!0}),t.addEventListener(`scroll`,a,{passive:!0}),i(),()=>{cancelAnimationFrame(r),o.disconnect(),s.disconnect(),t.removeEventListener(`scroll`,a)}},[]),i(()=>({ref:e,state:t}),[t])}export{_ as t};
|