bricks/docs/en/floaticonbar.md

IconBar

Widget Functionality: Creates an icon toolbar containing multiple clickable SVG icon buttons, supporting selection states and event dispatching.
Type: Container widget
Parent Widget: bricks.HBox

Initialization Parameters

Parameter	Type	Description
opts.cheight	Number	Height of child widgets (in character units), default is 2
opts.rate	Number	Scaling factor affecting icon size, default is 1
opts.margin	String	Left and right margins between icons, in CSS format (e.g., '10px')
opts.tools	Array	Array of tool items, each being an object with the following fields: - name: Tool name (used for identification and events) - icon: URL of the SVG icon - rate: Optional scaling ratio for this specific icon - dynsize: Whether to dynamically adjust size (boolean) - tip: Tooltip text (optional)

If cheight or rate is not provided, default values will be automatically set.

Main Events

Event Name	Trigger Condition	Payload Data
desc.name (i.e., tools[i].name)	Triggered when a specific icon is clicked; event name equals the name field of that icon	Passes the corresponding icon's desc object
command	Triggered on any icon click — a unified event for all icons	Passes the desc object of the clicked icon

Events are dispatched via dispatch, allowing external components to listen for specific commands or general actions.

---

IconTextBar

Widget Functionality: Extends IconBar. Each tool item is displayed as a combination of "icon + text", suitable for toolbars requiring labeled descriptions.
Type: Container widget
Parent Widget: bricks.IconBar

Initialization Parameters

Inherits all parameters from IconBar, with enhanced support for each item in the tools array:

Parameter	Type	Description
opts.tools[i].label	String	Text label displayed next to the icon
opts.tools[i].tip	String	Tooltip shown on hover, applied to the entire icon+text container
Other parameters same as IconBar	——	Supports name, icon, rate, dynsize, etc.

Each tool item is constructed as a horizontal layout (HBox), internally composed of Svg and Text widgets in sequence.

Main Events

Identical to IconBar:

Event Name	Trigger Condition	Payload Data
desc.name	Triggered when a tool item is clicked; event name is its name	The corresponding desc object
command	Triggered on every icon click	desc object of the current item

Events are bound to the overall HBox; clicking either the icon or the text triggers the event.

---

FloatIconBar

Widget Functionality: A floating icon toolbar that initially displays only a "floating icon". On mouse hover, it expands into a full IconBar. Commonly used for side-floating toolbars.
Type: Container widget
Parent Widget: bricks.HBox

Initialization Parameters

Parameter	Type	Description
opts	Object	Configuration object passed to the internal IconBar, structured like IconBar's opts.tools and related options
Uses bricks_resource('imgs/float-out.png') internally	——	Fixed icon for the floating button

Actual tool items are defined through the provided opts, which are used to construct the internal IconBar.

Main Events

Same as the internal IconBar:

Event Name	Trigger Condition	Payload Data
desc.name	Triggered when a user clicks an icon in the expanded toolbar	desc object of the corresponding icon
command	Triggered on any icon click in the expanded bar	desc object of the clicked icon

Events originate from the embedded IconBar instance and are automatically forwarded (transparently passed up).

Additional behavioral events:

• mousemove over the floating icon triggers expansion of the menu
• A click anywhere on the page triggers collapse of the menu (via listening on bricks.Body)

---

FloatIconTextBar

Widget Functionality: Floating "icon + text" toolbar, an extended version of FloatIconBar. When expanded, it displays tool items with textual labels.
Type: Container widget
Parent Widget: bricks.FloatIconBar

Initialization Parameters

Same as FloatIconBar:

Parameter	Type	Description
opts	Object	Contains the tools array and other configurations, used internally when constructing the IconTextBar

Internally calls build_bar(opts) to create an IconTextBar instance, thus supporting text-related properties such as label and tip.

Main Events

Same as IconTextBar:

Event Name	Trigger Condition	Payload Data
desc.name	Triggered when a tool item in the expanded bar is clicked	desc object of the selected item
command	Triggered on any click within the expanded bar	desc object of the current item

All events are emitted by the internal IconTextBar instance and automatically bubble up.