@lobehub/ui 5.57.1 → 5.57.2

package/es/ActionIcon/index.mjs

@@ -1,2 +1 @@
-import ActionIcon from "./ActionIcon.mjs";
-export { ActionIcon as default };
+export { default } from "./ActionIcon.mjs";

package/es/ActionIconGroup/index.mjs

@@ -1,2 +1 @@
-import ActionIconGroup from "./ActionIconGroup.mjs";
-export { ActionIconGroup as default };
+export { default } from "./ActionIconGroup.mjs";

package/es/Alert/index.mjs

@@ -1,2 +1 @@
-import Alert from "./Alert.mjs";
-export { Alert as default };
+export { default } from "./Alert.mjs";

package/es/AutoComplete/index.mjs

@@ -1,2 +1 @@
-import AutoComplete from "./Select.mjs";
-export { AutoComplete as default };
+export { default } from "./Select.mjs";

package/es/Block/index.mjs

@@ -1,2 +1 @@
-import Block from "./Block.mjs";
-export { Block as default };
+export { default } from "./Block.mjs";

package/es/Burger/index.mjs

@@ -1,2 +1 @@
-import Burger from "./Burger.mjs";
-export { Burger as default };
+export { default } from "./Burger.mjs";

package/es/Button/index.mjs

@@ -1,2 +1 @@
-import Button from "./Button.mjs";
-export { Button as default };
+export { default } from "./Button.mjs";

package/es/CodeEditor/index.mjs

@@ -1,2 +1 @@
-import CodeEditor from "./CodeEditor.mjs";
-export { CodeEditor as default };
+export { default } from "./CodeEditor.mjs";

package/es/Collapse/index.mjs

@@ -1,2 +1 @@
-import Collapse from "./Collapse.mjs";
-export { Collapse as default };
+export { default } from "./Collapse.mjs";

package/es/ColorSwatches/index.mjs

@@ -1,2 +1 @@
-import ColorSwatches from "./ColorSwatches.mjs";
-export { ColorSwatches as default };
+export { default } from "./ColorSwatches.mjs";

package/es/CopyButton/index.mjs

@@ -1,2 +1 @@
-import CopyButton from "./CopyButton.mjs";
-export { CopyButton as default };
+export { default } from "./CopyButton.mjs";

package/es/DatePicker/index.mjs

@@ -1,2 +1 @@
-import DatePicker from "./DatePicker.mjs";
-export { DatePicker as default };
+export { default } from "./DatePicker.mjs";

package/es/DownloadButton/index.mjs

@@ -1,2 +1 @@
-import DownloadButton from "./DownloadButton.mjs";
-export { DownloadButton as default };
+export { default } from "./DownloadButton.mjs";

package/es/DraggableSideNav/index.mjs

@@ -1,2 +1 @@
-import DraggableSideNav from "./DraggableSideNav.mjs";
-export { DraggableSideNav as default };
+export { default } from "./DraggableSideNav.mjs";

package/es/Drawer/index.mjs

@@ -1,2 +1 @@
-import Drawer from "./Drawer.mjs";
-export { Drawer as default };
+export { default } from "./Drawer.mjs";

package/es/Dropdown/index.mjs

@@ -1,2 +1 @@
-import Dropdown from "./Dropdown.mjs";
-export { Dropdown as default };
+export { default } from "./Dropdown.mjs";

package/es/EditableText/index.mjs

@@ -1,2 +1 @@
-import EditableText from "./EditableText.mjs";
-export { EditableText as default };
+export { default } from "./EditableText.mjs";

package/es/EmojiPicker/index.mjs

@@ -1,2 +1 @@
-import EmojiPicker from "./EmojiPicker.mjs";
-export { EmojiPicker as default };
+export { default } from "./EmojiPicker.mjs";

package/es/Empty/index.mjs

@@ -1,2 +1 @@
-import Empty from "./Empty.mjs";
-export { Empty as default };
+export { default } from "./Empty.mjs";

package/es/FileTypeIcon/index.mjs

@@ -1,2 +1 @@
-import FileTypeIcon from "./FileTypeIcon.mjs";
-export { FileTypeIcon as default };
+export { default } from "./FileTypeIcon.mjs";

package/es/FluentEmoji/index.mjs

@@ -1,2 +1 @@
-import FluentEmoji from "./FluentEmoji.mjs";
-export { FluentEmoji as default };
+export { default } from "./FluentEmoji.mjs";

package/es/Footer/index.mjs

@@ -1,2 +1 @@
-import Footer from "./Footer.mjs";
-export { Footer as default };
+export { default } from "./Footer.mjs";

package/es/FormModal/index.mjs

@@ -1,2 +1 @@
-import FormModal from "./FormModal.mjs";
-export { FormModal as default };
+export { default } from "./FormModal.mjs";

package/es/Freeze/index.mjs

@@ -1,2 +1 @@
-import Freeze from "./Freeze.mjs";
-export { Freeze as default };
+export { default } from "./Freeze.mjs";

package/es/Grid/index.mjs

@@ -1,2 +1 @@
-import Grid from "./Grid.mjs";
-export { Grid as default };
+export { default } from "./Grid.mjs";

package/es/GroupAvatar/index.mjs

@@ -1,2 +1 @@
-import GroupAvatar from "./GroupAvatar.mjs";
-export { GroupAvatar as default };
+export { default } from "./GroupAvatar.mjs";

package/es/Header/index.mjs

@@ -1,2 +1 @@
-import Header from "./Header.mjs";
-export { Header as default };
+export { default } from "./Header.mjs";

package/es/HotkeyInput/index.mjs

@@ -1,2 +1 @@
-import HotkeyInput from "./HotkeyInput.mjs";
-export { HotkeyInput as default };
+export { default } from "./HotkeyInput.mjs";

package/es/MaskShadow/index.mjs

@@ -1,2 +1 @@
-import MaskShadow from "./MaskShadow.mjs";
-export { MaskShadow as default };
+export { default } from "./MaskShadow.mjs";

package/es/MaterialFileTypeIcon/index.mjs

@@ -1,2 +1 @@
-import MaterialFileTypeIcon from "./MaterialFileTypeIcon.mjs";
-export { MaterialFileTypeIcon as default };
+export { default } from "./MaterialFileTypeIcon.mjs";

package/es/ScrollShadow/index.mjs

@@ -1,2 +1 @@
-import ScrollShadow from "./ScrollShadow.mjs";
-export { ScrollShadow as default };
+export { default } from "./ScrollShadow.mjs";

package/es/SearchBar/index.mjs

@@ -1,2 +1 @@
-import SearchBar from "./SearchBar.mjs";
-export { SearchBar as default };
+export { default } from "./SearchBar.mjs";

package/es/Segmented/index.mjs

@@ -1,2 +1 @@
-import Segmented from "./Segmented.mjs";
-export { Segmented as default };
+export { default } from "./Segmented.mjs";

package/es/Select/index.mjs

@@ -1,2 +1 @@
-import Select from "./Select.mjs";
-export { Select as default };
+export { default } from "./Select.mjs";

package/es/SideNav/index.mjs

@@ -1,2 +1 @@
-import SideNav from "./SideNav.mjs";
-export { SideNav as default };
+export { default } from "./SideNav.mjs";

