Create a Block component
calcite_block.RdCreate a Block component
Arguments
- ...
named attributes passed to
htmltools::tag()
Details
Properties
The following properties are provided by this component:
| Name | Attribute | Description | Values | Reflects to Attribute |
| collapsible | collapsible | When true, the component is collapsible. | boolean | TRUE |
| description | description | A description for the component, which displays below the heading. | string | FALSE |
| disabled | disabled | When true, interaction is prevented and the component is displayed with lower opacity. | boolean | TRUE |
| dragDisabled | drag-disabled | When true, and a parent Block Group is dragEnabled, the component is not draggable. | boolean | TRUE |
| dragHandle | drag-handle | When true, the component displays a draggable button. | boolean | TRUE |
| heading | heading | The component header text. | string | FALSE |
| headingLevel | heading-level | Specifies the heading level of the component's heading for proper document structure, without affecting visual styling. | 1 | 2 | 3 | 4 | 5 | 6 | TRUE |
| iconEnd | icon-end | Specifies an icon to display at the end of the component. | string | TRUE |
| iconFlipRtl | icon-flip-rtl | Displays the iconStart and/or iconEnd as flipped when the element direction is right-to-left ("rtl"). | "both" | "end" | "start" | TRUE |
| iconStart | icon-start | Specifies an icon to display at the start of the component. | string | TRUE |
| label | label | Specifies an accessible name for the component. | string | FALSE |
| loading | loading | When true, a busy indicator is displayed. | boolean | TRUE |
| menuFlipPlacements | NA | Specifies the component's fallback menu placement when it's initial or specified placement has insufficient space available. | Check API reference | FALSE |
| menuPlacement | menu-placement | Determines where the action menu will be positioned. | "auto" | "auto-end" | "auto-start" | "bottom" | "bottom-end" | "bottom-start" | "leading" | "leading-end" | "leading-start" | "left" | "left-end" | "left-start" | "right" | "right-end" | "right-start" | "top" | "top-end" | "top-start" | "trailing" | "trailing-end" | "trailing-start" | TRUE |
| messageOverrides | NA | Use this property to override individual strings used by the component. | Check API reference | FALSE |
| open | open | When true, expands the component and its contents. | boolean | TRUE |
| overlayPositioning | overlay-positioning | Determines the type of positioning to use for the overlaid content. Using "absolute" will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. "fixed" should be used to escape an overflowing parent container, or when the reference element's position CSS property is "fixed". | "absolute" | "fixed" | TRUE |
| sortHandleOpen | sort-handle-open | When true, displays and positions the sort handle. | boolean | TRUE |
| status | status | Displays a status-related indicator icon. | "idle" | "invalid" | "valid" | TRUE |
Events
The following events are observed by shiny:
| Event | Description |
| calciteBlockBeforeClose | Fires when the component is requested to be closed and before the closing transition begins. |
| calciteBlockBeforeOpen | Fires when the component is added to the DOM but not rendered, and before the opening transition begins. |
| calciteBlockClose | Fires when the component is closed and animation is complete. |
| calciteBlockOpen | Fires when the component is open and animation is complete. |
| calciteBlockSortHandleBeforeClose | Fires when the sort handle is requested to be closed and before the closing transition begins. |
| calciteBlockSortHandleBeforeOpen | Fires when the sort handle is added to the DOM but not rendered, and before the opening transition begins. |
| calciteBlockSortHandleClose | Fires when the sort handle is closed and animation is complete. |
| calciteBlockSortHandleOpen | Fires when the sort handle is open and animation is complete. |
| calciteBlockToggle | Fires when the component's header is clicked. |
Slots
The following slots are provided by this component:
| Slot | Description |
| Default (unnamed) | A slot for adding custom content. |
| actions-end | A slot for adding actionable calcite-action elements after the content of the component. It is recommended to use two or fewer actions. |
| icon | Deprecated A slot for adding a leading header icon with calcite-icon. Use icon-start instead. |
| content-start | A slot for adding non-actionable elements before content of the component. |
| control | Deprecated A slot for adding a single HTML input element in a header. Use actions-end instead. |
| header-menu-actions | A slot for adding an overflow menu with calcite-actions inside a dropdown menu. |