@ngrok/mantle 0.66.17 → 0.68.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/README.md +32 -0
- package/dist/accordion.d.ts +9 -9
- package/dist/alert-dialog.d.ts +30 -30
- package/dist/alert-dialog.js +1 -1
- package/dist/alert.d.ts +12 -12
- package/dist/alert.js +1 -1
- package/dist/alert.js.map +1 -1
- package/dist/anchor.d.ts +3 -3
- package/dist/{as-child-XMVTepJu.d.ts → as-child-CRRsxi3Y.d.ts} +1 -1
- package/dist/badge.d.ts +4 -4
- package/dist/badge.js +1 -1
- package/dist/badge.js.map +1 -1
- package/dist/booleanish-CBGdPL3Q.js.map +1 -1
- package/dist/button-BKykcpgJ.js +2 -0
- package/dist/button-BKykcpgJ.js.map +1 -0
- package/dist/{button-ByK1wG1b.d.ts → button-BaNwe1ud.d.ts} +12 -12
- package/dist/button.d.ts +3 -3
- package/dist/button.js +1 -1
- package/dist/calendar.d.ts +2 -2
- package/dist/calendar.js +1 -1
- package/dist/card.d.ts +7 -7
- package/dist/checkbox.d.ts +4 -4
- package/dist/checkbox.js +1 -1
- package/dist/checkbox.js.map +1 -1
- package/dist/code-block.d.ts +187 -260
- package/dist/code-block.js +2 -8
- package/dist/code-block.js.map +1 -1
- package/dist/code-block_highlight-utils.d.ts +2 -0
- package/dist/code-block_highlight-utils.js +1 -0
- package/dist/code.d.ts +2 -2
- package/dist/code.js +1 -1
- package/dist/code.js.map +1 -1
- package/dist/color.d.ts +1 -1
- package/dist/color.js +1 -1
- package/dist/color.js.map +1 -1
- package/dist/combobox.d.ts +13 -13
- package/dist/combobox.js +1 -1
- package/dist/combobox.js.map +1 -1
- package/dist/command.d.ts +33 -33
- package/dist/command.js +1 -1
- package/dist/command.js.map +1 -1
- package/dist/data-table.d.ts +14 -14
- package/dist/data-table.js +1 -1
- package/dist/data-table.js.map +1 -1
- package/dist/{deep-non-nullable-BLM3Gz0I.d.ts → deep-non-nullable-BBByg3-i.d.ts} +1 -1
- package/dist/description-list.d.ts +6 -6
- package/dist/description-list.js +1 -1
- package/dist/description-list.js.map +1 -1
- package/dist/{dialog-DUOIIhuN.js → dialog-DxkpMIzB.js} +2 -2
- package/dist/{dialog-DUOIIhuN.js.map → dialog-DxkpMIzB.js.map} +1 -1
- package/dist/dialog.d.ts +17 -17
- package/dist/dialog.js +1 -1
- package/dist/{direction-DfrtFTny.js → direction-Ca88oQhP.js} +1 -1
- package/dist/{direction-DfrtFTny.js.map → direction-Ca88oQhP.js.map} +1 -1
- package/dist/{direction-DYYpi-JC.d.ts → direction-MVSxfKWx.d.ts} +2 -2
- package/dist/{dropdown-menu-CUwyTKyu.js → dropdown-menu-9nO7ch0t.js} +2 -2
- package/dist/{dropdown-menu-CUwyTKyu.js.map → dropdown-menu-9nO7ch0t.js.map} +1 -1
- package/dist/{dropdown-menu-BEjpuGrT.d.ts → dropdown-menu-D6MiVSR-.d.ts} +24 -24
- package/dist/dropdown-menu.d.ts +1 -1
- package/dist/dropdown-menu.js +1 -1
- package/dist/flag.d.ts +2 -2
- package/dist/hooks.d.ts +8 -4
- package/dist/hooks.js +1 -1
- package/dist/hover-card.d.ts +6 -6
- package/dist/{icon-B1XLv02t.d.ts → icon-Dh1ONyO_.d.ts} +4 -4
- package/dist/icon-button-CxxVPiKp.js +2 -0
- package/dist/icon-button-CxxVPiKp.js.map +1 -0
- package/dist/{icon-button-2r6S3HVA.d.ts → icon-button-gO-7F_MZ.d.ts} +8 -8
- package/dist/icon.d.ts +3 -3
- package/dist/icons.d.ts +10 -10
- package/dist/icons.js +1 -1
- package/dist/{in-view-ca-moloX.d.ts → in-view-DS0PgFGa.d.ts} +1 -1
- package/dist/{in-view-bPnaWEL4.js → in-view-DiFJ28EF.js} +1 -1
- package/dist/{in-view-bPnaWEL4.js.map → in-view-DiFJ28EF.js.map} +1 -1
- package/dist/{index-s8rMcilU.d.ts → index-BerTFFEC.d.ts} +1 -1
- package/dist/{index-DWqhfw9n.d.ts → index-Bw97R9Kw.d.ts} +9 -9
- package/dist/{index-BLCvtjLi.d.ts → index-C3IiAC5H.d.ts} +3 -3
- package/dist/{index-ViSCOUrU.d.ts → index-Cj2NX2Dg.d.ts} +6 -6
- package/dist/input.d.ts +2 -2
- package/dist/input.js +1 -1
- package/dist/{is-input-BFR8yMM7.js → is-input-CC_n6EGM.js} +1 -1
- package/dist/{is-input-BFR8yMM7.js.map → is-input-CC_n6EGM.js.map} +1 -1
- package/dist/{kbd-CtTyMWXB.js → kbd-wgm9K9D5.js} +1 -1
- package/dist/{kbd-CtTyMWXB.js.map → kbd-wgm9K9D5.js.map} +1 -1
- package/dist/kbd.d.ts +2 -2
- package/dist/kbd.js +1 -1
- package/dist/label.d.ts +3 -3
- package/dist/mantle-dark-high-contrast.css +18 -9
- package/dist/mantle-dark.css +37 -43
- package/dist/mantle-light-high-contrast.css +15 -9
- package/dist/mantle.css +154 -143
- package/dist/media-object.d.ts +5 -5
- package/dist/multi-select.d.ts +18 -18
- package/dist/multi-select.js +1 -1
- package/dist/multi-select.js.map +1 -1
- package/dist/pagination.d.ts +9 -9
- package/dist/pagination.js +1 -1
- package/dist/popover.d.ts +7 -7
- package/dist/{primitive-tuHqhoRE.d.ts → primitive-BqLYh79k.d.ts} +3 -3
- package/dist/progress.d.ts +5 -5
- package/dist/radio-group.d.ts +20 -20
- package/dist/radio-group.js +1 -1
- package/dist/radio-group.js.map +1 -1
- package/dist/resolve-pre-rendered-props-51i50IL2.d.ts +165 -0
- package/dist/resolve-pre-rendered-props-Bu2cvS9A.js +11 -0
- package/dist/resolve-pre-rendered-props-Bu2cvS9A.js.map +1 -0
- package/dist/sandboxed-on-click.d.ts +4 -4
- package/dist/{select-BkvbNKQ7.d.ts → select-DJmjfGjt.d.ts} +16 -16
- package/dist/{select-BXBu1jP_.js → select-Z13w6WBS.js} +2 -2
- package/dist/{select-BXBu1jP_.js.map → select-Z13w6WBS.js.map} +1 -1
- package/dist/select.d.ts +1 -1
- package/dist/select.js +1 -1
- package/dist/{separator-fSV4z0Pq.js → separator-BuP5aENE.js} +1 -1
- package/dist/{separator-fSV4z0Pq.js.map → separator-BuP5aENE.js.map} +1 -1
- package/dist/separator.d.ts +5 -5
- package/dist/separator.js +1 -1
- package/dist/sheet.d.ts +19 -19
- package/dist/sheet.js +1 -1
- package/dist/skeleton.d.ts +5 -5
- package/dist/slider.d.ts +2 -2
- package/dist/slider.js +1 -1
- package/dist/slider.js.map +1 -1
- package/dist/slot.d.ts +3 -3
- package/dist/{sort-CfPsu1Gs.js → sort-mo52clyh.js} +2 -2
- package/dist/{sort-CfPsu1Gs.js.map → sort-mo52clyh.js.map} +1 -1
- package/dist/split-button.d.ts +20 -20
- package/dist/split-button.js +1 -1
- package/dist/split-button.js.map +1 -1
- package/dist/{svg-only-Ct2mB46K.d.ts → svg-only-Db3eUPWM.d.ts} +4 -4
- package/dist/switch.d.ts +4 -4
- package/dist/switch.js +1 -1
- package/dist/switch.js.map +1 -1
- package/dist/{table-Bs1D5Aj7.d.ts → table-C7BejaFW.d.ts} +11 -11
- package/dist/table-CnYWz6IT.js +2 -0
- package/dist/table-CnYWz6IT.js.map +1 -0
- package/dist/table.d.ts +1 -1
- package/dist/table.js +1 -1
- package/dist/tabs.d.ts +9 -9
- package/dist/tabs.js +1 -1
- package/dist/tabs.js.map +1 -1
- package/dist/text-area.d.ts +3 -3
- package/dist/theme.d.ts +7 -7
- package/dist/{themes-Dk0VkyqX.d.ts → themes-D_v8H0nY.d.ts} +1 -1
- package/dist/toast.d.ts +10 -10
- package/dist/tooltip.d.ts +6 -6
- package/dist/{types-DgXUgkpc.d.ts → types-Cq6RWU7Q.d.ts} +1 -1
- package/dist/{types-Dh4BVhXC.d.ts → types-yU-Byhue.d.ts} +1 -1
- package/dist/types.d.ts +5 -5
- package/dist/use-copy-to-clipboard-B6wH6hDd.js +2 -0
- package/dist/use-copy-to-clipboard-B6wH6hDd.js.map +1 -0
- package/dist/{use-prefers-reduced-motion-BiG6QGkf.js → use-prefers-reduced-motion-BcwST13S.js} +1 -1
- package/dist/{use-prefers-reduced-motion-BiG6QGkf.js.map → use-prefers-reduced-motion-BcwST13S.js.map} +1 -1
- package/dist/utils.d.ts +2 -2
- package/dist/utils.js +1 -1
- package/dist/{variant-props-UE-phTwh.d.ts → variant-props-Bm6Y-jfm.d.ts} +2 -2
- package/dist/{with-style-props-D1QFTzj6.d.ts → with-style-props-9-k1s4ov.d.ts} +1 -1
- package/package.json +19 -16
- package/dist/button-CdPMhyKg.js +0 -2
- package/dist/button-CdPMhyKg.js.map +0 -1
- package/dist/icon-button-CeeHZOhh.js +0 -2
- package/dist/icon-button-CeeHZOhh.js.map +0 -1
- package/dist/table-bSFWy29w.js +0 -2
- package/dist/table-bSFWy29w.js.map +0 -1
- package/dist/use-copy-to-clipboard-BCpEp-sO.js +0 -2
- package/dist/use-copy-to-clipboard-BCpEp-sO.js.map +0 -1
package/dist/description-list.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./slot-D_ZUrdEW.js";import{forwardRef as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=n(({asChild:n=!1,className:i,children:a,...o},s)=>r(n?t:`dl`,{ref:s,className:e(`relative scrollbar overflow-x-auto overscroll-x-none rounded-lg border border-card grid grid-cols-[auto_1fr] gap-x-4 [&>*:nth-child(odd)]:bg-
|
|
1
|
+
import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./slot-D_ZUrdEW.js";import{forwardRef as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=n(({asChild:n=!1,className:i,children:a,...o},s)=>r(n?t:`dl`,{ref:s,className:e(`relative scrollbar overflow-x-auto overscroll-x-none rounded-lg border border-card grid grid-cols-[auto_1fr] gap-x-4 [&>*:nth-child(odd)]:bg-neutral-500/5 p-1`,i),...o,children:a}));i.displayName=`DescriptionList`;const a=n(({asChild:n=!1,className:i,children:a,...o},s)=>r(n?t:`div`,{ref:s,className:e(`rounded-sm col-span-full grid grid-cols-subgrid items-center`,i),...o,children:a}));a.displayName=`DescriptionListItem`;const o=n(({asChild:n=!1,className:i,children:a,...o},s)=>r(n?t:`dt`,{ref:s,className:e(`text-muted text-sm font-sans font-medium min-w-36 p-2`,i),...o,children:a}));o.displayName=`DescriptionListLabel`;const s=n(({asChild:n=!1,className:i,children:a,...o},s)=>r(n?t:`dd`,{ref:s,className:e(`text-body font-mono text-mono py-2 px-3`,i),...o,children:a}));s.displayName=`DescriptionListValue`;const c={Root:i,Item:a,Label:o,Value:s};export{c as DescriptionList};
|
|
2
2
|
//# sourceMappingURL=description-list.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"description-list.js","names":[],"sources":["../src/components/description-list/description-list.tsx"],"sourcesContent":["import type { ComponentProps, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport type { WithAsChild } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Slot } from \"../slot/index.js\";\n\ntype DescriptionListProps = ComponentProps<\"dl\"> & WithAsChild;\n\n/**\n * A semantically correct description list built on the HTML `<dl>` element.\n * Renders a list of label/value pairs with alternating row backgrounds,\n * commonly used in detail views to display metadata about a resource.\n *\n * @see https://mantle.ngrok.com/components/description-list#descriptionlistroot\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dl\n *\n * @example\n * ```tsx\n * <DescriptionList.Root>\n * <DescriptionList.Item>\n * <DescriptionList.Label>Name</DescriptionList.Label>\n * <DescriptionList.Value>my-api-key</DescriptionList.Value>\n * </DescriptionList.Item>\n * </DescriptionList.Root>\n * ```\n */\nconst Root = forwardRef<ComponentRef<\"dl\">, DescriptionListProps>(\n\t({ asChild = false, className, children, ...rest }, ref) => {\n\t\tconst Component = asChild ? Slot : \"dl\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"relative scrollbar overflow-x-auto overscroll-x-none rounded-lg border border-card grid grid-cols-[auto_1fr] gap-x-4 [&>*:nth-child(odd)]:bg-
|
|
1
|
+
{"version":3,"file":"description-list.js","names":[],"sources":["../src/components/description-list/description-list.tsx"],"sourcesContent":["import type { ComponentProps, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport type { WithAsChild } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Slot } from \"../slot/index.js\";\n\ntype DescriptionListProps = ComponentProps<\"dl\"> & WithAsChild;\n\n/**\n * A semantically correct description list built on the HTML `<dl>` element.\n * Renders a list of label/value pairs with alternating row backgrounds,\n * commonly used in detail views to display metadata about a resource.\n *\n * @see https://mantle.ngrok.com/components/description-list#descriptionlistroot\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dl\n *\n * @example\n * ```tsx\n * <DescriptionList.Root>\n * <DescriptionList.Item>\n * <DescriptionList.Label>Name</DescriptionList.Label>\n * <DescriptionList.Value>my-api-key</DescriptionList.Value>\n * </DescriptionList.Item>\n * </DescriptionList.Root>\n * ```\n */\nconst Root = forwardRef<ComponentRef<\"dl\">, DescriptionListProps>(\n\t({ asChild = false, className, children, ...rest }, ref) => {\n\t\tconst Component = asChild ? Slot : \"dl\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"relative scrollbar overflow-x-auto overscroll-x-none rounded-lg border border-card grid grid-cols-[auto_1fr] gap-x-4 [&>*:nth-child(odd)]:bg-neutral-500/5 p-1\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Component>\n\t\t);\n\t},\n);\nRoot.displayName = \"DescriptionList\";\n\ntype DescriptionListItemProps = ComponentProps<\"div\"> & WithAsChild;\n\n/**\n * A wrapper that groups a `DescriptionList.Label` and `DescriptionList.Value`\n * pair. Renders as a `<div>` inside the `<dl>` with a subgrid layout that\n * inherits column tracks from the root.\n *\n * @see https://mantle.ngrok.com/components/description-list#descriptionlistitem\n *\n * @example\n * ```tsx\n * <DescriptionList.Item>\n * <DescriptionList.Label>ID</DescriptionList.Label>\n * <DescriptionList.Value>aigk_2fKm9x8Hn3...</DescriptionList.Value>\n * </DescriptionList.Item>\n * ```\n */\nconst Item = forwardRef<ComponentRef<\"div\">, DescriptionListItemProps>(\n\t({ asChild = false, className, children, ...rest }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"rounded-sm col-span-full grid grid-cols-subgrid items-center\", className)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Component>\n\t\t);\n\t},\n);\nItem.displayName = \"DescriptionListItem\";\n\ntype DescriptionListLabelProps = ComponentProps<\"dt\"> & WithAsChild;\n\n/**\n * The label for a description list item. Renders as a `<dt>` element.\n *\n * @see https://mantle.ngrok.com/components/description-list#descriptionlistlabel\n *\n * @example\n * ```tsx\n * <DescriptionList.Label>Name</DescriptionList.Label>\n * ```\n */\nconst Label = forwardRef<ComponentRef<\"dt\">, DescriptionListLabelProps>(\n\t({ asChild = false, className, children, ...rest }, ref) => {\n\t\tconst Component = asChild ? Slot : \"dt\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"text-muted text-sm font-sans font-medium min-w-36 p-2\", className)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Component>\n\t\t);\n\t},\n);\nLabel.displayName = \"DescriptionListLabel\";\n\ntype DescriptionListValueProps = ComponentProps<\"dd\"> & WithAsChild;\n\n/**\n * The value for a description list item. Renders as a `<dd>` element.\n * Compose any content inside — the component is intentionally \"dumb\" and\n * imposes no layout on its children.\n *\n * @see https://mantle.ngrok.com/components/description-list#descriptionlistvalue\n *\n * @example\n * ```tsx\n * <DescriptionList.Value>\n * aigk_2fKm9x8Hn3QpYT7zKlR0vW5\n * </DescriptionList.Value>\n * ```\n */\nconst Value = forwardRef<ComponentRef<\"dd\">, DescriptionListValueProps>(\n\t({ asChild = false, className, children, ...rest }, ref) => {\n\t\tconst Component = asChild ? Slot : \"dd\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"text-body font-mono text-mono py-2 px-3\", className)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Component>\n\t\t);\n\t},\n);\nValue.displayName = \"DescriptionListValue\";\n\n/**\n * A semantically correct description list built on the HTML `<dl>` element.\n * Renders a list of label/value pairs with alternating row backgrounds,\n * commonly used in detail views to display metadata about a resource\n * (e.g., API keys, secrets, domains).\n *\n * Compose with `DescriptionList.Item`, `DescriptionList.Label`, and\n * `DescriptionList.Value` as direct children.\n *\n * @see https://mantle.ngrok.com/components/description-list\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dl\n *\n * @example\n * ```tsx\n * <DescriptionList.Root>\n * <DescriptionList.Item>\n * <DescriptionList.Label>Name</DescriptionList.Label>\n * <DescriptionList.Value>my-api-key</DescriptionList.Value>\n * </DescriptionList.Item>\n * <DescriptionList.Item>\n * <DescriptionList.Label>ID</DescriptionList.Label>\n * <DescriptionList.Value>\n * aigk_2fKm9x8Hn3QpYT7zKlR0vW5\n * </DescriptionList.Value>\n * </DescriptionList.Item>\n * </DescriptionList.Root>\n * ```\n */\nconst DescriptionList = {\n\t/**\n\t * The root container for a description list. Renders a `<dl>` element.\n\t *\n\t * @see https://mantle.ngrok.com/components/description-list#descriptionlistroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <DescriptionList.Root>\n\t * <DescriptionList.Item>\n\t * <DescriptionList.Label>Name</DescriptionList.Label>\n\t * <DescriptionList.Value>my-api-key</DescriptionList.Value>\n\t * </DescriptionList.Item>\n\t * </DescriptionList.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A wrapper that groups a label/value pair. Renders a `<div>` with a default\n\t * subgrid layout.\n\t *\n\t * @see https://mantle.ngrok.com/components/description-list#descriptionlistitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DescriptionList.Item>\n\t * <DescriptionList.Label>ID</DescriptionList.Label>\n\t * <DescriptionList.Value>aigk_2fKm9x8Hn3...</DescriptionList.Value>\n\t * </DescriptionList.Item>\n\t * ```\n\t */\n\tItem,\n\t/**\n\t * The label for a description list item. Renders a `<dt>` element.\n\t *\n\t * @see https://mantle.ngrok.com/components/description-list#descriptionlistlabel\n\t *\n\t * @example\n\t * ```tsx\n\t * <DescriptionList.Label>Name</DescriptionList.Label>\n\t * ```\n\t */\n\tLabel,\n\t/**\n\t * The value for a description list item. Renders a `<dd>` element.\n\t *\n\t * @see https://mantle.ngrok.com/components/description-list#descriptionlistvalue\n\t *\n\t * @example\n\t * ```tsx\n\t * <DescriptionList.Value>\n\t * aigk_2fKm9x8Hn3QpYT7zKlR0vW5\n\t * </DescriptionList.Value>\n\t * ```\n\t */\n\tValue,\n} as const;\n\nexport {\n\t//,\n\tDescriptionList,\n};\n\nexport type {\n\t//,\n\tDescriptionListProps,\n};\n"],"mappings":"kJA0BA,MAAM,EAAO,GACX,CAAE,UAAU,GAAO,YAAW,WAAU,GAAG,GAAQ,IAIlD,EAHiB,EAAU,EAAO,KAGlC,CACM,MACL,UAAW,EACV,iKACA,EACA,CACD,GAAI,EAEH,WACU,CAAA,CAGd,CACD,EAAK,YAAc,kBAmBnB,MAAM,EAAO,GACX,CAAE,UAAU,GAAO,YAAW,WAAU,GAAG,GAAQ,IAIlD,EAHiB,EAAU,EAAO,MAGlC,CACM,MACL,UAAW,EAAG,+DAAgE,EAAU,CACxF,GAAI,EAEH,WACU,CAAA,CAGd,CACD,EAAK,YAAc,sBAcnB,MAAM,EAAQ,GACZ,CAAE,UAAU,GAAO,YAAW,WAAU,GAAG,GAAQ,IAIlD,EAHiB,EAAU,EAAO,KAGlC,CACM,MACL,UAAW,EAAG,wDAAyD,EAAU,CACjF,GAAI,EAEH,WACU,CAAA,CAGd,CACD,EAAM,YAAc,uBAkBpB,MAAM,EAAQ,GACZ,CAAE,UAAU,GAAO,YAAW,WAAU,GAAG,GAAQ,IAIlD,EAHiB,EAAU,EAAO,KAGlC,CACM,MACL,UAAW,EAAG,0CAA2C,EAAU,CACnE,GAAI,EAEH,WACU,CAAA,CAGd,CACD,EAAM,YAAc,uBA8BpB,MAAM,EAAkB,CAgBvB,OAeA,OAWA,QAaA,QACA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-button-
|
|
2
|
-
//# sourceMappingURL=dialog-
|
|
1
|
+
import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-button-CxxVPiKp.js";import{a as n,c as r,i,n as a,o,r as s,s as c,t as l}from"./primitive-pggbsddf.js";import{forwardRef as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{XIcon as p}from"@phosphor-icons/react/X";const m=o;m.displayName=`Dialog`;const h=r;h.displayName=`DialogTrigger`;const g=n;g.displayName=`DialogPortal`;const _=l;_.displayName=`DialogClose`;const v=u(({className:t,...n},r)=>d(i,{ref:r,className:e(`bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-50 backdrop-blur-xs`,t),...n}));v.displayName=`DialogOverlay`;const y=u(({children:t,className:n,preferredWidth:r=`max-w-lg`,...i},o)=>f(g,{children:[d(v,{}),d(`div`,{className:`fixed inset-4 z-50 flex items-center justify-center`,children:d(a,{"data-mantle-modal-content":!0,className:e(`flex max-h-full w-full flex-1 flex-col`,`outline-hidden focus-within:outline-hidden`,`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`,r,n),ref:o,...i,children:t})})]}));y.displayName=`DialogContent`;const b=({className:t,children:n,...r})=>d(`div`,{className:e(`border-dialog-muted text-strong relative flex shrink-0 items-center justify-between gap-2 border-b px-6 py-4`,`has-[.icon-button]:pr-4`,t),...r,children:n});b.displayName=`DialogHeader`;const x=({size:e=`md`,type:n=`button`,label:r=`Close Dialog`,appearance:i=`ghost`,...a})=>d(l,{asChild:!0,children:d(t,{appearance:i,icon:d(p,{}),label:r,size:e,type:n,...a})});x.displayName=`DialogCloseIconButton`;const S=({className:t,...n})=>d(`div`,{className:e(`scrollbar text-body flex-1 overflow-y-auto p-6`,t),...n});S.displayName=`DialogBody`;const C=({className:t,...n})=>d(`div`,{className:e(`border-dialog-muted flex shrink-0 flex-row-reverse gap-2 border-t px-6 py-4`,t),...n});C.displayName=`DialogFooter`;const w=u(({className:t,...n},r)=>d(c,{ref:r,className:e(`text-strong truncate text-lg font-medium`,t),...n}));w.displayName=`DialogTitle`;const T=u(({className:t,...n},r)=>d(s,{ref:r,className:e(`text-muted`,t),...n}));T.displayName=`DialogDescription`;const E={Root:m,Body:S,Close:_,CloseIconButton:x,Content:y,Description:T,Footer:C,Header:b,Overlay:v,Portal:g,Title:w,Trigger:h};export{E as t};
|
|
2
|
+
//# sourceMappingURL=dialog-DxkpMIzB.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog-DUOIIhuN.js","names":["DialogPrimitive.Root","DialogPrimitive.Trigger","DialogPrimitive.Portal","DialogPrimitive.Close","DialogPrimitive.Overlay","DialogPrimitive.Content","DialogPrimitive.Title","DialogPrimitive.Description"],"sources":["../src/components/dialog/dialog.tsx"],"sourcesContent":["import { XIcon } from \"@phosphor-icons/react/X\";\nimport type { ComponentProps, ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { IconButton, type IconButtonProps } from \"../button/icon-button.js\";\nimport * as DialogPrimitive from \"./primitive.js\";\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n * The root stateful component for the Dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogroot\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * <Dialog.Footer>\n * <Button type=\"button\" appearance=\"outlined\">\n * Cancel\n * </Button>\n * <Button type=\"button\" appearance=\"filled\">\n * Save\n * </Button>\n * </Dialog.Footer>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Root = DialogPrimitive.Root;\nRoot.displayName = \"Dialog\";\n\n/**\n * A button that opens the dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogtrigger\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Trigger = DialogPrimitive.Trigger;\nTrigger.displayName = \"DialogTrigger\";\n\nconst Portal = DialogPrimitive.Portal;\nPortal.displayName = \"DialogPortal\";\n\nconst Close = DialogPrimitive.Close;\nClose.displayName = \"DialogClose\";\n\nconst Overlay = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Overlay\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-50 backdrop-blur-xs\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nOverlay.displayName = \"DialogOverlay\";\n\ntype ContentProps = ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n\t/**\n\t * The preferred width of the `Dialog.Content` as a tailwind `max-w-` class.\n\t *\n\t * By default, a `Dialog`'s content width is responsive with a default\n\t * preferred width: the maximum width of the `Dialog.Content`\n\t *\n\t * @default `max-w-lg`\n\t */\n\tpreferredWidth?: `max-w-${string}`;\n};\n\n/**\n * The container for the dialog content.\n * Renders on top of the overlay and is centered in the viewport.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogcontent\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * <Dialog.Footer>\n * <Button type=\"button\" appearance=\"outlined\">\n * Cancel\n * </Button>\n * <Button type=\"button\" appearance=\"filled\">\n * Save\n * </Button>\n * </Dialog.Footer>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Content = forwardRef<ComponentRef<\"div\">, ContentProps>(\n\t({ children, className, preferredWidth = \"max-w-lg\", ...props }, ref) => (\n\t\t<Portal>\n\t\t\t<Overlay />\n\t\t\t<div className=\"fixed inset-4 z-50 flex items-center justify-center\">\n\t\t\t\t<DialogPrimitive.Content\n\t\t\t\t\tdata-mantle-modal-content\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"flex max-h-full w-full flex-1 flex-col\",\n\t\t\t\t\t\t\"outline-hidden focus-within:outline-hidden\",\n\t\t\t\t\t\t\"border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200\",\n\t\t\t\t\t\t\"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\t\t\t\t\tpreferredWidth,\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</DialogPrimitive.Content>\n\t\t\t</div>\n\t\t</Portal>\n\t),\n);\nContent.displayName = \"DialogContent\";\n\n/**\n * Contains the header content of the dialog, including the title and close button.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogheader\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Header = ({ className, children, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted text-strong relative flex shrink-0 items-center justify-between gap-2 border-b px-6 py-4\",\n\t\t\t\"has-[.icon-button]:pr-4\", // when there are actions in the header, shorten the padding\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t</div>\n);\nHeader.displayName = \"DialogHeader\";\n\ntype CloseIconButtonProps = Partial<Omit<IconButtonProps, \"icon\">>;\n\n/**\n * An icon button that closes the dialog when clicked.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogcloseiconbutton\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst CloseIconButton = ({\n\tsize = \"md\",\n\ttype = \"button\",\n\tlabel = \"Close Dialog\",\n\tappearance = \"ghost\",\n\t...props\n}: CloseIconButtonProps) => (\n\t<DialogPrimitive.Close asChild>\n\t\t<IconButton\n\t\t\tappearance={appearance}\n\t\t\ticon={<XIcon />}\n\t\t\tlabel={label}\n\t\t\tsize={size}\n\t\t\ttype={type}\n\t\t\t{...props}\n\t\t/>\n\t</DialogPrimitive.Close>\n);\nCloseIconButton.displayName = \"DialogCloseIconButton\";\n\n/**\n * Contains the main content of the dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogbody\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Body = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div className={cx(\"scrollbar text-body flex-1 overflow-y-auto p-6\", className)} {...props} />\n);\nBody.displayName = \"DialogBody\";\n\n/**\n * Contains the footer content of the dialog, including action buttons.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogfooter\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * <Dialog.Footer>\n * <Button type=\"button\" appearance=\"outlined\">\n * Cancel\n * </Button>\n * <Button type=\"button\" appearance=\"filled\">\n * Save\n * </Button>\n * </Dialog.Footer>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Footer = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted flex shrink-0 flex-row-reverse gap-2 border-t px-6 py-4\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\nFooter.displayName = \"DialogFooter\";\n\n/**\n * An accessible name to be announced when the dialog is opened.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogtitle\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Title = forwardRef<\n\tComponentRef<typeof DialogPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\"text-strong truncate text-lg font-medium\", className)}\n\t\t{...props}\n\t/>\n));\nTitle.displayName = \"DialogTitle\";\n\n/**\n * An accessible description to be announced when the dialog is opened.\n * Renders as a `div` by default, but can be changed to any other element using\n * the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogdescription\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.Description>\n * This is an optional description.\n * </Dialog.Description>\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Description = forwardRef<\n\tComponentRef<typeof DialogPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description ref={ref} className={cx(\"text-muted\", className)} {...props} />\n));\nDescription.displayName = \"DialogDescription\";\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n *\n * @see https://mantle.ngrok.com/components/dialog\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * <Dialog.Footer>\n * <Button type=\"button\" appearance=\"outlined\">\n * Cancel\n * </Button>\n * <Button type=\"button\" appearance=\"filled\">\n * Save\n * </Button>\n * </Dialog.Footer>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Dialog = {\n\t/**\n\t * A window overlaid on either the primary window or another dialog window.\n\t * The root stateful component for the Dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * <Dialog.Footer>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Cancel\n\t * </Button>\n\t * <Button type=\"button\" appearance=\"filled\">\n\t * Save\n\t * </Button>\n\t * </Dialog.Footer>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Contains the main content of the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogbody\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tBody,\n\t/**\n\t * A button that closes the dialog when clicked.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogclose\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\">Open Dialog</Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Confirm Action</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <Text>Are you sure you want to proceed?</Text>\n\t * </Dialog.Body>\n\t * <Dialog.Footer>\n\t * <Dialog.Close asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">Cancel</Button>\n\t * </Dialog.Close>\n\t * <Button type=\"submit\">Confirm</Button>\n\t * </Dialog.Footer>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tClose,\n\t/**\n\t * An icon button that closes the dialog when clicked.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogcloseiconbutton\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tCloseIconButton,\n\t/**\n\t * The container for the dialog content.\n\t * Renders on top of the overlay and is centered in the viewport.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * <Dialog.Footer>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Cancel\n\t * </Button>\n\t * <Button type=\"button\" appearance=\"filled\">\n\t * Save\n\t * </Button>\n\t * </Dialog.Footer>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * An accessible description to be announced when the dialog is opened.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogdescription\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.Description>\n\t * This is an optional description.\n\t * </Dialog.Description>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * Contains the footer content of the dialog, including action buttons.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogfooter\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * <Dialog.Footer>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Cancel\n\t * </Button>\n\t * <Button type=\"button\" appearance=\"filled\">\n\t * Save\n\t * </Button>\n\t * </Dialog.Footer>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tFooter,\n\t/**\n\t * Contains the header content of the dialog, including the title and close button.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogheader\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tHeader,\n\t/**\n\t * The overlay backdrop for the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-reference\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Portal>\n\t * <Dialog.Overlay />\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <Text>Dialog content here.</Text>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Portal>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tOverlay,\n\t/**\n\t * The portal container for the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-reference\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\">Open Dialog</Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Portal>\n\t * <Dialog.Overlay />\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Portal Dialog</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <Text>This dialog is rendered in a portal.</Text>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Portal>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tPortal,\n\t/**\n\t * An accessible name to be announced when the dialog is opened.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogtitle\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tTitle,\n\t/**\n\t * A button that opens the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogtrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDialog,\n};\n"],"mappings":"sSAyCA,MAAM,EAAOA,EACb,EAAK,YAAc,SA0BnB,MAAM,EAAUC,EAChB,EAAQ,YAAc,gBAEtB,MAAM,EAASC,EACf,EAAO,YAAc,eAErB,MAAM,EAAQC,EACd,EAAM,YAAc,cAEpB,MAAM,EAAU,GAGb,CAAE,YAAW,GAAG,GAAS,IAC3B,EAACC,EAAD,CACM,MACL,UAAW,EACV,iKACA,EACA,CACD,GAAI,EACH,CAAA,CACD,CACF,EAAQ,YAAc,gBAgDtB,MAAM,EAAU,GACd,CAAE,WAAU,YAAW,iBAAiB,WAAY,GAAG,GAAS,IAChE,EAAC,EAAD,CAAA,SAAA,CACC,EAAC,EAAD,EAAW,CAAA,CACX,EAAC,MAAD,CAAK,UAAU,+DACd,EAACC,EAAD,CACC,4BAAA,GACA,UAAW,EACV,yCACA,6CACA,wFACA,2KACA,EACA,EACA,CACI,MACL,GAAI,EAEH,WACwB,CAAA,CACrB,CAAA,CACE,CAAA,CAAA,CAEV,CACD,EAAQ,YAAc,gBA2BtB,MAAM,GAAU,CAAE,YAAW,WAAU,GAAG,KACzC,EAAC,MAAD,CACC,UAAW,EACV,+GACA,0BACA,EACA,CACD,GAAI,EAEH,WACI,CAAA,CAEP,EAAO,YAAc,eA6BrB,MAAM,GAAmB,CACxB,OAAO,KACP,OAAO,SACP,QAAQ,eACR,aAAa,QACb,GAAG,KAEH,EAACF,EAAD,CAAuB,QAAA,YACtB,EAAC,EAAD,CACa,aACZ,KAAM,EAAC,EAAD,EAAS,CAAA,CACR,QACD,OACA,OACN,GAAI,EACH,CAAA,CACqB,CAAA,CAEzB,EAAgB,YAAc,wBA0B9B,MAAM,GAAQ,CAAE,YAAW,GAAG,KAC7B,EAAC,MAAD,CAAK,UAAW,EAAG,iDAAkD,EAAU,CAAE,GAAI,EAAS,CAAA,CAE/F,EAAK,YAAc,aAkCnB,MAAM,GAAU,CAAE,YAAW,GAAG,KAC/B,EAAC,MAAD,CACC,UAAW,EACV,8EACA,EACA,CACD,GAAI,EACH,CAAA,CAEH,EAAO,YAAc,eA2BrB,MAAM,EAAQ,GAGX,CAAE,YAAW,GAAG,GAAS,IAC3B,EAACG,EAAD,CACM,MACL,UAAW,EAAG,2CAA4C,EAAU,CACpE,GAAI,EACH,CAAA,CACD,CACF,EAAM,YAAc,cA+BpB,MAAM,EAAc,GAGjB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAACC,EAAD,CAAkC,MAAK,UAAW,EAAG,aAAc,EAAU,CAAE,GAAI,EAAS,CAAA,CAC3F,CACF,EAAY,YAAc,oBAmC1B,MAAM,EAAS,CAmCd,OAyBA,OA6BA,QA0BA,kBAmCA,UA4BA,cAiCA,SA0BA,SAuBA,UA0BA,SA0BA,QAyBA,UACA"}
|
|
1
|
+
{"version":3,"file":"dialog-DxkpMIzB.js","names":["DialogPrimitive.Root","DialogPrimitive.Trigger","DialogPrimitive.Portal","DialogPrimitive.Close","DialogPrimitive.Overlay","DialogPrimitive.Content","DialogPrimitive.Title","DialogPrimitive.Description"],"sources":["../src/components/dialog/dialog.tsx"],"sourcesContent":["import { XIcon } from \"@phosphor-icons/react/X\";\nimport type { ComponentProps, ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { IconButton, type IconButtonProps } from \"../button/icon-button.js\";\nimport * as DialogPrimitive from \"./primitive.js\";\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n * The root stateful component for the Dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogroot\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * <Dialog.Footer>\n * <Button type=\"button\" appearance=\"outlined\">\n * Cancel\n * </Button>\n * <Button type=\"button\" appearance=\"filled\">\n * Save\n * </Button>\n * </Dialog.Footer>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Root = DialogPrimitive.Root;\nRoot.displayName = \"Dialog\";\n\n/**\n * A button that opens the dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogtrigger\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Trigger = DialogPrimitive.Trigger;\nTrigger.displayName = \"DialogTrigger\";\n\nconst Portal = DialogPrimitive.Portal;\nPortal.displayName = \"DialogPortal\";\n\nconst Close = DialogPrimitive.Close;\nClose.displayName = \"DialogClose\";\n\nconst Overlay = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Overlay\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-50 backdrop-blur-xs\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nOverlay.displayName = \"DialogOverlay\";\n\ntype ContentProps = ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n\t/**\n\t * The preferred width of the `Dialog.Content` as a tailwind `max-w-` class.\n\t *\n\t * By default, a `Dialog`'s content width is responsive with a default\n\t * preferred width: the maximum width of the `Dialog.Content`\n\t *\n\t * @default `max-w-lg`\n\t */\n\tpreferredWidth?: `max-w-${string}`;\n};\n\n/**\n * The container for the dialog content.\n * Renders on top of the overlay and is centered in the viewport.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogcontent\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * <Dialog.Footer>\n * <Button type=\"button\" appearance=\"outlined\">\n * Cancel\n * </Button>\n * <Button type=\"button\" appearance=\"filled\">\n * Save\n * </Button>\n * </Dialog.Footer>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Content = forwardRef<ComponentRef<\"div\">, ContentProps>(\n\t({ children, className, preferredWidth = \"max-w-lg\", ...props }, ref) => (\n\t\t<Portal>\n\t\t\t<Overlay />\n\t\t\t<div className=\"fixed inset-4 z-50 flex items-center justify-center\">\n\t\t\t\t<DialogPrimitive.Content\n\t\t\t\t\tdata-mantle-modal-content\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"flex max-h-full w-full flex-1 flex-col\",\n\t\t\t\t\t\t\"outline-hidden focus-within:outline-hidden\",\n\t\t\t\t\t\t\"border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200\",\n\t\t\t\t\t\t\"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\t\t\t\t\tpreferredWidth,\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</DialogPrimitive.Content>\n\t\t\t</div>\n\t\t</Portal>\n\t),\n);\nContent.displayName = \"DialogContent\";\n\n/**\n * Contains the header content of the dialog, including the title and close button.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogheader\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Header = ({ className, children, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted text-strong relative flex shrink-0 items-center justify-between gap-2 border-b px-6 py-4\",\n\t\t\t\"has-[.icon-button]:pr-4\", // when there are actions in the header, shorten the padding\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t</div>\n);\nHeader.displayName = \"DialogHeader\";\n\ntype CloseIconButtonProps = Partial<Omit<IconButtonProps, \"icon\">>;\n\n/**\n * An icon button that closes the dialog when clicked.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogcloseiconbutton\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst CloseIconButton = ({\n\tsize = \"md\",\n\ttype = \"button\",\n\tlabel = \"Close Dialog\",\n\tappearance = \"ghost\",\n\t...props\n}: CloseIconButtonProps) => (\n\t<DialogPrimitive.Close asChild>\n\t\t<IconButton\n\t\t\tappearance={appearance}\n\t\t\ticon={<XIcon />}\n\t\t\tlabel={label}\n\t\t\tsize={size}\n\t\t\ttype={type}\n\t\t\t{...props}\n\t\t/>\n\t</DialogPrimitive.Close>\n);\nCloseIconButton.displayName = \"DialogCloseIconButton\";\n\n/**\n * Contains the main content of the dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogbody\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Body = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div className={cx(\"scrollbar text-body flex-1 overflow-y-auto p-6\", className)} {...props} />\n);\nBody.displayName = \"DialogBody\";\n\n/**\n * Contains the footer content of the dialog, including action buttons.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogfooter\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * <Dialog.Footer>\n * <Button type=\"button\" appearance=\"outlined\">\n * Cancel\n * </Button>\n * <Button type=\"button\" appearance=\"filled\">\n * Save\n * </Button>\n * </Dialog.Footer>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Footer = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted flex shrink-0 flex-row-reverse gap-2 border-t px-6 py-4\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\nFooter.displayName = \"DialogFooter\";\n\n/**\n * An accessible name to be announced when the dialog is opened.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogtitle\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Title = forwardRef<\n\tComponentRef<typeof DialogPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\"text-strong truncate text-lg font-medium\", className)}\n\t\t{...props}\n\t/>\n));\nTitle.displayName = \"DialogTitle\";\n\n/**\n * An accessible description to be announced when the dialog is opened.\n * Renders as a `div` by default, but can be changed to any other element using\n * the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/dialog#dialogdescription\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.Description>\n * This is an optional description.\n * </Dialog.Description>\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Description = forwardRef<\n\tComponentRef<typeof DialogPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description ref={ref} className={cx(\"text-muted\", className)} {...props} />\n));\nDescription.displayName = \"DialogDescription\";\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n *\n * @see https://mantle.ngrok.com/components/dialog\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Dialog\n * </Button>\n * </Dialog.Trigger>\n * <Dialog.Content>\n * <Dialog.Header>\n * <Dialog.Title>Dialog Title</Dialog.Title>\n * <Dialog.CloseIconButton />\n * </Dialog.Header>\n * <Dialog.Body>\n * <p>This is the dialog content.</p>\n * </Dialog.Body>\n * <Dialog.Footer>\n * <Button type=\"button\" appearance=\"outlined\">\n * Cancel\n * </Button>\n * <Button type=\"button\" appearance=\"filled\">\n * Save\n * </Button>\n * </Dialog.Footer>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Dialog = {\n\t/**\n\t * A window overlaid on either the primary window or another dialog window.\n\t * The root stateful component for the Dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * <Dialog.Footer>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Cancel\n\t * </Button>\n\t * <Button type=\"button\" appearance=\"filled\">\n\t * Save\n\t * </Button>\n\t * </Dialog.Footer>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Contains the main content of the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogbody\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tBody,\n\t/**\n\t * A button that closes the dialog when clicked.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogclose\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\">Open Dialog</Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Confirm Action</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <Text>Are you sure you want to proceed?</Text>\n\t * </Dialog.Body>\n\t * <Dialog.Footer>\n\t * <Dialog.Close asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">Cancel</Button>\n\t * </Dialog.Close>\n\t * <Button type=\"submit\">Confirm</Button>\n\t * </Dialog.Footer>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tClose,\n\t/**\n\t * An icon button that closes the dialog when clicked.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogcloseiconbutton\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tCloseIconButton,\n\t/**\n\t * The container for the dialog content.\n\t * Renders on top of the overlay and is centered in the viewport.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * <Dialog.Footer>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Cancel\n\t * </Button>\n\t * <Button type=\"button\" appearance=\"filled\">\n\t * Save\n\t * </Button>\n\t * </Dialog.Footer>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * An accessible description to be announced when the dialog is opened.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogdescription\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.Description>\n\t * This is an optional description.\n\t * </Dialog.Description>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * Contains the footer content of the dialog, including action buttons.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogfooter\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * <Dialog.Footer>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Cancel\n\t * </Button>\n\t * <Button type=\"button\" appearance=\"filled\">\n\t * Save\n\t * </Button>\n\t * </Dialog.Footer>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tFooter,\n\t/**\n\t * Contains the header content of the dialog, including the title and close button.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogheader\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tHeader,\n\t/**\n\t * The overlay backdrop for the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-reference\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Portal>\n\t * <Dialog.Overlay />\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <Text>Dialog content here.</Text>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Portal>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tOverlay,\n\t/**\n\t * The portal container for the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-reference\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\">Open Dialog</Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Portal>\n\t * <Dialog.Overlay />\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Portal Dialog</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <Text>This dialog is rendered in a portal.</Text>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Portal>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tPortal,\n\t/**\n\t * An accessible name to be announced when the dialog is opened.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogtitle\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * <Dialog.CloseIconButton />\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tTitle,\n\t/**\n\t * A button that opens the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#dialogtrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t * <Dialog.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Dialog\n\t * </Button>\n\t * </Dialog.Trigger>\n\t * <Dialog.Content>\n\t * <Dialog.Header>\n\t * <Dialog.Title>Dialog Title</Dialog.Title>\n\t * </Dialog.Header>\n\t * <Dialog.Body>\n\t * <p>This is the dialog content.</p>\n\t * </Dialog.Body>\n\t * </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDialog,\n};\n"],"mappings":"sSAyCA,MAAM,EAAOA,EACb,EAAK,YAAc,SA0BnB,MAAM,EAAUC,EAChB,EAAQ,YAAc,gBAEtB,MAAM,EAASC,EACf,EAAO,YAAc,eAErB,MAAM,EAAQC,EACd,EAAM,YAAc,cAEpB,MAAM,EAAU,GAGb,CAAE,YAAW,GAAG,GAAS,IAC3B,EAACC,EAAD,CACM,MACL,UAAW,EACV,iKACA,EACA,CACD,GAAI,EACH,CAAA,CACD,CACF,EAAQ,YAAc,gBAgDtB,MAAM,EAAU,GACd,CAAE,WAAU,YAAW,iBAAiB,WAAY,GAAG,GAAS,IAChE,EAAC,EAAD,CAAA,SAAA,CACC,EAAC,EAAD,EAAW,CAAA,CACX,EAAC,MAAD,CAAK,UAAU,+DACd,EAACC,EAAD,CACC,4BAAA,GACA,UAAW,EACV,yCACA,6CACA,wFACA,2KACA,EACA,EACA,CACI,MACL,GAAI,EAEH,WACwB,CAAA,CACrB,CAAA,CACE,CAAA,CAAA,CAEV,CACD,EAAQ,YAAc,gBA2BtB,MAAM,GAAU,CAAE,YAAW,WAAU,GAAG,KACzC,EAAC,MAAD,CACC,UAAW,EACV,+GACA,0BACA,EACA,CACD,GAAI,EAEH,WACI,CAAA,CAEP,EAAO,YAAc,eA6BrB,MAAM,GAAmB,CACxB,OAAO,KACP,OAAO,SACP,QAAQ,eACR,aAAa,QACb,GAAG,KAEH,EAACF,EAAD,CAAuB,QAAA,YACtB,EAAC,EAAD,CACa,aACZ,KAAM,EAAC,EAAD,EAAS,CAAA,CACR,QACD,OACA,OACN,GAAI,EACH,CAAA,CACqB,CAAA,CAEzB,EAAgB,YAAc,wBA0B9B,MAAM,GAAQ,CAAE,YAAW,GAAG,KAC7B,EAAC,MAAD,CAAK,UAAW,EAAG,iDAAkD,EAAU,CAAE,GAAI,EAAS,CAAA,CAE/F,EAAK,YAAc,aAkCnB,MAAM,GAAU,CAAE,YAAW,GAAG,KAC/B,EAAC,MAAD,CACC,UAAW,EACV,8EACA,EACA,CACD,GAAI,EACH,CAAA,CAEH,EAAO,YAAc,eA2BrB,MAAM,EAAQ,GAGX,CAAE,YAAW,GAAG,GAAS,IAC3B,EAACG,EAAD,CACM,MACL,UAAW,EAAG,2CAA4C,EAAU,CACpE,GAAI,EACH,CAAA,CACD,CACF,EAAM,YAAc,cA+BpB,MAAM,EAAc,GAGjB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAACC,EAAD,CAAkC,MAAK,UAAW,EAAG,aAAc,EAAU,CAAE,GAAI,EAAS,CAAA,CAC3F,CACF,EAAY,YAAc,oBAmC1B,MAAM,EAAS,CAmCd,OAyBA,OA6BA,QA0BA,kBAmCA,UA4BA,cAiCA,SA0BA,SAuBA,UA0BA,SA0BA,QAyBA,UACA"}
|
package/dist/dialog.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { n as isDialogOverlayTarget, t as Root } from "./primitive-
|
|
2
|
-
import { n as IconButtonProps } from "./icon-button-
|
|
3
|
-
import * as react from "react";
|
|
1
|
+
import { n as isDialogOverlayTarget, t as Root } from "./primitive-BqLYh79k.js";
|
|
2
|
+
import { n as IconButtonProps } from "./icon-button-gO-7F_MZ.js";
|
|
3
|
+
import * as _$react from "react";
|
|
4
4
|
import { ComponentProps } from "react";
|
|
5
|
-
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
6
|
-
import * as _radix_ui_react_dialog0 from "@radix-ui/react-dialog";
|
|
5
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
6
|
+
import * as _$_radix_ui_react_dialog0 from "@radix-ui/react-dialog";
|
|
7
7
|
|
|
8
8
|
//#region src/components/dialog/dialog.d.ts
|
|
9
9
|
type CloseIconButtonProps = Partial<Omit<IconButtonProps, "icon">>;
|
|
@@ -104,7 +104,7 @@ declare const Dialog: {
|
|
|
104
104
|
({
|
|
105
105
|
className,
|
|
106
106
|
...props
|
|
107
|
-
}: ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
|
|
107
|
+
}: ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
|
|
108
108
|
displayName: string;
|
|
109
109
|
};
|
|
110
110
|
/**
|
|
@@ -135,7 +135,7 @@ declare const Dialog: {
|
|
|
135
135
|
* </Dialog.Root>
|
|
136
136
|
* ```
|
|
137
137
|
*/
|
|
138
|
-
readonly Close: react.ForwardRefExoticComponent<_radix_ui_react_dialog0.DialogCloseProps & react.RefAttributes<HTMLButtonElement>>;
|
|
138
|
+
readonly Close: _$react.ForwardRefExoticComponent<_$_radix_ui_react_dialog0.DialogCloseProps & _$react.RefAttributes<HTMLButtonElement>>;
|
|
139
139
|
/**
|
|
140
140
|
* An icon button that closes the dialog when clicked.
|
|
141
141
|
*
|
|
@@ -168,7 +168,7 @@ declare const Dialog: {
|
|
|
168
168
|
label,
|
|
169
169
|
appearance,
|
|
170
170
|
...props
|
|
171
|
-
}: CloseIconButtonProps): react_jsx_runtime0.JSX.Element;
|
|
171
|
+
}: CloseIconButtonProps): _$react_jsx_runtime0.JSX.Element;
|
|
172
172
|
displayName: string;
|
|
173
173
|
};
|
|
174
174
|
/**
|
|
@@ -205,7 +205,7 @@ declare const Dialog: {
|
|
|
205
205
|
* </Dialog.Root>
|
|
206
206
|
* ```
|
|
207
207
|
*/
|
|
208
|
-
readonly Content: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_dialog0.DialogContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
208
|
+
readonly Content: _$react.ForwardRefExoticComponent<Omit<Omit<_$_radix_ui_react_dialog0.DialogContentProps & _$react.RefAttributes<HTMLDivElement>, "ref"> & _$react.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
209
209
|
/**
|
|
210
210
|
* The preferred width of the `Dialog.Content` as a tailwind `max-w-` class.
|
|
211
211
|
*
|
|
@@ -215,7 +215,7 @@ declare const Dialog: {
|
|
|
215
215
|
* @default `max-w-lg`
|
|
216
216
|
*/
|
|
217
217
|
preferredWidth?: `max-w-${string}`;
|
|
218
|
-
} & react.RefAttributes<HTMLDivElement>>;
|
|
218
|
+
} & _$react.RefAttributes<HTMLDivElement>>;
|
|
219
219
|
/**
|
|
220
220
|
* An accessible description to be announced when the dialog is opened.
|
|
221
221
|
*
|
|
@@ -243,7 +243,7 @@ declare const Dialog: {
|
|
|
243
243
|
* </Dialog.Root>
|
|
244
244
|
* ```
|
|
245
245
|
*/
|
|
246
|
-
readonly Description: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_dialog0.DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
246
|
+
readonly Description: _$react.ForwardRefExoticComponent<Omit<Omit<_$_radix_ui_react_dialog0.DialogDescriptionProps & _$react.RefAttributes<HTMLParagraphElement>, "ref"> & _$react.RefAttributes<HTMLDivElement>, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
|
|
247
247
|
/**
|
|
248
248
|
* Contains the footer content of the dialog, including action buttons.
|
|
249
249
|
*
|
|
@@ -280,7 +280,7 @@ declare const Dialog: {
|
|
|
280
280
|
({
|
|
281
281
|
className,
|
|
282
282
|
...props
|
|
283
|
-
}: ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
|
|
283
|
+
}: ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
|
|
284
284
|
displayName: string;
|
|
285
285
|
};
|
|
286
286
|
/**
|
|
@@ -313,7 +313,7 @@ declare const Dialog: {
|
|
|
313
313
|
className,
|
|
314
314
|
children,
|
|
315
315
|
...props
|
|
316
|
-
}: ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
|
|
316
|
+
}: ComponentProps<"div">): _$react_jsx_runtime0.JSX.Element;
|
|
317
317
|
displayName: string;
|
|
318
318
|
};
|
|
319
319
|
/**
|
|
@@ -338,7 +338,7 @@ declare const Dialog: {
|
|
|
338
338
|
* </Dialog.Root>
|
|
339
339
|
* ```
|
|
340
340
|
*/
|
|
341
|
-
readonly Overlay: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_dialog0.DialogOverlayProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
341
|
+
readonly Overlay: _$react.ForwardRefExoticComponent<Omit<Omit<_$_radix_ui_react_dialog0.DialogOverlayProps & _$react.RefAttributes<HTMLDivElement>, "ref"> & _$react.RefAttributes<HTMLDivElement>, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
|
|
342
342
|
/**
|
|
343
343
|
* The portal container for the dialog.
|
|
344
344
|
*
|
|
@@ -364,7 +364,7 @@ declare const Dialog: {
|
|
|
364
364
|
* </Dialog.Root>
|
|
365
365
|
* ```
|
|
366
366
|
*/
|
|
367
|
-
readonly Portal: react.FC<_radix_ui_react_dialog0.DialogPortalProps>;
|
|
367
|
+
readonly Portal: _$react.FC<_$_radix_ui_react_dialog0.DialogPortalProps>;
|
|
368
368
|
/**
|
|
369
369
|
* An accessible name to be announced when the dialog is opened.
|
|
370
370
|
*
|
|
@@ -390,7 +390,7 @@ declare const Dialog: {
|
|
|
390
390
|
* </Dialog.Root>
|
|
391
391
|
* ```
|
|
392
392
|
*/
|
|
393
|
-
readonly Title: react.ForwardRefExoticComponent<Omit<_radix_ui_react_dialog0.DialogTitleProps & react.RefAttributes<HTMLHeadingElement>, "ref"> & react.RefAttributes<HTMLHeadingElement>>;
|
|
393
|
+
readonly Title: _$react.ForwardRefExoticComponent<Omit<_$_radix_ui_react_dialog0.DialogTitleProps & _$react.RefAttributes<HTMLHeadingElement>, "ref"> & _$react.RefAttributes<HTMLHeadingElement>>;
|
|
394
394
|
/**
|
|
395
395
|
* A button that opens the dialog.
|
|
396
396
|
*
|
|
@@ -415,7 +415,7 @@ declare const Dialog: {
|
|
|
415
415
|
* </Dialog.Root>
|
|
416
416
|
* ```
|
|
417
417
|
*/
|
|
418
|
-
readonly Trigger: react.ForwardRefExoticComponent<_radix_ui_react_dialog0.DialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
|
|
418
|
+
readonly Trigger: _$react.ForwardRefExoticComponent<_$_radix_ui_react_dialog0.DialogTriggerProps & _$react.RefAttributes<HTMLButtonElement>>;
|
|
419
419
|
};
|
|
420
420
|
//#endregion
|
|
421
421
|
export { Dialog, isDialogOverlayTarget };
|
package/dist/dialog.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{l as e}from"./primitive-pggbsddf.js";import{t}from"./dialog-
|
|
1
|
+
import{l as e}from"./primitive-pggbsddf.js";import{t}from"./dialog-DxkpMIzB.js";export{t as Dialog,e as isDialogOverlayTarget};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
const e=[`alphanumeric`,`time`],t=t=>typeof t==`string`&&e.includes(t),n=e=>e,r=[`asc`,`desc`],i=e=>typeof e==`string`&&r.includes(e),a=e=>e,o=[...r],s=e=>typeof e==`string`&&o.includes(e),c=e=>e,l=[`newest-to-oldest`,`oldest-to-newest`],u=e=>typeof e==`string`&&l.includes(e),d={asc:`oldest-to-newest`,desc:`newest-to-oldest`};function f(e){if(i(e))return d[e];if(u(e))return e;throw Error(`Invalid time sorting direction given: "${e}"`)}export{o as a,t as c,e as d,d as f,f as i,u as l,a as n,s as o,l as p,n as r,i as s,c as t,r as u};
|
|
2
|
-
//# sourceMappingURL=direction-
|
|
2
|
+
//# sourceMappingURL=direction-Ca88oQhP.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"direction-
|
|
1
|
+
{"version":3,"file":"direction-Ca88oQhP.js","names":[],"sources":["../src/utils/sorting/direction.ts"],"sourcesContent":["/**\n * Sorting modes\n * - alphanumeric: Sort by alphanumeric order (A-Z, 0-9, Z-A, 9-0)\n * - time: Sort by time (newest-to-oldest, oldest-to-newest)\n */\nconst sortingModes = [\"alphanumeric\", \"time\"] as const;\n\n/**\n * Sorting modes\n * - alphanumeric: Sort by alphanumeric order (A-Z, 0-9, Z-A, 9-0)\n * - time: Sort by time (newest-to-oldest, oldest-to-newest)\n */\ntype SortingMode = (typeof sortingModes)[number];\n\n/**\n * Type guard for sorting modes\n * - alphanumeric: Sort by alphanumeric order (A-Z, 0-9, Z-A, 9-0)\n * - time: Sort by time (newest-to-oldest, oldest-to-newest)\n *\n * @example isSortingMode(\"alphanumeric\") // true\n * @example isSortingMode(\"time\") // true\n * @example isSortingMode(\"foo\") // false\n */\nconst isSortingMode = (value: unknown): value is SortingMode =>\n\ttypeof value === \"string\" && sortingModes.includes(value as SortingMode);\n\n/**\n * Runtime type-to-value helper for sorting modes\n * - alphanumeric: Sort by alphanumeric order (A-Z, 0-9, Z-A, 9-0)\n * - time: Sort by time (newest-to-oldest, oldest-to-newest)\n *\n * @example $sortingMode(\"alphanumeric\") // \"alphanumeric\"\n * @example $sortingMode(\"time\") // \"time\"\n */\nconst $sortingMode = <T extends SortingMode = SortingMode>(value: T) => value;\n\n/**\n * Sorting directions\n * - asc: Ascending order (alphanumeric: A-Z, 0-9; time: oldest-to-newest)\n * - desc: Descending order (alphanumeric: Z-A, 9-0; time: newest-to-oldest)\n */\nconst sortingDirections = [\"asc\", \"desc\"] as const;\n\n/**\n * Sorting directions\n * - asc: Ascending order (alphanumeric: A-Z, 0-9; time: oldest-to-newest)\n * - desc: Descending order (alphanumeric: Z-A, 9-0; time: newest-to-oldest)\n */\ntype SortingDirection = (typeof sortingDirections)[number];\n\n/**\n * Type guard for sorting directions\n * - asc: Ascending order (alphanumeric: A-Z, 0-9; time: oldest-to-newest)\n * - desc: Descending order (alphanumeric: Z-A, 9-0; time: newest-to-oldest)\n *\n * @example isSortingDirection(\"asc\") // true\n * @example isSortingDirection(\"desc\") // true\n * @example isSortingDirection(\"foo\") // false\n */\nconst isSortingDirection = (value: unknown): value is SortingDirection =>\n\ttypeof value === \"string\" && sortingDirections.includes(value as SortingDirection);\n\n/**\n * Runtime type-to-value helper for sorting directions\n * - asc: Ascending order (alphanumeric: A-Z, 0-9; time: oldest-to-newest)\n * - desc: Descending order (alphanumeric: Z-A, 9-0; time: newest-to-oldest)\n *\n * @example $sortingDirection(\"asc\") // \"asc\"\n * @example $sortingDirection(\"desc\") // \"desc\"\n */\nconst $sortingDirection = <T extends SortingDirection = SortingDirection>(value: T) => value;\n\n/**\n * Alphanumeric sorting directions\n * - asc: Ascending order (A-Z, 0-9)\n * - desc: Descending order (Z-A, 9-0)\n */\nconst alphanumericSortingDirections = [...sortingDirections] as const;\n\n/**\n * Alphanumeric sorting directions\n * - asc: Ascending order (A-Z, 0-9)\n * - desc: Descending order (Z-A, 9-0)\n */\ntype AlphanumericSortingDirection = (typeof alphanumericSortingDirections)[number];\n\n/**\n * Type guard for alphanumeric sorting directions\n * - asc: Ascending order (A-Z, 0-9)\n * - desc: Descending order (Z-A, 9-0)\n *\n * @example isAlphanumericSortingDirection(\"asc\") // true\n * @example isAlphanumericSortingDirection(\"desc\") // true\n * @example isAlphanumericSortingDirection(\"foo\") // false\n */\nconst isAlphanumericSortingDirection = (value: unknown): value is AlphanumericSortingDirection =>\n\ttypeof value === \"string\" &&\n\talphanumericSortingDirections.includes(value as AlphanumericSortingDirection);\n\n/**\n * Runtime type-to-value helper for alphanumeric sorting directions\n * - asc: Ascending order (A-Z, 0-9)\n * - desc: Descending order (Z-A, 9-0)\n *\n * @example $alphanumericSortingDirection(\"asc\") // \"asc\"\n * @example $alphanumericSortingDirection(\"desc\") // \"desc\"\n */\nconst $alphanumericSortingDirection = <\n\tT extends AlphanumericSortingDirection = AlphanumericSortingDirection,\n>(\n\tvalue: T,\n) => value;\n\n/**\n * Time sorting directions\n * - newest-to-oldest: Descending order (newest first, oldest last)\n * - oldest-to-newest: Ascending order (oldest first, newest last)\n */\nconst timeSortingDirections = [\"newest-to-oldest\", \"oldest-to-newest\"] as const;\n\n/**\n * Time sorting directions\n * - newest-to-oldest: Descending order (newest first, oldest last)\n * - oldest-to-newest: Ascending order (oldest first, newest last)\n */\ntype TimeSortingDirection = (typeof timeSortingDirections)[number];\n\n/**\n * Type guard for time sorting directions\n * - newest-to-oldest: Descending order (newest first, oldest last)\n * - oldest-to-newest: Ascending order (oldest first, newest last)\n *\n * @example isTimeSortingDirection(\"newest-to-oldest\") // true\n * @example isTimeSortingDirection(\"oldest-to-newest\") // true\n * @example isTimeSortingDirection(\"foo\") // false\n * @example isTimeSortingDirection(\"asc\") // false\n * @example isTimeSortingDirection(\"desc\") // false\n */\nconst isTimeSortingDirection = (value: unknown): value is TimeSortingDirection =>\n\ttypeof value === \"string\" && timeSortingDirections.includes(value as TimeSortingDirection);\n\n/**\n * Converts a sorting direction to a time sorting direction\n * - asc -> oldest-to-newest\n * - desc -> newest-to-oldest\n */\nconst timeSortingByDirection = {\n\tasc: \"oldest-to-newest\",\n\tdesc: \"newest-to-oldest\",\n} as const satisfies Record<SortingDirection, TimeSortingDirection>;\n\n/**\n * Runtime type-to-value helper for time sorting directions.\n * If given a sorting direction, it will convert it to a time sorting direction.\n * - newest-to-oldest: Descending order (desc; newest first, oldest last)\n * - oldest-to-newest: Ascending order (asc; oldest first, newest last)\n *\n * @example $timeSortingDirection(\"asc\") // \"oldest-to-newest\"\n * @example $timeSortingDirection(\"desc\") // \"newest-to-oldest\"\n * @example $timeSortingDirection(\"oldest-to-newest\") // \"oldest-to-newest\"\n * @example $timeSortingDirection(\"newest-to-oldest\") // \"newest-to-oldest\"\n */\nfunction $timeSortingDirection<T extends TimeSortingDirection | SortingDirection>(value: T) {\n\tif (isSortingDirection(value)) {\n\t\treturn timeSortingByDirection[value];\n\t}\n\tif (isTimeSortingDirection(value)) {\n\t\treturn value;\n\t}\n\tthrow new Error(`Invalid time sorting direction given: \"${value}\"`);\n}\n\nexport {\n\t//,\n\t$alphanumericSortingDirection,\n\t$sortingDirection,\n\t$sortingMode,\n\t$timeSortingDirection,\n\talphanumericSortingDirections,\n\tisAlphanumericSortingDirection,\n\tisSortingDirection,\n\tisSortingMode,\n\tisTimeSortingDirection,\n\tsortingDirections,\n\tsortingModes,\n\ttimeSortingByDirection,\n\ttimeSortingDirections,\n};\n\nexport type {\n\t//,\n\tAlphanumericSortingDirection,\n\tSortingDirection,\n\tSortingMode,\n\tTimeSortingDirection,\n};\n"],"mappings":"AAKA,MAAM,EAAe,CAAC,eAAgB,OAAO,CAkBvC,EAAiB,GACtB,OAAO,GAAU,UAAY,EAAa,SAAS,EAAqB,CAUnE,EAAqD,GAAa,EAOlE,EAAoB,CAAC,MAAO,OAAO,CAkBnC,EAAsB,GAC3B,OAAO,GAAU,UAAY,EAAkB,SAAS,EAA0B,CAU7E,EAAoE,GAAa,EAOjF,EAAgC,CAAC,GAAG,EAAkB,CAkBtD,EAAkC,GACvC,OAAO,GAAU,UACjB,EAA8B,SAAS,EAAsC,CAUxE,EAGL,GACI,EAOC,EAAwB,CAAC,mBAAoB,mBAAmB,CAoBhE,EAA0B,GAC/B,OAAO,GAAU,UAAY,EAAsB,SAAS,EAA8B,CAOrF,EAAyB,CAC9B,IAAK,mBACL,KAAM,mBACN,CAaD,SAAS,EAAyE,EAAU,CAC3F,GAAI,EAAmB,EAAM,CAC5B,OAAO,EAAuB,GAE/B,GAAI,EAAuB,EAAM,CAChC,OAAO,EAER,MAAU,MAAM,0CAA0C,EAAM,GAAG"}
|
|
@@ -139,7 +139,7 @@ declare const timeSortingByDirection: {
|
|
|
139
139
|
declare function $timeSortingDirection<T extends TimeSortingDirection | SortingDirection>(value: T): {
|
|
140
140
|
readonly asc: "oldest-to-newest";
|
|
141
141
|
readonly desc: "newest-to-oldest";
|
|
142
|
-
}[(T & "
|
|
142
|
+
}[(T & "asc") | (T & "desc")] | (T & "newest-to-oldest") | (T & "oldest-to-newest");
|
|
143
143
|
//#endregion
|
|
144
144
|
export { timeSortingDirections as _, AlphanumericSortingDirection as a, TimeSortingDirection as c, isSortingDirection as d, isSortingMode as f, timeSortingByDirection as g, sortingModes as h, $timeSortingDirection as i, alphanumericSortingDirections as l, sortingDirections as m, $sortingDirection as n, SortingDirection as o, isTimeSortingDirection as p, $sortingMode as r, SortingMode as s, $alphanumericSortingDirection as t, isAlphanumericSortingDirection as u };
|
|
145
|
-
//# sourceMappingURL=direction-
|
|
145
|
+
//# sourceMappingURL=direction-MVSxfKWx.d.ts.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-BMH0fD_b.js";import{n}from"./separator-
|
|
2
|
-
//# sourceMappingURL=dropdown-menu-
|
|
1
|
+
import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-BMH0fD_b.js";import{n}from"./separator-BuP5aENE.js";import{forwardRef as r}from"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{CaretRightIcon as o}from"@phosphor-icons/react/CaretRight";import{CheckIcon as s}from"@phosphor-icons/react/Check";import*as c from"@radix-ui/react-dropdown-menu";const l=c.Root;l.displayName=`DropdownMenu`;const u=c.Trigger;u.displayName=`DropdownMenuTrigger`;const d=r(({className:t,...n},r)=>i(c.Group,{ref:r,className:e(`space-y-px`,t),...n}));d.displayName=`DropdownMenuGroup`;const f=c.Portal;f.displayName=`DropdownMenuPortal`;const p=c.Sub;p.displayName=`DropdownMenuSub`;const m=r(({className:t,...n},r)=>i(c.RadioGroup,{ref:r,className:e(`space-y-px`,t),...n}));m.displayName=`DropdownMenuRadioGroup`;const h=r(({className:n,inset:r,children:s,...l},u)=>a(c.SubTrigger,{className:e(`focus:bg-accent data-state-open:bg-accent relative flex select-none items-center rounded-md py-1.5 pl-2 pr-9 text-sm outline-hidden`,`data-highlighted:bg-active-menu-item data-state-open:bg-active-menu-item`,`[&>svg]:size-5 [&_svg]:shrink-0`,r&&`pl-8`,n),ref:u,...l,children:[s,i(`span`,{className:`absolute right-2 flex items-center`,children:i(t,{svg:i(o,{weight:`bold`}),className:`size-4`})})]}));h.displayName=`DropdownMenuSubTrigger`;const g=r(({className:t,loop:n=!0,...r},a)=>i(f,{children:i(c.SubContent,{className:e(`scrollbar`,`text-popover-foreground border-popover bg-popover p-1.25 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 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 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl space-y-px font-sans`,`my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto`,t),loop:n,ref:a,...r})}));g.displayName=`DropdownMenuSubContent`;const _=r(({className:t,onClick:n,loop:r=!0,width:a,...o},s)=>i(f,{children:i(c.Content,{ref:s,className:e(`scrollbar`,`text-popover-foreground border-popover bg-popover p-1.25 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl outline-hidden space-y-px font-sans`,`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`,`my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto`,a===`trigger`&&`w-(--radix-dropdown-menu-trigger-width)`,t),loop:r,onClick:e=>{e.stopPropagation(),n?.(e)},...o})}));_.displayName=`DropdownMenuContent`;const v=r(({className:t,inset:n,...r},a)=>i(c.Item,{ref:a,className:e(`relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 text-strong text-sm font-normal outline-hidden transition-colors`,`data-highlighted:bg-active-menu-item`,`focus:bg-accent focus:text-accent-foreground`,`data-disabled:cursor-default data-disabled:opacity-50`,`[&>svg]:size-5 [&_svg]:shrink-0`,n&&`pl-8`,t),...r}));v.displayName=`DropdownMenuItem`;const y=r(({className:n,children:r,checked:o,...l},u)=>a(c.CheckboxItem,{ref:u,className:e(`text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded-md py-1.5 pl-2 pr-9 text-sm font-normal outline-hidden`,`data-highlighted:bg-active-menu-item`,`aria-checked:bg-selected-menu-item`,`data-highlighted:aria-checked:bg-active-selected-menu-item!`,`[&>svg]:size-5 [&_svg]:shrink-0`,n),checked:o,...l,children:[i(`span`,{className:`absolute right-2 flex items-center`,children:i(c.ItemIndicator,{children:i(t,{svg:i(s,{weight:`bold`}),className:`size-4 text-accent-600`})})}),r]}));y.displayName=`DropdownMenuCheckboxItem`;const b=r(({className:n,children:r,...o},l)=>a(c.RadioItem,{className:e(`group/dropdown-menu-radio-item`,`text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded-md py-1.5 px-2 text-sm font-normal outline-none`,`data-highlighted:bg-active-menu-item`,`aria-checked:bg-selected-menu-item aria-checked:pr-9`,`data-highlighted:aria-checked:bg-active-selected-menu-item!`,`[&>svg]:size-5 [&_svg]:shrink-0`,n),ref:l,...o,children:[i(`span`,{className:`absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex`,children:i(c.ItemIndicator,{children:i(t,{svg:i(s,{weight:`bold`}),className:`size-4 text-accent-600`})})}),r]}));b.displayName=`DropdownMenuRadioItem`;const x=r(({className:t,inset:n,...r},a)=>i(c.Label,{ref:a,className:e(`px-2 py-1.5 text-sm font-medium`,n&&`pl-8`,t),...r}));x.displayName=`DropdownMenuLabel`;const S=r(({className:t,...r},a)=>i(n,{ref:a,className:e(`-mx-1.25 my-1 w-auto`,t),...r}));S.displayName=`DropdownMenuSeparator`;const C=({className:t,...n})=>i(`span`,{className:e(`ml-auto text-xs tracking-widest opacity-60`,t),...n});C.displayName=`DropdownMenuShortcut`;const w={Root:l,CheckboxItem:y,Content:_,Group:d,Item:v,Label:x,RadioGroup:m,RadioItem:b,Separator:S,Shortcut:C,Sub:p,SubContent:g,SubTrigger:h,Trigger:u};export{w as t};
|
|
2
|
+
//# sourceMappingURL=dropdown-menu-9nO7ch0t.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu-CUwyTKyu.js","names":[],"sources":["../src/components/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { CaretRightIcon } from \"@phosphor-icons/react/CaretRight\";\nimport { CheckIcon } from \"@phosphor-icons/react/Check\";\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentProps, ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Separator } from \"../separator/separator.js\";\n\n/**\n * A menu of options or actions, triggered by a button.\n * This is the root, stateful component that manages the open/closed state of the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuroot\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Root = DropdownMenuPrimitive.Root;\nRoot.displayName = \"DropdownMenu\";\n\n/**\n * The trigger button that opens the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenutrigger\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Trigger = DropdownMenuPrimitive.Trigger;\nTrigger.displayName = \"DropdownMenuTrigger\";\n\nconst Group = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Group>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Group>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Group ref={ref} className={cx(\"space-y-px\", className)} {...props} />\n));\nGroup.displayName = \"DropdownMenuGroup\";\n\n/**\n * The portal container for rendering dropdown content outside the normal DOM tree.\n */\nconst Portal = DropdownMenuPrimitive.Portal;\nPortal.displayName = \"DropdownMenuPortal\";\n\nconst Sub = DropdownMenuPrimitive.Sub;\nSub.displayName = \"DropdownMenuSub\";\n\nconst RadioGroup = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.RadioGroup>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioGroup>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.RadioGroup ref={ref} className={cx(\"space-y-px\", className)} {...props} />\n));\nRadioGroup.displayName = \"DropdownMenuRadioGroup\";\n\n/**\n * A trigger for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubtrigger\n */\nconst SubTrigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubTrigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubTrigger\n\t\tclassName={cx(\n\t\t\t\"focus:bg-accent data-state-open:bg-accent relative flex select-none items-center rounded-md py-1.5 pl-2 pr-9 text-sm outline-hidden\",\n\t\t\t\"data-highlighted:bg-active-menu-item data-state-open:bg-active-menu-item\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\tref={ref}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<Icon svg={<CaretRightIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t</span>\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nSubTrigger.displayName = \"DropdownMenuSubTrigger\";\n\n/**\n * The content container for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubcontent\n */\nconst SubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, loop = true, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.SubContent\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 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 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 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl space-y-px font-sans\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nSubContent.displayName = \"DropdownMenuSubContent\";\n\ntype DropdownMenuContentProps = ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & {\n\t/**\n\t * Whether the DropdownMenuContent should match the width of the trigger or use the intrinsic content width.\n\t */\n\twidth?: \"trigger\" | \"content\";\n};\n\n/**\n * The container for the dropdown menu content.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucontent\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Content = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tDropdownMenuContentProps\n>(({ className, onClick, loop = true, width, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl outline-hidden space-y-px font-sans\",\n\t\t\t\t\"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\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\twidth === \"trigger\" && \"w-(--radix-dropdown-menu-trigger-width)\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tonClick={(event) => {\n\t\t\t\t/**\n\t\t\t\t * Prevent the click event from propagating up to parent/containing elements\n\t\t\t\t * of the DropdownMenu\n\t\t\t\t */\n\t\t\t\tevent.stopPropagation();\n\t\t\t\tonClick?.(event);\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nContent.displayName = \"DropdownMenuContent\";\n\n/**\n * An item in the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuitem\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Item = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 text-strong text-sm font-normal outline-hidden transition-colors\",\n\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\"focus:bg-accent focus:text-accent-foreground\",\n\t\t\t\"data-disabled:cursor-default data-disabled:opacity-50\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nItem.displayName = \"DropdownMenuItem\";\n\n/**\n * A menu item with a checkbox that can be controlled or uncontrolled.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucheckboxitem\n */\nconst CheckboxItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n\t<DropdownMenuPrimitive.CheckboxItem\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded-md py-1.5 pl-2 pr-9 text-sm font-normal outline-hidden\",\n\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\"aria-checked:bg-selected-menu-item\",\n\t\t\t\"data-highlighted:aria-checked:bg-active-selected-menu-item!\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tclassName,\n\t\t)}\n\t\tchecked={checked}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4 text-accent-600\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nCheckboxItem.displayName = \"DropdownMenuCheckboxItem\";\n\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.RadioItem\n> & {\n\tname?: string;\n\tid?: string;\n};\n\n/**\n * A menu item with a radio button that can be controlled or uncontrolled.\n * Used within a RadioGroup to create a set of mutually exclusive options.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradioitem\n */\nconst RadioItem = forwardRef<ComponentRef<\"input\">, DropdownMenuRadioItemProps>(\n\t({ className, children, ...props }, ref) => (\n\t\t<DropdownMenuPrimitive.RadioItem\n\t\t\tclassName={cx(\n\t\t\t\t\"group/dropdown-menu-radio-item\",\n\t\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded-md py-1.5 px-2 text-sm font-normal outline-none\",\n\t\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\t\"aria-checked:bg-selected-menu-item aria-checked:pr-9\",\n\t\t\t\t\"data-highlighted:aria-checked:bg-active-selected-menu-item!\",\n\t\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex\">\n\t\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4 text-accent-600\" />\n\t\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</DropdownMenuPrimitive.RadioItem>\n\t),\n);\nRadioItem.displayName = \"DropdownMenuRadioItem\";\n\n/**\n * A label for a group of dropdown menu items.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenulabel\n */\nconst Label = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cx(\"px-2 py-1.5 text-sm font-medium\", inset && \"pl-8\", className)}\n\t\t{...props}\n\t/>\n));\nLabel.displayName = \"DropdownMenuLabel\";\n\n/**\n * A visual separator between dropdown menu items or groups.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuseparator\n */\nconst DropdownSeparator = forwardRef<\n\tComponentRef<typeof Separator>,\n\tComponentPropsWithoutRef<typeof Separator>\n>(({ className, ...props }, ref) => (\n\t<Separator ref={ref} className={cx(\"-mx-1.25 my-1 w-auto\", className)} {...props} />\n));\nDropdownSeparator.displayName = \"DropdownMenuSeparator\";\n\nconst Shortcut = ({ className, ...props }: ComponentProps<\"span\">) => {\n\treturn (\n\t\t<span className={cx(\"ml-auto text-xs tracking-widest opacity-60\", className)} {...props} />\n\t);\n};\nShortcut.displayName = \"DropdownMenuShortcut\";\n\n/**\n * A menu of options or actions, triggered by a button.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst DropdownMenu = {\n\t/**\n\t * The root, stateful component that manages the open/closed state of the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger asChild>\n\t * <Button>Open Menu</Button>\n\t * </DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A checkbox item in the dropdown menu that can be toggled on and off.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucheckboxitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.CheckboxItem checked={true} onCheckedChange={setChecked}>\n\t * Show notifications\n\t * </DropdownMenu.CheckboxItem>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tCheckboxItem,\n\t/**\n\t * The container for the dropdown menu content. Appears in a portal with scrolling and animations.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content width=\"trigger\">\n\t * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * A group container for organizing related dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenugroup\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Group>\n\t * <DropdownMenu.Label>Account</DropdownMenu.Label>\n\t * <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t * </DropdownMenu.Group>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * A standard item in the dropdown menu that can be selected or activated.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item onSelect={() => handleEdit()}>\n\t * Edit\n\t * </DropdownMenu.Item>\n\t * <DropdownMenu.Item disabled>\n\t * Delete\n\t * </DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tItem,\n\t/**\n\t * A label for grouping and describing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenulabel\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Label>My Account</DropdownMenu.Label>\n\t * <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tLabel,\n\t/**\n\t * A radio group container for exclusive selection within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradiogroup\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.RadioGroup value={value} onValueChange={setValue}>\n\t * <DropdownMenu.RadioItem value=\"option1\">Option 1</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"option2\">Option 2</DropdownMenu.RadioItem>\n\t * </DropdownMenu.RadioGroup>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioGroup,\n\t/**\n\t * A radio item in the dropdown menu where only one item in the group can be selected.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradioitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.RadioGroup value=\"small\" onValueChange={setSize}>\n\t * <DropdownMenu.RadioItem value=\"small\">Small</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"medium\">Medium</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"large\">Large</DropdownMenu.RadioItem>\n\t * </DropdownMenu.RadioGroup>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioItem,\n\t/**\n\t * A visual separator for dividing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuseparator\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Copy</DropdownMenu.Item>\n\t * <DropdownMenu.Separator />\n\t * <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSeparator: DropdownSeparator,\n\t/**\n\t * A keyboard shortcut indicator for dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenushortcut\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>\n\t * Save\n\t * <DropdownMenu.Shortcut>⌘S</DropdownMenu.Shortcut>\n\t * </DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tShortcut,\n\t/**\n\t * A submenu container for creating nested dropdown menus.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusub\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>More options</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Sub item 1</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Sub item 2</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSub,\n\t/**\n\t * The content container for submenu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>Export</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Export as PDF</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Export as CSV</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubContent,\n\t/**\n\t * The trigger item that opens a submenu when hovered or focused.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubtrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>Share</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Email</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Copy link</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubTrigger,\n\t/**\n\t * The trigger button that opens the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenutrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Menu\n\t * </Button>\n\t * </DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDropdownMenu,\n};\n"],"mappings":"6WA8BA,MAAM,EAAO,EAAsB,KACnC,EAAK,YAAc,eAqBnB,MAAM,EAAU,EAAsB,QACtC,EAAQ,YAAc,sBAEtB,MAAM,EAAQ,GAGX,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAsB,MAAvB,CAAkC,MAAK,UAAW,EAAG,aAAc,EAAU,CAAE,GAAI,EAAS,CAAA,CAC3F,CACF,EAAM,YAAc,oBAKpB,MAAM,EAAS,EAAsB,OACrC,EAAO,YAAc,qBAErB,MAAM,EAAM,EAAsB,IAClC,EAAI,YAAc,kBAElB,MAAM,EAAa,GAGhB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAsB,WAAvB,CAAuC,MAAK,UAAW,EAAG,aAAc,EAAU,CAAE,GAAI,EAAS,CAAA,CAChG,CACF,EAAW,YAAc,yBAOzB,MAAM,EAAa,GAKhB,CAAE,YAAW,QAAO,WAAU,GAAG,GAAS,IAC5C,EAAC,EAAsB,WAAvB,CACC,UAAW,EACV,sIACA,2EACA,kCACA,GAAS,OACT,EACA,CACI,MACL,GAAI,WATL,CAWE,EACD,EAAC,OAAD,CAAM,UAAU,8CACf,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAgB,OAAO,OAAS,CAAA,CAAE,UAAU,SAAW,CAAA,CAC5D,CAAA,CAC2B,GAClC,CACF,EAAW,YAAc,yBAOzB,MAAM,EAAa,GAGhB,CAAE,YAAW,OAAO,GAAM,GAAG,GAAS,IACxC,EAAC,EAAD,CAAA,SACC,EAAC,EAAsB,WAAvB,CACC,UAAW,EACV,YACA,ucACA,4FACA,EACA,CACK,OACD,MACL,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAW,YAAc,yBA6BzB,MAAM,EAAU,GAGb,CAAE,YAAW,UAAS,OAAO,GAAM,QAAO,GAAG,GAAS,IACxD,EAAC,EAAD,CAAA,SACC,EAAC,EAAsB,QAAvB,CACM,MACL,UAAW,EACV,YACA,yJACA,+TACA,4FACA,IAAU,WAAa,0CACvB,EACA,CACK,OACN,QAAU,GAAU,CAKnB,EAAM,iBAAiB,CACvB,IAAU,EAAM,EAEjB,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAQ,YAAc,sBAsBtB,MAAM,EAAO,GAKV,CAAE,YAAW,QAAO,GAAG,GAAS,IAClC,EAAC,EAAsB,KAAvB,CACM,MACL,UAAW,EACV,gJACA,uCACA,+CACA,wDACA,kCACA,GAAS,OACT,EACA,CACD,GAAI,EACH,CAAA,CACD,CACF,EAAK,YAAc,mBAOnB,MAAM,EAAe,GAGlB,CAAE,YAAW,WAAU,UAAS,GAAG,GAAS,IAC9C,EAAC,EAAsB,aAAvB,CACM,MACL,UAAW,EACV,oMACA,uCACA,qCACA,8DACA,kCACA,EACA,CACQ,UACT,GAAI,WAXL,CAaC,EAAC,OAAD,CAAM,UAAU,8CACf,EAAC,EAAsB,cAAvB,CAAA,SACC,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAAE,UAAU,yBAA2B,CAAA,CACxC,CAAA,CAChC,CAAA,CACN,EACmC,GACpC,CACF,EAAa,YAAc,2BAe3B,MAAM,EAAY,GAChB,CAAE,YAAW,WAAU,GAAG,GAAS,IACnC,EAAC,EAAsB,UAAvB,CACC,UAAW,EACV,iCACA,6LACA,uCACA,uDACA,8DACA,kCACA,EACA,CACI,MACL,GAAI,WAXL,CAaC,EAAC,OAAD,CAAM,UAAU,iGACf,EAAC,EAAsB,cAAvB,CAAA,SACC,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAAE,UAAU,yBAA2B,CAAA,CACxC,CAAA,CAChC,CAAA,CACN,EACgC,GAEnC,CACD,EAAU,YAAc,wBAOxB,MAAM,EAAQ,GAKX,CAAE,YAAW,QAAO,GAAG,GAAS,IAClC,EAAC,EAAsB,MAAvB,CACM,MACL,UAAW,EAAG,kCAAmC,GAAS,OAAQ,EAAU,CAC5E,GAAI,EACH,CAAA,CACD,CACF,EAAM,YAAc,oBAOpB,MAAM,EAAoB,GAGvB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAD,CAAgB,MAAK,UAAW,EAAG,uBAAwB,EAAU,CAAE,GAAI,EAAS,CAAA,CACnF,CACF,EAAkB,YAAc,wBAEhC,MAAM,GAAY,CAAE,YAAW,GAAG,KAEhC,EAAC,OAAD,CAAM,UAAW,EAAG,6CAA8C,EAAU,CAAE,GAAI,EAAS,CAAA,CAG7F,EAAS,YAAc,uBAsBvB,MAAM,EAAe,CAkBpB,OAkBA,eAiBA,UAoBA,QAqBA,OAkBA,QAmBA,aAoBA,YAmBA,UAAW,EAmBX,WAsBA,MAsBA,aAsBA,aAoBA,UACA"}
|
|
1
|
+
{"version":3,"file":"dropdown-menu-9nO7ch0t.js","names":[],"sources":["../src/components/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { CaretRightIcon } from \"@phosphor-icons/react/CaretRight\";\nimport { CheckIcon } from \"@phosphor-icons/react/Check\";\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentProps, ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Separator } from \"../separator/separator.js\";\n\n/**\n * A menu of options or actions, triggered by a button.\n * This is the root, stateful component that manages the open/closed state of the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuroot\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Root = DropdownMenuPrimitive.Root;\nRoot.displayName = \"DropdownMenu\";\n\n/**\n * The trigger button that opens the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenutrigger\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Trigger = DropdownMenuPrimitive.Trigger;\nTrigger.displayName = \"DropdownMenuTrigger\";\n\nconst Group = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Group>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Group>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Group ref={ref} className={cx(\"space-y-px\", className)} {...props} />\n));\nGroup.displayName = \"DropdownMenuGroup\";\n\n/**\n * The portal container for rendering dropdown content outside the normal DOM tree.\n */\nconst Portal = DropdownMenuPrimitive.Portal;\nPortal.displayName = \"DropdownMenuPortal\";\n\nconst Sub = DropdownMenuPrimitive.Sub;\nSub.displayName = \"DropdownMenuSub\";\n\nconst RadioGroup = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.RadioGroup>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioGroup>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.RadioGroup ref={ref} className={cx(\"space-y-px\", className)} {...props} />\n));\nRadioGroup.displayName = \"DropdownMenuRadioGroup\";\n\n/**\n * A trigger for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubtrigger\n */\nconst SubTrigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubTrigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubTrigger\n\t\tclassName={cx(\n\t\t\t\"focus:bg-accent data-state-open:bg-accent relative flex select-none items-center rounded-md py-1.5 pl-2 pr-9 text-sm outline-hidden\",\n\t\t\t\"data-highlighted:bg-active-menu-item data-state-open:bg-active-menu-item\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\tref={ref}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<Icon svg={<CaretRightIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t</span>\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nSubTrigger.displayName = \"DropdownMenuSubTrigger\";\n\n/**\n * The content container for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubcontent\n */\nconst SubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, loop = true, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.SubContent\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 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 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 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl space-y-px font-sans\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nSubContent.displayName = \"DropdownMenuSubContent\";\n\ntype DropdownMenuContentProps = ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & {\n\t/**\n\t * Whether the DropdownMenuContent should match the width of the trigger or use the intrinsic content width.\n\t */\n\twidth?: \"trigger\" | \"content\";\n};\n\n/**\n * The container for the dropdown menu content.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucontent\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Content = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tDropdownMenuContentProps\n>(({ className, onClick, loop = true, width, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl outline-hidden space-y-px font-sans\",\n\t\t\t\t\"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\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\twidth === \"trigger\" && \"w-(--radix-dropdown-menu-trigger-width)\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tonClick={(event) => {\n\t\t\t\t/**\n\t\t\t\t * Prevent the click event from propagating up to parent/containing elements\n\t\t\t\t * of the DropdownMenu\n\t\t\t\t */\n\t\t\t\tevent.stopPropagation();\n\t\t\t\tonClick?.(event);\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nContent.displayName = \"DropdownMenuContent\";\n\n/**\n * An item in the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuitem\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Item = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 text-strong text-sm font-normal outline-hidden transition-colors\",\n\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\"focus:bg-accent focus:text-accent-foreground\",\n\t\t\t\"data-disabled:cursor-default data-disabled:opacity-50\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nItem.displayName = \"DropdownMenuItem\";\n\n/**\n * A menu item with a checkbox that can be controlled or uncontrolled.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucheckboxitem\n */\nconst CheckboxItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n\t<DropdownMenuPrimitive.CheckboxItem\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded-md py-1.5 pl-2 pr-9 text-sm font-normal outline-hidden\",\n\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\"aria-checked:bg-selected-menu-item\",\n\t\t\t\"data-highlighted:aria-checked:bg-active-selected-menu-item!\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tclassName,\n\t\t)}\n\t\tchecked={checked}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4 text-accent-600\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nCheckboxItem.displayName = \"DropdownMenuCheckboxItem\";\n\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.RadioItem\n> & {\n\tname?: string;\n\tid?: string;\n};\n\n/**\n * A menu item with a radio button that can be controlled or uncontrolled.\n * Used within a RadioGroup to create a set of mutually exclusive options.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradioitem\n */\nconst RadioItem = forwardRef<ComponentRef<\"input\">, DropdownMenuRadioItemProps>(\n\t({ className, children, ...props }, ref) => (\n\t\t<DropdownMenuPrimitive.RadioItem\n\t\t\tclassName={cx(\n\t\t\t\t\"group/dropdown-menu-radio-item\",\n\t\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded-md py-1.5 px-2 text-sm font-normal outline-none\",\n\t\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\t\"aria-checked:bg-selected-menu-item aria-checked:pr-9\",\n\t\t\t\t\"data-highlighted:aria-checked:bg-active-selected-menu-item!\",\n\t\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex\">\n\t\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4 text-accent-600\" />\n\t\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</DropdownMenuPrimitive.RadioItem>\n\t),\n);\nRadioItem.displayName = \"DropdownMenuRadioItem\";\n\n/**\n * A label for a group of dropdown menu items.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenulabel\n */\nconst Label = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cx(\"px-2 py-1.5 text-sm font-medium\", inset && \"pl-8\", className)}\n\t\t{...props}\n\t/>\n));\nLabel.displayName = \"DropdownMenuLabel\";\n\n/**\n * A visual separator between dropdown menu items or groups.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuseparator\n */\nconst DropdownSeparator = forwardRef<\n\tComponentRef<typeof Separator>,\n\tComponentPropsWithoutRef<typeof Separator>\n>(({ className, ...props }, ref) => (\n\t<Separator ref={ref} className={cx(\"-mx-1.25 my-1 w-auto\", className)} {...props} />\n));\nDropdownSeparator.displayName = \"DropdownMenuSeparator\";\n\nconst Shortcut = ({ className, ...props }: ComponentProps<\"span\">) => {\n\treturn (\n\t\t<span className={cx(\"ml-auto text-xs tracking-widest opacity-60\", className)} {...props} />\n\t);\n};\nShortcut.displayName = \"DropdownMenuShortcut\";\n\n/**\n * A menu of options or actions, triggered by a button.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst DropdownMenu = {\n\t/**\n\t * The root, stateful component that manages the open/closed state of the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger asChild>\n\t * <Button>Open Menu</Button>\n\t * </DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A checkbox item in the dropdown menu that can be toggled on and off.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucheckboxitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.CheckboxItem checked={true} onCheckedChange={setChecked}>\n\t * Show notifications\n\t * </DropdownMenu.CheckboxItem>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tCheckboxItem,\n\t/**\n\t * The container for the dropdown menu content. Appears in a portal with scrolling and animations.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content width=\"trigger\">\n\t * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * A group container for organizing related dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenugroup\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Group>\n\t * <DropdownMenu.Label>Account</DropdownMenu.Label>\n\t * <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t * </DropdownMenu.Group>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * A standard item in the dropdown menu that can be selected or activated.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item onSelect={() => handleEdit()}>\n\t * Edit\n\t * </DropdownMenu.Item>\n\t * <DropdownMenu.Item disabled>\n\t * Delete\n\t * </DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tItem,\n\t/**\n\t * A label for grouping and describing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenulabel\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Label>My Account</DropdownMenu.Label>\n\t * <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tLabel,\n\t/**\n\t * A radio group container for exclusive selection within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradiogroup\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.RadioGroup value={value} onValueChange={setValue}>\n\t * <DropdownMenu.RadioItem value=\"option1\">Option 1</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"option2\">Option 2</DropdownMenu.RadioItem>\n\t * </DropdownMenu.RadioGroup>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioGroup,\n\t/**\n\t * A radio item in the dropdown menu where only one item in the group can be selected.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradioitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.RadioGroup value=\"small\" onValueChange={setSize}>\n\t * <DropdownMenu.RadioItem value=\"small\">Small</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"medium\">Medium</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"large\">Large</DropdownMenu.RadioItem>\n\t * </DropdownMenu.RadioGroup>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioItem,\n\t/**\n\t * A visual separator for dividing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuseparator\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Copy</DropdownMenu.Item>\n\t * <DropdownMenu.Separator />\n\t * <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSeparator: DropdownSeparator,\n\t/**\n\t * A keyboard shortcut indicator for dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenushortcut\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>\n\t * Save\n\t * <DropdownMenu.Shortcut>⌘S</DropdownMenu.Shortcut>\n\t * </DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tShortcut,\n\t/**\n\t * A submenu container for creating nested dropdown menus.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusub\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>More options</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Sub item 1</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Sub item 2</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSub,\n\t/**\n\t * The content container for submenu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>Export</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Export as PDF</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Export as CSV</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubContent,\n\t/**\n\t * The trigger item that opens a submenu when hovered or focused.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubtrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>Share</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Email</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Copy link</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubTrigger,\n\t/**\n\t * The trigger button that opens the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenutrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Menu\n\t * </Button>\n\t * </DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDropdownMenu,\n};\n"],"mappings":"6WA8BA,MAAM,EAAO,EAAsB,KACnC,EAAK,YAAc,eAqBnB,MAAM,EAAU,EAAsB,QACtC,EAAQ,YAAc,sBAEtB,MAAM,EAAQ,GAGX,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAsB,MAAvB,CAAkC,MAAK,UAAW,EAAG,aAAc,EAAU,CAAE,GAAI,EAAS,CAAA,CAC3F,CACF,EAAM,YAAc,oBAKpB,MAAM,EAAS,EAAsB,OACrC,EAAO,YAAc,qBAErB,MAAM,EAAM,EAAsB,IAClC,EAAI,YAAc,kBAElB,MAAM,EAAa,GAGhB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAsB,WAAvB,CAAuC,MAAK,UAAW,EAAG,aAAc,EAAU,CAAE,GAAI,EAAS,CAAA,CAChG,CACF,EAAW,YAAc,yBAOzB,MAAM,EAAa,GAKhB,CAAE,YAAW,QAAO,WAAU,GAAG,GAAS,IAC5C,EAAC,EAAsB,WAAvB,CACC,UAAW,EACV,sIACA,2EACA,kCACA,GAAS,OACT,EACA,CACI,MACL,GAAI,WATL,CAWE,EACD,EAAC,OAAD,CAAM,UAAU,8CACf,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAgB,OAAO,OAAS,CAAA,CAAE,UAAU,SAAW,CAAA,CAC5D,CAAA,CAC2B,GAClC,CACF,EAAW,YAAc,yBAOzB,MAAM,EAAa,GAGhB,CAAE,YAAW,OAAO,GAAM,GAAG,GAAS,IACxC,EAAC,EAAD,CAAA,SACC,EAAC,EAAsB,WAAvB,CACC,UAAW,EACV,YACA,ucACA,4FACA,EACA,CACK,OACD,MACL,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAW,YAAc,yBA6BzB,MAAM,EAAU,GAGb,CAAE,YAAW,UAAS,OAAO,GAAM,QAAO,GAAG,GAAS,IACxD,EAAC,EAAD,CAAA,SACC,EAAC,EAAsB,QAAvB,CACM,MACL,UAAW,EACV,YACA,yJACA,+TACA,4FACA,IAAU,WAAa,0CACvB,EACA,CACK,OACN,QAAU,GAAU,CAKnB,EAAM,iBAAiB,CACvB,IAAU,EAAM,EAEjB,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAQ,YAAc,sBAsBtB,MAAM,EAAO,GAKV,CAAE,YAAW,QAAO,GAAG,GAAS,IAClC,EAAC,EAAsB,KAAvB,CACM,MACL,UAAW,EACV,gJACA,uCACA,+CACA,wDACA,kCACA,GAAS,OACT,EACA,CACD,GAAI,EACH,CAAA,CACD,CACF,EAAK,YAAc,mBAOnB,MAAM,EAAe,GAGlB,CAAE,YAAW,WAAU,UAAS,GAAG,GAAS,IAC9C,EAAC,EAAsB,aAAvB,CACM,MACL,UAAW,EACV,oMACA,uCACA,qCACA,8DACA,kCACA,EACA,CACQ,UACT,GAAI,WAXL,CAaC,EAAC,OAAD,CAAM,UAAU,8CACf,EAAC,EAAsB,cAAvB,CAAA,SACC,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAAE,UAAU,yBAA2B,CAAA,CACxC,CAAA,CAChC,CAAA,CACN,EACmC,GACpC,CACF,EAAa,YAAc,2BAe3B,MAAM,EAAY,GAChB,CAAE,YAAW,WAAU,GAAG,GAAS,IACnC,EAAC,EAAsB,UAAvB,CACC,UAAW,EACV,iCACA,6LACA,uCACA,uDACA,8DACA,kCACA,EACA,CACI,MACL,GAAI,WAXL,CAaC,EAAC,OAAD,CAAM,UAAU,iGACf,EAAC,EAAsB,cAAvB,CAAA,SACC,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAAE,UAAU,yBAA2B,CAAA,CACxC,CAAA,CAChC,CAAA,CACN,EACgC,GAEnC,CACD,EAAU,YAAc,wBAOxB,MAAM,EAAQ,GAKX,CAAE,YAAW,QAAO,GAAG,GAAS,IAClC,EAAC,EAAsB,MAAvB,CACM,MACL,UAAW,EAAG,kCAAmC,GAAS,OAAQ,EAAU,CAC5E,GAAI,EACH,CAAA,CACD,CACF,EAAM,YAAc,oBAOpB,MAAM,EAAoB,GAGvB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAD,CAAgB,MAAK,UAAW,EAAG,uBAAwB,EAAU,CAAE,GAAI,EAAS,CAAA,CACnF,CACF,EAAkB,YAAc,wBAEhC,MAAM,GAAY,CAAE,YAAW,GAAG,KAEhC,EAAC,OAAD,CAAM,UAAW,EAAG,6CAA8C,EAAU,CAAE,GAAI,EAAS,CAAA,CAG7F,EAAS,YAAc,uBAsBvB,MAAM,EAAe,CAkBpB,OAkBA,eAiBA,UAoBA,QAqBA,OAkBA,QAmBA,aAoBA,YAmBA,UAAW,EAmBX,WAsBA,MAsBA,aAsBA,aAoBA,UACA"}
|