@cube-dev/ui-kit 0.0.0-canary-9bde021 → 0.0.0-canary-22ee7cb

package/dist/components/overlays/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","names":["createFocusManager","useObjectRef","BASE_STYLES","BaseProps","BaseStyleProps","BLOCK_STYLES","BlockStyleProps","DIMENSION_STYLES","DimensionStyleProps","FLOW_STYLES","Styles","tasty","forwardRef","ReactElement","Ref","useEffect","useMemo","AriaDialogProps","DismissButton","FocusScope","useDialog","useI18n","CloseIcon","mergeProps","SlotProvider","extractStyles","ItemButton","useOpenTransitionContext","useDialogContext","STYLES_LIST","DialogElement","as","styles","display","flow","fill","pointerEvents","outline","position","width","height","gap","border","radius","shadow","top","CloseButton","qa","type","right","sizeMap","S","M","L","sizePxMap","small","medium","large","CubeDialogProps","Omit","size","isDismissable","onDismiss","arg","closeIcon","closeButtonStyles","role","Dialog","props","ref","$","_c","transitionContext","isEntered","transitionState","context","t0","content","shouldContainFocus","isOpen","t1","shouldRestoreFocus","t2","DialogContent","HTMLDivElement","contextProps","children","onClose","style","otherProps","toUpperCase","t","domRef","dialogProps","titleProps","dismissButton","setTimeout","current","activeElement","document","isFocusOutsideDialog","contains","isFocusOnDialogShell","priorityElement","querySelector","HTMLElement","focus","focusManager","focusFirst","tabbable","slots","title","level","preset","flexGrow","padding","header","ellipsis","placeItems","placeContent","footer","buttonGroup","dismissable"],"sources":["../../../../src/components/overlays/Dialog/Dialog.tsx"],"sourcesContent":["import { createFocusManager } from '@react-aria/focus';\nimport { useObjectRef } from '@react-aria/utils';\nimport {\n  BASE_STYLES,\n  BaseProps,\n  BaseStyleProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  DIMENSION_STYLES,\n  DimensionStyleProps,\n  FLOW_STYLES,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, ReactElement, Ref, useEffect, useMemo } from 'react';\nimport {\n  AriaDialogProps,\n  DismissButton,\n  FocusScope,\n  useDialog,\n} from 'react-aria';\n\nimport { useI18n } from '../../../i18n';\nimport { CloseIcon } from '../../../icons/CloseIcon';\nimport { mergeProps, SlotProvider } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { ItemButton } from '../../actions/ItemButton/ItemButton';\nimport { useOpenTransitionContext } from '../Modal/OpenTransitionContext';\n\nimport { useDialogContext } from './context';\n\nconst STYLES_LIST = [\n  ...BASE_STYLES,\n  ...DIMENSION_STYLES,\n  ...BLOCK_STYLES,\n  ...FLOW_STYLES,\n];\n\nconst DialogElement = tasty({\n  as: 'section',\n  styles: {\n    display: 'flex',\n    flow: 'column',\n    fill: '#surface',\n    pointerEvents: 'auto',\n    outline: 0,\n    position: {\n      '': 'relative',\n      'type=panel': 'absolute',\n    },\n    width: {\n      '': '$min-dialog-size $dialog-size (100dvw - 8x)',\n      'type=fullscreen': '(100dvw - 8x) (100dvw - 8x)',\n      'type=fullscreenTakeover': '100dvw 100dvw',\n      'type=panel': 'auto',\n    },\n    height: {\n      '': 'auto (100dvh - 8x)',\n      'type=fullscreen': '(100dvh - 8x) (100dvh - 8x)',\n      'type=fullscreenTakeover | type=panel': '100dvh 100dvh',\n      'type=popover': 'initial initial (50dvh - 5x)',\n    },\n    gap: 0,\n    border: {\n      '': false,\n      'type=popover': true,\n    },\n    radius: {\n      '': '1cr',\n      'type=tray': '1cr top',\n      'type=fullscreenTakeover': '0r',\n    },\n    shadow: {\n      '': '$dialog-shadow',\n      'type=popover | type=panel': '$shadow',\n    },\n    top: {\n      '': false,\n      'type=modal': '((50vh - 50%) / -3)',\n      'type=panel': 'auto',\n    },\n    '$dialog-title-padding-v': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n    '$dialog-content-padding-v': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n    '$dialog-padding-h': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n    '$dialog-footer-v': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n    '$dialog-content-gap': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n  },\n});\n\nconst CloseButton = tasty(ItemButton, {\n  qa: 'ModalCloseButton',\n  type: 'clear',\n  styles: {\n    position: 'absolute',\n    top: '1x',\n    right: '1x',\n  },\n});\n\nconst sizeMap = {\n  S: 'small',\n  M: 'medium',\n  L: 'large',\n};\nconst sizePxMap = {\n  small: 360,\n  medium: 479,\n  large: 798,\n};\n\nexport interface CubeDialogProps\n  extends Omit<BaseProps, 'role'>,\n    AriaDialogProps,\n    BaseStyleProps,\n    BlockStyleProps,\n    DimensionStyleProps {\n  /** The size of the dialog */\n  size?: 'S' | 'M' | 'L' | 'small' | 'medium' | 'large';\n  /** Whether the dialog is dismissable */\n  isDismissable?: boolean;\n  /** Trigger when the dialog is dismissed */\n  onDismiss?: (arg?: any) => void;\n  /** That you can replace the close icon with */\n  closeIcon?: ReactElement;\n  closeButtonStyles?: Styles;\n  role?: 'dialog' | 'alertdialog';\n}\n\n/**\n * Dialogs are windows containing contextual information, tasks, or workflows that appear over the user interface.\n * Depending on the kind of Dialog, further interactions may be blocked until the Dialog is acknowledged.\n */\nexport const Dialog = forwardRef(function Dialog(\n  props: CubeDialogProps,\n  ref: Ref<HTMLDivElement>,\n) {\n  const transitionContext = useOpenTransitionContext();\n\n  const isEntered = transitionContext?.transitionState === 'entered';\n\n  const context = useDialogContext();\n\n  const content = useMemo(() => {\n    return <DialogContent key=\"content\" {...props} ref={ref} />;\n  }, [props, ref]);\n\n  const shouldContainFocus =\n    isEntered && !!context.isOpen && context.type !== 'panel';\n\n  return (\n    // This component traps the focus inside the dialog and restores it on\n    // close. The restore is the one that matters for popover-type dialogs —\n    // `DialogTrigger`'s own restore is a no-op there — so `shouldRestoreFocus`\n    // has to reach it. Containment is unaffected either way.\n    <FocusScope\n      restoreFocus={context.shouldRestoreFocus ?? true}\n      contain={shouldContainFocus}\n    >\n      {content}\n    </FocusScope>\n  );\n});\n\nconst DialogContent = forwardRef(function DialogContent(\n  props: CubeDialogProps,\n  ref: Ref<HTMLDivElement>,\n) {\n  let { type = 'modal', ...contextProps } = useDialogContext();\n\n  let {\n    qa,\n    children,\n    size = 'M',\n    isDismissable = contextProps.isDismissable,\n    onDismiss = contextProps.onClose,\n    closeIcon,\n    closeButtonStyles,\n    style,\n    ...otherProps\n  } = props;\n\n  size = sizeMap[size.toUpperCase()] || size;\n\n  const styles: Styles = extractStyles(otherProps, STYLES_LIST);\n\n  const { t } = useI18n();\n\n  let domRef = useObjectRef(ref);\n  let { dialogProps, titleProps } = useDialog(\n    mergeProps(contextProps, props),\n    domRef,\n  );\n\n  // If rendered in a popover or tray there won't be a visible dismiss button,\n  // so we render a hidden one for screen readers.\n  let dismissButton;\n  if (type === 'popover' || type === 'tray') {\n    dismissButton = <DismissButton onDismiss={onDismiss} />;\n  }\n\n  // Focus the first focusable element in the dialog when it opens.\n  //\n  // We also re-run the priority focus logic when the dialog <section>\n  // itself is the active element. This recovers from a race that occurs\n  // when a popover-based component (FilterPicker, Picker, Select, …) opens\n  // inside another contained Dialog: React's native `autoFocus` on the\n  // inner control fires during the mutation phase, before the popover's\n  // FocusScope registers in react-aria's focus-scope tree, so the outer\n  // FocusScope yanks focus back. useDialog then defaults focus to the\n  // dialog <section>; without re-promoting it here, the priority element\n  // (e.g. the search input) is never focused.\n  useEffect(() => {\n    if (contextProps.isOpen) {\n      setTimeout(() => {\n        if (!domRef.current) return;\n\n        const activeElement = document.activeElement;\n        const isFocusOutsideDialog = !domRef.current.contains(activeElement);\n        const isFocusOnDialogShell = activeElement === domRef.current;\n\n        // Priority 1: autofocus input or primary button\n        const priorityElement = domRef.current.querySelector(\n          'input[data-autofocus], button[type=\"submit\"], button[data-type=\"primary\"]',\n        ) as HTMLElement | null;\n\n        if (priorityElement && (isFocusOutsideDialog || isFocusOnDialogShell)) {\n          priorityElement.focus();\n          return;\n        }\n\n        if (isFocusOutsideDialog) {\n          // Fallback: focus first tabbable element, or dialog itself\n          const focusManager = createFocusManager(domRef);\n\n          if (!focusManager.focusFirst({ tabbable: true })) {\n            domRef.current.focus();\n          }\n        }\n      });\n    }\n  }, [contextProps.isOpen]);\n\n  // let hasHeader = useHasChild('[data-id=\"Header\"]', domRef);\n  // let hasFooter = useHasChild('[data-id=\"Footer\"]', domRef);\n\n  let slots = {\n    title: {\n      level: 2,\n      preset: 'h4',\n      ...titleProps,\n    },\n    content: {\n      styles: {\n        flexGrow: 1,\n        padding: '$dialog-content-padding-v $dialog-padding-h',\n        gap: '$dialog-content-gap',\n        height: {\n          '': 'max (100% - (2 * $dialog-content-padding-v))',\n          ':last-child': 'max (100% - $dialog-content-padding-v)',\n        },\n      },\n    },\n    header: {\n      ellipsis: true,\n      styles: {\n        display: 'flex',\n        flow: 'row',\n        gap: '1x',\n        placeItems: 'center stretch',\n        placeContent: 'space-between',\n        padding: `$dialog-title-padding-v ${\n          isDismissable ? '($dialog-padding-h + 4x)' : '$dialog-padding-h'\n        } $dialog-title-padding-v $dialog-padding-h`,\n        border: 'bottom',\n      },\n    },\n    footer: {\n      styles: {\n        display: 'flex',\n        gap: '1x',\n        flow: 'row-reverse',\n        placeItems: 'baseline stretch',\n        placeContent: 'space-between',\n        padding: '$dialog-footer-v $dialog-padding-h',\n      },\n    },\n    buttonGroup: {\n      styles: {\n        flow: 'row-reverse',\n      },\n    },\n  };\n\n  return (\n    <DialogElement\n      ref={domRef}\n      data-id=\"Dialog\"\n      data-qa={qa || 'Dialog'}\n      styles={styles}\n      as=\"section\"\n      {...dialogProps}\n      mods={{ dismissable: isDismissable }}\n      style={{\n        '--dialog-size': `${sizePxMap[size] || sizePxMap.small}px`,\n        ...style,\n      }}\n      data-type={type}\n      data-size={size}\n    >\n      {dismissButton}\n\n      <SlotProvider slots={slots}>\n        {isDismissable && (\n          <CloseButton\n            icon={closeIcon || <CloseIcon size={20} />}\n            label={t('dialog.dismiss', 'Dismiss')}\n            onPress={() => onDismiss && onDismiss()}\n          />\n        )}\n        {children}\n      </SlotProvider>\n    </DialogElement>\n  );\n});\n"],"mappings":"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"}
+{"version":3,"file":"Dialog.js","names":["createFocusManager","useObjectRef","BASE_STYLES","BaseProps","BaseStyleProps","BLOCK_STYLES","BlockStyleProps","DIMENSION_STYLES","DimensionStyleProps","FLOW_STYLES","Styles","tasty","forwardRef","ReactElement","Ref","useEffect","useMemo","AriaDialogProps","DismissButton","FocusScope","useDialog","useI18n","CloseIcon","mergeProps","SlotProvider","extractStyles","ItemButton","useOpenTransitionContext","useDialogContext","useContentOverflow","STYLES_LIST","DialogElement","as","styles","display","flow","fill","pointerEvents","outline","position","width","height","gap","border","radius","shadow","top","CloseButton","qa","type","right","sizeMap","S","M","L","sizePxMap","small","medium","large","CubeDialogProps","Omit","size","isDismissable","onDismiss","arg","closeIcon","closeButtonStyles","role","Dialog","props","ref","$","_c","transitionContext","isEntered","transitionState","context","t0","content","shouldContainFocus","isOpen","t1","shouldRestoreFocus","t2","DialogContent","HTMLDivElement","contextProps","children","onClose","style","otherProps","toUpperCase","t","domRef","dialogProps","titleProps","dismissButton","setTimeout","current","activeElement","document","isFocusOutsideDialog","contains","isFocusOnDialogShell","priorityElement","querySelector","HTMLElement","focus","focusManager","focusFirst","tabbable","contentOverflows","slots","title","level","preset","flexGrow","padding","header","ellipsis","placeItems","placeContent","footer","mods","buttonGroup","dismissable"],"sources":["../../../../src/components/overlays/Dialog/Dialog.tsx"],"sourcesContent":["import { createFocusManager } from '@react-aria/focus';\nimport { useObjectRef } from '@react-aria/utils';\nimport {\n  BASE_STYLES,\n  BaseProps,\n  BaseStyleProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  DIMENSION_STYLES,\n  DimensionStyleProps,\n  FLOW_STYLES,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, ReactElement, Ref, useEffect, useMemo } from 'react';\nimport {\n  AriaDialogProps,\n  DismissButton,\n  FocusScope,\n  useDialog,\n} from 'react-aria';\n\nimport { useI18n } from '../../../i18n';\nimport { CloseIcon } from '../../../icons/CloseIcon';\nimport { mergeProps, SlotProvider } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { ItemButton } from '../../actions/ItemButton/ItemButton';\nimport { useOpenTransitionContext } from '../Modal/OpenTransitionContext';\n\nimport { useDialogContext } from './context';\nimport { useContentOverflow } from './use-content-overflow';\n\nconst STYLES_LIST = [\n  ...BASE_STYLES,\n  ...DIMENSION_STYLES,\n  ...BLOCK_STYLES,\n  ...FLOW_STYLES,\n];\n\nconst DialogElement = tasty({\n  as: 'section',\n  styles: {\n    display: 'flex',\n    flow: 'column',\n    fill: '#surface',\n    pointerEvents: 'auto',\n    outline: 0,\n    position: {\n      '': 'relative',\n      'type=panel': 'absolute',\n    },\n    width: {\n      '': '$min-dialog-size $dialog-size (100dvw - 8x)',\n      'type=fullscreen': '(100dvw - 8x) (100dvw - 8x)',\n      'type=fullscreenTakeover': '100dvw 100dvw',\n      'type=panel': 'auto',\n    },\n    height: {\n      '': 'auto (100dvh - 8x)',\n      'type=fullscreen': '(100dvh - 8x) (100dvh - 8x)',\n      'type=fullscreenTakeover | type=panel': '100dvh 100dvh',\n      'type=popover': 'initial initial (50dvh - 5x)',\n    },\n    gap: 0,\n    border: {\n      '': false,\n      'type=popover': true,\n    },\n    radius: {\n      '': '1cr',\n      'type=tray': '1cr top',\n      'type=fullscreenTakeover': '0r',\n    },\n    shadow: {\n      '': '$dialog-shadow',\n      'type=popover | type=panel': '$shadow',\n    },\n    top: {\n      '': false,\n      'type=modal': '((50vh - 50%) / -3)',\n      'type=panel': 'auto',\n    },\n    '$dialog-title-padding-v': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n    '$dialog-content-padding-v': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n    '$dialog-padding-h': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n    '$dialog-footer-v': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n    '$dialog-content-gap': {\n      '': '1.5x',\n      'type=popover': '1x',\n    },\n\n    // A `Form` placed directly here (`Dialog > Form > Content + Footer`) lays\n    // itself out as this flex column — see `FormElement`. It is the form's own\n    // state rather than a rule here, so the form's `styles` still win.\n  },\n});\n\nconst CloseButton = tasty(ItemButton, {\n  qa: 'ModalCloseButton',\n  type: 'clear',\n  styles: {\n    position: 'absolute',\n    top: '1x',\n    right: '1x',\n  },\n});\n\nconst sizeMap = {\n  S: 'small',\n  M: 'medium',\n  L: 'large',\n};\nconst sizePxMap = {\n  small: 360,\n  medium: 479,\n  large: 798,\n};\n\nexport interface CubeDialogProps\n  extends Omit<BaseProps, 'role'>,\n    AriaDialogProps,\n    BaseStyleProps,\n    BlockStyleProps,\n    DimensionStyleProps {\n  /** The size of the dialog */\n  size?: 'S' | 'M' | 'L' | 'small' | 'medium' | 'large';\n  /** Whether the dialog is dismissable */\n  isDismissable?: boolean;\n  /** Trigger when the dialog is dismissed */\n  onDismiss?: (arg?: any) => void;\n  /** That you can replace the close icon with */\n  closeIcon?: ReactElement;\n  closeButtonStyles?: Styles;\n  role?: 'dialog' | 'alertdialog';\n}\n\n/**\n * Dialogs are windows containing contextual information, tasks, or workflows that appear over the user interface.\n * Depending on the kind of Dialog, further interactions may be blocked until the Dialog is acknowledged.\n */\nexport const Dialog = forwardRef(function Dialog(\n  props: CubeDialogProps,\n  ref: Ref<HTMLDivElement>,\n) {\n  const transitionContext = useOpenTransitionContext();\n\n  const isEntered = transitionContext?.transitionState === 'entered';\n\n  const context = useDialogContext();\n\n  const content = useMemo(() => {\n    return <DialogContent key=\"content\" {...props} ref={ref} />;\n  }, [props, ref]);\n\n  const shouldContainFocus =\n    isEntered && !!context.isOpen && context.type !== 'panel';\n\n  return (\n    // This component traps the focus inside the dialog and restores it on\n    // close. The restore is the one that matters for popover-type dialogs —\n    // `DialogTrigger`'s own restore is a no-op there — so `shouldRestoreFocus`\n    // has to reach it. Containment is unaffected either way.\n    <FocusScope\n      restoreFocus={context.shouldRestoreFocus ?? true}\n      contain={shouldContainFocus}\n    >\n      {content}\n    </FocusScope>\n  );\n});\n\nconst DialogContent = forwardRef(function DialogContent(\n  props: CubeDialogProps,\n  ref: Ref<HTMLDivElement>,\n) {\n  let { type = 'modal', ...contextProps } = useDialogContext();\n\n  let {\n    qa,\n    children,\n    size = 'M',\n    isDismissable = contextProps.isDismissable,\n    onDismiss = contextProps.onClose,\n    closeIcon,\n    closeButtonStyles,\n    style,\n    ...otherProps\n  } = props;\n\n  size = sizeMap[size.toUpperCase()] || size;\n\n  const styles: Styles = extractStyles(otherProps, STYLES_LIST);\n\n  const { t } = useI18n();\n\n  let domRef = useObjectRef(ref);\n  let { dialogProps, titleProps } = useDialog(\n    mergeProps(contextProps, props),\n    domRef,\n  );\n\n  // If rendered in a popover or tray there won't be a visible dismiss button,\n  // so we render a hidden one for screen readers.\n  let dismissButton;\n  if (type === 'popover' || type === 'tray') {\n    dismissButton = <DismissButton onDismiss={onDismiss} />;\n  }\n\n  // Focus the first focusable element in the dialog when it opens.\n  //\n  // We also re-run the priority focus logic when the dialog <section>\n  // itself is the active element. This recovers from a race that occurs\n  // when a popover-based component (FilterPicker, Picker, Select, …) opens\n  // inside another contained Dialog: React's native `autoFocus` on the\n  // inner control fires during the mutation phase, before the popover's\n  // FocusScope registers in react-aria's focus-scope tree, so the outer\n  // FocusScope yanks focus back. useDialog then defaults focus to the\n  // dialog <section>; without re-promoting it here, the priority element\n  // (e.g. the search input) is never focused.\n  useEffect(() => {\n    if (contextProps.isOpen) {\n      setTimeout(() => {\n        if (!domRef.current) return;\n\n        const activeElement = document.activeElement;\n        const isFocusOutsideDialog = !domRef.current.contains(activeElement);\n        const isFocusOnDialogShell = activeElement === domRef.current;\n\n        // Priority 1: autofocus input or primary button\n        const priorityElement = domRef.current.querySelector(\n          'input[data-autofocus], button[type=\"submit\"], button[data-type=\"primary\"]',\n        ) as HTMLElement | null;\n\n        if (priorityElement && (isFocusOutsideDialog || isFocusOnDialogShell)) {\n          priorityElement.focus();\n          return;\n        }\n\n        if (isFocusOutsideDialog) {\n          // Fallback: focus first tabbable element, or dialog itself\n          const focusManager = createFocusManager(domRef);\n\n          if (!focusManager.focusFirst({ tabbable: true })) {\n            domRef.current.focus();\n          }\n        }\n      });\n    }\n  }, [contextProps.isOpen]);\n\n  // let hasHeader = useHasChild('[data-id=\"Header\"]', domRef);\n  // let hasFooter = useHasChild('[data-id=\"Footer\"]', domRef);\n\n  const contentOverflows = useContentOverflow(domRef);\n\n  let slots = {\n    title: {\n      level: 2,\n      preset: 'h4',\n      ...titleProps,\n    },\n    content: {\n      styles: {\n        flexGrow: 1,\n        padding: '$dialog-content-padding-v $dialog-padding-h',\n        gap: '$dialog-content-gap',\n        height: {\n          '': 'max (100% - (2 * $dialog-content-padding-v))',\n          ':last-child': 'max (100% - $dialog-content-padding-v)',\n        },\n      },\n    },\n    header: {\n      ellipsis: true,\n      styles: {\n        display: 'flex',\n        flow: 'row',\n        gap: '1x',\n        placeItems: 'center stretch',\n        placeContent: 'space-between',\n        padding: `$dialog-title-padding-v ${\n          isDismissable ? '($dialog-padding-h + 4x)' : '$dialog-padding-h'\n        } $dialog-title-padding-v $dialog-padding-h`,\n        border: 'bottom',\n      },\n    },\n    footer: {\n      mods: { 'content-overflow': contentOverflows },\n      styles: {\n        display: 'flex',\n        gap: '1x',\n        flow: 'row-reverse',\n        placeItems: 'baseline stretch',\n        placeContent: 'space-between',\n        padding: '$dialog-footer-v $dialog-padding-h',\n        // A line only while the body scrolls: the footer then sits over\n        // content that carries on beneath it, and the line is what says so.\n        // Under a body that fits, the actions simply end it and a rule there\n        // reads as clutter.\n        border: {\n          '': false,\n          'content-overflow': 'top',\n        },\n      },\n    },\n    buttonGroup: {\n      styles: {\n        flow: 'row-reverse',\n      },\n    },\n  };\n\n  return (\n    <DialogElement\n      ref={domRef}\n      data-id=\"Dialog\"\n      data-qa={qa || 'Dialog'}\n      styles={styles}\n      as=\"section\"\n      {...dialogProps}\n      mods={{ dismissable: isDismissable }}\n      style={{\n        '--dialog-size': `${sizePxMap[size] || sizePxMap.small}px`,\n        ...style,\n      }}\n      data-type={type}\n      data-size={size}\n    >\n      {dismissButton}\n\n      <SlotProvider slots={slots}>\n        {isDismissable && (\n          <CloseButton\n            icon={closeIcon || <CloseIcon size={20} />}\n            label={t('dialog.dismiss', 'Dismiss')}\n            onPress={() => onDismiss && onDismiss()}\n          />\n        )}\n        {children}\n      </SlotProvider>\n    </DialogElement>\n  );\n});\n"],"mappings":"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"}

package/dist/components/overlays/Dialog/DialogContainer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { _Modal } from "../Modal/Modal.js";
 import { DialogContext } from "./context.js";
 import { Children, isValidElement, useRef } from "react";

package/dist/components/overlays/Dialog/DialogForm.js

@@ -1,10 +1,11 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { _Title } from "../../content/Title.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { Button } from "../../actions/Button/Button.js";
 import { ButtonGroup } from "../../actions/ButtonGroup/ButtonGroup.js";
 import { useDialogContext } from "./context.js";
 import { Content } from "../../content/Content.js";
+import { Footer } from "../../content/Footer.js";
 import { Header } from "../../content/Header.js";
 import { Dialog } from "./Dialog.js";
 import { isModernFormController } from "../../form/Form/backend.js";
@@ -47,7 +48,7 @@ function LegacyDialogForm(props) {
 		children: [/* @__PURE__ */ jsx(Header, { children: /* @__PURE__ */ jsx(_Title, {
 			ellipsis: true,
 			children: title
-		}) }), /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsxs(_Form, {
+		}) }), /* @__PURE__ */ jsxs(_Form, {
 			qa: qa || "DialogForm",
 			form,
 			name,
@@ -69,7 +70,7 @@ function LegacyDialogForm(props) {
 			},
 			onSubmitFailed,
 			onValuesChange,
-			children: [typeof children === "function" ? children(onLocalDismiss) : children, !noActions ? /* @__PURE__ */ jsxs(ButtonGroup, { children: [/* @__PURE__ */ jsx(_SubmitButton, {
+			children: [/* @__PURE__ */ jsx(Content, { children: typeof children === "function" ? children(onLocalDismiss) : children }), !noActions ? /* @__PURE__ */ jsx(Footer, { children: /* @__PURE__ */ jsxs(ButtonGroup, { children: [/* @__PURE__ */ jsx(_SubmitButton, {
 				qa: `${qa || ""}SubmitButton`,
 				theme: danger ? "danger" : void 0,
 				label: t("dialogForm.submit", "Submit"),
@@ -79,8 +80,8 @@ function LegacyDialogForm(props) {
 				label: t("dialogForm.cancel", "Cancel"),
 				onPress: onLocalDismiss,
 				...cancelProps || {}
-			})] }) : void 0]
-		}) })]
+			})] }) }) : void 0]
+		})]
 	});
 }
 

