@telegraph/modal 0.0.8 → 0.0.9
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/CHANGELOG.md +11 -0
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.mjs +119 -123
- package/dist/esm/index.mjs.map +1 -1
- package/dist/types/Modal/Modal.d.ts +12 -67
- package/dist/types/Modal/Modal.d.ts.map +1 -1
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
# @telegraph/modal
|
|
2
2
|
|
|
3
|
+
## 0.0.9
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#124](https://github.com/knocklabs/telegraph/pull/124) [`def3d89`](https://github.com/knocklabs/telegraph/commit/def3d89056aa54c0d24f74e33bc04df8efc712d9) Thanks [@kylemcd](https://github.com/kylemcd)! - better ts support for as prop with custom tgphRef
|
|
8
|
+
|
|
9
|
+
- Updated dependencies [[`04e1459`](https://github.com/knocklabs/telegraph/commit/04e14597ed2148354923023b3668f63387ce63c4), [`def3d89`](https://github.com/knocklabs/telegraph/commit/def3d89056aa54c0d24f74e33bc04df8efc712d9), [`790c5e0`](https://github.com/knocklabs/telegraph/commit/790c5e0626c9b99451214f892def9807165d9572)]:
|
|
10
|
+
- @telegraph/button@0.0.20
|
|
11
|
+
- @telegraph/layout@0.0.12
|
|
12
|
+
- @telegraph/icon@0.0.12
|
|
13
|
+
|
|
3
14
|
## 0.0.8
|
|
4
15
|
|
|
5
16
|
### Patch Changes
|
package/dist/cjs/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),y=require("@radix-ui/react-dialog"),b=require("@radix-ui/react-visually-hidden"),j=require("@telegraph/button"),m=require("@telegraph/icon"),c=require("@telegraph/layout"),f=require("clsx"),s=require("framer-motion"),g=require("react");function u(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const i in e)if(i!=="default"){const n=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(r,i,n.get?n:{enumerable:!0,get:()=>e[i]})}}return r.default=e,Object.freeze(r)}const o=u(y),h=u(b),k=({defaultOpen:e,open:r,onOpenChange:i,a11yTitle:n,a11yDescription:l,className:x,children:p,...a})=>t.jsxs(o.Root,{open:r,onOpenChange:i,defaultOpen:e,children:[t.jsxs(h.Root,{children:[t.jsx(o.Title,{children:n}),l&&t.jsx(o.Description,{children:l})]}),t.jsx(s.AnimatePresence,{children:r&&t.jsxs(t.Fragment,{children:[t.jsx(o.Overlay,{asChild:!0,children:t.jsx(c.Box,{as:s.motion.div,onClick:()=>i==null?void 0:i(!1),initial:{backdropFilter:"blur(0px)",opacity:0},animate:{backdropFilter:"blur(4px)",opacity:1},exit:{backdropFilter:"blur(0px)",opacity:0},transition:{duration:.3,bounce:0,type:"spring"},className:"fixed inset-0 bg-alpha-black-4 z-overlay"})}),t.jsx(c.Stack,{className:f("fixed z-modal top-0 left-1/2 -translate-x-1/2","max-h-[calc(100vh-var(--tgph-spacing-32))] shadow-1",x),direction:"column",as:s.motion.div,my:"16",initial:{scale:.8,opacity:0,y:-20,x:"-50%"},animate:{scale:1,opacity:1,y:0,x:"-50%"},exit:{scale:.8,opacity:0,y:-20,x:"-50%"},transition:{duration:.2,bounce:0,type:"spring"},maxW:a.maxW??"140",w:a.w??"full",bg:"surface-1",border:!0,rounded:"4",...a,children:p})]})})]}),q=g.forwardRef(({children:e,...r},i)=>t.jsx(o.Content,{ref:i,...r,asChild:!0,children:t.jsx(c.Stack,{direction:"column",children:e})})),S=({size:e="1",variant:r="ghost",...i})=>t.jsx(o.Close,{asChild:!0,children:t.jsx(j.Button,{icon:{icon:m.Lucide.X,alt:"Close Modal"},variant:r,size:e,...i})}),v=({children:e,...r})=>t.jsx(c.Stack,{direction:"column",px:"6",py:"4",...r,children:e}),w=({children:e,...r})=>t.jsx(c.Stack,{direction:"row",justify:"space-between",align:"center",px:"6",py:"4",borderBottom:!0,...r,children:e}),M=({children:e,...r})=>t.jsx(c.Stack,{direction:"row",align:"center",justify:"end",gap:"2",px:"6",py:"4",borderTop:!0,...r,children:e}),d={};Object.assign(d,{Root:k,Content:q,Close:S,Body:v,Header:w,Footer:M});exports.Modal=d;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Modal/Modal.tsx"],"sourcesContent":["import * as Dialog from \"@radix-ui/react-dialog\";\nimport * as VisuallyHidden from \"@radix-ui/react-visually-hidden\";\nimport { Button } from \"@telegraph/button\";\nimport { Lucide } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport clsx from \"clsx\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport React from \"react\";\n\ntype RootProps = Omit<\n React.ComponentPropsWithoutRef<typeof Dialog.Root>,\n \"modal\"\n> &\n
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Modal/Modal.tsx"],"sourcesContent":["import * as Dialog from \"@radix-ui/react-dialog\";\nimport * as VisuallyHidden from \"@radix-ui/react-visually-hidden\";\nimport { Button } from \"@telegraph/button\";\nimport type {\n PolymorphicProps,\n TgphComponentProps,\n TgphElement,\n} from \"@telegraph/helpers\";\nimport { Lucide } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport clsx from \"clsx\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport React from \"react\";\n\ntype RootProps = Omit<\n React.ComponentPropsWithoutRef<typeof Dialog.Root>,\n \"modal\"\n> &\n TgphComponentProps<typeof Stack> & {\n a11yTitle: string;\n a11yDescription?: string;\n };\n\nconst Root = ({\n defaultOpen,\n open,\n onOpenChange,\n a11yTitle,\n a11yDescription,\n className,\n children,\n ...props\n}: RootProps) => {\n return (\n <Dialog.Root\n open={open}\n onOpenChange={onOpenChange}\n defaultOpen={defaultOpen}\n >\n <VisuallyHidden.Root>\n <Dialog.Title>{a11yTitle}</Dialog.Title>\n {a11yDescription && (\n <Dialog.Description>{a11yDescription}</Dialog.Description>\n )}\n </VisuallyHidden.Root>\n <AnimatePresence>\n {open && (\n <>\n <Dialog.Overlay asChild>\n <Box\n as={motion.div}\n onClick={() => onOpenChange?.(false)}\n initial={{ backdropFilter: \"blur(0px)\", opacity: 0 }}\n animate={{ backdropFilter: \"blur(4px)\", opacity: 1 }}\n exit={{ backdropFilter: \"blur(0px)\", opacity: 0 }}\n transition={{ duration: 0.3, bounce: 0, type: \"spring\" }}\n className=\"fixed inset-0 bg-alpha-black-4 z-overlay\"\n />\n </Dialog.Overlay>\n <Stack\n className={clsx(\n \"fixed z-modal top-0 left-1/2 -translate-x-1/2\",\n \"max-h-[calc(100vh-var(--tgph-spacing-32))] shadow-1\",\n className,\n )}\n direction=\"column\"\n as={motion.div}\n my=\"16\"\n initial={{ scale: 0.8, opacity: 0, y: -20, x: \"-50%\" }}\n animate={{ scale: 1, opacity: 1, y: 0, x: \"-50%\" }}\n exit={{ scale: 0.8, opacity: 0, y: -20, x: \"-50%\" }}\n transition={{ duration: 0.2, bounce: 0, type: \"spring\" }}\n maxW={props.maxW ?? \"140\"}\n w={props.w ?? \"full\"}\n bg=\"surface-1\"\n border\n rounded=\"4\"\n {...props}\n >\n {children}\n </Stack>\n </>\n )}\n </AnimatePresence>\n </Dialog.Root>\n );\n};\n\ntype ContentProps = React.ComponentPropsWithoutRef<typeof Dialog.Content>;\ntype ContentRef = React.ElementRef<typeof Dialog.Content>;\n\nconst Content = React.forwardRef<ContentRef, ContentProps>(\n ({ children, ...props }, forwardedRef) => {\n return (\n <Dialog.Content ref={forwardedRef} {...props} asChild>\n <Stack direction=\"column\">{children}</Stack>\n </Dialog.Content>\n );\n },\n);\n\ntype CloseProps<T extends TgphElement> = TgphComponentProps<typeof Button<T>> &\n Omit<React.ComponentPropsWithoutRef<typeof Dialog.Close>, \"color\">;\nconst Close = <T extends TgphElement>({\n size = \"1\",\n variant = \"ghost\",\n ...props\n}: CloseProps<T>) => {\n return (\n <Dialog.Close asChild>\n <Button\n icon={{ icon: Lucide.X, alt: \"Close Modal\" }}\n variant={variant}\n size={size}\n {...props}\n />\n </Dialog.Close>\n );\n};\n\ntype BodyProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Stack<T>>;\n\nconst Body = <T extends TgphElement>({ children, ...props }: BodyProps<T>) => {\n return (\n <Stack direction=\"column\" px=\"6\" py=\"4\" {...props}>\n {children}\n </Stack>\n );\n};\n\ntype HeaderProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Stack<T>>;\n\nconst Header = <T extends TgphElement>({\n children,\n ...props\n}: HeaderProps<T>) => {\n return (\n <Stack\n direction=\"row\"\n justify=\"space-between\"\n align=\"center\"\n px=\"6\"\n py=\"4\"\n borderBottom\n {...props}\n >\n {children}\n </Stack>\n );\n};\n\ntype FooterProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Stack<T>>;\n\nconst Footer = <T extends TgphElement>({\n children,\n ...props\n}: FooterProps<T>) => {\n return (\n <Stack\n direction=\"row\"\n align=\"center\"\n justify=\"end\"\n gap=\"2\"\n px=\"6\"\n py=\"4\"\n borderTop\n {...props}\n >\n {children}\n </Stack>\n );\n};\n\nconst Modal = {} as {\n Root: typeof Root;\n Content: typeof Content;\n Close: typeof Close;\n Body: typeof Body;\n Header: typeof Header;\n Footer: typeof Footer;\n};\n\nObject.assign(Modal, {\n Root,\n Content,\n Close,\n Body,\n Header,\n Footer,\n});\n\nexport { Modal };\n"],"names":["Root","defaultOpen","open","onOpenChange","a11yTitle","a11yDescription","className","children","props","jsxs","Dialog","VisuallyHidden","jsx","AnimatePresence","Fragment","Box","motion","Stack","clsx","Content","React","forwardedRef","Close","size","variant","Button","Lucide","Body","Header","Footer","Modal"],"mappings":"koBAuBMA,EAAO,CAAC,CACZ,YAAAC,EACA,KAAAC,EACA,aAAAC,EACA,UAAAC,EACA,gBAAAC,EACA,UAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAEIC,EAAA,KAACC,EAAO,KAAP,CACC,KAAAR,EACA,aAAAC,EACA,YAAAF,EAEA,SAAA,CAACQ,EAAAA,KAAAE,EAAe,KAAf,CACC,SAAA,CAACC,EAAAA,IAAAF,EAAO,MAAP,CAAc,SAAUN,CAAA,CAAA,EACxBC,GACCO,EAAA,IAACF,EAAO,YAAP,CAAoB,SAAgBL,EAAA,CAAA,EAEzC,EACAO,EAAA,IAACC,EACE,gBAAA,CAAA,SAAAX,GAEGO,OAAAK,EAAAA,SAAA,CAAA,SAAA,CAAAF,EAAA,IAACF,EAAO,QAAP,CAAe,QAAO,GACrB,SAAAE,EAAA,IAACG,EAAA,IAAA,CACC,GAAIC,EAAO,OAAA,IACX,QAAS,IAAMb,GAAA,YAAAA,EAAe,IAC9B,QAAS,CAAE,eAAgB,YAAa,QAAS,CAAE,EACnD,QAAS,CAAE,eAAgB,YAAa,QAAS,CAAE,EACnD,KAAM,CAAE,eAAgB,YAAa,QAAS,CAAE,EAChD,WAAY,CAAE,SAAU,GAAK,OAAQ,EAAG,KAAM,QAAS,EACvD,UAAU,0CAAA,CAAA,EAEd,EACAS,EAAA,IAACK,EAAA,MAAA,CACC,UAAWC,EACT,gDACA,sDACAZ,CACF,EACA,UAAU,SACV,GAAIU,EAAO,OAAA,IACX,GAAG,KACH,QAAS,CAAE,MAAO,GAAK,QAAS,EAAG,EAAG,IAAK,EAAG,MAAO,EACrD,QAAS,CAAE,MAAO,EAAG,QAAS,EAAG,EAAG,EAAG,EAAG,MAAO,EACjD,KAAM,CAAE,MAAO,GAAK,QAAS,EAAG,EAAG,IAAK,EAAG,MAAO,EAClD,WAAY,CAAE,SAAU,GAAK,OAAQ,EAAG,KAAM,QAAS,EACvD,KAAMR,EAAM,MAAQ,MACpB,EAAGA,EAAM,GAAK,OACd,GAAG,YACH,OAAM,GACN,QAAQ,IACP,GAAGA,EAEH,SAAAD,CAAA,CACH,CAAA,CAAA,CACF,CAEJ,CAAA,CAAA,CAAA,CAAA,EAQAY,EAAUC,EAAM,WACpB,CAAC,CAAE,SAAAb,EAAU,GAAGC,CAAA,EAASa,IAEpBT,EAAAA,IAAAF,EAAO,QAAP,CAAe,IAAKW,EAAe,GAAGb,EAAO,QAAO,GACnD,SAACI,EAAAA,IAAAK,EAAAA,MAAA,CAAM,UAAU,SAAU,SAAAV,EAAS,CACtC,CAAA,CAGN,EAIMe,EAAQ,CAAwB,CACpC,KAAAC,EAAO,IACP,QAAAC,EAAU,QACV,GAAGhB,CACL,IAEKI,EAAAA,IAAAF,EAAO,MAAP,CAAa,QAAO,GACnB,SAAAE,EAAA,IAACa,EAAA,OAAA,CACC,KAAM,CAAE,KAAMC,EAAAA,OAAO,EAAG,IAAK,aAAc,EAC3C,QAAAF,EACA,KAAAD,EACC,GAAGf,CAAA,CAER,CAAA,CAAA,EAOEmB,EAAO,CAAwB,CAAE,SAAApB,EAAU,GAAGC,KAEhDI,EAAA,IAACK,EAAM,MAAA,CAAA,UAAU,SAAS,GAAG,IAAI,GAAG,IAAK,GAAGT,EACzC,SAAAD,CACH,CAAA,EAOEqB,EAAS,CAAwB,CACrC,SAAArB,EACA,GAAGC,CACL,IAEII,EAAA,IAACK,EAAA,MAAA,CACC,UAAU,MACV,QAAQ,gBACR,MAAM,SACN,GAAG,IACH,GAAG,IACH,aAAY,GACX,GAAGT,EAEH,SAAAD,CAAA,CAAA,EAQDsB,EAAS,CAAwB,CACrC,SAAAtB,EACA,GAAGC,CACL,IAEII,EAAA,IAACK,EAAA,MAAA,CACC,UAAU,MACV,MAAM,SACN,QAAQ,MACR,IAAI,IACJ,GAAG,IACH,GAAG,IACH,UAAS,GACR,GAAGT,EAEH,SAAAD,CAAA,CAAA,EAKDuB,EAAQ,CAAC,EASf,OAAO,OAAOA,EAAO,CACnB,KAAA9B,EACA,QAAAmB,EACA,MAAAG,EACA,KAAAK,EACA,OAAAC,EACA,OAAAC,CACF,CAAC"}
|
package/dist/esm/index.mjs
CHANGED
|
@@ -1,131 +1,127 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import * as
|
|
3
|
-
import * as
|
|
4
|
-
import { Button as
|
|
5
|
-
import { Lucide as
|
|
6
|
-
import {
|
|
7
|
-
import
|
|
8
|
-
import { AnimatePresence as g, motion as
|
|
9
|
-
import
|
|
10
|
-
const k =
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
children: [
|
|
27
|
-
/* @__PURE__ */
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
/* @__PURE__ */ t(
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
}
|
|
118
|
-
)
|
|
119
|
-
), z = {};
|
|
120
|
-
Object.assign(z, {
|
|
1
|
+
import { jsx as t, jsxs as l, Fragment as p } from "react/jsx-runtime";
|
|
2
|
+
import * as e from "@radix-ui/react-dialog";
|
|
3
|
+
import * as x from "@radix-ui/react-visually-hidden";
|
|
4
|
+
import { Button as f } from "@telegraph/button";
|
|
5
|
+
import { Lucide as y } from "@telegraph/icon";
|
|
6
|
+
import { Stack as a, Box as b } from "@telegraph/layout";
|
|
7
|
+
import h from "clsx";
|
|
8
|
+
import { AnimatePresence as g, motion as s } from "framer-motion";
|
|
9
|
+
import w from "react";
|
|
10
|
+
const k = ({
|
|
11
|
+
defaultOpen: o,
|
|
12
|
+
open: r,
|
|
13
|
+
onOpenChange: i,
|
|
14
|
+
a11yTitle: d,
|
|
15
|
+
a11yDescription: n,
|
|
16
|
+
className: m,
|
|
17
|
+
children: u,
|
|
18
|
+
...c
|
|
19
|
+
}) => /* @__PURE__ */ l(
|
|
20
|
+
e.Root,
|
|
21
|
+
{
|
|
22
|
+
open: r,
|
|
23
|
+
onOpenChange: i,
|
|
24
|
+
defaultOpen: o,
|
|
25
|
+
children: [
|
|
26
|
+
/* @__PURE__ */ l(x.Root, { children: [
|
|
27
|
+
/* @__PURE__ */ t(e.Title, { children: d }),
|
|
28
|
+
n && /* @__PURE__ */ t(e.Description, { children: n })
|
|
29
|
+
] }),
|
|
30
|
+
/* @__PURE__ */ t(g, { children: r && /* @__PURE__ */ l(p, { children: [
|
|
31
|
+
/* @__PURE__ */ t(e.Overlay, { asChild: !0, children: /* @__PURE__ */ t(
|
|
32
|
+
b,
|
|
33
|
+
{
|
|
34
|
+
as: s.div,
|
|
35
|
+
onClick: () => i == null ? void 0 : i(!1),
|
|
36
|
+
initial: { backdropFilter: "blur(0px)", opacity: 0 },
|
|
37
|
+
animate: { backdropFilter: "blur(4px)", opacity: 1 },
|
|
38
|
+
exit: { backdropFilter: "blur(0px)", opacity: 0 },
|
|
39
|
+
transition: { duration: 0.3, bounce: 0, type: "spring" },
|
|
40
|
+
className: "fixed inset-0 bg-alpha-black-4 z-overlay"
|
|
41
|
+
}
|
|
42
|
+
) }),
|
|
43
|
+
/* @__PURE__ */ t(
|
|
44
|
+
a,
|
|
45
|
+
{
|
|
46
|
+
className: h(
|
|
47
|
+
"fixed z-modal top-0 left-1/2 -translate-x-1/2",
|
|
48
|
+
"max-h-[calc(100vh-var(--tgph-spacing-32))] shadow-1",
|
|
49
|
+
m
|
|
50
|
+
),
|
|
51
|
+
direction: "column",
|
|
52
|
+
as: s.div,
|
|
53
|
+
my: "16",
|
|
54
|
+
initial: { scale: 0.8, opacity: 0, y: -20, x: "-50%" },
|
|
55
|
+
animate: { scale: 1, opacity: 1, y: 0, x: "-50%" },
|
|
56
|
+
exit: { scale: 0.8, opacity: 0, y: -20, x: "-50%" },
|
|
57
|
+
transition: { duration: 0.2, bounce: 0, type: "spring" },
|
|
58
|
+
maxW: c.maxW ?? "140",
|
|
59
|
+
w: c.w ?? "full",
|
|
60
|
+
bg: "surface-1",
|
|
61
|
+
border: !0,
|
|
62
|
+
rounded: "4",
|
|
63
|
+
...c,
|
|
64
|
+
children: u
|
|
65
|
+
}
|
|
66
|
+
)
|
|
67
|
+
] }) })
|
|
68
|
+
]
|
|
69
|
+
}
|
|
70
|
+
), v = w.forwardRef(
|
|
71
|
+
({ children: o, ...r }, i) => /* @__PURE__ */ t(e.Content, { ref: i, ...r, asChild: !0, children: /* @__PURE__ */ t(a, { direction: "column", children: o }) })
|
|
72
|
+
), j = ({
|
|
73
|
+
size: o = "1",
|
|
74
|
+
variant: r = "ghost",
|
|
75
|
+
...i
|
|
76
|
+
}) => /* @__PURE__ */ t(e.Close, { asChild: !0, children: /* @__PURE__ */ t(
|
|
77
|
+
f,
|
|
78
|
+
{
|
|
79
|
+
icon: { icon: y.X, alt: "Close Modal" },
|
|
80
|
+
variant: r,
|
|
81
|
+
size: o,
|
|
82
|
+
...i
|
|
83
|
+
}
|
|
84
|
+
) }), F = ({ children: o, ...r }) => /* @__PURE__ */ t(a, { direction: "column", px: "6", py: "4", ...r, children: o }), R = ({
|
|
85
|
+
children: o,
|
|
86
|
+
...r
|
|
87
|
+
}) => /* @__PURE__ */ t(
|
|
88
|
+
a,
|
|
89
|
+
{
|
|
90
|
+
direction: "row",
|
|
91
|
+
justify: "space-between",
|
|
92
|
+
align: "center",
|
|
93
|
+
px: "6",
|
|
94
|
+
py: "4",
|
|
95
|
+
borderBottom: !0,
|
|
96
|
+
...r,
|
|
97
|
+
children: o
|
|
98
|
+
}
|
|
99
|
+
), B = ({
|
|
100
|
+
children: o,
|
|
101
|
+
...r
|
|
102
|
+
}) => /* @__PURE__ */ t(
|
|
103
|
+
a,
|
|
104
|
+
{
|
|
105
|
+
direction: "row",
|
|
106
|
+
align: "center",
|
|
107
|
+
justify: "end",
|
|
108
|
+
gap: "2",
|
|
109
|
+
px: "6",
|
|
110
|
+
py: "4",
|
|
111
|
+
borderTop: !0,
|
|
112
|
+
...r,
|
|
113
|
+
children: o
|
|
114
|
+
}
|
|
115
|
+
), C = {};
|
|
116
|
+
Object.assign(C, {
|
|
121
117
|
Root: k,
|
|
122
118
|
Content: v,
|
|
123
119
|
Close: j,
|
|
124
120
|
Body: F,
|
|
125
|
-
Header:
|
|
126
|
-
Footer:
|
|
121
|
+
Header: R,
|
|
122
|
+
Footer: B
|
|
127
123
|
});
|
|
128
124
|
export {
|
|
129
|
-
|
|
125
|
+
C as Modal
|
|
130
126
|
};
|
|
131
127
|
//# sourceMappingURL=index.mjs.map
|
package/dist/esm/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Modal/Modal.tsx"],"sourcesContent":["import * as Dialog from \"@radix-ui/react-dialog\";\nimport * as VisuallyHidden from \"@radix-ui/react-visually-hidden\";\nimport { Button } from \"@telegraph/button\";\nimport { Lucide } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport clsx from \"clsx\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport React from \"react\";\n\ntype RootProps = Omit<\n React.ComponentPropsWithoutRef<typeof Dialog.Root>,\n \"modal\"\n> &\n
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Modal/Modal.tsx"],"sourcesContent":["import * as Dialog from \"@radix-ui/react-dialog\";\nimport * as VisuallyHidden from \"@radix-ui/react-visually-hidden\";\nimport { Button } from \"@telegraph/button\";\nimport type {\n PolymorphicProps,\n TgphComponentProps,\n TgphElement,\n} from \"@telegraph/helpers\";\nimport { Lucide } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport clsx from \"clsx\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport React from \"react\";\n\ntype RootProps = Omit<\n React.ComponentPropsWithoutRef<typeof Dialog.Root>,\n \"modal\"\n> &\n TgphComponentProps<typeof Stack> & {\n a11yTitle: string;\n a11yDescription?: string;\n };\n\nconst Root = ({\n defaultOpen,\n open,\n onOpenChange,\n a11yTitle,\n a11yDescription,\n className,\n children,\n ...props\n}: RootProps) => {\n return (\n <Dialog.Root\n open={open}\n onOpenChange={onOpenChange}\n defaultOpen={defaultOpen}\n >\n <VisuallyHidden.Root>\n <Dialog.Title>{a11yTitle}</Dialog.Title>\n {a11yDescription && (\n <Dialog.Description>{a11yDescription}</Dialog.Description>\n )}\n </VisuallyHidden.Root>\n <AnimatePresence>\n {open && (\n <>\n <Dialog.Overlay asChild>\n <Box\n as={motion.div}\n onClick={() => onOpenChange?.(false)}\n initial={{ backdropFilter: \"blur(0px)\", opacity: 0 }}\n animate={{ backdropFilter: \"blur(4px)\", opacity: 1 }}\n exit={{ backdropFilter: \"blur(0px)\", opacity: 0 }}\n transition={{ duration: 0.3, bounce: 0, type: \"spring\" }}\n className=\"fixed inset-0 bg-alpha-black-4 z-overlay\"\n />\n </Dialog.Overlay>\n <Stack\n className={clsx(\n \"fixed z-modal top-0 left-1/2 -translate-x-1/2\",\n \"max-h-[calc(100vh-var(--tgph-spacing-32))] shadow-1\",\n className,\n )}\n direction=\"column\"\n as={motion.div}\n my=\"16\"\n initial={{ scale: 0.8, opacity: 0, y: -20, x: \"-50%\" }}\n animate={{ scale: 1, opacity: 1, y: 0, x: \"-50%\" }}\n exit={{ scale: 0.8, opacity: 0, y: -20, x: \"-50%\" }}\n transition={{ duration: 0.2, bounce: 0, type: \"spring\" }}\n maxW={props.maxW ?? \"140\"}\n w={props.w ?? \"full\"}\n bg=\"surface-1\"\n border\n rounded=\"4\"\n {...props}\n >\n {children}\n </Stack>\n </>\n )}\n </AnimatePresence>\n </Dialog.Root>\n );\n};\n\ntype ContentProps = React.ComponentPropsWithoutRef<typeof Dialog.Content>;\ntype ContentRef = React.ElementRef<typeof Dialog.Content>;\n\nconst Content = React.forwardRef<ContentRef, ContentProps>(\n ({ children, ...props }, forwardedRef) => {\n return (\n <Dialog.Content ref={forwardedRef} {...props} asChild>\n <Stack direction=\"column\">{children}</Stack>\n </Dialog.Content>\n );\n },\n);\n\ntype CloseProps<T extends TgphElement> = TgphComponentProps<typeof Button<T>> &\n Omit<React.ComponentPropsWithoutRef<typeof Dialog.Close>, \"color\">;\nconst Close = <T extends TgphElement>({\n size = \"1\",\n variant = \"ghost\",\n ...props\n}: CloseProps<T>) => {\n return (\n <Dialog.Close asChild>\n <Button\n icon={{ icon: Lucide.X, alt: \"Close Modal\" }}\n variant={variant}\n size={size}\n {...props}\n />\n </Dialog.Close>\n );\n};\n\ntype BodyProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Stack<T>>;\n\nconst Body = <T extends TgphElement>({ children, ...props }: BodyProps<T>) => {\n return (\n <Stack direction=\"column\" px=\"6\" py=\"4\" {...props}>\n {children}\n </Stack>\n );\n};\n\ntype HeaderProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Stack<T>>;\n\nconst Header = <T extends TgphElement>({\n children,\n ...props\n}: HeaderProps<T>) => {\n return (\n <Stack\n direction=\"row\"\n justify=\"space-between\"\n align=\"center\"\n px=\"6\"\n py=\"4\"\n borderBottom\n {...props}\n >\n {children}\n </Stack>\n );\n};\n\ntype FooterProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Stack<T>>;\n\nconst Footer = <T extends TgphElement>({\n children,\n ...props\n}: FooterProps<T>) => {\n return (\n <Stack\n direction=\"row\"\n align=\"center\"\n justify=\"end\"\n gap=\"2\"\n px=\"6\"\n py=\"4\"\n borderTop\n {...props}\n >\n {children}\n </Stack>\n );\n};\n\nconst Modal = {} as {\n Root: typeof Root;\n Content: typeof Content;\n Close: typeof Close;\n Body: typeof Body;\n Header: typeof Header;\n Footer: typeof Footer;\n};\n\nObject.assign(Modal, {\n Root,\n Content,\n Close,\n Body,\n Header,\n Footer,\n});\n\nexport { Modal };\n"],"names":["Root","defaultOpen","open","onOpenChange","a11yTitle","a11yDescription","className","children","props","jsxs","Dialog","VisuallyHidden","jsx","AnimatePresence","Fragment","Box","motion","Stack","clsx","Content","React","forwardedRef","Close","size","variant","Button","Lucide","Body","Header","Footer","Modal"],"mappings":";;;;;;;;;AAuBA,MAAMA,IAAO,CAAC;AAAA,EACZ,aAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC;AAAA,EAACC,EAAO;AAAA,EAAP;AAAA,IACC,MAAAR;AAAA,IACA,cAAAC;AAAA,IACA,aAAAF;AAAA,IAEA,UAAA;AAAA,MAAC,gBAAAQ,EAAAE,EAAe,MAAf,EACC,UAAA;AAAA,QAAC,gBAAAC,EAAAF,EAAO,OAAP,EAAc,UAAUN,EAAA,CAAA;AAAA,QACxBC,KACC,gBAAAO,EAACF,EAAO,aAAP,EAAoB,UAAgBL,GAAA;AAAA,MAAA,GAEzC;AAAA,MACA,gBAAAO,EAACC,GACE,EAAA,UAAAX,KAEG,gBAAAO,EAAAK,GAAA,EAAA,UAAA;AAAA,QAAA,gBAAAF,EAACF,EAAO,SAAP,EAAe,SAAO,IACrB,UAAA,gBAAAE;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,IAAIC,EAAO;AAAA,YACX,SAAS,MAAMb,KAAA,gBAAAA,EAAe;AAAA,YAC9B,SAAS,EAAE,gBAAgB,aAAa,SAAS,EAAE;AAAA,YACnD,SAAS,EAAE,gBAAgB,aAAa,SAAS,EAAE;AAAA,YACnD,MAAM,EAAE,gBAAgB,aAAa,SAAS,EAAE;AAAA,YAChD,YAAY,EAAE,UAAU,KAAK,QAAQ,GAAG,MAAM,SAAS;AAAA,YACvD,WAAU;AAAA,UAAA;AAAA,QAAA,GAEd;AAAA,QACA,gBAAAS;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,WAAWC;AAAA,cACT;AAAA,cACA;AAAA,cACAZ;AAAA,YACF;AAAA,YACA,WAAU;AAAA,YACV,IAAIU,EAAO;AAAA,YACX,IAAG;AAAA,YACH,SAAS,EAAE,OAAO,KAAK,SAAS,GAAG,GAAG,KAAK,GAAG,OAAO;AAAA,YACrD,SAAS,EAAE,OAAO,GAAG,SAAS,GAAG,GAAG,GAAG,GAAG,OAAO;AAAA,YACjD,MAAM,EAAE,OAAO,KAAK,SAAS,GAAG,GAAG,KAAK,GAAG,OAAO;AAAA,YAClD,YAAY,EAAE,UAAU,KAAK,QAAQ,GAAG,MAAM,SAAS;AAAA,YACvD,MAAMR,EAAM,QAAQ;AAAA,YACpB,GAAGA,EAAM,KAAK;AAAA,YACd,IAAG;AAAA,YACH,QAAM;AAAA,YACN,SAAQ;AAAA,YACP,GAAGA;AAAA,YAEH,UAAAD;AAAA,UAAA;AAAA,QACH;AAAA,MAAA,EAAA,CACF,EAEJ,CAAA;AAAA,IAAA;AAAA,EAAA;AAAA,GAQAY,IAAUC,EAAM;AAAA,EACpB,CAAC,EAAE,UAAAb,GAAU,GAAGC,EAAA,GAASa,MAEpB,gBAAAT,EAAAF,EAAO,SAAP,EAAe,KAAKW,GAAe,GAAGb,GAAO,SAAO,IACnD,UAAC,gBAAAI,EAAAK,GAAA,EAAM,WAAU,UAAU,UAAAV,GAAS,EACtC,CAAA;AAGN,GAIMe,IAAQ,CAAwB;AAAA,EACpC,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,GAAGhB;AACL,MAEK,gBAAAI,EAAAF,EAAO,OAAP,EAAa,SAAO,IACnB,UAAA,gBAAAE;AAAA,EAACa;AAAA,EAAA;AAAA,IACC,MAAM,EAAE,MAAMC,EAAO,GAAG,KAAK,cAAc;AAAA,IAC3C,SAAAF;AAAA,IACA,MAAAD;AAAA,IACC,GAAGf;AAAA,EAAA;AAER,EAAA,CAAA,GAOEmB,IAAO,CAAwB,EAAE,UAAApB,GAAU,GAAGC,QAEhD,gBAAAI,EAACK,GAAM,EAAA,WAAU,UAAS,IAAG,KAAI,IAAG,KAAK,GAAGT,GACzC,UAAAD,EACH,CAAA,GAOEqB,IAAS,CAAwB;AAAA,EACrC,UAAArB;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAI;AAAA,EAACK;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,IAAG;AAAA,IACH,IAAG;AAAA,IACH,cAAY;AAAA,IACX,GAAGT;AAAA,IAEH,UAAAD;AAAA,EAAA;AAAA,GAQDsB,IAAS,CAAwB;AAAA,EACrC,UAAAtB;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAI;AAAA,EAACK;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,OAAM;AAAA,IACN,SAAQ;AAAA,IACR,KAAI;AAAA,IACJ,IAAG;AAAA,IACH,IAAG;AAAA,IACH,WAAS;AAAA,IACR,GAAGT;AAAA,IAEH,UAAAD;AAAA,EAAA;AAAA,GAKDuB,IAAQ,CAAC;AASf,OAAO,OAAOA,GAAO;AAAA,EACnB,MAAA9B;AAAA,EACA,SAAAmB;AAAA,EACA,OAAAG;AAAA,EACA,MAAAK;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AACF,CAAC;"}
|
|
@@ -1,77 +1,22 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Button } from '@telegraph/button';
|
|
2
|
+
import { PolymorphicProps, TgphComponentProps, TgphElement } from '@telegraph/helpers';
|
|
2
3
|
import { Stack } from '@telegraph/layout';
|
|
3
4
|
import { default as React } from 'react';
|
|
4
5
|
import * as Dialog from "@radix-ui/react-dialog";
|
|
5
|
-
type RootProps = Omit<React.ComponentPropsWithoutRef<typeof Dialog.Root>, "modal"> &
|
|
6
|
+
type RootProps = Omit<React.ComponentPropsWithoutRef<typeof Dialog.Root>, "modal"> & TgphComponentProps<typeof Stack> & {
|
|
6
7
|
a11yTitle: string;
|
|
7
8
|
a11yDescription?: string;
|
|
8
9
|
};
|
|
9
|
-
declare const Root:
|
|
10
|
+
declare const Root: ({ defaultOpen, open, onOpenChange, a11yTitle, a11yDescription, className, children, ...props }: RootProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
11
|
declare const Content: React.ForwardRefExoticComponent<Omit<Dialog.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
"aria-hidden"?: boolean | undefined;
|
|
20
|
-
} | {
|
|
21
|
-
alt?: string | undefined;
|
|
22
|
-
"aria-hidden": true;
|
|
23
|
-
})) & React.HTMLAttributes<HTMLDivElement>) & React.RefAttributes<SVGSVGElement>) | undefined;
|
|
24
|
-
trailingIcon?: ((({
|
|
25
|
-
icon: React.ForwardRefExoticComponent<Omit<Lucide.LucideProps, "ref"> & React.RefAttributes<SVGSVGElement>>;
|
|
26
|
-
size?: "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | undefined;
|
|
27
|
-
variant?: "primary" | "secondary" | undefined;
|
|
28
|
-
color?: "white" | "disabled" | "default" | "gray" | "accent" | "beige" | "blue" | "green" | "yellow" | "purple" | "red" | undefined;
|
|
29
|
-
} & ({
|
|
30
|
-
alt: string;
|
|
31
|
-
"aria-hidden"?: boolean | undefined;
|
|
32
|
-
} | {
|
|
33
|
-
alt?: string | undefined;
|
|
34
|
-
"aria-hidden": true;
|
|
35
|
-
})) & React.HTMLAttributes<HTMLDivElement>) & React.RefAttributes<SVGSVGElement>) | undefined;
|
|
36
|
-
icon?: undefined;
|
|
37
|
-
} & {
|
|
38
|
-
variant?: "ghost" | "solid" | "soft" | "outline" | undefined;
|
|
39
|
-
size?: "1" | "2" | "3" | undefined;
|
|
40
|
-
color?: "gray" | "accent" | "blue" | "green" | "yellow" | "purple" | "red" | undefined;
|
|
41
|
-
state?: "disabled" | "loading" | "default" | "error" | "success" | "warning" | undefined;
|
|
42
|
-
active?: boolean | undefined;
|
|
43
|
-
} & {
|
|
44
|
-
ref?: (string | React.Ref<HTMLButtonElement>) | undefined;
|
|
45
|
-
}, "ref">, "ref"> | Omit<Omit<Omit<Dialog.DialogCloseProps & React.RefAttributes<HTMLButtonElement>, "ref">, "color"> & Omit<import('@telegraph/helpers').AsProp<React.ElementType<any, keyof React.JSX.IntrinsicElements>> & Omit<any, "as"> & {
|
|
46
|
-
icon?: ((({
|
|
47
|
-
icon: React.ForwardRefExoticComponent<Omit<Lucide.LucideProps, "ref"> & React.RefAttributes<SVGSVGElement>>;
|
|
48
|
-
size?: "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | undefined;
|
|
49
|
-
variant?: "primary" | "secondary" | undefined;
|
|
50
|
-
color?: "white" | "disabled" | "default" | "gray" | "accent" | "beige" | "blue" | "green" | "yellow" | "purple" | "red" | undefined;
|
|
51
|
-
} & ({
|
|
52
|
-
alt: string;
|
|
53
|
-
"aria-hidden"?: boolean | undefined;
|
|
54
|
-
} | {
|
|
55
|
-
alt?: string | undefined;
|
|
56
|
-
"aria-hidden": true;
|
|
57
|
-
})) & React.HTMLAttributes<HTMLDivElement>) & React.RefAttributes<SVGSVGElement>) | undefined;
|
|
58
|
-
leadingIcon?: undefined;
|
|
59
|
-
trailingIcon?: undefined;
|
|
60
|
-
} & {
|
|
61
|
-
variant?: "ghost" | "solid" | "soft" | "outline" | undefined;
|
|
62
|
-
size?: "1" | "2" | "3" | undefined;
|
|
63
|
-
color?: "gray" | "accent" | "blue" | "green" | "yellow" | "purple" | "red" | undefined;
|
|
64
|
-
state?: "disabled" | "loading" | "default" | "error" | "success" | "warning" | undefined;
|
|
65
|
-
active?: boolean | undefined;
|
|
66
|
-
} & {
|
|
67
|
-
ref?: (string | React.Ref<HTMLButtonElement>) | undefined;
|
|
68
|
-
}, "ref">, "ref">) & React.RefAttributes<HTMLButtonElement>>;
|
|
69
|
-
type BodyProps = React.ComponentPropsWithoutRef<typeof Stack>;
|
|
70
|
-
declare const Body: React.FC<BodyProps>;
|
|
71
|
-
type HeaderProps = React.ComponentPropsWithoutRef<typeof Stack>;
|
|
72
|
-
declare const Header: React.FC<HeaderProps>;
|
|
73
|
-
type FooterProps = React.ComponentPropsWithoutRef<typeof Stack>;
|
|
74
|
-
declare const Footer: React.FC<FooterProps>;
|
|
12
|
+
type CloseProps<T extends TgphElement> = TgphComponentProps<typeof Button<T>> & Omit<React.ComponentPropsWithoutRef<typeof Dialog.Close>, "color">;
|
|
13
|
+
declare const Close: <T extends TgphElement>({ size, variant, ...props }: CloseProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
type BodyProps<T extends TgphElement> = PolymorphicProps<T> & TgphComponentProps<typeof Stack<T>>;
|
|
15
|
+
declare const Body: <T extends TgphElement>({ children, ...props }: BodyProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
type HeaderProps<T extends TgphElement> = PolymorphicProps<T> & TgphComponentProps<typeof Stack<T>>;
|
|
17
|
+
declare const Header: <T extends TgphElement>({ children, ...props }: HeaderProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
type FooterProps<T extends TgphElement> = PolymorphicProps<T> & TgphComponentProps<typeof Stack<T>>;
|
|
19
|
+
declare const Footer: <T extends TgphElement>({ children, ...props }: FooterProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
75
20
|
declare const Modal: {
|
|
76
21
|
Root: typeof Root;
|
|
77
22
|
Content: typeof Content;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,KAAK,EACV,gBAAgB,EAChB,kBAAkB,EAClB,WAAW,EACZ,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EAAO,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAG/C,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,KAAK,SAAS,GAAG,IAAI,CACnB,KAAK,CAAC,wBAAwB,CAAC,OAAO,MAAM,CAAC,IAAI,CAAC,EAClD,OAAO,CACR,GACC,kBAAkB,CAAC,OAAO,KAAK,CAAC,GAAG;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEJ,QAAA,MAAM,IAAI,mGASP,SAAS,4CAsDX,CAAC;AAKF,QAAA,MAAM,OAAO,qJAQZ,CAAC;AAEF,KAAK,UAAU,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CAAC,OAAO,MAAM,CAAC,CAAC,CAAC,CAAC,GAC3E,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;AACrE,QAAA,MAAM,KAAK,uDAIR,WAAW,CAAC,CAAC,4CAWf,CAAC;AAEF,KAAK,SAAS,CAAC,CAAC,SAAS,WAAW,IAAI,gBAAgB,CAAC,CAAC,CAAC,GACzD,kBAAkB,CAAC,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtC,QAAA,MAAM,IAAI,kDAAmD,UAAU,CAAC,CAAC,4CAMxE,CAAC;AAEF,KAAK,WAAW,CAAC,CAAC,SAAS,WAAW,IAAI,gBAAgB,CAAC,CAAC,CAAC,GAC3D,kBAAkB,CAAC,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtC,QAAA,MAAM,MAAM,kDAGT,YAAY,CAAC,CAAC,4CAchB,CAAC;AAEF,KAAK,WAAW,CAAC,CAAC,SAAS,WAAW,IAAI,gBAAgB,CAAC,CAAC,CAAC,GAC3D,kBAAkB,CAAC,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtC,QAAA,MAAM,MAAM,kDAGT,YAAY,CAAC,CAAC,4CAehB,CAAC;AAEF,QAAA,MAAM,KAAK;UACH,WAAW;aACR,cAAc;WAChB,YAAY;UACb,WAAW;YACT,aAAa;YACb,aAAa;CACtB,CAAC;AAWF,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@telegraph/modal",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.9",
|
|
4
4
|
"repository": "https://github.com/knocklabs/telegraph/tree/main/packages/modal",
|
|
5
5
|
"author": "@knocklabs",
|
|
6
6
|
"license": "MIT",
|
|
@@ -36,9 +36,9 @@
|
|
|
36
36
|
"dependencies": {
|
|
37
37
|
"@radix-ui/react-dialog": "^1.0.5",
|
|
38
38
|
"@radix-ui/react-visually-hidden": "^1.0.3",
|
|
39
|
-
"@telegraph/button": "^0.0.
|
|
40
|
-
"@telegraph/icon": "^0.0.
|
|
41
|
-
"@telegraph/layout": "^0.0.
|
|
39
|
+
"@telegraph/button": "^0.0.20",
|
|
40
|
+
"@telegraph/icon": "^0.0.12",
|
|
41
|
+
"@telegraph/layout": "^0.0.12",
|
|
42
42
|
"clsx": "^2.1.0",
|
|
43
43
|
"framer-motion": "^11.1.9"
|
|
44
44
|
},
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"@knocklabs/eslint-config": "^0.0.3",
|
|
47
47
|
"@knocklabs/prettier-config": "^0.0.1",
|
|
48
48
|
"@knocklabs/typescript-config": "^0.0.2",
|
|
49
|
-
"@telegraph/postcss-config": "^0.0.
|
|
49
|
+
"@telegraph/postcss-config": "^0.0.16",
|
|
50
50
|
"@telegraph/tailwind-config": "^0.0.11",
|
|
51
51
|
"@telegraph/vite-config": "^0.0.9",
|
|
52
52
|
"@telegraph/vitest-config": "^0.0.6",
|