@ngrok/mantle 0.77.0 → 0.78.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 +63 -21
- package/dist/accordion.js +1 -1
- package/dist/agent.json +4 -1
- package/dist/alert-dialog.d.ts +19 -26
- package/dist/alert-dialog.js +1 -1
- package/dist/alert.d.ts +16 -24
- package/dist/alert.js +1 -1
- package/dist/{anchor-BtgEJoPN.js → anchor-C_tjSVy6.js} +1 -1
- package/dist/anchor.d.ts +3 -4
- package/dist/anchor.js +1 -1
- package/dist/{as-child-uN_018tj.d.ts → as-child-CYEVu1WY.d.ts} +0 -7
- package/dist/badge.d.ts +5 -56
- package/dist/badge.js +1 -1
- package/dist/breadcrumb.d.ts +212 -0
- package/dist/breadcrumb.js +1 -0
- package/dist/browser-only.d.ts +2 -6
- package/dist/{button-CERx95KE.js → button-5t6-JS_I.js} +1 -1
- package/dist/button-AS5Ir3DE.js +1 -0
- package/dist/{button-mfYak6Rx.d.ts → button-Bw9MpShl.d.ts} +26 -8
- package/dist/button.d.ts +5 -4
- package/dist/button.js +1 -1
- package/dist/calendar.d.ts +2 -8
- package/dist/calendar.js +1 -1
- package/dist/card.d.ts +8 -8
- package/dist/card.js +1 -1
- package/dist/centered-layout.d.ts +147 -0
- package/dist/centered-layout.js +1 -0
- package/dist/checkbox-DJ2xl7Rc.js +1 -0
- package/dist/checkbox.d.ts +9 -11
- package/dist/checkbox.js +1 -1
- package/dist/{choice-D6S38dPs.js → choice-DOdyNzFC.js} +1 -1
- package/dist/choice.d.ts +16 -14
- package/dist/choice.js +1 -1
- package/dist/code-block.d.ts +5 -17
- package/dist/code-block.js +1 -1
- package/dist/code-block_highlight-utils.d.ts +1 -1
- package/dist/code-block_highlight-utils.js +1 -1
- package/dist/code.d.ts +4 -5
- package/dist/code.js +1 -1
- package/dist/combobox.d.ts +40 -19
- package/dist/combobox.js +1 -1
- package/dist/command.d.ts +60 -38
- package/dist/command.js +1 -1
- package/dist/cx-IiQEAKf5.js +1 -0
- package/dist/cx.js +1 -1
- package/dist/data-slot-CChfb_cv.d.ts +17 -0
- package/dist/data-table.d.ts +45 -131
- package/dist/data-table.js +1 -1
- package/dist/description-list.d.ts +7 -7
- package/dist/description-list.js +1 -1
- package/dist/{dialog-uyJcNks7.js → dialog-DVDFVT_-.js} +1 -1
- package/dist/dialog.d.ts +155 -48
- package/dist/dialog.js +1 -1
- package/dist/{direction-CcTY0FmA.d.ts → direction-BjU0bPST.d.ts} +1 -1
- package/dist/{dropdown-menu-OEuW4GLp.js → dropdown-menu-ByUQkAvJ.js} +1 -1
- package/dist/{dropdown-menu-CADgs9gz.d.ts → dropdown-menu-DT30TQzL.d.ts} +21 -24
- package/dist/dropdown-menu.d.ts +2 -1
- package/dist/dropdown-menu.js +1 -1
- package/dist/empty.d.ts +133 -53
- package/dist/empty.js +1 -1
- package/dist/{field-context-4k1kI7Bo.js → field-context-BR01g789.js} +1 -1
- package/dist/field.d.ts +24 -36
- package/dist/field.js +1 -1
- package/dist/flag.d.ts +2 -9
- package/dist/flag.js +1 -1
- package/dist/hooks.d.ts +13 -15
- package/dist/hooks.js +1 -1
- package/dist/hover-card.d.ts +34 -14
- package/dist/hover-card.js +1 -1
- package/dist/icon-CDtYjF_H.js +1 -0
- package/dist/{icon-n49kOh4_.d.ts → icon-Cevjo93X.d.ts} +2 -3
- package/dist/{icon-button-DiX9iZ9n.js → icon-button-CxVsZ2N1.js} +1 -1
- package/dist/{icon-button-D7hs6bX2.d.ts → icon-button-DuRSCsPh.d.ts} +5 -6
- package/dist/icon.d.ts +3 -3
- package/dist/icon.js +1 -1
- package/dist/icons.d.ts +7 -19
- package/dist/icons.js +1 -1
- package/dist/{in-view-bItE1fkG.d.ts → in-view-nkSOdED2.d.ts} +1 -6
- package/dist/index-BnI3OppC.d.ts +1 -0
- package/dist/{index-CTU6apE6.d.ts → index-CDwfBOAA.d.ts} +5 -4
- package/dist/{index-Bed_XLWa.d.ts → index-D47aqlpz.d.ts} +3 -2
- package/dist/index-Rv8RL7xy.d.ts +25 -0
- package/dist/{input-B3TS9yAP.js → input-Ct1YOqSy.js} +1 -1
- package/dist/input.d.ts +10 -11
- package/dist/input.js +1 -1
- package/dist/{kbd-D6k4Dnrf.js → kbd-K8iaZ-Ti.js} +1 -1
- package/dist/kbd.d.ts +3 -8
- package/dist/kbd.js +1 -1
- package/dist/{label-BLXfnQmn.js → label-BMlHW_2D.js} +1 -1
- package/dist/{label-PY0qM0G5.d.ts → label-v2-bv98k.d.ts} +1 -1
- package/dist/label.d.ts +1 -1
- package/dist/label.js +1 -1
- package/dist/list.d.ts +18 -60
- package/dist/list.js +1 -1
- package/dist/llms.txt +4 -1
- package/dist/main.d.ts +4 -27
- package/dist/main.js +1 -1
- package/dist/mantle.css +6 -6
- package/dist/media-object.d.ts +6 -7
- package/dist/media-object.js +1 -1
- package/dist/multi-select.d.ts +80 -33
- package/dist/multi-select.js +1 -1
- package/dist/otp-input.d.ts +7 -8
- package/dist/otp-input.js +1 -1
- package/dist/pagination.d.ts +11 -22
- package/dist/pagination.js +1 -1
- package/dist/{popover-Bq52EC7X.js → popover-D5WxxnBY.js} +1 -1
- package/dist/popover.d.ts +6 -7
- package/dist/popover.js +1 -1
- package/dist/{primitive-FoWela9a.d.ts → primitive-C64-m48O.d.ts} +0 -1
- package/dist/{primitive-BuVqb6zf.js → primitive-wm7Wk-gy.js} +1 -1
- package/dist/progress.d.ts +55 -46
- package/dist/progress.js +1 -1
- package/dist/qr-code.d.ts +10 -9
- package/dist/qr-code.js +1 -1
- package/dist/radio-group.d.ts +71 -60
- package/dist/radio-group.js +1 -1
- package/dist/{resolve-pre-rendered-props-DxJ9-DAl.d.ts → resolve-pre-rendered-props-B6OlZrSI.d.ts} +13 -26
- package/dist/{resolve-pre-rendered-props-DwIF_M_K.js → resolve-pre-rendered-props-C3e5Auo3.js} +1 -1
- package/dist/sandboxed-on-click.d.ts +4 -8
- package/dist/sandboxed-on-click.js +1 -1
- package/dist/{select-BUGOJMER.d.ts → select-Bwt2YduR.d.ts} +11 -12
- package/dist/{select-Bxq_N-_o.js → select-D-5u0Blc.js} +1 -1
- package/dist/select.d.ts +1 -1
- package/dist/select.js +1 -1
- package/dist/selectable-list.d.ts +160 -146
- package/dist/selectable-list.js +1 -1
- package/dist/{separator-CqohKk4z.js → separator-kBnnv3Cw.js} +1 -1
- package/dist/separator.d.ts +6 -37
- package/dist/separator.js +1 -1
- package/dist/sheet.d.ts +231 -47
- package/dist/sheet.js +1 -1
- package/dist/sizes-Dje_rwKc.d.ts +29 -0
- package/dist/skeleton-Bu3tgNcW.js +1 -0
- package/dist/skeleton.d.ts +2 -2
- package/dist/skeleton.js +1 -1
- package/dist/skip-to-main-link.d.ts +4 -34
- package/dist/skip-to-main-link.js +1 -1
- package/dist/slider.d.ts +2 -21
- package/dist/slider.js +1 -1
- package/dist/slot-DmPrjM7N.js +1 -0
- package/dist/slot.d.ts +1 -1
- package/dist/slot.js +1 -1
- package/dist/split-button.d.ts +20 -12
- package/dist/split-button.js +1 -1
- package/dist/{svg-only-f6ToFLH0.d.ts → svg-only-BFeFS1aa.d.ts} +2 -3
- package/dist/{svg-only-CSOaF1tL.js → svg-only-DDx6FtJd.js} +1 -1
- package/dist/switch.d.ts +4 -5
- package/dist/switch.js +1 -1
- package/dist/{table-CAitdL78.js → table-CPH2md2-.js} +1 -1
- package/dist/{table-BWD9IlIN.d.ts → table-CwFHXC-G.d.ts} +10 -10
- package/dist/table.d.ts +1 -1
- package/dist/table.js +1 -1
- package/dist/tabs.d.ts +29 -15
- package/dist/tabs.js +1 -1
- package/dist/text-area.d.ts +2 -3
- package/dist/text-area.js +1 -1
- package/dist/theme-D8kZCOzM.js +1 -0
- package/dist/theme-provider-Djj_jBo6.js +1 -0
- package/dist/theme-switcher.d.ts +45 -0
- package/dist/theme-switcher.js +1 -0
- package/dist/theme.d.ts +15 -101
- package/dist/theme.js +1 -1
- package/dist/{toast-CZBWjXcP.js → toast-RkhbliFh.js} +1 -1
- package/dist/toast.d.ts +13 -37
- package/dist/toast.js +1 -1
- package/dist/tooltip.d.ts +10 -44
- package/dist/tooltip.js +1 -1
- package/dist/{types-CTam1uIW.d.ts → types-C19IR7jf.d.ts} +1 -0
- package/dist/{types-BvUzforF.d.ts → types-D1RY5Tcj.d.ts} +0 -1
- package/dist/types.d.ts +3 -3
- package/dist/use-prefers-reduced-motion-CagaNRgm.js +1 -0
- package/dist/utils.d.ts +2 -3
- package/dist/{validation-xyX_6kph.d.ts → validation-7QeiTFwl.d.ts} +3 -12
- package/dist/{validation-DCyx-ceH.js → validation-Bpptk_9t.js} +1 -1
- package/dist/{virtual-PBNiHjMK.js → virtual-DZMBu7Ch.js} +1 -1
- package/dist/well.d.ts +3 -3
- package/dist/well.js +1 -1
- package/dist/{with-style-props-CyImx7vd.d.ts → with-style-props-Dq5Vntqy.d.ts} +0 -1
- package/package.json +17 -14
- package/dist/button-C9GW9nAr.js +0 -1
- package/dist/checkbox-Apow0ipK.js +0 -1
- package/dist/cx-C1UYP5We.js +0 -1
- package/dist/icon-SUx16Sl3.js +0 -1
- package/dist/index-CJbKEKr2.d.ts +0 -20
- package/dist/slot-DT_E5BQx.js +0 -1
- package/dist/theme-provider-C5XYi2-H.js +0 -1
- package/dist/use-prefers-reduced-motion-DBqNw1wB.js +0 -1
package/dist/checkbox.d.ts
CHANGED
|
@@ -1,16 +1,15 @@
|
|
|
1
|
-
import { o as WithValidation } from "./validation-
|
|
2
|
-
|
|
1
|
+
import { o as WithValidation } from "./validation-7QeiTFwl.js";
|
|
3
2
|
//#region src/components/checkbox/checkbox.d.ts
|
|
4
3
|
type CheckedState = boolean | "indeterminate";
|
|
5
4
|
/**
|
|
6
5
|
* A form control that allows the user to toggle between checked and not checked.
|
|
7
6
|
* Supports indeterminate state.
|
|
8
7
|
*
|
|
9
|
-
* Pair it with a [`Label`](/components/label) for a single-line caption, or
|
|
10
|
-
* compose it inside [`Choice`](/components/choice) for a titled, multi-line
|
|
8
|
+
* Pair it with a [`Label`](/components/forms/label) for a single-line caption, or
|
|
9
|
+
* compose it inside [`Choice`](/components/forms/choice) for a titled, multi-line
|
|
11
10
|
* label with a supplementary description.
|
|
12
11
|
*
|
|
13
|
-
* @see https://mantle.ngrok.com/components/checkbox
|
|
12
|
+
* @see https://mantle.ngrok.com/components/forms/checkbox
|
|
14
13
|
*
|
|
15
14
|
* @example
|
|
16
15
|
* ```tsx
|
|
@@ -22,7 +21,7 @@ type CheckedState = boolean | "indeterminate";
|
|
|
22
21
|
* </form>
|
|
23
22
|
* ```
|
|
24
23
|
*/
|
|
25
|
-
declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "
|
|
24
|
+
declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "checked" | "defaultChecked" | "type"> & WithValidation & {
|
|
26
25
|
/**
|
|
27
26
|
* The controlled checked state of the checkbox. Must be used in conjunction with onChange.
|
|
28
27
|
*/
|
|
@@ -54,11 +53,10 @@ declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<impo
|
|
|
54
53
|
* />
|
|
55
54
|
* ```
|
|
56
55
|
*/
|
|
57
|
-
declare function selectAllChecked({
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
/** Whether every selectable item is currently selected. */allSelected: boolean; /** Whether some (but not necessarily all) items are selected. */
|
|
56
|
+
declare function selectAllChecked({ allSelected, someSelected }: {
|
|
57
|
+
/** Whether every selectable item is currently selected. */
|
|
58
|
+
allSelected: boolean;
|
|
59
|
+
/** Whether some (but not necessarily all) items are selected. */
|
|
62
60
|
someSelected: boolean;
|
|
63
61
|
}): CheckedState;
|
|
64
62
|
//#endregion
|
package/dist/checkbox.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{n as e,t}from"./checkbox-
|
|
1
|
+
import{n as e,t}from"./checkbox-DJ2xl7Rc.js";export{t as Checkbox,e as selectAllChecked};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-
|
|
1
|
+
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./slot-DmPrjM7N.js";import{t as n}from"./field-context-BR01g789.js";import{t as r}from"./label-BMlHW_2D.js";import{cloneElement as i,createContext as a,forwardRef as o,isValidElement as s,useContext as c,useId as l,useMemo as u}from"react";import d from"tiny-invariant";import{jsx as f}from"react/jsx-runtime";const p=a(null);function m(e){let t=c(p);return d(t,`Choice.${e} must be rendered inside Choice.Root.`),t}const h=o(({"aria-describedby":t,"aria-errormessage":r,"aria-invalid":i,children:a,className:o,disabled:s=!1,id:d,name:m,...h},g)=>{let _=c(n),v=_?.id,y=_?.name,b=_?.[`aria-describedby`],x=_?.[`aria-invalid`],S=_?.[`aria-errormessage`],C=l(),w=l(),T=v??d??C,E=[b??t,w].filter(Boolean).join(` `)||void 0,D=u(()=>({controlId:T,descriptionId:w,disabled:s,controlProps:{id:T,name:y??m,disabled:s,"aria-describedby":E,"aria-invalid":x??i,"aria-errormessage":S??r}}),[T,w,s,E,y,m,x,i,S,r]);return f(p.Provider,{value:D,children:f(`div`,{ref:g,"data-slot":`choice`,className:e(`flex w-full items-start gap-2`,o),...h,children:a})})});h.displayName=`Choice`;const g=o(({children:t,className:n,...r},a)=>{let{controlProps:o}=m(`Indicator`),c=s(t)?i(t,{...o,disabled:o.disabled||t.props.disabled===!0,name:o.name??t.props.name,"aria-invalid":o[`aria-invalid`]??t.props[`aria-invalid`],"aria-errormessage":o[`aria-errormessage`]??t.props[`aria-errormessage`]}):t;return f(`span`,{ref:a,"data-slot":`choice-indicator`,className:e(`flex h-lh shrink-0 items-center text-sm`,n),...r,children:c})});g.displayName=`ChoiceIndicator`;const _=o(({asChild:n,className:r,...i},a)=>f(n?t:`div`,{ref:a,"data-slot":`choice-content`,className:e(`flex min-w-0 flex-1 flex-col gap-0.5`,r),...i}));_.displayName=`ChoiceContent`;const v=o(({className:t,...n},i)=>{let{controlId:a,disabled:o}=m(`Label`);return f(r,{ref:i,"data-slot":`choice-label`,className:e(o&&`opacity-50`,t),...n,htmlFor:a,disabled:o})});v.displayName=`ChoiceLabel`;const y=o(({asChild:n,className:r,...i},a)=>{let{disabled:o}=m(`Title`);return f(n?t:`p`,{ref:a,"data-slot":`choice-title`,className:e(`text-strong text-sm font-medium font-sans`,o&&`opacity-50`,r),...i})});y.displayName=`ChoiceTitle`;const b=o(({asChild:n,className:r,...i},a)=>{let{descriptionId:o,disabled:s}=m(`Description`);return f(n?t:`p`,{ref:a,id:o,"data-slot":`choice-description`,className:e(`text-body text-sm leading-4`,s&&`opacity-50`,r),...i})});b.displayName=`ChoiceDescription`;const x={Root:h,Indicator:g,Content:_,Label:v,Title:y,Description:b};export{x as t};
|
package/dist/choice.d.ts
CHANGED
|
@@ -1,14 +1,13 @@
|
|
|
1
|
-
import { t as WithAsChild } from "./as-child-
|
|
2
|
-
import { t as Label } from "./label-
|
|
1
|
+
import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
|
|
2
|
+
import { t as Label } from "./label-v2-bv98k.js";
|
|
3
3
|
import { ComponentProps, ReactNode } from "react";
|
|
4
|
-
|
|
5
4
|
//#region src/components/choice/choice.d.ts
|
|
6
5
|
/**
|
|
7
6
|
* Props for `Choice.Root`. Extends `<div>` props (minus `id`, narrowed below)
|
|
8
7
|
* with the disabled / id / name controls. Inside a `Field.Control`, the field's
|
|
9
8
|
* `id` / `name` / `aria-*` take precedence over these.
|
|
10
9
|
*
|
|
11
|
-
* @see https://mantle.ngrok.com/components/choice
|
|
10
|
+
* @see https://mantle.ngrok.com/components/forms/choice
|
|
12
11
|
*
|
|
13
12
|
* @example
|
|
14
13
|
* ```tsx
|
|
@@ -24,14 +23,17 @@ import { ComponentProps, ReactNode } from "react";
|
|
|
24
23
|
* ```
|
|
25
24
|
*/
|
|
26
25
|
type ChoiceRootProps = Omit<ComponentProps<"div">, "id"> & {
|
|
27
|
-
/** Marks the choice disabled — dims the text and is injected onto the control. */
|
|
26
|
+
/** Marks the choice disabled — dims the text and is injected onto the control. */
|
|
27
|
+
disabled?: boolean;
|
|
28
28
|
/**
|
|
29
29
|
* Explicit control id. Defaults to a generated id, or — when composed inside a
|
|
30
30
|
* `Field.Control` — the field's id, so `Field.Label` and `Choice.Label` resolve
|
|
31
31
|
* to the same control.
|
|
32
32
|
*/
|
|
33
|
-
id?: string;
|
|
34
|
-
name
|
|
33
|
+
id?: string;
|
|
34
|
+
/** Form value name for the control. Inherited from `Field` when composed within one. */
|
|
35
|
+
name?: string;
|
|
36
|
+
/** `Choice.Indicator`, a `Choice.Content` (with `Label` / `Title` + `Description`). */
|
|
35
37
|
children: ReactNode;
|
|
36
38
|
};
|
|
37
39
|
/**
|
|
@@ -44,7 +46,7 @@ type ChoiceRootProps = Omit<ComponentProps<"div">, "id"> & {
|
|
|
44
46
|
* Outside a `Field` it falls back to its own generated ids, so the two compose
|
|
45
47
|
* but neither requires the other.
|
|
46
48
|
*
|
|
47
|
-
* @see https://mantle.ngrok.com/components/choice
|
|
49
|
+
* @see https://mantle.ngrok.com/components/forms/choice
|
|
48
50
|
*
|
|
49
51
|
* @example
|
|
50
52
|
* ```tsx
|
|
@@ -71,7 +73,7 @@ declare const Root: import("react").ForwardRefExoticComponent<Omit<ChoiceRootPro
|
|
|
71
73
|
* title, and centers its child — so the control sits centered on the title's
|
|
72
74
|
* first line and stays put when the title wraps.
|
|
73
75
|
*
|
|
74
|
-
* @see https://mantle.ngrok.com/components/choice
|
|
76
|
+
* @see https://mantle.ngrok.com/components/forms/choice
|
|
75
77
|
*
|
|
76
78
|
* @example
|
|
77
79
|
* ```tsx
|
|
@@ -93,7 +95,7 @@ type ChoiceContentProps = ComponentProps<"div"> & WithAsChild;
|
|
|
93
95
|
* an optional `Choice.Description`. `min-w-0` so long titles truncate instead of
|
|
94
96
|
* pushing the row wide.
|
|
95
97
|
*
|
|
96
|
-
* @see https://mantle.ngrok.com/components/choice
|
|
98
|
+
* @see https://mantle.ngrok.com/components/forms/choice
|
|
97
99
|
*
|
|
98
100
|
* @example
|
|
99
101
|
* ```tsx
|
|
@@ -129,7 +131,7 @@ type ChoiceLabelProps = Omit<ComponentProps<typeof Label>, "htmlFor" | "disabled
|
|
|
129
131
|
* row or a Headless radio item), use `Choice.Title` instead — a label-less `<p>`
|
|
130
132
|
* (it accepts `asChild`) — so labels never nest or compete.
|
|
131
133
|
*
|
|
132
|
-
* @see https://mantle.ngrok.com/components/choice
|
|
134
|
+
* @see https://mantle.ngrok.com/components/forms/choice
|
|
133
135
|
*
|
|
134
136
|
* @example
|
|
135
137
|
* ```tsx
|
|
@@ -154,7 +156,7 @@ declare const ChoiceLabel: import("react").ForwardRefExoticComponent<Omit<Choice
|
|
|
154
156
|
* control — or inside a `Field` — where the title can be the label, use
|
|
155
157
|
* `Choice.Label`.
|
|
156
158
|
*
|
|
157
|
-
* @see https://mantle.ngrok.com/components/choice
|
|
159
|
+
* @see https://mantle.ngrok.com/components/forms/choice
|
|
158
160
|
*
|
|
159
161
|
* @example
|
|
160
162
|
* ```tsx
|
|
@@ -175,7 +177,7 @@ declare const Title: import("react").ForwardRefExoticComponent<Omit<import("reac
|
|
|
175
177
|
* and wired to the control via `aria-describedby` (never a second label).
|
|
176
178
|
* Renders a `<p>`; pass `asChild` to supply your own element.
|
|
177
179
|
*
|
|
178
|
-
* @see https://mantle.ngrok.com/components/choice
|
|
180
|
+
* @see https://mantle.ngrok.com/components/forms/choice
|
|
179
181
|
*
|
|
180
182
|
* @example
|
|
181
183
|
* ```tsx
|
|
@@ -214,7 +216,7 @@ declare const Description: import("react").ForwardRefExoticComponent<Omit<import
|
|
|
214
216
|
* `aria-describedby`. Outside a `Field` it uses its own generated ids — the two
|
|
215
217
|
* are aware of each other but neither is required.
|
|
216
218
|
*
|
|
217
|
-
* @see https://mantle.ngrok.com/components/choice
|
|
219
|
+
* @see https://mantle.ngrok.com/components/forms/choice
|
|
218
220
|
*
|
|
219
221
|
* @example
|
|
220
222
|
* Composition:
|
package/dist/choice.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./choice-
|
|
1
|
+
import{t as e}from"./choice-DOdyNzFC.js";export{e as Choice};
|
package/dist/code-block.d.ts
CHANGED
|
@@ -1,9 +1,8 @@
|
|
|
1
|
-
import { t as WithAsChild } from "./as-child-
|
|
2
|
-
import { t as SvgAttributes } from "./types-
|
|
3
|
-
import { A as FoldStrategy, B as computeJsonFoldRanges, C as Indentation, D as FoldExplanation, E as ComputeFoldRangesInput, F as isSupportedLanguage, H as finalizeFoldRanges, I as parseLanguage, L as supportedLanguages, M as computeFoldRanges, N as foldStrategyFor, O as FoldLine, P as SupportedLanguage, S as normalizeIndentation, T as isIndentation, U as LineRange, V as FoldableRange, _ as MantleCodeBlockValue, a as Mode, c as ResolvedPreRenderedCodeBlockProps, d as parseMetastring, f as resolvePreRenderedCodeBlockProps, g as parseCodeBlockShowLineNumbers, h as parseCodeBlockLineNumberStart, i as MetaInput, j as FoldToken, k as FoldScope, l as defaultMeta, m as parseCodeBlockHighlightLines, n as DefaultMeta, o as ResolvePreRenderedCodeBlockPropsInput, p as tokenizeMetastring, r as Meta, s as ResolvePreRenderedCodeBlockPropsResult, t as CodeBlockPreElementInput, u as normalizeValue, v as MantleCodeOptions, w as inferIndentation, x as mantleCode, y as createMantleCodeBlockValue, z as decorateHighlightedHtml } from "./resolve-pre-rendered-props-
|
|
1
|
+
import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
|
|
2
|
+
import { t as SvgAttributes } from "./types-D1RY5Tcj.js";
|
|
3
|
+
import { A as FoldStrategy, B as computeJsonFoldRanges, C as Indentation, D as FoldExplanation, E as ComputeFoldRangesInput, F as isSupportedLanguage, H as finalizeFoldRanges, I as parseLanguage, L as supportedLanguages, M as computeFoldRanges, N as foldStrategyFor, O as FoldLine, P as SupportedLanguage, S as normalizeIndentation, T as isIndentation, U as LineRange, V as FoldableRange, _ as MantleCodeBlockValue, a as Mode, c as ResolvedPreRenderedCodeBlockProps, d as parseMetastring, f as resolvePreRenderedCodeBlockProps, g as parseCodeBlockShowLineNumbers, h as parseCodeBlockLineNumberStart, i as MetaInput, j as FoldToken, k as FoldScope, l as defaultMeta, m as parseCodeBlockHighlightLines, n as DefaultMeta, o as ResolvePreRenderedCodeBlockPropsInput, p as tokenizeMetastring, r as Meta, s as ResolvePreRenderedCodeBlockPropsResult, t as CodeBlockPreElementInput, u as normalizeValue, v as MantleCodeOptions, w as inferIndentation, x as mantleCode, y as createMantleCodeBlockValue, z as decorateHighlightedHtml } from "./resolve-pre-rendered-props-B6OlZrSI.js";
|
|
4
4
|
import { ComponentProps, HTMLAttributes, ReactNode } from "react";
|
|
5
5
|
import { Content, List, Trigger } from "@radix-ui/react-tabs";
|
|
6
|
-
|
|
7
6
|
//#region src/components/code-block/code-block.d.ts
|
|
8
7
|
type CodeBlockRootProps = Omit<ComponentProps<"div">, "align"> & WithAsChild & {
|
|
9
8
|
/**
|
|
@@ -73,15 +72,7 @@ type CodeBlockIconProps = Omit<SvgAttributes, "children"> & ({
|
|
|
73
72
|
* </CodeBlock.Root>
|
|
74
73
|
* ```
|
|
75
74
|
*/
|
|
76
|
-
declare function CodeBlockIconComponent({
|
|
77
|
-
className,
|
|
78
|
-
preset,
|
|
79
|
-
svg: _svgProp,
|
|
80
|
-
...props
|
|
81
|
-
}: CodeBlockIconProps): import("react").JSX.Element;
|
|
82
|
-
declare namespace CodeBlockIconComponent {
|
|
83
|
-
var displayName: string;
|
|
84
|
-
}
|
|
75
|
+
declare function CodeBlockIconComponent({ className, preset, svg: _svgProp, ...props }: CodeBlockIconProps): import("react").JSX.Element;
|
|
85
76
|
type CodeBlockTabListProps = Omit<ComponentProps<typeof List>, "asChild" | "loop">;
|
|
86
77
|
type CodeBlockTabTriggerProps = Omit<ComponentProps<typeof Trigger>, "asChild">;
|
|
87
78
|
type CodeBlockTabContentProps = Omit<ComponentProps<typeof Content>, "asChild" | "forceMount">;
|
|
@@ -486,10 +477,7 @@ type JsonCodeBlockValueOptions = {
|
|
|
486
477
|
* </CodeBlock.Root>
|
|
487
478
|
* ```
|
|
488
479
|
*/
|
|
489
|
-
declare function jsonCodeBlockValue(value: unknown, {
|
|
490
|
-
showLineNumbers,
|
|
491
|
-
foldable
|
|
492
|
-
}?: JsonCodeBlockValueOptions): MantleCodeBlockValue;
|
|
480
|
+
declare function jsonCodeBlockValue(value: unknown, { showLineNumbers, foldable }?: JsonCodeBlockValueOptions): MantleCodeBlockValue;
|
|
493
481
|
//#endregion
|
|
494
482
|
//#region src/components/code-block/escape-html.d.ts
|
|
495
483
|
/**
|
package/dist/code-block.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{t as e}from"./compose-refs-Cjf2gfB8.js";import{t}from"./cx-
|
|
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{t as r}from"./slot-DmPrjM7N.js";import{t as i}from"./icon-button-CxVsZ2N1.js";import{t as a}from"./use-copy-to-clipboard-DqQ0_N3E.js";import{t as o}from"./traffic-policy-file-0g5RXFqu.js";import{S as s,_ as c,a as l,b as u,c as d,d as f,f as p,g as m,h,i as g,l as _,m as v,n as y,o as b,p as x,r as S,s as C,t as w,u as T,v as E,y as D}from"./resolve-pre-rendered-props-C3e5Auo3.js";import{CaretDownIcon as O}from"@phosphor-icons/react/CaretDown";import{createContext as ee,forwardRef as k,useCallback as A,useContext as te,useEffect as j,useId as ne,useLayoutEffect as re,useMemo as M,useRef as N,useState as P}from"react";import F from"tiny-invariant";import{jsx as I,jsxs as ie}from"react/jsx-runtime";import{CheckIcon as ae}from"@phosphor-icons/react/Check";import{CopyIcon as oe}from"@phosphor-icons/react/Copy";import{FileTextIcon as se}from"@phosphor-icons/react/FileText";import{TerminalIcon as ce}from"@phosphor-icons/react/Terminal";import{Content as le,List as ue,Root as de,Trigger as fe}from"@radix-ui/react-tabs";function L(e){let t=-1;for(let n=0;n<e.length;n++){let r=e[n];if(r===`&`||r===`<`||r===`>`||r===`"`||r===`'`){t=n;break}}if(t===-1)return e;let n=e.slice(0,t);for(let r=t;r<e.length;r++){let t=e[r];switch(t){case`&`:n+=`&`;break;case`<`:n+=`<`;break;case`>`:n+=`>`;break;case`"`:n+=`"`;break;case`'`:n+=`'`;break;default:n+=t}}return n}const R=new WeakMap;function z(e){let t=new Set;if(e==null||e===``)return t;for(let n of e.split(` `))n!==``&&t.add(n);return t}function pe(e){let t=R.get(e);if(t!=null&&ge(t))return t;let n=new Map,r=new WeakMap,i=e.querySelectorAll(`[data-fold-regions]`);for(let e=0;e<i.length;e+=1){let t=i[e];if(!(t instanceof HTMLElement))continue;let a=z(t.dataset.foldRegions);if(a.size!==0){r.set(t,a);for(let e of a){let r=n.get(e);r??(r=[],n.set(e,r)),r.push(t)}}}let a={regionToLines:n,lineToRegions:r};return R.set(e,a),a}function me(e){R.delete(e)}function he(e){me(e),e.removeAttribute(`data-folded-regions`)}function ge(e){for(let t of e.regionToLines.values()){if(t.length===0)continue;let e=t[0];if(e!=null)return e.isConnected}return!0}function _e(e,t,n){let r=!1;for(let e of n)if(t.has(e)){r=!0;break}r?e.dataset.foldHidden=`true`:delete e.dataset.foldHidden}function ve(e){let t=e.dataset.foldLine;if(t==null||t===``)return!1;let n=e.closest(`[data-slot='code-block-code']`)?.querySelector(`code`);if(n==null)return!1;let r=z(n.getAttribute(`data-folded-regions`)),i=!r.has(t);i?r.add(t):r.delete(t),r.size===0?n.removeAttribute(`data-folded-regions`):n.setAttribute(`data-folded-regions`,[...r].join(` `)),e.setAttribute(`aria-expanded`,i?`false`:`true`);let{regionToLines:a,lineToRegions:o}=pe(n),s=a.get(t);if(s!=null)for(let e of s){let t=o.get(e);t!=null&&_e(e,r,t)}return!0}function ye(e){let t=e=>{let t=e.target;if(!(t instanceof Element))return;let n=t.closest(`.mantle-code-fold-toggle`);n instanceof HTMLButtonElement&&ve(n)};return e.addEventListener(`click`,t),()=>{e.removeEventListener(`click`,t)}}const B=ee(null);function V(){let e=te(B);return F(e!=null,`CodeBlock subcomponents must be rendered within a <CodeBlock.Root>.`),e}const H=k(({asChild:e=!1,className:n,defaultTab:i,activeTab:a,onActiveTabChange:o,...s},c)=>{let l=N(``),[u,d]=P(!1),[f,p]=P(!1),[m,h]=P(void 0),g=A(e=>{h(t=>(F(t==null,`You can only render a single CodeBlock.Code within a CodeBlock.`),e))},[]),_=A(e=>{h(t=>{F(t===e,`You can only render a single CodeBlock.Code within a CodeBlock.`)})},[]),v=M(()=>({codeId:m,copyTextRef:l,hasCodeExpander:u,isCodeExpanded:f,registerCodeId:g,setHasCodeExpander:d,setIsCodeExpanded:p,unregisterCodeId:_}),[m,u,f,g,_]),y=i!=null||a!=null,b=I(e?r:`div`,{"data-slot":`code-block`,className:t(`text-mono w-full overflow-hidden rounded-md border border-gray-300 bg-card font-mono`,`[&_svg]:shrink-0`,n),ref:c,...s});return I(B.Provider,{value:v,children:y?I(de,{asChild:!0,defaultValue:i,value:a,onValueChange:o,children:b}):b})});H.displayName=`CodeBlock`;const U=k(({asChild:e=!1,className:n,...i},a)=>I(e?r:`div`,{"data-slot":`code-block-body`,className:t(`relative`,n),ref:a,...i}));U.displayName=`CodeBlockBody`;const be=/SHIKI_VAL_(\d+)/g;function xe(e){return e.replace(/[.*+?^${}()|[\]\\]/g,`\\$&`)}const W=new Map;function Se(e){if(e==null||e.length===0)return be;let t=W.get(e);return t??(W.size>=500&&W.clear(),t=RegExp(`${xe(e)}(\\d+)__`,`g`),W.set(e,t)),t}function G(e,t,n,r){if(n==null){if(!e.includes(`SHIKI_VAL_`))return e}else if(!e.includes(n))return e;return e.replaceAll(Se(n),(e,n)=>{let i=Number.parseInt(n,10);return Number.isNaN(i)||i<0||i>=t.length?e:r(t[i])})}function Ce(e,t,n){return G(e,t,n,e=>L(String(e)))}function we(e,t,n){return G(e,t,n,e=>String(e))}const K=k(({className:n,style:r,value:i,...a},o)=>{let s=ne(),c=N(null),{copyTextRef:l,hasCodeExpander:u,isCodeExpanded:d,registerCodeId:f,unregisterCodeId:p}=V(),{language:m,code:h,"~preValToken":g,"~preVals":_,"~highlightLines":v,"~lineNumberStart":y,"~preHtml":b,"~showLineNumbers":x}=i,S=v,C=y??1,w=x??!1,T=M(()=>_!=null&&_.length>0?we(h,_,g):h,[g,_,h]);re(()=>{l.current=T},[l,T]),j(()=>(f(s),()=>{p(s)}),[s,f,p]);let E=M(()=>{if(b!=null)return _!=null&&_.length>0?Ce(b,_,g):b},[b,g,_]);j(()=>{let e=c.current;if(e==null)return;let t=e.querySelector(`code`);return t!=null&&he(t),ye(e)},[E]);let D=E!=null,O=E??L(T),ee=M(()=>({__html:O}),[O]);return I(`pre`,{"data-slot":`code-block-code`,"aria-expanded":u?d:void 0,className:t(`scrollbar overflow-x-auto overflow-y-hidden py-4`,!D&&`pr-14`,`data-[mantle-line-numbers~='false']:pl-4`,`text-mono m-0 font-mono outline-hidden`,`aria-collapsed:max-h-[13.6rem]`,n),"data-highlighted":D?`true`:`false`,"data-lang":m,"data-mantle-highlight-lines":D&&S!=null&&S.length>0?S.join(`,`):void 0,"data-mantle-line-number-start":D&&w?String(C):`1`,"data-mantle-line-numbers":D&&w?`true`:`false`,id:s,ref:e(c,o),style:{...r,"--mantle-line-number-start":String(C),tabSize:2,MozTabSize:2},...a,children:I(`code`,{className:`text-size-inherit block min-w-full w-max`,dangerouslySetInnerHTML:ee})})});K.displayName=`CodeBlockCode`;const q=k(({asChild:e=!1,className:n,...i},a)=>I(e?r:`div`,{"data-slot":`code-block-header`,className:t(`flex items-center gap-1 border-b border-gray-300 bg-base px-4 py-2 text-gray-700`,n),ref:a,...i}));q.displayName=`CodeBlockHeader`;const J=k(({asChild:e=!1,className:n,...i},a)=>I(e?r:`h3`,{"data-slot":`code-block-title`,ref:a,className:t(`text-mono m-0 font-mono font-normal`,n),...i}));J.displayName=`CodeBlockTitle`;const Y=k(({className:e,label:t=`Copy code`,onCopy:n,onCopyError:r,onClick:o,...s},c)=>{let{copyTextRef:l}=V(),u=a(),[d,f]=P(!1),p=N(void 0);return j(()=>()=>{p.current!=null&&clearTimeout(p.current)},[]),I(`span`,{"data-slot":`code-block-copy-button`,className:`absolute right-3 top-3 z-10 inline-flex size-7 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] bg-card`,children:I(i,{type:`button`,appearance:`ghost`,size:`sm`,label:t,icon:I(d?ae:oe,{}),className:e,ref:c,onClick:async e=>{try{if(o?.(e),e.defaultPrevented){p.current!=null&&clearTimeout(p.current);return}let t=l.current;await u(t),n?.(t),f(!0),p.current!=null&&clearTimeout(p.current),p.current=setTimeout(()=>{f(!1)},2e3)}catch(e){r?.(e)}},...s})})});Y.displayName=`CodeBlockCopyButton`;const X=k(({asChild:e=!1,className:i,onClick:a,...o},s)=>{let{codeId:c,isCodeExpanded:l,setIsCodeExpanded:u,setHasCodeExpander:d}=V();return j(()=>(d(!0),()=>{d(!1)}),[d]),ie(e?r:`button`,{...o,"data-slot":`code-block-expander-button`,"aria-controls":c,"aria-expanded":l,className:t(`flex w-full items-center justify-center gap-0.5 border-t border-gray-300 bg-card px-4 py-2 font-sans text-gray-700 hover:bg-gray-100`,i),ref:s,type:`button`,onClick:e=>{u(e=>!e),a?.(e)},children:[l?`Show less`:`Show more`,` `,I(n,{svg:I(O,{weight:`bold`}),className:t(`size-4`,l&&`rotate-180`,`transition-all duration-150`)})]})});X.displayName=`CodeBlockExpanderButton`;function Z({className:e,preset:t,svg:r,...i}){let a=r;if(t!=null)switch(t){case`file`:a=I(se,{weight:`fill`});break;case`cli`:a=I(ce,{weight:`fill`});break;case`traffic-policy`:a=I(o,{});break}return I(n,{"data-slot":`code-block-icon`,className:e,svg:a,...i})}Z.displayName=`CodeBlockIcon`;const Q=k(({className:e,...n},r)=>I(ue,{"data-slot":`code-block-tab-list`,className:t(`scroll-fade-x flex min-w-0 items-center gap-1 overflow-x-auto overscroll-x-none`,`-m-1 p-1`,e),ref:r,...n}));Q.displayName=`CodeBlockTabList`;const Te=k(({className:e,...n},r)=>I(fe,{"data-slot":`code-block-tab-trigger`,className:t(`shrink-0 cursor-pointer rounded px-1.5 py-0.5 text-xs font-medium whitespace-nowrap`,`text-gray-600 outline-hidden`,`hover:text-gray-900`,`data-[state=active]:bg-neutral-500/15 data-[state=active]:text-strong`,`focus-visible:ring-focus-accent focus-visible:ring-4`,e),ref:r,...n}));Te.displayName=`CodeBlockTabTrigger`;const Ee=k((e,t)=>I(le,{"data-slot":`code-block-tab-content`,ref:t,...e}));Ee.displayName=`CodeBlockTabContent`;const De={Root:H,Body:U,Code:K,CopyButton:Y,ExpanderButton:X,Header:q,Icon:Z,TabContent:Ee,TabList:Q,TabTrigger:Te,Title:J},Oe=`var(--shiki-foreground)`;function ke(e){return e.replace(/[&<]/g,e=>e===`&`?`&`:`<`)}function Ae(e){return e===` `||e===` `||e===`
|
|
2
2
|
`||e===`\r`||e===`{`||e===`}`||e===`[`||e===`]`||e===`:`||e===`,`||e===`"`}function je(e,t,n){let r=e.length,i=[],a=`"`,o=t+1;for(;o<r;){let t=e[o];if(t===`\\`){let t=e[o+1]===`u`&&/^[0-9a-fA-F]{4}$/.test(e.slice(o+2,o+6))?6:2;a!==``&&(i.push({text:a,isEscape:!1}),a=``),i.push({text:e.slice(o,o+t),isEscape:!0}),o+=t;continue}if(t===`"`){a+=`"`,o+=1;break}a+=t,o+=1}a!==``&&i.push({text:a,isEscape:!1});let s=o;for(;s<r;){let t=e[s];if(t===` `||t===` `||t===`
|
|
3
3
|
`||t===`\r`){s+=1;continue}break}let c=e[s]===`:`?`var(--shiki-token-keyword)`:`var(--shiki-token-string-expression)`;for(let e of i)n(e.text,e.isEscape?`var(--shiki-token-escape, var(--shiki-token-constant))`:c);return o}function Me(e){for(let t=0;t<e.length;t+=1){let n=e[t];if(n!=null&&n.color==null){let r=Oe;for(let n=t+1;n<e.length;n+=1){let t=e[n];if(t!=null&&t.color!=null){r=t.color;break}}n.color=r}}let t=``,n=``,r=null,i=()=>{r!=null&&(t+=`<span style="color:${r}">${ke(n)}</span>`),n=``,r=null};for(let t of e)t!=null&&(t.color===r?n+=t.text:(i(),n=t.text,r=t.color));return i(),`<span class="line">${t}</span>`}function $(e){let t=[[]],n=t[0]??[],r=e.length,i=0,a=(e,t)=>{n.push({text:e,color:t})};for(;i<r;){let o=e[i];if(o===`
|
|
4
4
|
`||o===`\r`){o===`\r`&&e[i+1]===`
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { A as FoldStrategy, B as computeJsonFoldRanges, C as Indentation, D as FoldExplanation, E as ComputeFoldRangesInput, F as isSupportedLanguage, H as finalizeFoldRanges, I as parseLanguage, L as supportedLanguages, M as computeFoldRanges, N as foldStrategyFor, O as FoldLine, P as SupportedLanguage, R as DecorateHighlightedHtmlInput, S as normalizeIndentation, T as isIndentation, U as LineRange, V as FoldableRange, b as defaultShowLineNumbers, g as parseCodeBlockShowLineNumbers, h as parseCodeBlockLineNumberStart, j as FoldToken, k as FoldScope, m as parseCodeBlockHighlightLines, p as tokenizeMetastring, u as normalizeValue, w as inferIndentation, z as decorateHighlightedHtml } from "./resolve-pre-rendered-props-
|
|
1
|
+
import { A as FoldStrategy, B as computeJsonFoldRanges, C as Indentation, D as FoldExplanation, E as ComputeFoldRangesInput, F as isSupportedLanguage, H as finalizeFoldRanges, I as parseLanguage, L as supportedLanguages, M as computeFoldRanges, N as foldStrategyFor, O as FoldLine, P as SupportedLanguage, R as DecorateHighlightedHtmlInput, S as normalizeIndentation, T as isIndentation, U as LineRange, V as FoldableRange, b as defaultShowLineNumbers, g as parseCodeBlockShowLineNumbers, h as parseCodeBlockLineNumberStart, j as FoldToken, k as FoldScope, m as parseCodeBlockHighlightLines, p as tokenizeMetastring, u as normalizeValue, w as inferIndentation, z as decorateHighlightedHtml } from "./resolve-pre-rendered-props-B6OlZrSI.js";
|
|
2
2
|
export { type ComputeFoldRangesInput, type DecorateHighlightedHtmlInput, type FoldExplanation, type FoldLine, type FoldScope, type FoldStrategy, type FoldToken, type FoldableRange, type Indentation, type LineRange, type SupportedLanguage, computeFoldRanges, computeJsonFoldRanges, decorateHighlightedHtml, defaultShowLineNumbers, finalizeFoldRanges, foldStrategyFor, inferIndentation, isIndentation, isSupportedLanguage, normalizeIndentation, normalizeValue, parseCodeBlockHighlightLines, parseCodeBlockLineNumberStart, parseCodeBlockShowLineNumbers, parseLanguage, supportedLanguages, tokenizeMetastring };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_ as e,a as t,c as n,d as r,f as i,g as a,h as o,l as s,m as c,n as l,o as u,p as d,s as f,u as p,v as m,x as h,y as g}from"./resolve-pre-rendered-props-
|
|
1
|
+
import{_ as e,a as t,c as n,d as r,f as i,g as a,h as o,l as s,m as c,n as l,o as u,p as d,s as f,u as p,v as m,x as h,y as g}from"./resolve-pre-rendered-props-C3e5Auo3.js";export{o as computeFoldRanges,m as computeJsonFoldRanges,e as decorateHighlightedHtml,h as defaultShowLineNumbers,g as finalizeFoldRanges,a as foldStrategyFor,d as inferIndentation,c as isIndentation,s as isSupportedLanguage,i as normalizeIndentation,l as normalizeValue,u as parseCodeBlockHighlightLines,f as parseCodeBlockLineNumberStart,n as parseCodeBlockShowLineNumbers,p as parseLanguage,r as supportedLanguages,t as tokenizeMetastring};
|
package/dist/code.d.ts
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import { t as WithAsChild } from "./as-child-
|
|
2
|
-
|
|
1
|
+
import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
|
|
3
2
|
//#region src/components/code/code.d.ts
|
|
4
3
|
/**
|
|
5
4
|
* Marks a short fragment of inline computer code — a function name, a
|
|
@@ -11,14 +10,14 @@ import { t as WithAsChild } from "./as-child-uN_018tj.js";
|
|
|
11
10
|
* - Wrap technical terms that should visually stand apart from running text.
|
|
12
11
|
*
|
|
13
12
|
* **When not to use**
|
|
14
|
-
* - For multi-line or syntax-highlighted blocks. Use {@link https://mantle.ngrok.com/components/code-block CodeBlock} instead.
|
|
15
|
-
* - For keyboard shortcuts. Use {@link https://mantle.ngrok.com/components/kbd Kbd}.
|
|
13
|
+
* - For multi-line or syntax-highlighted blocks. Use {@link https://mantle.ngrok.com/components/data-display/code-block CodeBlock} instead.
|
|
14
|
+
* - For keyboard shortcuts. Use {@link https://mantle.ngrok.com/components/data-display/kbd Kbd}.
|
|
16
15
|
* - For arbitrary monospace text that isn't code (use a plain monospace utility class).
|
|
17
16
|
*
|
|
18
17
|
* **Polymorphism.** Pass `asChild` to render `Code` styling on a different
|
|
19
18
|
* element (e.g. a link wrapping a code-styled label).
|
|
20
19
|
*
|
|
21
|
-
* @see https://mantle.ngrok.com/components/code
|
|
20
|
+
* @see https://mantle.ngrok.com/components/data-display/code
|
|
22
21
|
*
|
|
23
22
|
* @example
|
|
24
23
|
* ```tsx
|
package/dist/code.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-
|
|
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,className:i,...a},o)=>r(n?t:`code`,{ref:o,"data-slot":`code`,className:e(`border-gray-500/15 rounded-md border bg-gray-500/5 px-1 font-mono text-[0.8em]`,i),...a}));i.displayName=`Code`;export{i as Code};
|
package/dist/combobox.d.ts
CHANGED
|
@@ -1,9 +1,36 @@
|
|
|
1
|
-
import { t as WithAsChild } from "./as-child-
|
|
2
|
-
import { o as WithValidation } from "./validation-
|
|
1
|
+
import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
|
|
2
|
+
import { o as WithValidation } from "./validation-7QeiTFwl.js";
|
|
3
3
|
import * as Primitive from "@ariakit/react";
|
|
4
|
-
|
|
5
4
|
//#region src/components/combobox/combobox.d.ts
|
|
6
5
|
type ComboboxProps = Primitive.ComboboxProviderProps;
|
|
6
|
+
/**
|
|
7
|
+
* Root component for a combobox. Provides a combobox store that controls the state of Combobox components.
|
|
8
|
+
*
|
|
9
|
+
* Use Combobox for a list of options where the user types to filter — large static lists,
|
|
10
|
+
* async/server-side data, or any single-select where search is helpful. For very small
|
|
11
|
+
* finite lists with no filtering, prefer Select. For multi-selection, prefer MultiSelect.
|
|
12
|
+
*
|
|
13
|
+
* `Combobox.Content` renders at Tailwind `z-50`, Mantle's shared floating
|
|
14
|
+
* z-index. When multiple shared layers are open, the most recently mounted
|
|
15
|
+
* layer renders on top.
|
|
16
|
+
*
|
|
17
|
+
* @see https://mantle.ngrok.com/components/forms/combobox#comboboxroot
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* ```tsx
|
|
21
|
+
* <Combobox.Root>
|
|
22
|
+
* <Combobox.Input />
|
|
23
|
+
* <Combobox.Content>
|
|
24
|
+
* <Combobox.Item value="Apple" />
|
|
25
|
+
* <Combobox.Item value="Banana" />
|
|
26
|
+
* </Combobox.Content>
|
|
27
|
+
* </Combobox.Root>
|
|
28
|
+
* ```
|
|
29
|
+
*/
|
|
30
|
+
declare const Root: {
|
|
31
|
+
({ children, ...props }: ComboboxProps): import("react").JSX.Element;
|
|
32
|
+
displayName: string;
|
|
33
|
+
};
|
|
7
34
|
type ComboboxInputProps = Omit<Primitive.ComboboxProps, "render"> & WithValidation;
|
|
8
35
|
type ComboboxContentProps = Omit<Primitive.ComboboxPopoverProps, "render"> & WithAsChild;
|
|
9
36
|
type ComboboxItemProps = Omit<Primitive.ComboboxItemProps, "render"> & WithAsChild;
|
|
@@ -27,7 +54,7 @@ type ComboboxItemValueProps = Omit<Primitive.ComboboxItemValueProps<"span">, "re
|
|
|
27
54
|
* @see https://www.w3.org/WAI/ARIA/apg/patterns/combobox/
|
|
28
55
|
* @see https://ariakit.org/components/combobox
|
|
29
56
|
*
|
|
30
|
-
* @see https://mantle.ngrok.com/components/combobox
|
|
57
|
+
* @see https://mantle.ngrok.com/components/forms/combobox
|
|
31
58
|
*
|
|
32
59
|
* @example
|
|
33
60
|
* Composition:
|
|
@@ -65,7 +92,7 @@ declare const Combobox: {
|
|
|
65
92
|
* z-index. When multiple shared layers are open, the most recently mounted
|
|
66
93
|
* layer renders on top.
|
|
67
94
|
*
|
|
68
|
-
* @see https://mantle.ngrok.com/components/combobox#comboboxroot
|
|
95
|
+
* @see https://mantle.ngrok.com/components/forms/combobox#comboboxroot
|
|
69
96
|
*
|
|
70
97
|
* @example
|
|
71
98
|
* ```tsx
|
|
@@ -78,13 +105,7 @@ declare const Combobox: {
|
|
|
78
105
|
* </Combobox.Root>
|
|
79
106
|
* ```
|
|
80
107
|
*/
|
|
81
|
-
readonly Root:
|
|
82
|
-
({
|
|
83
|
-
children,
|
|
84
|
-
...props
|
|
85
|
-
}: ComboboxProps): import("react").JSX.Element;
|
|
86
|
-
displayName: string;
|
|
87
|
-
};
|
|
108
|
+
readonly Root: typeof Root;
|
|
88
109
|
/**
|
|
89
110
|
* Renders a popover that contains combobox content, e.g. Combobox.Items, Combobox.Groups, and Combobox.Separators.
|
|
90
111
|
*
|
|
@@ -92,7 +113,7 @@ declare const Combobox: {
|
|
|
92
113
|
* z-index. When multiple shared layers are open, the most recently mounted
|
|
93
114
|
* layer renders on top.
|
|
94
115
|
*
|
|
95
|
-
* @see https://mantle.ngrok.com/components/combobox#comboboxcontent
|
|
116
|
+
* @see https://mantle.ngrok.com/components/forms/combobox#comboboxcontent
|
|
96
117
|
*
|
|
97
118
|
* @example
|
|
98
119
|
* ```tsx
|
|
@@ -109,7 +130,7 @@ declare const Combobox: {
|
|
|
109
130
|
/**
|
|
110
131
|
* Renders a group for Combobox.Item elements.
|
|
111
132
|
*
|
|
112
|
-
* @see https://mantle.ngrok.com/components/combobox#comboboxgroup
|
|
133
|
+
* @see https://mantle.ngrok.com/components/forms/combobox#comboboxgroup
|
|
113
134
|
*
|
|
114
135
|
* @example
|
|
115
136
|
* ```tsx
|
|
@@ -129,7 +150,7 @@ declare const Combobox: {
|
|
|
129
150
|
/**
|
|
130
151
|
* Renders a label in a combobox group.
|
|
131
152
|
*
|
|
132
|
-
* @see https://mantle.ngrok.com/components/combobox#comboboxgrouplabel
|
|
153
|
+
* @see https://mantle.ngrok.com/components/forms/combobox#comboboxgrouplabel
|
|
133
154
|
*
|
|
134
155
|
* @example
|
|
135
156
|
* ```tsx
|
|
@@ -149,7 +170,7 @@ declare const Combobox: {
|
|
|
149
170
|
/**
|
|
150
171
|
* Renders a combobox input element that can be used to filter a list of items.
|
|
151
172
|
*
|
|
152
|
-
* @see https://mantle.ngrok.com/components/combobox#comboboxinput
|
|
173
|
+
* @see https://mantle.ngrok.com/components/forms/combobox#comboboxinput
|
|
153
174
|
*
|
|
154
175
|
* @example
|
|
155
176
|
* ```tsx
|
|
@@ -166,7 +187,7 @@ declare const Combobox: {
|
|
|
166
187
|
/**
|
|
167
188
|
* Renders a combobox item inside a Combobox.Content component.
|
|
168
189
|
*
|
|
169
|
-
* @see https://mantle.ngrok.com/components/combobox#comboboxitem
|
|
190
|
+
* @see https://mantle.ngrok.com/components/forms/combobox#comboboxitem
|
|
170
191
|
*
|
|
171
192
|
* @example
|
|
172
193
|
* ```tsx
|
|
@@ -184,7 +205,7 @@ declare const Combobox: {
|
|
|
184
205
|
/**
|
|
185
206
|
* Highlights the match between the current Combobox.Input value and parent Combobox.Item value.
|
|
186
207
|
*
|
|
187
|
-
* @see https://mantle.ngrok.com/components/combobox#comboboxitemvalue
|
|
208
|
+
* @see https://mantle.ngrok.com/components/forms/combobox#comboboxitemvalue
|
|
188
209
|
*
|
|
189
210
|
* @example
|
|
190
211
|
* ```tsx
|
|
@@ -207,7 +228,7 @@ declare const Combobox: {
|
|
|
207
228
|
/**
|
|
208
229
|
* Renders a separator between Combobox.Items or Combobox.Groups.
|
|
209
230
|
*
|
|
210
|
-
* @see https://mantle.ngrok.com/components/combobox#comboboxseparator
|
|
231
|
+
* @see https://mantle.ngrok.com/components/forms/combobox#comboboxseparator
|
|
211
232
|
*
|
|
212
233
|
* @example
|
|
213
234
|
* ```tsx
|
package/dist/combobox.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-
|
|
1
|
+
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./slot-DmPrjM7N.js";import{a as n,r}from"./validation-Bpptk_9t.js";import{n as i}from"./separator-kBnnv3Cw.js";import{createContext as a,forwardRef as o}from"react";import{jsx as s}from"react/jsx-runtime";import*as c from"@ariakit/react";const l=({children:e,...t})=>s(c.ComboboxProvider,{...t,children:e});l.displayName=`Combobox`;const u=o(({"aria-invalid":t,autoComplete:i=`list`,autoSelect:a=`always`,className:o,validation:l,...u},d)=>{let f=n(),{ariaInvalid:p,validation:m}=r({"aria-invalid":t,validation:l??f});return s(c.Combobox,{"aria-invalid":p,autoComplete:i,autoSelect:a,"data-slot":`combobox-input`,className:e(`pointer-coarse:text-base h-9 text-sm`,`bg-form relative block w-full rounded-md border px-3 py-2 border-form text-strong font-sans`,`placeholder:text-placeholder`,`aria-disabled:opacity-50`,`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`,`autofill:shadow-(--color-blue-50) autofill:bg-blue-50 autofill:[-webkit-text-fill-color:var(--text-color-strong)]`,o),"data-validation":m||void 0,ref:d,...u})});u.displayName=`ComboboxInput`;const d=o(({asChild:n=!1,children:r,className:i,sameWidth:a=!0,unmountOnHide:o=!0,...l},u)=>s(c.ComboboxPopover,{"data-slot":`combobox-content`,className:e(`border-popover bg-popover relative z-50 max-h-96 min-w-32 scrollbar overflow-y-scroll overflow-x-hidden rounded-md border shadow-md p-1 my-2 space-y-px font-sans focus:outline-hidden`,i),ref:u,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,sameWidth:a,unmountOnHide:o,...l,children:r}));d.displayName=`ComboboxContent`;const f=a(void 0),p=o(({asChild:n=!1,children:r,className:i,focusOnHover:a=!0,value:o,...l},u)=>s(f.Provider,{value:o,children:s(c.ComboboxItem,{"data-slot":`combobox-item`,className:e(`cursor-pointer rounded-md px-2 py-1.5 text-strong text-sm flex min-w-0 gap-2 items-center [&>svg]:size-5 [&_svg]:shrink-0`,`data-active-item:bg-active-menu-item`,`aria-disabled:opacity-50`,i),focusOnHover:a,ref:u,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,value:o,...l,children:r})}));p.displayName=`ComboboxItem`;const m=o(({asChild:n=!1,children:r,className:i,...a},o)=>s(c.ComboboxGroup,{"data-slot":`combobox-group`,className:e(`space-y-px`,i),ref:o,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,...a,children:r}));m.displayName=`ComboboxGroup`;const h=o(({asChild:n=!1,children:r,className:i,...a},o)=>s(c.ComboboxGroupLabel,{"data-slot":`combobox-group-label`,className:e(`text-muted px-2 py-1 text-xs font-medium`,i),ref:o,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,...a,children:r}));h.displayName=`ComboboxGroupLabel`;const g=o(({asChild:n=!1,className:r,...i},a)=>s(c.ComboboxItemValue,{"data-slot":`combobox-item-value`,className:e(`*:data-user-value:font-medium flex-1 shrink-0 text-strong font-normal`,r),ref:a,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,...i}));g.displayName=`ComboboxItemValue`;const _=o(({className:t,...n},r)=>s(i,{ref:r,"data-slot":`combobox-separator`,className:e(`-mx-1.25 my-1 w-auto`,t),...n}));_.displayName=`ComboboxSeparator`;const v={Root:l,Content:d,Group:m,GroupLabel:h,Input:u,Item:p,ItemValue:g,Separator:_};export{v as Combobox};
|