package/dist/components/overlays/Dialog/DialogForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogForm.js","names":["useI18n","Button","ButtonGroup","Content","Header","Title","isModernFormController","Form","SubmitButton","useForm","useDialogContext","CubeDialogProps","Dialog","ModernDialogForm","ReactElement","CubeButtonProps","CubeFormProps","ModernFormProps","CubeSubmitButtonProps","FieldTypes","CubeDialogFormProps","Omit","T","danger","submitProps","cancelProps","preserve","noActions","title","children","onLocalDismiss","CubeDialogFormRef","open","close","ModernDialogFormProps","DialogForm","props","$","_c","t0","form","LegacyDialogForm","qa","name","defaultValues","onDismiss","onSubmit","onSubmitFailed","onValuesChange","labelStyles","labelPosition","requiredMark","necessityIndicator","isReadOnly","isInvalid","isValid","validateTrigger","size","closeIcon","dialogProps","t","onClose","setTimeout","resetFields","data","undefined"],"sources":["../../../../src/components/overlays/Dialog/DialogForm.tsx"],"sourcesContent":["import { useI18n } from '../../../i18n';\nimport { Button } from '../../actions/Button/Button';\nimport { ButtonGroup } from '../../actions/ButtonGroup/ButtonGroup';\nimport { Content } from '../../content/Content';\nimport { Header } from '../../content/Header';\nimport { Title } from '../../content/Title';\nimport { isModernFormController } from '../../form/Form/backend';\nimport { Form } from '../../form/Form/Form';\nimport { SubmitButton } from '../../form/Form/SubmitButton/SubmitButton';\nimport { useForm } from '../../form/Form/use-form';\n\nimport { useDialogContext } from './context';\nimport { CubeDialogProps, Dialog } from './Dialog';\nimport { ModernDialogForm } from './ModernDialogForm';\n\nimport type { ReactElement } from 'react';\nimport type { CubeButtonProps } from '../../actions/Button/Button';\nimport type { CubeFormProps } from '../../form/Form/Form';\nimport type { ModernFormProps } from '../../form/Form/ModernFormRoot';\nimport type { CubeSubmitButtonProps } from '../../form/Form/SubmitButton/SubmitButton';\nimport type { FieldTypes } from '../../form/Form/types';\n\nexport interface CubeDialogFormProps<T extends FieldTypes = FieldTypes>\n  extends Omit<CubeDialogProps, 'children'>,\n    Omit<CubeFormProps<T>, 'role' | 'children'> {\n  /** Whether the submit button has a `danger` theme */\n  danger?: boolean;\n  /** Properties for submit button. Use `label` to change text. */\n  submitProps?: CubeButtonProps;\n  /** Properties for cancel button. Use `label` to change text. */\n  cancelProps?: CubeButtonProps;\n  /** Preserve form values after submission or dismissal. */\n  preserve?: boolean;\n  /** Whether to hide action button so developer can manually specify them */\n  noActions?: boolean;\n  /** The title of the dialog */\n  title?: string;\n  /** Children nodes or render function  */\n  children?:\n    | CubeFormProps['children']\n    | ((onLocalDismiss: () => void) => CubeFormProps['children']);\n}\n\nexport interface CubeDialogFormRef {\n  open: () => void;\n  close: () => void;\n}\n\n/**\n * DialogForms are a specific type of Dialog. They contain forms to fill.\n */\nexport interface ModernDialogFormProps<T extends FieldTypes = FieldTypes>\n  extends Omit<CubeDialogFormProps<T>, keyof CubeFormProps<T> | 'submitProps'>,\n    Omit<ModernFormProps<T>, 'role' | 'children'> {\n  children?: CubeDialogFormProps<T>['children'];\n  submitProps?: Omit<CubeSubmitButtonProps<T>, 'form'>;\n}\n\nexport function DialogForm<T extends FieldTypes = FieldTypes>(\n  props: CubeDialogFormProps<T>,\n): ReactElement;\nexport function DialogForm<T extends FieldTypes = FieldTypes>(\n  props: ModernDialogFormProps<T>,\n): ReactElement;\nexport function DialogForm<T extends FieldTypes = FieldTypes>(\n  props: CubeDialogFormProps<T> | ModernDialogFormProps<T>,\n): ReactElement {\n  return isModernFormController(props.form) ? (\n    <ModernDialogForm {...(props as ModernDialogFormProps<T>)} />\n  ) : (\n    <LegacyDialogForm {...(props as CubeDialogFormProps<T>)} />\n  );\n}\n\nfunction LegacyDialogForm<T extends FieldTypes>(props: CubeDialogFormProps<T>) {\n  'use no memo';\n  // Legacy form state is mutable; preserve its render-time reads until migration.\n\n  let {\n    qa,\n    name,\n    form,\n    defaultValues,\n    onDismiss,\n    onSubmit,\n    onSubmitFailed,\n    onValuesChange,\n    labelStyles,\n    labelPosition,\n    requiredMark,\n    necessityIndicator,\n    isReadOnly,\n    isInvalid,\n    isValid,\n    validateTrigger,\n    children,\n    danger,\n    noActions,\n    submitProps,\n    cancelProps,\n    preserve,\n    title,\n    size,\n    closeIcon,\n    ...dialogProps\n  } = props;\n\n  [form] = useForm(form);\n\n  const { t } = useI18n();\n  const { onClose } = useDialogContext();\n\n  function onLocalDismiss() {\n    onClose?.();\n    onDismiss?.();\n\n    if (!preserve) {\n      // let animations finish before resetting the form\n      setTimeout(() => {\n        form?.resetFields();\n      }, 250);\n    }\n  }\n\n  return (\n    <Dialog\n      qa={`${qa || ''}Dialog`}\n      size={size}\n      closeIcon={closeIcon}\n      {...dialogProps}\n    >\n      <Header>\n        <Title ellipsis>{title}</Title>\n      </Header>\n      <Content>\n        <Form<T>\n          qa={qa || 'DialogForm'}\n          form={form}\n          name={name}\n          defaultValues={defaultValues}\n          labelStyles={labelStyles}\n          labelPosition={labelPosition}\n          requiredMark={requiredMark}\n          necessityIndicator={necessityIndicator}\n          isReadOnly={isReadOnly}\n          isInvalid={isInvalid}\n          isValid={isValid}\n          validateTrigger={validateTrigger}\n          onSubmit={async (data) => {\n            await onSubmit?.(data);\n\n            onClose?.();\n\n            if (!preserve) {\n              // let animations finish before resetting the form\n              setTimeout(() => {\n                form.resetFields();\n              }, 250);\n            }\n          }}\n          onSubmitFailed={onSubmitFailed}\n          onValuesChange={onValuesChange}\n        >\n          {typeof children === 'function' ? children(onLocalDismiss) : children}\n\n          {!noActions ? (\n            <ButtonGroup>\n              <SubmitButton\n                qa={`${qa || ''}SubmitButton`}\n                theme={danger ? 'danger' : undefined}\n                label={t('dialogForm.submit', 'Submit')}\n                {...(submitProps || {})}\n              />\n              <Button\n                qa={`${qa || ''}CancelButton`}\n                label={t('dialogForm.cancel', 'Cancel')}\n                onPress={onLocalDismiss}\n                {...(cancelProps || {})}\n              />\n            </ButtonGroup>\n          ) : undefined}\n        </Form>\n      </Content>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAgEA,SAAOmC,WAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;AAAA,KAAAF,EAAA,OAAAD,OAAA;AAGEG,OAAAjC,uBAAuB8B,MAAKI,KAIlC,GAHC,oBAAC,oBAAgB,GAAMJ,QAGxB,GADC,oBAAC,oBAAgB,GAAMA,QACxB;AAAAC,IAAA,KAAAD;AAAAC,IAAA,KAAAE;OAAAA,MAAAF,EAAA;AAAA,QAJME;;AAOT,SAASE,iBAAuCL,OAA+B;AAC7E;CAGA,IAAI,EACFM,IACAC,MACAH,MACAI,eACAC,WACAC,UACAC,gBACAC,gBACAC,aACAC,eACAC,cACAC,oBACAC,YACAC,WACAC,SACAC,iBACA3B,UACAN,QACAI,WACAH,aACAC,aACAC,UACAE,OACA6B,MACAC,WACA,GAAGC,gBACDvB;AAEJ,EAACI,QAAQ/B,QAAQ+B,KAAK;CAEtB,MAAM,EAAEoB,MAAM5D,SAAS;CACvB,MAAM,EAAE6D,YAAYnD,kBAAkB;CAEtC,SAASoB,iBAAiB;AACxB+B,aAAW;AACXhB,eAAa;AAEb,MAAI,CAACnB,SAEHoC,kBAAiB;AACftB,SAAMuB,aAAa;KAClB,IAAI;;AAIX,QACE,qBAAC;EACC,IAAI,GAAGrB,MAAM,GAAE;EACTe;EACKC;EACX,GAAIC;aAEJ,oBAAC,oBACC,oBAAC;GAAM;aAAU/B;IAAa,GACxB,EACR,oBAAC,qBACC,qBAAC;GACC,IAAIc,MAAM;GACJF;GACAG;GACSC;GACFK;GACEC;GACDC;GACMC;GACRC;GACDC;GACFC;GACQC;GACjB,UAAU,OAAOQ,SAAS;AACxB,UAAMlB,WAAWkB,KAAK;AAEtBH,eAAW;AAEX,QAAI,CAACnC,SAEHoC,kBAAiB;AACftB,UAAKuB,aAAa;OACjB,IAAI;;GAGKhB;GACAC;cAEf,OAAOnB,aAAa,aAAaA,SAASC,eAAe,GAAGD,UAE5D,CAACF,YACA,qBAAC,0BACC,oBAAC;IACC,IAAI,GAAGe,MAAM,GAAE;IACf,OAAOnB,SAAS,WAAW0C;IAC3B,OAAOL,EAAE,qBAAqB,SAAS;IACvC,GAAKpC,eAAe,EAAG;KAAC,EAE1B,oBAAC;IACC,IAAI,GAAGkB,MAAM,GAAE;IACf,OAAOkB,EAAE,qBAAqB,SAAS;IACvC,SAAS9B;IACT,GAAKL,eAAe,EAAG;KAAC,IAEd,GACZwC;IACA,GACC;GACF"}
+{"version":3,"file":"DialogForm.js","names":["useI18n","Button","ButtonGroup","Content","Footer","Header","Title","isModernFormController","Form","SubmitButton","useForm","useDialogContext","CubeDialogProps","Dialog","ModernDialogForm","ReactElement","CubeButtonProps","CubeFormProps","ModernFormProps","CubeSubmitButtonProps","FieldTypes","CubeDialogFormProps","Omit","T","danger","submitProps","cancelProps","preserve","noActions","title","children","onLocalDismiss","CubeDialogFormRef","open","close","ModernDialogFormProps","DialogForm","props","$","_c","t0","form","LegacyDialogForm","qa","name","defaultValues","onDismiss","onSubmit","onSubmitFailed","onValuesChange","labelStyles","labelPosition","requiredMark","necessityIndicator","isReadOnly","isInvalid","isValid","validateTrigger","size","closeIcon","dialogProps","t","onClose","setTimeout","resetFields","data","undefined"],"sources":["../../../../src/components/overlays/Dialog/DialogForm.tsx"],"sourcesContent":["import { useI18n } from '../../../i18n';\nimport { Button } from '../../actions/Button/Button';\nimport { ButtonGroup } from '../../actions/ButtonGroup/ButtonGroup';\nimport { Content } from '../../content/Content';\nimport { Footer } from '../../content/Footer';\nimport { Header } from '../../content/Header';\nimport { Title } from '../../content/Title';\nimport { isModernFormController } from '../../form/Form/backend';\nimport { Form } from '../../form/Form/Form';\nimport { SubmitButton } from '../../form/Form/SubmitButton/SubmitButton';\nimport { useForm } from '../../form/Form/use-form';\n\nimport { useDialogContext } from './context';\nimport { CubeDialogProps, Dialog } from './Dialog';\nimport { ModernDialogForm } from './ModernDialogForm';\n\nimport type { ReactElement } from 'react';\nimport type { CubeButtonProps } from '../../actions/Button/Button';\nimport type { CubeFormProps } from '../../form/Form/Form';\nimport type { ModernFormProps } from '../../form/Form/ModernFormRoot';\nimport type { CubeSubmitButtonProps } from '../../form/Form/SubmitButton/SubmitButton';\nimport type { FieldTypes } from '../../form/Form/types';\n\nexport interface CubeDialogFormProps<T extends FieldTypes = FieldTypes>\n  extends Omit<CubeDialogProps, 'children'>,\n    Omit<CubeFormProps<T>, 'role' | 'children'> {\n  /** Whether the submit button has a `danger` theme */\n  danger?: boolean;\n  /** Properties for submit button. Use `label` to change text. */\n  submitProps?: CubeButtonProps;\n  /** Properties for cancel button. Use `label` to change text. */\n  cancelProps?: CubeButtonProps;\n  /** Preserve form values after submission or dismissal. */\n  preserve?: boolean;\n  /** Whether to hide action button so developer can manually specify them */\n  noActions?: boolean;\n  /** The title of the dialog */\n  title?: string;\n  /** Children nodes or render function  */\n  children?:\n    | CubeFormProps['children']\n    | ((onLocalDismiss: () => void) => CubeFormProps['children']);\n}\n\nexport interface CubeDialogFormRef {\n  open: () => void;\n  close: () => void;\n}\n\n/**\n * DialogForms are a specific type of Dialog. They contain forms to fill.\n */\nexport interface ModernDialogFormProps<T extends FieldTypes = FieldTypes>\n  extends Omit<CubeDialogFormProps<T>, keyof CubeFormProps<T> | 'submitProps'>,\n    Omit<ModernFormProps<T>, 'role' | 'children'> {\n  children?: CubeDialogFormProps<T>['children'];\n  submitProps?: Omit<CubeSubmitButtonProps<T>, 'form'>;\n}\n\nexport function DialogForm<T extends FieldTypes = FieldTypes>(\n  props: CubeDialogFormProps<T>,\n): ReactElement;\nexport function DialogForm<T extends FieldTypes = FieldTypes>(\n  props: ModernDialogFormProps<T>,\n): ReactElement;\nexport function DialogForm<T extends FieldTypes = FieldTypes>(\n  props: CubeDialogFormProps<T> | ModernDialogFormProps<T>,\n): ReactElement {\n  return isModernFormController(props.form) ? (\n    <ModernDialogForm {...(props as ModernDialogFormProps<T>)} />\n  ) : (\n    <LegacyDialogForm {...(props as CubeDialogFormProps<T>)} />\n  );\n}\n\nfunction LegacyDialogForm<T extends FieldTypes>(props: CubeDialogFormProps<T>) {\n  'use no memo';\n  // Legacy form state is mutable; preserve its render-time reads until migration.\n\n  let {\n    qa,\n    name,\n    form,\n    defaultValues,\n    onDismiss,\n    onSubmit,\n    onSubmitFailed,\n    onValuesChange,\n    labelStyles,\n    labelPosition,\n    requiredMark,\n    necessityIndicator,\n    isReadOnly,\n    isInvalid,\n    isValid,\n    validateTrigger,\n    children,\n    danger,\n    noActions,\n    submitProps,\n    cancelProps,\n    preserve,\n    title,\n    size,\n    closeIcon,\n    ...dialogProps\n  } = props;\n\n  [form] = useForm(form);\n\n  const { t } = useI18n();\n  const { onClose } = useDialogContext();\n\n  function onLocalDismiss() {\n    onClose?.();\n    onDismiss?.();\n\n    if (!preserve) {\n      // let animations finish before resetting the form\n      setTimeout(() => {\n        form?.resetFields();\n      }, 250);\n    }\n  }\n\n  return (\n    <Dialog\n      qa={`${qa || ''}Dialog`}\n      size={size}\n      closeIcon={closeIcon}\n      {...dialogProps}\n    >\n      <Header>\n        <Title ellipsis>{title}</Title>\n      </Header>\n      {/*\n        The form wraps BOTH slots rather than sitting inside `Content`, so the\n        actions can live in a pinned `Footer` while the body scrolls. They still\n        have to be inside the `<form>` for submit to work, which is why the form\n        is the outer one of the two (CUB-4920). A form placed directly in a\n        `Dialog` lays itself out as the dialog's column (see `FormElement`).\n      */}\n      <Form<T>\n        qa={qa || 'DialogForm'}\n        form={form}\n        name={name}\n        defaultValues={defaultValues}\n        labelStyles={labelStyles}\n        labelPosition={labelPosition}\n        requiredMark={requiredMark}\n        necessityIndicator={necessityIndicator}\n        isReadOnly={isReadOnly}\n        isInvalid={isInvalid}\n        isValid={isValid}\n        validateTrigger={validateTrigger}\n        onSubmit={async (data) => {\n          await onSubmit?.(data);\n\n          onClose?.();\n\n          if (!preserve) {\n            // let animations finish before resetting the form\n            setTimeout(() => {\n              form.resetFields();\n            }, 250);\n          }\n        }}\n        onSubmitFailed={onSubmitFailed}\n        onValuesChange={onValuesChange}\n      >\n        <Content>\n          {typeof children === 'function' ? children(onLocalDismiss) : children}\n        </Content>\n\n        {!noActions ? (\n          <Footer>\n            <ButtonGroup>\n              <SubmitButton\n                qa={`${qa || ''}SubmitButton`}\n                theme={danger ? 'danger' : undefined}\n                label={t('dialogForm.submit', 'Submit')}\n                {...(submitProps || {})}\n              />\n              <Button\n                qa={`${qa || ''}CancelButton`}\n                label={t('dialogForm.cancel', 'Cancel')}\n                onPress={onLocalDismiss}\n                {...(cancelProps || {})}\n              />\n            </ButtonGroup>\n          </Footer>\n        ) : undefined}\n      </Form>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAiEA,SAAOoC,WAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;AAAA,KAAAF,EAAA,OAAAD,OAAA;AAGEG,OAAAjC,uBAAuB8B,MAAKI,KAIlC,GAHC,oBAAC,oBAAgB,GAAMJ,QAGxB,GADC,oBAAC,oBAAgB,GAAMA,QACxB;AAAAC,IAAA,KAAAD;AAAAC,IAAA,KAAAE;OAAAA,MAAAF,EAAA;AAAA,QAJME;;AAOT,SAASE,iBAAuCL,OAA+B;AAC7E;CAGA,IAAI,EACFM,IACAC,MACAH,MACAI,eACAC,WACAC,UACAC,gBACAC,gBACAC,aACAC,eACAC,cACAC,oBACAC,YACAC,WACAC,SACAC,iBACA3B,UACAN,QACAI,WACAH,aACAC,aACAC,UACAE,OACA6B,MACAC,WACA,GAAGC,gBACDvB;AAEJ,EAACI,QAAQ/B,QAAQ+B,KAAK;CAEtB,MAAM,EAAEoB,MAAM7D,SAAS;CACvB,MAAM,EAAE8D,YAAYnD,kBAAkB;CAEtC,SAASoB,iBAAiB;AACxB+B,aAAW;AACXhB,eAAa;AAEb,MAAI,CAACnB,SAEHoC,kBAAiB;AACftB,SAAMuB,aAAa;KAClB,IAAI;;AAIX,QACE,qBAAC;EACC,IAAI,GAAGrB,MAAM,GAAE;EACTe;EACKC;EACX,GAAIC;aAEJ,oBAAC,oBACC,oBAAC;GAAM;aAAU/B;IAAa,GACxB,EAQR,qBAAC;GACC,IAAIc,MAAM;GACJF;GACAG;GACSC;GACFK;GACEC;GACDC;GACMC;GACRC;GACDC;GACFC;GACQC;GACjB,UAAU,OAAOQ,SAAS;AACxB,UAAMlB,WAAWkB,KAAK;AAEtBH,eAAW;AAEX,QAAI,CAACnC,SAEHoC,kBAAiB;AACftB,UAAKuB,aAAa;OACjB,IAAI;;GAGKhB;GACAC;cAEhB,oBAAC,qBACE,OAAOnB,aAAa,aAAaA,SAASC,eAAe,GAAGD,WACtD,EAER,CAACF,YACA,oBAAC,oBACC,qBAAC,0BACC,oBAAC;IACC,IAAI,GAAGe,MAAM,GAAE;IACf,OAAOnB,SAAS,WAAW0C;IAC3B,OAAOL,EAAE,qBAAqB,SAAS;IACvC,GAAKpC,eAAe,EAAG;KAAC,EAE1B,oBAAC;IACC,IAAI,GAAGkB,MAAM,GAAE;IACf,OAAOkB,EAAE,qBAAqB,SAAS;IACvC,SAAS9B;IACT,GAAKL,eAAe,EAAG;KAAC,IAEf,GACN,GACPwC;IACA;GACC"}

package/dist/components/overlays/Dialog/DialogTrigger.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";

package/dist/components/overlays/Dialog/ModernDialogForm.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { _Title } from "../../content/Title.js";
@@ -8,6 +8,7 @@ import { ButtonGroup } from "../../actions/ButtonGroup/ButtonGroup.js";
 import { useOpenTransitionContext } from "../Modal/OpenTransitionContext.js";
 import { useDialogContext } from "./context.js";
 import { Content } from "../../content/Content.js";
+import { Footer } from "../../content/Footer.js";
 import { Header } from "../../content/Header.js";
 import { Dialog } from "./Dialog.js";
 import { getControllerInternals } from "../../form/Form/modern/controller.js";
@@ -26,7 +27,7 @@ function finishSession(session) {
 }
 /** Modern dialogs own the editing session, including retained/hidden roots. */
 function ModernDialogForm(props) {
-	const $ = c(105);
+	const $ = c(107);
 	let action;
 	let autoComplete;
 	let cancelProps;
@@ -238,8 +239,14 @@ function ModernDialogForm(props) {
 		$[58] = t9;
 	} else t9 = $[58];
 	let t10;
-	if ($[59] !== cancelProps || $[60] !== danger || $[61] !== dismiss || $[62] !== noActions || $[63] !== qa || $[64] !== submitProps || $[65] !== t) {
-		t10 = !noActions && /* @__PURE__ */ jsxs(ButtonGroup, { children: [/* @__PURE__ */ jsx(_SubmitButton, {
+	if ($[59] !== t9) {
+		t10 = /* @__PURE__ */ jsx(Content, { children: t9 });
+		$[59] = t9;
+		$[60] = t10;
+	} else t10 = $[60];
+	let t11;
+	if ($[61] !== cancelProps || $[62] !== danger || $[63] !== dismiss || $[64] !== noActions || $[65] !== qa || $[66] !== submitProps || $[67] !== t) {
+		t11 = !noActions && /* @__PURE__ */ jsx(Footer, { children: /* @__PURE__ */ jsxs(ButtonGroup, { children: [/* @__PURE__ */ jsx(_SubmitButton, {
 			qa: `${qa || ""}SubmitButton`,
 			theme: danger ? "danger" : void 0,
 			label: t("dialogForm.submit", "Submit"),
@@ -249,19 +256,19 @@ function ModernDialogForm(props) {
 			label: t("dialogForm.cancel", "Cancel"),
 			onPress: dismiss,
 			...cancelProps
-		})] });
-		$[59] = cancelProps;
-		$[60] = danger;
-		$[61] = dismiss;
-		$[62] = noActions;
-		$[63] = qa;
-		$[64] = submitProps;
-		$[65] = t;
-		$[66] = t10;
-	} else t10 = $[66];
-	let t11;
-	if ($[67] !== action || $[68] !== autoComplete || $[69] !== defaultValues || $[70] !== encType || $[71] !== form || $[72] !== isDisabled || $[73] !== isInvalid || $[74] !== isReadOnly || $[75] !== isValid || $[76] !== labelPosition || $[77] !== labelStyles || $[78] !== labelWidth || $[79] !== method || $[80] !== name || $[81] !== necessityIndicator || $[82] !== onReset || $[83] !== onResetCapture || $[84] !== onSubmit || $[85] !== onSubmitFailed || $[86] !== onValuesChange || $[87] !== orientation || $[88] !== requiredMark || $[89] !== showValid || $[90] !== submitValues || $[91] !== submitted || $[92] !== t10 || $[93] !== t8 || $[94] !== t9 || $[95] !== target || $[96] !== validateTrigger || $[97] !== validationState) {
-		t11 = /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsxs(_ModernFormRoot, {
+		})] }) });
+		$[61] = cancelProps;
+		$[62] = danger;
+		$[63] = dismiss;
+		$[64] = noActions;
+		$[65] = qa;
+		$[66] = submitProps;
+		$[67] = t;
+		$[68] = t11;
+	} else t11 = $[68];
+	let t12;
+	if ($[69] !== action || $[70] !== autoComplete || $[71] !== defaultValues || $[72] !== encType || $[73] !== form || $[74] !== isDisabled || $[75] !== isInvalid || $[76] !== isReadOnly || $[77] !== isValid || $[78] !== labelPosition || $[79] !== labelStyles || $[80] !== labelWidth || $[81] !== method || $[82] !== name || $[83] !== necessityIndicator || $[84] !== onReset || $[85] !== onResetCapture || $[86] !== onSubmit || $[87] !== onSubmitFailed || $[88] !== onValuesChange || $[89] !== orientation || $[90] !== requiredMark || $[91] !== showValid || $[92] !== submitValues || $[93] !== submitted || $[94] !== t10 || $[95] !== t11 || $[96] !== t8 || $[97] !== target || $[98] !== validateTrigger || $[99] !== validationState) {
+		t12 = /* @__PURE__ */ jsxs(_ModernFormRoot, {
 			"data-popover-keep": true,
 			form,
 			qa: t8,
@@ -292,57 +299,57 @@ function ModernDialogForm(props) {
 			target,
 			encType,
 			autoComplete,
-			children: [t9, t10]
-		}) });
-		$[67] = action;
-		$[68] = autoComplete;
-		$[69] = defaultValues;
-		$[70] = encType;
-		$[71] = form;
-		$[72] = isDisabled;
-		$[73] = isInvalid;
-		$[74] = isReadOnly;
-		$[75] = isValid;
-		$[76] = labelPosition;
-		$[77] = labelStyles;
-		$[78] = labelWidth;
-		$[79] = method;
-		$[80] = name;
-		$[81] = necessityIndicator;
-		$[82] = onReset;
-		$[83] = onResetCapture;
-		$[84] = onSubmit;
-		$[85] = onSubmitFailed;
-		$[86] = onValuesChange;
-		$[87] = orientation;
-		$[88] = requiredMark;
-		$[89] = showValid;
-		$[90] = submitValues;
-		$[91] = submitted;
-		$[92] = t10;
-		$[93] = t8;
-		$[94] = t9;
-		$[95] = target;
-		$[96] = validateTrigger;
-		$[97] = validationState;
-		$[98] = t11;
-	} else t11 = $[98];
-	let t12;
-	if ($[99] !== dialogProps || $[100] !== dismiss || $[101] !== t11 || $[102] !== t6 || $[103] !== t7) {
-		t12 = /* @__PURE__ */ jsxs(Dialog, {
+			children: [t10, t11]
+		});
+		$[69] = action;
+		$[70] = autoComplete;
+		$[71] = defaultValues;
+		$[72] = encType;
+		$[73] = form;
+		$[74] = isDisabled;
+		$[75] = isInvalid;
+		$[76] = isReadOnly;
+		$[77] = isValid;
+		$[78] = labelPosition;
+		$[79] = labelStyles;
+		$[80] = labelWidth;
+		$[81] = method;
+		$[82] = name;
+		$[83] = necessityIndicator;
+		$[84] = onReset;
+		$[85] = onResetCapture;
+		$[86] = onSubmit;
+		$[87] = onSubmitFailed;
+		$[88] = onValuesChange;
+		$[89] = orientation;
+		$[90] = requiredMark;
+		$[91] = showValid;
+		$[92] = submitValues;
+		$[93] = submitted;
+		$[94] = t10;
+		$[95] = t11;
+		$[96] = t8;
+		$[97] = target;
+		$[98] = validateTrigger;
+		$[99] = validationState;
+		$[100] = t12;
+	} else t12 = $[100];
+	let t13;
+	if ($[101] !== dialogProps || $[102] !== dismiss || $[103] !== t12 || $[104] !== t6 || $[105] !== t7) {
+		t13 = /* @__PURE__ */ jsxs(Dialog, {
 			...dialogProps,
 			qa: t6,
 			onDismiss: dismiss,
-			children: [t7, t11]
+			children: [t7, t12]
 		});
-		$[99] = dialogProps;
-		$[100] = dismiss;
-		$[101] = t11;
-		$[102] = t6;
-		$[103] = t7;
-		$[104] = t12;
-	} else t12 = $[104];
-	return t12;
+		$[101] = dialogProps;
+		$[102] = dismiss;
+		$[103] = t12;
+		$[104] = t6;
+		$[105] = t7;
+		$[106] = t13;
+	} else t13 = $[106];
+	return t13;
 }
 
 //#endregion

package/dist/components/overlays/Dialog/ModernDialogForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModernDialogForm.js","names":["useRef","useEvent","useI18n","useLayoutEffect","Button","ButtonGroup","Content","Header","Title","getControllerInternals","ModernFormRoot","SubmitButton","useOpenTransitionContext","useDialogContext","Dialog","FormController","ModernDialogFormProps","DialogSession","form","T","preserve","ended","wasOpen","finishSession","session","store","cancelSubmission","reset","ModernDialogForm","props","$","_c","action","autoComplete","cancelProps","children","danger","defaultValues","dialogProps","encType","isDisabled","isInvalid","isReadOnly","isValid","labelPosition","labelStyles","labelWidth","method","name","necessityIndicator","noActions","onDismiss","onReset","onResetCapture","onSubmit","onSubmitFailed","onValuesChange","orientation","qa","requiredMark","showValid","submitProps","submitValues","target","title","validateTrigger","validationState","t","onClose","isOpen","t0","internals","transition","isClosing","undefined","transitionState","t1","current","dismiss","t2","submitted","t3","t4","own","queueMicrotask","getRootElement","t5","t6","t7","t8","t9","t10","t11","t12"],"sources":["../../../../src/components/overlays/Dialog/ModernDialogForm.tsx"],"sourcesContent":["import { useRef } from 'react';\n\nimport { useEvent } from '../../../_internal/hooks/use-event';\nimport { useI18n } from '../../../i18n';\nimport { useLayoutEffect } from '../../../utils/react/useLayoutEffect';\nimport { Button } from '../../actions/Button/Button';\nimport { ButtonGroup } from '../../actions/ButtonGroup/ButtonGroup';\nimport { Content } from '../../content/Content';\nimport { Header } from '../../content/Header';\nimport { Title } from '../../content/Title';\nimport { getControllerInternals } from '../../form/Form/modern/controller';\nimport { ModernFormRoot } from '../../form/Form/ModernFormRoot';\nimport { SubmitButton } from '../../form/Form/SubmitButton/SubmitButton';\nimport { useOpenTransitionContext } from '../Modal/OpenTransitionContext';\n\nimport { useDialogContext } from './context';\nimport { Dialog } from './Dialog';\n\nimport type { FormController } from '../../form/Form/modern/controller';\nimport type { ModernDialogFormProps } from './DialogForm';\n\ninterface DialogSession<T extends object> {\n  form: FormController<T>;\n  preserve?: boolean;\n  ended: boolean;\n  wasOpen: boolean;\n}\n\nfunction finishSession<T extends object>(session?: DialogSession<T>) {\n  if (!session || session.ended) return;\n  session.ended = true;\n  getControllerInternals(session.form, '<DialogForm>').store.cancelSubmission();\n  if (!session.preserve) session.form.reset();\n}\n\n/** Modern dialogs own the editing session, including retained/hidden roots. */\nexport function ModernDialogForm<T extends object>(\n  props: ModernDialogFormProps<T>,\n) {\n  const {\n    form,\n    qa,\n    title,\n    danger,\n    submitProps,\n    cancelProps,\n    noActions,\n    preserve,\n    children,\n    onDismiss,\n    name,\n    defaultValues,\n    onSubmit,\n    onSubmitFailed,\n    onValuesChange,\n    onReset,\n    onResetCapture,\n    submitValues,\n    labelStyles,\n    labelPosition,\n    labelWidth,\n    orientation,\n    requiredMark,\n    necessityIndicator,\n    isDisabled,\n    isReadOnly,\n    isInvalid,\n    isValid,\n    validationState,\n    validateTrigger,\n    showValid,\n    action,\n    method,\n    target,\n    encType,\n    autoComplete,\n    ...dialogProps\n  } = props;\n  const { t } = useI18n();\n  const { onClose, isOpen } = useDialogContext();\n  const internals = getControllerInternals(form, '<DialogForm>');\n  const transition = useOpenTransitionContext();\n  const isClosing =\n    isOpen === undefined\n      ? transition?.transitionState === 'exit' ||\n        transition?.transitionState === 'unmounted'\n      : !isOpen;\n  const session = useRef<DialogSession<T> | undefined>(undefined);\n  const dismiss = useEvent(() => {\n    finishSession(session.current);\n    onClose?.();\n    onDismiss?.();\n  });\n  const submitted = useEvent(() => {\n    finishSession(session.current);\n    onClose?.();\n  });\n\n  // Escape, outside clicks, and controlled closing belong to the container.\n  // Only an open -> closed transition ends a session; hidden initial mounts\n  // must not discard a controller that the caller has already populated.\n  useLayoutEffect(() => {\n    if (session.current?.form !== form) {\n      session.current = { form, preserve, ended: false, wasOpen: !isClosing };\n    }\n    const current = session.current;\n    current.preserve = preserve;\n    if (isClosing && current.wasOpen) finishSession(current);\n    if (!isClosing && !current.wasOpen) current.ended = false;\n    current.wasOpen = !isClosing;\n  });\n\n  // Portals may relocate (remounting this component) and Strict Mode reconnects\n  // effects. A replacement root owns the same session; only a detached\n  // controller should reset after real removal. Capture that controller's\n  // session, so replacing it cannot apply the new controller's preserve policy.\n  useLayoutEffect(() => {\n    const own = session.current;\n    return () => {\n      queueMicrotask(() => {\n        if (!internals.getRootElement()) finishSession(own);\n      });\n    };\n  }, [form, internals]);\n\n  return (\n    <Dialog {...dialogProps} qa={`${qa || ''}Dialog`} onDismiss={dismiss}>\n      <Header>\n        <Title ellipsis>{title}</Title>\n      </Header>\n      <Content>\n        <ModernFormRoot\n          data-popover-keep\n          form={form}\n          qa={qa || 'DialogForm'}\n          name={name}\n          defaultValues={defaultValues}\n          onSubmit={onSubmit}\n          onSubmitted={submitted}\n          onSubmitFailed={onSubmitFailed}\n          onValuesChange={onValuesChange}\n          onReset={onReset}\n          onResetCapture={onResetCapture}\n          submitValues={submitValues}\n          labelStyles={labelStyles}\n          labelPosition={labelPosition}\n          labelWidth={labelWidth}\n          orientation={orientation}\n          requiredMark={requiredMark}\n          necessityIndicator={necessityIndicator}\n          isDisabled={isDisabled}\n          isReadOnly={isReadOnly}\n          isInvalid={isInvalid}\n          isValid={isValid}\n          validationState={validationState}\n          validateTrigger={validateTrigger}\n          showValid={showValid}\n          action={action}\n          method={method}\n          target={target}\n          encType={encType}\n          autoComplete={autoComplete}\n        >\n          {typeof children === 'function' ? children(dismiss) : children}\n          {!noActions && (\n            <ButtonGroup>\n              <SubmitButton\n                qa={`${qa || ''}SubmitButton`}\n                theme={danger ? 'danger' : undefined}\n                label={t('dialogForm.submit', 'Submit')}\n                {...submitProps}\n              />\n              <Button\n                qa={`${qa || ''}CancelButton`}\n                label={t('dialogForm.cancel', 'Cancel')}\n                onPress={dismiss}\n                {...cancelProps}\n              />\n            </ButtonGroup>\n          )}\n        </ModernFormRoot>\n      </Content>\n    </Dialog>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ModernDialogForm.js","names":["useRef","useEvent","useI18n","useLayoutEffect","Button","ButtonGroup","Content","Footer","Header","Title","getControllerInternals","ModernFormRoot","SubmitButton","useOpenTransitionContext","useDialogContext","Dialog","FormController","ModernDialogFormProps","DialogSession","form","T","preserve","ended","wasOpen","finishSession","session","store","cancelSubmission","reset","ModernDialogForm","props","$","_c","action","autoComplete","cancelProps","children","danger","defaultValues","dialogProps","encType","isDisabled","isInvalid","isReadOnly","isValid","labelPosition","labelStyles","labelWidth","method","name","necessityIndicator","noActions","onDismiss","onReset","onResetCapture","onSubmit","onSubmitFailed","onValuesChange","orientation","qa","requiredMark","showValid","submitProps","submitValues","target","title","validateTrigger","validationState","t","onClose","isOpen","t0","internals","transition","isClosing","undefined","transitionState","t1","current","dismiss","t2","submitted","t3","t4","own","queueMicrotask","getRootElement","t5","t6","t7","t8","t9","t10","t11","t12","t13"],"sources":["../../../../src/components/overlays/Dialog/ModernDialogForm.tsx"],"sourcesContent":["import { useRef } from 'react';\n\nimport { useEvent } from '../../../_internal/hooks/use-event';\nimport { useI18n } from '../../../i18n';\nimport { useLayoutEffect } from '../../../utils/react/useLayoutEffect';\nimport { Button } from '../../actions/Button/Button';\nimport { ButtonGroup } from '../../actions/ButtonGroup/ButtonGroup';\nimport { Content } from '../../content/Content';\nimport { Footer } from '../../content/Footer';\nimport { Header } from '../../content/Header';\nimport { Title } from '../../content/Title';\nimport { getControllerInternals } from '../../form/Form/modern/controller';\nimport { ModernFormRoot } from '../../form/Form/ModernFormRoot';\nimport { SubmitButton } from '../../form/Form/SubmitButton/SubmitButton';\nimport { useOpenTransitionContext } from '../Modal/OpenTransitionContext';\n\nimport { useDialogContext } from './context';\nimport { Dialog } from './Dialog';\n\nimport type { FormController } from '../../form/Form/modern/controller';\nimport type { ModernDialogFormProps } from './DialogForm';\n\ninterface DialogSession<T extends object> {\n  form: FormController<T>;\n  preserve?: boolean;\n  ended: boolean;\n  wasOpen: boolean;\n}\n\nfunction finishSession<T extends object>(session?: DialogSession<T>) {\n  if (!session || session.ended) return;\n  session.ended = true;\n  getControllerInternals(session.form, '<DialogForm>').store.cancelSubmission();\n  if (!session.preserve) session.form.reset();\n}\n\n/** Modern dialogs own the editing session, including retained/hidden roots. */\nexport function ModernDialogForm<T extends object>(\n  props: ModernDialogFormProps<T>,\n) {\n  const {\n    form,\n    qa,\n    title,\n    danger,\n    submitProps,\n    cancelProps,\n    noActions,\n    preserve,\n    children,\n    onDismiss,\n    name,\n    defaultValues,\n    onSubmit,\n    onSubmitFailed,\n    onValuesChange,\n    onReset,\n    onResetCapture,\n    submitValues,\n    labelStyles,\n    labelPosition,\n    labelWidth,\n    orientation,\n    requiredMark,\n    necessityIndicator,\n    isDisabled,\n    isReadOnly,\n    isInvalid,\n    isValid,\n    validationState,\n    validateTrigger,\n    showValid,\n    action,\n    method,\n    target,\n    encType,\n    autoComplete,\n    ...dialogProps\n  } = props;\n  const { t } = useI18n();\n  const { onClose, isOpen } = useDialogContext();\n  const internals = getControllerInternals(form, '<DialogForm>');\n  const transition = useOpenTransitionContext();\n  const isClosing =\n    isOpen === undefined\n      ? transition?.transitionState === 'exit' ||\n        transition?.transitionState === 'unmounted'\n      : !isOpen;\n  const session = useRef<DialogSession<T> | undefined>(undefined);\n  const dismiss = useEvent(() => {\n    finishSession(session.current);\n    onClose?.();\n    onDismiss?.();\n  });\n  const submitted = useEvent(() => {\n    finishSession(session.current);\n    onClose?.();\n  });\n\n  // Escape, outside clicks, and controlled closing belong to the container.\n  // Only an open -> closed transition ends a session; hidden initial mounts\n  // must not discard a controller that the caller has already populated.\n  useLayoutEffect(() => {\n    if (session.current?.form !== form) {\n      session.current = { form, preserve, ended: false, wasOpen: !isClosing };\n    }\n    const current = session.current;\n    current.preserve = preserve;\n    if (isClosing && current.wasOpen) finishSession(current);\n    if (!isClosing && !current.wasOpen) current.ended = false;\n    current.wasOpen = !isClosing;\n  });\n\n  // Portals may relocate (remounting this component) and Strict Mode reconnects\n  // effects. A replacement root owns the same session; only a detached\n  // controller should reset after real removal. Capture that controller's\n  // session, so replacing it cannot apply the new controller's preserve policy.\n  useLayoutEffect(() => {\n    const own = session.current;\n    return () => {\n      queueMicrotask(() => {\n        if (!internals.getRootElement()) finishSession(own);\n      });\n    };\n  }, [form, internals]);\n\n  return (\n    <Dialog {...dialogProps} qa={`${qa || ''}Dialog`} onDismiss={dismiss}>\n      <Header>\n        <Title ellipsis>{title}</Title>\n      </Header>\n      {/*\n        The form wraps BOTH slots rather than sitting inside `Content`, so the\n        actions can live in a pinned `Footer` while the body scrolls. They still\n        have to be inside the `<form>` for submit to work, which is why the form\n        is the outer one of the two (CUB-4920). A form placed directly in a\n        `Dialog` lays itself out as the dialog's column (see `FormElement`).\n      */}\n      <ModernFormRoot\n        data-popover-keep\n        form={form}\n        qa={qa || 'DialogForm'}\n        name={name}\n        defaultValues={defaultValues}\n        onSubmit={onSubmit}\n        onSubmitted={submitted}\n        onSubmitFailed={onSubmitFailed}\n        onValuesChange={onValuesChange}\n        onReset={onReset}\n        onResetCapture={onResetCapture}\n        submitValues={submitValues}\n        labelStyles={labelStyles}\n        labelPosition={labelPosition}\n        labelWidth={labelWidth}\n        orientation={orientation}\n        requiredMark={requiredMark}\n        necessityIndicator={necessityIndicator}\n        isDisabled={isDisabled}\n        isReadOnly={isReadOnly}\n        isInvalid={isInvalid}\n        isValid={isValid}\n        validationState={validationState}\n        validateTrigger={validateTrigger}\n        showValid={showValid}\n        action={action}\n        method={method}\n        target={target}\n        encType={encType}\n        autoComplete={autoComplete}\n      >\n        <Content>\n          {typeof children === 'function' ? children(dismiss) : children}\n        </Content>\n\n        {!noActions && (\n          <Footer>\n            <ButtonGroup>\n              <SubmitButton\n                qa={`${qa || ''}SubmitButton`}\n                theme={danger ? 'danger' : undefined}\n                label={t('dialogForm.submit', 'Submit')}\n                {...submitProps}\n              />\n              <Button\n                qa={`${qa || ''}CancelButton`}\n                label={t('dialogForm.cancel', 'Cancel')}\n                onPress={dismiss}\n                {...cancelProps}\n              />\n            </ButtonGroup>\n          </Footer>\n        )}\n      </ModernFormRoot>\n    </Dialog>\n  );\n}\n"],"mappings":"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"}

package/dist/components/overlays/Dialog/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { createContext, useContext } from "react";
 import invariant from "tiny-invariant";
 

package/dist/components/overlays/Dialog/use-content-overflow.js

@@ -0,0 +1,68 @@
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
+import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
+import { c } from "react-compiler-runtime";
+import { useState } from "react";
+
+//#region src/components/overlays/Dialog/use-content-overflow.ts
+const OVERFLOW_THRESHOLD = 2;
+const BODY_SELECTOR = ":scope > [data-id=\"Content\"], :scope > form > [data-id=\"Content\"]";
+/**
+* Whether the dialog's body is taller than the room it has, i.e. whether it
+* scrolls. The footer draws its top line on this (see `Dialog`).
+*
+* The body's own box is not enough to watch. Once the dialog reaches its max
+* height the box stops growing, and in a fixed-height dialog (`fullscreen`,
+* `panel`) it never changes at all — there, content growing past the fold is
+* visible only on the body's children. So both the body and its children are
+* observed, and the set is re-synced whenever the body or its child list is
+* replaced.
+*/
+function useContentOverflow(dialogRef) {
+	const $ = c(3);
+	const [overflows, setOverflows] = useState(false);
+	let t0;
+	let t1;
+	if ($[0] !== dialogRef) {
+		t0 = () => {
+			const dialog = dialogRef.current;
+			if (!dialog || typeof ResizeObserver === "undefined") return;
+			let body = null;
+			const measure = () => {
+				setOverflows(!!body && body.scrollHeight > body.clientHeight + OVERFLOW_THRESHOLD);
+			};
+			const resizeObserver = new ResizeObserver(measure);
+			const mutationObserver = new MutationObserver(() => sync());
+			const sync = () => {
+				body = dialog.querySelector(BODY_SELECTOR);
+				mutationObserver.disconnect();
+				resizeObserver.disconnect();
+				mutationObserver.observe(dialog, { childList: true });
+				for (const form of Array.from(dialog.querySelectorAll(":scope > form"))) mutationObserver.observe(form, { childList: true });
+				if (body) {
+					mutationObserver.observe(body, { childList: true });
+					resizeObserver.observe(body);
+					for (const child of Array.from(body.children)) resizeObserver.observe(child);
+				}
+				measure();
+			};
+			sync();
+			return () => {
+				mutationObserver.disconnect();
+				resizeObserver.disconnect();
+			};
+		};
+		t1 = [dialogRef];
+		$[0] = dialogRef;
+		$[1] = t0;
+		$[2] = t1;
+	} else {
+		t0 = $[1];
+		t1 = $[2];
+	}
+	useLayoutEffect$1(t0, t1);
+	return overflows;
+}
+
+//#endregion
+export { useContentOverflow };
+//# sourceMappingURL=use-content-overflow.js.map

package/dist/components/overlays/Dialog/use-content-overflow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-content-overflow.js","names":["RefObject","useState","useLayoutEffect","OVERFLOW_THRESHOLD","BODY_SELECTOR","useContentOverflow","dialogRef","$","_c","overflows","setOverflows","t0","t1","dialog","current","ResizeObserver","body","measure","scrollHeight","clientHeight","resizeObserver","mutationObserver","MutationObserver","sync","querySelector","disconnect","observe","childList","form","Array","from","querySelectorAll","child","children"],"sources":["../../../../src/components/overlays/Dialog/use-content-overflow.ts"],"sourcesContent":["import { RefObject, useState } from 'react';\n\nimport { useLayoutEffect } from '../../../utils/react/useLayoutEffect';\n\n// Same slack as `useTinyScrollbar`: sub-pixel rounding can leave a body that\n// fits reporting a `scrollHeight` a pixel or two over its `clientHeight`.\nconst OVERFLOW_THRESHOLD = 2;\n\n// The body is the `Content` the dialog itself lays out: a direct child, or the\n// direct child of a direct-child `<form>` (a `Form` placed there lays itself\n// out as the dialog's column; see `FormElement`). Those are the two shapes in\n// which `Content` is the thing that scrolls. A `Content` nested anywhere else is\n// part of the body, not the body.\nconst BODY_SELECTOR =\n  ':scope > [data-id=\"Content\"], :scope > form > [data-id=\"Content\"]';\n\n/**\n * Whether the dialog's body is taller than the room it has, i.e. whether it\n * scrolls. The footer draws its top line on this (see `Dialog`).\n *\n * The body's own box is not enough to watch. Once the dialog reaches its max\n * height the box stops growing, and in a fixed-height dialog (`fullscreen`,\n * `panel`) it never changes at all — there, content growing past the fold is\n * visible only on the body's children. So both the body and its children are\n * observed, and the set is re-synced whenever the body or its child list is\n * replaced.\n */\nexport function useContentOverflow(dialogRef: RefObject<HTMLElement | null>) {\n  const [overflows, setOverflows] = useState(false);\n\n  useLayoutEffect(() => {\n    const dialog = dialogRef.current;\n\n    if (!dialog || typeof ResizeObserver === 'undefined') return;\n\n    let body: HTMLElement | null = null;\n\n    const measure = () => {\n      setOverflows(\n        !!body && body.scrollHeight > body.clientHeight + OVERFLOW_THRESHOLD,\n      );\n    };\n\n    const resizeObserver = new ResizeObserver(measure);\n\n    // Only the child lists of the dialog, a direct-child form and the body can\n    // move the body or change which children to watch, so those three are all\n    // it observes — never the subtree. A picker's popover is a dialog too, and\n    // a virtualized list scrolling inside it mutates on every frame. Deeper\n    // mutations that matter resize a child, which the resize observer sees.\n    const mutationObserver = new MutationObserver(() => sync());\n\n    const sync = () => {\n      body = dialog.querySelector<HTMLElement>(BODY_SELECTOR);\n\n      mutationObserver.disconnect();\n      resizeObserver.disconnect();\n\n      mutationObserver.observe(dialog, { childList: true });\n\n      for (const form of Array.from(dialog.querySelectorAll(':scope > form'))) {\n        mutationObserver.observe(form, { childList: true });\n      }\n\n      if (body) {\n        mutationObserver.observe(body, { childList: true });\n        resizeObserver.observe(body);\n\n        for (const child of Array.from(body.children)) {\n          resizeObserver.observe(child);\n        }\n      }\n\n      measure();\n    };\n\n    sync();\n\n    return () => {\n      mutationObserver.disconnect();\n      resizeObserver.disconnect();\n    };\n  }, [dialogRef]);\n\n  return overflows;\n}\n"],"mappings":";;;;;;AAMA,MAAMG,qBAAqB;AAO3B,MAAMC,gBACJ;;;;;;;;;;;;AAaF,SAAOC,mBAAAC,WAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CACL,MAAA,CAAAC,WAAAC,gBAAkCT,SAAS,MAAM;CAAC,IAAAU;CAAA,IAAAC;AAAA,KAAAL,EAAA,OAAAD,WAAA;AAElCK,aAAA;GACd,MAAAE,SAAeP,UAASQ;AAExB,OAAI,CAACD,UAAU,OAAOE,mBAAmB,YAAW;GAEpD,IAAAC,OAA+B;GAE/B,MAAAC,gBAAgB;AACdP,iBACE,CAAC,CAACM,QAAQA,KAAIE,eAAgBF,KAAIG,eAAgBhB,mBACnD;;GAGH,MAAAiB,iBAAuB,IAAIL,eAAeE,QAAQ;GAOlD,MAAAI,mBAAyB,IAAIC,uBAAuBC,MAAM,CAAC;GAE3D,MAAAA,aAAa;AACXP,WAAOH,OAAMW,cAA4BpB,cAAc;AAEvDiB,qBAAgBI,YAAa;AAC7BL,mBAAcK,YAAa;AAE3BJ,qBAAgBK,QAASb,QAAQ,EAAAc,WAAa,MAAM,CAAC;AAErD,SAAK,MAAAC,QAAcC,MAAKC,KAAMjB,OAAMkB,iBAAkB,gBAAgB,CAAC,CACrEV,kBAAgBK,QAASE,MAAM,EAAAD,WAAa,MAAM,CAAC;AAGrD,QAAIX,MAAI;AACNK,sBAAgBK,QAASV,MAAM,EAAAW,WAAa,MAAM,CAAC;AACnDP,oBAAcM,QAASV,KAAK;AAE5B,UAAK,MAAAgB,SAAeH,MAAKC,KAAMd,KAAIiB,SAAU,CAC3Cb,gBAAcM,QAASM,MAAM;;AAIjCf,aAAS;;AAGXM,SAAM;AAAA,gBAEC;AACLF,qBAAgBI,YAAa;AAC7BL,mBAAcK,YAAa;;;AAE5Bb,OAAA,CAACN,UAAU;AAAAC,IAAA,KAAAD;AAAAC,IAAA,KAAAI;AAAAJ,IAAA,KAAAK;QAAA;AAAAD,OAAAJ,EAAA;AAAAK,OAAAL,EAAA;;AApDdL,mBAAgBS,IAoDbC,GAAY;AAAA,QAERH"}

package/dist/components/overlays/Dialog/use-dialog-container.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { DialogContainer } from "./DialogContainer.js";

package/dist/components/overlays/Modal/Modal.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _Overlay } from "./Overlay.js";
 import { _Underlay } from "./Underlay.js";

package/dist/components/overlays/Modal/OpenTransitionContext.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { createContext, useContext } from "react";
 
 //#region src/components/overlays/Modal/OpenTransitionContext.tsx

package/dist/components/overlays/Modal/Overlay.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { markFocusRestoreWindow } from "../../../utils/react/programmaticFocus.js";
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";
 import { Provider, useProviderProps } from "../../../provider.js";

package/dist/components/overlays/Modal/Popover.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _Overlay } from "./Overlay.js";
 import { useOverlayEscapeGuard } from "../../../utils/react/useOverlayEscapeGuard.js";

package/dist/components/overlays/Modal/Tray.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _Overlay } from "./Overlay.js";
 import { _Underlay } from "./Underlay.js";

package/dist/components/overlays/Modal/Underlay.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { c } from "react-compiler-runtime";
 import { tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/overlays/Notifications/Notification.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { useNotificationContext } from "./NotificationContext.js";
 import { c } from "react-compiler-runtime";
 import { useEffect, useRef } from "react";

package/dist/components/overlays/Notifications/NotificationAction.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { c } from "react-compiler-runtime";

package/dist/components/overlays/Notifications/NotificationCard.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-22ee7cb | Cube Dev Team */
 import { Block } from "../../Block.js";
 import { ItemActionProvider } from "../../actions/ItemActionContext.js";
 import { Space } from "../../layout/Space.js";