import { KbqDividerModule } from '@koobiq/components/divider';

KbqDivider

componentСкопировать ссылку на KbqDivider

A themed line separator.

Horizontal by default and vertical with vertical; length gives the line a size of its own where the surrounding layout does not supply one.

The divider carries role="separator" so the boundary it draws is also exposed programmatically. A divider that only repeats a boundary already conveyed by the layout should set decorative.

@Component({ selector: 'kbq-divider' })
class KbqDivider {
readonly vertical = input<boolean>(false);
readonly paddings = input<boolean>(true);
readonly decorative = input<boolean>(false);
readonly length = input<number | null>(null);
}
verticalinputСкопировать ссылку на verticalboolean

Whether the divider is vertically oriented. Defaults to false, a horizontal divider.

paddingsinputСкопировать ссылку на paddingsboolean

Whether the divider spaces itself from the content around it. Defaults to true, which emits margins (not padding) along the divider's cross axis.

decorativeinputСкопировать ссылку на decorativeboolean

Whether the divider is purely decorative. A decorative divider is hidden from assistive technology, for boundaries that a heading, a group or the layout itself already conveys. Defaults to false.

lengthinputСкопировать ссылку на lengthnumber | null

Length of the line in pixels — its height when vertical, its width otherwise. null, the default, leaves the length to the layout the divider sits in, which is what a divider spanning a container wants. Set it for a divider that has to be shorter than its surroundings, such as one between the buttons of a toolbar, instead of reaching for a height of your own in CSS.

Предложения по улучшению
Если вы нашли ошибку или хотите доработать статью, создайте запрос на GitHub.