package/es/SliderWithInput/index.mjs

@@ -1,2 +1 @@
-import SliderWithInput from "./SliderWithInput.mjs";
-export { SliderWithInput as default };
+export { default } from "./SliderWithInput.mjs";

package/es/Snippet/index.mjs

@@ -1,2 +1 @@
-import Snippet from "./Snippet.mjs";
-export { Snippet as default };
+export { default } from "./Snippet.mjs";

package/es/SortableList/index.mjs

@@ -1,2 +1 @@
-import SortableList from "./SortableList.mjs";
-export { SortableList as default };
+export { default } from "./SortableList.mjs";

package/es/Tabs/index.mjs

@@ -1,2 +1 @@
-import Tabs from "./Tabs.mjs";
-export { Tabs as default };
+export { default } from "./Tabs.mjs";

package/es/Text/index.mjs

@@ -1,2 +1 @@
-import Text from "./Text.mjs";
-export { Text as default };
+export { default } from "./Text.mjs";

package/es/ThemeSwitch/index.mjs

@@ -1,2 +1 @@
-import ThemeSwitch from "./ThemeSwitch.mjs";
-export { ThemeSwitch as default };
+export { default } from "./ThemeSwitch.mjs";

package/es/Toast/index.mjs

@@ -1,2 +1 @@
-import { ToastHost, toast, useToast } from "../base-ui/Toast/imperative.mjs";
-export { ToastHost, toast, useToast };
+export { ToastHost, toast, useToast } from "../base-ui/Toast/imperative.mjs";

package/es/Toc/index.mjs

@@ -1,2 +1 @@
-import Toc from "./Toc.mjs";
-export { Toc as default };
+export { default } from "./Toc.mjs";

package/es/base-ui/Input/style.d.mts

