Function that will render div and track its dimensions. Try to use fixed size container, with known both width and height.

Component that will absolutely position grid element to x, y props with width and height. GridItem children will be rendered inside absolutely positioned and fixed size element.

Component that will combine use-grid-data hook to compute layout and height of grid definition and will put every child in GridItem component with props that define that grid position.

Reusable component that will look for *tabs* context and render children if :id received in props matches :selected value in *tabs* context

Hook will compute how many columns are visible at the moment by comparing column-width, container-width, maximum number of columns and padding between columns.

Returns input props with additional props :column-count and :estimated-width

Hook will return *container context value

Hook will return *container-dimensions* value

Hook will compute layout width, height and what layout is currently active.

• layouts - map that has layout id bound to sequence of grid container definitions
• breakpoints - map that has layout ids bound to width thresholds so that hook can compute what layout is currently active
• columns - number that will split available space on x columns
• row-height - number that specifies single row height
• width - how much space is available for layout. this hook will use that width to compute what layout from provided layouts is active

Hook will return data distributed to columns-count number of vectors, distributed by pattern that goes sequentialy through original data sequence and appending to column = mod(idx, coulumn-count)

Hook that will create logic for tab registration. Its only valid argument is ref that will be attached to tabs component and it is optioinal.

Hook will return map with following keys:

• :tab/refs - mapping of tab :id to tab dom element
• :tab/marker - dimensions of currently selected tab [:top :left :width :height]
• :tab/dimensions - dimensions for tab content. It is value of: *container-dimensions* - tabs element height = content-height
• :tabs/ref - ref that should be attached to tabs element, so that this hook can track tabs dimensions
• :tabs - sequence of tabs that are registered in form of [id name]
• :tabs/context - context important for tab component to function well. It holds functions that will :register, :unregister, :update, :select! tab as well as value of :selected that holds :id of selected tab

IMPORTANT - use helix.core/provider to provide :tabs/context received from this hook to children through *tabs* context. Just pass it as is…

Function will wrap container around component. Use style or class to control container dimensions. Container will track its size and provide that data through *container-dimensions* context