@cube-dev/ui-kit 0.198.2 → 0.199.1

package/dist/components/other/Calendar/RangeCalendar.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { useProviderProps } from "../../../provider.js";
 import { CalendarPanel } from "./CalendarPanel.js";
 import { c } from "react/compiler-runtime";

package/dist/components/other/Calendar/styled.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 //#region src/components/other/Calendar/styled.tsx
 /**

package/dist/components/other/CubeLogo/CubeLogo.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { Icon } from "../../../icons/Icon.js";
 import { c } from "react/compiler-runtime";
 import { mergeStyles, tasty } from "@tenphi/tasty";

package/dist/components/other/NoDataIcon/NoDataIcon.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { wrapIcon } from "../../../icons/wrap-icon.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/other/NoDataIcon/NoDataIcon.tsx

package/dist/components/overlays/AlertDialog/AlertDialog.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { Paragraph } from "../../content/Paragraph.js";
 import { Title as _Title } from "../../content/Title.js";

package/dist/components/overlays/AlertDialog/AlertDialogApiProvider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { AlertDialogZone } from "./AlertDialogZone.js";
 import { c } from "react/compiler-runtime";
 import { createContext, useContext, useLayoutEffect, useRef, useState } from "react";

package/dist/components/overlays/AlertDialog/AlertDialogZone.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { Portal } from "../../portal/Portal.js";
 import { DialogContainer } from "../Dialog/DialogContainer.js";
 import { AlertDialog as _AlertDialog } from "./AlertDialog.js";

package/dist/components/overlays/Dialog/Dialog.d.ts

@@ -3,7 +3,13 @@ import { BaseProps, BaseStyleProps, BlockStyleProps, DimensionStyleProps, Styles
 import { ReactElement } from "react";
 import { AriaDialogProps } from "react-aria";
 //#region src/components/overlays/Dialog/Dialog.d.ts
-export interface CubeDialogProps extends Omit<BaseProps, 'role'>, AriaDialogProps, BaseStyleProps, BlockStyleProps, DimensionStyleProps {
+export interface CubeDialogProps extends Omit<BaseProps, 'role'>, AriaDialogProps, BaseStyleProps, BlockStyleProps, Omit<DimensionStyleProps, 'width'> {
+  /**
+   * The dialog's preferred width, one value (`520px`, `65x`, `600`). It keeps
+   * the type's maximum, so the dialog still fits a phone, and replaces
+   * `$min-dialog-size`. To clamp the width yourself, set `styles.width`.
+   */
+  width?: string | number;
   /** The size of the dialog */
   size?: 'S' | 'M' | 'L' | 'small' | 'medium' | 'large';
   /**

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { SlotProvider } from "../../../utils/react/Slots.js";
@@ -36,11 +36,17 @@ const DialogElement = tasty({
 			"": "relative",
 			"type=panel": "absolute"
 		},
+		"$dialog-width-limit": {
+			"": "$dialog-max-size",
+			"type=tray": "100%",
+			"type=fullscreenTakeover | type=panel": "100dvw"
+		},
 		width: {
-			"": "$min-dialog-size $dialog-size (100dvw - 8x)",
-			"type=fullscreen": "(100dvw - 8x) (100dvw - 8x)",
+			"": "$min-dialog-size $dialog-size $dialog-width-limit",
+			"type=fullscreen": "$dialog-max-size $dialog-max-size",
 			"type=fullscreenTakeover": "100dvw 100dvw",
-			"type=panel": "auto"
+			"type=panel": "auto",
+			"custom-width": "initial $dialog-size $dialog-width-limit"
 		},
 		height: {
 			"": "auto (100dvh - 8x)",
@@ -170,7 +176,7 @@ const Dialog = forwardRef(function Dialog(props, ref) {
 });
 const DialogContent = forwardRef(function DialogContent(props, ref) {
 	let { type = "modal", ...contextProps } = useDialogContext();
-	let { qa, children, size = "M", isDismissable = type === "popover" ? void 0 : contextProps.isDismissable, onDismiss = contextProps.onClose, closeIcon, closeButtonStyles, style, ...otherProps } = props;
+	let { qa, children, size = "M", isDismissable = type === "popover" ? void 0 : contextProps.isDismissable, onDismiss = contextProps.onClose, closeIcon, closeButtonStyles, width, tokens, style, ...otherProps } = props;
 	size = sizeMap[size.toUpperCase()] || size;
 	const styles = extractStyles(otherProps, STYLES_LIST);
 	const { t } = useI18n();
@@ -296,11 +302,15 @@ const DialogContent = forwardRef(function DialogContent(props, ref) {
 				if (isRefocusingRef.current) event.stopPropagation();
 			}
 		}),
-		mods: { dismissable: isDismissable },
-		style: {
-			"--dialog-size": `${sizePxMap[size] || sizePxMap.small}px`,
-			...style
+		mods: {
+			dismissable: isDismissable,
+			"custom-width": width != null
+		},
+		tokens: {
+			"$dialog-size": width == null ? `${sizePxMap[size] || sizePxMap.small}px` : typeof width === "number" ? `${width}px` : width,
+			...tokens
 		},
+		style,
 		"data-type": type,
 		"data-size": size,
 		children: [dismissButton, /* @__PURE__ */ jsxs(SlotProvider, {

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

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","names":["createFocusManager","getFocusableTreeWalker","focusSafely","getInteractionModality","focusWithoutScrolling","isFocusable","runAfterTransition","useObjectRef","BASE_STYLES","BaseProps","BaseStyleProps","BLOCK_STYLES","BlockStyleProps","DIMENSION_STYLES","DimensionStyleProps","FLOW_STYLES","Styles","tasty","FocusEvent","forwardRef","ReactElement","Ref","useEffect","useRef","AriaDialogProps","DismissButton","FocusScope","useDialog","useI18n","CloseIcon","mergeProps","SlotProvider","extractStyles","ItemButton","useOpenTransitionContext","trapsFocus","useDialogContext","useContentOverflow","useRetainedDialogFocus","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","findPriorityFocusElement","dialog","HTMLElement","marked","querySelectorAll","element","Array","from","reverse","target","tabbable","nextNode","button","getAttribute","querySelector","Dialog","props","ref","$","_c","transitionState","isShown","context","t0","content","t1","isOpen","shouldContainFocus","t2","shouldRestoreFocus","t3","DialogContent","HTMLDivElement","contextProps","children","undefined","onClose","style","otherProps","toUpperCase","t","domRef","isFocusInTreeRef","isRetained","isTrapping","isRefocusingRef","mountedAtRef","current","Date","now","dialogProps","titleProps","contentProps","dismissButton","timer","ReturnType","setTimeout","isClosed","contains","document","activeElement","body","blur","isFocusOutsideDialog","isFocusOnDialogShell","priorityElement","focus","focused","focusManager","focusFirst","clearTimeout","contentOverflows","slots","title","level","preset","id","flexGrow","padding","header","ellipsis","placeItems","placeContent","footer","mods","buttonGroup","onFocus","onBlur","event","stopPropagation","dismissable","ItemButton","_c","mergeProps"],"sources":["../../../../src/components/overlays/Dialog/Dialog.tsx"],"sourcesContent":["import { createFocusManager, getFocusableTreeWalker } from '@react-aria/focus';\nimport { focusSafely, getInteractionModality } from '@react-aria/interactions';\nimport {\n  focusWithoutScrolling,\n  isFocusable,\n  runAfterTransition,\n  useObjectRef,\n} 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 {\n  FocusEvent,\n  forwardRef,\n  ReactElement,\n  Ref,\n  useEffect,\n  useRef,\n} 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 { trapsFocus, useDialogContext } from './context';\nimport { useContentOverflow } from './use-content-overflow';\nimport { useRetainedDialogFocus } from './use-retained-dialog-focus';\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\n    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  /**\n   * Whether the dialog shows its close button. Defaults to its DialogTrigger's\n   * or DialogContainer's `isDismissable`, except in a popover.\n   */\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 * The control a dialog focuses when it opens: the last one marked\n * `data-autofocus` that can take focus, as kit controls mark themselves for\n * `autoFocus` (the last of several takes focus as they mount), or the first\n * control of a marked field (a date field's first segment). Otherwise a\n * submit or primary button, which in an alert dialog is never a destructive\n * (`danger`) one: a reflexive Enter would run it.\n */\nfunction findPriorityFocusElement(dialog: HTMLElement) {\n  const marked = dialog.querySelectorAll<HTMLElement>('[data-autofocus]');\n\n  for (const element of Array.from(marked).reverse()) {\n    const target = isFocusable(element)\n      ? element\n      : getFocusableTreeWalker(element, { tabbable: true }).nextNode();\n\n    if (target) return target as HTMLElement;\n  }\n\n  const button =\n    dialog.getAttribute('role') === 'alertdialog'\n      ? 'button:not([data-theme=\"danger\"])'\n      : 'button';\n\n  return dialog.querySelector<HTMLElement>(\n    `${button}[type=\"submit\"], ${button}[data-type=\"primary\"]`,\n  );\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 transitionState = useOpenTransitionContext()?.transitionState;\n\n  // From the first frame of the enter transition, not only once it has\n  // ended: a Tab pressed while the dialog animates in would otherwise land on\n  // the page behind it, and nothing would pull it back. Released as soon as\n  // the dialog closes, so focus can return to the trigger during the exit.\n  const isShown = transitionState === 'enter' || transitionState === 'entered';\n\n  const context = useDialogContext();\n\n  const content = <DialogContent key=\"content\" {...props} ref={ref} />;\n\n  const shouldContainFocus = isShown && !!context.isOpen && trapsFocus(context);\n\n  return (\n    // This component traps the focus inside the dialog and restores it when\n    // it unmounts (a retained dialog never does, so `DialogContent` moves\n    // focus for that one). The restore is the one that matters for popover-type dialogs\n    // — `DialogTrigger`'s own restore is a no-op there — so\n    // `shouldRestoreFocus` 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    // A popover shows a close button only when its `Dialog` asks for one: its\n    // trigger's `isDismissable` decides whether an outside press closes it.\n    isDismissable = type === 'popover' ? undefined : 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\n  // Whether focus is in the dialog or in anything opened from it, portals\n  // included: React focus events bubble through the component tree.\n  const isFocusInTreeRef = useRef(false);\n  const isRetained = useRetainedDialogFocus(domRef, isFocusInTreeRef);\n  const isTrapping = trapsFocus({ ...contextProps, type });\n\n  // Set while the dialog refocuses itself, so the blur in between does not\n  // reach overlays that close when focus leaves them.\n  const isRefocusingRef = useRef(false);\n\n  // When the dialog mounted: `useDialog` refocuses it half a second later.\n  const mountedAtRef = useRef(0);\n\n  useEffect(() => {\n    mountedAtRef.current = Date.now();\n  }, []);\n\n  // `contentProps` carries an id only for `role=\"alertdialog\"` without an\n  // explicit `aria-describedby`: an alert is described by its message, while a\n  // plain dialog links nothing, so opening a form does not read it aloud.\n  let { dialogProps, titleProps, contentProps } = 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    // The pending timer: this one, then the refocus it may start.\n    let timer: ReturnType<typeof setTimeout> | undefined;\n    let isClosed = false;\n\n    if (contextProps.isOpen) {\n      timer = setTimeout(() => {\n        if (!domRef.current) return;\n\n        // `useDialog` focuses the dialog itself when it mounts, without\n        // scrolling, unless focus is already inside. A retained dialog opens\n        // without remounting, so do the same here: the rules below then run as\n        // for a fresh dialog, and kept content keeps its scroll.\n        if (isRetained && !domRef.current.contains(document.activeElement)) {\n          focusSafely(domRef.current);\n\n          // As `useDialog` does next: VoiceOver on iOS announces a dialog only\n          // once it has rendered, so blur and refocus it half a second later\n          // if focus is still on it or lost to `<body>`. Unless the refocus\n          // `useDialog` set up when the dialog mounted is still to come.\n          if (Date.now() - mountedAtRef.current >= 500) {\n            timer = setTimeout(() => {\n              const dialog = domRef.current;\n              const activeElement = document.activeElement;\n\n              if (\n                !dialog ||\n                (activeElement !== dialog && activeElement !== document.body)\n              ) {\n                return;\n              }\n\n              isRefocusingRef.current = true;\n              dialog.blur();\n              focusSafely(dialog);\n              isRefocusingRef.current = false;\n            }, 500);\n          }\n        }\n\n        const activeElement = document.activeElement;\n        const isFocusOutsideDialog = !domRef.current.contains(activeElement);\n        const isFocusOnDialogShell = activeElement === domRef.current;\n\n        // Priority 1: an autofocused control, or a submit or primary button\n        const priorityElement = findPriorityFocusElement(domRef.current);\n\n        if (priorityElement && (isFocusOutsideDialog || isFocusOnDialogShell)) {\n          priorityElement.focus();\n          return;\n        }\n\n        if (isFocusOutsideDialog && getInteractionModality() === 'virtual') {\n          // A screen reader's cursor: the dialog itself takes focus once the\n          // open transition ends, as `focusSafely` does it. Then also when\n          // something moved focus meanwhile, as a closing menu returns it to\n          // its trigger, unless a dialog that leaves the page usable lost it\n          // to a control there.\n          runAfterTransition(() => {\n            const dialog = domRef.current;\n            const focused = document.activeElement;\n\n            if (\n              isClosed ||\n              !dialog ||\n              dialog.contains(focused) ||\n              (!isTrapping &&\n                focused !== document.body &&\n                focused !== activeElement)\n            ) {\n              return;\n            }\n\n            focusWithoutScrolling(dialog);\n          });\n        } else 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\n    return () => {\n      isClosed = true;\n      clearTimeout(timer);\n    };\n  }, [contextProps.isOpen, isRetained, isTrapping]);\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      // `null` rather than `undefined` when there is none: slots reach nested\n      // slot providers, and `undefined` does not override, so a dialog opened\n      // inside an alert dialog would repeat the alert's message id.\n      id: contentProps.id ?? null,\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      {...mergeProps(dialogProps, {\n        onFocus() {\n          isFocusInTreeRef.current = true;\n        },\n        onBlur(event: FocusEvent) {\n          isFocusInTreeRef.current = false;\n\n          if (isRefocusingRef.current) event.stopPropagation();\n        },\n      })}\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            aria-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","getFocusableTreeWalker","focusSafely","getInteractionModality","focusWithoutScrolling","isFocusable","runAfterTransition","useObjectRef","BASE_STYLES","BaseProps","BaseStyleProps","BLOCK_STYLES","BlockStyleProps","DIMENSION_STYLES","DimensionStyleProps","FLOW_STYLES","Styles","tasty","FocusEvent","forwardRef","ReactElement","Ref","useEffect","useRef","AriaDialogProps","DismissButton","FocusScope","useDialog","useI18n","CloseIcon","mergeProps","SlotProvider","extractStyles","ItemButton","useOpenTransitionContext","trapsFocus","useDialogContext","useContentOverflow","useRetainedDialogFocus","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","findPriorityFocusElement","dialog","HTMLElement","marked","querySelectorAll","element","Array","from","reverse","target","tabbable","nextNode","button","getAttribute","querySelector","Dialog","props","ref","$","_c","transitionState","isShown","context","t0","content","t1","isOpen","shouldContainFocus","t2","shouldRestoreFocus","t3","DialogContent","HTMLDivElement","contextProps","children","undefined","onClose","tokens","style","otherProps","toUpperCase","t","domRef","isFocusInTreeRef","isRetained","isTrapping","isRefocusingRef","mountedAtRef","current","Date","now","dialogProps","titleProps","contentProps","dismissButton","timer","ReturnType","setTimeout","isClosed","contains","document","activeElement","body","blur","isFocusOutsideDialog","isFocusOnDialogShell","priorityElement","focus","focused","focusManager","focusFirst","clearTimeout","contentOverflows","slots","title","level","preset","id","flexGrow","padding","header","ellipsis","placeItems","placeContent","footer","mods","buttonGroup","onFocus","onBlur","event","stopPropagation","dismissable","ItemButton","_c","mergeProps"],"sources":["../../../../src/components/overlays/Dialog/Dialog.tsx"],"sourcesContent":["import { createFocusManager, getFocusableTreeWalker } from '@react-aria/focus';\nimport { focusSafely, getInteractionModality } from '@react-aria/interactions';\nimport {\n  focusWithoutScrolling,\n  isFocusable,\n  runAfterTransition,\n  useObjectRef,\n} 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 {\n  FocusEvent,\n  forwardRef,\n  ReactElement,\n  Ref,\n  useEffect,\n  useRef,\n} 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 { trapsFocus, useDialogContext } from './context';\nimport { useContentOverflow } from './use-content-overflow';\nimport { useRetainedDialogFocus } from './use-retained-dialog-focus';\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    // The widest the dialog gets, also under a `width`. A tray is held by its\n    // shell, whose own `styles` widen it; a takeover and a panel may span the\n    // viewport.\n    '$dialog-width-limit': {\n      '': '$dialog-max-size',\n      'type=tray': '100%',\n      'type=fullscreenTakeover | type=panel': '100dvw',\n    },\n    width: {\n      '': '$min-dialog-size $dialog-size $dialog-width-limit',\n      'type=fullscreen': '$dialog-max-size $dialog-max-size',\n      'type=fullscreenTakeover': '100dvw 100dvw',\n      'type=panel': 'auto',\n      // A `width` is the preferred width in `$dialog-size`: it keeps the\n      // limit, and replaces the floor.\n      'custom-width': 'initial $dialog-size $dialog-width-limit',\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\n    Omit<BaseProps, 'role'>,\n    AriaDialogProps,\n    BaseStyleProps,\n    BlockStyleProps,\n    Omit<DimensionStyleProps, 'width'> {\n  /**\n   * The dialog's preferred width, one value (`520px`, `65x`, `600`). It keeps\n   * the type's maximum, so the dialog still fits a phone, and replaces\n   * `$min-dialog-size`. To clamp the width yourself, set `styles.width`.\n   */\n  width?: string | number;\n  /** The size of the dialog */\n  size?: 'S' | 'M' | 'L' | 'small' | 'medium' | 'large';\n  /**\n   * Whether the dialog shows its close button. Defaults to its DialogTrigger's\n   * or DialogContainer's `isDismissable`, except in a popover.\n   */\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 * The control a dialog focuses when it opens: the last one marked\n * `data-autofocus` that can take focus, as kit controls mark themselves for\n * `autoFocus` (the last of several takes focus as they mount), or the first\n * control of a marked field (a date field's first segment). Otherwise a\n * submit or primary button, which in an alert dialog is never a destructive\n * (`danger`) one: a reflexive Enter would run it.\n */\nfunction findPriorityFocusElement(dialog: HTMLElement) {\n  const marked = dialog.querySelectorAll<HTMLElement>('[data-autofocus]');\n\n  for (const element of Array.from(marked).reverse()) {\n    const target = isFocusable(element)\n      ? element\n      : getFocusableTreeWalker(element, { tabbable: true }).nextNode();\n\n    if (target) return target as HTMLElement;\n  }\n\n  const button =\n    dialog.getAttribute('role') === 'alertdialog'\n      ? 'button:not([data-theme=\"danger\"])'\n      : 'button';\n\n  return dialog.querySelector<HTMLElement>(\n    `${button}[type=\"submit\"], ${button}[data-type=\"primary\"]`,\n  );\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 transitionState = useOpenTransitionContext()?.transitionState;\n\n  // From the first frame of the enter transition, not only once it has\n  // ended: a Tab pressed while the dialog animates in would otherwise land on\n  // the page behind it, and nothing would pull it back. Released as soon as\n  // the dialog closes, so focus can return to the trigger during the exit.\n  const isShown = transitionState === 'enter' || transitionState === 'entered';\n\n  const context = useDialogContext();\n\n  const content = <DialogContent key=\"content\" {...props} ref={ref} />;\n\n  const shouldContainFocus = isShown && !!context.isOpen && trapsFocus(context);\n\n  return (\n    // This component traps the focus inside the dialog and restores it when\n    // it unmounts (a retained dialog never does, so `DialogContent` moves\n    // focus for that one). The restore is the one that matters for popover-type dialogs\n    // — `DialogTrigger`'s own restore is a no-op there — so\n    // `shouldRestoreFocus` 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    // A popover shows a close button only when its `Dialog` asks for one: its\n    // trigger's `isDismissable` decides whether an outside press closes it.\n    isDismissable = type === 'popover' ? undefined : contextProps.isDismissable,\n    onDismiss = contextProps.onClose,\n    closeIcon,\n    closeButtonStyles,\n    width,\n    tokens,\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\n  // Whether focus is in the dialog or in anything opened from it, portals\n  // included: React focus events bubble through the component tree.\n  const isFocusInTreeRef = useRef(false);\n  const isRetained = useRetainedDialogFocus(domRef, isFocusInTreeRef);\n  const isTrapping = trapsFocus({ ...contextProps, type });\n\n  // Set while the dialog refocuses itself, so the blur in between does not\n  // reach overlays that close when focus leaves them.\n  const isRefocusingRef = useRef(false);\n\n  // When the dialog mounted: `useDialog` refocuses it half a second later.\n  const mountedAtRef = useRef(0);\n\n  useEffect(() => {\n    mountedAtRef.current = Date.now();\n  }, []);\n\n  // `contentProps` carries an id only for `role=\"alertdialog\"` without an\n  // explicit `aria-describedby`: an alert is described by its message, while a\n  // plain dialog links nothing, so opening a form does not read it aloud.\n  let { dialogProps, titleProps, contentProps } = 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    // The pending timer: this one, then the refocus it may start.\n    let timer: ReturnType<typeof setTimeout> | undefined;\n    let isClosed = false;\n\n    if (contextProps.isOpen) {\n      timer = setTimeout(() => {\n        if (!domRef.current) return;\n\n        // `useDialog` focuses the dialog itself when it mounts, without\n        // scrolling, unless focus is already inside. A retained dialog opens\n        // without remounting, so do the same here: the rules below then run as\n        // for a fresh dialog, and kept content keeps its scroll.\n        if (isRetained && !domRef.current.contains(document.activeElement)) {\n          focusSafely(domRef.current);\n\n          // As `useDialog` does next: VoiceOver on iOS announces a dialog only\n          // once it has rendered, so blur and refocus it half a second later\n          // if focus is still on it or lost to `<body>`. Unless the refocus\n          // `useDialog` set up when the dialog mounted is still to come.\n          if (Date.now() - mountedAtRef.current >= 500) {\n            timer = setTimeout(() => {\n              const dialog = domRef.current;\n              const activeElement = document.activeElement;\n\n              if (\n                !dialog ||\n                (activeElement !== dialog && activeElement !== document.body)\n              ) {\n                return;\n              }\n\n              isRefocusingRef.current = true;\n              dialog.blur();\n              focusSafely(dialog);\n              isRefocusingRef.current = false;\n            }, 500);\n          }\n        }\n\n        const activeElement = document.activeElement;\n        const isFocusOutsideDialog = !domRef.current.contains(activeElement);\n        const isFocusOnDialogShell = activeElement === domRef.current;\n\n        // Priority 1: an autofocused control, or a submit or primary button\n        const priorityElement = findPriorityFocusElement(domRef.current);\n\n        if (priorityElement && (isFocusOutsideDialog || isFocusOnDialogShell)) {\n          priorityElement.focus();\n          return;\n        }\n\n        if (isFocusOutsideDialog && getInteractionModality() === 'virtual') {\n          // A screen reader's cursor: the dialog itself takes focus once the\n          // open transition ends, as `focusSafely` does it. Then also when\n          // something moved focus meanwhile, as a closing menu returns it to\n          // its trigger, unless a dialog that leaves the page usable lost it\n          // to a control there.\n          runAfterTransition(() => {\n            const dialog = domRef.current;\n            const focused = document.activeElement;\n\n            if (\n              isClosed ||\n              !dialog ||\n              dialog.contains(focused) ||\n              (!isTrapping &&\n                focused !== document.body &&\n                focused !== activeElement)\n            ) {\n              return;\n            }\n\n            focusWithoutScrolling(dialog);\n          });\n        } else 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\n    return () => {\n      isClosed = true;\n      clearTimeout(timer);\n    };\n  }, [contextProps.isOpen, isRetained, isTrapping]);\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      // `null` rather than `undefined` when there is none: slots reach nested\n      // slot providers, and `undefined` does not override, so a dialog opened\n      // inside an alert dialog would repeat the alert's message id.\n      id: contentProps.id ?? null,\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      {...mergeProps(dialogProps, {\n        onFocus() {\n          isFocusInTreeRef.current = true;\n        },\n        onBlur(event: FocusEvent) {\n          isFocusInTreeRef.current = false;\n\n          if (isRefocusingRef.current) event.stopPropagation();\n        },\n      })}\n      mods={{ dismissable: isDismissable, 'custom-width': width != null }}\n      tokens={{\n        '$dialog-size':\n          width == null\n            ? `${sizePxMap[size] || sizePxMap.small}px`\n            : typeof width === 'number'\n              ? `${width}px`\n              : width,\n        ...tokens,\n      }}\n      style={style}\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            aria-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.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { Modal as _Modal } from "../Modal/Modal.js";
 import { Tray as _Tray } from "../Modal/Tray.js";
 import { DialogContext } from "./context.js";

package/dist/components/overlays/Dialog/DialogForm.d.ts

@@ -7,7 +7,7 @@ import { CubeFormProps } from "../../form/Form/Form.js";
 import { CubeSubmitButtonProps } from "../../form/Form/SubmitButton/SubmitButton.js";
 import { ReactElement } from "react";
 //#region src/components/overlays/Dialog/DialogForm.d.ts
-export interface CubeDialogFormProps<T extends FieldTypes = FieldTypes> extends Omit<CubeDialogProps, 'children'>, Omit<CubeFormProps<T>, 'role' | 'children'> {
+export interface CubeDialogFormProps<T extends FieldTypes = FieldTypes> extends Omit<CubeDialogProps, 'children'>, Omit<CubeFormProps<T>, 'role' | 'children' | 'width'> {
   /** Whether the submit button has a `danger` theme */
   danger?: boolean;
   /** Properties for submit button. Use `children` to change text. */
@@ -30,7 +30,8 @@ export interface CubeDialogFormRef {
 /**
  * DialogForms are a specific type of Dialog. They contain forms to fill.
  */
-export interface ModernDialogFormProps<T extends FieldTypes = FieldTypes> extends Omit<CubeDialogFormProps<T>, keyof CubeFormProps<T> | 'submitProps'>, Omit<ModernFormProps<T>, 'role' | 'children'> {
+export interface ModernDialogFormProps<T extends FieldTypes = FieldTypes> extends Omit<CubeDialogFormProps<T>, keyof CubeFormProps<T> | 'submitProps'>, Omit<ModernFormProps<T>, 'role' | 'children' | 'width'> {
+  width?: CubeDialogProps['width'];
   children?: CubeDialogFormProps<T>['children'];
   submitProps?: Omit<CubeSubmitButtonProps<T>, 'form'>;
 }

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { Title as _Title } from "../../content/Title.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { Button } from "../../actions/Button/Button.js";

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

@@ -1 +1 @@
-{"version":3,"file":"DialogForm.js","names":["useI18n","Button","ButtonGroup","Content","Footer","Header","Title","isModernFormController","Form","SubmitButton","useForm","useDialogContext","withDefaultButtonText","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","_c","Title","Form","SubmitButton"],"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 { withDefaultButtonText } from './default-button-text';\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\n    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 `children` to change text. */\n  submitProps?: Omit<CubeButtonProps, 'form'>;\n  /** Properties for cancel button. Use `children` 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\n    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                {...withDefaultButtonText(\n                  submitProps,\n                  t('dialogForm.submit', 'Submit'),\n                )}\n              />\n              <Button\n                qa={`${qa || ''}CancelButton`}\n                onPress={onLocalDismiss}\n                {...withDefaultButtonText(\n                  cancelProps,\n                  t('dialogForm.cancel', 'Cancel'),\n                )}\n              />\n            </ButtonGroup>\n          </Footer>\n        ) : undefined}\n      </Form>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAoEA,SAAOqC,WAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CAAA,IAAAC;CAAA,IAAAF,EAAA,OAAAD,OAAA;EAGEG,KAAAlC,uBAAuB+B,MAAKI,IAInC,IAHE,oBAAC,kBAAD,EAAiB,GAAMJ,MAAiC,CAAA,IAExD,oBAAC,kBAAD,EAAiB,GAAMA,MAA+B,CAAA;EACvDC,EAAA,KAAAD;EAAAC,EAAA,KAAAE;CAAA,OAAAA,KAAAF,EAAA;CAAA,OAJME;AAIN;AAGH,SAASE,iBAAuCL,OAA+B;CAC7E;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;CAEJ,CAACI,QAAQhC,QAAQgC,IAAI;CAErB,MAAM,EAAEoB,MAAM9D,QAAQ;CACtB,MAAM,EAAE+D,YAAYpD,iBAAiB;CAErC,SAASqB,iBAAiB;EACxB+B,UAAU;EACVhB,YAAY;EAEZ,IAAI,CAACnB,UAEHoC,iBAAiB;GACftB,MAAMuB,YAAY;EACpB,GAAG,GAAG;CAEV;CAEA,OACE,qBAAC,QAAD;EACE,IAAI,GAAGrB,MAAM,GAAE;EACTe;EACKC;EACX,GAAIC;EAJN,UAAA,CAME,oBAAC,QAAD,EAAA,UACE,oBAACQ,QAAD;GAAO,UAAA;GAAUvC,UAAAA;EAAa,CAAA,EACxB,CAAA,GAQR,qBAACwC,OAAD;GACE,IAAI1B,MAAM;GACJF;GACAG;GACSC;GACFK;GACEC;GACDC;GACMC;GACRC;GACDC;GACFC;GACQC;GACjB,UAAU,OAAOQ,SAAS;IACxB,MAAMlB,WAAWkB,IAAI;IAErBH,UAAU;IAEV,IAAI,CAACnC,UAEHoC,iBAAiB;KACftB,KAAKuB,YAAY;IACnB,GAAG,GAAG;GAEV;GACgBhB;GACAC;GA1BlB,UAAA,CA4BE,oBAAC,SAAD,EAAA,UACG,OAAOnB,aAAa,aAAaA,SAASC,cAAc,IAAID,SACtD,CAAA,GAER,CAACF,YACA,oBAAC,QAAD,EAAA,UACE,qBAAC,aAAD,EAAA,UAAA,CACE,oBAAC0C,eAAD;IACE,IAAI,GAAG3B,MAAM,GAAE;IACf,OAAOnB,SAAS,WAAW0C,KAAAA;IAC3B,GAAIvD,sBACFc,aACAoC,EAAE,qBAAqB,QAAQ,CACjC;GAAE,CAAA,GAEJ,oBAAC,QAAD;IACE,IAAI,GAAGlB,MAAM,GAAE;IACf,SAASZ;IACT,GAAIpB,sBACFe,aACAmC,EAAE,qBAAqB,QAAQ,CACjC;GAAE,CAAA,CAEO,EAAA,CAAA,EACP,CAAA,IACNK,KAAAA,CACA;EACA,CAAA,CAAA;;AAEZ"}
+{"version":3,"file":"DialogForm.js","names":["useI18n","Button","ButtonGroup","Content","Footer","Header","Title","isModernFormController","Form","SubmitButton","useForm","useDialogContext","withDefaultButtonText","CubeDialogProps","Dialog","ModernDialogForm","ReactElement","CubeButtonProps","CubeFormProps","ModernFormProps","CubeSubmitButtonProps","FieldTypes","CubeDialogFormProps","Omit","T","danger","submitProps","cancelProps","preserve","noActions","title","children","onLocalDismiss","CubeDialogFormRef","open","close","ModernDialogFormProps","width","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","_c","Title","Form","SubmitButton"],"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 { withDefaultButtonText } from './default-button-text';\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\n    Omit<CubeDialogProps, 'children'>,\n    Omit<CubeFormProps<T>, 'role' | 'children' | 'width'> {\n  /** Whether the submit button has a `danger` theme */\n  danger?: boolean;\n  /** Properties for submit button. Use `children` to change text. */\n  submitProps?: Omit<CubeButtonProps, 'form'>;\n  /** Properties for cancel button. Use `children` 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\n    Omit<CubeDialogFormProps<T>, keyof CubeFormProps<T> | 'submitProps'>,\n    Omit<ModernFormProps<T>, 'role' | 'children' | 'width'> {\n  width?: CubeDialogProps['width'];\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                {...withDefaultButtonText(\n                  submitProps,\n                  t('dialogForm.submit', 'Submit'),\n                )}\n              />\n              <Button\n                qa={`${qa || ''}CancelButton`}\n                onPress={onLocalDismiss}\n                {...withDefaultButtonText(\n                  cancelProps,\n                  t('dialogForm.cancel', 'Cancel'),\n                )}\n              />\n            </ButtonGroup>\n          </Footer>\n        ) : undefined}\n      </Form>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAqEA,SAAOsC,WAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CAAA,IAAAC;CAAA,IAAAF,EAAA,OAAAD,OAAA;EAGEG,KAAAnC,uBAAuBgC,MAAKI,IAInC,IAHE,oBAAC,kBAAD,EAAiB,GAAMJ,MAAiC,CAAA,IAExD,oBAAC,kBAAD,EAAiB,GAAMA,MAA+B,CAAA;EACvDC,EAAA,KAAAD;EAAAC,EAAA,KAAAE;CAAA,OAAAA,KAAAF,EAAA;CAAA,OAJME;AAIN;AAGH,SAASE,iBAAuCL,OAA+B;CAC7E;CAGA,IAAI,EACFM,IACAC,MACAH,MACAI,eACAC,WACAC,UACAC,gBACAC,gBACAC,aACAC,eACAC,cACAC,oBACAC,YACAC,WACAC,SACAC,iBACA5B,UACAN,QACAI,WACAH,aACAC,aACAC,UACAE,OACA8B,MACAC,WACA,GAAGC,gBACDvB;CAEJ,CAACI,QAAQjC,QAAQiC,IAAI;CAErB,MAAM,EAAEoB,MAAM/D,QAAQ;CACtB,MAAM,EAAEgE,YAAYrD,iBAAiB;CAErC,SAASqB,iBAAiB;EACxBgC,UAAU;EACVhB,YAAY;EAEZ,IAAI,CAACpB,UAEHqC,iBAAiB;GACftB,MAAMuB,YAAY;EACpB,GAAG,GAAG;CAEV;CAEA,OACE,qBAAC,QAAD;EACE,IAAI,GAAGrB,MAAM,GAAE;EACTe;EACKC;EACX,GAAIC;EAJN,UAAA,CAME,oBAAC,QAAD,EAAA,UACE,oBAACQ,QAAD;GAAO,UAAA;GAAUxC,UAAAA;EAAa,CAAA,EACxB,CAAA,GAQR,qBAACyC,OAAD;GACE,IAAI1B,MAAM;GACJF;GACAG;GACSC;GACFK;GACEC;GACDC;GACMC;GACRC;GACDC;GACFC;GACQC;GACjB,UAAU,OAAOQ,SAAS;IACxB,MAAMlB,WAAWkB,IAAI;IAErBH,UAAU;IAEV,IAAI,CAACpC,UAEHqC,iBAAiB;KACftB,KAAKuB,YAAY;IACnB,GAAG,GAAG;GAEV;GACgBhB;GACAC;GA1BlB,UAAA,CA4BE,oBAAC,SAAD,EAAA,UACG,OAAOpB,aAAa,aAAaA,SAASC,cAAc,IAAID,SACtD,CAAA,GAER,CAACF,YACA,oBAAC,QAAD,EAAA,UACE,qBAAC,aAAD,EAAA,UAAA,CACE,oBAAC2C,eAAD;IACE,IAAI,GAAG3B,MAAM,GAAE;IACf,OAAOpB,SAAS,WAAW2C,KAAAA;IAC3B,GAAIxD,sBACFc,aACAqC,EAAE,qBAAqB,QAAQ,CACjC;GAAE,CAAA,GAEJ,oBAAC,QAAD;IACE,IAAI,GAAGlB,MAAM,GAAE;IACf,SAASb;IACT,GAAIpB,sBACFe,aACAoC,EAAE,qBAAqB,QAAQ,CACjC;GAAE,CAAA,CAEO,EAAA,CAAA,EACP,CAAA,IACNK,KAAAA,CACA;EACA,CAAA,CAAA;;AAEZ"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | 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.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { Title as _Title } from "../../content/Title.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { createContext, useContext } from "react";
 import invariant from "tiny-invariant";
 //#region src/components/overlays/Dialog/context.tsx

package/dist/components/overlays/Dialog/default-button-text.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 //#region src/components/overlays/Dialog/default-button-text.ts
 /**
 * Gives a dialog's built-in button its default text without overriding the

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { c } from "react/compiler-runtime";
 import { useState } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | 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/Dialog/use-dialog-open-sync.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { useEventBus } from "../../../utils/react/useEventBus.js";
 import { c } from "react/compiler-runtime";
 import { useEffect, useEffectEvent } from "react";

package/dist/components/overlays/Dialog/use-retained-dialog-focus.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { focusProgrammatically } from "../../../utils/react/programmaticFocus.js";
 import { useOpenTransitionContext } from "../Modal/OpenTransitionContext.js";
 import { trapsFocus, useDialogContext } from "./context.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { mergeRefs as mergeRefs$1 } from "../../../utils/react/useCombinedRefs.js";
 import { ModalContainmentProvider, useModalContainment } from "./modal-containment.js";
@@ -52,7 +52,7 @@ const ModalElement = tasty({ styles: {
 		"type=panel": "auto"
 	},
 	width: {
-		"": "$min-dialog-size (100dvw - 8x)",
+		"": "$min-dialog-size 100dvw",
 		"type=panel": "auto"
 	},
 	pointerEvents: "none",

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","names":["useObjectRef","BaseProps","Styles","tasty","ForwardedRef","forwardRef","ReactNode","useModal","useOverlay","usePreventScroll","mergeProps","mergeRefs","useOverlayEscapeGuard","ModalContainmentProvider","useModalContainment","Overlay","ModalProps","TransitionState","WithCloseBehavior","Underlay","Props","OVERLAY_WRAPPER_STYLES","position","display","left","top","placeItems","boxSizing","width","height","pointerEvents","zIndex","transition","open","ModalWrapperElement","qa","styles","ModalElement","hide","exit","unmounted","transform","opacity","CubeModalProps","Omit","container","HTMLElement","onClose","action","type","shouldCloseOnInteractOutside","element","Element","Modal","props","ref","$","_c","children","otherProps","domRef","t0","overlayProps","rawOverlayProps","underlayProps","isOpen","containment","containmentRef","t1","t2","t3","t4","t5","ModalWrapperProps","placement","ModalWrapper","transitionState","isDisabled","modalProps","T0","T1","t6","t7","t8","t9","enter","entered","t10","t11","t12","_Modal","displayName","_c","Underlay","mergeRefs","Overlay","mergeProps"],"sources":["../../../../src/components/overlays/Modal/Modal.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport { BaseProps, Styles, tasty } from '@tenphi/tasty';\nimport { ForwardedRef, forwardRef, ReactNode } from 'react';\nimport { useModal, useOverlay, usePreventScroll } from 'react-aria';\n\nimport { mergeProps } from '../../../utils/react';\nimport { mergeRefs } from '../../../utils/react/useCombinedRefs';\nimport { useOverlayEscapeGuard } from '../../../utils/react/useOverlayEscapeGuard';\n\nimport {\n  ModalContainmentProvider,\n  useModalContainment,\n} from './modal-containment';\nimport { Overlay } from './Overlay';\nimport { ModalProps, TransitionState, WithCloseBehavior } from './types';\nimport { Underlay } from './Underlay';\n\nimport type { Props } from '../../../props';\n\nexport const OVERLAY_WRAPPER_STYLES: Styles = {\n  position: 'fixed',\n  display: 'grid',\n  left: 0,\n  top: 0,\n  placeItems: {\n    '': 'center',\n    'type=fullscreen': 'center',\n    'type=fullscreenTakeover | type=panel': 'stretch',\n  },\n  boxSizing: 'border-box',\n  width: '100vw',\n  height: '100dvh',\n  pointerEvents: 'none',\n  zIndex: 10,\n  transition: {\n    '': 'visibility .5s steps(2, start)',\n    open: 'visibility 0s linear',\n  },\n};\n\nconst ModalWrapperElement = tasty({\n  qa: 'ModalWrapper',\n  styles: OVERLAY_WRAPPER_STYLES,\n});\n\nconst ModalElement = tasty({\n  styles: {\n    display: 'grid',\n    hide: {\n      '': true,\n      'enter | entered': false,\n      exit: false,\n      unmounted: true,\n    },\n    zIndex: 10,\n    height: {\n      '': 'max 90dvh',\n      'type=fullscreenTakeover | type=panel': '100dvh 100dvh',\n      'type=fullscreen': '(100dvh - 8x) (100dvh - 8x)',\n      'type=panel': 'auto',\n    },\n    width: {\n      '': '$min-dialog-size (100dvw - 8x)',\n      'type=panel': 'auto',\n    },\n    pointerEvents: 'none',\n    transition: 'opacity .25s linear, transform .25s ease-in-out',\n    transform: {\n      '': 'initial',\n      'type=modal & !open': 'translate(0, -3x) scale(1, 1)',\n      '(type^=fullscreen | type=panel) & !open':\n        'translate(0, 0) scale(1.02, 1.02)',\n    },\n    opacity: {\n      '': 0,\n      open: 0.9999,\n    },\n  },\n});\n\nexport interface CubeModalProps\n  extends\n    Omit<ModalProps, 'container' | 'type' | 'nodeRef'>,\n    WithCloseBehavior {\n  container?: HTMLElement;\n  qa?: BaseProps['qa'];\n  onClose?: (action?: string) => void;\n  type?: 'modal' | 'fullscreen' | 'fullscreenTakeover' | 'panel';\n  styles?: Styles;\n  shouldCloseOnInteractOutside?: (element: Element) => boolean;\n}\n\nfunction Modal(props: CubeModalProps, ref: ForwardedRef<HTMLElement>) {\n  let { qa, children, onClose, type, styles, ...otherProps } = props;\n  let domRef = useObjectRef(ref);\n\n  let { overlayProps: rawOverlayProps, underlayProps } = useOverlay(\n    { ...props },\n    domRef,\n  );\n\n  // Focus can stay in a modal while it closes, after a press on it or a close\n  // that restores focus nowhere; it must not answer for `Escape` meanwhile —\n  // see `useOverlayEscapeGuard`.\n  const overlayProps = useOverlayEscapeGuard(rawOverlayProps, props.isOpen);\n\n  // A panel leaves the page readable; every other type hides it while open.\n  const { containment, ref: containmentRef } = useModalContainment(\n    type !== 'panel',\n    !!props.isOpen,\n  );\n\n  return (\n    <ModalContainmentProvider value={containment}>\n      <Overlay {...otherProps}>\n        {type !== 'fullscreenTakeover' && type !== 'panel' && (\n          <Underlay {...underlayProps} />\n        )}\n        <ModalWrapper\n          ref={mergeRefs(domRef, containmentRef)}\n          qa={qa}\n          type={type}\n          overlayProps={overlayProps}\n          styles={styles}\n          onClose={onClose}\n        >\n          {children}\n        </ModalWrapper>\n      </Overlay>\n    </ModalContainmentProvider>\n  );\n}\n\ninterface ModalWrapperProps extends TransitionState {\n  children?: ReactNode;\n  qa?: BaseProps['qa'];\n  isOpen?: boolean;\n  type?: 'modal' | 'fullscreen' | 'fullscreenTakeover' | 'panel';\n  placement?: 'top' | 'bottom';\n  styles?: Styles;\n  overlayProps?: Props;\n  onClose?: () => void;\n}\n\nlet ModalWrapper = forwardRef(function ModalWrapper(\n  props: ModalWrapperProps,\n  ref,\n) {\n  let {\n    qa,\n    children,\n    isOpen,\n    type,\n    placement,\n    styles,\n    overlayProps,\n    transitionState,\n    ...otherProps\n  } = props;\n\n  usePreventScroll({ isDisabled: transitionState !== 'entered' });\n\n  let { modalProps } = useModal({ isDisabled: transitionState !== 'entered' });\n\n  return (\n    <ModalWrapperElement data-type={type} data-placement={placement}>\n      <ModalElement\n        qa={qa || 'Modal'}\n        styles={styles}\n        mods={{\n          open: isOpen,\n          enter: transitionState === 'enter',\n          exit: transitionState === 'exit',\n          unmounted: transitionState === 'unmounted',\n          entered: transitionState === 'entered',\n        }}\n        data-type={type}\n        data-placement={placement}\n        {...mergeProps(otherProps, overlayProps, modalProps)}\n        ref={ref}\n      >\n        {children}\n      </ModalElement>\n    </ModalWrapperElement>\n  );\n});\n\nlet _Modal = forwardRef(Modal);\n\n_Modal.displayName = 'Modal';\n\nexport { _Modal as Modal };\n"],"mappings":"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"}
+{"version":3,"file":"Modal.js","names":["useObjectRef","BaseProps","Styles","tasty","ForwardedRef","forwardRef","ReactNode","useModal","useOverlay","usePreventScroll","mergeProps","mergeRefs","useOverlayEscapeGuard","ModalContainmentProvider","useModalContainment","Overlay","ModalProps","TransitionState","WithCloseBehavior","Underlay","Props","OVERLAY_WRAPPER_STYLES","position","display","left","top","placeItems","boxSizing","width","height","pointerEvents","zIndex","transition","open","ModalWrapperElement","qa","styles","ModalElement","hide","exit","unmounted","transform","opacity","CubeModalProps","Omit","container","HTMLElement","onClose","action","type","shouldCloseOnInteractOutside","element","Element","Modal","props","ref","$","_c","children","otherProps","domRef","t0","overlayProps","rawOverlayProps","underlayProps","isOpen","containment","containmentRef","t1","t2","t3","t4","t5","ModalWrapperProps","placement","ModalWrapper","transitionState","isDisabled","modalProps","T0","T1","t6","t7","t8","t9","enter","entered","t10","t11","t12","_Modal","displayName","_c","Underlay","mergeRefs","Overlay","mergeProps"],"sources":["../../../../src/components/overlays/Modal/Modal.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport { BaseProps, Styles, tasty } from '@tenphi/tasty';\nimport { ForwardedRef, forwardRef, ReactNode } from 'react';\nimport { useModal, useOverlay, usePreventScroll } from 'react-aria';\n\nimport { mergeProps } from '../../../utils/react';\nimport { mergeRefs } from '../../../utils/react/useCombinedRefs';\nimport { useOverlayEscapeGuard } from '../../../utils/react/useOverlayEscapeGuard';\n\nimport {\n  ModalContainmentProvider,\n  useModalContainment,\n} from './modal-containment';\nimport { Overlay } from './Overlay';\nimport { ModalProps, TransitionState, WithCloseBehavior } from './types';\nimport { Underlay } from './Underlay';\n\nimport type { Props } from '../../../props';\n\nexport const OVERLAY_WRAPPER_STYLES: Styles = {\n  position: 'fixed',\n  display: 'grid',\n  left: 0,\n  top: 0,\n  placeItems: {\n    '': 'center',\n    'type=fullscreen': 'center',\n    'type=fullscreenTakeover | type=panel': 'stretch',\n  },\n  boxSizing: 'border-box',\n  width: '100vw',\n  height: '100dvh',\n  pointerEvents: 'none',\n  zIndex: 10,\n  transition: {\n    '': 'visibility .5s steps(2, start)',\n    open: 'visibility 0s linear',\n  },\n};\n\nconst ModalWrapperElement = tasty({\n  qa: 'ModalWrapper',\n  styles: OVERLAY_WRAPPER_STYLES,\n});\n\nconst ModalElement = tasty({\n  styles: {\n    display: 'grid',\n    hide: {\n      '': true,\n      'enter | entered': false,\n      exit: false,\n      unmounted: true,\n    },\n    zIndex: 10,\n    height: {\n      '': 'max 90dvh',\n      'type=fullscreenTakeover | type=panel': '100dvh 100dvh',\n      'type=fullscreen': '(100dvh - 8x) (100dvh - 8x)',\n      'type=panel': 'auto',\n    },\n    width: {\n      // The dialog limits its own width; a cap here would also clip a width\n      // that sets its own max.\n      '': '$min-dialog-size 100dvw',\n      'type=panel': 'auto',\n    },\n    pointerEvents: 'none',\n    transition: 'opacity .25s linear, transform .25s ease-in-out',\n    transform: {\n      '': 'initial',\n      'type=modal & !open': 'translate(0, -3x) scale(1, 1)',\n      '(type^=fullscreen | type=panel) & !open':\n        'translate(0, 0) scale(1.02, 1.02)',\n    },\n    opacity: {\n      '': 0,\n      open: 0.9999,\n    },\n  },\n});\n\nexport interface CubeModalProps\n  extends\n    Omit<ModalProps, 'container' | 'type' | 'nodeRef'>,\n    WithCloseBehavior {\n  container?: HTMLElement;\n  qa?: BaseProps['qa'];\n  onClose?: (action?: string) => void;\n  type?: 'modal' | 'fullscreen' | 'fullscreenTakeover' | 'panel';\n  styles?: Styles;\n  shouldCloseOnInteractOutside?: (element: Element) => boolean;\n}\n\nfunction Modal(props: CubeModalProps, ref: ForwardedRef<HTMLElement>) {\n  let { qa, children, onClose, type, styles, ...otherProps } = props;\n  let domRef = useObjectRef(ref);\n\n  let { overlayProps: rawOverlayProps, underlayProps } = useOverlay(\n    { ...props },\n    domRef,\n  );\n\n  // Focus can stay in a modal while it closes, after a press on it or a close\n  // that restores focus nowhere; it must not answer for `Escape` meanwhile —\n  // see `useOverlayEscapeGuard`.\n  const overlayProps = useOverlayEscapeGuard(rawOverlayProps, props.isOpen);\n\n  // A panel leaves the page readable; every other type hides it while open.\n  const { containment, ref: containmentRef } = useModalContainment(\n    type !== 'panel',\n    !!props.isOpen,\n  );\n\n  return (\n    <ModalContainmentProvider value={containment}>\n      <Overlay {...otherProps}>\n        {type !== 'fullscreenTakeover' && type !== 'panel' && (\n          <Underlay {...underlayProps} />\n        )}\n        <ModalWrapper\n          ref={mergeRefs(domRef, containmentRef)}\n          qa={qa}\n          type={type}\n          overlayProps={overlayProps}\n          styles={styles}\n          onClose={onClose}\n        >\n          {children}\n        </ModalWrapper>\n      </Overlay>\n    </ModalContainmentProvider>\n  );\n}\n\ninterface ModalWrapperProps extends TransitionState {\n  children?: ReactNode;\n  qa?: BaseProps['qa'];\n  isOpen?: boolean;\n  type?: 'modal' | 'fullscreen' | 'fullscreenTakeover' | 'panel';\n  placement?: 'top' | 'bottom';\n  styles?: Styles;\n  overlayProps?: Props;\n  onClose?: () => void;\n}\n\nlet ModalWrapper = forwardRef(function ModalWrapper(\n  props: ModalWrapperProps,\n  ref,\n) {\n  let {\n    qa,\n    children,\n    isOpen,\n    type,\n    placement,\n    styles,\n    overlayProps,\n    transitionState,\n    ...otherProps\n  } = props;\n\n  usePreventScroll({ isDisabled: transitionState !== 'entered' });\n\n  let { modalProps } = useModal({ isDisabled: transitionState !== 'entered' });\n\n  return (\n    <ModalWrapperElement data-type={type} data-placement={placement}>\n      <ModalElement\n        qa={qa || 'Modal'}\n        styles={styles}\n        mods={{\n          open: isOpen,\n          enter: transitionState === 'enter',\n          exit: transitionState === 'exit',\n          unmounted: transitionState === 'unmounted',\n          entered: transitionState === 'entered',\n        }}\n        data-type={type}\n        data-placement={placement}\n        {...mergeProps(otherProps, overlayProps, modalProps)}\n        ref={ref}\n      >\n        {children}\n      </ModalElement>\n    </ModalWrapperElement>\n  );\n});\n\nlet _Modal = forwardRef(Modal);\n\n_Modal.displayName = 'Modal';\n\nexport { _Modal as Modal };\n"],"mappings":";;;;;;;;;;;;;;AAmBA,MAAaqB,yBAAiC;CAC5CC,UAAU;CACVC,SAAS;CACTC,MAAM;CACNC,KAAK;CACLC,YAAY;EACV,IAAI;EACJ,mBAAmB;EACnB,wCAAwC;CAC1C;CACAC,WAAW;CACXC,OAAO;CACPC,QAAQ;CACRC,eAAe;CACfC,QAAQ;CACRC,YAAY;EACV,IAAI;EACJC,MAAM;CACR;AACF;AAEA,MAAMC,sBAAsB/B,MAAM;CAChCgC,IAAI;CACJC,QAAQf;AACV,CAAC;AAED,MAAMgB,eAAelC,MAAM,EACzBiC,QAAQ;CACNb,SAAS;CACTe,MAAM;EACJ,IAAI;EACJ,mBAAmB;EACnBC,MAAM;EACNC,WAAW;CACb;CACAT,QAAQ;CACRF,QAAQ;EACN,IAAI;EACJ,wCAAwC;EACxC,mBAAmB;EACnB,cAAc;CAChB;CACAD,OAAO;EAGL,IAAI;EACJ,cAAc;CAChB;CACAE,eAAe;CACfE,YAAY;CACZS,WAAW;EACT,IAAI;EACJ,sBAAsB;EACtB,2CACE;CACJ;CACAC,SAAS;EACP,IAAI;EACJT,MAAM;CACR;AACF,EACF,CAAC;AAcD,SAAAoB,MAAAC,OAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;CAAA,IAAAX;CAAA,IAAAY;CAAA,IAAAxB;CAAA,IAAAC;CAAA,IAAAa;CAAA,IAAAO,EAAA,OAAAF,OAAA;EACE,CAAA,CAAAnB,IAAAuB,UAAAX,SAAAE,MAAAb,QAAA,GAAAuB,cAA6DL;EAAME,EAAA,KAAAF;EAAAE,EAAA,KAAAE;EAAAF,EAAA,KAAAT;EAAAS,EAAA,KAAAG;EAAAH,EAAA,KAAArB;EAAAqB,EAAA,KAAApB;EAAAoB,EAAA,KAAAP;CAAA,OAAA;EAAAS,WAAAF,EAAA;EAAAT,UAAAS,EAAA;EAAAG,aAAAH,EAAA;EAAArB,KAAAqB,EAAA;EAAApB,SAAAoB,EAAA;EAAAP,OAAAO,EAAA;CAAA;CACnE,MAAAI,SAAa5D,aAAauD,GAAG;CAAE,IAAAM;CAAA,IAAAL,EAAA,OAAAF,OAAA;EAG7BO,KAAA,EAAA,GAAKP,MAAM;EAACE,EAAA,KAAAF;EAAAE,EAAA,KAAAK;CAAA,OAAAA,KAAAL,EAAA;CADd,MAAA,EAAAM,cAAAC,iBAAAC,kBAAuDxD,WACrDqD,IACAD,MACF;CAKA,MAAAE,eAAqBlD,sBAAsBmD,iBAAiBT,MAAKW,MAAO;CAGxE,MAAA,EAAAC,aAAAX,KAAAY,mBAA6CrD,oBAC3CmC,SAAS,SACT,CAAC,CAACK,MAAKW,MACT;CAAE,IAAAG;CAAA,IAAAZ,EAAA,OAAAP,QAAAO,EAAA,QAAAQ,eAAA;EAKKI,KAAAnB,SAAS,wBAAwBA,SAAS,WACzC,oBAAC4C,WAAD,EAAS,GAAK7B,cAAa,CAAA;EAC5BR,EAAA,KAAAP;EAAAO,EAAA,MAAAQ;EAAAR,EAAA,MAAAY;CAAA,OAAAA,KAAAZ,EAAA;CAAA,IAAAa;CAAA,IAAAb,EAAA,QAAAW,kBAAAX,EAAA,QAAAI,QAAA;EAEMS,KAAA1D,YAAUiD,QAAQO,cAAc;EAACX,EAAA,MAAAW;EAAAX,EAAA,MAAAI;EAAAJ,EAAA,MAAAa;CAAA,OAAAA,KAAAb,EAAA;CAAA,IAAAc;CAAA,IAAAd,EAAA,QAAAE,YAAAF,EAAA,QAAAT,WAAAS,EAAA,QAAAM,gBAAAN,EAAA,QAAArB,MAAAqB,EAAA,QAAApB,UAAAoB,EAAA,QAAAa,MAAAb,EAAA,QAAAP,MAAA;EADxCqB,KAAA,oBAAC,cAAD;GACO,KAAAD;GACDlC;GACEc;GACQa;GACN1B;GACCW;GAERW;EARU,CAAA;EASEF,EAAA,MAAAE;EAAAF,EAAA,MAAAT;EAAAS,EAAA,MAAAM;EAAAN,EAAA,MAAArB;EAAAqB,EAAA,MAAApB;EAAAoB,EAAA,MAAAa;EAAAb,EAAA,MAAAP;EAAAO,EAAA,MAAAc;CAAA,OAAAA,KAAAd,EAAA;CAAA,IAAAe;CAAA,IAAAf,EAAA,QAAAG,cAAAH,EAAA,QAAAY,MAAAZ,EAAA,QAAAc,IAAA;EAbjBC,KAAA,qBAACwB,UAAD;GAAQ,GAAKpC;GAAb,UAAA,CACGS,IAGDE,EAJM;;EAcEd,EAAA,MAAAG;EAAAH,EAAA,MAAAY;EAAAZ,EAAA,MAAAc;EAAAd,EAAA,MAAAe;CAAA,OAAAA,KAAAf,EAAA;CAAA,IAAAgB;CAAA,IAAAhB,EAAA,QAAAU,eAAAV,EAAA,QAAAe,IAAA;EAfZC,KAAA,oBAAC,0BAAD;GAAiCN,OAAAA;GAC/BK,UAAAA;EADuB,CAAA;EAgBEf,EAAA,MAAAU;EAAAV,EAAA,MAAAe;EAAAf,EAAA,MAAAgB;CAAA,OAAAA,KAAAhB,EAAA;CAAA,OAhB3BgB;AAgB2B;AAe/B,IAAIG,eAAetE,WAAW,SAAAsE,aAAArB,OAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAI5B,MAAA,EAAAtB,IAAAuB,UAAAO,QAAAhB,MAAAyB,WAAAtC,QAAA0B,cAAAc,iBAAA,GAAAjB,eAUIL;CAE2B,MAAAO,KAAAe,oBAAoB;CAAS,IAAAR;CAAA,IAAAZ,EAAA,OAAAK,IAAA;EAA3CO,KAAA,EAAAS,YAAchB,GAA8B;EAACL,EAAA,KAAAK;EAAAL,EAAA,KAAAY;CAAA,OAAAA,KAAAZ,EAAA;CAA9D/C,iBAAiB2D,EAA6C;CAElB,MAAAC,KAAAO,oBAAoB;CAAS,IAAAN;CAAA,IAAAd,EAAA,OAAAa,IAAA;EAA3CC,KAAA,EAAAO,YAAcR,GAA8B;EAACb,EAAA,KAAAa;EAAAb,EAAA,KAAAc;CAAA,OAAAA,KAAAd,EAAA;CAA3E,MAAA,EAAAsB,eAAqBvE,SAAS+D,EAA6C;CAGxE,MAAAS,KAAA7C;CACE,MAAA8C,KAAA3C;CACK,MAAAkC,KAAApC,MAAA;CAIK,MAAAqC,KAAAI,oBAAoB;CACrB,MAAAK,KAAAL,oBAAoB;CACf,MAAAM,KAAAN,oBAAoB;CACtB,MAAAO,KAAAP,oBAAoB;CAAS,IAAAQ;CAAA,IAAA5B,EAAA,OAAAS,UAAAT,EAAA,OAAAgB,MAAAhB,EAAA,OAAAyB,MAAAzB,EAAA,OAAA0B,MAAA1B,EAAA,OAAA2B,IAAA;EALlCC,KAAA;GAAAnD,MACEgC;GAAMoB,OACLb;GAA2BjC,MAC5B0C;GAA0BzC,WACrB0C;GAA+BI,SACjCH;EACX;EAAC3B,EAAA,KAAAS;EAAAT,EAAA,KAAAgB;EAAAhB,EAAA,KAAAyB;EAAAzB,EAAA,KAAA0B;EAAA1B,EAAA,KAAA2B;EAAA3B,EAAA,KAAA4B;CAAA,OAAAA,KAAA5B,EAAA;CAGG,MAAA+B,MAAA7E,aAAWiD,YAAYG,cAAcgB,UAAU;CAAC,IAAAU;CAAA,IAAAhC,EAAA,QAAAwB,MAAAxB,EAAA,QAAAE,YAAAF,EAAA,QAAAkB,aAAAlB,EAAA,QAAAD,OAAAC,EAAA,QAAApB,UAAAoB,EAAA,QAAA+B,OAAA/B,EAAA,QAAAe,MAAAf,EAAA,QAAA4B,MAAA5B,EAAA,QAAAP,MAAA;EAZtDuC,MAAA,oBAAC,IAAD;GACM,IAAAjB;GACInC;GACF,MAAAgD;GAOKnC,aAAAA;GACKyB,kBAAAA;GAAS,GACrBa;GACChC;GAEJG;EAfU,CAAA;EAgBEF,EAAA,MAAAwB;EAAAxB,EAAA,MAAAE;EAAAF,EAAA,MAAAkB;EAAAlB,EAAA,MAAAD;EAAAC,EAAA,MAAApB;EAAAoB,EAAA,MAAA+B;EAAA/B,EAAA,MAAAe;EAAAf,EAAA,MAAA4B;EAAA5B,EAAA,MAAAP;EAAAO,EAAA,MAAAgC;CAAA,OAAAA,MAAAhC,EAAA;CAAA,IAAAiC;CAAA,IAAAjC,EAAA,QAAAuB,MAAAvB,EAAA,QAAAkB,aAAAlB,EAAA,QAAAgC,OAAAhC,EAAA,QAAAP,MAAA;EAjBjBwC,MAAA,oBAAC,IAAD;GAAgCxC,aAAAA;GAAsByB,kBAAAA;GACpDc,UAAAA;EADkB,CAAA;EAkBEhC,EAAA,MAAAuB;EAAAvB,EAAA,MAAAkB;EAAAlB,EAAA,MAAAgC;EAAAhC,EAAA,MAAAP;EAAAO,EAAA,MAAAiC;CAAA,OAAAA,MAAAjC,EAAA;CAAA,OAlBtBiC;AAkBsB,CAEzB;AAED,IAAIC,SAASrF,WAAWgD,KAAK;AAE7BqC,OAAOC,cAAc"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { createContext, useContext } from "react";
 //#region src/components/overlays/Modal/OpenTransitionContext.tsx
 const OpenTransitionContext = createContext(null);

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | 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.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { mergeRefs as mergeRefs$1 } from "../../../utils/react/useCombinedRefs.js";
 import { useModalLayerRef } from "./modal-containment.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { mergeRefs as mergeRefs$1 } from "../../../utils/react/useCombinedRefs.js";
 import { ModalContainmentProvider, useModalContainment } from "./modal-containment.js";

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

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

package/dist/components/overlays/Modal/modal-containment.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { c } from "react/compiler-runtime";
 import { createContext, useContext, useLayoutEffect, useRef, useState } from "react";
 import { ariaHideOutside } from "react-aria/private/overlays/ariaHideOutside";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | 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.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | 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.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { Block } from "../../Block.js";
 import { ItemActionProvider } from "../../actions/ItemActionContext.js";
 import { useI18n } from "../../../i18n/useI18n.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { createContext, useContext } from "react";
 //#region src/components/overlays/Notifications/NotificationContext.ts
 const ToastContext = createContext(null);

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { NotificationCard } from "./NotificationCard.js";
 import { c } from "react/compiler-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { useViewportSize } from "../../../utils/react/useViewportSize.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { NotificationContext, PersistentNotificationsContext, ToastContext } from "./NotificationContext.js";
 import { OverlayContainer } from "./OverlayContainer.js";
 import { useNotificationState } from "./use-notification-state.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.198.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
 import { Text as _Text } from "../../content/Text.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useI18n } from "../../../i18n/useI18n.js";