@economic/taco 1.13.0 → 1.13.2
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/components/Dialog/util.d.ts +1 -0
- package/dist/esm/packages/taco/src/components/AlertDialog/components/Content.js +2 -2
- package/dist/esm/packages/taco/src/components/AlertDialog/components/Content.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Dialog/components/Content.js +2 -2
- package/dist/esm/packages/taco/src/components/Dialog/components/Content.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Dialog/util.js +3 -2
- package/dist/esm/packages/taco/src/components/Dialog/util.js.map +1 -1
- package/dist/taco.cjs.development.js +5 -4
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -2
- package/types.json +3 -3
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
import { DialogSize } from './types';
|
|
2
2
|
export declare const getDialogSizeClassnames: (size: DialogSize) => "w-128" | "w-xs" | "w-sm" | "w-md" | "w-lg";
|
|
3
3
|
export declare const getDialogPositionClassnames: () => string;
|
|
4
|
+
export declare const getDialogStylingClassnames: () => string;
|
|
@@ -2,7 +2,7 @@ import { forwardRef, createElement } from 'react';
|
|
|
2
2
|
import { Title as Title$1, Portal, Overlay, Content as Content$1 } from '@radix-ui/react-alert-dialog';
|
|
3
3
|
import cn from 'classnames';
|
|
4
4
|
import { Backdrop } from '../../Backdrop/Backdrop.js';
|
|
5
|
-
import { getDialogPositionClassnames, getDialogSizeClassnames } from '../../Dialog/util.js';
|
|
5
|
+
import { getDialogPositionClassnames, getDialogStylingClassnames, getDialogSizeClassnames } from '../../Dialog/util.js';
|
|
6
6
|
|
|
7
7
|
const Title = /*#__PURE__*/forwardRef(function AlertDialogTitle(props, ref) {
|
|
8
8
|
const className = cn('text-center', props.className);
|
|
@@ -12,7 +12,7 @@ const Title = /*#__PURE__*/forwardRef(function AlertDialogTitle(props, ref) {
|
|
|
12
12
|
}));
|
|
13
13
|
});
|
|
14
14
|
const Content = /*#__PURE__*/forwardRef(function AlertDialogContent(props, ref) {
|
|
15
|
-
const className = cn('
|
|
15
|
+
const className = cn('p-6', getDialogPositionClassnames(), getDialogStylingClassnames(), getDialogSizeClassnames('dialog'));
|
|
16
16
|
return /*#__PURE__*/createElement(Portal, null, /*#__PURE__*/createElement(Overlay, {
|
|
17
17
|
asChild: true
|
|
18
18
|
}, /*#__PURE__*/createElement(Backdrop, null, /*#__PURE__*/createElement(Content$1, Object.assign({}, props, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/AlertDialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';\nimport cn from 'classnames';\nimport { Backdrop } from '../../Backdrop/Backdrop';\nimport { getDialogPositionClassnames, getDialogSizeClassnames } from '../../Dialog/util';\n\nexport type AlertDialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function AlertDialogTitle(\n props: AlertDialogTitleProps,\n ref: React.Ref<HTMLHeadingElement>\n) {\n const className = cn('text-center', props.className);\n return <AlertDialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type AlertDialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n /** An accessible label to be announced when the dialog is opened */\n 'aria-label': string;\n children: React.ReactNode;\n};\nexport const Content = React.forwardRef(function AlertDialogContent(\n props: AlertDialogContentProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const className = cn(
|
|
1
|
+
{"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/AlertDialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';\nimport cn from 'classnames';\nimport { Backdrop } from '../../Backdrop/Backdrop';\nimport { getDialogPositionClassnames, getDialogSizeClassnames, getDialogStylingClassnames } from '../../Dialog/util';\n\nexport type AlertDialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function AlertDialogTitle(\n props: AlertDialogTitleProps,\n ref: React.Ref<HTMLHeadingElement>\n) {\n const className = cn('text-center', props.className);\n return <AlertDialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type AlertDialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n /** An accessible label to be announced when the dialog is opened */\n 'aria-label': string;\n children: React.ReactNode;\n};\nexport const Content = React.forwardRef(function AlertDialogContent(\n props: AlertDialogContentProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const className = cn('p-6', getDialogPositionClassnames(), getDialogStylingClassnames(), getDialogSizeClassnames('dialog'));\n\n return (\n <AlertDialogPrimitive.Portal>\n <AlertDialogPrimitive.Overlay asChild>\n <Backdrop>\n <AlertDialogPrimitive.Content {...props} ref={ref} className={className}>\n {props.children}\n </AlertDialogPrimitive.Content>\n </Backdrop>\n </AlertDialogPrimitive.Overlay>\n </AlertDialogPrimitive.Portal>\n );\n});\n"],"names":["Title","React","AlertDialogTitle","props","ref","className","cn","AlertDialogPrimitive","Content","AlertDialogContent","getDialogPositionClassnames","getDialogStylingClassnames","getDialogSizeClassnames","asChild","Backdrop","children"],"mappings":";;;;;;MAOaA,KAAK,gBAAGC,UAAgB,CAAC,SAASC,gBAAgB,CAC3DC,KAA4B,EAC5BC,GAAkC;EAElC,MAAMC,SAAS,GAAGC,EAAE,CAAC,aAAa,EAAEH,KAAK,CAACE,SAAS,CAAC;EACpD,oBAAOJ,cAACM,OAA0B,oBAAKJ,KAAK;IAAEE,SAAS,EAAEA,SAAS;IAAED,GAAG,EAAEA;KAAO;AACpF,CAAC;MAOYI,OAAO,gBAAGP,UAAgB,CAAC,SAASQ,kBAAkB,CAC/DN,KAA8B,EAC9BC,GAA8B;EAE9B,MAAMC,SAAS,GAAGC,EAAE,CAAC,KAAK,EAAEI,2BAA2B,EAAE,EAAEC,0BAA0B,EAAE,EAAEC,uBAAuB,CAAC,QAAQ,CAAC,CAAC;EAE3H,oBACIX,cAACM,MAA2B,qBACxBN,cAACM,OAA4B;IAACM,OAAO;kBACjCZ,cAACa,QAAQ,qBACLb,cAACM,SAA4B,oBAAKJ,KAAK;IAAEC,GAAG,EAAEA,GAAG;IAAEC,SAAS,EAAEA;MACzDF,KAAK,CAACY,QAAQ,CACY,CACxB,CACgB,CACL;AAEtC,CAAC;;;;"}
|
|
@@ -56,7 +56,7 @@ const Content = /*#__PURE__*/forwardRef(function DialogContent(props, ref) {
|
|
|
56
56
|
const {
|
|
57
57
|
texts
|
|
58
58
|
} = useLocalization();
|
|
59
|
-
const className = cn('bg-white
|
|
59
|
+
const className = cn('relative bg-white animate-[fade-in_150ms]', getDialogPositionClassnames(), getDialogSizeClassnames(dialog.size));
|
|
60
60
|
const containerClassName = cn('bg-white p-6 rounded relative z-10', 'shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]', {
|
|
61
61
|
'rounded-b-none': !!dialog.elements.extra
|
|
62
62
|
}, props.className);
|
|
@@ -87,7 +87,7 @@ const Content = /*#__PURE__*/forwardRef(function DialogContent(props, ref) {
|
|
|
87
87
|
className: className,
|
|
88
88
|
onEscapeKeyDown: handleEscapeKeyDown,
|
|
89
89
|
onInteractOutside: handleInteractOutside,
|
|
90
|
-
ref:
|
|
90
|
+
ref: internalRef,
|
|
91
91
|
style: {
|
|
92
92
|
...props.style,
|
|
93
93
|
left: dialog.draggable ? `${position.x}px` : undefined,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { useProxiedRef } from '../../../utils/hooks/useProxiedRef';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { DialogContext, useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Provider';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { Backdrop } from '../../Backdrop/Backdrop';\nimport { getDialogPositionClassnames, getDialogSizeClassnames } from '../util';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\n\nexport type DialogContentRenderProps = {\n close: () => void;\n drawer?: DialogContentDrawerRenderProps;\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n const className = cn('text-center', props.className);\n return <DialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n const className = cn('mt-8 flex justify-end', props.className);\n return (\n <div {...props} className={className} ref={ref}>\n {props.children}\n </div>\n );\n});\n\nexport type DialogCloseProps = React.HTMLAttributes<HTMLButtonElement>;\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n const dialog = useCurrentDialog();\n\n return <DialogPrimitive.Close onClick={dialog.onClose} {...props} ref={ref} asChild />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick, renderProps }: any, ref) {\n const close = () => {\n onClick(new CustomEvent('close'));\n };\n\n return children({ close, ref, ...renderProps });\n});\n\nexport type DialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n /** An accessible label to be announced when the dialog is opened */\n 'aria-label': string;\n children: Omit<React.ReactNode, 'Function'> | ((props: DialogContentRenderProps) => JSX.Element);\n};\nexport const Content = React.forwardRef(function DialogContent(props: DialogContentProps, ref: React.Ref<HTMLDivElement>) {\n const dialog = useCurrentDialog();\n const internalRef = useProxiedRef<HTMLDivElement>(ref);\n const { position, handleProps: dragHandleProps } = useDraggable(internalRef);\n const { texts } = useLocalization();\n\n const className = cn(\n 'bg-white
|
|
1
|
+
{"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { useProxiedRef } from '../../../utils/hooks/useProxiedRef';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { DialogContext, useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Provider';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { Backdrop } from '../../Backdrop/Backdrop';\nimport { getDialogPositionClassnames, getDialogSizeClassnames } from '../util';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\n\nexport type DialogContentRenderProps = {\n close: () => void;\n drawer?: DialogContentDrawerRenderProps;\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n const className = cn('text-center', props.className);\n return <DialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n const className = cn('mt-8 flex justify-end', props.className);\n return (\n <div {...props} className={className} ref={ref}>\n {props.children}\n </div>\n );\n});\n\nexport type DialogCloseProps = React.HTMLAttributes<HTMLButtonElement>;\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n const dialog = useCurrentDialog();\n\n return <DialogPrimitive.Close onClick={dialog.onClose} {...props} ref={ref} asChild />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick, renderProps }: any, ref) {\n const close = () => {\n onClick(new CustomEvent('close'));\n };\n\n return children({ close, ref, ...renderProps });\n});\n\nexport type DialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n /** An accessible label to be announced when the dialog is opened */\n 'aria-label': string;\n children: Omit<React.ReactNode, 'Function'> | ((props: DialogContentRenderProps) => JSX.Element);\n};\nexport const Content = React.forwardRef(function DialogContent(props: DialogContentProps, ref: React.Ref<HTMLDivElement>) {\n const dialog = useCurrentDialog();\n const internalRef = useProxiedRef<HTMLDivElement>(ref);\n const { position, handleProps: dragHandleProps } = useDraggable(internalRef);\n const { texts } = useLocalization();\n\n const className = cn(\n 'relative bg-white animate-[fade-in_150ms]',\n getDialogPositionClassnames(),\n getDialogSizeClassnames(dialog.size)\n );\n\n const containerClassName = cn(\n 'bg-white p-6 rounded relative z-10',\n 'shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]',\n {\n 'rounded-b-none': !!dialog.elements.extra,\n },\n props.className\n );\n\n const handleEscapeKeyDown = (event: KeyboardEvent) => {\n if (!dialog.closeOnEscape) {\n event.preventDefault();\n } else if (dialog.onClose) {\n dialog.onClose();\n }\n };\n\n // the chosen behaviour in taco is that outside clicks do not close the dialog\n const handleInteractOutside = event => event.preventDefault();\n\n let output;\n\n if (typeof props.children === 'function') {\n output = (\n <DialogPrimitive.Close asChild>\n <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n </DialogPrimitive.Close>\n );\n } else {\n output = props.children;\n }\n\n return (\n <DialogPrimitive.Portal>\n <DialogPrimitive.Overlay asChild>\n <Backdrop>\n <DialogPrimitive.Content\n {...props}\n className={className}\n onEscapeKeyDown={handleEscapeKeyDown}\n onInteractOutside={handleInteractOutside}\n ref={internalRef}\n style={{\n ...props.style,\n left: dialog.draggable ? `${position.x}px` : undefined,\n top: dialog.draggable ? `${position.y}px` : undefined,\n }}>\n <div className={containerClassName} data-taco=\"dialog\">\n {output}\n {dialog.draggable && (\n <div\n {...dragHandleProps}\n aria-label={texts.dialog.drag}\n className=\"yt-dialog__drag absolute-center-x bg-grey-light top-1.5 h-3 w-24 cursor-move rounded text-center\"\n />\n )}\n {dialog.showCloseButton ? (\n <DialogPrimitive.Close onClick={dialog.onClose} asChild>\n <IconButton\n appearance=\"discrete\"\n aria-label={texts.dialog.close}\n className=\"absolute top-0 right-0 mt-2 mr-2\"\n icon=\"close\"\n />\n </DialogPrimitive.Close>\n ) : null}\n </div>\n {dialog.elements.drawer}\n {dialog.elements.extra}\n </DialogPrimitive.Content>\n </Backdrop>\n </DialogPrimitive.Overlay>\n </DialogPrimitive.Portal>\n );\n});\n"],"names":["Title","React","DialogTitle","props","ref","className","cn","DialogPrimitive","Footer","DialogFooter","children","Close","DialogClose","dialog","useCurrentDialog","onClick","onClose","asChild","RenderPropWrapper","renderProps","close","CustomEvent","Content","DialogContent","internalRef","useProxiedRef","position","handleProps","dragHandleProps","useDraggable","texts","useLocalization","getDialogPositionClassnames","getDialogSizeClassnames","size","containerClassName","elements","extra","handleEscapeKeyDown","event","closeOnEscape","preventDefault","handleInteractOutside","output","drawer","Backdrop","onEscapeKeyDown","onInteractOutside","style","left","draggable","x","undefined","top","y","drag","showCloseButton","IconButton","appearance","icon"],"mappings":"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"}
|
|
@@ -12,7 +12,8 @@ const getDialogSizeClassnames = size => {
|
|
|
12
12
|
return 'w-lg';
|
|
13
13
|
}
|
|
14
14
|
};
|
|
15
|
-
const getDialogPositionClassnames = () => '
|
|
15
|
+
const getDialogPositionClassnames = () => 'mt-16 mx-auto';
|
|
16
|
+
const getDialogStylingClassnames = () => 'bg-white rounded animate-[fade-in_150ms] shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]';
|
|
16
17
|
|
|
17
|
-
export { getDialogPositionClassnames, getDialogSizeClassnames };
|
|
18
|
+
export { getDialogPositionClassnames, getDialogSizeClassnames, getDialogStylingClassnames };
|
|
18
19
|
//# sourceMappingURL=util.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"util.js","sources":["../../../../../../../src/components/Dialog/util.ts"],"sourcesContent":["import { DialogSize } from './types';\n\nexport const getDialogSizeClassnames = (size: DialogSize) => {\n switch (size) {\n case 'dialog':\n return 'w-128';\n case 'xs':\n return 'w-xs';\n case 'sm':\n return 'w-sm';\n case 'md':\n return 'w-md';\n case 'lg':\n return 'w-lg';\n }\n};\n\nexport const getDialogPositionClassnames = () => '
|
|
1
|
+
{"version":3,"file":"util.js","sources":["../../../../../../../src/components/Dialog/util.ts"],"sourcesContent":["import { DialogSize } from './types';\n\nexport const getDialogSizeClassnames = (size: DialogSize) => {\n switch (size) {\n case 'dialog':\n return 'w-128';\n case 'xs':\n return 'w-xs';\n case 'sm':\n return 'w-sm';\n case 'md':\n return 'w-md';\n case 'lg':\n return 'w-lg';\n }\n};\n\nexport const getDialogPositionClassnames = () => 'mt-16 mx-auto';\n\nexport const getDialogStylingClassnames = () =>\n 'bg-white rounded animate-[fade-in_150ms] shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]';\n"],"names":["getDialogSizeClassnames","size","getDialogPositionClassnames","getDialogStylingClassnames"],"mappings":"MAEaA,uBAAuB,GAAIC,IAAgB;EACpD,QAAQA,IAAI;IACR,KAAK,QAAQ;MACT,OAAO,OAAO;IAClB,KAAK,IAAI;MACL,OAAO,MAAM;IACjB,KAAK,IAAI;MACL,OAAO,MAAM;IACjB,KAAK,IAAI;MACL,OAAO,MAAM;IACjB,KAAK,IAAI;MACL,OAAO,MAAM;;AAEzB;MAEaC,2BAA2B,GAAG,MAAM;MAEpCC,0BAA0B,GAAG,MACtC;;;;"}
|
|
@@ -116,7 +116,8 @@ const getDialogSizeClassnames = size => {
|
|
|
116
116
|
return 'w-lg';
|
|
117
117
|
}
|
|
118
118
|
};
|
|
119
|
-
const getDialogPositionClassnames = () => '
|
|
119
|
+
const getDialogPositionClassnames = () => 'mt-16 mx-auto';
|
|
120
|
+
const getDialogStylingClassnames = () => 'bg-white rounded animate-[fade-in_150ms] shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]';
|
|
120
121
|
|
|
121
122
|
const Title = /*#__PURE__*/React.forwardRef(function AlertDialogTitle(props, ref) {
|
|
122
123
|
const className = cn('text-center', props.className);
|
|
@@ -126,7 +127,7 @@ const Title = /*#__PURE__*/React.forwardRef(function AlertDialogTitle(props, ref
|
|
|
126
127
|
}));
|
|
127
128
|
});
|
|
128
129
|
const Content = /*#__PURE__*/React.forwardRef(function AlertDialogContent(props, ref) {
|
|
129
|
-
const className = cn('
|
|
130
|
+
const className = cn('p-6', getDialogPositionClassnames(), getDialogStylingClassnames(), getDialogSizeClassnames('dialog'));
|
|
130
131
|
return /*#__PURE__*/React.createElement(AlertDialogPrimitive.Portal, null, /*#__PURE__*/React.createElement(AlertDialogPrimitive.Overlay, {
|
|
131
132
|
asChild: true
|
|
132
133
|
}, /*#__PURE__*/React.createElement(Backdrop, null, /*#__PURE__*/React.createElement(AlertDialogPrimitive.Content, Object.assign({}, props, {
|
|
@@ -5423,7 +5424,7 @@ const Content$4 = /*#__PURE__*/React.forwardRef(function DialogContent(props, re
|
|
|
5423
5424
|
const {
|
|
5424
5425
|
texts
|
|
5425
5426
|
} = useLocalization();
|
|
5426
|
-
const className = cn('bg-white
|
|
5427
|
+
const className = cn('relative bg-white animate-[fade-in_150ms]', getDialogPositionClassnames(), getDialogSizeClassnames(dialog.size));
|
|
5427
5428
|
const containerClassName = cn('bg-white p-6 rounded relative z-10', 'shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]', {
|
|
5428
5429
|
'rounded-b-none': !!dialog.elements.extra
|
|
5429
5430
|
}, props.className);
|
|
@@ -5454,7 +5455,7 @@ const Content$4 = /*#__PURE__*/React.forwardRef(function DialogContent(props, re
|
|
|
5454
5455
|
className: className,
|
|
5455
5456
|
onEscapeKeyDown: handleEscapeKeyDown,
|
|
5456
5457
|
onInteractOutside: handleInteractOutside,
|
|
5457
|
-
ref:
|
|
5458
|
+
ref: internalRef,
|
|
5458
5459
|
style: {
|
|
5459
5460
|
...props.style,
|
|
5460
5461
|
left: dialog.draggable ? `${position.x}px` : undefined,
|