@@ -30,7 +30,7 @@ declare const styles: {
 };
 declare const rootVariants: (props?: ({
   shadow?: boolean | null | undefined;
-  size?: "large" | "middle" | "small" | null | undefined;
+  size?: "small" | "middle" | "large" | null | undefined;
   variant?: "filled" | "outlined" | "borderless" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 //#endregion

package/es/base-ui/Popover/style.mjs

@@ -251,11 +251,11 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
       position: absolute;
       inset-block-start: 12px;
       inset-inline-start: var(--lobe-popover-viewport-inline-padding);
-      width: calc(var(--popup-width) - var(--lobe-popover-viewport-inline-padding) * 2 - 2px);
+      width: calc(var(--popup-width) - var(--lobe-popover-viewport-inline-padding) * 2);
     }
 
     &[data-transitioning] [data-current] {
-      width: calc(var(--positioner-width) - var(--lobe-popover-viewport-inline-padding) * 2 - 2px);
+      width: calc(var(--positioner-width) - var(--lobe-popover-viewport-inline-padding) * 2);
     }
 
     &[data-repop] [data-previous] {

package/es/base-ui/Popover/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Popover/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  arrow: css`\n    --lobe-popover-arrow-offset-block: 5px;\n    --lobe-popover-arrow-offset-inline: 8px;\n\n    pointer-events: none;\n\n    position: absolute;\n    transform-origin: center;\n\n    display: flex;\n\n    width: 12px;\n    height: 6px;\n\n    transition:\n      inset-inline-start var(--lobe-popover-layout-duration) var(--lobe-popover-layout-ease),\n      inset-block-start var(--lobe-popover-layout-duration) var(--lobe-popover-layout-ease);\n\n    & > svg {\n      display: block;\n      width: 100%;\n      height: 100%;\n    }\n\n    & [data-role='fill'] {\n      fill: ${cssVar.colorBgElevated};\n    }\n\n    & [data-role='stroke'] {\n      fill: none;\n      stroke: ${cssVar.colorBorder};\n      stroke-width: 1px;\n    }\n\n    &[data-side='top'] {\n      inset-block-end: calc(var(--lobe-popover-arrow-offset-block) * -1);\n      transform: rotate(180deg);\n    }\n\n    &[data-side='left'] {\n      inset-inline-end: calc(var(--lobe-popover-arrow-offset-inline) * -1);\n      transform: rotate(90deg);\n    }\n\n    &[data-side='right'] {\n      inset-inline-start: calc(var(--lobe-popover-arrow-offset-inline) * -1);\n      transform: rotate(-90deg);\n    }\n\n    &[data-side='bottom'] {\n      inset-block-start: calc(var(--lobe-popover-arrow-offset-block) * -1);\n    }\n  `,\n\n  popup: css`\n    position: relative;\n    transform-origin: var(--transform-origin);\n\n    box-sizing: border-box;\n    min-width: 120px;\n    max-width: var(--available-width);\n    border-radius: ${cssVar.borderRadius};\n\n    color: ${cssVar.colorText};\n\n    background: ${cssVar.colorBgElevated};\n    outline: none;\n    box-shadow: ${cssVar.boxShadowSecondary}, var(--lobe-ring);\n\n    transition-timing-function: var(--lobe-popover-animation-ease-out);\n    transition-duration: var(--lobe-popover-animation-duration);\n    transition-property: opacity, transform;\n\n    /* Base UI writes the old size into --popup-width/height on a trigger switch and the new size\n       one frame later; the box only morphs if width/height actually read them. */\n    &[data-layout-animation] {\n      width: var(--popup-width, auto);\n      height: var(--popup-height, auto);\n\n      transition-timing-function:\n        var(--lobe-popover-animation-ease-out), var(--lobe-popover-animation-ease-out),\n        var(--lobe-popover-layout-ease), var(--lobe-popover-layout-ease);\n      transition-duration:\n        var(--lobe-popover-animation-duration), var(--lobe-popover-animation-duration),\n        var(--lobe-popover-layout-duration), var(--lobe-popover-layout-duration);\n      transition-property: opacity, transform, width, height;\n    }\n\n    &[data-repop] {\n      transition: none;\n    }\n\n    &[data-starting-style],\n    &[data-ending-style] {\n      transform: translate3d(var(--lobe-popover-translate-x), var(--lobe-popover-translate-y), 0)\n        scale(var(--lobe-popover-animation-scale));\n      opacity: 0;\n    }\n\n    &[data-ending-style] {\n      transition-timing-function: var(--lobe-popover-animation-ease-in);\n      transition-duration: var(--lobe-popover-animation-duration-exit);\n    }\n\n    &[data-instant] {\n      transition: none;\n    }\n  `,\n\n  positioner: css`\n    --lobe-popover-animation-duration: 150ms;\n    --lobe-popover-animation-translate: 6px;\n    --lobe-popover-animation-scale: 0.96;\n    --lobe-popover-animation-ease-in: ease-in;\n    --lobe-popover-animation-duration-exit: 75ms;\n    --lobe-popover-animation-ease-out: ${cssVar.motionEaseOut};\n    --lobe-popover-translate-x: 0;\n    --lobe-popover-translate-y: calc(var(--lobe-popover-animation-translate) * -1);\n    --lobe-popover-layout-duration: 380ms;\n    --lobe-popover-layout-ease: linear(\n      0,\n      0.041,\n      0.14,\n      0.268,\n      0.407,\n      0.541,\n      0.661,\n      0.765,\n      0.849,\n      0.915,\n      0.964,\n      0.998,\n      1.02,\n      1.032,\n      1.038,\n      1.039,\n      1.036,\n      1.032,\n      1.027,\n      1.022,\n      1.016,\n      1.012,\n      1.008,\n      1.005,\n      1.003\n    );\n\n    z-index: 1100;\n\n    width: min(var(--positioner-width), var(--available-width));\n    height: var(--positioner-height);\n\n    transition-timing-function: var(--lobe-popover-animation-ease-out);\n    transition-duration: var(--lobe-popover-animation-duration);\n    transition-property: none;\n\n    &[data-layout-animation] {\n      transition-timing-function: var(--lobe-popover-layout-ease);\n      transition-duration: var(--lobe-popover-layout-duration);\n      transition-property:\n        inset-block-start, inset-inline-start, inset-inline-end, inset-block-end, transform;\n    }\n\n    &[data-instant],\n    &[data-repop] {\n      transition: none;\n    }\n\n    /* Fallback: never show a popover when the anchor is hidden or the positioner falls back to (0,0). */\n    &[data-anchor-hidden],\n    &[data-zero-origin='true'] {\n      pointer-events: none;\n      visibility: hidden;\n    }\n\n    &[data-placement='top'],\n    &[data-placement='topLeft'],\n    &[data-placement='topRight'] {\n      --lobe-popover-translate-x: 0;\n      --lobe-popover-translate-y: var(--lobe-popover-animation-translate);\n    }\n\n    &[data-placement='bottom'],\n    &[data-placement='bottomLeft'],\n    &[data-placement='bottomRight'] {\n      --lobe-popover-translate-x: 0;\n      --lobe-popover-translate-y: calc(var(--lobe-popover-animation-translate) * -1);\n    }\n\n    &[data-placement='left'],\n    &[data-placement='leftTop'],\n    &[data-placement='leftBottom'] {\n      --lobe-popover-translate-x: var(--lobe-popover-animation-translate);\n      --lobe-popover-translate-y: 0;\n    }\n\n    &[data-placement='right'],\n    &[data-placement='rightTop'],\n    &[data-placement='rightBottom'] {\n      --lobe-popover-translate-x: calc(var(--lobe-popover-animation-translate) * -1);\n      --lobe-popover-translate-y: 0;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      --lobe-popover-layout-duration: 0s;\n    }\n  `,\n\n  root: css`\n    user-select: none;\n    position: relative;\n    filter: drop-shadow(0 2px 8px rgb(0 0 0 / 12%));\n  `,\n\n  viewport: css`\n    --lobe-popover-viewport-inline-padding: 12px;\n    --lobe-popover-content-shift: 8px;\n    --lobe-popover-content-blur: 4px;\n\n    position: relative;\n    overflow: clip;\n    padding-block: 12px;\n    padding-inline: var(--lobe-popover-viewport-inline-padding);\n\n    /* Old and new content overlap in one clip box while the box morphs; blurring both layers\n       during the crossfade turns the misaligned overlap into a soft smear instead of garbled text. */\n    [data-previous],\n    [data-current] {\n      transform: translateX(0);\n      opacity: 1;\n      filter: blur(0);\n      transition:\n        transform var(--lobe-popover-layout-duration) var(--lobe-popover-layout-ease),\n        opacity calc(var(--lobe-popover-layout-duration) / 2) var(--lobe-popover-animation-ease-out),\n        filter calc(var(--lobe-popover-layout-duration) / 2) var(--lobe-popover-animation-ease-out);\n    }\n\n    [data-current] {\n      transition-delay:\n        0s, calc(var(--lobe-popover-layout-duration) / 6),\n        calc(var(--lobe-popover-layout-duration) / 6);\n    }\n\n    [data-previous][data-ending-style],\n    [data-current][data-starting-style] {\n      filter: blur(var(--lobe-popover-content-blur));\n    }\n\n    /* Freeze both layers at their own final width so neither re-wraps while the box morphs;\n       the viewport clip reveals the new content as the box grows over it. */\n    [data-previous] {\n      position: absolute;\n      inset-block-start: 12px;\n      inset-inline-start: var(--lobe-popover-viewport-inline-padding);\n      width: calc(var(--popup-width) - var(--lobe-popover-viewport-inline-padding) * 2 - 2px);\n    }\n\n    &[data-transitioning] [data-current] {\n      width: calc(var(--positioner-width) - var(--lobe-popover-viewport-inline-padding) * 2 - 2px);\n    }\n\n    &[data-repop] [data-previous] {\n      display: none;\n    }\n\n    &[data-repop] [data-current] {\n      transition: none;\n    }\n\n    &[data-activation-direction~='right'] [data-previous][data-ending-style] {\n      transform: translateX(calc(var(--lobe-popover-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='right'] [data-current][data-starting-style] {\n      transform: translateX(var(--lobe-popover-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='left'] [data-previous][data-ending-style] {\n      transform: translateX(var(--lobe-popover-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='left'] [data-current][data-starting-style] {\n      transform: translateX(calc(var(--lobe-popover-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='down'] [data-previous][data-ending-style] {\n      transform: translateY(calc(var(--lobe-popover-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='down'] [data-current][data-starting-style] {\n      transform: translateY(var(--lobe-popover-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='up'] [data-previous][data-ending-style] {\n      transform: translateY(var(--lobe-popover-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='up'] [data-current][data-starting-style] {\n      transform: translateY(calc(var(--lobe-popover-content-shift) * -1));\n      opacity: 0;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;cAyBE,OAAO,gBAAgB;;;;;gBAKrB,OAAO,YAAY;;;;;;;;;;;;;;;;;;;;;;;CAwBjC,OAAO,GAAG;;;;;;;qBAOS,OAAO,aAAa;;aAE5B,OAAO,UAAU;;kBAEZ,OAAO,gBAAgB;;kBAEvB,OAAO,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0C1C,YAAY,GAAG;;;;;;yCAMwB,OAAO,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6F5D,MAAM,GAAG;;;;;CAMT,UAAU,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+Ff,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Popover/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  arrow: css`\n    --lobe-popover-arrow-offset-block: 5px;\n    --lobe-popover-arrow-offset-inline: 8px;\n\n    pointer-events: none;\n\n    position: absolute;\n    transform-origin: center;\n\n    display: flex;\n\n    width: 12px;\n    height: 6px;\n\n    transition:\n      inset-inline-start var(--lobe-popover-layout-duration) var(--lobe-popover-layout-ease),\n      inset-block-start var(--lobe-popover-layout-duration) var(--lobe-popover-layout-ease);\n\n    & > svg {\n      display: block;\n      width: 100%;\n      height: 100%;\n    }\n\n    & [data-role='fill'] {\n      fill: ${cssVar.colorBgElevated};\n    }\n\n    & [data-role='stroke'] {\n      fill: none;\n      stroke: ${cssVar.colorBorder};\n      stroke-width: 1px;\n    }\n\n    &[data-side='top'] {\n      inset-block-end: calc(var(--lobe-popover-arrow-offset-block) * -1);\n      transform: rotate(180deg);\n    }\n\n    &[data-side='left'] {\n      inset-inline-end: calc(var(--lobe-popover-arrow-offset-inline) * -1);\n      transform: rotate(90deg);\n    }\n\n    &[data-side='right'] {\n      inset-inline-start: calc(var(--lobe-popover-arrow-offset-inline) * -1);\n      transform: rotate(-90deg);\n    }\n\n    &[data-side='bottom'] {\n      inset-block-start: calc(var(--lobe-popover-arrow-offset-block) * -1);\n    }\n  `,\n\n  popup: css`\n    position: relative;\n    transform-origin: var(--transform-origin);\n\n    box-sizing: border-box;\n    min-width: 120px;\n    max-width: var(--available-width);\n    border-radius: ${cssVar.borderRadius};\n\n    color: ${cssVar.colorText};\n\n    background: ${cssVar.colorBgElevated};\n    outline: none;\n    box-shadow: ${cssVar.boxShadowSecondary}, var(--lobe-ring);\n\n    transition-timing-function: var(--lobe-popover-animation-ease-out);\n    transition-duration: var(--lobe-popover-animation-duration);\n    transition-property: opacity, transform;\n\n    /* Base UI writes the old size into --popup-width/height on a trigger switch and the new size\n       one frame later; the box only morphs if width/height actually read them. */\n    &[data-layout-animation] {\n      width: var(--popup-width, auto);\n      height: var(--popup-height, auto);\n\n      transition-timing-function:\n        var(--lobe-popover-animation-ease-out), var(--lobe-popover-animation-ease-out),\n        var(--lobe-popover-layout-ease), var(--lobe-popover-layout-ease);\n      transition-duration:\n        var(--lobe-popover-animation-duration), var(--lobe-popover-animation-duration),\n        var(--lobe-popover-layout-duration), var(--lobe-popover-layout-duration);\n      transition-property: opacity, transform, width, height;\n    }\n\n    &[data-repop] {\n      transition: none;\n    }\n\n    &[data-starting-style],\n    &[data-ending-style] {\n      transform: translate3d(var(--lobe-popover-translate-x), var(--lobe-popover-translate-y), 0)\n        scale(var(--lobe-popover-animation-scale));\n      opacity: 0;\n    }\n\n    &[data-ending-style] {\n      transition-timing-function: var(--lobe-popover-animation-ease-in);\n      transition-duration: var(--lobe-popover-animation-duration-exit);\n    }\n\n    &[data-instant] {\n      transition: none;\n    }\n  `,\n\n  positioner: css`\n    --lobe-popover-animation-duration: 150ms;\n    --lobe-popover-animation-translate: 6px;\n    --lobe-popover-animation-scale: 0.96;\n    --lobe-popover-animation-ease-in: ease-in;\n    --lobe-popover-animation-duration-exit: 75ms;\n    --lobe-popover-animation-ease-out: ${cssVar.motionEaseOut};\n    --lobe-popover-translate-x: 0;\n    --lobe-popover-translate-y: calc(var(--lobe-popover-animation-translate) * -1);\n    --lobe-popover-layout-duration: 380ms;\n    --lobe-popover-layout-ease: linear(\n      0,\n      0.041,\n      0.14,\n      0.268,\n      0.407,\n      0.541,\n      0.661,\n      0.765,\n      0.849,\n      0.915,\n      0.964,\n      0.998,\n      1.02,\n      1.032,\n      1.038,\n      1.039,\n      1.036,\n      1.032,\n      1.027,\n      1.022,\n      1.016,\n      1.012,\n      1.008,\n      1.005,\n      1.003\n    );\n\n    z-index: 1100;\n\n    width: min(var(--positioner-width), var(--available-width));\n    height: var(--positioner-height);\n\n    transition-timing-function: var(--lobe-popover-animation-ease-out);\n    transition-duration: var(--lobe-popover-animation-duration);\n    transition-property: none;\n\n    &[data-layout-animation] {\n      transition-timing-function: var(--lobe-popover-layout-ease);\n      transition-duration: var(--lobe-popover-layout-duration);\n      transition-property:\n        inset-block-start, inset-inline-start, inset-inline-end, inset-block-end, transform;\n    }\n\n    &[data-instant],\n    &[data-repop] {\n      transition: none;\n    }\n\n    /* Fallback: never show a popover when the anchor is hidden or the positioner falls back to (0,0). */\n    &[data-anchor-hidden],\n    &[data-zero-origin='true'] {\n      pointer-events: none;\n      visibility: hidden;\n    }\n\n    &[data-placement='top'],\n    &[data-placement='topLeft'],\n    &[data-placement='topRight'] {\n      --lobe-popover-translate-x: 0;\n      --lobe-popover-translate-y: var(--lobe-popover-animation-translate);\n    }\n\n    &[data-placement='bottom'],\n    &[data-placement='bottomLeft'],\n    &[data-placement='bottomRight'] {\n      --lobe-popover-translate-x: 0;\n      --lobe-popover-translate-y: calc(var(--lobe-popover-animation-translate) * -1);\n    }\n\n    &[data-placement='left'],\n    &[data-placement='leftTop'],\n    &[data-placement='leftBottom'] {\n      --lobe-popover-translate-x: var(--lobe-popover-animation-translate);\n      --lobe-popover-translate-y: 0;\n    }\n\n    &[data-placement='right'],\n    &[data-placement='rightTop'],\n    &[data-placement='rightBottom'] {\n      --lobe-popover-translate-x: calc(var(--lobe-popover-animation-translate) * -1);\n      --lobe-popover-translate-y: 0;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      --lobe-popover-layout-duration: 0s;\n    }\n  `,\n\n  root: css`\n    user-select: none;\n    position: relative;\n    filter: drop-shadow(0 2px 8px rgb(0 0 0 / 12%));\n  `,\n\n  viewport: css`\n    --lobe-popover-viewport-inline-padding: 12px;\n    --lobe-popover-content-shift: 8px;\n    --lobe-popover-content-blur: 4px;\n\n    position: relative;\n    overflow: clip;\n    padding-block: 12px;\n    padding-inline: var(--lobe-popover-viewport-inline-padding);\n\n    /* Old and new content overlap in one clip box while the box morphs; blurring both layers\n       during the crossfade turns the misaligned overlap into a soft smear instead of garbled text. */\n    [data-previous],\n    [data-current] {\n      transform: translateX(0);\n      opacity: 1;\n      filter: blur(0);\n      transition:\n        transform var(--lobe-popover-layout-duration) var(--lobe-popover-layout-ease),\n        opacity calc(var(--lobe-popover-layout-duration) / 2) var(--lobe-popover-animation-ease-out),\n        filter calc(var(--lobe-popover-layout-duration) / 2) var(--lobe-popover-animation-ease-out);\n    }\n\n    [data-current] {\n      transition-delay:\n        0s, calc(var(--lobe-popover-layout-duration) / 6),\n        calc(var(--lobe-popover-layout-duration) / 6);\n    }\n\n    [data-previous][data-ending-style],\n    [data-current][data-starting-style] {\n      filter: blur(var(--lobe-popover-content-blur));\n    }\n\n    /* Freeze both layers at their own final width so neither re-wraps while the box morphs;\n       the viewport clip reveals the new content as the box grows over it. */\n    [data-previous] {\n      position: absolute;\n      inset-block-start: 12px;\n      inset-inline-start: var(--lobe-popover-viewport-inline-padding);\n      width: calc(var(--popup-width) - var(--lobe-popover-viewport-inline-padding) * 2);\n    }\n\n    &[data-transitioning] [data-current] {\n      width: calc(var(--positioner-width) - var(--lobe-popover-viewport-inline-padding) * 2);\n    }\n\n    &[data-repop] [data-previous] {\n      display: none;\n    }\n\n    &[data-repop] [data-current] {\n      transition: none;\n    }\n\n    &[data-activation-direction~='right'] [data-previous][data-ending-style] {\n      transform: translateX(calc(var(--lobe-popover-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='right'] [data-current][data-starting-style] {\n      transform: translateX(var(--lobe-popover-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='left'] [data-previous][data-ending-style] {\n      transform: translateX(var(--lobe-popover-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='left'] [data-current][data-starting-style] {\n      transform: translateX(calc(var(--lobe-popover-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='down'] [data-previous][data-ending-style] {\n      transform: translateY(calc(var(--lobe-popover-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='down'] [data-current][data-starting-style] {\n      transform: translateY(var(--lobe-popover-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='up'] [data-previous][data-ending-style] {\n      transform: translateY(var(--lobe-popover-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='up'] [data-current][data-starting-style] {\n      transform: translateY(calc(var(--lobe-popover-content-shift) * -1));\n      opacity: 0;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;cAyBE,OAAO,gBAAgB;;;;;gBAKrB,OAAO,YAAY;;;;;;;;;;;;;;;;;;;;;;;CAwBjC,OAAO,GAAG;;;;;;;qBAOS,OAAO,aAAa;;aAE5B,OAAO,UAAU;;kBAEZ,OAAO,gBAAgB;;kBAEvB,OAAO,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0C1C,YAAY,GAAG;;;;;;yCAMwB,OAAO,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6F5D,MAAM,GAAG;;;;;CAMT,UAAU,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+Ff,EAAE"}

package/es/base-ui/Tooltip/style.mjs

@@ -305,11 +305,11 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
       position: absolute;
       inset-block-start: 4px;
       inset-inline-start: var(--lobe-tooltip-viewport-inline-padding);
-      width: calc(var(--popup-width) - var(--lobe-tooltip-viewport-inline-padding) * 2 - 2px);
+      width: calc(var(--popup-width) - var(--lobe-tooltip-viewport-inline-padding) * 2);
     }
 
     &[data-transitioning] [data-current] {
-      width: calc(var(--positioner-width) - var(--lobe-tooltip-viewport-inline-padding) * 2 - 2px);
+      width: calc(var(--positioner-width) - var(--lobe-tooltip-viewport-inline-padding) * 2);
     }
 
     &[data-repop] [data-previous] {

package/es/base-ui/Tooltip/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Tooltip/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  arrow: css`\n    --lobe-tooltip-arrow-offset-block: 4px;\n    --lobe-tooltip-arrow-offset-inline: 6px;\n\n    pointer-events: none;\n\n    position: absolute;\n    transform-origin: center;\n\n    display: flex;\n\n    width: 8px;\n    height: 4px;\n\n    transition:\n      inset-inline-start var(--lobe-tooltip-layout-duration) var(--lobe-tooltip-layout-ease),\n      inset-block-start var(--lobe-tooltip-layout-duration) var(--lobe-tooltip-layout-ease);\n\n    & > svg {\n      display: block;\n      width: 100%;\n      height: 100%;\n      fill: ${cssVar.colorBgElevated};\n    }\n\n    & [data-role='stroke'] {\n      stroke: ${cssVar.colorBorderSecondary};\n    }\n\n    &[data-side='top'] {\n      inset-block-end: calc(var(--lobe-tooltip-arrow-offset-block) * -1);\n      transform: rotate(180deg);\n    }\n\n    &[data-side='left'] {\n      inset-inline-end: calc(var(--lobe-tooltip-arrow-offset-inline) * -1);\n      transform: rotate(90deg);\n    }\n\n    &[data-side='right'] {\n      inset-inline-start: calc(var(--lobe-tooltip-arrow-offset-inline) * -1);\n      transform: rotate(-90deg);\n    }\n\n    &[data-side='bottom'] {\n      inset-block-start: calc(var(--lobe-tooltip-arrow-offset-block) * -1);\n    }\n  `,\n\n  popup: css`\n    /* Keep the popup on its own compositor layer for its whole lifetime: when the opacity\n       transition ends the browser otherwise drops the layer and re-rasterizes with pixel\n       snapping — a visible one-frame shift when the measured width is fractional\n       (single-line tooltips). */\n    will-change: transform, opacity;\n    user-select: none;\n\n    position: relative;\n    transform-origin: var(--transform-origin);\n\n    box-sizing: border-box;\n\n    /* The 320px cap lives on the viewport, not here: Base UI measures content with\n       --available-width set to max-content, and min(320px, max-content) is invalid, which\n       recorded unclamped sizes. A percentage cap is out too — it tracks the positioner, which\n       snaps to the new size and would freeze the shrink half of the morph. */\n    max-width: var(--available-width);\n    border-radius: ${cssVar.borderRadiusSM};\n\n    font-size: ${cssVar.fontSizeSM};\n    line-height: 1.2;\n    color: ${cssVar.colorTextLabel};\n\n    background: ${cssVar.colorBgElevated};\n    box-shadow: ${cssVar.boxShadowTertiary}, var(--lobe-ring);\n\n    /* Opacity gets its own monotonic curve: running it on the overshooting spring makes the\n       fade look finished at ~0.96, pause, then visibly step to 1 at the clamp point — reads\n       as a dropped frame. The spring stays on transform only. */\n    transition-timing-function:\n      var(--lobe-tooltip-fade-ease), var(--lobe-tooltip-animation-ease-out);\n    transition-duration: var(--lobe-tooltip-fade-duration), var(--lobe-tooltip-animation-duration);\n    transition-property: opacity, transform;\n\n    /* Base UI writes the old size into --popup-width/height on a trigger switch and the new size\n       one frame later; the box only morphs if width/height actually read them. */\n    &[data-layout-animation] {\n      width: var(--popup-width, auto);\n      height: var(--popup-height, auto);\n\n      transition-timing-function:\n        var(--lobe-tooltip-fade-ease), var(--lobe-tooltip-animation-ease-out),\n        var(--lobe-tooltip-layout-ease), var(--lobe-tooltip-layout-ease);\n      transition-duration:\n        var(--lobe-tooltip-fade-duration), var(--lobe-tooltip-animation-duration),\n        var(--lobe-tooltip-layout-duration), var(--lobe-tooltip-layout-duration);\n      transition-property: opacity, transform, width, height;\n    }\n\n    &[data-repop] {\n      transition: none;\n    }\n\n    &[data-starting-style],\n    &[data-ending-style] {\n      transform: translate3d(var(--lobe-tooltip-translate-x), var(--lobe-tooltip-translate-y), 0)\n        scale(var(--lobe-tooltip-animation-scale));\n      opacity: 0;\n    }\n\n    &[data-ending-style] {\n      transition-timing-function: var(--lobe-tooltip-animation-ease-in);\n      transition-duration: var(--lobe-tooltip-animation-duration-exit);\n    }\n\n    &[data-instant] {\n      transition: none;\n    }\n  `,\n\n  positioner: css`\n    /* Springs baked as linear(): stiffness 700 / damping 38 (enter) and 380 / 28 (glide),\n       both zeta ~0.72 with ~4% overshoot. Durations are the springs' settle times —\n       change them together with the curves, not independently. */\n    --lobe-tooltip-animation-duration: 280ms;\n    --lobe-tooltip-fade-duration: 160ms;\n    --lobe-tooltip-fade-ease: cubic-bezier(0.33, 1, 0.68, 1);\n    --lobe-tooltip-animation-duration-exit: 100ms;\n    --lobe-tooltip-animation-translate: 3px;\n    --lobe-tooltip-animation-scale: 0.97;\n    --lobe-tooltip-animation-ease-in: cubic-bezier(0.4, 0, 1, 1);\n    --lobe-tooltip-animation-ease-out: linear(\n      0,\n      0.041,\n      0.14,\n      0.268,\n      0.407,\n      0.541,\n      0.662,\n      0.765,\n      0.849,\n      0.915,\n      0.964,\n      0.998,\n      1.02,\n      1.032,\n      1.038,\n      1.039,\n      1.036,\n      1.032,\n      1.027,\n      1.022,\n      1.016,\n      1.012,\n      1.008,\n      1.005,\n      1.003\n    );\n    --lobe-tooltip-layout-duration: 380ms;\n    --lobe-tooltip-layout-ease: linear(\n      0,\n      0.041,\n      0.14,\n      0.268,\n      0.407,\n      0.541,\n      0.661,\n      0.765,\n      0.849,\n      0.915,\n      0.964,\n      0.998,\n      1.02,\n      1.032,\n      1.038,\n      1.039,\n      1.036,\n      1.032,\n      1.027,\n      1.022,\n      1.016,\n      1.012,\n      1.008,\n      1.005,\n      1.003\n    );\n    --lobe-tooltip-translate-x: 0;\n    --lobe-tooltip-translate-y: calc(var(--lobe-tooltip-animation-translate) * -1);\n\n    will-change: transform, opacity;\n\n    z-index: 114514;\n\n    width: min(var(--positioner-width), 320px, var(--available-width));\n    height: var(--positioner-height);\n\n    transition-timing-function: var(--lobe-tooltip-animation-ease-out);\n    transition-duration: var(--lobe-tooltip-animation-duration);\n    transition-property: none;\n\n    &[data-layout-animation] {\n      transition-timing-function: var(--lobe-tooltip-layout-ease);\n      transition-duration: var(--lobe-tooltip-layout-duration);\n      transition-property:\n        inset-block-start, inset-inline-start, inset-inline-end, inset-block-end, transform;\n    }\n\n    &[data-instant],\n    &[data-repop] {\n      transition: none;\n    }\n\n    /* Fallback: never show a tooltip when the anchor is hidden or the positioner falls back to (0,0). */\n    &[data-anchor-hidden],\n    &[data-zero-origin='true'] {\n      pointer-events: none;\n      visibility: hidden;\n    }\n\n    &[data-placement='top'],\n    &[data-placement='topLeft'],\n    &[data-placement='topRight'] {\n      --lobe-tooltip-translate-x: 0;\n      --lobe-tooltip-translate-y: var(--lobe-tooltip-animation-translate);\n    }\n\n    &[data-placement='bottom'],\n    &[data-placement='bottomLeft'],\n    &[data-placement='bottomRight'] {\n      --lobe-tooltip-translate-x: 0;\n      --lobe-tooltip-translate-y: calc(var(--lobe-tooltip-animation-translate) * -1);\n    }\n\n    &[data-placement='left'],\n    &[data-placement='leftTop'],\n    &[data-placement='leftBottom'] {\n      --lobe-tooltip-translate-x: var(--lobe-tooltip-animation-translate);\n      --lobe-tooltip-translate-y: 0;\n    }\n\n    &[data-placement='right'],\n    &[data-placement='rightTop'],\n    &[data-placement='rightBottom'] {\n      --lobe-tooltip-translate-x: calc(var(--lobe-tooltip-animation-translate) * -1);\n      --lobe-tooltip-translate-y: 0;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      --lobe-tooltip-animation-duration: 0s;\n      --lobe-tooltip-fade-duration: 0s;\n      --lobe-tooltip-animation-duration-exit: 0s;\n      --lobe-tooltip-layout-duration: 0s;\n    }\n  `,\n\n  viewport: css`\n    --lobe-tooltip-viewport-inline-padding: 8px;\n    --lobe-tooltip-content-shift: 8px;\n    --lobe-tooltip-content-blur: 4px;\n\n    position: relative;\n\n    overflow: clip;\n\n    max-width: calc(320px - 2px);\n    padding-block: 4px;\n    padding-inline: var(--lobe-tooltip-viewport-inline-padding);\n\n    overflow-wrap: break-word;\n    white-space: normal;\n\n    /* Old and new text overlap in one clip box while the box morphs; blurring both layers during\n       the crossfade turns the misaligned overlap into a soft smear instead of garbled text. */\n    [data-previous],\n    [data-current] {\n      transform: translateX(0);\n\n      display: flex;\n      gap: 6px;\n      align-items: center;\n\n      opacity: 1;\n      filter: blur(0);\n\n      transition:\n        transform var(--lobe-tooltip-layout-duration) var(--lobe-tooltip-layout-ease),\n        opacity calc(var(--lobe-tooltip-layout-duration) / 2) var(--lobe-tooltip-fade-ease),\n        filter calc(var(--lobe-tooltip-layout-duration) / 2) var(--lobe-tooltip-fade-ease);\n    }\n\n    [data-current] {\n      transition-delay:\n        0s, calc(var(--lobe-tooltip-layout-duration) / 6),\n        calc(var(--lobe-tooltip-layout-duration) / 6);\n    }\n\n    [data-previous][data-ending-style],\n    [data-current][data-starting-style] {\n      filter: blur(var(--lobe-tooltip-content-blur));\n    }\n\n    /* Freeze both layers at their own final width so neither re-wraps while the box morphs;\n       the viewport clip reveals the new text as the box grows over it. */\n    [data-previous] {\n      position: absolute;\n      inset-block-start: 4px;\n      inset-inline-start: var(--lobe-tooltip-viewport-inline-padding);\n      width: calc(var(--popup-width) - var(--lobe-tooltip-viewport-inline-padding) * 2 - 2px);\n    }\n\n    &[data-transitioning] [data-current] {\n      width: calc(var(--positioner-width) - var(--lobe-tooltip-viewport-inline-padding) * 2 - 2px);\n    }\n\n    &[data-repop] [data-previous] {\n      display: none;\n    }\n\n    &[data-repop] [data-current] {\n      transition: none;\n    }\n\n    &[data-activation-direction~='right'] [data-previous][data-ending-style] {\n      transform: translateX(calc(var(--lobe-tooltip-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='right'] [data-current][data-starting-style] {\n      transform: translateX(var(--lobe-tooltip-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='left'] [data-previous][data-ending-style] {\n      transform: translateX(var(--lobe-tooltip-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='left'] [data-current][data-starting-style] {\n      transform: translateX(calc(var(--lobe-tooltip-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='down'] [data-previous][data-ending-style] {\n      transform: translateY(calc(var(--lobe-tooltip-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='down'] [data-current][data-starting-style] {\n      transform: translateY(var(--lobe-tooltip-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='up'] [data-previous][data-ending-style] {\n      transform: translateY(var(--lobe-tooltip-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='up'] [data-current][data-starting-style] {\n      transform: translateY(calc(var(--lobe-tooltip-content-shift) * -1));\n      opacity: 0;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;;;;;;;;;;;;;;;;;cAsBE,OAAO,gBAAgB;;;;gBAIrB,OAAO,qBAAqB;;;;;;;;;;;;;;;;;;;;;;CAuB1C,OAAO,GAAG;;;;;;;;;;;;;;;;;;qBAkBS,OAAO,eAAe;;iBAE1B,OAAO,WAAW;;aAEtB,OAAO,eAAe;;kBAEjB,OAAO,gBAAgB;kBACvB,OAAO,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8CzC,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuIf,UAAU,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2Gf,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Tooltip/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  arrow: css`\n    --lobe-tooltip-arrow-offset-block: 4px;\n    --lobe-tooltip-arrow-offset-inline: 6px;\n\n    pointer-events: none;\n\n    position: absolute;\n    transform-origin: center;\n\n    display: flex;\n\n    width: 8px;\n    height: 4px;\n\n    transition:\n      inset-inline-start var(--lobe-tooltip-layout-duration) var(--lobe-tooltip-layout-ease),\n      inset-block-start var(--lobe-tooltip-layout-duration) var(--lobe-tooltip-layout-ease);\n\n    & > svg {\n      display: block;\n      width: 100%;\n      height: 100%;\n      fill: ${cssVar.colorBgElevated};\n    }\n\n    & [data-role='stroke'] {\n      stroke: ${cssVar.colorBorderSecondary};\n    }\n\n    &[data-side='top'] {\n      inset-block-end: calc(var(--lobe-tooltip-arrow-offset-block) * -1);\n      transform: rotate(180deg);\n    }\n\n    &[data-side='left'] {\n      inset-inline-end: calc(var(--lobe-tooltip-arrow-offset-inline) * -1);\n      transform: rotate(90deg);\n    }\n\n    &[data-side='right'] {\n      inset-inline-start: calc(var(--lobe-tooltip-arrow-offset-inline) * -1);\n      transform: rotate(-90deg);\n    }\n\n    &[data-side='bottom'] {\n      inset-block-start: calc(var(--lobe-tooltip-arrow-offset-block) * -1);\n    }\n  `,\n\n  popup: css`\n    /* Keep the popup on its own compositor layer for its whole lifetime: when the opacity\n       transition ends the browser otherwise drops the layer and re-rasterizes with pixel\n       snapping — a visible one-frame shift when the measured width is fractional\n       (single-line tooltips). */\n    will-change: transform, opacity;\n    user-select: none;\n\n    position: relative;\n    transform-origin: var(--transform-origin);\n\n    box-sizing: border-box;\n\n    /* The 320px cap lives on the viewport, not here: Base UI measures content with\n       --available-width set to max-content, and min(320px, max-content) is invalid, which\n       recorded unclamped sizes. A percentage cap is out too — it tracks the positioner, which\n       snaps to the new size and would freeze the shrink half of the morph. */\n    max-width: var(--available-width);\n    border-radius: ${cssVar.borderRadiusSM};\n\n    font-size: ${cssVar.fontSizeSM};\n    line-height: 1.2;\n    color: ${cssVar.colorTextLabel};\n\n    background: ${cssVar.colorBgElevated};\n    box-shadow: ${cssVar.boxShadowTertiary}, var(--lobe-ring);\n\n    /* Opacity gets its own monotonic curve: running it on the overshooting spring makes the\n       fade look finished at ~0.96, pause, then visibly step to 1 at the clamp point — reads\n       as a dropped frame. The spring stays on transform only. */\n    transition-timing-function:\n      var(--lobe-tooltip-fade-ease), var(--lobe-tooltip-animation-ease-out);\n    transition-duration: var(--lobe-tooltip-fade-duration), var(--lobe-tooltip-animation-duration);\n    transition-property: opacity, transform;\n\n    /* Base UI writes the old size into --popup-width/height on a trigger switch and the new size\n       one frame later; the box only morphs if width/height actually read them. */\n    &[data-layout-animation] {\n      width: var(--popup-width, auto);\n      height: var(--popup-height, auto);\n\n      transition-timing-function:\n        var(--lobe-tooltip-fade-ease), var(--lobe-tooltip-animation-ease-out),\n        var(--lobe-tooltip-layout-ease), var(--lobe-tooltip-layout-ease);\n      transition-duration:\n        var(--lobe-tooltip-fade-duration), var(--lobe-tooltip-animation-duration),\n        var(--lobe-tooltip-layout-duration), var(--lobe-tooltip-layout-duration);\n      transition-property: opacity, transform, width, height;\n    }\n\n    &[data-repop] {\n      transition: none;\n    }\n\n    &[data-starting-style],\n    &[data-ending-style] {\n      transform: translate3d(var(--lobe-tooltip-translate-x), var(--lobe-tooltip-translate-y), 0)\n        scale(var(--lobe-tooltip-animation-scale));\n      opacity: 0;\n    }\n\n    &[data-ending-style] {\n      transition-timing-function: var(--lobe-tooltip-animation-ease-in);\n      transition-duration: var(--lobe-tooltip-animation-duration-exit);\n    }\n\n    &[data-instant] {\n      transition: none;\n    }\n  `,\n\n  positioner: css`\n    /* Springs baked as linear(): stiffness 700 / damping 38 (enter) and 380 / 28 (glide),\n       both zeta ~0.72 with ~4% overshoot. Durations are the springs' settle times —\n       change them together with the curves, not independently. */\n    --lobe-tooltip-animation-duration: 280ms;\n    --lobe-tooltip-fade-duration: 160ms;\n    --lobe-tooltip-fade-ease: cubic-bezier(0.33, 1, 0.68, 1);\n    --lobe-tooltip-animation-duration-exit: 100ms;\n    --lobe-tooltip-animation-translate: 3px;\n    --lobe-tooltip-animation-scale: 0.97;\n    --lobe-tooltip-animation-ease-in: cubic-bezier(0.4, 0, 1, 1);\n    --lobe-tooltip-animation-ease-out: linear(\n      0,\n      0.041,\n      0.14,\n      0.268,\n      0.407,\n      0.541,\n      0.662,\n      0.765,\n      0.849,\n      0.915,\n      0.964,\n      0.998,\n      1.02,\n      1.032,\n      1.038,\n      1.039,\n      1.036,\n      1.032,\n      1.027,\n      1.022,\n      1.016,\n      1.012,\n      1.008,\n      1.005,\n      1.003\n    );\n    --lobe-tooltip-layout-duration: 380ms;\n    --lobe-tooltip-layout-ease: linear(\n      0,\n      0.041,\n      0.14,\n      0.268,\n      0.407,\n      0.541,\n      0.661,\n      0.765,\n      0.849,\n      0.915,\n      0.964,\n      0.998,\n      1.02,\n      1.032,\n      1.038,\n      1.039,\n      1.036,\n      1.032,\n      1.027,\n      1.022,\n      1.016,\n      1.012,\n      1.008,\n      1.005,\n      1.003\n    );\n    --lobe-tooltip-translate-x: 0;\n    --lobe-tooltip-translate-y: calc(var(--lobe-tooltip-animation-translate) * -1);\n\n    will-change: transform, opacity;\n\n    z-index: 114514;\n\n    width: min(var(--positioner-width), 320px, var(--available-width));\n    height: var(--positioner-height);\n\n    transition-timing-function: var(--lobe-tooltip-animation-ease-out);\n    transition-duration: var(--lobe-tooltip-animation-duration);\n    transition-property: none;\n\n    &[data-layout-animation] {\n      transition-timing-function: var(--lobe-tooltip-layout-ease);\n      transition-duration: var(--lobe-tooltip-layout-duration);\n      transition-property:\n        inset-block-start, inset-inline-start, inset-inline-end, inset-block-end, transform;\n    }\n\n    &[data-instant],\n    &[data-repop] {\n      transition: none;\n    }\n\n    /* Fallback: never show a tooltip when the anchor is hidden or the positioner falls back to (0,0). */\n    &[data-anchor-hidden],\n    &[data-zero-origin='true'] {\n      pointer-events: none;\n      visibility: hidden;\n    }\n\n    &[data-placement='top'],\n    &[data-placement='topLeft'],\n    &[data-placement='topRight'] {\n      --lobe-tooltip-translate-x: 0;\n      --lobe-tooltip-translate-y: var(--lobe-tooltip-animation-translate);\n    }\n\n    &[data-placement='bottom'],\n    &[data-placement='bottomLeft'],\n    &[data-placement='bottomRight'] {\n      --lobe-tooltip-translate-x: 0;\n      --lobe-tooltip-translate-y: calc(var(--lobe-tooltip-animation-translate) * -1);\n    }\n\n    &[data-placement='left'],\n    &[data-placement='leftTop'],\n    &[data-placement='leftBottom'] {\n      --lobe-tooltip-translate-x: var(--lobe-tooltip-animation-translate);\n      --lobe-tooltip-translate-y: 0;\n    }\n\n    &[data-placement='right'],\n    &[data-placement='rightTop'],\n    &[data-placement='rightBottom'] {\n      --lobe-tooltip-translate-x: calc(var(--lobe-tooltip-animation-translate) * -1);\n      --lobe-tooltip-translate-y: 0;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      --lobe-tooltip-animation-duration: 0s;\n      --lobe-tooltip-fade-duration: 0s;\n      --lobe-tooltip-animation-duration-exit: 0s;\n      --lobe-tooltip-layout-duration: 0s;\n    }\n  `,\n\n  viewport: css`\n    --lobe-tooltip-viewport-inline-padding: 8px;\n    --lobe-tooltip-content-shift: 8px;\n    --lobe-tooltip-content-blur: 4px;\n\n    position: relative;\n\n    overflow: clip;\n\n    max-width: calc(320px - 2px);\n    padding-block: 4px;\n    padding-inline: var(--lobe-tooltip-viewport-inline-padding);\n\n    overflow-wrap: break-word;\n    white-space: normal;\n\n    /* Old and new text overlap in one clip box while the box morphs; blurring both layers during\n       the crossfade turns the misaligned overlap into a soft smear instead of garbled text. */\n    [data-previous],\n    [data-current] {\n      transform: translateX(0);\n\n      display: flex;\n      gap: 6px;\n      align-items: center;\n\n      opacity: 1;\n      filter: blur(0);\n\n      transition:\n        transform var(--lobe-tooltip-layout-duration) var(--lobe-tooltip-layout-ease),\n        opacity calc(var(--lobe-tooltip-layout-duration) / 2) var(--lobe-tooltip-fade-ease),\n        filter calc(var(--lobe-tooltip-layout-duration) / 2) var(--lobe-tooltip-fade-ease);\n    }\n\n    [data-current] {\n      transition-delay:\n        0s, calc(var(--lobe-tooltip-layout-duration) / 6),\n        calc(var(--lobe-tooltip-layout-duration) / 6);\n    }\n\n    [data-previous][data-ending-style],\n    [data-current][data-starting-style] {\n      filter: blur(var(--lobe-tooltip-content-blur));\n    }\n\n    /* Freeze both layers at their own final width so neither re-wraps while the box morphs;\n       the viewport clip reveals the new text as the box grows over it. */\n    [data-previous] {\n      position: absolute;\n      inset-block-start: 4px;\n      inset-inline-start: var(--lobe-tooltip-viewport-inline-padding);\n      width: calc(var(--popup-width) - var(--lobe-tooltip-viewport-inline-padding) * 2);\n    }\n\n    &[data-transitioning] [data-current] {\n      width: calc(var(--positioner-width) - var(--lobe-tooltip-viewport-inline-padding) * 2);\n    }\n\n    &[data-repop] [data-previous] {\n      display: none;\n    }\n\n    &[data-repop] [data-current] {\n      transition: none;\n    }\n\n    &[data-activation-direction~='right'] [data-previous][data-ending-style] {\n      transform: translateX(calc(var(--lobe-tooltip-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='right'] [data-current][data-starting-style] {\n      transform: translateX(var(--lobe-tooltip-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='left'] [data-previous][data-ending-style] {\n      transform: translateX(var(--lobe-tooltip-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='left'] [data-current][data-starting-style] {\n      transform: translateX(calc(var(--lobe-tooltip-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='down'] [data-previous][data-ending-style] {\n      transform: translateY(calc(var(--lobe-tooltip-content-shift) * -1));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='down'] [data-current][data-starting-style] {\n      transform: translateY(var(--lobe-tooltip-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='up'] [data-previous][data-ending-style] {\n      transform: translateY(var(--lobe-tooltip-content-shift));\n      opacity: 0;\n    }\n\n    &[data-activation-direction~='up'] [data-current][data-starting-style] {\n      transform: translateY(calc(var(--lobe-tooltip-content-shift) * -1));\n      opacity: 0;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;;;;;;;;;;;;;;;;;cAsBE,OAAO,gBAAgB;;;;gBAIrB,OAAO,qBAAqB;;;;;;;;;;;;;;;;;;;;;;CAuB1C,OAAO,GAAG;;;;;;;;;;;;;;;;;;qBAkBS,OAAO,eAAe;;iBAE1B,OAAO,WAAW;;aAEtB,OAAO,eAAe;;kBAEjB,OAAO,gBAAgB;kBACvB,OAAO,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8CzC,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuIf,UAAU,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2Gf,EAAE"}

package/es/brand/LogoMono/index.mjs

@@ -1,2 +1 @@
-import { LobeHub as icons_default } from "@lobehub/icons";
-export { icons_default as default };
+export { LobeHub as default } from "@lobehub/icons";

package/es/storybook/index.mjs

@@ -1,2 +1 @@
-import { StoryBook, useControls, useCreateStore } from "./StoryBook/index.mjs";
-export { StoryBook, useControls, useCreateStore };
+export { StoryBook, useControls, useCreateStore } from "./StoryBook/index.mjs";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "5.57.1",
+  "version": "5.57.2",
   "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
   "keywords": [
     "lobehub",