@ngrok/mantle 0.80.0 → 0.81.1
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 +19 -37
- package/dist/accordion.js +1 -1
- package/dist/agent.json +5 -1
- package/dist/alert-dialog.d.ts +15 -48
- package/dist/alert-dialog.js +1 -1
- package/dist/alert.d.ts +167 -83
- package/dist/alert.js +1 -1
- package/dist/{anchor-_2meGDfj.js → anchor-DfeXTpKW.js} +1 -1
- package/dist/anchor.js +1 -1
- package/dist/area-chart.d.ts +505 -0
- package/dist/area-chart.js +1 -0
- package/dist/badge.js +1 -1
- package/dist/bar-chart.d.ts +492 -0
- package/dist/bar-chart.js +1 -0
- package/dist/breadcrumb.d.ts +6 -24
- package/dist/breadcrumb.js +1 -1
- package/dist/button-BAno7KIU.js +1 -0
- package/dist/{index-C2jj8U4a.d.ts → button-C-gMbPso.d.ts} +2 -2
- package/dist/{icon-button-C1AfGnQx.d.ts → button-C7vAl6lS.d.ts} +16 -3
- package/dist/{button-BPMwa2jN.d.ts → button-DARFK2KJ.d.ts} +1 -1
- package/dist/{button-5WsvzIQ6.js → button-DjpEKt2X.js} +1 -1
- package/dist/button-DvHMWAPl.js +1 -0
- package/dist/button.d.ts +5 -5
- package/dist/button.js +1 -1
- package/dist/calendar.js +1 -1
- package/dist/card.d.ts +5 -20
- package/dist/card.js +1 -1
- package/dist/centered-layout.d.ts +5 -20
- package/dist/centered-layout.js +1 -1
- package/dist/chart-1cVjAcj8.d.ts +334 -0
- package/dist/chart-Do2qkrxl.js +2 -0
- package/dist/checkbox-0EoxOyMA.js +1 -0
- package/dist/checkbox.d.ts +13 -1
- package/dist/checkbox.js +1 -1
- package/dist/choice-BHwFSSyv.js +1 -0
- package/dist/{choice-Ct0KK8jw.d.ts → choice-BNRQXszu.d.ts} +5 -20
- package/dist/choice.d.ts +1 -1
- package/dist/choice.js +1 -1
- package/dist/code-block.d.ts +60 -44
- package/dist/code-block.js +6 -6
- package/dist/code-block_highlight-utils.d.ts +1 -1
- package/dist/code-block_highlight-utils.js +1 -1
- package/dist/combobox.d.ts +9 -33
- package/dist/combobox.js +1 -1
- package/dist/command.d.ts +70 -18
- package/dist/command.js +1 -1
- package/dist/data-table.d.ts +6 -12
- package/dist/data-table.js +1 -1
- package/dist/description-list.d.ts +40 -32
- package/dist/description-list.js +1 -1
- package/dist/{primitive-CJRIlrLz.d.ts → dialog-BM4wPCft.d.ts} +9 -16
- package/dist/dialog-DWZWd5Jt.js +1 -0
- package/dist/dialog.d.ts +13 -43
- package/dist/dialog.js +1 -1
- package/dist/dropdown-menu-BbbQuae2.d.ts +1 -0
- package/dist/{dropdown-menu-CoyozLzy.d.ts → dropdown-menu-D6pMAY7I.d.ts} +156 -54
- package/dist/dropdown-menu-RyDWoKHx.js +1 -0
- package/dist/dropdown-menu.d.ts +2 -2
- package/dist/dropdown-menu.js +1 -1
- package/dist/empty.d.ts +6 -21
- package/dist/empty.js +1 -1
- package/dist/field-B1wqeZr4.js +1 -0
- package/dist/field.d.ts +26 -53
- package/dist/field.js +1 -1
- package/dist/flag.d.ts +1 -1
- package/dist/hooks.js +1 -1
- package/dist/hover-card.d.ts +3 -12
- package/dist/hover-card.js +1 -1
- package/dist/{svg-only-CdI_v82i.d.ts → icon-CX_gj6sW.d.ts} +1 -1
- package/dist/{icon-BDqpcZ-n.d.ts → icon-k4E9yNWD.d.ts} +1 -1
- package/dist/icon-lZ48P8Nn.js +1 -0
- package/dist/icon.d.ts +3 -3
- package/dist/icon.js +1 -1
- package/dist/icons-DLCs1hLP.js +1 -0
- package/dist/icons.d.ts +53 -2
- package/dist/icons.js +1 -1
- package/dist/input-BnlpQF0c.js +1 -0
- package/dist/{input-DV9M6K4v.d.ts → input-BuYDU6CF.d.ts} +1 -1
- package/dist/input.d.ts +2 -2
- package/dist/input.js +1 -1
- package/dist/line-chart.d.ts +491 -0
- package/dist/line-chart.js +1 -0
- package/dist/{virtual-UrzmaSQm.js → list-51KQvENW.js} +1 -1
- package/dist/list.d.ts +5 -20
- package/dist/list.js +1 -1
- package/dist/llms.txt +5 -1
- package/dist/mantle-dark-high-contrast.css +17 -0
- package/dist/mantle-dark.css +13 -0
- package/dist/mantle-light-high-contrast.css +15 -0
- package/dist/mantle.css +29 -0
- package/dist/media-object.d.ts +45 -12
- package/dist/media-object.js +1 -1
- package/dist/multi-select.d.ts +14 -53
- package/dist/multi-select.js +1 -1
- package/dist/otp-input.d.ts +5 -17
- package/dist/otp-input.js +1 -1
- package/dist/pagination.d.ts +11 -21
- package/dist/pagination.js +1 -1
- package/dist/{index-B8mIWKIU.d.ts → popover-CE4OlWkd.d.ts} +1 -4
- package/dist/popover-CQ9s7jG5.js +1 -0
- package/dist/popover.d.ts +1 -1
- package/dist/popover.js +1 -1
- package/dist/primitive-trJDqIXJ.js +1 -0
- package/dist/progress.d.ts +2 -8
- package/dist/progress.js +1 -1
- package/dist/qr-code.d.ts +4 -16
- package/dist/qr-code.js +1 -1
- package/dist/radio-group.d.ts +129 -40
- package/dist/radio-group.js +1 -1
- package/dist/sandboxed-on-click.d.ts +2 -2
- package/dist/scatter-plot.d.ts +495 -0
- package/dist/scatter-plot.js +1 -0
- package/dist/{select-idm1jy7y.d.ts → select-0z7HVS6r.d.ts} +8 -29
- package/dist/select-BCHWvmyC.js +1 -0
- package/dist/select.d.ts +1 -1
- package/dist/select.js +1 -1
- package/dist/selectable-list.d.ts +11 -38
- package/dist/selectable-list.js +1 -1
- package/dist/sheet.d.ts +22 -49
- package/dist/sheet.js +1 -1
- package/dist/skip-to-main-link.js +1 -1
- package/dist/slider.js +1 -1
- package/dist/slot.d.ts +1 -1
- package/dist/split-button.d.ts +155 -31
- package/dist/split-button.js +1 -1
- package/dist/switch.d.ts +1 -1
- package/dist/switch.js +1 -1
- package/dist/table-CGxJwtbL.js +1 -0
- package/dist/{table-DUSvU_Jw.d.ts → table-CZBYEmyK.d.ts} +11 -38
- package/dist/table.d.ts +1 -1
- package/dist/table.js +1 -1
- package/dist/tabs.d.ts +21 -36
- package/dist/tabs.js +1 -1
- package/dist/text-area.d.ts +2 -2
- package/dist/text-area.js +1 -1
- package/dist/theme-C26-Xolp.js +1 -0
- package/dist/{themes-CYNpplwN.d.ts → theme-FbfjYiD3.d.ts} +16 -0
- package/dist/theme-switcher.d.ts +6 -15
- package/dist/theme-switcher.js +1 -1
- package/dist/theme.d.ts +42 -2
- package/dist/theme.js +1 -1
- package/dist/toast.d.ts +9 -17
- package/dist/toast.js +1 -1
- package/dist/tooltip.d.ts +26 -8
- package/dist/tooltip.js +1 -1
- package/dist/types.js +1 -1
- package/package.json +20 -14
- package/dist/checkbox-Cq17y0-R.js +0 -1
- package/dist/choice-Cc8dA5r8.js +0 -1
- package/dist/dialog-CQ2C6vkE.js +0 -1
- package/dist/dropdown-menu-CSCDdA3K.js +0 -1
- package/dist/field-context-BR01g789.js +0 -1
- package/dist/icon-CGgMKpJg.js +0 -1
- package/dist/icon-button-DiOhreJD.js +0 -1
- package/dist/index-CdPXa9h1.d.ts +0 -1
- package/dist/input-CVyAVbim.js +0 -1
- package/dist/popover-CBMADtjV.js +0 -1
- package/dist/primitive-DCPHJsRs.js +0 -1
- package/dist/select-SR_9-bxA.js +0 -1
- package/dist/table-GDkapNFi.js +0 -1
- package/dist/theme-provider-BftkIiZn.js +0 -1
- package/dist/theme-wVnzzx2F.js +0 -1
- package/dist/toast-DKgMRv4F.js +0 -1
- /package/dist/{sizes-BCoI4bhP.d.ts → button-BCoI4bhP.d.ts} +0 -0
- /package/dist/{intents-DdSKSj1c.d.ts → button-DdSKSj1c.d.ts} +0 -0
- /package/dist/{resolve-pre-rendered-props-B6OlZrSI.d.ts → code-block-B6OlZrSI.d.ts} +0 -0
- /package/dist/{resolve-pre-rendered-props-C9uaM9-V.js → code-block-C9uaM9-V.js} +0 -0
- /package/dist/{validation-7QeiTFwl.d.ts → field-7QeiTFwl.d.ts} +0 -0
- /package/dist/{validation-Bpptk_9t.js → field-Bpptk_9t.js} +0 -0
- /package/dist/{types-D1RY5Tcj.d.ts → icon-D1RY5Tcj.d.ts} +0 -0
- /package/dist/{svg-only-d-nMCfAI.js → icon-d-nMCfAI.js} +0 -0
- /package/dist/{sort-B_DDQcVD.js → icons-B_DDQcVD.js} +0 -0
- /package/dist/{traffic-policy-file-CF1lbWtp.js → icons-CF1lbWtp.js} +0 -0
- /package/dist/{is-input-CXmS0OFN.js → input-CXmS0OFN.js} +0 -0
- /package/dist/{index-BtwKJTLq.d.ts → slot-BtwKJTLq.d.ts} +0 -0
package/dist/accordion.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { n as WithAsChild } from "./as-child-D23mGo4f.js";
|
|
2
|
-
import { n as IconProps } from "./icon-
|
|
2
|
+
import { n as IconProps } from "./icon-k4E9yNWD.js";
|
|
3
3
|
import { ComponentProps } from "react";
|
|
4
4
|
//#region src/components/accordion/accordion.d.ts
|
|
5
5
|
/**
|
|
@@ -78,7 +78,7 @@ type AccordionRootProps = (AccordionSingleProps | AccordionMultipleProps) & Omit
|
|
|
78
78
|
* other divider in the system. Disable the dividers with `divide-y-0` on the root
|
|
79
79
|
* (e.g. pair it with `space-y-*` for a spaced-card layout).
|
|
80
80
|
*
|
|
81
|
-
* @see https://mantle.ngrok.com/components/data-display/accordion#
|
|
81
|
+
* @see https://mantle.ngrok.com/components/data-display/accordion#accordionroot
|
|
82
82
|
*
|
|
83
83
|
* @example
|
|
84
84
|
* <Accordion.Root type="single" defaultValue="shipping">
|
|
@@ -93,10 +93,7 @@ type AccordionRootProps = (AccordionSingleProps | AccordionMultipleProps) & Omit
|
|
|
93
93
|
* </Accordion.Item>
|
|
94
94
|
* </Accordion.Root>
|
|
95
95
|
*/
|
|
96
|
-
declare const Root:
|
|
97
|
-
(props: AccordionRootProps): import("react").JSX.Element;
|
|
98
|
-
displayName: string;
|
|
99
|
-
};
|
|
96
|
+
declare const Root: (props: AccordionRootProps) => import("react").JSX.Element;
|
|
100
97
|
/**
|
|
101
98
|
* A single collapsible section, rendered as a plain `<div role="group">` — the
|
|
102
99
|
* same accessibility role the browser gives a native `<details>`. Derives its
|
|
@@ -105,7 +102,7 @@ declare const Root: {
|
|
|
105
102
|
* Because the item is just a `<div>`, its header can be any layout — e.g. a flex
|
|
106
103
|
* row with the {@link Trigger} alongside a separate, non-toggling action button.
|
|
107
104
|
*
|
|
108
|
-
* @see https://mantle.ngrok.com/components/data-display/accordion#
|
|
105
|
+
* @see https://mantle.ngrok.com/components/data-display/accordion#accordionitem
|
|
109
106
|
*
|
|
110
107
|
* @example
|
|
111
108
|
* <Accordion.Root type="single" defaultValue="item-1">
|
|
@@ -120,13 +117,10 @@ declare const Root: {
|
|
|
120
117
|
* </Accordion.Item>
|
|
121
118
|
* </Accordion.Root>
|
|
122
119
|
*/
|
|
123
|
-
declare const Item: {
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
}): import("react").JSX.Element;
|
|
128
|
-
displayName: string;
|
|
129
|
-
};
|
|
120
|
+
declare const Item: ({ children, value, ref, ...props }: ComponentProps<"div"> & {
|
|
121
|
+
/** The unique value identifying this item within its accordion. */
|
|
122
|
+
value: string;
|
|
123
|
+
}) => import("react").JSX.Element;
|
|
130
124
|
/**
|
|
131
125
|
* The interactive header that toggles its section, rendered as a `<button>` with
|
|
132
126
|
* `aria-expanded` — the disclosure semantics a native `<summary>` provides, but
|
|
@@ -134,7 +128,7 @@ declare const Item: {
|
|
|
134
128
|
* role varies). Place the {@link TriggerIcon} as the last child so the default
|
|
135
129
|
* `justify-between` layout pushes it to the trailing edge.
|
|
136
130
|
*
|
|
137
|
-
* @see https://mantle.ngrok.com/components/data-display/accordion#
|
|
131
|
+
* @see https://mantle.ngrok.com/components/data-display/accordion#accordiontrigger
|
|
138
132
|
*
|
|
139
133
|
* @example
|
|
140
134
|
* <Accordion.Root type="single" defaultValue="item-1">
|
|
@@ -149,17 +143,14 @@ declare const Item: {
|
|
|
149
143
|
* </Accordion.Item>
|
|
150
144
|
* </Accordion.Root>
|
|
151
145
|
*/
|
|
152
|
-
declare const Trigger: {
|
|
153
|
-
({ className, children, onClick, ref, ...props }: Omit<ComponentProps<"button">, "type">): import("react").JSX.Element;
|
|
154
|
-
displayName: string;
|
|
155
|
-
};
|
|
146
|
+
declare const Trigger: ({ className, children, onClick, ref, ...props }: Omit<ComponentProps<"button">, "type">) => import("react").JSX.Element;
|
|
156
147
|
/**
|
|
157
148
|
* The icon that indicates the open/closed state of its {@link Trigger}. Defaults
|
|
158
149
|
* to a downward caret that rotates 180° when the section is open. Pass `svg` to
|
|
159
150
|
* override it with any icon (the rotation-on-open still applies; override
|
|
160
151
|
* `className` to change that).
|
|
161
152
|
*
|
|
162
|
-
* @see https://mantle.ngrok.com/components/data-display/accordion#
|
|
153
|
+
* @see https://mantle.ngrok.com/components/data-display/accordion#accordiontriggericon
|
|
163
154
|
*
|
|
164
155
|
* @example
|
|
165
156
|
* // Default caret
|
|
@@ -191,13 +182,10 @@ declare const Trigger: {
|
|
|
191
182
|
* </Accordion.Item>
|
|
192
183
|
* </Accordion.Root>
|
|
193
184
|
*/
|
|
194
|
-
declare const TriggerIcon: {
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
}): import("react").JSX.Element;
|
|
199
|
-
displayName: string;
|
|
200
|
-
};
|
|
185
|
+
declare const TriggerIcon: ({ className, svg, ...props }: Omit<IconProps, "svg"> & {
|
|
186
|
+
/** The icon to render. Defaults to a downward caret that rotates open. */
|
|
187
|
+
svg?: IconProps["svg"];
|
|
188
|
+
}) => import("react").JSX.Element;
|
|
201
189
|
/**
|
|
202
190
|
* The collapsible region of an {@link Item} — the zero-padding viewport that
|
|
203
191
|
* slides open and closed. Wrap its children in {@link Body} for the standard
|
|
@@ -209,7 +197,7 @@ declare const TriggerIcon: {
|
|
|
209
197
|
* the section when the browser reveals a match. It is flow content, so it may
|
|
210
198
|
* contain anything — including interactive elements.
|
|
211
199
|
*
|
|
212
|
-
* @see https://mantle.ngrok.com/components/data-display/accordion#
|
|
200
|
+
* @see https://mantle.ngrok.com/components/data-display/accordion#accordioncontent
|
|
213
201
|
*
|
|
214
202
|
* @example
|
|
215
203
|
* <Accordion.Root type="single" defaultValue="item-1">
|
|
@@ -224,10 +212,7 @@ declare const TriggerIcon: {
|
|
|
224
212
|
* </Accordion.Item>
|
|
225
213
|
* </Accordion.Root>
|
|
226
214
|
*/
|
|
227
|
-
declare const Content: {
|
|
228
|
-
({ className, children, ref, ...props }: ComponentProps<"div">): import("react").JSX.Element;
|
|
229
|
-
displayName: string;
|
|
230
|
-
};
|
|
215
|
+
declare const Content: ({ className, children, ref, ...props }: ComponentProps<"div">) => import("react").JSX.Element;
|
|
231
216
|
/**
|
|
232
217
|
* The padded inner region of an {@link Item}'s {@link Content} — where the
|
|
233
218
|
* section's body content lives. Owns the body's padding so {@link Content} can
|
|
@@ -241,7 +226,7 @@ declare const Content: {
|
|
|
241
226
|
* Override `className` to retune the padding (e.g. `pb-0`, `px-6`); `cx` resolves
|
|
242
227
|
* last-wins.
|
|
243
228
|
*
|
|
244
|
-
* @see https://mantle.ngrok.com/components/data-display/accordion#
|
|
229
|
+
* @see https://mantle.ngrok.com/components/data-display/accordion#accordionbody
|
|
245
230
|
*
|
|
246
231
|
* @example
|
|
247
232
|
* <Accordion.Root type="single" defaultValue="item-1">
|
|
@@ -258,10 +243,7 @@ declare const Content: {
|
|
|
258
243
|
* </Accordion.Item>
|
|
259
244
|
* </Accordion.Root>
|
|
260
245
|
*/
|
|
261
|
-
declare const Body: {
|
|
262
|
-
({ className, ref, ...props }: ComponentProps<"div">): import("react").JSX.Element;
|
|
263
|
-
displayName: string;
|
|
264
|
-
};
|
|
246
|
+
declare const Body: ({ className, ref, ...props }: ComponentProps<"div">) => import("react").JSX.Element;
|
|
265
247
|
/**
|
|
266
248
|
* A vertically stacked set of disclosure sections styled after the shadcn /
|
|
267
249
|
* ngrok.com accordion.
|
package/dist/accordion.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{n as t}from"./compose-refs-BdBMM9ga.js";import{t as n}from"./cx-IiQEAKf5.js";import{t as r}from"./icon-
|
|
1
|
+
import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{n as t}from"./compose-refs-BdBMM9ga.js";import{t as n}from"./cx-IiQEAKf5.js";import{t as r}from"./icon-lZ48P8Nn.js";import{t as i}from"./slot-CDk0Bb9z.js";import{CaretDownIcon as a}from"@phosphor-icons/react/CaretDown";import{createContext as o,useCallback as s,useContext as c,useEffect as l,useMemo as u,useRef as d,useState as f}from"react";import p from"tiny-invariant";import{jsx as m}from"react/jsx-runtime";function h(e,t){return e.includes(t)}function g(e,t,n,r){let i=e.includes(t);return n?r===`single`?i&&e.length===1?e:[t]:i?e:[...e,t]:i?e.filter(e=>e!==t):e}function _(e){return e==null?[]:typeof e==`string`?e===``?[]:[e]:e}function v(e,t){e.type===`single`?e.onValueChange?.(t[0]??``):e.onValueChange?.([...t])}function y(){return typeof document<`u`&&document.body!=null&&`onbeforematch`in document.body}const b=o(null);function x(e){let t=c(b);return p(t,`\`${e}\` must be rendered within \`Accordion.Root\`.`),t}const S=o(null);function C(e){let t=c(S);return p(t,`\`${e}\` must be rendered within \`Accordion.Item\`.`),t}const w=e=>{let{type:t=`multiple`,value:r,defaultValue:a,onValueChange:o,asChild:s,children:c,className:l,ref:d,...p}=e,h=r!=null,[y,x]=f(()=>_(a)),S=h?_(r):y,C=u(()=>({type:t,openValues:S,setItemOpen:(n,r)=>{let i=g(S,n,r,t);i!==S&&(h||x(i),v(e,i))}}),[t,S,h,e]),w={...p,"data-slot":`accordion`,className:n(`w-full divide-y divide-separator`,l)};return m(b.Provider,{value:C,children:m(s?i:`div`,{ref:d,...w,children:c})})},T=({children:e,value:t,ref:n,...r})=>{let{openValues:i,setItemOpen:a}=x(`Accordion.Item`),o=h(i,t),c=s(e=>{a(t,e)},[a,t]),l=u(()=>({open:o,setOpen:c}),[o,c]);return m(S.Provider,{value:l,children:m(`div`,{ref:n,...r,role:`group`,"data-slot":`accordion-item`,"data-state":o?`open`:`closed`,children:e})})},E=({className:e,children:t,onClick:r,ref:i,...a})=>{let{open:o,setOpen:s}=C(`Accordion.Trigger`);return m(`button`,{ref:i,type:`button`,...a,"data-slot":`accordion-trigger`,"data-state":o?`open`:`closed`,"aria-expanded":o,className:n(`group flex w-full cursor-pointer items-center justify-between gap-4 py-4 text-left font-medium outline-none`,`-mx-2 rounded-md px-2`,`transition-[padding] duration-200 ease-out data-state-open:pb-2 motion-reduce:transition-none`,`focus:outline-hidden focus-visible:ring-4 focus-visible:ring-focus-accent`,e),onClick:e=>{r?.(e),s(!o)},children:t})},D=m(a,{weight:`bold`}),O={Root:w,Item:T,Trigger:E,TriggerIcon:({className:e,svg:t=D,...i})=>m(r,{...i,"data-slot":`accordion-trigger-icon`,svg:t,className:n(`size-4 shrink-0 text-muted transition-transform duration-200 group-data-state-open:rotate-180`,e)}),Content:({className:r,children:i,ref:a,...o})=>{let{open:s,setOpen:c}=C(`Accordion.Content`),u=d(null),f=t(u,a);return l(()=>{let e=u.current;if(!e||!y())return;let t=()=>{e.removeAttribute(`hidden`),e.style.height=`auto`,c(!0)};return e.addEventListener(`beforematch`,t),()=>{e.removeEventListener(`beforematch`,t)}},[c]),e(()=>{let e=u.current;e&&(s||!y()?e.removeAttribute(`hidden`):(e.setAttribute(`hidden`,`until-found`),e.style.height=``))},[s]),m(`div`,{ref:f,...o,"data-slot":`accordion-content`,"data-state":s?`open`:`closed`,className:n(`h-0 overflow-hidden transition-[height,content-visibility] duration-200 ease-out [interpolate-size:allow-keywords] transition-discrete data-state-open:h-auto motion-reduce:transition-none`,r),children:i})},Body:({className:e,ref:t,...r})=>m(`div`,{ref:t,...r,"data-slot":`accordion-body`,className:n(`pt-2 pb-4`,e)})};export{O as Accordion};
|
package/dist/agent.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ngrok/mantle",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.81.1",
|
|
4
4
|
"origin": "https://mantle.ngrok.com",
|
|
5
5
|
"endpoints": {
|
|
6
6
|
"docs": "https://mantle.ngrok.com/",
|
|
@@ -20,7 +20,9 @@
|
|
|
20
20
|
"@ngrok/mantle/alert",
|
|
21
21
|
"@ngrok/mantle/alert-dialog",
|
|
22
22
|
"@ngrok/mantle/anchor",
|
|
23
|
+
"@ngrok/mantle/area-chart",
|
|
23
24
|
"@ngrok/mantle/badge",
|
|
25
|
+
"@ngrok/mantle/bar-chart",
|
|
24
26
|
"@ngrok/mantle/breadcrumb",
|
|
25
27
|
"@ngrok/mantle/browser-only",
|
|
26
28
|
"@ngrok/mantle/button",
|
|
@@ -50,6 +52,7 @@
|
|
|
50
52
|
"@ngrok/mantle/input",
|
|
51
53
|
"@ngrok/mantle/kbd",
|
|
52
54
|
"@ngrok/mantle/label",
|
|
55
|
+
"@ngrok/mantle/line-chart",
|
|
53
56
|
"@ngrok/mantle/list",
|
|
54
57
|
"@ngrok/mantle/main",
|
|
55
58
|
"@ngrok/mantle/media-object",
|
|
@@ -61,6 +64,7 @@
|
|
|
61
64
|
"@ngrok/mantle/qr-code",
|
|
62
65
|
"@ngrok/mantle/radio-group",
|
|
63
66
|
"@ngrok/mantle/sandboxed-on-click",
|
|
67
|
+
"@ngrok/mantle/scatter-plot",
|
|
64
68
|
"@ngrok/mantle/select",
|
|
65
69
|
"@ngrok/mantle/selectable-list",
|
|
66
70
|
"@ngrok/mantle/separator",
|
package/dist/alert-dialog.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { n as WithAsChild } from "./as-child-D23mGo4f.js";
|
|
2
|
-
import { t as SvgAttributes } from "./
|
|
3
|
-
import { t as ButtonIntent } from "./
|
|
4
|
-
import { n as ButtonAppearance, r as ButtonProps } from "./button-
|
|
5
|
-
import { a as Root$1, n as Content$1, o as Title$1, r as Description$1, s as Trigger$1, t as Close$1 } from "./
|
|
2
|
+
import { t as SvgAttributes } from "./icon-D1RY5Tcj.js";
|
|
3
|
+
import { t as ButtonIntent } from "./button-DdSKSj1c.js";
|
|
4
|
+
import { n as ButtonAppearance, r as ButtonProps } from "./button-DARFK2KJ.js";
|
|
5
|
+
import { a as Root$1, n as Content$1, o as Title$1, r as Description$1, s as Trigger$1, t as Close$1 } from "./dialog-BM4wPCft.js";
|
|
6
6
|
import { ComponentProps, ReactNode } from "react";
|
|
7
7
|
//#region src/components/alert-dialog/alert-dialog.d.ts
|
|
8
8
|
declare const intents: readonly ["info", "danger"];
|
|
@@ -92,10 +92,7 @@ declare function Root({ intent, ...props }: AlertDialogProps): import("react").J
|
|
|
92
92
|
* </AlertDialog.Root>
|
|
93
93
|
* ```
|
|
94
94
|
*/
|
|
95
|
-
declare const Trigger: {
|
|
96
|
-
({ ref, ...props }: ComponentProps<typeof Trigger$1>): import("react").JSX.Element;
|
|
97
|
-
displayName: string;
|
|
98
|
-
};
|
|
95
|
+
declare const Trigger: ({ ref, ...props }: ComponentProps<typeof Trigger$1>) => import("react").JSX.Element;
|
|
99
96
|
type AlertDialogContentProps = ComponentProps<typeof Content$1> & {
|
|
100
97
|
/**
|
|
101
98
|
* The preferred width of the `AlertDialogContent` as a tailwind `max-w-` class.
|
|
@@ -148,10 +145,7 @@ type AlertDialogContentProps = ComponentProps<typeof Content$1> & {
|
|
|
148
145
|
* </AlertDialog.Root>
|
|
149
146
|
* ```
|
|
150
147
|
*/
|
|
151
|
-
declare const Content: {
|
|
152
|
-
({ className, preferredWidth, ref, ...props }: AlertDialogContentProps): import("react").JSX.Element;
|
|
153
|
-
displayName: string;
|
|
154
|
-
};
|
|
148
|
+
declare const Content: ({ className, preferredWidth, ref, ...props }: AlertDialogContentProps) => import("react").JSX.Element;
|
|
155
149
|
/**
|
|
156
150
|
* Contains the main content of the alert dialog.
|
|
157
151
|
*
|
|
@@ -187,10 +181,7 @@ declare const Content: {
|
|
|
187
181
|
* </AlertDialog.Root>
|
|
188
182
|
* ```
|
|
189
183
|
*/
|
|
190
|
-
declare const Body: {
|
|
191
|
-
({ asChild, className, ref, ...props }: ComponentProps<"div"> & WithAsChild): import("react").JSX.Element;
|
|
192
|
-
displayName: string;
|
|
193
|
-
};
|
|
184
|
+
declare const Body: ({ asChild, className, ref, ...props }: ComponentProps<"div"> & WithAsChild) => import("react").JSX.Element;
|
|
194
185
|
/**
|
|
195
186
|
* Contains the header content of the dialog, including the title and description.
|
|
196
187
|
*
|
|
@@ -226,10 +217,7 @@ declare const Body: {
|
|
|
226
217
|
* </AlertDialog.Root>
|
|
227
218
|
* ```
|
|
228
219
|
*/
|
|
229
|
-
declare const Header: {
|
|
230
|
-
({ asChild, className, ref, ...props }: ComponentProps<"div"> & WithAsChild): import("react").JSX.Element;
|
|
231
|
-
displayName: string;
|
|
232
|
-
};
|
|
220
|
+
declare const Header: ({ asChild, className, ref, ...props }: ComponentProps<"div"> & WithAsChild) => import("react").JSX.Element;
|
|
233
221
|
/**
|
|
234
222
|
* Contains the footer content of the dialog, including the action and cancel buttons.
|
|
235
223
|
*
|
|
@@ -265,10 +253,7 @@ declare const Header: {
|
|
|
265
253
|
* </AlertDialog.Root>
|
|
266
254
|
* ```
|
|
267
255
|
*/
|
|
268
|
-
declare const Footer: {
|
|
269
|
-
({ asChild, className, ref, ...props }: ComponentProps<"div"> & WithAsChild): import("react").JSX.Element;
|
|
270
|
-
displayName: string;
|
|
271
|
-
};
|
|
256
|
+
declare const Footer: ({ asChild, className, ref, ...props }: ComponentProps<"div"> & WithAsChild) => import("react").JSX.Element;
|
|
272
257
|
/**
|
|
273
258
|
* An accessible name to be announced when the dialog is opened.
|
|
274
259
|
*
|
|
@@ -307,10 +292,7 @@ declare const Footer: {
|
|
|
307
292
|
* </AlertDialog.Root>
|
|
308
293
|
* ```
|
|
309
294
|
*/
|
|
310
|
-
declare const Title: {
|
|
311
|
-
({ className, ref, ...props }: ComponentProps<typeof Title$1>): import("react").JSX.Element;
|
|
312
|
-
displayName: string;
|
|
313
|
-
};
|
|
295
|
+
declare const Title: ({ className, ref, ...props }: ComponentProps<typeof Title$1>) => import("react").JSX.Element;
|
|
314
296
|
/**
|
|
315
297
|
* An accessible description to be announced when the dialog is opened.
|
|
316
298
|
* Renders as a `div` by default, but can be changed to any other element using
|
|
@@ -351,10 +333,7 @@ declare const Title: {
|
|
|
351
333
|
* </AlertDialog.Root>
|
|
352
334
|
* ```
|
|
353
335
|
*/
|
|
354
|
-
declare const Description: {
|
|
355
|
-
({ className, ref, ...props }: ComponentProps<typeof Description$1>): import("react").JSX.Element;
|
|
356
|
-
displayName: string;
|
|
357
|
-
};
|
|
336
|
+
declare const Description: ({ className, ref, ...props }: ComponentProps<typeof Description$1>) => import("react").JSX.Element;
|
|
358
337
|
type AlertDialogActionProps = Omit<ButtonProps, "appearance" | "intent"> & {
|
|
359
338
|
/**
|
|
360
339
|
* The visual style of the action button. Optional here — `AlertDialog.Action`
|
|
@@ -414,10 +393,7 @@ type AlertDialogActionProps = Omit<ButtonProps, "appearance" | "intent"> & {
|
|
|
414
393
|
* </AlertDialog.Root>
|
|
415
394
|
* ```
|
|
416
395
|
*/
|
|
417
|
-
declare const Action: {
|
|
418
|
-
({ appearance, intent, ref, ...props }: AlertDialogActionProps): import("react").JSX.Element;
|
|
419
|
-
displayName: string;
|
|
420
|
-
};
|
|
396
|
+
declare const Action: ({ appearance, intent, ref, ...props }: AlertDialogActionProps) => import("react").JSX.Element;
|
|
421
397
|
type AlertDialogCancelProps = Omit<ButtonProps, "appearance" | "intent"> & {
|
|
422
398
|
/**
|
|
423
399
|
* The visual style of the cancel button. Optional here — `AlertDialog.Cancel`
|
|
@@ -475,10 +451,7 @@ type AlertDialogCancelProps = Omit<ButtonProps, "appearance" | "intent"> & {
|
|
|
475
451
|
* </AlertDialog.Root>
|
|
476
452
|
* ```
|
|
477
453
|
*/
|
|
478
|
-
declare const Cancel: {
|
|
479
|
-
({ appearance, className, intent, ref, ...props }: AlertDialogCancelProps): import("react").JSX.Element;
|
|
480
|
-
displayName: string;
|
|
481
|
-
};
|
|
454
|
+
declare const Cancel: ({ appearance, className, intent, ref, ...props }: AlertDialogCancelProps) => import("react").JSX.Element;
|
|
482
455
|
type AlertDialogIconProps = Omit<SvgAttributes, "children"> & {
|
|
483
456
|
svg?: ReactNode;
|
|
484
457
|
};
|
|
@@ -522,10 +495,7 @@ type AlertDialogIconProps = Omit<SvgAttributes, "children"> & {
|
|
|
522
495
|
* </AlertDialog.Root>
|
|
523
496
|
* ```
|
|
524
497
|
*/
|
|
525
|
-
declare const Icon: {
|
|
526
|
-
({ className, ref, svg, ...props }: AlertDialogIconProps): import("react").JSX.Element;
|
|
527
|
-
displayName: string;
|
|
528
|
-
};
|
|
498
|
+
declare const Icon: ({ className, ref, svg, ...props }: AlertDialogIconProps) => import("react").JSX.Element;
|
|
529
499
|
/**
|
|
530
500
|
* A button that closes the Alert Dialog. (Unstyled)
|
|
531
501
|
*
|
|
@@ -568,10 +538,7 @@ declare const Icon: {
|
|
|
568
538
|
* </AlertDialog.Root>
|
|
569
539
|
* ```
|
|
570
540
|
*/
|
|
571
|
-
declare const Close: {
|
|
572
|
-
({ ref, ...props }: ComponentProps<typeof Close$1>): import("react").JSX.Element;
|
|
573
|
-
displayName: string;
|
|
574
|
-
};
|
|
541
|
+
declare const Close: ({ ref, ...props }: ComponentProps<typeof Close$1>) => import("react").JSX.Element;
|
|
575
542
|
/**
|
|
576
543
|
* A modal dialog that interrupts the user with important content and expects a
|
|
577
544
|
* response. Use AlertDialog for destructive or irreversible confirmations
|
package/dist/alert-dialog.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./
|
|
1
|
+
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-d-nMCfAI.js";import{t as n}from"./slot-CDk0Bb9z.js";import{t as r}from"./button-DjpEKt2X.js";import{a as i,c as a,i as o,n as s,o as c,r as l,s as u,t as d}from"./primitive-trJDqIXJ.js";import{createContext as f,useContext as p,useMemo as m}from"react";import h from"tiny-invariant";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{InfoIcon as v}from"@phosphor-icons/react/Info";import{WarningIcon as y}from"@phosphor-icons/react/Warning";const b=f(null);function x(){let e=p(b);return h(e,`AlertDialog child component used outside of AlertDialog parent!`),e}function S({intent:e,...t}){let n=m(()=>({intent:e}),[e]);return g(b.Provider,{value:n,children:g(c,{...t})})}const C=({ref:e,...t})=>g(a,{ref:e,"data-slot":`alert-dialog-trigger`,...t}),w=i,T=({className:t,ref:n,...r})=>g(o,{"data-slot":`alert-dialog-overlay`,className:e(`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-xs`,t),...r,ref:n}),E=({className:t,preferredWidth:n=`max-w-md`,ref:r,...i})=>_(w,{children:[g(T,{}),g(`div`,{className:`fixed inset-4 z-50 flex items-center justify-center`,children:g(s,{"data-slot":`alert-dialog-content`,"data-mantle-modal-content":!0,ref:r,className:e(`flex w-full flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start`,`outline-hidden focus-within:outline-hidden`,`p-6`,`border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200`,`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`,n,t),...i})})]}),D=({asChild:t=!1,className:r,ref:i,...a})=>g(t?n:`div`,{"data-slot":`alert-dialog-body`,className:e(`flex-1 space-y-4`,r),ref:i,...a}),O=({asChild:t=!1,className:r,ref:i,...a})=>g(t?n:`div`,{"data-slot":`alert-dialog-header`,className:e(`flex flex-col space-y-2 text-center sm:text-start`,r),ref:i,...a}),k=({asChild:t=!1,className:r,ref:i,...a})=>g(t?n:`div`,{"data-slot":`alert-dialog-footer`,className:e(`flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2`,r),ref:i,...a}),A=({className:t,ref:n,...r})=>g(u,{ref:n,"data-slot":`alert-dialog-title`,className:e(`text-strong text-center text-lg font-medium sm:text-start`,t),...r}),j=({className:t,ref:n,...r})=>g(l,{ref:n,"data-slot":`alert-dialog-description`,className:e(`text-body text-center text-sm font-normal sm:text-start`,t),...r}),M={danger:`danger`,info:`neutral`},N=({appearance:e=`filled`,intent:t,ref:n,...i})=>{let a=x(),o=M[a.intent];return g(r,{appearance:e,"data-slot":`alert-dialog-action`,intent:t??o,ref:n,...i})},P=({appearance:t=`outlined`,className:n,intent:i=`neutral`,ref:a,...o})=>g(d,{asChild:!0,children:g(r,{appearance:t,"data-slot":`alert-dialog-cancel`,className:e(`mt-2 sm:mt-0`,n),intent:i,ref:a,...o})}),F={danger:g(y,{}),info:g(v,{})},I={danger:`text-danger-600`,info:`text-accent-600`},L={Root:S,Action:N,Body:D,Cancel:P,Close:({ref:e,...t})=>g(d,{ref:e,"data-slot":`alert-dialog-close`,...t}),Content:E,Description:j,Footer:k,Header:O,Icon:({className:n,ref:r,svg:i,...a})=>{let o=x(),s=I[o.intent],c=F[o.intent];return g(t,{ref:r,"data-slot":`alert-dialog-icon`,className:e(`size-12 sm:size-7`,s,n),svg:i??c,...a})},Title:A,Trigger:C};export{L as AlertDialog};
|