@cube-dev/ui-kit 0.121.5 → 0.121.6

package/docs/components/layout/Flow.md

@@ -21,6 +21,17 @@ No component-specific props. Use style props directly.
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ```jsx

package/docs/components/layout/Grid.md

@@ -24,6 +24,17 @@ A CSS Grid layout container. Arranges children in a grid with configurable colum
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ### Two columns

package/docs/components/layout/Panel.md

@@ -37,6 +37,17 @@ A section container with optional stretched, floating, or card styling. Renders
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ### Basic panel

package/docs/components/layout/Prefix.md

@@ -25,6 +25,17 @@ An absolutely positioned prefix slot, typically used inside input-like component
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ```jsx

package/docs/components/layout/ResizablePanel.md

@@ -23,11 +23,28 @@ A `Panel` with a draggable resize handle. Users can adjust the panel size by dra
 - **`maxSize`** `string | number` (default: `'min(50%, 400px)'` for uncontrolled) — Maximum size constraint
 - **`isDisabled`** `boolean` — Disable resizing
 - **`handlerStyles`** `Styles` — Custom styles for the resize handle
+- **`isStretched`** `boolean` — Position the panel absolutely to fill its container
+- **`isCard`** `boolean` — Apply card styling with border and rounded corners
+- **`isFloating`** `boolean` — Position the panel as a floating overlay
+- **`innerStyles`** `Styles` — Custom styles for the panel's inner content element
+- **`isFlex`** `boolean` — Use flex layout instead of grid for the inner content
+- **`extra`** `ReactNode` — Additional content rendered outside the inner element (e.g., overlays)
 
 ### Base Properties
 
 Extends [Panel](#) and supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ### Resizable sidebar

package/docs/components/layout/Space.md

@@ -23,6 +23,17 @@ A flex container that adds consistent gap between children. Supports horizontal
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ### Horizontal (default)

package/docs/components/layout/Suffix.md

@@ -25,6 +25,17 @@ An absolutely positioned suffix slot, typically used inside input-like component
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ```jsx

package/docs/components/navigation/Tabs.md

@@ -44,6 +44,7 @@ An accessible tabbed interface for organizing content into multiple panels, show
 - **`showScrollArrows`** `boolean | 'auto'` (default: `false`) — Show scroll navigation arrows
 - **`tabPickerPosition`** `'prefix' | 'suffix'` (default: `suffix`) — Position of the tab picker
 - **`scrollArrowsPosition`** `'prefix' | 'suffix'` (default: `suffix`) — Position of the scroll arrows
+- **`tabListPadding`** `string` — Inline padding for the tab list container (e.g., `"2x"`)
 - **`tabListStyles`** `Styles` — Custom styles for the tab list container
 - **`prefixStyles`** `Styles` — Custom styles for the prefix slot
 - **`suffixStyles`** `Styles` — Custom styles for the suffix slot
@@ -69,7 +70,11 @@ Customizes the root element of the Tabs component.
 
 ### Style Properties
 
-These properties allow direct style application without using the `styles` prop: `width`, `height`.
+These properties allow direct style application without using the `styles` prop:
+
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`
 
 ### Modifiers
 

package/docs/components/organisms/FileTabs.md

@@ -28,6 +28,18 @@ A tab bar for file-like items with close buttons and dirty state indicators. Des
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Text:** `textTransform`, `fontWeight`, `fontStyle`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ```jsx

package/docs/components/organisms/StatsCard.md

@@ -29,6 +29,17 @@ Extends Card with:
 
 Extends [Card](../content/Card.md) and supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ```jsx

package/docs/components/other/CloudLogo.md

@@ -24,6 +24,18 @@ Extends [Button](../actions/Button.md) props (`onPress`, `to`, `href`, etc.).
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Text:** `textTransform`, `fontWeight`, `fontStyle`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ```jsx

package/docs/components/overlays/AlertDialog.md

@@ -18,11 +18,27 @@ A modal dialog for important messages that require user acknowledgment. Extends
   - `confirm` — Confirm button props or `false` to hide (default: `{ label: 'Ok', type: 'primary' }`)
   - `cancel` — Cancel button props or `true` to show (default: hidden, uses `{ label: 'Cancel' }`)
   - `secondary` — Optional secondary button props
+- **`size`** `'S' | 'M' | 'L' | 'small' | 'medium' | 'large'` — The size of the dialog
+- **`isDismissable`** `boolean` (default: `false`) — Whether the dialog is dismissable
+- **`closeIcon`** `ReactElement` — Custom close icon element
+- **`closeButtonStyles`** `Styles` — Custom styles for the close button
 
 ### Base Properties
 
 Extends [Dialog](./Dialog.md) and supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Text:** `textTransform`, `fontWeight`, `fontStyle`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ### Confirmation dialog

package/docs/components/overlays/Dialog.md

@@ -24,8 +24,6 @@ Dialogs are windows containing contextual information, tasks, or workflows that
 - **`onDismiss`** `function` — Callback fired when the dialog is dismissed
 - **`closeIcon`** — Custom close icon element
 - **`role`** `'dialog' | 'alertdialog'` (default: `dialog`) — ARIA role for the dialog
-- **`onBlur`** `function` — Callback fired when the dialog loses focus
-- **`onFocus`** `function` — Callback fired when the dialog receives focus
 
 ### Base Properties
 
@@ -49,7 +47,12 @@ Customizes the close button appearance.
 
 ### Style Properties
 
-These properties allow direct style application without using the `styles` prop: `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`, `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`, `reset`, `padding`, `paddingInline`, `paddingBlock`, `shadow`, `border`, `radius`, `opacity`, `overflow`, `scrollbar`, `hide`, `outline`, `textAlign`, `resize`.
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
 
 ### Modifiers
 

package/docs/components/overlays/DialogContainer.md

@@ -32,6 +32,15 @@ Supports [Base properties](../../BaseProperties.md)
 
 DialogContainer has no styling capabilities.
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Variants
 
 ### Types

package/docs/components/overlays/DialogForm.md

@@ -23,27 +23,40 @@ DialogForm combines [Dialog](./Dialog.md) and [Form](../form/Form.md) functional
 - **`cancelProps`** `CubeButtonProps` — Properties for cancel button (use `label` to change text)
 - **`preserve`** `boolean` (default: `false`) — Preserve form values after submission/dismissal
 - **`noActions`** `boolean` — Hide default action buttons to manually specify them
+- **`size`** `'S' | 'M' | 'L' | 'small' | 'medium' | 'large'` — The size of the dialog
+- **`isDismissable`** `boolean` — Whether the dialog is dismissable
+- **`closeIcon`** `ReactElement` — Custom close icon element
+- **`closeButtonStyles`** `Styles` — Custom styles for the close button
+- **`name`** `string` — Form name
+- **`form`** `CubeFormInstance` — Form instance created by `useForm`
+- **`defaultValues`** `object` — Default field values
+- **`onSubmit`** `(data) => void | Promise` — Callback on form submit and success
+- **`onSubmitFailed`** `(error?) => void | Promise` — Callback on form submit and failure
+- **`onValuesChange`** `function` — Callback when any field value changes
+- **`orientation`** `'vertical' | 'horizontal'` — Layout orientation of the form
+- **`labelWidth`** `string` — The size of the side area with labels (only for `labelPosition="side"`)
+- **`labelPosition`** `'top' | 'side'` — Where to place labels relative to inputs
+- **`labelStyles`** `Styles` — Styles for the label
+- **`requiredMark`** `boolean` — Whether the field presents required mark
+- **`necessityIndicator`** `NecessityIndicator` — The type of necessity indicator
+- **`necessityLabel`** `ReactNode` — Custom necessity label
+- **`isReadOnly`** `boolean` — Whether the form is read only
+- **`validationState`** `ValidationState` — The validation state of the form
+- **`validateTrigger`** `ValidateTrigger` — On which event to perform validation
+- **`showValid`** `boolean` — Whether to show valid state
 
-### DialogForm-specific Properties
-
-- **`title`** `string` — The title of the dialog
-- **`danger`** `boolean` — Whether the submit button has a danger theme
-- **`submitProps`** `CubeButtonProps` — Properties for submit button (use `label` to change text)
-- **`cancelProps`** `CubeButtonProps` — Properties for cancel button (use `label` to change text)
-- **`preserve`** `boolean` (default: `false`) — Preserve form values after submission/dismissal
-- **`noActions`** `boolean` — Hide default action buttons to manually specify them
-
-### Inherited Properties
+### Base Properties
 
-DialogForm inherits all properties from:
-- **[Dialog](./Dialog.md)**: `size`, `isDismissable`, `closeIcon`, styling properties, etc.
-- **[Form](../form/Form.md)**: `name`, `defaultValues`, `onSubmit`, `onSubmitFailed`, `onValuesChange`, `labelPosition`, `requiredMark`, validation properties, etc.
+Supports [Base properties](../../BaseProperties.md)
 
-See the respective component documentation for complete property lists.
+### Style Properties
 
-### Base Properties
+These properties allow direct style application without using the `styles` prop:
 
-Supports [Base properties](../../BaseProperties.md)
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
 
 ## Examples
 

package/docs/components/overlays/DialogTrigger.md

@@ -29,6 +29,8 @@ DialogTrigger serves as a wrapper around a Dialog and its associated trigger, li
 - **`crossOffset`** `number` (default: `0`) — The additional offset applied along the cross axis
 - **`containerPadding`** `number` (default: `12`) — The padding between the edge of the overlay and the boundary
 - **`shouldFlip`** `boolean` (default: `true`) — Whether the overlay should flip positions when insufficient space
+- **`shouldUpdatePosition`** `boolean` — Whether the overlay position should update on scroll or resize
+- **`hideOnClose`** `boolean` — Whether to hide the overlay instead of unmounting on close
 - **`onOpenChange`** `function` — Callback fired when the dialog open state changes
 - **`onDismiss`** `function` — Callback fired when the dialog is dismissed
 - **`targetRef`** — The ref of the element the Dialog should visually attach itself to
@@ -43,6 +45,15 @@ Supports [Base properties](../../BaseProperties.md)
 
 DialogTrigger has no styling capabilities.
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Variants
 
 ### Types

package/docs/components/overlays/Tooltip.md

@@ -22,25 +22,31 @@ This module exports three components that work together:
 
 The simplest way to add tooltips to your components. It combines `TooltipTrigger` and `Tooltip` for convenience.
 
+See TooltipProvider for full documentation.
+
+## TooltipTrigger
+
+Lower-level component that wraps a trigger element and a `Tooltip`. Use this when you need more control over the tooltip content or behavior.
+
+See TooltipTrigger for full documentation.
+
+## Tooltip
+
+Display container for tooltip content. Has a directional arrow dependent on its placement. This component is typically used as a child of `TooltipTrigger` or automatically rendered by `TooltipProvider`.
+
 ---
 
 ### Properties
 
-- **`title`** `ReactNode` — Content to display inside the tooltip
-- **`tooltipStyles`** `Styles` — Custom styles for the tooltip content container
-- **`width`** `string` — Width of the tooltip
-- **`placement`** `Placement` (default: `'top'`) — Position of the tooltip relative to its trigger. Options: `top`, `bottom`, `left`, `right`, `start`, `end`
-- **`delay`** `number` (default: `250`) — The delay time in ms for the tooltip to show up
-- **`closeDelay`** `number` (default: `500`) — The delay time in ms for the tooltip to close
-- **`offset`** `number` (default: `8`) — Distance between the tooltip and the trigger element
-- **`crossOffset`** `number` (default: `0`) — Cross-axis offset of the tooltip
+- **`tipStyles`** `Styles` — Custom styles for the tooltip arrow (tip) element
+- **`showIcon`** `boolean` — Controls whether an icon should be displayed in the tooltip
+- **`placement`** `PlacementAxis` (default: `'top'`) — Position of the tooltip relative to its trigger. Options: `top`, `bottom`, `left`, `right`
 - **`isMaterial`** `boolean` — Enables material-style tooltip with auto pointer events
 - **`isLight`** `boolean` — Uses light color scheme for the tooltip
-- **`isDisabled`** `boolean` — Whether the tooltip is disabled
 - **`isOpen`** `boolean` — Controlled open state of the tooltip
 - **`defaultOpen`** `boolean` — Whether the tooltip is open by default (uncontrolled)
 - **`onOpenChange`** `(isOpen: boolean) => void` — Callback when the tooltip open state changes
-- **`trigger`** `'focus'` — When set, opens the tooltip only on focus instead of both focus and hover
+- **`shouldFlip`** `boolean` — Whether the tooltip should flip position when there is insufficient space
 
 ### Base Properties
 
@@ -48,16 +54,23 @@ Supports [Base properties](../../BaseProperties.md)
 
 ### Styling Properties
 
-#### tooltipStyles
+#### styles
 
-Customizes the tooltip content container.
+Customizes the root element of the tooltip.
 
 **Sub-elements:**
-- None (tooltip tip is styled via `tipStyles` prop on `Tooltip` component)
+- None
 
 ### Style Properties
 
-These properties allow direct style application without using the `styles` prop: `width`.
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
 
 ### Modifiers
 
@@ -67,76 +80,6 @@ The `mods` property on the tooltip accepts the following modifiers you can overr
 - **`light`** `boolean` — Uses light color scheme instead of dark
 - **`open`** `boolean` — Indicates whether the tooltip is currently visible
 
-## TooltipTrigger
-
-Lower-level component that wraps a trigger element and a `Tooltip`. Use this when you need more control over the tooltip content or behavior.
-
----
-
-### Properties
-
-- **`placement`** `Placement` (default: `'top'`) — Position of the tooltip relative to its trigger. Options: `top`, `bottom`, `left`, `right`, `start`, `end`
-- **`delay`** `number` (default: `250`) — The delay time in ms for the tooltip to show up
-- **`closeDelay`** `number` (default: `500`) — The delay time in ms for the tooltip to close
-- **`offset`** `number` (default: `8`) — Distance between the tooltip and the trigger element
-- **`crossOffset`** `number` (default: `0`) — Cross-axis offset of the tooltip
-- **`isMaterial`** `boolean` — Enables material-style tooltip with auto pointer events
-- **`isLight`** `boolean` — Uses light color scheme for the tooltip
-- **`isDisabled`** `boolean` — Whether the tooltip is disabled
-- **`isOpen`** `boolean` — Controlled open state of the tooltip
-- **`defaultOpen`** `boolean` — Whether the tooltip is open by default (uncontrolled)
-- **`onOpenChange`** `(isOpen: boolean) => void` — Callback when the tooltip open state changes
-- **`trigger`** `'focus'` — When set, opens the tooltip only on focus instead of both focus and hover
-- **`activeWrap`** `boolean` — *(deprecated)* Whether the trigger should have an ActiveZone wrap. Use function-as-first-child pattern instead.
-- **`targetRef`** `RefObject<HTMLElement>` — External ref to use for the trigger element
-
-### Base Properties
-
-Supports [Base properties](../../BaseProperties.md)
-
-## Tooltip
-
-Display container for tooltip content. Has a directional arrow dependent on its placement. This component is typically used as a child of `TooltipTrigger` or automatically rendered by `TooltipProvider`.
-
-### Properties
-
-#### tipStyles
-
-Customizes the tooltip arrow (tip) element.
-
-#### showIcon
-
-`boolean` - Controls whether an icon should be displayed in the tooltip.
-
-#### placement
-
-`PlacementAxis` - Controls the position of the tooltip relative to its trigger. Options: `top`, `bottom`, `left`, `right`.
-
-#### isMaterial
-
-`boolean` - Enables material-style tooltip with auto pointer events.
-
-#### isLight
-
-`boolean` - Uses light color scheme for the tooltip.
-
-#### width
-
-Specifies the width of the tooltip.
-
-### Base Properties
-
-Supports [Base properties](../../BaseProperties.md)
-
-### Styling Properties
-
-#### styles
-
-Customizes the root element of the tooltip.
-
-**Sub-elements:**
-- None
-
 ## Usage Patterns
 
 ### Standard Pattern (Active Elements)

package/docs/components/overlays/TooltipProvider.md

@@ -11,16 +11,36 @@ A convenience wrapper that combines `TooltipTrigger` and `Tooltip` into a single
 ## Properties
 
 - **`title`** `ReactNode` — Tooltip content
-- **`tooltipStyles`** `Styles` — Custom styles for the tooltip
+- **`tooltipStyles`** `Styles` — Custom styles for the tooltip container
 - **`width`** `string` — Tooltip width
-- **`isDisabled`** `boolean` — Disable the tooltip
-
-Inherits all TooltipTrigger properties: `placement`, `offset`, `crossOffset`, `delay`, etc.
+- **`placement`** `Placement` (default: `'top'`) — Position of the tooltip relative to its trigger
+- **`offset`** `number` (default: `8`) — Distance between the tooltip and the trigger element
+- **`crossOffset`** `number` (default: `0`) — Cross-axis offset of the tooltip
+- **`delay`** `number` (default: `250`) — The delay time in ms for the tooltip to show up
+- **`closeDelay`** `number` (default: `500`) — The delay time in ms for the tooltip to close
+- **`isMaterial`** `boolean` — Enables material-style tooltip with auto pointer events
+- **`isLight`** `boolean` — Uses light color scheme for the tooltip
+- **`isOpen`** `boolean` — Controlled open state of the tooltip
+- **`defaultOpen`** `boolean` — Whether the tooltip is open by default (uncontrolled)
+- **`onOpenChange`** `(isOpen: boolean) => void` — Callback when the tooltip open state changes
+- **`trigger`** `'focus'` — When set, opens the tooltip only on focus instead of both focus and hover
+- **`shouldCloseOnPress`** `boolean` (default: `true`) — Whether the tooltip closes when the trigger is pressed
 
 ### Base Properties
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ### Simple tooltip

package/docs/components/overlays/TooltipTrigger.md

@@ -14,17 +14,31 @@ Lower-level component that wraps a trigger element and a `Tooltip`. Use when you
 - **`offset`** `number` (default: `8`) — Distance from trigger in pixels
 - **`crossOffset`** `number` (default: `0`) — Cross-axis offset in pixels
 - **`delay`** `number` (default: `250`) — Show delay in milliseconds
+- **`closeDelay`** `number` (default: `500`) — Close delay in milliseconds
 - **`isMaterial`** `boolean` — Material design style tooltip
 - **`isLight`** `boolean` — Light theme tooltip
 - **`isDisabled`** `boolean` — Disable the tooltip
 - **`isOpen`** `boolean` — Controlled open state
 - **`defaultOpen`** `boolean` — Initially open (uncontrolled)
 - **`onOpenChange`** `(isOpen: boolean) => void` — Callback when open state changes
+- **`trigger`** `'focus'` — When set, opens the tooltip only on focus instead of both focus and hover
+- **`shouldCloseOnPress`** `boolean` (default: `true`) — Whether the tooltip closes when the trigger is pressed
 
 ### Base Properties
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ```jsx

package/docs/components/portal/Portal.md

@@ -14,6 +14,10 @@ Renders children outside the current DOM hierarchy using React portals. By defau
 - **`isDisabled`** `boolean` (default: `false`) — Disable portaling and render inline
 - **`onMount`** `() => void` — Callback when portal mounts
 
+### Base Properties
+
+Supports [Base properties](../../BaseProperties.md).
+
 ## Examples
 
 ```jsx

package/docs/components/status/LoadingAnimation.md

@@ -16,6 +16,17 @@ An animated loading indicator with a rotating cube graphic. Used for full-page o
 
 Supports [Base properties](../../BaseProperties.md).
 
+### Style Properties
+
+These properties allow direct style application without using the `styles` prop:
+
+- **Base:** `display`, `font`, `preset`, `hide`, `whiteSpace`, `opacity`, `transition`
+- **Position:** `gridArea`, `order`, `gridColumn`, `gridRow`, `placeSelf`, `alignSelf`, `justifySelf`, `zIndex`, `margin`, `inset`, `position`
+- **Dimension:** `width`, `height`, `flexBasis`, `flexGrow`, `flexShrink`, `flex`
+- **Block:** `border`, `radius`, `shadow`, `outline`, `padding`, `paddingInline`, `paddingBlock`, `overflow`, `scrollbar`, `textAlign`
+- **Color:** `color`, `fill`, `fade`, `image`
+- **Flow:** `flow`, `placeItems`, `placeContent`, `alignItems`, `alignContent`, `justifyItems`, `justifyContent`, `align`, `justify`, `gap`, `columnGap`, `rowGap`, `gridColumns`, `gridRows`, `gridTemplate`, `gridAreas`
+
 ## Examples
 
 ```jsx