@cube-dev/ui-kit 0.197.0 → 0.198.0

package/dist/components/content/ItemBadge/ItemBadge.d.ts

@@ -1,11 +1,9 @@
 
 import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
 import { BaseProps } from "@tenphi/tasty";
-import * as react from "react";
 import { ComponentProps, ReactNode } from "react";
-
 //#region src/components/content/ItemBadge/ItemBadge.d.ts
-interface CubeItemBadgeProps extends BaseProps {
+export interface CubeItemBadgeProps extends BaseProps {
   icon?: ReactNode | 'checkmark';
   children?: ReactNode;
   isLoading?: boolean;
@@ -16,7 +14,7 @@ interface CubeItemBadgeProps extends BaseProps {
     title?: ReactNode;
   });
 }
-declare const ItemBadge: react.ForwardRefExoticComponent<CubeItemBadgeProps & react.RefAttributes<HTMLDivElement>>;
+export declare const ItemBadge: import("react").ForwardRefExoticComponent<CubeItemBadgeProps & import("react").RefAttributes<HTMLDivElement>>;
 //#endregion
-export { CubeItemBadgeProps, ItemBadge };
+export type { CubeItemBadgeProps as ItemBadgeProps };
 //# sourceMappingURL=ItemBadge.d.ts.map

package/dist/components/content/ItemBadge/ItemBadge.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.197.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.198.0 | Cube Dev Team */
 import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
 import { CURRENT_CLEAR_STYLES, CURRENT_OUTLINE_STYLES, CURRENT_PRIMARY_STYLES, DANGER_CLEAR_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, ITEM_ACTION_BASE_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES } from "../../../data/item-themes.js";
 import { CheckIcon } from "../../../icons/CheckIcon.js";
