@eightshift/ui-components 5.3.3 → 5.5.0

package/dist/assets/wp-font-enhancements.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
 .edit-post-header, .components-popover, .edit-post-sidebar, .wp-block-post-title, .components-select-control__input, .components-base-control__field, .components-base-control__label, .components-combobox-control__suggestions-container, .components-input-control__label, .components-input-control__input, .components-checkbox-control__label, .components-menu-group__label, .components-menu-item__button, .components-notice .components-notice__content, .components-tooltip, .components-modal__header, .preferences-modal__section-title, .preferences-modal__section-description, .block-editor-inserter__tabs, .editor-list-view-sidebar, .edit-post-layout__footer, .components-snackbar, .components-text-control__input {
   font-family: var(--es-font-sans, "Geist Variable", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
 }

package/dist/assets/wp-ui-enhancements.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
 @layer properties {
   @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
     *, :before, :after, ::backdrop {

package/dist/components/button/button.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1, b as $0393f8ab869a0f1a$export$c17561cb55d4db30 } from "../../Button-npzfSoYo.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1, b as $0393f8ab869a0f1a$export$c17561cb55d4db30 } from "../../Button-CQ5ZZJ2w.js";
 import { k as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, a as $64fa3d84918910a7$export$29f1550f4b0d4415, h as $64fa3d84918910a7$export$4d86445c2cf5e3, b as $3ef42575df84b30b$export$9d1611c77c2fe928, l as $df56164dff5785e2$export$4338b53315abf666 } from "../../utils-cvK1vxO7.js";
-import { $ as $9bf71ea28793e738$export$c5251b9e124bf29 } from "../../FocusScope-DJApHXhY.js";
+import { $ as $9bf71ea28793e738$export$c5251b9e124bf29 } from "../../FocusScope-B5vxRkHm.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-D2C6R0DK.js";
 import React__default, { useState, useRef, forwardRef, createContext, cloneElement } from "react";
 import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-DMOmz986.js";
@@ -108,10 +108,11 @@ const $13c3c67164f4d5be$export$4c260019440d418f = /* @__PURE__ */ forwardRef(fun
  * @property {TooltipProps} [props.tooltipProps] - Props to pass to the tooltip.
  * @property {boolean} [props.pending] - If `true`, the button is in a pending state, which can be used to indicate that an action is being processed.
  * @property {string} [props.pendingAriaLabel='Loading'] - ARIA label for the pending state, used for screen readers.
+ * @property {boolean} [props.flat] - If `true`, the button will be render with a more flat look. (applies only to `default`, `selected`, and `danger` types)
  * @property {boolean} [props.hidden] - If `true`, the component is not rendered.
  *
  * @typedef {'small' | 'default' | 'large'} ButtonSize
- * @typedef {'default' | 'selected' | 'selectedGhost' | 'ghost' | 'danger' | 'dangerGhost'} ButtonType
+ * @typedef {'default' | 'selected' | 'selectedGhost' | 'ghost' | 'danger' | 'dangerGhost' | 'glass' | 'glassDark' | 'dangerGlass' | 'selectedGlass'} ButtonType
  *
  * @preserve
  */
@@ -136,6 +137,7 @@ const Button = (props) => {
     icon,
     size = "default",
     type = "default",
+    flat,
     pending,
     pendingAriaLabel = __("Loading", "eightshift-ui-components"),
     disabled,
@@ -181,23 +183,72 @@ const Button = (props) => {
           large: "es:icon:size-6 es:rounded-xl"
         },
         type: {
-          default: "es:bg-radial-[at_50%_125%] es:inset-ring es:inset-shadow-xs",
-          selected: "es:bg-radial-[at_50%_125%] es:inset-ring es:inset-shadow-xs",
-          danger: "es:bg-radial-[at_50%_125%] es:inset-ring es:inset-shadow-xs",
-          ghost: "es:border-transparent es:text-secondary-700 es:enabled:hover:bg-secondary-100 es:enabled:active:bg-accent-50 es:enabled:pressed:bg-accent-50 es:enabled:active:text-accent-950 es:enabled:pressed:text-accent-950 es:disabled:border-transparent!",
+          default: ["es:bg-radial-[at_50%_125%]", !flat && "es:inset-ring es:inset-shadow-xs"],
+          selected: ["es:bg-radial-[at_50%_125%]", !flat && "es:inset-ring es:inset-shadow-xs"],
+          danger: ["es:bg-radial-[at_50%_125%]", !flat && "es:inset-ring es:inset-shadow-xs"],
+          ghost: "es:border-transparent es:text-secondary-700 es:hover:bg-secondary-100 es:enabled:active:bg-accent-50 es:enabled:pressed:bg-accent-50 es:enabled:active:text-accent-950 es:enabled:pressed:text-accent-950 es:disabled:border-transparent!",
           dangerGhost: [
             "es:border-transparent es:text-red-700",
-            "es:enabled:hover:bg-red-500/5 es:enabled:active:bg-red-500/10 es:enabled:pressed:bg-red-500/10",
+            "es:hover:bg-red-500/5 es:enabled:active:bg-red-500/10 es:enabled:pressed:bg-red-500/10",
             "es:focus-visible:text-red-700",
             "es:focus-visible:ring-red-500/30 es:focus-visible:border-red-600 es:focus-visible:inset-ring-red-100",
             "es:disabled:border-transparent!"
           ],
           selectedGhost: [
             "es:border-transparent es:text-accent-600",
-            "es:enabled:hover:bg-accent-500/5 es:enabled:active:bg-accent-500/10 es:enabled:pressed:bg-accent-500/10",
+            "es:hover:bg-accent-500/5 es:enabled:active:bg-accent-500/10 es:enabled:pressed:bg-accent-500/10",
             "es:focus-visible:text-accent-700",
             "es:focus-visible:ring-accent-500/30 es:focus-visible:border-accent-500 es:focus-visible:inset-ring-accent-100",
             "es:disabled:border-transparent!"
+          ],
+          glass: [
+            "es:backdrop-blur-md",
+            "es:backdrop-saturate-120 es:hover:backdrop-saturate-130",
+            "es:bg-radial-[at_50%_75%] es:from-white/20 es:to-white/15",
+            "es:hover:from-white/30 es:hover:to-white/25",
+            "es:focus-visible:from-white/90 es:focus-visible:to-white/85",
+            "es:border-none es:text-white es:focus-visible:text-black",
+            "es:inset-shadow-sm es:inset-shadow-white/5 es:hover:inset-shadow-white/10",
+            "es:shadow-xs es:shadow-black/10",
+            "es:inset-ring es:inset-ring-white/2",
+            "es:text-shadow-2xs es:text-shadow-black/30"
+          ],
+          glassDark: [
+            "es:backdrop-blur-md",
+            "es:backdrop-saturate-115 es:hover:backdrop-saturate-125",
+            "es:bg-radial-[at_50%_75%] es:from-black/40 es:to-black/35",
+            "es:hover:from-black/50 es:hover:to-black/45",
+            "es:focus-visible:from-black/95 es:focus-visible:to-black/90",
+            "es:border-none es:text-white",
+            "es:inset-shadow-sm es:inset-shadow-white/5 es:hover:inset-shadow-white/10",
+            "es:shadow-xs es:shadow-black/10",
+            "es:inset-ring es:inset-ring-black/10",
+            "es:text-shadow-2xs es:text-shadow-black/30 es:focus-visible:text-shadow-black/0"
+          ],
+          dangerGlass: [
+            "es:backdrop-blur-md",
+            "es:backdrop-saturate-115 es:hover:backdrop-saturate-125",
+            "es:bg-radial-[at_50%_75%] es:from-red-700/50 es:to-red-700/45",
+            "es:hover:from-red-700/60 es:hover:to-red-700/55",
+            "es:enabled:focus-visible:from-red-700/95 es:enabled:focus-visible:to-red-700/90",
+            "es:border-none es:text-white",
+            "es:inset-shadow-sm es:inset-shadow-white/5 es:hover:inset-shadow-white/10",
+            "es:shadow-xs es:shadow-red-700/10",
+            "es:inset-ring es:inset-ring-red-700/10",
+            "es:text-shadow-2xs es:text-shadow-black/30",
+            "es:focus-visible:ring-red-500/30"
+          ],
+          selectedGlass: [
+            "es:backdrop-blur-md",
+            "es:backdrop-saturate-120 es:hover:backdrop-saturate-130",
+            "es:bg-radial-[at_50%_75%] es:from-accent-400/35 es:to-accent-400/30",
+            "es:hover:from-accent-400/45 es:hover:to-accent-400/40",
+            "es:focus-visible:from-accent-600/95 es:focus-visible:to-accent-600/90",
+            "es:border-none es:text-white",
+            "es:inset-shadow-sm es:inset-shadow-white/5 es:hover:inset-shadow-white/10",
+            "es:shadow-xs es:shadow-black/10",
+            "es:inset-ring es:inset-ring-white/2",
+            "es:text-shadow-2xs es:text-shadow-black/30"
           ]
         }
       },
@@ -210,10 +261,11 @@ const Button = (props) => {
             "es:text-black",
             "es:from-white es:to-secondary-50",
             "es:border-secondary-300",
-            "es:inset-ring-secondary-100",
-            "es:inset-shadow-secondary-100/50",
-            "es:shadow-sm",
-            "es:enabled:hover:shadow-md es:enabled:active:shadow-sm es:enabled:pressed:shadow-sm es:hover:inset-shadow-secondary-100 es:hover:to-secondary-100 es:hover:inset-ring-secondary-100",
+            !flat && "es:inset-ring-secondary-100",
+            !flat && "es:inset-shadow-secondary-100/50 es:hover:inset-shadow-secondary-100",
+            !flat && "es:shadow-sm",
+            !flat && "es:hover:shadow-md es:enabled:active:shadow-sm es:enabled:pressed:shadow-sm",
+            flat ? "es:hover:from-secondary-100 es:hover:to-secondary-100 es:hover:inset-ring-secondary-100" : "es:hover:to-secondary-100 es:hover:inset-ring-secondary-100",
             "es:hover:text-accent-950",
             "es:focus-visible:text-accent-950"
           ]
@@ -223,14 +275,15 @@ const Button = (props) => {
           disabled: false,
           class: [
             "es:text-white",
-            "es:from-accent-500 es:to-accent-600",
+            flat ? "es:from-accent-500 es:to-accent-600 es:hover:from-accent-600 es:hover:to-accent-700" : "es:from-accent-500 es:to-accent-600",
             "es:border-accent-700",
-            "es:inset-ring es:inset-ring-accent-600",
-            "es:inset-shadow-xs es:inset-shadow-accent-400/75",
+            !flat && "es:inset-ring es:inset-ring-accent-600",
+            !flat && "es:inset-shadow-xs es:inset-shadow-accent-400/75",
             "es:focus-visible:border-accent-700",
             "es:focus-visible:inset-ring es:focus-visible:inset-ring-accent-600",
             "es:focus-visible:inset-shadow-xs es:focus-visible:inset-shadow-accent-400",
-            "es:shadow es:shadow-accent-600/30 es:enabled:hover:shadow-md es:enabled:active:shadow-sm es:enabled:pressed:shadow-sm"
+            !flat && "es:shadow es:shadow-accent-600/30 es:hover:shadow-md es:enabled:active:shadow-sm es:enabled:pressed:shadow-sm",
+            "es:text-shadow-2xs es:text-shadow-black/20"
           ]
         },
         {
@@ -238,14 +291,14 @@ const Button = (props) => {
           disabled: false,
           class: [
             "es:text-red-700",
-            "es:from-red-50/75 es:to-white",
+            flat ? "es:from-red-600/5 es:to-red-600/2 es:hover:from-red-600/10 es:hover:to-red-600/5" : "es:from-red-50/75 es:to-white",
             "es:border-red-700/50",
-            "es:inset-ring-red-100",
-            "es:inset-shadow-red-50",
-            "es:hover:inset-shadow-red-100 es:hover:inset-ring-red-100 es:hover:text-red-800 es:hover:border-red-600",
+            !flat && "es:inset-ring-red-100",
+            !flat && "es:inset-shadow-red-50",
+            !flat && "es:hover:inset-shadow-red-100 es:hover:inset-ring-red-100 es:hover:text-red-800 es:hover:border-red-600",
             "es:focus-visible:text-red-900",
             "es:focus-visible:ring-red-500/30 es:focus-visible:border-red-600 es:focus-visible:inset-ring-red-100",
-            "es:shadow es:shadow-red-700/20 es:enabled:hover:shadow-md es:enabled:active:shadow-sm es:enabled:pressed:shadow-sm"
+            !flat && "es:shadow es:shadow-red-700/20 es:hover:shadow-md es:enabled:active:shadow-sm es:enabled:pressed:shadow-sm"
           ]
         },
         {

package/dist/components/checkbox/checkbox.js

@@ -1,16 +1,16 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { a as $4e85f108e88277b8$export$b085522c77523c51 } from "../../RSPContexts-2lR5GG9p.js";
+import { b as $4e85f108e88277b8$export$b085522c77523c51 } from "../../RSPContexts-CJ-HBf0L.js";
 import { b as $3ef42575df84b30b$export$9d1611c77c2fe928, a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, l as $df56164dff5785e2$export$4338b53315abf666, m as $5dc95899b306f630$export$c9058316764c140e, g as $64fa3d84918910a7$export$ef03459518577ad4, h as $64fa3d84918910a7$export$4d86445c2cf5e3 } from "../../utils-cvK1vxO7.js";
 import { $ as $d3e0e05bdfcf66bd$export$c24727297075ec6a } from "../../Form-Cq3fu75_.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-D2C6R0DK.js";
-import React__default, { useEffect, useRef, forwardRef, useContext, createContext, useMemo } from "react";
-import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, a as $e93e671b31057976$export$b8473d3665f3a75a, b as $e5be200c675c3b3a$export$a763b9476acd3eb, c as $e5be200c675c3b3a$export$dad6ae84456c676a } from "../../useFormValidation-CUtZcedF.js";
-import { $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "../../usePress-CBQIDzpQ.js";
-import { $ as $d2c8e2b0480f3f34$export$cbe85ee05b554577 } from "../../useToggle-C8CedY6Z.js";
-import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-CiAradXs.js";
-import { a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-CUxgjvAY.js";
-import { w as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-LmGemtHE.js";
-import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-X6SggVVO.js";
+import React__default, { useEffect, useMemo, useRef, forwardRef, useContext, createContext } from "react";
+import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, a as $e93e671b31057976$export$b8473d3665f3a75a, b as $e5be200c675c3b3a$export$a763b9476acd3eb, c as $e5be200c675c3b3a$export$dad6ae84456c676a } from "../../useFormValidation-CeNsUGWK.js";
+import { $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "../../usePress-DJskZBH9.js";
+import { $ as $d2c8e2b0480f3f34$export$cbe85ee05b554577 } from "../../useToggle-DSBDAfdw.js";
+import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-CzN79ary.js";
+import { a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Cgm0R4Cf.js";
+import { w as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-BRDW3y7-.js";
+import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-CgnIuZJ2.js";
 import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DWVaNd2E.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { AnimatedVisibility } from "../animated-visibility/animated-visibility.js";
@@ -40,7 +40,11 @@ function $406796ff087fe49b$export$e375f10ce42261c5(props, state, inputRef) {
     }
   });
   return {
-    labelProps: $3ef42575df84b30b$export$9d1611c77c2fe928(labelProps, pressProps),
+    labelProps: $3ef42575df84b30b$export$9d1611c77c2fe928(labelProps, pressProps, useMemo(() => ({
+      // Prevent label from being focused when mouse down on it.
+      // Note, this does not prevent the input from being focused in the `click` event.
+      onMouseDown: (e) => e.preventDefault()
+    }), [])),
     inputProps: {
       ...inputProps,
       checked: isSelected,

package/dist/components/color-pickers/solid-color-picker.js

@@ -1,24 +1,24 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import React__default, { useState, useMemo, useRef, useCallback, forwardRef, createContext, useContext } from "react";
-import { b as $4e85f108e88277b8$export$ebe63fadcdce34ed, c as $4e85f108e88277b8$export$44644b8a16031b5b, d as $4e85f108e88277b8$export$717b2c0a523a0b53 } from "../../RSPContexts-2lR5GG9p.js";
+import { d as $4e85f108e88277b8$export$ebe63fadcdce34ed, e as $4e85f108e88277b8$export$44644b8a16031b5b, f as $4e85f108e88277b8$export$717b2c0a523a0b53 } from "../../RSPContexts-CJ-HBf0L.js";
 import { b as $3ef42575df84b30b$export$9d1611c77c2fe928, d as $bdb11010cef70236$export$f680877a34711e37, h as $64fa3d84918910a7$export$4d86445c2cf5e3, a as $64fa3d84918910a7$export$29f1550f4b0d4415, i as $64fa3d84918910a7$export$2881499e37b75b9a, f as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, g as $64fa3d84918910a7$export$ef03459518577ad4 } from "../../utils-cvK1vxO7.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-D2C6R0DK.js";
-import { $ as $9ab94262bd0047c7$export$420e68273165f4ec, a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-CUxgjvAY.js";
-import { a as $458b0a5536c1a7cf$export$40bfa8c7b0832715, e as $03deb23ff14920c4$export$4eaf04e54aa8eed6, z as $7215afc6de606d6b$export$de79e2c695e052f3, A as $46d819fcbaf35654$export$8f71654801c2f7cd, n as $a1ea59d68270f0dd$export$f8168d8dd8fd66e6, b as $c87311424ea30a05$export$fedb369cb70207f1, s as $c87311424ea30a05$export$a11b0059900ceec8, w as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-LmGemtHE.js";
+import { $ as $9ab94262bd0047c7$export$420e68273165f4ec, a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Cgm0R4Cf.js";
+import { a as $458b0a5536c1a7cf$export$40bfa8c7b0832715, e as $03deb23ff14920c4$export$4eaf04e54aa8eed6, z as $7215afc6de606d6b$export$de79e2c695e052f3, A as $46d819fcbaf35654$export$8f71654801c2f7cd, n as $a1ea59d68270f0dd$export$f8168d8dd8fd66e6, b as $c87311424ea30a05$export$fedb369cb70207f1, s as $c87311424ea30a05$export$a11b0059900ceec8, w as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-BRDW3y7-.js";
 import { $ as $799cddbef784668f$export$6e865ea70d7724f, b as $799cddbef784668f$export$4cde5df63f53f473, a as $3493a52097159720$exports } from "../../Color-WxFE7lQB.js";
 import { a as $9446cca9a3875146$export$cb6e0bb50bc19463, $ as $9446cca9a3875146$export$7d15b64cf5a3a4c4 } from "../../number-7sOvrqo0.js";
 import { $ as $313b98861ee5dd6c$export$d6875122194c7b44 } from "../../useLabels-Cdxi6JSa.js";
 import { $ as $99facab73266f662$export$5add1d006293d136 } from "../../useFormReset-yV9VVy9R.js";
-import { e as $28f99e3e86e6ec45$export$e5fda3247f5d67f9, f as $e8a7022cf87cba2a$export$36da96379f79f245, g as $bcca50147b47f54d$export$56b2c08e277f365, h as $47b897dc8cdb026b$export$8d15029008292ae, d as $6f909507e6374d18$export$1e7083018727fa60, i as $6f909507e6374d18$export$f1fce0420cc6d8ee, j as $6f909507e6374d18$export$6189c2744041d8f8, a as $6f909507e6374d18$export$105594979f116971 } from "../../Slider-ChP04COa.js";
+import { e as $28f99e3e86e6ec45$export$e5fda3247f5d67f9, f as $e8a7022cf87cba2a$export$36da96379f79f245, g as $bcca50147b47f54d$export$56b2c08e277f365, h as $47b897dc8cdb026b$export$8d15029008292ae, d as $6f909507e6374d18$export$1e7083018727fa60, i as $6f909507e6374d18$export$f1fce0420cc6d8ee, j as $6f909507e6374d18$export$6189c2744041d8f8, a as $6f909507e6374d18$export$105594979f116971 } from "../../Slider-DfU6bRtH.js";
 import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-DMOmz986.js";
 import { $ as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "../../useLocalizedStringFormatter-eaZiN2tE.js";
-import { a as $5c3e21d68f1c4674$export$a966af930f325cab } from "../../VisuallyHidden-X6SggVVO.js";
+import { a as $5c3e21d68f1c4674$export$a966af930f325cab } from "../../VisuallyHidden-CgnIuZJ2.js";
 import { $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-B8BgFmIQ.js";
-import { b as $3985021b0ad6602f$export$37fb8590cf2c088c, a as $a049562f99e7db0e$export$f9c6924e160136d1, $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-ChJaTNa5.js";
+import { b as $3985021b0ad6602f$export$37fb8590cf2c088c, a as $a049562f99e7db0e$export$f9c6924e160136d1, $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-8yja_IHC.js";
 import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DWVaNd2E.js";
 import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-AxKZjtFm.js";
-import { $ as $de67e98908f0c6ee$export$7f629e9dc1ecf37c, b as $d2e8511e6f209edf$export$e908e06f4b8e3402, c as $7d0a636d7a4dcefd$export$2123ff2b87c81ca, d as $d841c8010a73d545$export$4f384c9210e583c3, a as $81397a9303501bda$export$23f548e970bdf099 } from "../../useNumberField-BCjjZWaz.js";
-import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, b as $e5be200c675c3b3a$export$a763b9476acd3eb } from "../../useFormValidation-CUtZcedF.js";
+import { $ as $de67e98908f0c6ee$export$7f629e9dc1ecf37c, b as $d2e8511e6f209edf$export$e908e06f4b8e3402, c as $7d0a636d7a4dcefd$export$2123ff2b87c81ca, d as $d841c8010a73d545$export$4f384c9210e583c3, a as $81397a9303501bda$export$23f548e970bdf099 } from "../../useNumberField-D16dDfYF.js";
+import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, b as $e5be200c675c3b3a$export$a763b9476acd3eb } from "../../useFormValidation-CeNsUGWK.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { BaseControl } from "../base-control/base-control.js";
 import { _ as __ } from "../../default-i18n-CN_q3KUs.js";

package/dist/components/expandable/expandable.js

@@ -6,20 +6,19 @@ import { Button } from "../button/button.js";
 import { icons } from "../../icons/icons.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { _ as __ } from "../../default-i18n-CN_q3KUs.js";
-import { a as $d2b4bc8c273e7be6$export$24d547caef80ccd1 } from "../../Button-npzfSoYo.js";
+import { a as $d2b4bc8c273e7be6$export$24d547caef80ccd1 } from "../../Button-CQ5ZZJ2w.js";
 import { d as $bdb11010cef70236$export$f680877a34711e37, n as $b5e257d569688ac6$export$535bd6ca7f90a273, k as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, a as $64fa3d84918910a7$export$29f1550f4b0d4415, h as $64fa3d84918910a7$export$4d86445c2cf5e3, i as $64fa3d84918910a7$export$2881499e37b75b9a, o as $64fa3d84918910a7$export$c62b8e45d58ddad9, b as $3ef42575df84b30b$export$9d1611c77c2fe928, m as $5dc95899b306f630$export$c9058316764c140e } from "../../utils-cvK1vxO7.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-D2C6R0DK.js";
-import { a as $458b0a5536c1a7cf$export$40bfa8c7b0832715 } from "../../useHover-LmGemtHE.js";
+import { a as $458b0a5536c1a7cf$export$40bfa8c7b0832715 } from "../../useHover-BRDW3y7-.js";
 import { r as reactDomExports } from "../../index-D8-Zjpbd.js";
 import { $ as $e9faafb641e167db$export$90fc3a17d93f704c } from "../../useEvent-BifIGnVS.js";
-import { a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-CUxgjvAY.js";
+import { a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Cgm0R4Cf.js";
 import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DWVaNd2E.js";
 function $5e910fae8e128ead$export$6e3e27031a30522f(props, state, ref) {
   let { isDisabled } = props;
   let triggerId = $bdb11010cef70236$export$f680877a34711e37();
   let panelId = $bdb11010cef70236$export$f680877a34711e37();
   let isSSR = $b5e257d569688ac6$export$535bd6ca7f90a273();
-  let supportsBeforeMatch = !isSSR && "onbeforematch" in document.body;
   let raf = useRef(null);
   let handleBeforeMatch = useCallback(() => {
     raf.current = requestAnimationFrame(() => {
@@ -32,18 +31,49 @@ function $5e910fae8e128ead$export$6e3e27031a30522f(props, state, ref) {
     ref,
     state
   ]);
-  $e9faafb641e167db$export$90fc3a17d93f704c(ref, "beforematch", supportsBeforeMatch ? handleBeforeMatch : null);
+  $e9faafb641e167db$export$90fc3a17d93f704c(ref, "beforematch", handleBeforeMatch);
+  let isExpandedRef = useRef(null);
   $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(() => {
     if (raf.current) cancelAnimationFrame(raf.current);
-    if (supportsBeforeMatch && ref.current && !isDisabled) {
-      if (state.isExpanded) ref.current.removeAttribute("hidden");
-      else ref.current.setAttribute("hidden", "until-found");
+    if (ref.current && !isDisabled && !isSSR) {
+      let panel = ref.current;
+      if (isExpandedRef.current == null || typeof panel.getAnimations !== "function") {
+        if (state.isExpanded) {
+          panel.removeAttribute("hidden");
+          panel.style.setProperty("--disclosure-panel-width", "auto");
+          panel.style.setProperty("--disclosure-panel-height", "auto");
+        } else {
+          panel.setAttribute("hidden", "until-found");
+          panel.style.setProperty("--disclosure-panel-width", "0px");
+          panel.style.setProperty("--disclosure-panel-height", "0px");
+        }
+      } else if (state.isExpanded !== isExpandedRef.current) {
+        if (state.isExpanded) {
+          panel.removeAttribute("hidden");
+          panel.style.setProperty("--disclosure-panel-width", panel.scrollWidth + "px");
+          panel.style.setProperty("--disclosure-panel-height", panel.scrollHeight + "px");
+          Promise.all(panel.getAnimations().map((a) => a.finished)).then(() => {
+            panel.style.setProperty("--disclosure-panel-width", "auto");
+            panel.style.setProperty("--disclosure-panel-height", "auto");
+          }).catch(() => {
+          });
+        } else {
+          panel.style.setProperty("--disclosure-panel-width", panel.scrollWidth + "px");
+          panel.style.setProperty("--disclosure-panel-height", panel.scrollHeight + "px");
+          window.getComputedStyle(panel).height;
+          panel.style.setProperty("--disclosure-panel-width", "0px");
+          panel.style.setProperty("--disclosure-panel-height", "0px");
+          Promise.all(panel.getAnimations().map((a) => a.finished)).then(() => panel.setAttribute("hidden", "until-found")).catch(() => {
+          });
+        }
+      }
+      isExpandedRef.current = state.isExpanded;
     }
   }, [
     isDisabled,
     ref,
     state.isExpanded,
-    supportsBeforeMatch
+    isSSR
   ]);
   useEffect(() => {
     return () => {
@@ -69,7 +99,7 @@ function $5e910fae8e128ead$export$6e3e27031a30522f(props, state, ref) {
       role: "group",
       "aria-labelledby": triggerId,
       "aria-hidden": !state.isExpanded,
-      hidden: supportsBeforeMatch ? true : !state.isExpanded
+      hidden: isSSR || isDisabled ? isDisabled || !state.isExpanded : void 0
     }
   };
 }

package/dist/components/index.js

@@ -14,6 +14,7 @@ import { DraggableContext } from "./draggable/draggable-context.js";
 import { Draggable } from "./draggable/draggable.js";
 import { DraggableHandle } from "./draggable/draggable-handle.js";
 import { Expandable } from "./expandable/expandable.js";
+import { FilePickerShell } from "./placeholders/file-picker-shell.js";
 import { FilePlaceholder } from "./placeholders/file-placeholder.js";
 import { GradientEditor } from "./color-pickers/gradient-editor.js";
 import { HStack } from "./layout/hstack.js";
@@ -49,6 +50,7 @@ import { OptionSelect } from "./option-select/option-select.js";
 import { OptionsPanel, OptionsPanelHeader, OptionsPanelIntro, OptionsPanelSection } from "./options-panel/options-panel.js";
 import { Select } from "./select/single-select.js";
 import { Slider } from "./slider/slider.js";
+import { SmartImage } from "./smart-image/smart-image.js";
 import { SolidColorPicker } from "./color-pickers/solid-color-picker.js";
 import { Spacer } from "./spacer/spacer.js";
 import { Tab, TabList, TabPanel, Tabs } from "./tabs/tabs.js";
@@ -81,6 +83,7 @@ export {
   DraggableListItem,
   DraggableListItemHandle,
   Expandable,
+  FilePickerShell,
   FilePlaceholder,
   GradientEditor,
   HStack,
@@ -126,6 +129,7 @@ export {
   Select,
   SelectNext,
   Slider,
+  SmartImage,
   SolidColorPicker,
   Spacer,
   SubMenuItem,

package/dist/components/input-field/input-field.js

@@ -1,12 +1,12 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { d as $2d73ec29415bd339$export$712718f7aec83d5, b as $3985021b0ad6602f$export$37fb8590cf2c088c, a as $a049562f99e7db0e$export$f9c6924e160136d1, $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-ChJaTNa5.js";
+import { d as $2d73ec29415bd339$export$712718f7aec83d5, b as $3985021b0ad6602f$export$37fb8590cf2c088c, a as $a049562f99e7db0e$export$f9c6924e160136d1, $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-8yja_IHC.js";
 import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DWVaNd2E.js";
 import { a as $64fa3d84918910a7$export$29f1550f4b0d4415, h as $64fa3d84918910a7$export$4d86445c2cf5e3, b as $3ef42575df84b30b$export$9d1611c77c2fe928, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, f as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, g as $64fa3d84918910a7$export$ef03459518577ad4, i as $64fa3d84918910a7$export$2881499e37b75b9a } from "../../utils-cvK1vxO7.js";
 import React__default, { forwardRef, createContext, useRef, useState, useCallback } from "react";
-import { w as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-LmGemtHE.js";
-import { a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-CUxgjvAY.js";
+import { w as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-BRDW3y7-.js";
+import { a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Cgm0R4Cf.js";
 import { $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-B8BgFmIQ.js";
-import { $ as $8e6cc465cc68f603$export$698f465ec27e93df } from "../../context-DCAZLyDS.js";
+import { a as $4e85f108e88277b8$export$698f465ec27e93df } from "../../RSPContexts-CJ-HBf0L.js";
 import { $ as $d3e0e05bdfcf66bd$export$c24727297075ec6a } from "../../Form-Cq3fu75_.js";
 import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-AxKZjtFm.js";
 import { $ as $f39a9eba43920ace$export$86427a43e3e48ebb } from "../../Hidden-rE6uR-lr.js";
@@ -55,7 +55,7 @@ const $bcdf0525bf22703d$export$2c73285ae9390cec = /* @__PURE__ */ $f39a9eba43920
   var _props_validationBehavior, _ref;
   let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : "native";
   let inputRef = useRef(null);
-  [props, inputRef] = $64fa3d84918910a7$export$29f1550f4b0d4415(props, inputRef, $8e6cc465cc68f603$export$698f465ec27e93df);
+  [props, inputRef] = $64fa3d84918910a7$export$29f1550f4b0d4415(props, inputRef, $4e85f108e88277b8$export$698f465ec27e93df);
   let [labelRef, label] = $64fa3d84918910a7$export$9d4c57ee4c6ffdd8(!props["aria-label"] && !props["aria-labelledby"]);
   let [inputElementType, setInputElementType] = useState("input");
   let { labelProps, inputProps, descriptionProps, errorMessageProps, ...validation } = $2d73ec29415bd339$export$712718f7aec83d5({

package/dist/components/link-input/link-input.js

@@ -1,25 +1,26 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { c as $319e236875307eab$export$a9b970dcc4ae71a9, a as $d2b4bc8c273e7be6$export$24d547caef80ccd1, $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-npzfSoYo.js";
+import { c as $319e236875307eab$export$a9b970dcc4ae71a9, a as $d2b4bc8c273e7be6$export$24d547caef80ccd1, $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-CQ5ZZJ2w.js";
 import { p as $ff5963eb1fccf552$export$e08e3b67e392101e, b as $3ef42575df84b30b$export$9d1611c77c2fe928, a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, f as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, g as $64fa3d84918910a7$export$ef03459518577ad4, h as $64fa3d84918910a7$export$4d86445c2cf5e3, i as $64fa3d84918910a7$export$2881499e37b75b9a } from "../../utils-cvK1vxO7.js";
 import { $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-B8BgFmIQ.js";
 import { $ as $d3e0e05bdfcf66bd$export$c24727297075ec6a } from "../../Form-Cq3fu75_.js";
-import { d as $2d73ec29415bd339$export$712718f7aec83d5, b as $3985021b0ad6602f$export$37fb8590cf2c088c, a as $a049562f99e7db0e$export$f9c6924e160136d1, c as $a049562f99e7db0e$export$eb2fcfdbd7ba97d4, $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-ChJaTNa5.js";
+import { d as $2d73ec29415bd339$export$712718f7aec83d5, b as $3985021b0ad6602f$export$37fb8590cf2c088c, a as $a049562f99e7db0e$export$f9c6924e160136d1, c as $a049562f99e7db0e$export$eb2fcfdbd7ba97d4, $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-8yja_IHC.js";
 import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DWVaNd2E.js";
-import { e as $b1f0cad8af73213b$export$3585ede4d035bf14, f as $b1f0cad8af73213b$export$9145995848b05025, c as $eed445e0843c11d0$export$7ff8f37d2d81a48d, d as $eed445e0843c11d0$export$7c5906fe4f1f2af2, $ as $eed445e0843c11d0$export$41f133550aa26f48, a as $eed445e0843c11d0$export$a11e76429ed99b4 } from "../../ListBox-D0Stb4wr.js";
-import { o as $168583247155ddda$export$dc9c12ed27dd1b49, k as $5e3802645cc19319$export$1c3ebcada18427bf, l as $de32f1b87079253c$export$d2f961adcb0afbe, p as $07b14b47974efb58$export$9b9a0cd73afb7ca4, e as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-CQ8H6Noi.js";
+import { c as $b1f0cad8af73213b$export$3585ede4d035bf14, d as $b1f0cad8af73213b$export$9145995848b05025, e as $eed445e0843c11d0$export$7ff8f37d2d81a48d, f as $eed445e0843c11d0$export$7c5906fe4f1f2af2, $ as $eed445e0843c11d0$export$41f133550aa26f48, a as $eed445e0843c11d0$export$a11e76429ed99b4 } from "../../ListBox-DggfiuO_.js";
+import { o as $168583247155ddda$export$dc9c12ed27dd1b49, k as $5e3802645cc19319$export$1c3ebcada18427bf, l as $de32f1b87079253c$export$d2f961adcb0afbe, p as $07b14b47974efb58$export$9b9a0cd73afb7ca4, e as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-BMgMUQuN.js";
 import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-AxKZjtFm.js";
-import { k as $ae20dd8cbca75726$export$d6daf82dcd84e87c, q as $c5a24bc478652b5f$export$1005530eda016c13, t as $55f9b1ae81f22853$export$2b35b76d2e30e129, e as $e1995378a142960e$export$bf788dd355e3a401 } from "../../SelectionManager-CabSdgMq.js";
+import { m as $ae20dd8cbca75726$export$d6daf82dcd84e87c, r as $c5a24bc478652b5f$export$1005530eda016c13, t as $55f9b1ae81f22853$export$2b35b76d2e30e129, g as $e1995378a142960e$export$bf788dd355e3a401 } from "../../SelectionManager-B6-b5NM2.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-D2C6R0DK.js";
-import { $ as $fc909762b330b746$export$61c6a8c84e605fb6, f as $9daab02d461809db$export$683480f191c0e3ea } from "../../OverlayArrow-DivvkAVb.js";
+import { $ as $fc909762b330b746$export$61c6a8c84e605fb6, f as $9daab02d461809db$export$683480f191c0e3ea } from "../../OverlayArrow-DraDOoRn.js";
 import React__default, { useRef, useEffect, useMemo, useState, useCallback, forwardRef, createContext, cloneElement } from "react";
-import { $ as $bb77f239b46e8c72$export$3274cf84b703fff } from "../../useFilter-C4wo8Iii.js";
-import { b as $e5be200c675c3b3a$export$a763b9476acd3eb, $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10 } from "../../useFormValidation-CUtZcedF.js";
-import { $ as $a0d645289fe9b86b$export$e7f05e985daf4b5f } from "../../useSingleSelectListState-DattSD7d.js";
-import { c as $a02d57049d202695$export$d085fb9e920b5ca7 } from "../../useListState-Xsk-aOvN.js";
-import { J as $c87311424ea30a05$export$e1865c3bedcd822b, g as $d4ee10de306f2510$export$cd4e5573fbe2b576, c as $431fbd86ca7dc216$export$b204af158042fbac, a as $458b0a5536c1a7cf$export$40bfa8c7b0832715 } from "../../useHover-LmGemtHE.js";
-import { b as $ea8dcbcb9ea1b556$export$9a302a45f65d0572 } from "../../usePress-CBQIDzpQ.js";
+import { $ as $bb77f239b46e8c72$export$3274cf84b703fff } from "../../useFilter-BlkUH1Ma.js";
+import { b as $e5be200c675c3b3a$export$a763b9476acd3eb, $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10 } from "../../useFormValidation-CeNsUGWK.js";
+import { $ as $a0d645289fe9b86b$export$e7f05e985daf4b5f } from "../../useSingleSelectListState-n0AVMr3Y.js";
+import { c as $a02d57049d202695$export$d085fb9e920b5ca7 } from "../../useListState-RdLrYsMP.js";
+import { J as $c87311424ea30a05$export$e1865c3bedcd822b, g as $d4ee10de306f2510$export$cd4e5573fbe2b576, c as $431fbd86ca7dc216$export$b204af158042fbac, a as $458b0a5536c1a7cf$export$40bfa8c7b0832715 } from "../../useHover-BRDW3y7-.js";
+import { b as $ea8dcbcb9ea1b556$export$9a302a45f65d0572 } from "../../usePress-DJskZBH9.js";
 import { $ as $313b98861ee5dd6c$export$d6875122194c7b44 } from "../../useLabels-Cdxi6JSa.js";
-import { f as $2a25aae57d74318e$export$a05409b8bb224a5a, e as $453cc9f0df89c0a5$export$77d5aafae4e095b2 } from "../../Separator-BPvqJny4.js";
+import { $ as $e9faafb641e167db$export$90fc3a17d93f704c } from "../../useEvent-BifIGnVS.js";
+import { f as $2a25aae57d74318e$export$a05409b8bb224a5a, e as $453cc9f0df89c0a5$export$77d5aafae4e095b2 } from "../../Separator-B-xeqOkC.js";
 import { $ as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "../../useLocalizedStringFormatter-eaZiN2tE.js";
 import { _ as __ } from "../../default-i18n-CN_q3KUs.js";
 import { icons } from "../../icons/icons.js";
@@ -809,14 +810,20 @@ function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
       case "Enter":
       case "Tab":
         if (state.isOpen && e.key === "Enter") e.preventDefault();
-        if (state.isOpen && listBoxRef.current && state.selectionManager.focusedKey != null && state.selectionManager.isLink(state.selectionManager.focusedKey)) {
-          let item = listBoxRef.current.querySelector(`[data-key="${CSS.escape(state.selectionManager.focusedKey.toString())}"]`);
-          if (e.key === "Enter" && item instanceof HTMLAnchorElement) {
-            let collectionItem = state.collection.getItem(state.selectionManager.focusedKey);
-            if (collectionItem) router.open(item, e, collectionItem.props.href, collectionItem.props.routerOptions);
+        if (state.isOpen && listBoxRef.current && state.selectionManager.focusedKey != null) {
+          let collectionItem = state.collection.getItem(state.selectionManager.focusedKey);
+          if (collectionItem === null || collectionItem === void 0 ? void 0 : collectionItem.props.href) {
+            let item = listBoxRef.current.querySelector(`[data-key="${CSS.escape(state.selectionManager.focusedKey.toString())}"]`);
+            if (e.key === "Enter" && item instanceof HTMLAnchorElement) router.open(item, e, collectionItem.props.href, collectionItem.props.routerOptions);
+            state.close();
+            break;
+          } else if (collectionItem === null || collectionItem === void 0 ? void 0 : collectionItem.props.onAction) {
+            collectionItem.props.onAction();
+            state.close();
+            break;
           }
-          state.close();
-        } else state.commit();
+        }
+        state.commit();
         break;
       case "Escape":
         if (state.selectedKey !== null || state.inputValue === "" || props.allowsCustomValue) e.continuePropagation();
@@ -972,6 +979,9 @@ function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
   }, [
     focusedItem
   ]);
+  $e9faafb641e167db$export$90fc3a17d93f704c(listBoxRef, "react-aria-item-action", state.isOpen ? () => {
+    state.close();
+  } : void 0);
   return {
     labelProps,
     buttonProps: {
@@ -1001,7 +1011,8 @@ function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
       shouldUseVirtualFocus: true,
       shouldSelectOnPressUp: true,
       shouldFocusOnHover: true,
-      linkBehavior: "selection"
+      linkBehavior: "selection",
+      ["UNSTABLE_itemBehavior"]: "action"
     }),
     descriptionProps,
     errorMessageProps,

package/dist/components/menu/menu.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { $ as $72a5793c14baf454$export$8b251419efc915eb, a as $431f98aba6844401$export$1ff3c3f08ae963c0 } from "../../Separator-BPvqJny4.js";
-import { $ as $3674c52c6b3c5bce$export$27d2ad3c5815583e, a as $3674c52c6b3c5bce$export$d9b273488cd8ce6f, b as $3674c52c6b3c5bce$export$2ce376c2cc3355c8, c as $3674c52c6b3c5bce$export$4b1545b4f2016d26, d as $3674c52c6b3c5bce$export$ecabc99eeffab7ca } from "../../Dialog-CQ8H6Noi.js";
+import { $ as $72a5793c14baf454$export$8b251419efc915eb, a as $431f98aba6844401$export$1ff3c3f08ae963c0 } from "../../Separator-B-xeqOkC.js";
+import { $ as $3674c52c6b3c5bce$export$27d2ad3c5815583e, a as $3674c52c6b3c5bce$export$d9b273488cd8ce6f, b as $3674c52c6b3c5bce$export$2ce376c2cc3355c8, c as $3674c52c6b3c5bce$export$4b1545b4f2016d26, d as $3674c52c6b3c5bce$export$ecabc99eeffab7ca } from "../../Dialog-BMgMUQuN.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 import { icons } from "../../icons/icons.js";
 import { Button } from "../button/button.js";

package/dist/components/modal/modal.js

@@ -1,10 +1,11 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { h as $a11501f3d1d39e6c$export$ea8f71083e90600f, i as $49c51c25361d4cd2$export$ee0f7cc6afcd1c18, j as $337b884510726a0d$export$14c98a7594375490, k as $5e3802645cc19319$export$1c3ebcada18427bf, l as $de32f1b87079253c$export$d2f961adcb0afbe, m as $86ea4cb521eb2e37$export$2317d149ed6f78c4, n as $337b884510726a0d$export$c6fdb837b070b4ff, g as $de32f1b87079253c$export$2e1e1122cf0cba88, f as $de32f1b87079253c$export$3ddf2d174ce01153 } from "../../Dialog-CQ8H6Noi.js";
-import { $ as $5cb03073d3f54797$export$a8a3e93435678ff9 } from "../../Heading-bh1HU5HH.js";
+import { h as $a11501f3d1d39e6c$export$ea8f71083e90600f, i as $49c51c25361d4cd2$export$ee0f7cc6afcd1c18, j as $337b884510726a0d$export$14c98a7594375490, k as $5e3802645cc19319$export$1c3ebcada18427bf, l as $de32f1b87079253c$export$d2f961adcb0afbe, m as $86ea4cb521eb2e37$export$2317d149ed6f78c4, n as $337b884510726a0d$export$c6fdb837b070b4ff, g as $de32f1b87079253c$export$2e1e1122cf0cba88, f as $de32f1b87079253c$export$3ddf2d174ce01153 } from "../../Dialog-BMgMUQuN.js";
+import { $ as $5cb03073d3f54797$export$a8a3e93435678ff9 } from "../../Heading-B5aEynOM.js";
 import { n as $b5e257d569688ac6$export$535bd6ca7f90a273, b as $3ef42575df84b30b$export$9d1611c77c2fe928, a as $64fa3d84918910a7$export$29f1550f4b0d4415, l as $df56164dff5785e2$export$4338b53315abf666, m as $5dc95899b306f630$export$c9058316764c140e, h as $64fa3d84918910a7$export$4d86445c2cf5e3, i as $64fa3d84918910a7$export$2881499e37b75b9a } from "../../utils-cvK1vxO7.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-D2C6R0DK.js";
+import { c as $21f1aa98acb08317$export$c57958e35f31ed73, d as $cc38e7bd3fc7b213$export$2bb74740c4e19def } from "../../SelectionManager-B6-b5NM2.js";
 import React__default, { useState, useEffect, forwardRef, useContext, createContext, useRef, useMemo } from "react";
-import { $ as $fc909762b330b746$export$61c6a8c84e605fb6, a as $d3f049242431219c$export$45fda7c47f93fd48, b as $d3f049242431219c$export$6d3443f2c48bfc20 } from "../../OverlayArrow-DivvkAVb.js";
+import { $ as $fc909762b330b746$export$61c6a8c84e605fb6, a as $d3f049242431219c$export$45fda7c47f93fd48, b as $d3f049242431219c$export$6d3443f2c48bfc20 } from "../../OverlayArrow-DraDOoRn.js";
 import { Button } from "../button/button.js";
 import { _ as __ } from "../../default-i18n-CN_q3KUs.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
@@ -20,15 +21,34 @@ function $5df64b3807dc15ee$export$d699905dd57c73ca() {
   } : $5df64b3807dc15ee$var$getViewportSize());
   useEffect(() => {
     let onResize = () => {
+      if ($5df64b3807dc15ee$var$visualViewport && $5df64b3807dc15ee$var$visualViewport.scale > 1) return;
       setSize((size2) => {
         let newSize = $5df64b3807dc15ee$var$getViewportSize();
         if (newSize.width === size2.width && newSize.height === size2.height) return size2;
         return newSize;
       });
     };
+    let frame;
+    let onBlur = (e) => {
+      if ($5df64b3807dc15ee$var$visualViewport && $5df64b3807dc15ee$var$visualViewport.scale > 1) return;
+      if ($21f1aa98acb08317$export$c57958e35f31ed73(e.target))
+        frame = requestAnimationFrame(() => {
+          if (!document.activeElement || !$21f1aa98acb08317$export$c57958e35f31ed73(document.activeElement)) setSize((size2) => {
+            let newSize = {
+              width: window.innerWidth,
+              height: window.innerHeight
+            };
+            if (newSize.width === size2.width && newSize.height === size2.height) return size2;
+            return newSize;
+          });
+        });
+    };
+    window.addEventListener("blur", onBlur, true);
     if (!$5df64b3807dc15ee$var$visualViewport) window.addEventListener("resize", onResize);
     else $5df64b3807dc15ee$var$visualViewport.addEventListener("resize", onResize);
     return () => {
+      cancelAnimationFrame(frame);
+      window.removeEventListener("blur", onBlur, true);
       if (!$5df64b3807dc15ee$var$visualViewport) window.removeEventListener("resize", onResize);
       else $5df64b3807dc15ee$var$visualViewport.removeEventListener("resize", onResize);
     };
@@ -37,8 +57,9 @@ function $5df64b3807dc15ee$export$d699905dd57c73ca() {
 }
 function $5df64b3807dc15ee$var$getViewportSize() {
   return {
-    width: $5df64b3807dc15ee$var$visualViewport && ($5df64b3807dc15ee$var$visualViewport === null || $5df64b3807dc15ee$var$visualViewport === void 0 ? void 0 : $5df64b3807dc15ee$var$visualViewport.width) || window.innerWidth,
-    height: $5df64b3807dc15ee$var$visualViewport && ($5df64b3807dc15ee$var$visualViewport === null || $5df64b3807dc15ee$var$visualViewport === void 0 ? void 0 : $5df64b3807dc15ee$var$visualViewport.height) || window.innerHeight
+    // Multiply by the visualViewport scale to get the "natural" size, unaffected by pinch zooming.
+    width: $5df64b3807dc15ee$var$visualViewport ? $5df64b3807dc15ee$var$visualViewport.width * $5df64b3807dc15ee$var$visualViewport.scale : window.innerWidth,
+    height: $5df64b3807dc15ee$var$visualViewport ? $5df64b3807dc15ee$var$visualViewport.height * $5df64b3807dc15ee$var$visualViewport.scale : window.innerHeight
   };
 }
 function $8ac8429251c45e4b$export$dbc0f175b25fb0fb(props, state, ref) {
@@ -146,9 +167,16 @@ function $f3f84453ead64de5$var$ModalOverlayInner({ UNSTABLE_portalContainer, ...
     }
   });
   let viewport = $5df64b3807dc15ee$export$d699905dd57c73ca();
+  let pageHeight = void 0;
+  if (typeof document !== "undefined") {
+    let scrollingElement = $cc38e7bd3fc7b213$export$2bb74740c4e19def(document.body) ? document.body : document.scrollingElement || document.documentElement;
+    let fractionalHeightDifference = scrollingElement.getBoundingClientRect().height % 1;
+    pageHeight = scrollingElement.scrollHeight - fractionalHeightDifference;
+  }
   let style = {
     ...renderProps.style,
-    "--visual-viewport-height": viewport.height + "px"
+    "--visual-viewport-height": viewport.height + "px",
+    "--page-height": pageHeight !== void 0 ? pageHeight + "px" : void 0
   };
   return /* @__PURE__ */ React__default.createElement($337b884510726a0d$export$c6fdb837b070b4ff, {
     isExiting: props.isExiting,