@ngrok/mantle 0.23.2 → 0.24.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/accordion.d.ts +1 -1
- package/dist/accordion.js +1 -1
- package/dist/alert-dialog.d.ts +373 -14
- package/dist/alert-dialog.js +1 -1
- package/dist/alert-dialog.js.map +1 -1
- package/dist/alert.d.ts +1 -1
- package/dist/anchor.d.ts +32 -5
- package/dist/anchor.js +1 -1
- package/dist/anchor.js.map +1 -1
- package/dist/{as-child-Cvu56SuO.d.ts → as-child-DJ7x3JFV.d.ts} +3 -4
- package/dist/badge.d.ts +14 -4
- package/dist/badge.js +1 -1
- package/dist/badge.js.map +1 -1
- package/dist/button.d.ts +5 -2
- package/dist/button.js +1 -1
- package/dist/calendar.js +1 -1
- package/dist/card.d.ts +112 -11
- package/dist/card.js +1 -1
- package/dist/card.js.map +1 -1
- package/dist/{chunk-DJGIRPRQ.js → chunk-7O36LG52.js} +1 -1
- package/dist/chunk-7O36LG52.js.map +1 -0
- package/dist/{chunk-5WFRLY2G.js → chunk-ATNIDU3M.js} +2 -2
- package/dist/{chunk-PJLA4NRO.js → chunk-J3NVDJIE.js} +2 -2
- package/dist/chunk-J3NVDJIE.js.map +1 -0
- package/dist/{chunk-ESJ3HLYJ.js → chunk-XBVAQ3DV.js} +2 -2
- package/dist/code-block.js +1 -1
- package/dist/combobox.d.ts +5 -5
- package/dist/combobox.js.map +1 -1
- package/dist/dialog.d.ts +2 -2
- package/dist/dialog.js +1 -1
- package/dist/dropdown-menu.d.ts +1 -1
- package/dist/flag.d.ts +4 -0
- package/dist/flag.js.map +1 -1
- package/dist/{icon-D6P9AESZ.d.ts → icon-CS9xptlK.d.ts} +9 -0
- package/dist/{icon-button-CZzW1XWB.d.ts → icon-button-D41yiI7H.d.ts} +1 -1
- package/dist/icon.d.ts +1 -1
- package/dist/icon.js +1 -1
- package/dist/label.d.ts +23 -0
- package/dist/label.js.map +1 -1
- package/dist/media-object.d.ts +50 -5
- package/dist/media-object.js +1 -1
- package/dist/media-object.js.map +1 -1
- package/dist/pagination.d.ts +1 -1
- package/dist/pagination.js +1 -1
- package/dist/radio-group.d.ts +1 -1
- package/dist/sandboxed-on-click.d.ts +1 -1
- package/dist/select.d.ts +1 -1
- package/dist/separator.d.ts +1 -1
- package/dist/sheet.d.ts +2 -2
- package/dist/sheet.js +1 -1
- package/dist/skeleton.d.ts +19 -4
- package/dist/skeleton.js +1 -1
- package/dist/skeleton.js.map +1 -1
- package/dist/toast.d.ts +1 -1
- package/dist/toast.js +1 -1
- package/dist/types.d.ts +1 -1
- package/package.json +1 -1
- package/dist/chunk-DJGIRPRQ.js.map +0 -1
- package/dist/chunk-PJLA4NRO.js.map +0 -1
- /package/dist/{chunk-5WFRLY2G.js.map → chunk-ATNIDU3M.js.map} +0 -0
- /package/dist/{chunk-ESJ3HLYJ.js.map → chunk-XBVAQ3DV.js.map} +0 -0
package/dist/anchor.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import { HTMLAttributeAnchorTarget, AnchorHTMLAttributes } from 'react';
|
|
3
|
-
import { W as WithAsChild } from './as-child-
|
|
2
|
+
import { HTMLAttributeAnchorTarget, AnchorHTMLAttributes, ReactNode } from 'react';
|
|
3
|
+
import { W as WithAsChild } from './as-child-DJ7x3JFV.js';
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* The rel attribute defines the relationship between a linked resource and the current document. Valid on <link>, <a>, <area>, and <form>, the supported values depend on the element on which the attribute is found.
|
|
@@ -29,6 +29,15 @@ declare const anchorClassNames: (className?: string) => string;
|
|
|
29
29
|
* The props for the `Anchor` component.
|
|
30
30
|
*/
|
|
31
31
|
type AnchorProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "rel" | "target"> & WithAsChild & {
|
|
32
|
+
/**
|
|
33
|
+
* An icon to render inside the anchor
|
|
34
|
+
*/
|
|
35
|
+
icon?: ReactNode;
|
|
36
|
+
/**
|
|
37
|
+
* The side that the icon will render on, if one is present
|
|
38
|
+
* @default "start"
|
|
39
|
+
*/
|
|
40
|
+
iconPlacement?: "start" | "end";
|
|
32
41
|
/**
|
|
33
42
|
* The rel attribute defines the relationship between a linked resource and the current document.
|
|
34
43
|
*
|
|
@@ -51,12 +60,30 @@ type AnchorProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "rel" | "target
|
|
|
51
60
|
/**
|
|
52
61
|
* Fundamental component for rendering links to external addresses.
|
|
53
62
|
*
|
|
54
|
-
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
|
|
55
|
-
*
|
|
56
63
|
* @note If you need to link to an internal application route, prefer using the
|
|
57
64
|
* [`react-router` `<Link>`](https://reactrouter.com/en/main/components/link)
|
|
65
|
+
*
|
|
66
|
+
* @see https://mantle.ngrok.com/components/anchor#api
|
|
67
|
+
*
|
|
68
|
+
* @example
|
|
69
|
+
* ```tsx
|
|
70
|
+
* <Anchor href="https://ngrok.com/">ngrok.com</Anchor>
|
|
71
|
+
*
|
|
72
|
+
* <Anchor href="https://ngrok.com/docs" target="_blank" icon={<Book />}>
|
|
73
|
+
* ngrok docs
|
|
74
|
+
* </Anchor>
|
|
75
|
+
* ```
|
|
58
76
|
*/
|
|
59
|
-
declare const Anchor: react.ForwardRefExoticComponent<Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "
|
|
77
|
+
declare const Anchor: react.ForwardRefExoticComponent<Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "target" | "rel"> & WithAsChild & {
|
|
78
|
+
/**
|
|
79
|
+
* An icon to render inside the anchor
|
|
80
|
+
*/
|
|
81
|
+
icon?: ReactNode;
|
|
82
|
+
/**
|
|
83
|
+
* The side that the icon will render on, if one is present
|
|
84
|
+
* @default "start"
|
|
85
|
+
*/
|
|
86
|
+
iconPlacement?: "start" | "end";
|
|
60
87
|
/**
|
|
61
88
|
* The rel attribute defines the relationship between a linked resource and the current document.
|
|
62
89
|
*
|
package/dist/anchor.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as
|
|
1
|
+
import{a as n}from"./chunk-7O36LG52.js";import"./chunk-HDPLH5HC.js";import{a as m}from"./chunk-AZ56JGNY.js";import{Slot as y}from"@radix-ui/react-slot";import{Children as b,cloneElement as v,forwardRef as N,isValidElement as C}from"react";import x from"tiny-invariant";import{Fragment as T,jsx as t,jsxs as p}from"react/jsx-runtime";var d=r=>m("cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-none focus-visible:ring focus-visible:ring-focus-accent",r),u=N(({asChild:r,children:s,className:a,rel:l,icon:e,iconPlacement:o="start",...h},g)=>{let A=f(l),c={className:d(a),ref:g,rel:A,...h};if(r){let i=b.only(s);x(C(i),"When using `asChild`, Anchor must be passed a single child as a JSX tag.");let R=i.props?.children;return t(y,{...c,children:v(i,{},p(T,{children:[e&&o==="start"&&t(n,{className:"inline-block mr-1.5",svg:e}),R,e&&o==="end"&&t(n,{className:"inline-block ml-1.5",svg:e})]}))})}return p("a",{...c,children:[e&&o==="start"&&t(n,{className:"inline-block mr-1.5",svg:e}),s,e&&o==="end"&&t(n,{className:"inline-block ml-1.5",svg:e})]})});u.displayName="Anchor";function f(r){return Array.isArray(r)?[...new Set(r)].map(l=>l?.trim()).filter(Boolean).sort().join(" ")||void 0:r?.trim()||void 0}export{u as Anchor,d as anchorClassNames,f as resolveRel};
|
|
2
2
|
//# sourceMappingURL=anchor.js.map
|
package/dist/anchor.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/anchor/anchor.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../src/components/anchor/anchor.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { AnchorHTMLAttributes, ComponentRef, ReactNode } from \"react\";\nimport { Children, cloneElement, forwardRef, isValidElement } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport type { Rel, Target } from \"./types.js\";\n\n/**\n * The class names for the `Anchor` component which define the styles for the component.\n */\nconst anchorClassNames = (className?: string) =>\n\tcx(\n\t\t\"cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-none focus-visible:ring focus-visible:ring-focus-accent\",\n\t\tclassName,\n\t);\n\n/**\n * The props for the `Anchor` component.\n */\ntype AnchorProps = Omit<\n\tAnchorHTMLAttributes<HTMLAnchorElement>,\n\t\"rel\" | \"target\"\n> &\n\tWithAsChild & {\n\t\t/**\n\t\t * An icon to render inside the anchor\n\t\t */\n\t\ticon?: ReactNode;\n\t\t/**\n\t\t * The side that the icon will render on, if one is present\n\t\t * @default \"start\"\n\t\t */\n\t\ticonPlacement?: \"start\" | \"end\";\n\t\t/**\n\t\t * The rel attribute defines the relationship between a linked resource and the current document.\n\t\t *\n\t\t * Every keyword within a space-separated value should be unique within that value.\n\t\t *\n\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel\n\t\t */\n\t\trel?:\n\t\t\t| Rel\n\t\t\t| (string & {})\n\t\t\t| undefined\n\t\t\t| (Rel | (string & {}) | undefined | null)[];\n\t\t/**\n\t\t * Where to display the linked URL, as the name for a browsing context (a tab, window, or <iframe>).\n\t\t *\n\t\t * Note: Setting `target=\"_blank\"` on <a> elements implicitly provides the same rel behavior as setting `rel=\"noopener\"` which does not set `window.opener`.\n\t\t *\n\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target\n\t\t *\n\t\t * @default \"_self\"\n\t\t */\n\t\ttarget?: Target | undefined;\n\t};\n\n/**\n * Fundamental component for rendering links to external addresses.\n *\n * @note If you need to link to an internal application route, prefer using the\n * [`react-router` `<Link>`](https://reactrouter.com/en/main/components/link)\n *\n * @see https://mantle.ngrok.com/components/anchor#api\n *\n * @example\n * ```tsx\n * <Anchor href=\"https://ngrok.com/\">ngrok.com</Anchor>\n *\n * <Anchor href=\"https://ngrok.com/docs\" target=\"_blank\" icon={<Book />}>\n * ngrok docs\n * </Anchor>\n * ```\n */\nconst Anchor = forwardRef<ComponentRef<\"a\">, AnchorProps>(\n\t(\n\t\t{\n\t\t\tasChild,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\trel: propRel,\n\t\t\ticon,\n\t\t\ticonPlacement = \"start\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst rel = resolveRel(propRel);\n\t\tconst componentProps = {\n\t\t\tclassName: anchorClassNames(className),\n\t\t\tref,\n\t\t\trel,\n\t\t\t...props,\n\t\t};\n\n\t\tif (asChild) {\n\t\t\tconst singleChild = Children.only(children);\n\t\t\tinvariant(\n\t\t\t\tisValidElement<AnchorProps>(singleChild),\n\t\t\t\t\"When using `asChild`, Anchor must be passed a single child as a JSX tag.\",\n\t\t\t);\n\t\t\tconst grandchildren = singleChild.props?.children;\n\n\t\t\treturn (\n\t\t\t\t<Slot {...componentProps}>\n\t\t\t\t\t{cloneElement(\n\t\t\t\t\t\tsingleChild,\n\t\t\t\t\t\t{},\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{icon && iconPlacement === \"start\" && (\n\t\t\t\t\t\t\t\t<Icon className=\"inline-block mr-1.5\" svg={icon} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{grandchildren}\n\t\t\t\t\t\t\t{icon && iconPlacement === \"end\" && (\n\t\t\t\t\t\t\t\t<Icon className=\"inline-block ml-1.5\" svg={icon} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>,\n\t\t\t\t\t)}\n\t\t\t\t</Slot>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<a {...componentProps}>\n\t\t\t\t{icon && iconPlacement === \"start\" && (\n\t\t\t\t\t<Icon className=\"inline-block mr-1.5\" svg={icon} />\n\t\t\t\t)}\n\t\t\t\t{children}\n\t\t\t\t{icon && iconPlacement === \"end\" && (\n\t\t\t\t\t<Icon className=\"inline-block ml-1.5\" svg={icon} />\n\t\t\t\t)}\n\t\t\t</a>\n\t\t);\n\t},\n);\nAnchor.displayName = \"Anchor\";\n\n/**\n * Resolves the `rel` attribute to a string.\n *\n * If the value is an array, it will be filtered for empty values, ensure uniqueness, sorted, and joined with a space.\n */\nfunction resolveRel(\n\trel:\n\t\t| Rel\n\t\t| (string & {})\n\t\t| undefined\n\t\t| null\n\t\t| (Rel | (string & {}) | undefined | null)[],\n) {\n\tif (Array.isArray(rel)) {\n\t\tconst uniqueRel = new Set(rel);\n\t\tconst result = [...uniqueRel]\n\t\t\t.map((item) => item?.trim())\n\t\t\t.filter(Boolean)\n\t\t\t.sort()\n\t\t\t.join(\" \");\n\t\treturn result || undefined;\n\t}\n\n\treturn rel?.trim() || undefined;\n}\n\nexport {\n\t//,\n\tAnchor,\n\tanchorClassNames,\n\tresolveRel,\n};\n\nexport type {\n\t//,\n\tAnchorProps,\n};\n"],"mappings":"4GAAA,OAAS,QAAAA,MAAY,uBAErB,OAAS,YAAAC,EAAU,gBAAAC,EAAc,cAAAC,EAAY,kBAAAC,MAAsB,QACnE,OAAOC,MAAe,iBA2GhB,mBAAAC,EAEE,OAAAC,EAFF,QAAAC,MAAA,oBAlGN,IAAMC,EAAoBC,GACzBC,EACC,8IACAD,CACD,EA4DKE,EAASC,EACd,CACC,CACC,QAAAC,EACA,SAAAC,EACA,UAAAL,EACA,IAAKM,EACL,KAAAC,EACA,cAAAC,EAAgB,QAChB,GAAGC,CACJ,EACAC,IACI,CACJ,IAAMC,EAAMC,EAAWN,CAAO,EACxBO,EAAiB,CACtB,UAAWd,EAAiBC,CAAS,EACrC,IAAAU,EACA,IAAAC,EACA,GAAGF,CACJ,EAEA,GAAIL,EAAS,CACZ,IAAMU,EAAcC,EAAS,KAAKV,CAAQ,EAC1CW,EACCC,EAA4BH,CAAW,EACvC,0EACD,EACA,IAAMI,EAAgBJ,EAAY,OAAO,SAEzC,OACCjB,EAACsB,EAAA,CAAM,GAAGN,EACR,SAAAO,EACAN,EACA,CAAC,EACDhB,EAAAF,EAAA,CACE,UAAAW,GAAQC,IAAkB,SAC1BX,EAACwB,EAAA,CAAK,UAAU,sBAAsB,IAAKd,EAAM,EAEjDW,EACAX,GAAQC,IAAkB,OAC1BX,EAACwB,EAAA,CAAK,UAAU,sBAAsB,IAAKd,EAAM,GAEnD,CACD,EACD,CAEF,CAEA,OACCT,EAAC,KAAG,GAAGe,EACL,UAAAN,GAAQC,IAAkB,SAC1BX,EAACwB,EAAA,CAAK,UAAU,sBAAsB,IAAKd,EAAM,EAEjDF,EACAE,GAAQC,IAAkB,OAC1BX,EAACwB,EAAA,CAAK,UAAU,sBAAsB,IAAKd,EAAM,GAEnD,CAEF,CACD,EACAL,EAAO,YAAc,SAOrB,SAASU,EACRD,EAMC,CACD,OAAI,MAAM,QAAQA,CAAG,EAEL,CAAC,GADE,IAAI,IAAIA,CAAG,CACD,EAC1B,IAAKW,GAASA,GAAM,KAAK,CAAC,EAC1B,OAAO,OAAO,EACd,KAAK,EACL,KAAK,GAAG,GACO,OAGXX,GAAK,KAAK,GAAK,MACvB","names":["Slot","Children","cloneElement","forwardRef","isValidElement","invariant","Fragment","jsx","jsxs","anchorClassNames","className","cx","Anchor","forwardRef","asChild","children","propRel","icon","iconPlacement","props","ref","rel","resolveRel","componentProps","singleChild","Children","invariant","isValidElement","grandchildren","Slot","cloneElement","Icon","item"]}
|
|
@@ -3,15 +3,14 @@
|
|
|
3
3
|
*/
|
|
4
4
|
type WithAsChild = {
|
|
5
5
|
/**
|
|
6
|
-
* Use the `asChild` prop to compose
|
|
6
|
+
* Use the `asChild` prop to compose component functionality onto alternative
|
|
7
7
|
* element types or your own React components.
|
|
8
8
|
*
|
|
9
|
-
*
|
|
10
|
-
* prop. When `asChild` is set to `true`, Radix will not render a default DOM
|
|
9
|
+
* When `asChild` is set to `true`, mantle will not render a default DOM
|
|
11
10
|
* element, instead cloning the part's child and passing it the props and
|
|
12
11
|
* behavior required to make it functional.
|
|
13
12
|
*
|
|
14
|
-
* asChild can be used as deeply as you need to. This means it is a great way
|
|
13
|
+
* `asChild` can be used as deeply as you need to. This means it is a great way
|
|
15
14
|
* to compose multiple primitive's behavior together.
|
|
16
15
|
*
|
|
17
16
|
* @see https://www.radix-ui.com/docs/primitives/guides/composition#composition
|
package/dist/badge.d.ts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import {
|
|
3
|
-
import { W as WithAsChild } from './as-child-
|
|
2
|
+
import { ComponentProps, ReactNode } from 'react';
|
|
3
|
+
import { W as WithAsChild } from './as-child-DJ7x3JFV.js';
|
|
4
4
|
import { Color } from './color.js';
|
|
5
5
|
|
|
6
6
|
declare const appearances: readonly ["muted"];
|
|
7
7
|
type Appearance = (typeof appearances)[number];
|
|
8
|
-
type BadgeProps =
|
|
8
|
+
type BadgeProps = ComponentProps<"span"> & WithAsChild & {
|
|
9
9
|
/**
|
|
10
10
|
* The color variant of the badge. Accepts named colors and functional colors from the mantle color palette.
|
|
11
11
|
*/
|
|
@@ -20,7 +20,17 @@ type BadgeProps = HTMLAttributes<HTMLSpanElement> & WithAsChild & {
|
|
|
20
20
|
appearance: Appearance;
|
|
21
21
|
};
|
|
22
22
|
/**
|
|
23
|
-
* A Badge is a non-interactive component used to highlight important
|
|
23
|
+
* A Badge is a non-interactive component used to highlight important
|
|
24
|
+
* information or to visually indicate the status of an item.
|
|
25
|
+
*
|
|
26
|
+
* @see https://mantle.ngrok.com/components/badge#api
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* ```tsx
|
|
30
|
+
* <Badge appearance="muted" color="success">
|
|
31
|
+
* Succeeded
|
|
32
|
+
* </Badge>
|
|
33
|
+
* ```
|
|
24
34
|
*/
|
|
25
35
|
declare const Badge: ({ appearance, asChild, children, className, color, icon, ...props }: BadgeProps) => react_jsx_runtime.JSX.Element;
|
|
26
36
|
|
package/dist/badge.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as o}from"./chunk-HDPLH5HC.js";import{a as c}from"./chunk-AZ56JGNY.js";import{Slot as y}from"@radix-ui/react-slot";import{Children as f,cloneElement as
|
|
1
|
+
import{a as o}from"./chunk-HDPLH5HC.js";import{a as c}from"./chunk-AZ56JGNY.js";import{Slot as y}from"@radix-ui/react-slot";import{Children as f,cloneElement as C,isValidElement as h}from"react";import n from"tiny-invariant";import{Fragment as P,jsx as s,jsxs as d}from"react/jsx-runtime";var k=({appearance:t,asChild:e=!1,children:l,className:m,color:i="neutral",icon:r,...g})=>{let u=v(i,t),b=A(i,t),p=c("inline-flex w-fit shrink-0 cursor-default items-center gap-1 rounded px-1.5 py-0.5 font-medium text-xs",r&&"ps-1",u,b,m);if(e){let a=f.only(l);n(h(a),"When using `asChild`, Badge must be passed a single child as a JSX tag.");let x=a.props?.children;return s(y,{className:p,...g,children:C(a,{},d(P,{children:[r&&s(o,{className:"size-4",svg:r}),x]}))})}return d("span",{className:p,...g,children:[r&&s(o,{className:"size-4",svg:r}),l]})};var w={amber:"bg-amber-500/20",blue:"bg-blue-500/20",cyan:"bg-cyan-500/20",emerald:"bg-emerald-500/20",fuchsia:"bg-fuchsia-500/20",gray:"bg-gray-500/20",green:"bg-green-500/20",indigo:"bg-indigo-500/20",lime:"bg-lime-500/20",orange:"bg-orange-500/20",pink:"bg-pink-500/20",purple:"bg-purple-500/20",red:"bg-red-500/20",rose:"bg-rose-500/20",sky:"bg-sky-500/20",teal:"bg-teal-500/20",violet:"bg-violet-500/20",yellow:"bg-yellow-500/20",accent:"bg-accent-500/20",danger:"bg-danger-500/20",neutral:"bg-neutral-500/20",success:"bg-success-500/20",warning:"bg-warning-500/20"};function v(t,e){switch(e){case"muted":return w[t];default:n(!1,`Invalid appearance: ${String(e)}`)}}var B={amber:"text-amber-700",blue:"text-blue-700",cyan:"text-cyan-700",emerald:"text-emerald-700",fuchsia:"text-fuchsia-700",gray:"text-gray-700",green:"text-green-700",indigo:"text-indigo-700",lime:"text-lime-700",orange:"text-orange-700",pink:"text-pink-700",purple:"text-purple-700",red:"text-red-700",rose:"text-rose-700",sky:"text-sky-700",teal:"text-teal-700",violet:"text-violet-700",yellow:"text-yellow-700",accent:"text-accent-700",danger:"text-danger-700",neutral:"text-neutral-700",success:"text-success-700",warning:"text-warning-700"};function A(t,e){switch(e){case"muted":return B[t];default:n(!1,`Invalid appearance: ${String(e)}`)}}export{k as Badge};
|
|
2
2
|
//# sourceMappingURL=badge.js.map
|
package/dist/badge.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/badge/badge.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport {\n\tChildren,\n\ttype HTMLAttributes,\n\ttype ReactNode,\n\tcloneElement,\n\tisValidElement,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport type { Color } from \"../../utils/color/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\n\nconst appearances = [\"muted\" /*\"strong\" */] as const;\ntype Appearance = (typeof appearances)[number];\n\ntype BadgeProps =
|
|
1
|
+
{"version":3,"sources":["../src/components/badge/badge.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport {\n\tChildren,\n\ttype ComponentProps,\n\ttype HTMLAttributes,\n\ttype ReactNode,\n\tcloneElement,\n\tisValidElement,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport type { Color } from \"../../utils/color/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\n\nconst appearances = [\"muted\" /*\"strong\" */] as const;\ntype Appearance = (typeof appearances)[number];\n\ntype BadgeProps = ComponentProps<\"span\"> &\n\tWithAsChild & {\n\t\t/**\n\t\t * The color variant of the badge. Accepts named colors and functional colors from the mantle color palette.\n\t\t */\n\t\tcolor?: Color;\n\t\t/**\n\t\t * The icon to render inside the badge.\n\t\t */\n\t\ticon?: ReactNode;\n\t\t/**\n\t\t * The visual style of the badge.\n\t\t */\n\t\tappearance: Appearance;\n\t};\n\n/**\n * A Badge is a non-interactive component used to highlight important\n * information or to visually indicate the status of an item.\n *\n * @see https://mantle.ngrok.com/components/badge#api\n *\n * @example\n * ```tsx\n * <Badge appearance=\"muted\" color=\"success\">\n * Succeeded\n * </Badge>\n * ```\n */\nconst Badge = ({\n\tappearance,\n\tasChild = false,\n\tchildren,\n\tclassName,\n\tcolor = \"neutral\",\n\ticon,\n\t...props\n}: BadgeProps) => {\n\tconst bgColor = computeBgColor(color, appearance);\n\tconst textColor = computeTextColor(color, appearance);\n\n\tconst badgeClasses = cx(\n\t\t\"inline-flex w-fit shrink-0 cursor-default items-center gap-1 rounded px-1.5 py-0.5 font-medium text-xs\",\n\t\ticon && \"ps-1\",\n\t\tbgColor,\n\t\ttextColor,\n\t\tclassName,\n\t);\n\n\tif (asChild) {\n\t\tconst singleChild = Children.only(children);\n\t\tinvariant(\n\t\t\tisValidElement<BadgeProps>(singleChild),\n\t\t\t\"When using `asChild`, Badge must be passed a single child as a JSX tag.\",\n\t\t);\n\t\tconst grandchildren = singleChild.props?.children;\n\n\t\treturn (\n\t\t\t<Slot className={badgeClasses} {...props}>\n\t\t\t\t{cloneElement(\n\t\t\t\t\tsingleChild,\n\t\t\t\t\t{},\n\t\t\t\t\t<>\n\t\t\t\t\t\t{icon && <SvgOnly className=\"size-4\" svg={icon} />}\n\t\t\t\t\t\t{grandchildren}\n\t\t\t\t\t</>,\n\t\t\t\t)}\n\t\t\t</Slot>\n\t\t);\n\t}\n\n\treturn (\n\t\t<span className={badgeClasses} {...props}>\n\t\t\t{icon && <SvgOnly className=\"size-4\" svg={icon} />}\n\t\t\t{children}\n\t\t</span>\n\t);\n};\n\n// MARK: - Exports\n\nexport {\n\t//,\n\tBadge,\n};\n\nexport type {\n\t//,\n\tBadgeProps,\n};\n\n// MARK: - Private\n\nconst mutedBgColorLookup = {\n\tamber: \"bg-amber-500/20\",\n\tblue: \"bg-blue-500/20\",\n\tcyan: \"bg-cyan-500/20\",\n\temerald: \"bg-emerald-500/20\",\n\tfuchsia: \"bg-fuchsia-500/20\",\n\tgray: \"bg-gray-500/20\",\n\tgreen: \"bg-green-500/20\",\n\tindigo: \"bg-indigo-500/20\",\n\tlime: \"bg-lime-500/20\",\n\torange: \"bg-orange-500/20\",\n\tpink: \"bg-pink-500/20\",\n\tpurple: \"bg-purple-500/20\",\n\tred: \"bg-red-500/20\",\n\trose: \"bg-rose-500/20\",\n\tsky: \"bg-sky-500/20\",\n\tteal: \"bg-teal-500/20\",\n\tviolet: \"bg-violet-500/20\",\n\tyellow: \"bg-yellow-500/20\",\n\taccent: \"bg-accent-500/20\",\n\tdanger: \"bg-danger-500/20\",\n\tneutral: \"bg-neutral-500/20\",\n\tsuccess: \"bg-success-500/20\",\n\twarning: \"bg-warning-500/20\",\n} satisfies Record<Color, string>;\n\nfunction computeBgColor(color: Color, appearance: Appearance) {\n\tswitch (appearance) {\n\t\tcase \"muted\":\n\t\t\treturn mutedBgColorLookup[color];\n\t\tdefault:\n\t\t\tinvariant(false, `Invalid appearance: ${String(appearance)}`);\n\t}\n}\n\nconst textColorMutedLookup = {\n\tamber: \"text-amber-700\",\n\tblue: \"text-blue-700\",\n\tcyan: \"text-cyan-700\",\n\temerald: \"text-emerald-700\",\n\tfuchsia: \"text-fuchsia-700\",\n\tgray: \"text-gray-700\",\n\tgreen: \"text-green-700\",\n\tindigo: \"text-indigo-700\",\n\tlime: \"text-lime-700\",\n\torange: \"text-orange-700\",\n\tpink: \"text-pink-700\",\n\tpurple: \"text-purple-700\",\n\tred: \"text-red-700\",\n\trose: \"text-rose-700\",\n\tsky: \"text-sky-700\",\n\tteal: \"text-teal-700\",\n\tviolet: \"text-violet-700\",\n\tyellow: \"text-yellow-700\",\n\taccent: \"text-accent-700\",\n\tdanger: \"text-danger-700\",\n\tneutral: \"text-neutral-700\",\n\tsuccess: \"text-success-700\",\n\twarning: \"text-warning-700\",\n} satisfies Record<Color, string>;\n\nfunction computeTextColor(color: Color, appearance: Appearance) {\n\tswitch (appearance) {\n\t\tcase \"muted\":\n\t\t\treturn textColorMutedLookup[color];\n\t\tdefault:\n\t\t\tinvariant(false, `Invalid appearance: ${String(appearance)}`);\n\t}\n}\n"],"mappings":"gFAAA,OAAS,QAAAA,MAAY,uBACrB,OACC,YAAAC,EAIA,gBAAAC,EACA,kBAAAC,MACM,QACP,OAAOC,MAAe,iBAuEjB,mBAAAC,EACU,OAAAC,EADV,QAAAC,MAAA,oBAjCL,IAAMC,EAAQ,CAAC,CACd,WAAAC,EACA,QAAAC,EAAU,GACV,SAAAC,EACA,UAAAC,EACA,MAAAC,EAAQ,UACR,KAAAC,EACA,GAAGC,CACJ,IAAkB,CACjB,IAAMC,EAAUC,EAAeJ,EAAOJ,CAAU,EAC1CS,EAAYC,EAAiBN,EAAOJ,CAAU,EAE9CW,EAAeC,EACpB,yGACAP,GAAQ,OACRE,EACAE,EACAN,CACD,EAEA,GAAIF,EAAS,CACZ,IAAMY,EAAcC,EAAS,KAAKZ,CAAQ,EAC1Ca,EACCC,EAA2BH,CAAW,EACtC,yEACD,EACA,IAAMI,EAAgBJ,EAAY,OAAO,SAEzC,OACCK,EAACC,EAAA,CAAK,UAAWR,EAAe,GAAGL,EACjC,SAAAc,EACAP,EACA,CAAC,EACDQ,EAAAC,EAAA,CACE,UAAAjB,GAAQa,EAACK,EAAA,CAAQ,UAAU,SAAS,IAAKlB,EAAM,EAC/CY,GACF,CACD,EACD,CAEF,CAEA,OACCI,EAAC,QAAK,UAAWV,EAAe,GAAGL,EACjC,UAAAD,GAAQa,EAACK,EAAA,CAAQ,UAAU,SAAS,IAAKlB,EAAM,EAC/CH,GACF,CAEF,EAgBA,IAAMsB,EAAqB,CAC1B,MAAO,kBACP,KAAM,iBACN,KAAM,iBACN,QAAS,oBACT,QAAS,oBACT,KAAM,iBACN,MAAO,kBACP,OAAQ,mBACR,KAAM,iBACN,OAAQ,mBACR,KAAM,iBACN,OAAQ,mBACR,IAAK,gBACL,KAAM,iBACN,IAAK,gBACL,KAAM,iBACN,OAAQ,mBACR,OAAQ,mBACR,OAAQ,mBACR,OAAQ,mBACR,QAAS,oBACT,QAAS,oBACT,QAAS,mBACV,EAEA,SAASC,EAAeC,EAAcC,EAAwB,CAC7D,OAAQA,EAAY,CACnB,IAAK,QACJ,OAAOH,EAAmBE,CAAK,EAChC,QACCE,EAAU,GAAO,uBAAuB,OAAOD,CAAU,CAAC,EAAE,CAC9D,CACD,CAEA,IAAME,EAAuB,CAC5B,MAAO,iBACP,KAAM,gBACN,KAAM,gBACN,QAAS,mBACT,QAAS,mBACT,KAAM,gBACN,MAAO,iBACP,OAAQ,kBACR,KAAM,gBACN,OAAQ,kBACR,KAAM,gBACN,OAAQ,kBACR,IAAK,eACL,KAAM,gBACN,IAAK,eACL,KAAM,gBACN,OAAQ,kBACR,OAAQ,kBACR,OAAQ,kBACR,OAAQ,kBACR,QAAS,mBACT,QAAS,mBACT,QAAS,kBACV,EAEA,SAASC,EAAiBJ,EAAcC,EAAwB,CAC/D,OAAQA,EAAY,CACnB,IAAK,QACJ,OAAOE,EAAqBH,CAAK,EAClC,QACCE,EAAU,GAAO,uBAAuB,OAAOD,CAAU,CAAC,EAAE,CAC9D,CACD","names":["Slot","Children","cloneElement","isValidElement","invariant","Fragment","jsx","jsxs","Badge","appearance","asChild","children","className","color","icon","props","bgColor","computeBgColor","textColor","computeTextColor","badgeClasses","cx","singleChild","Children","invariant","isValidElement","grandchildren","jsx","Slot","cloneElement","jsxs","Fragment","SvgOnly","mutedBgColorLookup","computeBgColor","color","appearance","invariant","textColorMutedLookup","computeTextColor"]}
|
package/dist/button.d.ts
CHANGED
|
@@ -4,9 +4,9 @@ import * as react from 'react';
|
|
|
4
4
|
import { ButtonHTMLAttributes, ReactNode, ComponentProps } from 'react';
|
|
5
5
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
6
6
|
import { V as VariantProps } from './variant-props-oDo2u-We.js';
|
|
7
|
-
export { I as IconButton, a as IconButtonProps } from './icon-button-
|
|
7
|
+
export { I as IconButton, a as IconButtonProps } from './icon-button-D41yiI7H.js';
|
|
8
8
|
export { B as ButtonGroup, a as ButtonGroupProps } from './button-group-CpDp0fYZ.js';
|
|
9
|
-
import './as-child-
|
|
9
|
+
import './as-child-DJ7x3JFV.js';
|
|
10
10
|
|
|
11
11
|
declare const buttonVariants: (props?: ({
|
|
12
12
|
appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
|
|
@@ -26,6 +26,7 @@ type ButtonProps = ComponentProps<"button"> & ButtonVariants & {
|
|
|
26
26
|
/**
|
|
27
27
|
* The side that the icon will render on, if one is present. If `state="pending"`,
|
|
28
28
|
* then the loading icon will also render on this side.
|
|
29
|
+
* @default "start"
|
|
29
30
|
*/
|
|
30
31
|
iconPlacement?: "start" | "end";
|
|
31
32
|
} & ({
|
|
@@ -97,6 +98,7 @@ declare const Button: react.ForwardRefExoticComponent<(Omit<react.ClassAttribute
|
|
|
97
98
|
/**
|
|
98
99
|
* The side that the icon will render on, if one is present. If `state="pending"`,
|
|
99
100
|
* then the loading icon will also render on this side.
|
|
101
|
+
* @default "start"
|
|
100
102
|
*/
|
|
101
103
|
iconPlacement?: "start" | "end";
|
|
102
104
|
} & {
|
|
@@ -142,6 +144,7 @@ declare const Button: react.ForwardRefExoticComponent<(Omit<react.ClassAttribute
|
|
|
142
144
|
/**
|
|
143
145
|
* The side that the icon will render on, if one is present. If `state="pending"`,
|
|
144
146
|
* then the loading icon will also render on this side.
|
|
147
|
+
* @default "start"
|
|
145
148
|
*/
|
|
146
149
|
iconPlacement?: "start" | "end";
|
|
147
150
|
} & {
|
package/dist/button.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as c}from"./chunk-7XIZZ4HQ.js";import{a as b}from"./chunk-
|
|
1
|
+
import{a as c}from"./chunk-7XIZZ4HQ.js";import{a as b}from"./chunk-XBVAQ3DV.js";import{b as a}from"./chunk-J3NVDJIE.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-7O36LG52.js";import"./chunk-HDPLH5HC.js";import"./chunk-AZ56JGNY.js";export{a as Button,c as ButtonGroup,b as IconButton};
|
|
2
2
|
//# sourceMappingURL=button.js.map
|
package/dist/calendar.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as d}from"./chunk-
|
|
1
|
+
import{a as d}from"./chunk-J3NVDJIE.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-7O36LG52.js";import"./chunk-HDPLH5HC.js";import{a as e}from"./chunk-AZ56JGNY.js";import{CaretLeft as s}from"@phosphor-icons/react/dist/icons/CaretLeft";import{CaretRight as i}from"@phosphor-icons/react/dist/icons/CaretRight";import{DayPicker as c}from"react-day-picker";import{jsx as t}from"react/jsx-runtime";function r({className:o,classNames:n,showOutsideDays:l=!1,...a}){return t(c,{showOutsideDays:l,className:e("",o),classNames:{months:"flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",month:"space-y-4",caption:"flex justify-center pt-1 relative items-center",caption_label:"text-sm font-medium",nav:"flex items-center",nav_button:e(d({appearance:"ghost",priority:"neutral"}),"size-7"),nav_button_previous:"absolute left-0",nav_button_next:"absolute right-0",table:"w-full border-collapse space-y-1",head_row:"flex",head_cell:"text-body w-7 text-[0.8rem] text-center font-normal",row:"flex w-full mt-1",cell:e("overflow-hidden text-center text-sm p-0 relative focus-within:relative focus-within:z-20 size-7",a.mode==="range"?"first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md":""),day:"day size-full rounded-md [&:not([aria-selected],_[disabled])]:hover:bg-filled-accent/15",day_range_start:"day-range-start [&:not(.day-range-end)]:rounded-r-none",day_range_end:"day-range-end [&:not(.day-range-start)]:rounded-l-none",day_selected:"[&:not([disabled])]:bg-filled-accent text-on-filled [&:not([disabled])]:hover:bg-filled-accent",day_today:"[&:not([aria-selected],_[disabled])]:text-accent-600 font-medium [&:not([aria-selected],_[disabled])]:bg-filled-accent/10",day_outside:"day-outside aria-selected:text-on-filled opacity-50 text-muted",day_disabled:"text-muted opacity-50",day_range_middle:"day-range-middle [&:not([disabled])]:aria-selected:bg-filled-accent/15 aria-selected:text-strong rounded-none [&:not([disabled])]:aria-selected:hover:bg-filled-accent/25",day_hidden:"invisible",...n},components:{IconLeft:()=>t(s,{className:"h-4 w-4 shrink-0",weight:"bold"}),IconRight:()=>t(i,{className:"h-4 w-4 shrink-0",weight:"bold"})},...a})}r.displayName="Calendar";export{r as Calendar};
|
|
2
2
|
//# sourceMappingURL=calendar.js.map
|
package/dist/card.d.ts
CHANGED
|
@@ -1,29 +1,130 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import { HTMLAttributes } from 'react';
|
|
3
|
-
import { W as WithAsChild } from './as-child-
|
|
2
|
+
import { ComponentProps, HTMLAttributes } from 'react';
|
|
3
|
+
import { W as WithAsChild } from './as-child-DJ7x3JFV.js';
|
|
4
4
|
|
|
5
|
-
type CardProps =
|
|
5
|
+
type CardProps = ComponentProps<"div"> & WithAsChild;
|
|
6
6
|
/**
|
|
7
|
-
* A container that can be used to display content in a box resembling a
|
|
8
|
-
* card.
|
|
7
|
+
* A container that can be used to display content in a box resembling a
|
|
8
|
+
* physical card. The root component of the all Card components.
|
|
9
|
+
*
|
|
10
|
+
* @see https://mantle.ngrok.com/components/card#api-card
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```tsx
|
|
14
|
+
* <Card>
|
|
15
|
+
* <CardBody>
|
|
16
|
+
* <p>Laborum in aute officia adipisicing elit velit.</p>
|
|
17
|
+
* </CardBody>
|
|
18
|
+
* </Card>
|
|
19
|
+
*
|
|
20
|
+
* <Card>
|
|
21
|
+
* <CardHeader>
|
|
22
|
+
* <CardTitle>Card Title Here</CardTitle>
|
|
23
|
+
* </CardHeader>
|
|
24
|
+
* <CardBody>
|
|
25
|
+
* <p>Laborum in aute officia adipisicing elit velit.</p>
|
|
26
|
+
* </CardBody>
|
|
27
|
+
* <CardFooter>
|
|
28
|
+
* <p>Card footer</p>
|
|
29
|
+
* </CardFooter>
|
|
30
|
+
* </Card>
|
|
31
|
+
* ```
|
|
9
32
|
*/
|
|
10
|
-
declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
|
|
33
|
+
declare const Card: react.ForwardRefExoticComponent<Omit<CardProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
11
34
|
/**
|
|
12
35
|
* The main content of a card. Usually composed as a direct child of a `Card` component.
|
|
36
|
+
*
|
|
37
|
+
* @see https://mantle.ngrok.com/components/card#api-card-body
|
|
38
|
+
*
|
|
39
|
+
* @example
|
|
40
|
+
* ```tsx
|
|
41
|
+
* <Card>
|
|
42
|
+
* <CardBody>
|
|
43
|
+
* <p>Laborum in aute officia adipisicing elit velit.</p>
|
|
44
|
+
* </CardBody>
|
|
45
|
+
* </Card>
|
|
46
|
+
*
|
|
47
|
+
* <Card>
|
|
48
|
+
* <CardHeader>
|
|
49
|
+
* <CardTitle>Card Title Here</CardTitle>
|
|
50
|
+
* </CardHeader>
|
|
51
|
+
* <CardBody>
|
|
52
|
+
* <p>Laborum in aute officia adipisicing elit velit.</p>
|
|
53
|
+
* </CardBody>
|
|
54
|
+
* <CardFooter>
|
|
55
|
+
* <p>Card footer</p>
|
|
56
|
+
* </CardFooter>
|
|
57
|
+
* </Card>
|
|
58
|
+
* ```
|
|
13
59
|
*/
|
|
14
|
-
declare const CardBody: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
|
|
60
|
+
declare const CardBody: react.ForwardRefExoticComponent<Omit<CardProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
15
61
|
/**
|
|
16
62
|
* The footer container of a card. Usually composed as a direct child of a `Card` component.
|
|
63
|
+
*
|
|
64
|
+
* @see https://mantle.ngrok.com/components/card#api-card-footer
|
|
65
|
+
*
|
|
66
|
+
* @example
|
|
67
|
+
* ```tsx
|
|
68
|
+
* <Card>
|
|
69
|
+
* <CardHeader>
|
|
70
|
+
* <CardTitle>Card Title Here</CardTitle>
|
|
71
|
+
* </CardHeader>
|
|
72
|
+
* <CardBody>
|
|
73
|
+
* <p>Laborum in aute officia adipisicing elit velit.</p>
|
|
74
|
+
* </CardBody>
|
|
75
|
+
* <CardFooter>
|
|
76
|
+
* <p>Card footer</p>
|
|
77
|
+
* </CardFooter>
|
|
78
|
+
* </Card>
|
|
79
|
+
* ```
|
|
17
80
|
*/
|
|
18
|
-
declare const CardFooter: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
|
|
81
|
+
declare const CardFooter: react.ForwardRefExoticComponent<Omit<CardProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
19
82
|
/**
|
|
20
83
|
* The header container of a card. Usually composed as a direct child of a `Card` component.
|
|
84
|
+
*
|
|
85
|
+
* @see https://mantle.ngrok.com/components/card#api-card-header
|
|
86
|
+
*
|
|
87
|
+
* @example
|
|
88
|
+
* ```tsx
|
|
89
|
+
* <Card>
|
|
90
|
+
* <CardHeader>
|
|
91
|
+
* <CardTitle>Card Title Here</CardTitle>
|
|
92
|
+
* </CardHeader>
|
|
93
|
+
* <CardBody>
|
|
94
|
+
* <p>Laborum in aute officia adipisicing elit velit.</p>
|
|
95
|
+
* </CardBody>
|
|
96
|
+
* <CardFooter>
|
|
97
|
+
* <p>Card footer</p>
|
|
98
|
+
* </CardFooter>
|
|
99
|
+
* </Card>
|
|
100
|
+
* ```
|
|
21
101
|
*/
|
|
22
|
-
declare const CardHeader: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
|
|
102
|
+
declare const CardHeader: react.ForwardRefExoticComponent<Omit<CardProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
23
103
|
type CardTitleProps = HTMLAttributes<HTMLHeadingElement> & WithAsChild;
|
|
24
104
|
/**
|
|
25
|
-
* The title of a card. Usually composed as a direct child of a `CardHeader`
|
|
105
|
+
* The title of a card. Usually composed as a direct child of a `CardHeader`
|
|
106
|
+
* component.
|
|
107
|
+
* Renders as an `h3` element by default, but can be changed to any other
|
|
108
|
+
* element by using the `asChild` prop. It is preferred to use a heading element
|
|
109
|
+
* (h1-h6) for accessibility reasons.
|
|
110
|
+
*
|
|
111
|
+
* @see https://mantle.ngrok.com/components/card#api-card-title
|
|
112
|
+
*
|
|
113
|
+
* @example
|
|
114
|
+
* ```tsx
|
|
115
|
+
* <Card>
|
|
116
|
+
* <CardHeader>
|
|
117
|
+
* <CardTitle>Card Title Here</CardTitle>
|
|
118
|
+
* </CardHeader>
|
|
119
|
+
* <CardBody>
|
|
120
|
+
* <p>Laborum in aute officia adipisicing elit velit.</p>
|
|
121
|
+
* </CardBody>
|
|
122
|
+
* <CardFooter>
|
|
123
|
+
* <p>Card footer</p>
|
|
124
|
+
* </CardFooter>
|
|
125
|
+
* </Card>
|
|
126
|
+
* ```
|
|
26
127
|
*/
|
|
27
|
-
declare const CardTitle: react.ForwardRefExoticComponent<HTMLAttributes<HTMLHeadingElement> & WithAsChild & react.RefAttributes<
|
|
128
|
+
declare const CardTitle: react.ForwardRefExoticComponent<HTMLAttributes<HTMLHeadingElement> & WithAsChild & react.RefAttributes<HTMLHeadingElement>>;
|
|
28
129
|
|
|
29
130
|
export { Card, CardBody, CardFooter, CardHeader, type CardProps, CardTitle, type CardTitleProps };
|
package/dist/card.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a
|
|
1
|
+
import{a}from"./chunk-AZ56JGNY.js";import{Slot as n}from"@radix-ui/react-slot";import{forwardRef as p}from"react";import{jsx as s}from"react/jsx-runtime";var m=p(({asChild:e=!1,className:o,children:r,...t},d)=>s(e?n:"div",{ref:d,className:a("divide-card-muted border-card bg-card relative divide-y rounded-md border",o),...t,children:r}));m.displayName="Card";var i=p(({asChild:e=!1,className:o,children:r,...t},d)=>s(e?n:"div",{ref:d,className:a("p-6",o),...t,children:r}));i.displayName="CardBody";var l=p(({asChild:e=!1,className:o,children:r,...t},d)=>s(e?n:"div",{ref:d,className:a("px-6 py-3",o),...t,children:r}));l.displayName="CardFooter";var f=p(({asChild:e=!1,className:o,children:r,...t},d)=>s(e?n:"div",{ref:d,className:a("px-6 py-3",o),...t,children:r}));f.displayName="CardHeader";var c=p(({className:e,asChild:o,...r},t)=>s(o?n:"h3",{ref:t,className:a("text-strong text-base font-medium",e),...r}));c.displayName="CardTitle";export{m as Card,i as CardBody,l as CardFooter,f as CardHeader,c as CardTitle};
|
|
2
2
|
//# sourceMappingURL=card.js.map
|
package/dist/card.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/card/card.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { HTMLAttributes } from \"react\";\nimport { forwardRef } from \"react\";\nimport type { WithAsChild } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\n\
|
|
1
|
+
{"version":3,"sources":["../src/components/card/card.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { ComponentProps, ComponentRef, HTMLAttributes } from \"react\";\nimport { forwardRef } from \"react\";\nimport type { WithAsChild } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\n\ntype CardProps = ComponentProps<\"div\"> & WithAsChild;\n\n/**\n * A container that can be used to display content in a box resembling a\n * physical card. The root component of the all Card components.\n *\n * @see https://mantle.ngrok.com/components/card#api-card\n *\n * @example\n * ```tsx\n * <Card>\n * <CardBody>\n * <p>Laborum in aute officia adipisicing elit velit.</p>\n * </CardBody>\n * </Card>\n *\n * <Card>\n * <CardHeader>\n * <CardTitle>Card Title Here</CardTitle>\n * </CardHeader>\n * <CardBody>\n * <p>Laborum in aute officia adipisicing elit velit.</p>\n * </CardBody>\n * <CardFooter>\n * <p>Card footer</p>\n * </CardFooter>\n * </Card>\n * ```\n */\nconst Card = forwardRef<ComponentRef<\"div\">, CardProps>(\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(\n\t\t\t\t\t\"divide-card-muted border-card bg-card relative divide-y rounded-md border\",\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);\nCard.displayName = \"Card\";\n\n/**\n * The main content of a card. Usually composed as a direct child of a `Card` component.\n *\n * @see https://mantle.ngrok.com/components/card#api-card-body\n *\n * @example\n * ```tsx\n * <Card>\n * <CardBody>\n * <p>Laborum in aute officia adipisicing elit velit.</p>\n * </CardBody>\n * </Card>\n *\n * <Card>\n * <CardHeader>\n * <CardTitle>Card Title Here</CardTitle>\n * </CardHeader>\n * <CardBody>\n * <p>Laborum in aute officia adipisicing elit velit.</p>\n * </CardBody>\n * <CardFooter>\n * <p>Card footer</p>\n * </CardFooter>\n * </Card>\n * ```\n */\nconst CardBody = forwardRef<ComponentRef<\"div\">, CardProps>(\n\t({ asChild = false, className, children, ...rest }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<Component ref={ref} className={cx(\"p-6\", className)} {...rest}>\n\t\t\t\t{children}\n\t\t\t</Component>\n\t\t);\n\t},\n);\nCardBody.displayName = \"CardBody\";\n\n/**\n * The footer container of a card. Usually composed as a direct child of a `Card` component.\n *\n * @see https://mantle.ngrok.com/components/card#api-card-footer\n *\n * @example\n * ```tsx\n * <Card>\n * <CardHeader>\n * <CardTitle>Card Title Here</CardTitle>\n * </CardHeader>\n * <CardBody>\n * <p>Laborum in aute officia adipisicing elit velit.</p>\n * </CardBody>\n * <CardFooter>\n * <p>Card footer</p>\n * </CardFooter>\n * </Card>\n * ```\n */\nconst CardFooter = forwardRef<ComponentRef<\"div\">, CardProps>(\n\t({ asChild = false, className, children, ...rest }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<Component ref={ref} className={cx(\"px-6 py-3\", className)} {...rest}>\n\t\t\t\t{children}\n\t\t\t</Component>\n\t\t);\n\t},\n);\nCardFooter.displayName = \"CardFooter\";\n\n/**\n * The header container of a card. Usually composed as a direct child of a `Card` component.\n *\n * @see https://mantle.ngrok.com/components/card#api-card-header\n *\n * @example\n * ```tsx\n * <Card>\n * <CardHeader>\n * <CardTitle>Card Title Here</CardTitle>\n * </CardHeader>\n * <CardBody>\n * <p>Laborum in aute officia adipisicing elit velit.</p>\n * </CardBody>\n * <CardFooter>\n * <p>Card footer</p>\n * </CardFooter>\n * </Card>\n * ```\n */\nconst CardHeader = forwardRef<ComponentRef<\"div\">, CardProps>(\n\t({ asChild = false, className, children, ...rest }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<Component ref={ref} className={cx(\"px-6 py-3\", className)} {...rest}>\n\t\t\t\t{children}\n\t\t\t</Component>\n\t\t);\n\t},\n);\nCardHeader.displayName = \"CardHeader\";\n\ntype CardTitleProps = HTMLAttributes<HTMLHeadingElement> & WithAsChild;\n\n/**\n * The title of a card. Usually composed as a direct child of a `CardHeader`\n * component.\n * Renders as an `h3` element by default, but can be changed to any other\n * element by using the `asChild` prop. It is preferred to use a heading element\n * (h1-h6) for accessibility reasons.\n *\n * @see https://mantle.ngrok.com/components/card#api-card-title\n *\n * @example\n * ```tsx\n * <Card>\n * <CardHeader>\n * <CardTitle>Card Title Here</CardTitle>\n * </CardHeader>\n * <CardBody>\n * <p>Laborum in aute officia adipisicing elit velit.</p>\n * </CardBody>\n * <CardFooter>\n * <p>Card footer</p>\n * </CardFooter>\n * </Card>\n * ```\n */\nconst CardTitle = forwardRef<HTMLHeadingElement, CardTitleProps>(\n\t({ className, asChild, ...props }, ref) => {\n\t\tconst Comp = asChild ? Slot : \"h3\";\n\t\treturn (\n\t\t\t<Comp\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"text-strong text-base font-medium\", className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nCardTitle.displayName = \"CardTitle\";\n\nexport {\n\t//,\n\tCard,\n\tCardBody,\n\tCardFooter,\n\tCardHeader,\n\tCardTitle,\n};\n\nexport type {\n\t//,\n\tCardProps,\n\tCardTitleProps,\n};\n"],"mappings":"mCAAA,OAAS,QAAAA,MAAY,uBAErB,OAAS,cAAAC,MAAkB,QAsCxB,cAAAC,MAAA,oBALH,IAAMC,EAAOC,EACZ,CAAC,CAAE,QAAAC,EAAU,GAAO,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAIlDP,EAHiBG,EAAUK,EAAO,MAGjC,CACA,IAAKD,EACL,UAAWE,EACV,4EACAL,CACD,EACC,GAAGE,EAEH,SAAAD,EACF,CAGH,EACAJ,EAAK,YAAc,OA4BnB,IAAMS,EAAWR,EAChB,CAAC,CAAE,QAAAC,EAAU,GAAO,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAIlDP,EAHiBG,EAAUK,EAAO,MAGjC,CAAU,IAAKD,EAAK,UAAWE,EAAG,MAAOL,CAAS,EAAI,GAAGE,EACxD,SAAAD,EACF,CAGH,EACAK,EAAS,YAAc,WAsBvB,IAAMC,EAAaT,EAClB,CAAC,CAAE,QAAAC,EAAU,GAAO,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAIlDP,EAHiBG,EAAUK,EAAO,MAGjC,CAAU,IAAKD,EAAK,UAAWE,EAAG,YAAaL,CAAS,EAAI,GAAGE,EAC9D,SAAAD,EACF,CAGH,EACAM,EAAW,YAAc,aAsBzB,IAAMC,EAAaV,EAClB,CAAC,CAAE,QAAAC,EAAU,GAAO,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAIlDP,EAHiBG,EAAUK,EAAO,MAGjC,CAAU,IAAKD,EAAK,UAAWE,EAAG,YAAaL,CAAS,EAAI,GAAGE,EAC9D,SAAAD,EACF,CAGH,EACAO,EAAW,YAAc,aA4BzB,IAAMC,EAAYX,EACjB,CAAC,CAAE,UAAAE,EAAW,QAAAD,EAAS,GAAGW,CAAM,EAAGP,IAGjCP,EAFYG,EAAUK,EAAO,KAE5B,CACA,IAAKD,EACL,UAAWE,EAAG,oCAAqCL,CAAS,EAC3D,GAAGU,EACL,CAGH,EACAD,EAAU,YAAc","names":["Slot","forwardRef","jsx","Card","forwardRef","asChild","className","children","rest","ref","Slot","cx","CardBody","CardFooter","CardHeader","CardTitle","props"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import{a as t}from"./chunk-HDPLH5HC.js";import{a as o}from"./chunk-AZ56JGNY.js";import{forwardRef as n}from"react";import{jsx as c}from"react/jsx-runtime";var g=n(({className:e,style:p,svg:r,...s},m)=>c(t,{ref:m,className:o("size-5",e),style:p,svg:r,...s}));export{g as a};
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
2
|
+
//# sourceMappingURL=chunk-7O36LG52.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/icon/icon.tsx"],"sourcesContent":["import { type ComponentRef, type ReactNode, forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"./svg-only.js\";\nimport type { SvgAttributes } from \"./types.js\";\n\ntype IconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * A single SVG icon element.\n\t */\n\tsvg: ReactNode;\n};\n\n/**\n * Decorates an svg icon with automatic sizing styles and a `shrink-0` class.\n *\n * Merges `className` selectors with the following order of precedence (last one wins):\n * 1. SvgOnly base classes\n * 2. Icon base classes\n * 3. Icon className\n * 4. svg className\n *\n * @see https://mantle.ngrok.com/components/icon#api\n *\n * @example\n * ```tsx\n * import { Shrimp } from \"@phosphor-icons/react/Shrimp\";\n *\n * <Icon svg={<Shrimp />} />\n * ```\n */\nconst Icon = forwardRef<ComponentRef<\"svg\">, IconProps>(\n\t({ className, style, svg, ...props }, ref) => (\n\t\t<SvgOnly\n\t\t\tref={ref}\n\t\t\tclassName={cx(\"size-5\", className)}\n\t\t\tstyle={style}\n\t\t\tsvg={svg}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\n\nexport {\n\t//,\n\tIcon,\n};\n\nexport type {\n\t//,\n\tIconProps,\n};\n"],"mappings":"gFAAA,OAA4C,cAAAA,MAAkB,QAgC5D,cAAAC,MAAA,oBAFF,IAAMC,EAAOC,EACZ,CAAC,CAAE,UAAAC,EAAW,MAAAC,EAAO,IAAAC,EAAK,GAAGC,CAAM,EAAGC,IACrCP,EAACQ,EAAA,CACA,IAAKD,EACL,UAAWE,EAAG,SAAUN,CAAS,EACjC,MAAOC,EACP,IAAKC,EACJ,GAAGC,EACL,CAEF","names":["forwardRef","jsx","Icon","forwardRef","className","style","svg","props","ref","SvgOnly","cx"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{l as P}from"./chunk-DOTYPWKO.js";import{a as p}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{l as P}from"./chunk-DOTYPWKO.js";import{a as p}from"./chunk-7O36LG52.js";import{a as s}from"./chunk-AZ56JGNY.js";import{CheckCircle as h}from"@phosphor-icons/react/CheckCircle";import{Info as v}from"@phosphor-icons/react/Info";import{Warning as C}from"@phosphor-icons/react/Warning";import{WarningDiamond as b}from"@phosphor-icons/react/WarningDiamond";import{Slot as u}from"@radix-ui/react-slot";import{createContext as f,forwardRef as d,useContext as y}from"react";import*as m from"sonner";import{jsx as r,jsxs as A}from"react/jsx-runtime";var B=({className:t,containerAriaLabel:o,dir:e,duration_ms:n=4e3,position:i="top-center",style:a})=>{let c=P();return r(m.Toaster,{className:s("toaster mantle-prompt pointer-events-auto font-sans *:duration-200",t),containerAriaLabel:o,dir:e,duration:n,gap:12,position:i??"top-center",style:a,theme:c,toastOptions:{unstyled:!0}})},g=f("");function _(t,o){return m.toast.custom(e=>r(g.Provider,{value:e,children:t}),{duration:o?.duration_ms,...o?.id?{id:o.id}:{},unstyled:!0})}var T=f({priority:"info"}),j=d(({asChild:t,children:o,className:e,priority:n,...i},a)=>{let c=t?u:"div";return r(T.Provider,{value:{priority:n},children:A(c,{className:s("relative flex items-start gap-2 text-sm","p-3 pl-[0.9375rem]","bg-popover high-contrast:border-popover rounded rounded-r-[0.3125rem] border border-gray-500/35 shadow-lg",e),ref:a,...i,children:[r(w,{priority:n}),o]})})}),D=d(({className:t,svg:o,...e},n)=>{let i=y(T);switch(i.priority){case"danger":return r(p,{className:s("text-danger-600",t),ref:n,svg:o??r(C,{weight:"fill"}),...e});case"warning":return r(p,{className:s("text-warning-600",t),ref:n,svg:o??r(b,{weight:"fill"}),...e});case"success":return r(p,{className:s("text-success-600",t),ref:n,svg:o??r(h,{weight:"fill"}),...e});case"info":return r(p,{className:s("text-accent-600",t),ref:n,svg:r(v,{weight:"fill"}),...e});default:throw new Error(`Unreachable Case: ${i.priority}`)}}),L=d(({asChild:t,className:o,onClick:e,...n},i)=>{let a=y(g);return r(t?u:"button",{className:s("shrink-0","data-[icon-button]:-mr-0.5 data-[icon-button]:-mt-0.5 data-[icon-button]:rounded-sm",o),onClick:l=>{e?.(l),!l.defaultPrevented&&m.toast.dismiss(a)},ref:i,...n})}),z=d(({asChild:t,className:o,...e},n)=>r(t?u:"p",{className:s("text-strong flex-1 text-sm",o),ref:n,...e}));function F(t){t.target instanceof Element&&t.target.closest(".mantle-prompt")&&t.preventDefault()}var x={info:"bg-accent-600",warning:"bg-warning-600",success:"bg-success-600",danger:"bg-danger-600"};function w({className:t,priority:o,...e}){return r("div",{"aria-hidden":!0,className:s("z-1 absolute -inset-px right-auto w-1.5 rounded-l",x[o],t),...e})}export{B as a,_ as b,j as c,D as d,L as e,z as f,F as g};
|
|
2
|
+
//# sourceMappingURL=chunk-ATNIDU3M.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as g}from"./chunk-3C5O3AQA.js";import{a as u}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as g}from"./chunk-3C5O3AQA.js";import{a as u}from"./chunk-7O36LG52.js";import{a as p}from"./chunk-AZ56JGNY.js";import{CircleNotch as k}from"@phosphor-icons/react/CircleNotch";import{Slot as N}from"@radix-ui/react-slot";import{cva as I}from"class-variance-authority";import f from"clsx";import{Children as w,cloneElement as E,forwardRef as H,isValidElement as M}from"react";import T from"tiny-invariant";import{jsx as t,jsxs as S}from"react/jsx-runtime";var A=I("inline-flex cursor-pointer items-center justify-center gap-1.5 whitespace-nowrap rounded-md focus-within:outline-none focus-visible:ring-4 disabled:cursor-default disabled:opacity-50 [&>*]:focus-within:outline-none",{variants:{appearance:{filled:"bg-filled-accent text-on-filled focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-filled-accent-hover not-disabled:active:bg-filled-accent-active h-9 border border-transparent px-3 text-sm font-medium",ghost:"text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 not-disabled:active:bg-accent-500/15 not-disabled:active:text-accent-700 h-9 border border-transparent px-3 text-sm font-medium",outlined:"border-accent-600 bg-form text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-accent-700 not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 not-disabled:active:border-accent-700 not-disabled:active:bg-accent-500/15 not-disabled:active:text-accent-700 h-9 border px-3 text-sm font-medium",link:"text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:underline group/button-link border-transparent"},isLoading:{false:"",true:"opacity-50"},priority:{danger:"",default:"",neutral:""}},defaultVariants:{appearance:"outlined",isLoading:!1,priority:"default"},compoundVariants:[{appearance:"ghost",priority:"danger",class:"text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 not-disabled:active:bg-danger-500/15 not-disabled:active:text-danger-700 border-transparent"},{appearance:"outlined",priority:"danger",class:"border-danger-600 bg-form text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:border-danger-700 not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 not-disabled:active:border-danger-700 not-disabled:active:bg-danger-500/15 not-disabled:active:text-danger-700"},{appearance:"filled",priority:"danger",class:"bg-filled-danger focus-visible:border-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-filled-danger-hover not-disabled:active:bg-filled-danger-active border-transparent"},{appearance:"link",priority:"danger",class:"text-danger-600 focus-visible:ring-focus-danger"},{appearance:"ghost",priority:"neutral",class:"text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong not-disabled:active:bg-neutral-500/15 not-disabled:active:text-strong border-transparent"},{appearance:"outlined",priority:"neutral",class:"border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong not-disabled:active:border-neutral-400 not-disabled:active:bg-neutral-500/10 not-disabled:active:text-strong focus-visible:not-disabled:active:border-accent-600"},{appearance:"filled",priority:"neutral",class:"bg-filled-neutral focus-visible:ring-focus-neutral not-disabled:hover:bg-filled-neutral-hover not-disabled:active:bg-filled-neutral-active border-transparent focus-visible:border-neutral-600"},{appearance:"link",priority:"neutral",class:"text-strong focus-visible:ring-focus-accent"}]}),L=H(({"aria-disabled":i,appearance:e="outlined",asChild:n,children:r,className:m,disabled:h,icon:x,iconPlacement:o="start",isLoading:a=!1,priority:y="default",type:B,...P},C)=>{let l=g(i??h??a),s=a?t(k,{className:"animate-spin"}):x,c=s&&e!=="link",b={"aria-disabled":l,className:p(A({appearance:e,priority:y,isLoading:a}),c&&o==="start"&&"ps-2.5",c&&o==="end"&&"pe-2.5",m),"data-loading":a,disabled:l,ref:C,...P};if(n){let d=w.only(r);T(M(d),"When using `asChild`, Button must be passed a single child as a JSX tag.");let V=d.props?.children;return t(N,{...b,children:E(d,{},t(v,{appearance:e,icon:s,iconPlacement:o,children:V}))})}return t("button",{...b,type:B,children:t(v,{appearance:e,icon:s,iconPlacement:o,children:r})})});L.displayName="Button";var v=({appearance:i,children:e,icon:n,iconPlacement:r})=>S("span",{className:f("inline-flex items-center gap-1.5 focus-within:outline-none focus-visible:outline-none",i==="link"&&"hover:underline group-disabled/button-link:no-underline"),children:[n&&t(u,{svg:n,className:f(r==="end"&&"order-last")}),e]});export{A as a,L as b};
|
|
2
|
+
//# sourceMappingURL=chunk-J3NVDJIE.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/button/button.tsx"],"sourcesContent":["import { CircleNotch } from \"@phosphor-icons/react/CircleNotch\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva } from \"class-variance-authority\";\nimport clsx from \"clsx\";\nimport { Children, cloneElement, forwardRef, isValidElement } from \"react\";\nimport type {\n\tButtonHTMLAttributes,\n\tComponentProps,\n\tPropsWithChildren,\n\tReactNode,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { parseBooleanish } from \"../../types/index.js\";\nimport type { VariantProps } from \"../../types/variant-props.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/index.js\";\n\nconst buttonVariants = cva(\n\t\"inline-flex cursor-pointer items-center justify-center gap-1.5 whitespace-nowrap rounded-md focus-within:outline-none focus-visible:ring-4 disabled:cursor-default disabled:opacity-50 [&>*]:focus-within:outline-none\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * Defines the visual style of the Button.\n\t\t\t */\n\t\t\tappearance: {\n\t\t\t\tfilled:\n\t\t\t\t\t\"bg-filled-accent text-on-filled focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-filled-accent-hover not-disabled:active:bg-filled-accent-active h-9 border border-transparent px-3 text-sm font-medium\",\n\t\t\t\tghost:\n\t\t\t\t\t\"text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 not-disabled:active:bg-accent-500/15 not-disabled:active:text-accent-700 h-9 border border-transparent px-3 text-sm font-medium\",\n\t\t\t\toutlined:\n\t\t\t\t\t\"border-accent-600 bg-form text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-accent-700 not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 not-disabled:active:border-accent-700 not-disabled:active:bg-accent-500/15 not-disabled:active:text-accent-700 h-9 border px-3 text-sm font-medium\",\n\t\t\t\tlink: \"text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:underline group/button-link border-transparent\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Whether or not the button is in a loading state, default `false`. Setting `isLoading` will\n\t\t\t * replace any `icon` with a spinner, or add one if an icon wasn't given.\n\t\t\t * It will also disable user interaction with the button and set `disabled`.\n\t\t\t */\n\t\t\tisLoading: {\n\t\t\t\tfalse: \"\",\n\t\t\t\ttrue: \"opacity-50\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Indicates the importance or impact level of the button, affecting its\n\t\t\t * color and styling to communicate its purpose to the user\n\t\t\t */\n\t\t\tpriority: {\n\t\t\t\tdanger: \"\",\n\t\t\t\tdefault: \"\",\n\t\t\t\tneutral: \"\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tappearance: \"outlined\",\n\t\t\tisLoading: false,\n\t\t\tpriority: \"default\",\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tappearance: \"ghost\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 not-disabled:active:bg-danger-500/15 not-disabled:active:text-danger-700 border-transparent\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"outlined\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-danger-600 bg-form text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:border-danger-700 not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 not-disabled:active:border-danger-700 not-disabled:active:bg-danger-500/15 not-disabled:active:text-danger-700\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"filled\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"bg-filled-danger focus-visible:border-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-filled-danger-hover not-disabled:active:bg-filled-danger-active border-transparent\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"link\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass: \"text-danger-600 focus-visible:ring-focus-danger\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"ghost\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong not-disabled:active:bg-neutral-500/15 not-disabled:active:text-strong border-transparent\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"outlined\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong not-disabled:active:border-neutral-400 not-disabled:active:bg-neutral-500/10 not-disabled:active:text-strong focus-visible:not-disabled:active:border-accent-600\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"filled\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"bg-filled-neutral focus-visible:ring-focus-neutral not-disabled:hover:bg-filled-neutral-hover not-disabled:active:bg-filled-neutral-active border-transparent focus-visible:border-neutral-600\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"link\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass: \"text-strong focus-visible:ring-focus-accent\",\n\t\t\t},\n\t\t],\n\t},\n);\n\ntype ButtonVariants = VariantProps<typeof buttonVariants>;\n\ntype ButtonAppearance = Pick<ButtonVariants, \"appearance\">[\"appearance\"];\ntype ButtonPriority = Pick<ButtonVariants, \"priority\">[\"priority\"];\n\n/**\n * The props for the `Button` component.\n */\ntype ButtonProps = ComponentProps<\"button\"> &\n\tButtonVariants & {\n\t\t/**\n\t\t * An icon to render inside the button. If the `state` is `\"pending\"`, then\n\t\t * the icon will automatically be replaced with a spinner.\n\t\t */\n\t\ticon?: ReactNode;\n\t\t/**\n\t\t * The side that the icon will render on, if one is present. If `state=\"pending\"`,\n\t\t * then the loading icon will also render on this side.\n\t\t * @default \"start\"\n\t\t */\n\t\ticonPlacement?: \"start\" | \"end\";\n\t} & (\n\t\t| {\n\t\t\t\t/**\n\t\t\t\t * Use the `asChild` prop to compose Radix's functionality onto alternative\n\t\t\t\t * element types or your own React components.\n\t\t\t\t *\n\t\t\t\t * When `asChild` is set to `true`, mantle will not render a default DOM\n\t\t\t\t * element, instead cloning the component's child and passing it the props and\n\t\t\t\t * behavior required to make it functional.\n\t\t\t\t *\n\t\t\t\t * asChild can be used as deeply as you need to. This means it is a great way\n\t\t\t\t * to compose multiple primitive's behavior together.\n\t\t\t\t *\n\t\t\t\t * @see https://www.radix-ui.com/docs/primitives/guides/composition#composition\n\t\t\t\t */\n\t\t\t\tasChild: true;\n\t\t\t\t/**\n\t\t\t\t * The default behavior of the button. Possible values are: `\"button\"`, `\"submit\"`, and `\"reset\"`.\n\t\t\t\t *\n\t\t\t\t * if `asChild` is NOT used: Unlike the native `<button>` element, this prop is required and has no default value.\n\t\t\t\t *\n\t\t\t\t * If `asChild` IS used: This prop HAS NO EFFECT, is REMOVED, and has no default value. This is because we do not want the `button` `type` to automatically merge with any child anchor `type` attribute because the `anchor` `type` is _strictly different_ than the `button` type, see: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#type\n\t\t\t\t *\n\t\t\t\t * @enum\n\t\t\t\t * - `\"button\"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.\n\t\t\t\t * - `\"reset\"`: The button resets all the controls to their initial values.\n\t\t\t\t * - `\"submit\"`: The button submits the form data to the server.\n\t\t\t\t *\n\t\t\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type\n\t\t\t\t */\n\t\t\t\ttype?: ButtonHTMLAttributes<HTMLButtonElement>[\"type\"];\n\t\t }\n\t\t| {\n\t\t\t\tasChild?: false | undefined;\n\t\t\t\t/**\n\t\t\t\t * The default behavior of the button. Possible values are: `\"button\"`, `\"submit\"`, and `\"reset\"`.\n\t\t\t\t *\n\t\t\t\t * if `asChild` is NOT used: Unlike the native `<button>` element, this prop is required and has no default value.\n\t\t\t\t *\n\t\t\t\t * If `asChild` IS used: This prop HAS NO EFFECT, is REMOVED, and has no default value. This is because we do not want the `button` `type` to automatically merge with any child anchor `type` attribute because the `anchor` `type` is _strictly different_ than the `button` type, see: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#type\n\t\t\t\t *\n\t\t\t\t * @enum\n\t\t\t\t * - `\"button\"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.\n\t\t\t\t * - `\"reset\"`: The button resets all the controls to their initial values.\n\t\t\t\t * - `\"submit\"`: The button submits the form data to the server.\n\t\t\t\t *\n\t\t\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type\n\t\t\t\t */\n\t\t\t\ttype: Exclude<\n\t\t\t\t\tButtonHTMLAttributes<HTMLButtonElement>[\"type\"],\n\t\t\t\t\tundefined\n\t\t\t\t>;\n\t\t }\n\t);\n\n/**\n * Renders a button or a component that looks like a button, an interactive\n * element activated by a user with a mouse, keyboard, finger, voice command, or\n * other assistive technology. Once activated, it then performs an action, such\n * as submitting a form or opening a dialog.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button\n */\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\tappearance = \"outlined\",\n\t\t\tasChild,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tdisabled: _disabled,\n\t\t\ticon: propIcon,\n\t\t\ticonPlacement = \"start\",\n\t\t\tisLoading = false,\n\t\t\tpriority = \"default\",\n\t\t\ttype,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst disabled = parseBooleanish(_ariaDisabled ?? _disabled ?? isLoading);\n\t\tconst icon = isLoading ? (\n\t\t\t<CircleNotch className=\"animate-spin\" />\n\t\t) : (\n\t\t\tpropIcon\n\t\t);\n\n\t\t/**\n\t\t * If the button has an icon and is not a link, add padding-start or padding-end to the button depending on the icon placement.\n\t\t */\n\t\tconst hasSpecialIconPadding = icon && appearance !== \"link\";\n\n\t\tconst buttonProps = {\n\t\t\t\"aria-disabled\": disabled,\n\t\t\tclassName: cx(\n\t\t\t\tbuttonVariants({ appearance, priority, isLoading }),\n\t\t\t\thasSpecialIconPadding && iconPlacement === \"start\" && \"ps-2.5\",\n\t\t\t\thasSpecialIconPadding && iconPlacement === \"end\" && \"pe-2.5\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t\t\"data-loading\": isLoading,\n\t\t\tdisabled,\n\t\t\tref,\n\t\t\t...props,\n\t\t};\n\n\t\tif (asChild) {\n\t\t\tconst singleChild = Children.only(children);\n\t\t\tinvariant(\n\t\t\t\tisValidElement<ButtonProps>(singleChild),\n\t\t\t\t\"When using `asChild`, Button must be passed a single child as a JSX tag.\",\n\t\t\t);\n\t\t\tconst grandchildren = singleChild.props?.children;\n\n\t\t\treturn (\n\t\t\t\t<Slot {...buttonProps}>\n\t\t\t\t\t{cloneElement(\n\t\t\t\t\t\tsingleChild,\n\t\t\t\t\t\t{},\n\t\t\t\t\t\t<InnerContent\n\t\t\t\t\t\t\tappearance={appearance}\n\t\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\t\ticonPlacement={iconPlacement}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{grandchildren}\n\t\t\t\t\t\t</InnerContent>,\n\t\t\t\t\t)}\n\t\t\t\t</Slot>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<button {...buttonProps} type={type}>\n\t\t\t\t<InnerContent\n\t\t\t\t\tappearance={appearance}\n\t\t\t\t\ticon={icon}\n\t\t\t\t\ticonPlacement={iconPlacement}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</InnerContent>\n\t\t\t</button>\n\t\t);\n\t},\n);\nButton.displayName = \"Button\";\n\nexport {\n\t//,\n\tButton,\n\tbuttonVariants,\n};\n\nexport type {\n\t//,\n\tButtonProps,\n\tButtonAppearance,\n\tButtonPriority,\n};\n\ntype InnerContentProps = PropsWithChildren &\n\tPick<ButtonProps, \"appearance\" | \"icon\" | \"iconPlacement\">;\n\nconst InnerContent = ({\n\tappearance,\n\tchildren,\n\ticon,\n\ticonPlacement,\n}: InnerContentProps) => (\n\t<span\n\t\tclassName={clsx(\n\t\t\t\"inline-flex items-center gap-1.5 focus-within:outline-none focus-visible:outline-none\",\n\t\t\tappearance === \"link\" &&\n\t\t\t\t\"hover:underline group-disabled/button-link:no-underline\",\n\t\t)}\n\t>\n\t\t{icon && (\n\t\t\t<Icon\n\t\t\t\tsvg={icon}\n\t\t\t\tclassName={clsx(iconPlacement === \"end\" && \"order-last\")}\n\t\t\t/>\n\t\t)}\n\t\t{children}\n\t</span>\n);\n"],"mappings":"wHAAA,OAAS,eAAAA,MAAmB,oCAC5B,OAAS,QAAAC,MAAY,uBACrB,OAAS,OAAAC,MAAW,2BACpB,OAAOC,MAAU,OACjB,OAAS,YAAAC,EAAU,gBAAAC,EAAc,cAAAC,EAAY,kBAAAC,MAAsB,QAOnE,OAAOC,MAAe,iBAyMnB,cAAAC,EAsFF,QAAAC,MAtFE,oBAnMH,IAAMC,EAAiBC,EACtB,yNACA,CACC,SAAU,CAIT,WAAY,CACX,OACC,+OACD,MACC,yPACD,SACC,2UACD,KAAM,mHACP,EAMA,UAAW,CACV,MAAO,GACP,KAAM,YACP,EAKA,SAAU,CACT,OAAQ,GACR,QAAS,GACT,QAAS,EACV,CACD,EACA,gBAAiB,CAChB,WAAY,WACZ,UAAW,GACX,SAAU,SACX,EACA,iBAAkB,CACjB,CACC,WAAY,QACZ,SAAU,SACV,MACC,oNACF,EACA,CACC,WAAY,WACZ,SAAU,SACV,MACC,sSACF,EACA,CACC,WAAY,SACZ,SAAU,SACV,MACC,2LACF,EACA,CACC,WAAY,OACZ,SAAU,SACV,MAAO,iDACR,EACA,CACC,WAAY,QACZ,SAAU,UACV,MACC,0MACF,EACA,CACC,WAAY,WACZ,SAAU,UACV,MACC,wWACF,EACA,CACC,WAAY,SACZ,SAAU,UACV,MACC,gMACF,EACA,CACC,WAAY,OACZ,SAAU,UACV,MAAO,6CACR,CACD,CACD,CACD,EAsFMC,EAASC,EACd,CACC,CACC,gBAAiBC,EACjB,WAAAC,EAAa,WACb,QAAAC,EACA,SAAAC,EACA,UAAAC,EACA,SAAUC,EACV,KAAMC,EACN,cAAAC,EAAgB,QAChB,UAAAC,EAAY,GACZ,SAAAC,EAAW,UACX,KAAAC,EACA,GAAGC,CACJ,EACAC,IACI,CACJ,IAAMC,EAAWC,EAAgBd,GAAiBK,GAAaG,CAAS,EAClEO,EAAOP,EACZd,EAACsB,EAAA,CAAY,UAAU,eAAe,EAEtCV,EAMKW,EAAwBF,GAAQd,IAAe,OAE/CiB,EAAc,CACnB,gBAAiBL,EACjB,UAAWM,EACVvB,EAAe,CAAE,WAAAK,EAAY,SAAAQ,EAAU,UAAAD,CAAU,CAAC,EAClDS,GAAyBV,IAAkB,SAAW,SACtDU,GAAyBV,IAAkB,OAAS,SACpDH,CACD,EACA,eAAgBI,EAChB,SAAAK,EACA,IAAAD,EACA,GAAGD,CACJ,EAEA,GAAIT,EAAS,CACZ,IAAMkB,EAAcC,EAAS,KAAKlB,CAAQ,EAC1CmB,EACCC,EAA4BH,CAAW,EACvC,0EACD,EACA,IAAMI,EAAgBJ,EAAY,OAAO,SAEzC,OACC1B,EAAC+B,EAAA,CAAM,GAAGP,EACR,SAAAQ,EACAN,EACA,CAAC,EACD1B,EAACiC,EAAA,CACA,WAAY1B,EACZ,KAAMc,EACN,cAAeR,EAEd,SAAAiB,EACF,CACD,EACD,CAEF,CAEA,OACC9B,EAAC,UAAQ,GAAGwB,EAAa,KAAMR,EAC9B,SAAAhB,EAACiC,EAAA,CACA,WAAY1B,EACZ,KAAMc,EACN,cAAeR,EAEd,SAAAJ,EACF,EACD,CAEF,CACD,EACAL,EAAO,YAAc,SAkBrB,IAAM8B,EAAe,CAAC,CACrB,WAAAC,EACA,SAAAC,EACA,KAAAC,EACA,cAAAC,CACD,IACCC,EAAC,QACA,UAAWC,EACV,wFACAL,IAAe,QACd,yDACF,EAEC,UAAAE,GACAI,EAACC,EAAA,CACA,IAAKL,EACL,UAAWG,EAAKF,IAAkB,OAAS,YAAY,EACxD,EAEAF,GACF","names":["CircleNotch","Slot","cva","clsx","Children","cloneElement","forwardRef","isValidElement","invariant","jsx","jsxs","buttonVariants","cva","Button","forwardRef","_ariaDisabled","appearance","asChild","children","className","_disabled","propIcon","iconPlacement","isLoading","priority","type","props","ref","disabled","parseBooleanish","icon","CircleNotch","hasSpecialIconPadding","buttonProps","cx","singleChild","Children","invariant","isValidElement","grandchildren","Slot","cloneElement","InnerContent","InnerContent","appearance","children","icon","iconPlacement","jsxs","clsx","jsx","Icon"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as l}from"./chunk-3C5O3AQA.js";import{a as o}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as l}from"./chunk-3C5O3AQA.js";import{a as o}from"./chunk-7O36LG52.js";import{a as d}from"./chunk-AZ56JGNY.js";import{CircleNotch as V}from"@phosphor-icons/react/CircleNotch";import{Slot as C}from"@radix-ui/react-slot";import{cva as H}from"class-variance-authority";import{Children as I,cloneElement as M,forwardRef as T,isValidElement as E}from"react";import{jsx as t,jsxs as L}from"react/jsx-runtime";var N=H("inline-flex shrink-0 cursor-pointer items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border focus-within:outline-none focus-visible:ring-4 disabled:cursor-default disabled:opacity-50",{variants:{appearance:{ghost:"text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong not-disabled:active:bg-neutral-500/15 not-disabled:active:text-strong border-transparent",outlined:"border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong not-disabled:active:border-neutral-400 not-disabled:active:bg-neutral-500/10 not-disabled:active:text-strong focus-visible:not-disabled:active:border-accent-600"},isLoading:{false:"",true:"opacity-50"},size:{xs:"size-6",sm:"size-7",md:"size-9"}},defaultVariants:{appearance:"outlined",size:"md"}}),A=T(({"aria-disabled":c,appearance:u,asChild:b=!1,children:p,className:m,disabled:f,icon:v,isLoading:e=!1,label:h,size:n,type:g,...y},B)=>{let r=l(c??f??e),i=e?t(V,{className:"animate-spin"}):v,s={"aria-disabled":r,"data-icon-button":!0,"data-loading":e,"data-size":n,className:d("icon-button",N({appearance:u,isLoading:e,size:n}),m),disabled:r,ref:B,...y};if(b){let a=I.only(p),x=E(a);return t(C,{...s,children:x&&M(a,{},t(o,{svg:i}))})}return L("button",{...s,type:g,children:[t("span",{className:"sr-only",children:h}),t(o,{svg:i})]})});A.displayName="IconButton";export{A as a};
|
|
2
|
+
//# sourceMappingURL=chunk-XBVAQ3DV.js.map
|