@@ -9,7 +9,6 @@ import { c } from "react/compiler-runtime";
 import { mergeStyles, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-
 //#region src/components/content/ItemBadge/ItemBadge.tsx
 const ItemBadgeElement = tasty({
 	qa: "ItemBadge",
@@ -142,7 +141,7 @@ const ItemBadge = forwardRef(function ItemBadge(allProps, ref) {
 	if (t1 !== Symbol.for("react.early_return_sentinel")) return t1;
 	return t0;
 });
-
 //#endregion
 export { ItemBadge };
+
 //# sourceMappingURL=ItemBadge.js.map

package/dist/components/content/ItemBadge/ItemBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"ItemBadge.js","names":["BaseProps","mergeStyles","tasty","ComponentProps","forwardRef","HTMLAttributes","ReactNode","RefObject","CURRENT_CLEAR_STYLES","CURRENT_OUTLINE_STYLES","CURRENT_PRIMARY_STYLES","DANGER_CLEAR_STYLES","DANGER_OUTLINE_STYLES","DANGER_PRIMARY_STYLES","DEFAULT_CLEAR_STYLES","DEFAULT_OUTLINE_STYLES","DEFAULT_PRIMARY_STYLES","ITEM_ACTION_BASE_STYLES","SPECIAL_CLEAR_STYLES","SPECIAL_OUTLINE_STYLES","SPECIAL_PRIMARY_STYLES","SUCCESS_CLEAR_STYLES","SUCCESS_OUTLINE_STYLES","SUCCESS_PRIMARY_STYLES","CheckIcon","LoadingIcon","useItemActionContext","mergeTooltipFocusProps","TooltipProvider","CubeItemBadgeProps","icon","children","isLoading","isSelected","type","theme","tooltip","Omit","title","ItemBadgeVariant","ItemBadgeElement","qa","styles","cursor","border","variants","ItemBadge","HTMLDivElement","allProps","ref","$","_c","contextType","t0","t1","Symbol","for","bb0","t2","t3","t4","t5","mods","rest","undefined","hasCheckmark","t6","finalIcon","t7","t8","t9","checkmark","selected","loading","context","finalMods","ariaLabel","showTooltip","tooltipContent","t10","tooltipProps","_title","t11","role","ariaDescription","finalType","renderBadge","tooltipTriggerProps","tooltipRef","handleRef","element","current","triggerProps","tooltipRef_0","ItemBadgeProps"],"sources":["../../../../src/components/content/ItemBadge/ItemBadge.tsx"],"sourcesContent":["import { BaseProps, mergeStyles, tasty } from '@tenphi/tasty';\nimport {\n  ComponentProps,\n  forwardRef,\n  HTMLAttributes,\n  ReactNode,\n  RefObject,\n} from 'react';\n\nimport {\n  CURRENT_CLEAR_STYLES,\n  CURRENT_OUTLINE_STYLES,\n  CURRENT_PRIMARY_STYLES,\n  DANGER_CLEAR_STYLES,\n  DANGER_OUTLINE_STYLES,\n  DANGER_PRIMARY_STYLES,\n  DEFAULT_CLEAR_STYLES,\n  DEFAULT_OUTLINE_STYLES,\n  DEFAULT_PRIMARY_STYLES,\n  ITEM_ACTION_BASE_STYLES,\n  SPECIAL_CLEAR_STYLES,\n  SPECIAL_OUTLINE_STYLES,\n  SPECIAL_PRIMARY_STYLES,\n  SUCCESS_CLEAR_STYLES,\n  SUCCESS_OUTLINE_STYLES,\n  SUCCESS_PRIMARY_STYLES,\n} from '../../../data/item-themes';\nimport { CheckIcon } from '../../../icons/CheckIcon';\nimport { LoadingIcon } from '../../../icons/LoadingIcon';\nimport { useItemActionContext } from '../../actions/ItemActionContext';\nimport { mergeTooltipFocusProps } from '../../overlays/Tooltip/split-trigger-props';\nimport { TooltipProvider } from '../../overlays/Tooltip/TooltipProvider';\n\nexport interface CubeItemBadgeProps extends BaseProps {\n  icon?: ReactNode | 'checkmark';\n  children?: ReactNode;\n  isLoading?: boolean;\n  isSelected?: boolean;\n  type?: 'primary' | 'outline' | 'clear' | (string & {});\n  theme?:\n    | 'current'\n    | 'default'\n    | 'danger'\n    | 'success'\n    | 'special'\n    | (string & {});\n  tooltip?:\n    | string\n    | (Omit<ComponentProps<typeof TooltipProvider>, 'children'> & {\n        title?: ReactNode;\n      });\n}\n\ntype ItemBadgeVariant =\n  // Inherited-color theme — see the CURRENT THEME section of `item-themes`.\n  | 'current.primary'\n  | 'current.outline'\n  | 'current.clear'\n  | 'default.primary'\n  | 'default.outline'\n  | 'default.clear'\n  | 'danger.primary'\n  | 'danger.outline'\n  | 'danger.clear'\n  | 'success.primary'\n  | 'success.outline'\n  | 'success.clear'\n  | 'special.primary'\n  | 'special.outline'\n  | 'special.clear';\n\nconst ItemBadgeElement = tasty({\n  qa: 'ItemBadge',\n  styles: mergeStyles(ITEM_ACTION_BASE_STYLES, {\n    cursor: 'default',\n    border: {\n      // extend\n      'type=primary': '#clear',\n    },\n  }),\n  variants: {\n    // Current theme — colors mixed from the inherited `currentcolor`. The\n    // default `clear` flavour is borderless, so a badge does not put a resting\n    // chip on every row.\n    'current.primary': CURRENT_PRIMARY_STYLES,\n    'current.outline': CURRENT_OUTLINE_STYLES,\n    'current.clear': CURRENT_CLEAR_STYLES,\n\n    // Default theme\n    'default.primary': DEFAULT_PRIMARY_STYLES,\n    'default.outline': DEFAULT_OUTLINE_STYLES,\n    'default.clear': DEFAULT_CLEAR_STYLES,\n\n    // Danger theme\n    'danger.primary': DANGER_PRIMARY_STYLES,\n    'danger.outline': DANGER_OUTLINE_STYLES,\n    'danger.clear': DANGER_CLEAR_STYLES,\n\n    // Success theme\n    'success.primary': SUCCESS_PRIMARY_STYLES,\n    'success.outline': SUCCESS_OUTLINE_STYLES,\n    'success.clear': SUCCESS_CLEAR_STYLES,\n\n    // Special theme\n    'special.primary': SPECIAL_PRIMARY_STYLES,\n    'special.outline': SPECIAL_OUTLINE_STYLES,\n    'special.clear': SPECIAL_CLEAR_STYLES,\n  },\n});\n\nexport const ItemBadge = forwardRef<HTMLDivElement, CubeItemBadgeProps>(\n  function ItemBadge(allProps, ref) {\n    // `contextType` is read for its presence only — it marks \"inside a row\",\n    // which drives the `context` mod below. It does not pick the variant any\n    // more.\n    const { type: contextType } = useItemActionContext();\n\n    const {\n      // See `ItemAction` for the full rationale: the `current` theme tracks the\n      // host through `currentcolor`, so neither the row's `type` nor its `theme`\n      // has to be mirrored from context, and a badge that names a theme is\n      // asking to paint itself rather than match its host.\n      type = 'clear',\n      theme = 'current',\n      icon,\n      children,\n      isLoading = false,\n      isSelected = false,\n      tooltip,\n      mods,\n      ...rest\n    } = allProps;\n\n    // Determine if we should show a checkmark\n    const hasCheckmark = icon === 'checkmark';\n\n    // Determine final icon (loading takes precedence)\n    const finalIcon = isLoading ? (\n      <LoadingIcon />\n    ) : hasCheckmark ? (\n      <CheckIcon />\n    ) : (\n      icon\n    );\n\n    // Build modifiers\n    const finalMods = {\n      checkmark: hasCheckmark,\n      selected: isSelected,\n      loading: isLoading,\n      'has-label': !!children,\n      context: !!contextType,\n      ...mods,\n    };\n\n    // An explicit label always wins; a tooltip only fills in the accessible\n    // name when there isn't one. Rich tooltip content can't serve as a name, so\n    // only plain strings are used here.\n    const ariaLabel =\n      rest['aria-label'] ||\n      (typeof tooltip === 'string'\n        ? tooltip\n        : typeof tooltip === 'object' && typeof tooltip.title === 'string'\n          ? tooltip.title\n          : undefined);\n\n    // Determine if we should show tooltip (icon-only badges)\n    const showTooltip = !children && tooltip;\n\n    // Extract tooltip content and props\n    const tooltipContent =\n      typeof tooltip === 'string'\n        ? tooltip\n        : typeof tooltip === 'object' && tooltip.title\n          ? tooltip.title\n          : undefined;\n\n    const { title: _title, ...tooltipProps } =\n      typeof tooltip === 'object' ? tooltip : {};\n\n    // A badge is never interactive, and screen readers ignore a name on an\n    // element without a role. An icon-only badge with a name is exposed as an\n    // image; a badge with a visible label reads as that label.\n    const role = rest.role ?? (ariaLabel && !children ? 'img' : undefined);\n\n    // The badge cannot take focus, so its tooltip opens on hover only. When\n    // the tooltip text is not already the name, it describes the badge instead,\n    // so keyboard and screen reader users get it without a Tab stop on every\n    // badge. Rich tooltip content has no plain text to put here.\n    const ariaDescription =\n      rest['aria-description'] ??\n      (showTooltip &&\n      typeof tooltipContent === 'string' &&\n      tooltipContent !== ariaLabel\n        ? tooltipContent\n        : undefined);\n\n    const finalType = type;\n\n    // Render function that accepts tooltip trigger props and ref\n    const renderBadge = (\n      tooltipTriggerProps?: HTMLAttributes<HTMLElement>,\n      tooltipRef?: RefObject<HTMLElement>,\n    ) => {\n      // Merge tooltip ref with component ref if provided\n      const handleRef = (element: HTMLDivElement | null) => {\n        // Set the component ref\n        if (typeof ref === 'function') {\n          ref(element);\n        } else if (ref) {\n          (ref as any).current = element;\n        }\n        // Set the tooltip ref\n        if (tooltipRef) {\n          (tooltipRef as any).current = element;\n        }\n      };\n\n      return (\n        <ItemBadgeElement\n          ref={handleRef}\n          variant={`${theme}.${finalType}` as ItemBadgeVariant}\n          data-theme={theme}\n          data-type={finalType}\n          aria-label={ariaLabel}\n          role={role}\n          aria-description={ariaDescription}\n          mods={finalMods}\n          // The tooltip joins the badge's own description rather than\n          // replacing it while open.\n          {...mergeTooltipFocusProps(rest, tooltipTriggerProps)}\n        >\n          {finalIcon && <div data-element=\"Icon\">{finalIcon}</div>}\n          {children}\n        </ItemBadgeElement>\n      );\n    };\n\n    // Wrap with tooltip if needed\n    if (showTooltip && tooltipContent) {\n      return (\n        <TooltipProvider title={tooltipContent} {...tooltipProps}>\n          {(triggerProps, tooltipRef) => renderBadge(triggerProps, tooltipRef)}\n        </TooltipProvider>\n      );\n    }\n\n    return renderBadge();\n  },\n);\n\nexport type { CubeItemBadgeProps as ItemBadgeProps };\n"],"mappings":";;;;;;;;;;;;;AAuEA,MAAMwC,mBAAmBtC,MAAM;CAC7BuC,IAAI;CACJC,QAAQzC,YAAYgB,yBAAyB;EAC3C0B,QAAQ;EACRC,QAAQ,EAEN,gBAAgB,UAClB;EACD,CAAC;CACFC,UAAU;EAIR,mBAAmBnC;EACnB,mBAAmBD;EACnB,iBAAiBD;EAGjB,mBAAmBQ;EACnB,mBAAmBD;EACnB,iBAAiBD;EAGjB,kBAAkBD;EAClB,kBAAkBD;EAClB,gBAAgBD;EAGhB,mBAAmBY;EACnB,mBAAmBD;EACnB,iBAAiBD;EAGjB,mBAAmBD;EACnB,mBAAmBD;EACnB,iBAAiBD;EACnB;CACD,CAAC;AAEF,MAAa4B,YAAY1C,WACvB,SAAA0C,UAAAE,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAIE,MAAA,EAAAjB,MAAAkB,gBAA8B1B,sBAAsB;CAAC,IAAA2B;CAAA,IAAAC;AAAA,KAAAJ,EAAA,OAAAF,YAAAE,EAAA,OAAAE,eAAAF,EAAA,OAAAD,KAAA;AA8HjDK,OAAAC,OAEkBC,IAFlB,8BAEkB;AAAAC,OAAA;GA9HtB,MAAA,EAAAvB,MAAAwB,IAAAvB,OAAAwB,IAAA7B,MAAAC,UAAAC,WAAA4B,IAAA3B,YAAA4B,IAAAzB,SAAA0B,MAAA,GAAAC,SAcIf;GATF,MAAAd,OAAAwB,OAAAM,SAAA,UAAAN;GACA,MAAAvB,QAAAwB,OAAAK,SAAA,YAAAL;GAGA,MAAA3B,YAAA4B,OAAAI,SAAA,QAAAJ;GACA,MAAA3B,aAAA4B,OAAAG,SAAA,QAAAH;GAOF,MAAAI,eAAqBnC,SAAS;GAAY,IAAAoC;AAAA,OAAAhB,EAAA,OAAAe,gBAAAf,EAAA,OAAApB,QAAAoB,EAAA,OAAAlB,WAAA;AAGxBkC,SAAAlC,YAChB,oBAAC,gBAKF,GAJGiC,eACF,oBAAC,cAGF,GAJGnC;AAIHoB,MAAA,KAAAe;AAAAf,MAAA,KAAApB;AAAAoB,MAAA,KAAAlB;AAAAkB,MAAA,KAAAgB;SAAAA,MAAAhB,EAAA;GAND,MAAAiB,YAAkBD;GAaH,MAAAE,KAAA,CAAC,CAACrC;GACN,MAAAsC,KAAA,CAAC,CAACjB;GAAW,IAAAkB;AAAA,OAAApB,EAAA,OAAAe,gBAAAf,EAAA,QAAAlB,aAAAkB,EAAA,QAAAjB,cAAAiB,EAAA,QAAAY,QAAAZ,EAAA,QAAAkB,MAAAlB,EAAA,QAAAmB,IAAA;AALNC,SAAA;KAAAC,WACLN;KAAYO,UACbvC;KAAUwC,SACXzC;KAAS,aACLoC;KAAUM,SACdL;KAAa,GACnBP;KACJ;AAAAZ,MAAA,KAAAe;AAAAf,MAAA,MAAAlB;AAAAkB,MAAA,MAAAjB;AAAAiB,MAAA,MAAAY;AAAAZ,MAAA,MAAAkB;AAAAlB,MAAA,MAAAmB;AAAAnB,MAAA,MAAAoB;SAAAA,MAAApB,EAAA;GAPD,MAAAyB,YAAkBL;GAYlB,MAAAM,YACEb,KAAK,kBACJ,OAAO3B,YAAY,WAAnBA,UAEG,OAAOA,YAAY,YAAY,OAAOA,QAAOE,UAAW,WACtDF,QAAOE,QADT0B;GAKN,MAAAa,cAAoB,CAAC9C,YAADK;GAGpB,MAAA0C,iBACE,OAAO1C,YAAY,WAAnBA,UAEI,OAAOA,YAAY,YAAYA,QAAOE,QACpCF,QAAOE,QADT0B;GAEY,IAAAe;AAAA,OAAA7B,EAAA,QAAAd,SAAA;AAGhB2C,UAAA,OAAO3C,YAAY,WAAnBA,UAAA,EAA0C;AAAAc,MAAA,MAAAd;AAAAc,MAAA,MAAA6B;SAAAA,OAAA7B,EAAA;GAAA,IAAA8B;AAAA,OAAA9B,EAAA,QAAA6B,KAAA;IAD5C,MAAA,EAAAzC,OAAA2C,QAAA,GAAAC,QACEH;AADFC,mBAAAE;AAC6ChC,MAAA,MAAA6B;AAAA7B,MAAA,MAAA8B;SAAAA,gBAAA9B,EAAA;GAK7C,MAAAiC,OAAapB,KAAIoB,SAAUP,aAAA,CAAc7C,WAAd,QAAAiC;GAM3B,MAAAoB,kBACErB,KAAK,wBACJc,eACD,OAAOC,mBAAmB,YAC1BA,mBAAmBF,YAFlBE,iBAAAd;GAMH,MAAAqB,YAAkBnD;GAGlB,MAAAoD,eAAoBC,qBAAAC,eAAA;IAKlB,MAAAC,aAAkBC,YAAA;AAEhB,SAAI,OAAOzC,QAAQ,WACjBA,KAAIyC,QAAQ;cACHzC,IACT,CAACA,IAAU0C,UAAYD;AAGzB,SAAIF,WACF,CAACA,WAAiBG,UAAYD;;AAEhC,WAGA,qBAAC;KACMD,KAAAA;KACI,SAAA,GAAGtD,MAAK,GAAIkD;KACTlD,cAAAA;KACDkD,aAAAA;KACCT,cAAAA;KACNO;KACYC,oBAAAA;KACZT,MAAAA;KAAS,GAGXhD,uBAAuBoC,MAAMwB,oBAAoB;gBAEpDpB,aAAa,oBAAA;MAAkB,gBAAA;gBAAQA;OAAe,EACtDpC;MACgB;;AAKvB,OAAI8C,eAAAC,gBAA6B;AAE7BxB,SAAA,oBAAC;KAAuBwB,OAAAA;KAAc,GAAME;gBACzCY,cAAAC,iBAA8BP,YAAYM,cAAcJ,aAAU;MACnD;AAFlB,UAAA/B;;AAMGJ,QAAAiC,aAAa;;AAAApC,IAAA,KAAAF;AAAAE,IAAA,KAAAE;AAAAF,IAAA,KAAAD;AAAAC,IAAA,KAAAG;AAAAH,IAAA,KAAAI;QAAA;AAAAD,OAAAH,EAAA;AAAAI,OAAAJ,EAAA;;AAAA,KAAAI,OAAAC,OAAAC,IAAA,8BAAA,CAAA,QAAAF;AAAA,QAAbD;EAEV"}
+{"version":3,"file":"ItemBadge.js","names":["BaseProps","mergeStyles","tasty","ComponentProps","forwardRef","HTMLAttributes","ReactNode","RefObject","CURRENT_CLEAR_STYLES","CURRENT_OUTLINE_STYLES","CURRENT_PRIMARY_STYLES","DANGER_CLEAR_STYLES","DANGER_OUTLINE_STYLES","DANGER_PRIMARY_STYLES","DEFAULT_CLEAR_STYLES","DEFAULT_OUTLINE_STYLES","DEFAULT_PRIMARY_STYLES","ITEM_ACTION_BASE_STYLES","SPECIAL_CLEAR_STYLES","SPECIAL_OUTLINE_STYLES","SPECIAL_PRIMARY_STYLES","SUCCESS_CLEAR_STYLES","SUCCESS_OUTLINE_STYLES","SUCCESS_PRIMARY_STYLES","CheckIcon","LoadingIcon","useItemActionContext","mergeTooltipFocusProps","TooltipProvider","CubeItemBadgeProps","icon","children","isLoading","isSelected","type","theme","tooltip","Omit","title","ItemBadgeVariant","ItemBadgeElement","qa","styles","cursor","border","variants","ItemBadge","HTMLDivElement","allProps","ref","$","_c","contextType","t0","t1","Symbol","for","bb0","t2","t3","t4","t5","mods","rest","undefined","hasCheckmark","t6","finalIcon","t7","t8","t9","checkmark","selected","loading","context","finalMods","ariaLabel","showTooltip","tooltipContent","t10","tooltipProps","_title","t11","role","ariaDescription","finalType","renderBadge","tooltipTriggerProps","tooltipRef","handleRef","element","current","triggerProps","tooltipRef_0","ItemBadgeProps","_c"],"sources":["../../../../src/components/content/ItemBadge/ItemBadge.tsx"],"sourcesContent":["import { BaseProps, mergeStyles, tasty } from '@tenphi/tasty';\nimport {\n  ComponentProps,\n  forwardRef,\n  HTMLAttributes,\n  ReactNode,\n  RefObject,\n} from 'react';\n\nimport {\n  CURRENT_CLEAR_STYLES,\n  CURRENT_OUTLINE_STYLES,\n  CURRENT_PRIMARY_STYLES,\n  DANGER_CLEAR_STYLES,\n  DANGER_OUTLINE_STYLES,\n  DANGER_PRIMARY_STYLES,\n  DEFAULT_CLEAR_STYLES,\n  DEFAULT_OUTLINE_STYLES,\n  DEFAULT_PRIMARY_STYLES,\n  ITEM_ACTION_BASE_STYLES,\n  SPECIAL_CLEAR_STYLES,\n  SPECIAL_OUTLINE_STYLES,\n  SPECIAL_PRIMARY_STYLES,\n  SUCCESS_CLEAR_STYLES,\n  SUCCESS_OUTLINE_STYLES,\n  SUCCESS_PRIMARY_STYLES,\n} from '../../../data/item-themes';\nimport { CheckIcon } from '../../../icons/CheckIcon';\nimport { LoadingIcon } from '../../../icons/LoadingIcon';\nimport { useItemActionContext } from '../../actions/ItemActionContext';\nimport { mergeTooltipFocusProps } from '../../overlays/Tooltip/split-trigger-props';\nimport { TooltipProvider } from '../../overlays/Tooltip/TooltipProvider';\n\nexport interface CubeItemBadgeProps extends BaseProps {\n  icon?: ReactNode | 'checkmark';\n  children?: ReactNode;\n  isLoading?: boolean;\n  isSelected?: boolean;\n  type?: 'primary' | 'outline' | 'clear' | (string & {});\n  theme?:\n    'current' | 'default' | 'danger' | 'success' | 'special' | (string & {});\n  tooltip?:\n    | string\n    | (Omit<ComponentProps<typeof TooltipProvider>, 'children'> & {\n        title?: ReactNode;\n      });\n}\n\ntype ItemBadgeVariant =\n  // Inherited-color theme — see the CURRENT THEME section of `item-themes`.\n  | 'current.primary'\n  | 'current.outline'\n  | 'current.clear'\n  | 'default.primary'\n  | 'default.outline'\n  | 'default.clear'\n  | 'danger.primary'\n  | 'danger.outline'\n  | 'danger.clear'\n  | 'success.primary'\n  | 'success.outline'\n  | 'success.clear'\n  | 'special.primary'\n  | 'special.outline'\n  | 'special.clear';\n\nconst ItemBadgeElement = tasty({\n  qa: 'ItemBadge',\n  styles: mergeStyles(ITEM_ACTION_BASE_STYLES, {\n    cursor: 'default',\n    border: {\n      // extend\n      'type=primary': '#clear',\n    },\n  }),\n  variants: {\n    // Current theme — colors mixed from the inherited `currentcolor`. The\n    // default `clear` flavour is borderless, so a badge does not put a resting\n    // chip on every row.\n    'current.primary': CURRENT_PRIMARY_STYLES,\n    'current.outline': CURRENT_OUTLINE_STYLES,\n    'current.clear': CURRENT_CLEAR_STYLES,\n\n    // Default theme\n    'default.primary': DEFAULT_PRIMARY_STYLES,\n    'default.outline': DEFAULT_OUTLINE_STYLES,\n    'default.clear': DEFAULT_CLEAR_STYLES,\n\n    // Danger theme\n    'danger.primary': DANGER_PRIMARY_STYLES,\n    'danger.outline': DANGER_OUTLINE_STYLES,\n    'danger.clear': DANGER_CLEAR_STYLES,\n\n    // Success theme\n    'success.primary': SUCCESS_PRIMARY_STYLES,\n    'success.outline': SUCCESS_OUTLINE_STYLES,\n    'success.clear': SUCCESS_CLEAR_STYLES,\n\n    // Special theme\n    'special.primary': SPECIAL_PRIMARY_STYLES,\n    'special.outline': SPECIAL_OUTLINE_STYLES,\n    'special.clear': SPECIAL_CLEAR_STYLES,\n  },\n});\n\nexport const ItemBadge = forwardRef<HTMLDivElement, CubeItemBadgeProps>(\n  function ItemBadge(allProps, ref) {\n    // `contextType` is read for its presence only — it marks \"inside a row\",\n    // which drives the `context` mod below. It does not pick the variant any\n    // more.\n    const { type: contextType } = useItemActionContext();\n\n    const {\n      // See `ItemAction` for the full rationale: the `current` theme tracks the\n      // host through `currentcolor`, so neither the row's `type` nor its `theme`\n      // has to be mirrored from context, and a badge that names a theme is\n      // asking to paint itself rather than match its host.\n      type = 'clear',\n      theme = 'current',\n      icon,\n      children,\n      isLoading = false,\n      isSelected = false,\n      tooltip,\n      mods,\n      ...rest\n    } = allProps;\n\n    // Determine if we should show a checkmark\n    const hasCheckmark = icon === 'checkmark';\n\n    // Determine final icon (loading takes precedence)\n    const finalIcon = isLoading ? (\n      <LoadingIcon />\n    ) : hasCheckmark ? (\n      <CheckIcon />\n    ) : (\n      icon\n    );\n\n    // Build modifiers\n    const finalMods = {\n      checkmark: hasCheckmark,\n      selected: isSelected,\n      loading: isLoading,\n      'has-label': !!children,\n      context: !!contextType,\n      ...mods,\n    };\n\n    // An explicit label always wins; a tooltip only fills in the accessible\n    // name when there isn't one. Rich tooltip content can't serve as a name, so\n    // only plain strings are used here.\n    const ariaLabel =\n      rest['aria-label'] ||\n      (typeof tooltip === 'string'\n        ? tooltip\n        : typeof tooltip === 'object' && typeof tooltip.title === 'string'\n          ? tooltip.title\n          : undefined);\n\n    // Determine if we should show tooltip (icon-only badges)\n    const showTooltip = !children && tooltip;\n\n    // Extract tooltip content and props\n    const tooltipContent =\n      typeof tooltip === 'string'\n        ? tooltip\n        : typeof tooltip === 'object' && tooltip.title\n          ? tooltip.title\n          : undefined;\n\n    const { title: _title, ...tooltipProps } =\n      typeof tooltip === 'object' ? tooltip : {};\n\n    // A badge is never interactive, and screen readers ignore a name on an\n    // element without a role. An icon-only badge with a name is exposed as an\n    // image; a badge with a visible label reads as that label.\n    const role = rest.role ?? (ariaLabel && !children ? 'img' : undefined);\n\n    // The badge cannot take focus, so its tooltip opens on hover only. When\n    // the tooltip text is not already the name, it describes the badge instead,\n    // so keyboard and screen reader users get it without a Tab stop on every\n    // badge. Rich tooltip content has no plain text to put here.\n    const ariaDescription =\n      rest['aria-description'] ??\n      (showTooltip &&\n      typeof tooltipContent === 'string' &&\n      tooltipContent !== ariaLabel\n        ? tooltipContent\n        : undefined);\n\n    const finalType = type;\n\n    // Render function that accepts tooltip trigger props and ref\n    const renderBadge = (\n      tooltipTriggerProps?: HTMLAttributes<HTMLElement>,\n      tooltipRef?: RefObject<HTMLElement>,\n    ) => {\n      // Merge tooltip ref with component ref if provided\n      const handleRef = (element: HTMLDivElement | null) => {\n        // Set the component ref\n        if (typeof ref === 'function') {\n          ref(element);\n        } else if (ref) {\n          (ref as any).current = element;\n        }\n        // Set the tooltip ref\n        if (tooltipRef) {\n          (tooltipRef as any).current = element;\n        }\n      };\n\n      return (\n        <ItemBadgeElement\n          ref={handleRef}\n          variant={`${theme}.${finalType}` as ItemBadgeVariant}\n          data-theme={theme}\n          data-type={finalType}\n          aria-label={ariaLabel}\n          role={role}\n          aria-description={ariaDescription}\n          mods={finalMods}\n          // The tooltip joins the badge's own description rather than\n          // replacing it while open.\n          {...mergeTooltipFocusProps(rest, tooltipTriggerProps)}\n        >\n          {finalIcon && <div data-element=\"Icon\">{finalIcon}</div>}\n          {children}\n        </ItemBadgeElement>\n      );\n    };\n\n    // Wrap with tooltip if needed\n    if (showTooltip && tooltipContent) {\n      return (\n        <TooltipProvider title={tooltipContent} {...tooltipProps}>\n          {(triggerProps, tooltipRef) => renderBadge(triggerProps, tooltipRef)}\n        </TooltipProvider>\n      );\n    }\n\n    return renderBadge();\n  },\n);\n\nexport type { CubeItemBadgeProps as ItemBadgeProps };\n"],"mappings":"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"}

package/dist/components/content/ItemBadge/index.d.ts

@@ -1,2 +1,3 @@
 
-import { CubeItemBadgeProps, ItemBadge } from "./ItemBadge.js";
+import { CubeItemBadgeProps, ItemBadge } from "./ItemBadge.js";
+export { ItemBadge };

package/dist/components/content/ItemCard/ItemCard.d.ts

@@ -1,21 +1,18 @@
 
 import { CubeItemActionProps } from "../../actions/ItemAction/ItemAction.js";
 import "../../actions/index.js";
-import { CubeItemProps } from "../Item/Item.js";
-import * as react from "react";
+import { CubeItemBaseProps as CubeItemProps } from "../Item/Item.js";
 import { ReactNode } from "react";
-import * as _react_types_shared0 from "@react-types/shared";
-
 //#region src/components/content/ItemCard/ItemCard.d.ts
-interface CubeItemCardProps extends Omit<CubeItemProps, 'type' | 'children' | 'description'> {
+export interface CubeItemCardProps extends Omit<CubeItemProps, 'type' | 'children' | 'description'> {
   /** Card heading, mapped to Item's `children`. */
   title?: ReactNode;
   /** Card body content, mapped to Item's `description`. */
   children?: ReactNode;
 }
-declare const ItemCard: react.ForwardRefExoticComponent<CubeItemCardProps & react.RefAttributes<HTMLElement>> & {
-  Action: react.ForwardRefExoticComponent<CubeItemActionProps & react.RefAttributes<_react_types_shared0.FocusableRefValue<HTMLElement, HTMLElement>>>;
+declare const ItemCard: import("react").ForwardRefExoticComponent<CubeItemCardProps & import("react").RefAttributes<HTMLElement>> & {
+  Action: import("react").ForwardRefExoticComponent<CubeItemActionProps & import("react").RefAttributes<import("@react-types/shared").FocusableRefValue<HTMLElement, HTMLElement>>>;
 };
 //#endregion
-export { CubeItemCardProps, ItemCard };
+export { ItemCard };
 //# sourceMappingURL=ItemCard.d.ts.map

package/dist/components/content/ItemCard/ItemCard.js

@@ -1,10 +1,9 @@
-/** @license MIT | @cube-dev/ui-kit v0.197.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.198.0 | Cube Dev Team */
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
-import { _Item } from "../Item/Item.js";
+import { Item as _Item } from "../Item/Item.js";
 import { c } from "react/compiler-runtime";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/content/ItemCard/ItemCard.tsx
 const _ItemCard = forwardRef(function ItemCard(t0, ref) {
 	const $ = c(16);
@@ -62,7 +61,7 @@ const _ItemCard = forwardRef(function ItemCard(t0, ref) {
 	return t3;
 });
 const ItemCard = Object.assign(_ItemCard, { Action: ItemAction });
-
 //#endregion
 export { ItemCard };
+
 //# sourceMappingURL=ItemCard.js.map

package/dist/components/content/ItemCard/ItemCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"ItemCard.js","names":["ForwardedRef","forwardRef","ReactNode","ItemAction","CubeItemProps","Item","CubeItemCardProps","Omit","title","children","_ItemCard","ItemCard","t0","ref","$","_c","props","variant","t1","undefined","t2","mods","t3","Object","assign","Action"],"sources":["../../../../src/components/content/ItemCard/ItemCard.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef, ReactNode } from 'react';\n\nimport { ItemAction } from '../../actions/ItemAction/ItemAction';\nimport { CubeItemProps, Item } from '../Item/Item';\n\nexport interface CubeItemCardProps\n  extends Omit<CubeItemProps, 'type' | 'children' | 'description'> {\n  /** Card heading, mapped to Item's `children`. */\n  title?: ReactNode;\n  /** Card body content, mapped to Item's `description`. */\n  children?: ReactNode;\n}\n\nconst _ItemCard = forwardRef(function ItemCard(\n  { title, children, variant, ...props }: CubeItemCardProps,\n  ref: ForwardedRef<HTMLElement>,\n) {\n  return (\n    <Item\n      ref={ref}\n      {...props}\n      {...(variant === undefined ? {} : { variant })}\n      mods={{ 'item-card': true, ...props.mods }}\n      type=\"card\"\n      description={children}\n    >\n      {title}\n    </Item>\n  );\n});\n\nconst ItemCard = Object.assign(_ItemCard, {\n  Action: ItemAction,\n});\n\nexport { ItemCard };\n"],"mappings":";;;;;;;;AAaA,MAAMU,YAAYT,WAAW,SAAAU,SAAAC,IAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAAA,IAAAN;CAAA,IAAAO;CAAA,IAAAR;CAAA,IAAAS;AAAA,KAAAH,EAAA,OAAAF,IAAA;AAC3B,GAAA,CAAAJ,OAAAC,UAAAQ,YAAAD,SAAAJ;AAAyDE,IAAA,KAAAF;AAAAE,IAAA,KAAAL;AAAAK,IAAA,KAAAE;AAAAF,IAAA,KAAAN;AAAAM,IAAA,KAAAG;QAAA;AAAAR,aAAAK,EAAA;AAAAE,UAAAF,EAAA;AAAAN,UAAAM,EAAA;AAAAG,YAAAH,EAAA;;CAAA,IAAAI;AAAA,KAAAJ,EAAA,OAAAG,SAAA;AAOhDC,OAAAD,YAAYE,SAAZ,EAAwC,GAAxC,EAAAF,SAAwC;AAAAH,IAAA,KAAAG;AAAAH,IAAA,KAAAI;OAAAA,MAAAJ,EAAA;CAAA,IAAAM;AAAA,KAAAN,EAAA,OAAAE,MAAAK,MAAA;AACvCD,OAAA;GAAA,aAAe;GAAI,GAAKJ,MAAKK;GAAO;AAAAP,IAAA,KAAAE,MAAAK;AAAAP,IAAA,KAAAM;OAAAA,MAAAN,EAAA;CAAA,IAAAQ;AAAA,KAAAR,EAAA,OAAAL,YAAAK,EAAA,QAAAE,SAAAF,EAAA,QAAAD,OAAAC,EAAA,QAAAI,MAAAJ,EAAA,QAAAM,MAAAN,EAAA,QAAAN,OAAA;AAJ5Cc,OAAA,oBAAC;GACMT;GAAG,GACJG;GAAK,GACJE;GACC,MAAAE;GACD,MAAA;GACQX,aAAAA;aAEZD;IACI;AAAAM,IAAA,KAAAL;AAAAK,IAAA,MAAAE;AAAAF,IAAA,MAAAD;AAAAC,IAAA,MAAAI;AAAAJ,IAAA,MAAAM;AAAAN,IAAA,MAAAN;AAAAM,IAAA,MAAAQ;OAAAA,MAAAR,EAAA;AAAA,QATPQ;EAWF;AAEF,MAAMX,WAAWY,OAAOC,OAAOd,WAAW,EACxCe,QAAQtB,YACT,CAAC"}
+{"version":3,"file":"ItemCard.js","names":["ForwardedRef","forwardRef","ReactNode","ItemAction","CubeItemProps","Item","CubeItemCardProps","Omit","title","children","_ItemCard","ItemCard","t0","ref","$","_c","props","variant","t1","undefined","t2","mods","t3","Object","assign","Action","_c","Item"],"sources":["../../../../src/components/content/ItemCard/ItemCard.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef, ReactNode } from 'react';\n\nimport { ItemAction } from '../../actions/ItemAction/ItemAction';\nimport { CubeItemProps, Item } from '../Item/Item';\n\nexport interface CubeItemCardProps extends Omit<\n  CubeItemProps,\n  'type' | 'children' | 'description'\n> {\n  /** Card heading, mapped to Item's `children`. */\n  title?: ReactNode;\n  /** Card body content, mapped to Item's `description`. */\n  children?: ReactNode;\n}\n\nconst _ItemCard = forwardRef(function ItemCard(\n  { title, children, variant, ...props }: CubeItemCardProps,\n  ref: ForwardedRef<HTMLElement>,\n) {\n  return (\n    <Item\n      ref={ref}\n      {...props}\n      {...(variant === undefined ? {} : { variant })}\n      mods={{ 'item-card': true, ...props.mods }}\n      type=\"card\"\n      description={children}\n    >\n      {title}\n    </Item>\n  );\n});\n\nconst ItemCard = Object.assign(_ItemCard, {\n  Action: ItemAction,\n});\n\nexport { ItemCard };\n"],"mappings":";;;;;;;AAeA,MAAMU,YAAYT,WAAW,SAAAU,SAAAC,IAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAN;CAAA,IAAAO;CAAA,IAAAR;CAAA,IAAAS;CAAA,IAAAH,EAAA,OAAAF,IAAA;EAC3B,CAAA,CAAAJ,OAAAC,UAAAQ,SAAA,GAAAD,SAAAJ;EAAyDE,EAAA,KAAAF;EAAAE,EAAA,KAAAL;EAAAK,EAAA,KAAAE;EAAAF,EAAA,KAAAN;EAAAM,EAAA,KAAAG;CAAA,OAAA;EAAAR,WAAAK,EAAA;EAAAE,QAAAF,EAAA;EAAAN,QAAAM,EAAA;EAAAG,UAAAH,EAAA;CAAA;CAAA,IAAAI;CAAA,IAAAJ,EAAA,OAAAG,SAAA;EAOhDC,KAAAD,YAAYE,KAAAA,IAAZ,CAAuC,IAAvC,EAAAF,QAAuC;EAACH,EAAA,KAAAG;EAAAH,EAAA,KAAAI;CAAA,OAAAA,KAAAJ,EAAA;CAAA,IAAAM;CAAA,IAAAN,EAAA,OAAAE,MAAAK,MAAA;EACvCD,KAAA;GAAA,aAAe;GAAI,GAAKJ,MAAKK;EAAM;EAACP,EAAA,KAAAE,MAAAK;EAAAP,EAAA,KAAAM;CAAA,OAAAA,KAAAN,EAAA;CAAA,IAAAQ;CAAA,IAAAR,EAAA,OAAAL,YAAAK,EAAA,QAAAE,SAAAF,EAAA,QAAAD,OAAAC,EAAA,QAAAI,MAAAJ,EAAA,QAAAM,MAAAN,EAAA,QAAAN,OAAA;EAJ5Cc,KAAA,oBAACK,OAAD;GACOd;GAAG,GACJG;GAAK,GACJE;GACC,MAAAE;GACD,MAAA;GACQX,aAAAA;GAEZD,UAAAA;EARE,CAAA;EASEM,EAAA,KAAAL;EAAAK,EAAA,MAAAE;EAAAF,EAAA,MAAAD;EAAAC,EAAA,MAAAI;EAAAJ,EAAA,MAAAM;EAAAN,EAAA,MAAAN;EAAAM,EAAA,MAAAQ;CAAA,OAAAA,KAAAR,EAAA;CAAA,OATPQ;AASO,CAEV;AAED,MAAMX,WAAWY,OAAOC,OAAOd,WAAW,EACxCe,QAAQtB,WACV,CAAC"}

package/dist/components/content/Layout/GridLayout.d.ts

@@ -1,20 +1,19 @@
 
 import { CubeLayoutProps } from "./Layout.js";
-import { _LayoutContent } from "./LayoutContent.js";
-import { _LayoutBlock } from "./LayoutBlock.js";
-import { _LayoutFlex } from "./LayoutFlex.js";
-import { _LayoutFooter } from "./LayoutFooter.js";
-import { _LayoutGrid } from "./LayoutGrid.js";
-import { _LayoutHeader } from "./LayoutHeader.js";
-import { _LayoutPane } from "./LayoutPane.js";
-import { _LayoutPanel } from "./LayoutPanel.js";
-import { _LayoutPanelHeader } from "./LayoutPanelHeader.js";
-import { _LayoutToolbar } from "./LayoutToolbar.js";
+import { LayoutContent as _LayoutContent } from "./LayoutContent.js";
+import { LayoutBlock as _LayoutBlock } from "./LayoutBlock.js";
+import { LayoutFlex as _LayoutFlex } from "./LayoutFlex.js";
+import { LayoutFooter as _LayoutFooter } from "./LayoutFooter.js";
+import { LayoutGrid as _LayoutGrid } from "./LayoutGrid.js";
+import { LayoutHeader as _LayoutHeader } from "./LayoutHeader.js";
+import { LayoutPane as _LayoutPane } from "./LayoutPane.js";
+import { LayoutPanel as _LayoutPanel } from "./LayoutPanel.js";
+import { LayoutPanelHeader as _LayoutPanelHeader } from "./LayoutPanelHeader.js";
+import { LayoutToolbar as _LayoutToolbar } from "./LayoutToolbar.js";
 import { Styles } from "@tenphi/tasty";
 import { ForwardRefExoticComponent, ReactNode, RefAttributes } from "react";
-
 //#region src/components/content/Layout/GridLayout.d.ts
-interface CubeGridLayoutProps extends CubeLayoutProps {
+export interface CubeGridLayoutProps extends CubeLayoutProps {
   /** Grid template columns */
   columns?: Styles['gridColumns'];
   /** Grid template rows */
@@ -37,5 +36,5 @@ interface GridLayoutComponent extends ForwardRefExoticComponent<CubeGridLayoutPr
 }
 declare const GridLayout: GridLayoutComponent;
 //#endregion
-export { CubeGridLayoutProps, GridLayout };
+export { GridLayout };
 //# sourceMappingURL=GridLayout.d.ts.map

package/dist/components/content/Layout/GridLayout.js

@@ -1,20 +1,19 @@
-/** @license MIT | @cube-dev/ui-kit v0.197.0 | Cube Dev Team */
-import { _Layout } from "./Layout.js";
-import { _LayoutContent } from "./LayoutContent.js";
-import { _LayoutBlock } from "./LayoutBlock.js";
-import { _LayoutFlex } from "./LayoutFlex.js";
-import { _LayoutFooter } from "./LayoutFooter.js";
-import { _LayoutGrid } from "./LayoutGrid.js";
-import { _LayoutHeader } from "./LayoutHeader.js";
-import { _LayoutPane } from "./LayoutPane.js";
-import { _LayoutPanel } from "./LayoutPanel.js";
-import { _LayoutPanelHeader } from "./LayoutPanelHeader.js";
-import { _LayoutToolbar } from "./LayoutToolbar.js";
+/** @license MIT | @cube-dev/ui-kit v0.198.0 | Cube Dev Team */
+import { Layout as _Layout } from "./Layout.js";
+import { LayoutContent as _LayoutContent } from "./LayoutContent.js";
+import { LayoutBlock as _LayoutBlock } from "./LayoutBlock.js";
+import { LayoutFlex as _LayoutFlex } from "./LayoutFlex.js";
+import { LayoutFooter as _LayoutFooter } from "./LayoutFooter.js";
+import { LayoutGrid as _LayoutGrid } from "./LayoutGrid.js";
+import { LayoutHeader as _LayoutHeader } from "./LayoutHeader.js";
+import { LayoutPane as _LayoutPane } from "./LayoutPane.js";
+import { LayoutPanel as _LayoutPanel } from "./LayoutPanel.js";
+import { LayoutPanelHeader as _LayoutPanelHeader } from "./LayoutPanelHeader.js";
+import { LayoutToolbar as _LayoutToolbar } from "./LayoutToolbar.js";
 import { c } from "react/compiler-runtime";
 import { tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/content/Layout/GridLayout.tsx
 const GridLayoutElement = tasty(_Layout, {
 	qa: "GridLayout",
@@ -72,7 +71,7 @@ const GridLayout = Object.assign(_GridLayout, {
 	Panel: _LayoutPanel,
 	PanelHeader: _LayoutPanelHeader
 });
-
 //#endregion
 export { GridLayout };
+
 //# sourceMappingURL=GridLayout.js.map

package/dist/components/content/Layout/GridLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"GridLayout.js","names":["Styles","tasty","ForwardedRef","forwardRef","ForwardRefExoticComponent","ReactNode","RefAttributes","CubeLayoutProps","Layout","LayoutBlock","LayoutContent","LayoutFlex","LayoutFooter","LayoutGrid","LayoutHeader","LayoutPane","LayoutPanel","LayoutPanelHeader","LayoutToolbar","GridLayoutElement","qa","styles","Inner","display","CubeGridLayoutProps","columns","rows","template","children","GridLayoutBase","props","ref","$","_c","otherProps","t0","_GridLayout","displayName","GridLayoutComponent","HTMLDivElement","Toolbar","Header","Footer","Content","Block","Flex","Grid","Pane","Panel","PanelHeader","GridLayout","Object","assign"],"sources":["../../../../src/components/content/Layout/GridLayout.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  ForwardRefExoticComponent,\n  ReactNode,\n  RefAttributes,\n} from 'react';\n\nimport { CubeLayoutProps, Layout } from './Layout';\nimport { LayoutBlock } from './LayoutBlock';\nimport { LayoutContent } from './LayoutContent';\nimport { LayoutFlex } from './LayoutFlex';\nimport { LayoutFooter } from './LayoutFooter';\nimport { LayoutGrid } from './LayoutGrid';\nimport { LayoutHeader } from './LayoutHeader';\nimport { LayoutPane } from './LayoutPane';\nimport { LayoutPanel } from './LayoutPanel';\nimport { LayoutPanelHeader } from './LayoutPanelHeader';\nimport { LayoutToolbar } from './LayoutToolbar';\n\nconst GridLayoutElement = tasty(Layout, {\n  qa: 'GridLayout',\n  styles: {\n    Inner: {\n      display: 'grid',\n    },\n  },\n});\n\nexport interface CubeGridLayoutProps extends CubeLayoutProps {\n  /** Grid template columns */\n  columns?: Styles['gridColumns'];\n  /** Grid template rows */\n  rows?: Styles['gridRows'];\n  /** Grid template shorthand */\n  template?: Styles['gridTemplate'];\n  children?: ReactNode;\n}\n\nfunction GridLayoutBase(\n  props: CubeGridLayoutProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { columns, rows, template, ...otherProps } = props;\n\n  return (\n    <GridLayoutElement\n      ref={ref}\n      isGrid\n      gridColumns={columns}\n      gridRows={rows}\n      gridTemplate={template}\n      {...otherProps}\n    />\n  );\n}\n\nconst _GridLayout = forwardRef(GridLayoutBase);\n\n_GridLayout.displayName = 'GridLayout';\n\n// Create the GridLayout with all sub-components aliased\ninterface GridLayoutComponent\n  extends ForwardRefExoticComponent<\n    CubeGridLayoutProps & RefAttributes<HTMLDivElement>\n  > {\n  Toolbar: typeof LayoutToolbar;\n  Header: typeof LayoutHeader;\n  Footer: typeof LayoutFooter;\n  Content: typeof LayoutContent;\n  Block: typeof LayoutBlock;\n  Flex: typeof LayoutFlex;\n  Grid: typeof LayoutGrid;\n  Pane: typeof LayoutPane;\n  Panel: typeof LayoutPanel;\n  PanelHeader: typeof LayoutPanelHeader;\n}\n\nconst GridLayout = Object.assign(_GridLayout, {\n  Toolbar: LayoutToolbar,\n  Header: LayoutHeader,\n  Footer: LayoutFooter,\n  Content: LayoutContent,\n  Block: LayoutBlock,\n  Flex: LayoutFlex,\n  Grid: LayoutGrid,\n  Pane: LayoutPane,\n  Panel: LayoutPanel,\n  PanelHeader: LayoutPanelHeader,\n}) as GridLayoutComponent;\n\nexport { GridLayout };\n"],"mappings":";;;;;;;;;;;;;;;;;;AAqBA,MAAMmB,oBAAoBlB,MAAMO,SAAQ;CACtCY,IAAI;CACJC,QAAQ,EACNC,OAAO,EACLC,SAAS,QACX,EACF;CACD,CAAC;AAYF,SAAAM,eAAAC,OAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAAA,IAAAR;CAAA,IAAAS;CAAA,IAAAR;CAAA,IAAAC;AAAA,KAAAK,EAAA,OAAAF,OAAA;AAIE,GAAA,CAAAL,SAAAC,MAAAC,aAAAO,cAAmDJ;AAAME,IAAA,KAAAF;AAAAE,IAAA,KAAAP;AAAAO,IAAA,KAAAE;AAAAF,IAAA,KAAAN;AAAAM,IAAA,KAAAL;QAAA;AAAAF,YAAAO,EAAA;AAAAE,eAAAF,EAAA;AAAAN,SAAAM,EAAA;AAAAL,aAAAK,EAAA;;CAAA,IAAAG;AAAA,KAAAH,EAAA,OAAAP,WAAAO,EAAA,OAAAE,cAAAF,EAAA,OAAAD,OAAAC,EAAA,OAAAN,QAAAM,EAAA,OAAAL,UAAA;AAGvDQ,OAAA,oBAAC;GACMJ;GACL,QAAA;GACaN,aAAAA;GACHC,UAAAA;GACIC,cAAAA;GAAQ,GAClBO;IACJ;AAAAF,IAAA,KAAAP;AAAAO,IAAA,KAAAE;AAAAF,IAAA,KAAAD;AAAAC,IAAA,KAAAN;AAAAM,IAAA,KAAAL;AAAAK,IAAA,MAAAG;OAAAA,MAAAH,EAAA;AAAA,QAPFG;;AAWJ,MAAMC,cAAcjC,WAAW0B,eAAe;AAE9CO,YAAYC,cAAc;AAmB1B,MAAMa,aAAaC,OAAOC,OAAOhB,aAAa;CAC5CI,SAAStB;CACTuB,QAAQ3B;CACR4B,QAAQ9B;CACR+B,SAASjC;CACTkC,OAAOnC;CACPoC,MAAMlC;CACNmC,MAAMjC;CACNkC,MAAMhC;CACNiC,OAAOhC;CACPiC,aAAahC;CACd,CAAC"}
+{"version":3,"file":"GridLayout.js","names":["Styles","tasty","ForwardedRef","forwardRef","ForwardRefExoticComponent","ReactNode","RefAttributes","CubeLayoutProps","Layout","LayoutBlock","LayoutContent","LayoutFlex","LayoutFooter","LayoutGrid","LayoutHeader","LayoutPane","LayoutPanel","LayoutPanelHeader","LayoutToolbar","GridLayoutElement","qa","styles","Inner","display","CubeGridLayoutProps","columns","rows","template","children","GridLayoutBase","props","ref","$","_c","otherProps","t0","_GridLayout","displayName","GridLayoutComponent","HTMLDivElement","Toolbar","Header","Footer","Content","Block","Flex","Grid","Pane","Panel","PanelHeader","GridLayout","Object","assign","Layout","_c","LayoutToolbar","LayoutHeader","LayoutFooter","LayoutContent","LayoutBlock","LayoutFlex","LayoutGrid","LayoutPane","LayoutPanel","LayoutPanelHeader"],"sources":["../../../../src/components/content/Layout/GridLayout.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  ForwardRefExoticComponent,\n  ReactNode,\n  RefAttributes,\n} from 'react';\n\nimport { CubeLayoutProps, Layout } from './Layout';\nimport { LayoutBlock } from './LayoutBlock';\nimport { LayoutContent } from './LayoutContent';\nimport { LayoutFlex } from './LayoutFlex';\nimport { LayoutFooter } from './LayoutFooter';\nimport { LayoutGrid } from './LayoutGrid';\nimport { LayoutHeader } from './LayoutHeader';\nimport { LayoutPane } from './LayoutPane';\nimport { LayoutPanel } from './LayoutPanel';\nimport { LayoutPanelHeader } from './LayoutPanelHeader';\nimport { LayoutToolbar } from './LayoutToolbar';\n\nconst GridLayoutElement = tasty(Layout, {\n  qa: 'GridLayout',\n  styles: {\n    Inner: {\n      display: 'grid',\n    },\n  },\n});\n\nexport interface CubeGridLayoutProps extends CubeLayoutProps {\n  /** Grid template columns */\n  columns?: Styles['gridColumns'];\n  /** Grid template rows */\n  rows?: Styles['gridRows'];\n  /** Grid template shorthand */\n  template?: Styles['gridTemplate'];\n  children?: ReactNode;\n}\n\nfunction GridLayoutBase(\n  props: CubeGridLayoutProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { columns, rows, template, ...otherProps } = props;\n\n  return (\n    <GridLayoutElement\n      ref={ref}\n      isGrid\n      gridColumns={columns}\n      gridRows={rows}\n      gridTemplate={template}\n      {...otherProps}\n    />\n  );\n}\n\nconst _GridLayout = forwardRef(GridLayoutBase);\n\n_GridLayout.displayName = 'GridLayout';\n\n// Create the GridLayout with all sub-components aliased\ninterface GridLayoutComponent extends ForwardRefExoticComponent<\n  CubeGridLayoutProps & RefAttributes<HTMLDivElement>\n> {\n  Toolbar: typeof LayoutToolbar;\n  Header: typeof LayoutHeader;\n  Footer: typeof LayoutFooter;\n  Content: typeof LayoutContent;\n  Block: typeof LayoutBlock;\n  Flex: typeof LayoutFlex;\n  Grid: typeof LayoutGrid;\n  Pane: typeof LayoutPane;\n  Panel: typeof LayoutPanel;\n  PanelHeader: typeof LayoutPanelHeader;\n}\n\nconst GridLayout = Object.assign(_GridLayout, {\n  Toolbar: LayoutToolbar,\n  Header: LayoutHeader,\n  Footer: LayoutFooter,\n  Content: LayoutContent,\n  Block: LayoutBlock,\n  Flex: LayoutFlex,\n  Grid: LayoutGrid,\n  Pane: LayoutPane,\n  Panel: LayoutPanel,\n  PanelHeader: LayoutPanelHeader,\n}) as GridLayoutComponent;\n\nexport { GridLayout };\n"],"mappings":";;;;;;;;;;;;;;;;;AAqBA,MAAMmB,oBAAoBlB,MAAMO,SAAQ;CACtCY,IAAI;CACJC,QAAQ,EACNC,OAAO,EACLC,SAAS,OACX,EACF;AACF,CAAC;AAYD,SAAAM,eAAAC,OAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAR;CAAA,IAAAS;CAAA,IAAAR;CAAA,IAAAC;CAAA,IAAAK,EAAA,OAAAF,OAAA;EAIE,CAAA,CAAAL,SAAAC,MAAAC,UAAA,GAAAO,cAAmDJ;EAAME,EAAA,KAAAF;EAAAE,EAAA,KAAAP;EAAAO,EAAA,KAAAE;EAAAF,EAAA,KAAAN;EAAAM,EAAA,KAAAL;CAAA,OAAA;EAAAF,UAAAO,EAAA;EAAAE,aAAAF,EAAA;EAAAN,OAAAM,EAAA;EAAAL,WAAAK,EAAA;CAAA;CAAA,IAAAG;CAAA,IAAAH,EAAA,OAAAP,WAAAO,EAAA,OAAAE,cAAAF,EAAA,OAAAD,OAAAC,EAAA,OAAAN,QAAAM,EAAA,OAAAL,UAAA;EAGvDQ,KAAA,oBAAC,mBAAD;GACOJ;GACL,QAAA;GACaN,aAAAA;GACHC,UAAAA;GACIC,cAAAA;GAAQ,GAClBO;EAAU,CAAA;EACdF,EAAA,KAAAP;EAAAO,EAAA,KAAAE;EAAAF,EAAA,KAAAD;EAAAC,EAAA,KAAAN;EAAAM,EAAA,KAAAL;EAAAK,EAAA,MAAAG;CAAA,OAAAA,KAAAH,EAAA;CAAA,OAPFG;AAOE;AAIN,MAAMC,cAAcjC,WAAW0B,cAAc;AAE7CO,YAAYC,cAAc;AAkB1B,MAAMa,aAAaC,OAAOC,OAAOhB,aAAa;CAC5CI,SAAStB;CACTuB,QAAQ3B;CACR4B,QAAQ9B;CACR+B,SAASjC;CACTkC,OAAOnC;CACPoC,MAAMlC;CACNmC,MAAMjC;CACNkC,MAAMhC;CACNiC,OAAOhC;CACPiC,aAAahC;AACf,CAAC"}

package/dist/components/content/Layout/Layout.d.ts

@@ -1,9 +1,8 @@
 
 import { BaseProps, BlockStyleProps, ColorStyleProps, FlowStyleProps, OuterStyleProps, Styles } from "@tenphi/tasty";
 import { ForwardedRef, HTMLAttributes, ReactNode } from "react";
-
 //#region src/components/content/Layout/Layout.d.ts
-interface CubeLayoutProps extends BaseProps, OuterStyleProps, BlockStyleProps, ColorStyleProps, FlowStyleProps {
+export interface CubeLayoutProps extends BaseProps, OuterStyleProps, BlockStyleProps, ColorStyleProps, FlowStyleProps {
   /** Switch to grid display mode */
   isGrid?: boolean;
   /** Grid template columns (when isGrid=true) */
@@ -36,5 +35,4 @@ interface CubeLayoutProps extends BaseProps, OuterStyleProps, BlockStyleProps, C
   doNotOverflow?: boolean;
 }
 //#endregion
-export { CubeLayoutProps };
 //# sourceMappingURL=Layout.d.ts.map

package/dist/components/content/Layout/Layout.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.197.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.198.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { isDevEnv } from "../../../utils/is-dev-env.js";
@@ -9,7 +9,6 @@ import { INNER_STYLES, OUTER_STYLES, filterBaseProps, mergeStyles, tasty } from
 import { forwardRef, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useResizeObserver } from "@react-aria/utils";
-
 //#region src/components/content/Layout/Layout.tsx
 const LayoutElement = tasty({
 	as: "div",
@@ -116,17 +115,26 @@ function LayoutInner(props) {
 		});
 		return () => cancelAnimationFrame(frameId);
 	}, [markReady]);
+	const hasBox = (layoutState?.containerWidth ?? 0) > 0 || (layoutState?.containerHeight ?? 0) > 0;
+	const isHeightCheckedRef = useRef(false);
+	const isCollapseCheckedRef = useRef(false);
 	useEffect(() => {
-		if (isReady && localRef.current && localRef.current.offsetHeight === 0) setIsAutoHeight(true);
-	}, [isReady]);
+		const element = localRef.current;
+		if (!isReady || !element || isHeightCheckedRef.current) return;
+		if (!isShown(element)) return;
+		isHeightCheckedRef.current = true;
+		if (element.offsetHeight === 0) setIsAutoHeight(true);
+	}, [isReady, hasBox]);
 	useEffect(() => {
-		if (isAutoHeight && localRef.current) {
-			const frameId_0 = requestAnimationFrame(() => {
-				if (localRef.current && localRef.current.offsetHeight === 0) setIsCollapsed(true);
-			});
-			return () => cancelAnimationFrame(frameId_0);
-		}
-	}, [isAutoHeight]);
+		if (!isAutoHeight || isCollapseCheckedRef.current) return;
+		const frameId_0 = requestAnimationFrame(() => {
+			const element_0 = localRef.current;
+			if (!element_0 || !isShown(element_0)) return;
+			isCollapseCheckedRef.current = true;
+			if (element_0.offsetHeight === 0) setIsCollapsed(true);
+		});
+		return () => cancelAnimationFrame(frameId_0);
+	}, [isAutoHeight, hasBox]);
 	const transitionStyle = { ...useMemo(() => {
 		const baseStyle = {
 			"--inset-top": `${panelSizes.top}px`,
@@ -165,10 +173,10 @@ function LayoutInner(props) {
 		isVertical,
 		doNotOverflow
 	]);
-	const setRefs = (element) => {
-		localRef.current = element;
-		if (typeof forwardedRef === "function") forwardedRef(element);
-		else if (forwardedRef) forwardedRef.current = element;
+	const setRefs = (element_1) => {
+		localRef.current = element_1;
+		if (typeof forwardedRef === "function") forwardedRef(element_1);
+		else if (forwardedRef) forwardedRef.current = element_1;
 	};
 	const showDevWarning = isCollapsed && (_forceShowDevWarning || isDevEnv());
 	const handleInnerFocus = useCallback((e) => {
@@ -224,6 +232,9 @@ function LayoutInner(props) {
 		]
 	});
 }
+function isShown(element) {
+	return element.checkVisibility?.() ?? true;
+}
 /**
 * Layout component provides a vertical flex layout with overflow-safe content.
 * Uses a two-element architecture (wrapper + content) to ensure content never overflows.
@@ -270,7 +281,7 @@ function Layout(props, ref) {
 }
 const _Layout = forwardRef(Layout);
 _Layout.displayName = "Layout";
-
 //#endregion
-export { _Layout };
+export { _Layout as Layout };
+
 //# sourceMappingURL=Layout.js.map

package/dist/components/content/Layout/Layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.js","names":["useResizeObserver","BaseProps","BlockStyleProps","ColorStyleProps","filterBaseProps","FlowStyleProps","INNER_STYLES","mergeStyles","OUTER_STYLES","OuterStyleProps","Styles","tasty","CSSProperties","FocusEvent","ForwardedRef","forwardRef","HTMLAttributes","KeyboardEvent","ReactNode","useCallback","useContext","useEffect","useMemo","useRef","useState","isDevEnv","useCombinedRefs","extractStyles","Alert","LayoutNestedContext","LayoutPanelTransitionContext","LayoutProvider","useLayoutActionsContext","useLayoutRefsContext","useLayoutStateContext","LayoutElement","as","qa","styles","position","display","overflow","flexGrow","placeSelf","height","collapsed","vertical","Inner","$","container","inset","flow","placeContent","placeItems","transition","DEV_WARNING_STYLES","zIndex","CubeLayoutProps","isGrid","columns","rows","template","contentPadding","hasTransition","minContentSize","children","innerRef","HTMLDivElement","innerProps","_forceShowDevWarning","doNotOverflow","LayoutInner","props","forwardedRef","layoutActions","layoutState","layoutRefs","localRef","isAutoHeight","setIsAutoHeight","isCollapsed","setIsCollapsed","style","innerRefProp","otherProps","combinedInnerRef","updateContainerSize","ref","box","onResize","current","offsetWidth","offsetHeight","outerStyles","innerStyles","isVertical","flowFromProp","flowFromStyles","Record","flowValue","startsWith","finalStyles","gridStyles","gridColumns","gridRows","gridTemplate","panelSizes","left","top","right","bottom","isDragging","isReady","markReady","dismissOverlayPanels","hasOverlayPanels","isClippingPanels","frameId","requestAnimationFrame","cancelAnimationFrame","insetStyle","baseStyle","transitionStyle","overflowX","overflowY","overflowInline","overflowBlock","overflowClipMargin","mods","dragging","setRefs","element","showDevWarning","handleInnerFocus","e","inner","currentTarget","contains","target","Node","relatedTarget","handleKeyDown","key","preventDefault","stopPropagation","eventProps","undefined","setPanelContainer","Layout","_c","isInRegion","isInLayout","t0","t1","t2","t3","_Layout","displayName"],"sources":["../../../../src/components/content/Layout/Layout.tsx"],"sourcesContent":["import { useResizeObserver } from '@react-aria/utils';\nimport {\n  BaseProps,\n  BlockStyleProps,\n  ColorStyleProps,\n  filterBaseProps,\n  FlowStyleProps,\n  INNER_STYLES,\n  mergeStyles,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  CSSProperties,\n  FocusEvent,\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  KeyboardEvent,\n  ReactNode,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport { isDevEnv } from '../../../utils/is-dev-env';\nimport { useCombinedRefs } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { Alert } from '../Alert';\n\nimport {\n  LayoutNestedContext,\n  LayoutPanelTransitionContext,\n  LayoutProvider,\n  useLayoutActionsContext,\n  useLayoutRefsContext,\n  useLayoutStateContext,\n} from './LayoutContext';\n\nconst LayoutElement = tasty({\n  as: 'div',\n  qa: 'Layout',\n  styles: {\n    position: 'relative',\n    display: 'block',\n    overflow: {\n      '': 'visible',\n      'do-not-overflow': 'hidden',\n    },\n    flexGrow: 1,\n    placeSelf: 'stretch',\n    height: {\n      '': 'auto',\n      'auto-height': 'fixed 100%',\n      collapsed: '6x',\n    },\n\n    '$content-padding': '1x',\n    // Auto-border size for sub-components (set when layout is vertical)\n    '$layout-border-size': {\n      '': '0',\n      vertical: '1bw',\n    },\n\n    Inner: {\n      // .base-class[data-hover] > [data-element=\"Inner\"] { ...}\n      // Direct child selector required for nested layouts\n      $: '>',\n      container: 'layout / inline-size',\n      position: 'absolute',\n      inset: '$inset-top $inset-right $inset-bottom $inset-left',\n      display: 'flex',\n      flow: 'column',\n      placeContent: 'stretch',\n      placeItems: 'stretch',\n      // Disable transition during panel resize for snappy feedback\n      // Also disable transition when not ready to prevent initial animation\n      // Only animate when has-transition is enabled (and not dragging/not-ready)\n      transition: {\n        '': 'none',\n        'has-transition': 'inset $transition ease-out',\n        'dragging | not-ready': 'none',\n      },\n    },\n  },\n});\n\n// The collapse warning sits on top of `Inner` rather than in place of it.\n// `Inner` is absolutely positioned, so an in-flow sibling would paint beneath\n// it; match its box and take the layer above.\nconst DEV_WARNING_STYLES: Styles = {\n  position: 'absolute',\n  inset: '0',\n  zIndex: 1,\n  overflow: 'auto',\n};\n\nexport interface CubeLayoutProps\n  extends BaseProps,\n    OuterStyleProps,\n    BlockStyleProps,\n    ColorStyleProps,\n    FlowStyleProps {\n  /** Switch to grid display mode */\n  isGrid?: boolean;\n  /** Grid template columns (when isGrid=true) */\n  columns?: Styles['gridColumns'];\n  /** Grid template rows (when isGrid=true) */\n  rows?: Styles['gridRows'];\n  /** Grid template shorthand */\n  template?: Styles['gridTemplate'];\n  /** Padding for content areas (Layout.Content components). Default: '1x' */\n  contentPadding?: Styles['padding'];\n  /** Enable transition animation for Inner content when panels open/close */\n  hasTransition?: boolean;\n  /** Minimum size reserved for the content area between panels. Default: 320 */\n  minContentSize?: number;\n  /** Styles for wrapper and Inner sub-element */\n  styles?: Styles;\n  children?: ReactNode;\n  /** Ref for the inner content element */\n  innerRef?: ForwardedRef<HTMLDivElement>;\n  /** Props to spread on the Inner sub-element */\n  innerProps?: HTMLAttributes<HTMLDivElement>;\n  /**\n   * @internal Force show dev warning even in production (for storybook testing)\n   */\n  _forceShowDevWarning?: boolean;\n  /**\n   * When true, applies overflow: hidden to the root element.\n   * By default, overflow is visible.\n   */\n  doNotOverflow?: boolean;\n}\n\nfunction LayoutInner(\n  props: CubeLayoutProps & { forwardedRef?: ForwardedRef<HTMLDivElement> },\n) {\n  const layoutActions = useLayoutActionsContext();\n  const layoutState = useLayoutStateContext();\n  const layoutRefs = useLayoutRefsContext();\n  const localRef = useRef<HTMLDivElement>(null);\n  const [isAutoHeight, setIsAutoHeight] = useState(false);\n  const [isCollapsed, setIsCollapsed] = useState(false);\n\n  const {\n    isGrid,\n    columns,\n    rows,\n    template,\n    contentPadding,\n    hasTransition = false,\n    minContentSize,\n    styles,\n    children,\n    style,\n    forwardedRef,\n    innerRef: innerRefProp,\n    innerProps,\n    _forceShowDevWarning,\n    doNotOverflow,\n    ...otherProps\n  } = props;\n\n  const combinedInnerRef = useCombinedRefs(innerRefProp);\n  const updateContainerSize = layoutActions?.updateContainerSize;\n\n  useResizeObserver({\n    ref: localRef,\n    box: 'border-box',\n    onResize: useCallback(() => {\n      if (localRef.current) {\n        updateContainerSize?.(\n          localRef.current.offsetWidth,\n          localRef.current.offsetHeight,\n        );\n      }\n    }, [updateContainerSize]),\n  });\n\n  // Extract outer wrapper styles and inner content styles\n  const outerStyles = extractStyles(otherProps, OUTER_STYLES);\n  const innerStyles = extractStyles(otherProps, INNER_STYLES);\n\n  // Calculate if the layout flow is vertical (for auto-border feature)\n  // Default flow is 'column' (vertical), only horizontal when explicitly set to 'row'\n  const isVertical = useMemo(() => {\n    const flowFromProp = innerStyles?.flow;\n    const flowFromStyles = (styles?.Inner as Record<string, unknown>)?.flow;\n    const flowValue = flowFromProp ?? flowFromStyles;\n\n    return typeof flowValue !== 'string' || !flowValue.startsWith('row');\n  }, [innerStyles?.flow, styles?.Inner]);\n\n  // Merge styles using the same pattern as LayoutPane\n  const finalStyles = useMemo(() => {\n    // Handle grid mode and grid properties\n    const gridStyles: Styles = {};\n\n    if (isGrid) {\n      gridStyles.display = 'grid';\n    }\n\n    if (columns) {\n      gridStyles.gridColumns = columns;\n    }\n\n    if (rows) {\n      gridStyles.gridRows = rows;\n    }\n\n    if (template) {\n      gridStyles.gridTemplate = template;\n    }\n\n    return mergeStyles(\n      outerStyles,\n      contentPadding != null ? { '$content-padding': contentPadding } : null,\n      styles,\n      { Inner: mergeStyles(innerStyles, gridStyles, styles?.Inner as Styles) },\n    );\n  }, [\n    outerStyles,\n    innerStyles,\n    contentPadding,\n    styles,\n    isGrid,\n    columns,\n    rows,\n    template,\n  ]);\n\n  // Calculate inset values from panel sizes\n  const panelSizes = layoutState?.panelSizes ?? {\n    left: 0,\n    top: 0,\n    right: 0,\n    bottom: 0,\n  };\n\n  const isDragging = layoutState?.isDragging ?? false;\n  const isReady = layoutState?.isReady ?? true;\n  const markReady = layoutActions?.markReady;\n  const dismissOverlayPanels = layoutActions?.dismissOverlayPanels;\n  const hasOverlayPanels = layoutState?.hasOverlayPanels ?? false;\n  const isClippingPanels =\n    useContext(LayoutPanelTransitionContext)?.isClippingPanels ?? false;\n\n  // Mark layout as ready after first paint\n  // Using useEffect + requestAnimationFrame ensures:\n  // 1. Panels register in useLayoutEffect → correct insets before first paint\n  // 2. First paint with not-ready=true (transition disabled)\n  // 3. After paint completes → enables transitions for subsequent changes\n  useEffect(() => {\n    const frameId = requestAnimationFrame(() => {\n      markReady?.();\n    });\n\n    return () => cancelAnimationFrame(frameId);\n  }, [markReady]);\n\n  // Auto-height detection: if layout collapses to 0 height after initialization,\n  // automatically set height to 100% to prevent invisible layout\n  useEffect(() => {\n    if (isReady && localRef.current && localRef.current.offsetHeight === 0) {\n      setIsAutoHeight(true);\n    }\n  }, [isReady]);\n\n  // Second check: if still 0 height after auto-height was applied,\n  // show collapsed state with warning\n  useEffect(() => {\n    if (isAutoHeight && localRef.current) {\n      // Use requestAnimationFrame to check after styles have been applied\n      const frameId = requestAnimationFrame(() => {\n        if (localRef.current && localRef.current.offsetHeight === 0) {\n          setIsCollapsed(true);\n        }\n      });\n\n      return () => cancelAnimationFrame(frameId);\n    }\n  }, [isAutoHeight]);\n\n  const insetStyle = useMemo(() => {\n    const baseStyle: Record<string, string> = {\n      '--inset-top': `${panelSizes.top}px`,\n      '--inset-right': `${panelSizes.right}px`,\n      '--inset-bottom': `${panelSizes.bottom}px`,\n      '--inset-left': `${panelSizes.left}px`,\n    };\n\n    if (style) {\n      return { ...baseStyle, ...style } as CSSProperties;\n    }\n\n    return baseStyle as CSSProperties;\n  }, [panelSizes, style]);\n\n  // Remove consumer longhands while clipping so they cannot override the shorthand.\n  // Restoring the original style object also restores the latest consumer values.\n  const transitionStyle = { ...insetStyle };\n  if (isClippingPanels) {\n    delete transitionStyle.overflowX;\n    delete transitionStyle.overflowY;\n    delete transitionStyle.overflowInline;\n    delete transitionStyle.overflowBlock;\n    transitionStyle.overflow = 'clip';\n    transitionStyle.overflowClipMargin = '0px';\n  }\n\n  const mods = useMemo(\n    () => ({\n      dragging: isDragging,\n      'not-ready': !isReady,\n      'has-transition': hasTransition,\n      'auto-height': isAutoHeight && !isCollapsed,\n      collapsed: isCollapsed,\n      vertical: isVertical,\n      'do-not-overflow': doNotOverflow,\n    }),\n    [\n      isDragging,\n      isReady,\n      hasTransition,\n      isAutoHeight,\n      isCollapsed,\n      isVertical,\n      doNotOverflow,\n    ],\n  );\n\n  // Combine local ref with forwarded ref\n  const setRefs = (element: HTMLDivElement | null) => {\n    localRef.current = element;\n\n    if (typeof forwardedRef === 'function') {\n      forwardedRef(element);\n    } else if (forwardedRef) {\n      forwardedRef.current = element;\n    }\n  };\n\n  // Show dev warning when collapsed and in dev mode (or forced for stories)\n  const showDevWarning = isCollapsed && (_forceShowDevWarning || isDevEnv());\n\n  // Handle focus entering the Inner element - dismiss overlay panels\n  const handleInnerFocus = useCallback(\n    (e: FocusEvent<HTMLDivElement>) => {\n      // Only dismiss if there are overlay panels\n      if (!hasOverlayPanels) return;\n\n      const inner = e.currentTarget;\n\n      // Panels portal out of Inner but stay its React children, so focus inside\n      // a panel (or a popover opened from it) bubbles here too. Only focus that\n      // lands in Inner's own DOM, the main content, can dismiss.\n      if (!inner.contains(e.target as Node)) return;\n\n      // Check if focus is coming from outside the Inner element\n      const relatedTarget = e.relatedTarget as Node | null;\n\n      // If relatedTarget is null or not inside the Inner element,\n      // focus is entering from outside - dismiss overlay panels\n      if (!relatedTarget || !inner.contains(relatedTarget)) {\n        dismissOverlayPanels?.();\n      }\n    },\n    [hasOverlayPanels, dismissOverlayPanels],\n  );\n\n  // Handle Escape key anywhere in the Layout - dismiss overlay panels\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent) => {\n      if (hasOverlayPanels && e.key === 'Escape') {\n        e.preventDefault();\n        e.stopPropagation();\n        dismissOverlayPanels?.();\n      }\n    },\n    [hasOverlayPanels, dismissOverlayPanels],\n  );\n\n  return (\n    <LayoutElement\n      ref={setRefs}\n      {...filterBaseProps(otherProps, { eventProps: true })}\n      mods={mods}\n      styles={finalStyles}\n      style={transitionStyle}\n      onKeyDown={hasOverlayPanels ? handleKeyDown : undefined}\n    >\n      {/* All children go inside the Inner element - panels will portal themselves out */}\n      <div\n        ref={combinedInnerRef}\n        data-element=\"Inner\"\n        onFocus={handleInnerFocus}\n        {...innerProps}\n      >\n        {children}\n      </div>\n      {/* Container for panels to portal into - rendered after Inner so panels paint on top via DOM order */}\n      <div ref={layoutRefs?.setPanelContainer} data-element=\"PanelContainer\" />\n      {/* Overlaid, never substituted for `children`. A zero-height measurement is\n          not proof of a mistake - a hidden tab, a collapsed accordion and a\n          container mid-animation all measure zero - so unmounting the subtree\n          would turn a wrong guess into an outage, and remounting it on the way\n          back would drop whatever state it held. */}\n      {showDevWarning ? (\n        <Alert theme=\"danger\" styles={DEV_WARNING_STYLES}>\n          <b>UIKit:</b> <b>&lt;Layout/&gt;</b> has collapsed to <b>0</b> height.\n          Ensure the parent container has a defined height or use the{' '}\n          <b>height</b> prop on <b>&lt;Layout/&gt;</b>.\n        </Alert>\n      ) : null}\n    </LayoutElement>\n  );\n}\n\n/**\n * Layout component provides a vertical flex layout with overflow-safe content.\n * Uses a two-element architecture (wrapper + content) to ensure content never overflows.\n */\nfunction Layout(props: CubeLayoutProps, ref: ForwardedRef<HTMLDivElement>) {\n  const { hasTransition, minContentSize } = props;\n  // Nested inside one of another Layout's regions, or placed straight inside\n  // another Layout: either way its footer is not the page's.\n  const isInRegion = useContext(LayoutNestedContext);\n  const isInLayout = useLayoutStateContext() != null;\n\n  return (\n    <LayoutNestedContext.Provider value={isInRegion || isInLayout}>\n      <LayoutProvider\n        hasTransition={hasTransition}\n        minContentSize={minContentSize}\n      >\n        <LayoutInner {...props} forwardedRef={ref} />\n      </LayoutProvider>\n    </LayoutNestedContext.Provider>\n  );\n}\n\nconst _Layout = forwardRef(Layout);\n\n_Layout.displayName = 'Layout';\n\nexport { _Layout as Layout };\n"],"mappings":"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"}
+{"version":3,"file":"Layout.js","names":["useResizeObserver","BaseProps","BlockStyleProps","ColorStyleProps","filterBaseProps","FlowStyleProps","INNER_STYLES","mergeStyles","OUTER_STYLES","OuterStyleProps","Styles","tasty","CSSProperties","FocusEvent","ForwardedRef","forwardRef","HTMLAttributes","KeyboardEvent","ReactNode","useCallback","useContext","useEffect","useMemo","useRef","useState","isDevEnv","useCombinedRefs","extractStyles","Alert","LayoutNestedContext","LayoutPanelTransitionContext","LayoutProvider","useLayoutActionsContext","useLayoutRefsContext","useLayoutStateContext","LayoutElement","as","qa","styles","position","display","overflow","flexGrow","placeSelf","height","collapsed","vertical","Inner","$","container","inset","flow","placeContent","placeItems","transition","DEV_WARNING_STYLES","zIndex","CubeLayoutProps","isGrid","columns","rows","template","contentPadding","hasTransition","minContentSize","children","innerRef","HTMLDivElement","innerProps","_forceShowDevWarning","doNotOverflow","LayoutInner","props","forwardedRef","layoutActions","layoutState","layoutRefs","localRef","isAutoHeight","setIsAutoHeight","isCollapsed","setIsCollapsed","style","innerRefProp","otherProps","combinedInnerRef","updateContainerSize","ref","box","onResize","current","offsetWidth","offsetHeight","outerStyles","innerStyles","isVertical","flowFromProp","flowFromStyles","Record","flowValue","startsWith","finalStyles","gridStyles","gridColumns","gridRows","gridTemplate","panelSizes","left","top","right","bottom","isDragging","isReady","markReady","dismissOverlayPanels","hasOverlayPanels","isClippingPanels","frameId","requestAnimationFrame","cancelAnimationFrame","hasBox","containerWidth","containerHeight","isHeightCheckedRef","isCollapseCheckedRef","element","isShown","insetStyle","baseStyle","transitionStyle","overflowX","overflowY","overflowInline","overflowBlock","overflowClipMargin","mods","dragging","setRefs","showDevWarning","handleInnerFocus","e","inner","currentTarget","contains","target","Node","relatedTarget","handleKeyDown","key","preventDefault","stopPropagation","eventProps","undefined","setPanelContainer","HTMLElement","checkVisibility","Layout","_c","isInRegion","isInLayout","t0","t1","t2","t3","_Layout","displayName","_c"],"sources":["../../../../src/components/content/Layout/Layout.tsx"],"sourcesContent":["import { useResizeObserver } from '@react-aria/utils';\nimport {\n  BaseProps,\n  BlockStyleProps,\n  ColorStyleProps,\n  filterBaseProps,\n  FlowStyleProps,\n  INNER_STYLES,\n  mergeStyles,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  CSSProperties,\n  FocusEvent,\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  KeyboardEvent,\n  ReactNode,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport { isDevEnv } from '../../../utils/is-dev-env';\nimport { useCombinedRefs } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { Alert } from '../Alert';\n\nimport {\n  LayoutNestedContext,\n  LayoutPanelTransitionContext,\n  LayoutProvider,\n  useLayoutActionsContext,\n  useLayoutRefsContext,\n  useLayoutStateContext,\n} from './LayoutContext';\n\nconst LayoutElement = tasty({\n  as: 'div',\n  qa: 'Layout',\n  styles: {\n    position: 'relative',\n    display: 'block',\n    overflow: {\n      '': 'visible',\n      'do-not-overflow': 'hidden',\n    },\n    flexGrow: 1,\n    placeSelf: 'stretch',\n    height: {\n      '': 'auto',\n      'auto-height': 'fixed 100%',\n      collapsed: '6x',\n    },\n\n    '$content-padding': '1x',\n    // Auto-border size for sub-components (set when layout is vertical)\n    '$layout-border-size': {\n      '': '0',\n      vertical: '1bw',\n    },\n\n    Inner: {\n      // .base-class[data-hover] > [data-element=\"Inner\"] { ...}\n      // Direct child selector required for nested layouts\n      $: '>',\n      container: 'layout / inline-size',\n      position: 'absolute',\n      inset: '$inset-top $inset-right $inset-bottom $inset-left',\n      display: 'flex',\n      flow: 'column',\n      placeContent: 'stretch',\n      placeItems: 'stretch',\n      // Disable transition during panel resize for snappy feedback\n      // Also disable transition when not ready to prevent initial animation\n      // Only animate when has-transition is enabled (and not dragging/not-ready)\n      transition: {\n        '': 'none',\n        'has-transition': 'inset $transition ease-out',\n        'dragging | not-ready': 'none',\n      },\n    },\n  },\n});\n\n// The collapse warning sits on top of `Inner` rather than in place of it.\n// `Inner` is absolutely positioned, so an in-flow sibling would paint beneath\n// it; match its box and take the layer above.\nconst DEV_WARNING_STYLES: Styles = {\n  position: 'absolute',\n  inset: '0',\n  zIndex: 1,\n  overflow: 'auto',\n};\n\nexport interface CubeLayoutProps\n  extends\n    BaseProps,\n    OuterStyleProps,\n    BlockStyleProps,\n    ColorStyleProps,\n    FlowStyleProps {\n  /** Switch to grid display mode */\n  isGrid?: boolean;\n  /** Grid template columns (when isGrid=true) */\n  columns?: Styles['gridColumns'];\n  /** Grid template rows (when isGrid=true) */\n  rows?: Styles['gridRows'];\n  /** Grid template shorthand */\n  template?: Styles['gridTemplate'];\n  /** Padding for content areas (Layout.Content components). Default: '1x' */\n  contentPadding?: Styles['padding'];\n  /** Enable transition animation for Inner content when panels open/close */\n  hasTransition?: boolean;\n  /** Minimum size reserved for the content area between panels. Default: 320 */\n  minContentSize?: number;\n  /** Styles for wrapper and Inner sub-element */\n  styles?: Styles;\n  children?: ReactNode;\n  /** Ref for the inner content element */\n  innerRef?: ForwardedRef<HTMLDivElement>;\n  /** Props to spread on the Inner sub-element */\n  innerProps?: HTMLAttributes<HTMLDivElement>;\n  /**\n   * @internal Force show dev warning even in production (for storybook testing)\n   */\n  _forceShowDevWarning?: boolean;\n  /**\n   * When true, applies overflow: hidden to the root element.\n   * By default, overflow is visible.\n   */\n  doNotOverflow?: boolean;\n}\n\nfunction LayoutInner(\n  props: CubeLayoutProps & { forwardedRef?: ForwardedRef<HTMLDivElement> },\n) {\n  const layoutActions = useLayoutActionsContext();\n  const layoutState = useLayoutStateContext();\n  const layoutRefs = useLayoutRefsContext();\n  const localRef = useRef<HTMLDivElement>(null);\n  const [isAutoHeight, setIsAutoHeight] = useState(false);\n  const [isCollapsed, setIsCollapsed] = useState(false);\n\n  const {\n    isGrid,\n    columns,\n    rows,\n    template,\n    contentPadding,\n    hasTransition = false,\n    minContentSize,\n    styles,\n    children,\n    style,\n    forwardedRef,\n    innerRef: innerRefProp,\n    innerProps,\n    _forceShowDevWarning,\n    doNotOverflow,\n    ...otherProps\n  } = props;\n\n  const combinedInnerRef = useCombinedRefs(innerRefProp);\n  const updateContainerSize = layoutActions?.updateContainerSize;\n\n  useResizeObserver({\n    ref: localRef,\n    box: 'border-box',\n    onResize: useCallback(() => {\n      if (localRef.current) {\n        updateContainerSize?.(\n          localRef.current.offsetWidth,\n          localRef.current.offsetHeight,\n        );\n      }\n    }, [updateContainerSize]),\n  });\n\n  // Extract outer wrapper styles and inner content styles\n  const outerStyles = extractStyles(otherProps, OUTER_STYLES);\n  const innerStyles = extractStyles(otherProps, INNER_STYLES);\n\n  // Calculate if the layout flow is vertical (for auto-border feature)\n  // Default flow is 'column' (vertical), only horizontal when explicitly set to 'row'\n  const isVertical = useMemo(() => {\n    const flowFromProp = innerStyles?.flow;\n    const flowFromStyles = (styles?.Inner as Record<string, unknown>)?.flow;\n    const flowValue = flowFromProp ?? flowFromStyles;\n\n    return typeof flowValue !== 'string' || !flowValue.startsWith('row');\n  }, [innerStyles?.flow, styles?.Inner]);\n\n  // Merge styles using the same pattern as LayoutPane\n  const finalStyles = useMemo(() => {\n    // Handle grid mode and grid properties\n    const gridStyles: Styles = {};\n\n    if (isGrid) {\n      gridStyles.display = 'grid';\n    }\n\n    if (columns) {\n      gridStyles.gridColumns = columns;\n    }\n\n    if (rows) {\n      gridStyles.gridRows = rows;\n    }\n\n    if (template) {\n      gridStyles.gridTemplate = template;\n    }\n\n    return mergeStyles(\n      outerStyles,\n      contentPadding != null ? { '$content-padding': contentPadding } : null,\n      styles,\n      { Inner: mergeStyles(innerStyles, gridStyles, styles?.Inner as Styles) },\n    );\n  }, [\n    outerStyles,\n    innerStyles,\n    contentPadding,\n    styles,\n    isGrid,\n    columns,\n    rows,\n    template,\n  ]);\n\n  // Calculate inset values from panel sizes\n  const panelSizes = layoutState?.panelSizes ?? {\n    left: 0,\n    top: 0,\n    right: 0,\n    bottom: 0,\n  };\n\n  const isDragging = layoutState?.isDragging ?? false;\n  const isReady = layoutState?.isReady ?? true;\n  const markReady = layoutActions?.markReady;\n  const dismissOverlayPanels = layoutActions?.dismissOverlayPanels;\n  const hasOverlayPanels = layoutState?.hasOverlayPanels ?? false;\n  const isClippingPanels =\n    useContext(LayoutPanelTransitionContext)?.isClippingPanels ?? false;\n\n  // Mark layout as ready after first paint\n  // Using useEffect + requestAnimationFrame ensures:\n  // 1. Panels register in useLayoutEffect → correct insets before first paint\n  // 2. First paint with not-ready=true (transition disabled)\n  // 3. After paint completes → enables transitions for subsequent changes\n  useEffect(() => {\n    const frameId = requestAnimationFrame(() => {\n      markReady?.();\n    });\n\n    return () => cancelAnimationFrame(frameId);\n  }, [markReady]);\n\n  // A Layout under a `display: none` ancestor, such as a closed `hideOnClose`\n  // panel, has no height to judge yet. Each check waits until the Layout is\n  // shown, then runs once. Gaining a box re-runs a pending check, so one first\n  // shown at 0×0 is never judged.\n  const hasBox =\n    (layoutState?.containerWidth ?? 0) > 0 ||\n    (layoutState?.containerHeight ?? 0) > 0;\n  const isHeightCheckedRef = useRef(false);\n  const isCollapseCheckedRef = useRef(false);\n\n  // Auto-height detection: if layout collapses to 0 height after initialization,\n  // automatically set height to 100% to prevent invisible layout\n  useEffect(() => {\n    const element = localRef.current;\n\n    if (!isReady || !element || isHeightCheckedRef.current) return;\n    if (!isShown(element)) return;\n\n    isHeightCheckedRef.current = true;\n\n    if (element.offsetHeight === 0) {\n      setIsAutoHeight(true);\n    }\n  }, [isReady, hasBox]);\n\n  // Second check: if still 0 height after auto-height was applied,\n  // show collapsed state with warning\n  useEffect(() => {\n    if (!isAutoHeight || isCollapseCheckedRef.current) return;\n\n    // Use requestAnimationFrame to check after styles have been applied\n    const frameId = requestAnimationFrame(() => {\n      const element = localRef.current;\n\n      if (!element || !isShown(element)) return;\n\n      isCollapseCheckedRef.current = true;\n\n      if (element.offsetHeight === 0) {\n        setIsCollapsed(true);\n      }\n    });\n\n    return () => cancelAnimationFrame(frameId);\n  }, [isAutoHeight, hasBox]);\n\n  const insetStyle = useMemo(() => {\n    const baseStyle: Record<string, string> = {\n      '--inset-top': `${panelSizes.top}px`,\n      '--inset-right': `${panelSizes.right}px`,\n      '--inset-bottom': `${panelSizes.bottom}px`,\n      '--inset-left': `${panelSizes.left}px`,\n    };\n\n    if (style) {\n      return { ...baseStyle, ...style } as CSSProperties;\n    }\n\n    return baseStyle as CSSProperties;\n  }, [panelSizes, style]);\n\n  // Remove consumer longhands while clipping so they cannot override the shorthand.\n  // Restoring the original style object also restores the latest consumer values.\n  const transitionStyle = { ...insetStyle };\n  if (isClippingPanels) {\n    delete transitionStyle.overflowX;\n    delete transitionStyle.overflowY;\n    delete transitionStyle.overflowInline;\n    delete transitionStyle.overflowBlock;\n    transitionStyle.overflow = 'clip';\n    transitionStyle.overflowClipMargin = '0px';\n  }\n\n  const mods = useMemo(\n    () => ({\n      dragging: isDragging,\n      'not-ready': !isReady,\n      'has-transition': hasTransition,\n      'auto-height': isAutoHeight && !isCollapsed,\n      collapsed: isCollapsed,\n      vertical: isVertical,\n      'do-not-overflow': doNotOverflow,\n    }),\n    [\n      isDragging,\n      isReady,\n      hasTransition,\n      isAutoHeight,\n      isCollapsed,\n      isVertical,\n      doNotOverflow,\n    ],\n  );\n\n  // Combine local ref with forwarded ref\n  const setRefs = (element: HTMLDivElement | null) => {\n    localRef.current = element;\n\n    if (typeof forwardedRef === 'function') {\n      forwardedRef(element);\n    } else if (forwardedRef) {\n      forwardedRef.current = element;\n    }\n  };\n\n  // Show dev warning when collapsed and in dev mode (or forced for stories)\n  const showDevWarning = isCollapsed && (_forceShowDevWarning || isDevEnv());\n\n  // Handle focus entering the Inner element - dismiss overlay panels\n  const handleInnerFocus = useCallback(\n    (e: FocusEvent<HTMLDivElement>) => {\n      // Only dismiss if there are overlay panels\n      if (!hasOverlayPanels) return;\n\n      const inner = e.currentTarget;\n\n      // Panels portal out of Inner but stay its React children, so focus inside\n      // a panel (or a popover opened from it) bubbles here too. Only focus that\n      // lands in Inner's own DOM, the main content, can dismiss.\n      if (!inner.contains(e.target as Node)) return;\n\n      // Check if focus is coming from outside the Inner element\n      const relatedTarget = e.relatedTarget as Node | null;\n\n      // If relatedTarget is null or not inside the Inner element,\n      // focus is entering from outside - dismiss overlay panels\n      if (!relatedTarget || !inner.contains(relatedTarget)) {\n        dismissOverlayPanels?.();\n      }\n    },\n    [hasOverlayPanels, dismissOverlayPanels],\n  );\n\n  // Handle Escape key anywhere in the Layout - dismiss overlay panels\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent) => {\n      if (hasOverlayPanels && e.key === 'Escape') {\n        e.preventDefault();\n        e.stopPropagation();\n        dismissOverlayPanels?.();\n      }\n    },\n    [hasOverlayPanels, dismissOverlayPanels],\n  );\n\n  return (\n    <LayoutElement\n      ref={setRefs}\n      {...filterBaseProps(otherProps, { eventProps: true })}\n      mods={mods}\n      styles={finalStyles}\n      style={transitionStyle}\n      onKeyDown={hasOverlayPanels ? handleKeyDown : undefined}\n    >\n      {/* All children go inside the Inner element - panels will portal themselves out */}\n      <div\n        ref={combinedInnerRef}\n        data-element=\"Inner\"\n        onFocus={handleInnerFocus}\n        {...innerProps}\n      >\n        {children}\n      </div>\n      {/* Container for panels to portal into - rendered after Inner so panels paint on top via DOM order */}\n      <div ref={layoutRefs?.setPanelContainer} data-element=\"PanelContainer\" />\n      {/* Overlaid, never substituted for `children`. A zero-height measurement is\n          not proof of a mistake - a collapsed accordion and a container\n          mid-animation both measure zero - so unmounting the subtree\n          would turn a wrong guess into an outage, and remounting it on the way\n          back would drop whatever state it held. */}\n      {showDevWarning ? (\n        <Alert theme=\"danger\" styles={DEV_WARNING_STYLES}>\n          <b>UIKit:</b> <b>&lt;Layout/&gt;</b> has collapsed to <b>0</b> height.\n          Ensure the parent container has a defined height or use the{' '}\n          <b>height</b> prop on <b>&lt;Layout/&gt;</b>.\n        </Alert>\n      ) : null}\n    </LayoutElement>\n  );\n}\n\n// False under a `display: none` ancestor. jsdom has no `checkVisibility`, so\n// there every Layout counts as shown.\nfunction isShown(element: HTMLElement) {\n  return element.checkVisibility?.() ?? true;\n}\n\n/**\n * Layout component provides a vertical flex layout with overflow-safe content.\n * Uses a two-element architecture (wrapper + content) to ensure content never overflows.\n */\nfunction Layout(props: CubeLayoutProps, ref: ForwardedRef<HTMLDivElement>) {\n  const { hasTransition, minContentSize } = props;\n  // Nested inside one of another Layout's regions, or placed straight inside\n  // another Layout: either way its footer is not the page's.\n  const isInRegion = useContext(LayoutNestedContext);\n  const isInLayout = useLayoutStateContext() != null;\n\n  return (\n    <LayoutNestedContext.Provider value={isInRegion || isInLayout}>\n      <LayoutProvider\n        hasTransition={hasTransition}\n        minContentSize={minContentSize}\n      >\n        <LayoutInner {...props} forwardedRef={ref} />\n      </LayoutProvider>\n    </LayoutNestedContext.Provider>\n  );\n}\n\nconst _Layout = forwardRef(Layout);\n\n_Layout.displayName = 'Layout';\n\nexport { _Layout as Layout };\n"],"mappings":"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"}

package/dist/components/content/Layout/LayoutBlock.d.ts

@@ -1,10 +1,8 @@
 
 import { CubeLayoutContentProps } from "./LayoutContent.js";
-import * as react from "react";
-
 //#region src/components/content/Layout/LayoutBlock.d.ts
-interface CubeLayoutBlockProps extends CubeLayoutContentProps {}
-declare const _LayoutBlock: react.ForwardRefExoticComponent<CubeLayoutBlockProps & react.RefAttributes<HTMLDivElement>>;
+export interface CubeLayoutBlockProps extends CubeLayoutContentProps {}
+declare const _LayoutBlock: import("react").ForwardRefExoticComponent<CubeLayoutBlockProps & import("react").RefAttributes<HTMLDivElement>>;
 //#endregion
-export { CubeLayoutBlockProps, _LayoutBlock };
+export { _LayoutBlock as LayoutBlock };
 //# sourceMappingURL=LayoutBlock.d.ts.map

package/dist/components/content/Layout/LayoutBlock.js

@@ -1,10 +1,9 @@
-/** @license MIT | @cube-dev/ui-kit v0.197.0 | Cube Dev Team */
-import { _LayoutContent } from "./LayoutContent.js";
+/** @license MIT | @cube-dev/ui-kit v0.198.0 | Cube Dev Team */
+import { LayoutContent as _LayoutContent } from "./LayoutContent.js";
 import { c } from "react/compiler-runtime";
 import { tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/content/Layout/LayoutBlock.tsx
 const BlockElement = tasty(_LayoutContent, {
 	qa: "LayoutBlock",
@@ -50,7 +49,7 @@ function LayoutBlock(props, ref) {
 }
 const _LayoutBlock = forwardRef(LayoutBlock);
 _LayoutBlock.displayName = "Layout.Block";
-
 //#endregion
-export { _LayoutBlock };
+export { _LayoutBlock as LayoutBlock };
+
 //# sourceMappingURL=LayoutBlock.js.map

package/dist/components/content/Layout/LayoutBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutBlock.js","names":["tasty","ForwardedRef","forwardRef","CubeLayoutContentProps","LayoutContent","BlockElement","qa","styles","container","flexShrink","flexGrow","Inner","display","CubeLayoutBlockProps","LayoutBlock","props","ref","$","_c","children","otherProps","t0","scrollbar","undefined","t1","_LayoutBlock","displayName"],"sources":["../../../../src/components/content/Layout/LayoutBlock.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { ForwardedRef, forwardRef } from 'react';\n\nimport { CubeLayoutContentProps, LayoutContent } from './LayoutContent';\n\nconst BlockElement = tasty(LayoutContent, {\n  qa: 'LayoutBlock',\n  styles: {\n    container: 'none',\n    flexShrink: 0,\n    flexGrow: 0,\n\n    Inner: {\n      display: 'block',\n    },\n  },\n});\n\nexport interface CubeLayoutBlockProps extends CubeLayoutContentProps {}\n\nfunction LayoutBlock(\n  props: CubeLayoutBlockProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { children, scrollbar = 'tiny', ...otherProps } = props;\n\n  return (\n    <BlockElement {...otherProps} ref={ref} scrollbar={scrollbar}>\n      {children}\n    </BlockElement>\n  );\n}\n\nconst _LayoutBlock = forwardRef(LayoutBlock);\n\n_LayoutBlock.displayName = 'Layout.Block';\n\nexport { _LayoutBlock as LayoutBlock };\n"],"mappings":";;;;;;;;AAKA,MAAMK,eAAeL,MAAMI,gBAAe;CACxCE,IAAI;CACJC,QAAQ;EACNC,WAAW;EACXC,YAAY;EACZC,UAAU;EAEVC,OAAO,EACLC,SAAS,SACX;EACF;CACD,CAAC;AAIF,SAAAE,YAAAC,OAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;AAAA,KAAAJ,EAAA,OAAAF,OAAA;AAIE,GAAA,CAAAI,UAAAG,WAAAD,OAAAD,cAAwDL;AAAME,IAAA,KAAAF;AAAAE,IAAA,KAAAE;AAAAF,IAAA,KAAAG;AAAAH,IAAA,KAAAI;QAAA;AAAAF,aAAAF,EAAA;AAAAG,eAAAH,EAAA;AAAAI,OAAAJ,EAAA;;CAA5C,MAAAK,YAAAD,OAAAE,SAAA,SAAAF;CAAkB,IAAAG;AAAA,KAAAP,EAAA,OAAAE,YAAAF,EAAA,OAAAG,cAAAH,EAAA,OAAAD,OAAAC,EAAA,OAAAK,WAAA;AAGlCE,OAAA,oBAAC;GAAY,GAAKJ;GAAiBJ;GAAgBM;GAChDH;IACY;AAAAF,IAAA,KAAAE;AAAAF,IAAA,KAAAG;AAAAH,IAAA,KAAAD;AAAAC,IAAA,KAAAK;AAAAL,IAAA,KAAAO;OAAAA,MAAAP,EAAA;AAAA,QAFfO;;AAMJ,MAAMC,eAAevB,WAAWY,YAAY;AAE5CW,aAAaC,cAAc"}
+{"version":3,"file":"LayoutBlock.js","names":["tasty","ForwardedRef","forwardRef","CubeLayoutContentProps","LayoutContent","BlockElement","qa","styles","container","flexShrink","flexGrow","Inner","display","CubeLayoutBlockProps","LayoutBlock","props","ref","$","_c","children","otherProps","t0","scrollbar","undefined","t1","_LayoutBlock","displayName","LayoutContent","_c"],"sources":["../../../../src/components/content/Layout/LayoutBlock.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { ForwardedRef, forwardRef } from 'react';\n\nimport { CubeLayoutContentProps, LayoutContent } from './LayoutContent';\n\nconst BlockElement = tasty(LayoutContent, {\n  qa: 'LayoutBlock',\n  styles: {\n    container: 'none',\n    flexShrink: 0,\n    flexGrow: 0,\n\n    Inner: {\n      display: 'block',\n    },\n  },\n});\n\nexport interface CubeLayoutBlockProps extends CubeLayoutContentProps {}\n\nfunction LayoutBlock(\n  props: CubeLayoutBlockProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { children, scrollbar = 'tiny', ...otherProps } = props;\n\n  return (\n    <BlockElement {...otherProps} ref={ref} scrollbar={scrollbar}>\n      {children}\n    </BlockElement>\n  );\n}\n\nconst _LayoutBlock = forwardRef(LayoutBlock);\n\n_LayoutBlock.displayName = 'Layout.Block';\n\nexport { _LayoutBlock as LayoutBlock };\n"],"mappings":";;;;;;;AAKA,MAAMK,eAAeL,MAAMI,gBAAe;CACxCE,IAAI;CACJC,QAAQ;EACNC,WAAW;EACXC,YAAY;EACZC,UAAU;EAEVC,OAAO,EACLC,SAAS,QACX;CACF;AACF,CAAC;AAID,SAAAE,YAAAC,OAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAJ,EAAA,OAAAF,OAAA;EAIE,CAAA,CAAAI,UAAAG,WAAAD,IAAA,GAAAD,cAAwDL;EAAME,EAAA,KAAAF;EAAAE,EAAA,KAAAE;EAAAF,EAAA,KAAAG;EAAAH,EAAA,KAAAI;CAAA,OAAA;EAAAF,WAAAF,EAAA;EAAAG,aAAAH,EAAA;EAAAI,KAAAJ,EAAA;CAAA;CAA5C,MAAAK,YAAAD,OAAAE,KAAAA,IAAA,SAAAF;CAAkB,IAAAG;CAAA,IAAAP,EAAA,OAAAE,YAAAF,EAAA,OAAAG,cAAAH,EAAA,OAAAD,OAAAC,EAAA,OAAAK,WAAA;EAGlCE,KAAA,oBAAC,cAAD;GAAa,GAAKJ;GAAiBJ;GAAgBM;GAChDH;EADU,CAAA;EAEEF,EAAA,KAAAE;EAAAF,EAAA,KAAAG;EAAAH,EAAA,KAAAD;EAAAC,EAAA,KAAAK;EAAAL,EAAA,KAAAO;CAAA,OAAAA,KAAAP,EAAA;CAAA,OAFfO;AAEe;AAInB,MAAMC,eAAevB,WAAWY,WAAW;AAE3CW,aAAaC,cAAc"}

package/dist/components/content/Layout/LayoutCenter.d.ts

@@ -1,9 +1,7 @@
 
 import { CubeLayoutContainerProps } from "./LayoutContainer.js";
-import * as react from "react";
-
 //#region src/components/content/Layout/LayoutCenter.d.ts
-interface CubeLayoutCenterProps extends CubeLayoutContainerProps {
+export interface CubeLayoutCenterProps extends CubeLayoutContainerProps {
   /**
    * Position content slightly above the visual center using the golden ratio
    * (~38.2% empty space above, ~61.8% below) for a more aesthetically pleasing
@@ -14,7 +12,7 @@ interface CubeLayoutCenterProps extends CubeLayoutContainerProps {
    */
   isGoldenRatio?: boolean;
 }
-declare const _LayoutCenter: react.ForwardRefExoticComponent<CubeLayoutCenterProps & react.RefAttributes<HTMLDivElement>>;
+declare const _LayoutCenter: import("react").ForwardRefExoticComponent<CubeLayoutCenterProps & import("react").RefAttributes<HTMLDivElement>>;
 //#endregion
-export { CubeLayoutCenterProps, _LayoutCenter };
+export { _LayoutCenter as LayoutCenter };
 //# sourceMappingURL=LayoutCenter.d.ts.map