@economic/taco 2.49.4 → 2.49.5

Sign up to get free protection for your applications and to get access to all the features.
@@ -166,9 +166,12 @@
166
166
  @apply invisible;
167
167
  }
168
168
 
169
- /* When the dialog is open, all elements are aria-hidden except for the dialog content */
169
+ /*
170
+ * While the dialog is open, all elements are aria-hidden except for the dialog content. This ensures that the
171
+ * print document contains only the dialog content.
172
+ */
170
173
  [aria-hidden='true'] {
171
- @apply print:hidden;
174
+ @apply print:!hidden;
172
175
  }
173
176
 
174
177
  .wcag-transparent {
@@ -57,8 +57,10 @@ const Content = /*#__PURE__*/forwardRef(function DialogContent(props, ref) {
57
57
  const {
58
58
  texts
59
59
  } = useLocalization();
60
- const className = cn('relative bg-white animate-[fade-in_150ms] rounded', getDialogPositionClassnames(), getDialogSizeClassnames(dialog.size), 'print:w-full print:h-max print:m-0 print:overflow-visible');
61
- const containerClassName = cn('bg-white p-6 rounded relative z-10 shadow print:p-0', 'print:overflow-visible print:h-max print:!transform-none print:!static print:!inset-0 print:!m-0', {
60
+ const className = cn('relative bg-white animate-[fade-in_150ms] rounded print:!static', getDialogPositionClassnames(), getDialogSizeClassnames(dialog.size), 'print:w-full print:h-max print:m-0 print:overflow-visible');
61
+ const containerClassName = cn('bg-white p-6 rounded relative z-10 shadow print:p-0',
62
+ // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.
63
+ 'print:overflow-visible print:h-max print:!transform-none print:!inset-0 print:!m-0', {
62
64
  'rounded-b-none': !!dialog.elements.extra
63
65
  }, props.className);
64
66
  const handleEscapeKeyDown = event => {
@@ -1 +1 @@
1
- {"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { DialogContext, useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Localization';\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 onOpenAutoFocus?: DialogPrimitive.DialogContentProps['onOpenAutoFocus'];\n onCloseAutoFocus?: DialogPrimitive.DialogContentProps['onCloseAutoFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(props: DialogContentProps, ref: React.Ref<HTMLDivElement>) {\n const dialog = useCurrentDialog();\n const internalRef = useMergedRef<HTMLDivElement>(ref);\n const { position, dragging, handleProps: dragHandleProps } = useDraggable(internalRef);\n const { texts } = useLocalization();\n\n const className = cn(\n 'relative bg-white animate-[fade-in_150ms] rounded',\n getDialogPositionClassnames(),\n getDialogSizeClassnames(dialog.size),\n 'print:w-full print:h-max print:m-0 print:overflow-visible'\n );\n\n const containerClassName = cn(\n 'bg-white p-6 rounded relative z-10 shadow print:p-0',\n 'print:overflow-visible print:h-max print:!transform-none print:!static print:!inset-0 print:!m-0',\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 <Close>\n <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n </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 role=\"button\"\n draggable\n aria-grabbed={dragging}\n aria-label={texts.dialog.drag}\n className=\"yt-dialog__drag absolute-center-x bg-grey-100 top-1.5 h-3 w-24 cursor-move rounded text-center print:hidden\"\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 right-0 top-0 mr-2 mt-2 print:hidden\"\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","useMergedRef","position","dragging","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","role","drag","showCloseButton","IconButton","appearance","icon"],"mappings":"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"}
1
+ {"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { DialogContext, useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Localization';\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 onOpenAutoFocus?: DialogPrimitive.DialogContentProps['onOpenAutoFocus'];\n onCloseAutoFocus?: DialogPrimitive.DialogContentProps['onCloseAutoFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(props: DialogContentProps, ref: React.Ref<HTMLDivElement>) {\n const dialog = useCurrentDialog();\n const internalRef = useMergedRef<HTMLDivElement>(ref);\n const { position, dragging, handleProps: dragHandleProps } = useDraggable(internalRef);\n const { texts } = useLocalization();\n\n const className = cn(\n 'relative bg-white animate-[fade-in_150ms] rounded print:!static',\n getDialogPositionClassnames(),\n getDialogSizeClassnames(dialog.size),\n 'print:w-full print:h-max print:m-0 print:overflow-visible'\n );\n\n const containerClassName = cn(\n 'bg-white p-6 rounded relative z-10 shadow print:p-0',\n // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.\n 'print:overflow-visible print:h-max print:!transform-none print:!inset-0 print:!m-0',\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 <Close>\n <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n </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 role=\"button\"\n draggable\n aria-grabbed={dragging}\n aria-label={texts.dialog.drag}\n className=\"yt-dialog__drag absolute-center-x bg-grey-100 top-1.5 h-3 w-24 cursor-move rounded text-center print:hidden\"\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 right-0 top-0 mr-2 mt-2 print:hidden\"\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","useMergedRef","position","dragging","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","role","drag","showCloseButton","IconButton","appearance","icon"],"mappings":"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"}
package/dist/index.css CHANGED
@@ -166,9 +166,12 @@
166
166
  @apply invisible;
167
167
  }
168
168
 
169
- /* When the dialog is open, all elements are aria-hidden except for the dialog content */
169
+ /*
170
+ * While the dialog is open, all elements are aria-hidden except for the dialog content. This ensures that the
171
+ * print document contains only the dialog content.
172
+ */
170
173
  [aria-hidden='true'] {
171
- @apply print:hidden;
174
+ @apply print:!hidden;
172
175
  }
173
176
 
174
177
  .wcag-transparent {
@@ -6800,8 +6800,10 @@ const Content$4 = /*#__PURE__*/React.forwardRef(function DialogContent(props, re
6800
6800
  const {
6801
6801
  texts
6802
6802
  } = useLocalization();
6803
- const className = cn('relative bg-white animate-[fade-in_150ms] rounded', getDialogPositionClassnames(), getDialogSizeClassnames(dialog.size), 'print:w-full print:h-max print:m-0 print:overflow-visible');
6804
- const containerClassName = cn('bg-white p-6 rounded relative z-10 shadow print:p-0', 'print:overflow-visible print:h-max print:!transform-none print:!static print:!inset-0 print:!m-0', {
6803
+ const className = cn('relative bg-white animate-[fade-in_150ms] rounded print:!static', getDialogPositionClassnames(), getDialogSizeClassnames(dialog.size), 'print:w-full print:h-max print:m-0 print:overflow-visible');
6804
+ const containerClassName = cn('bg-white p-6 rounded relative z-10 shadow print:p-0',
6805
+ // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.
6806
+ 'print:overflow-visible print:h-max print:!transform-none print:!inset-0 print:!m-0', {
6805
6807
  'rounded-b-none': !!dialog.elements.extra
6806
6808
  }, props.className);
6807
6809
  const handleEscapeKeyDown = event => {