import { CustomElement } from '../../Abstracts/CustomElement'; import type { IDividerElementProps } from './IDividerElementProps'; declare const DividerElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Orientable").IOrientableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * Divider - A visual separator element that creates distinct sections within layouts. * * @description * The Divider component is a fundamental layout element that renders as a horizontal or vertical * line to visually separate content areas, groups, or sections within an interface. It provides * clear visual hierarchy and organization by creating boundaries between related content blocks. * The component supports both horizontal and vertical orientations through the Orientable behavior, * customizable thickness via attribute or CSS property, and theme-aware styling that adapts to * the current design system. Commonly used in navigation menus, lists, toolbars, forms, and * content layouts to improve scannability and visual structure. * * @name Divider * @element mosaik-divider * @category Primitives * * @csspart root - The root container for the divider SVG element * * @cssprop {String} --divider-background-color - The background color of the divider line * @cssprop {String} --divider-font-family - The font family for divider labels (when applicable) * @cssprop {String} --divider-font-size - The font size for divider labels (when applicable) * @cssprop {String} --divider-font-weight - The font weight for divider labels (when applicable) * @cssprop {String} --divider-foreground-color - The foreground/stroke color of the divider line * @cssprop {String} --divider-gap - The spacing gap around the divider element * @cssprop {String} --divider-padding-bottom - The bottom padding inside the divider container * @cssprop {String} --divider-padding-left - The left padding inside the divider container * @cssprop {String} --divider-padding-right - The right padding inside the divider container * @cssprop {String} --divider-padding-top - The top padding inside the divider container * @cssprop {String} --divider-shadow - The shadow effect for the divider element * @cssprop {String} --divider-thickness - The thickness of the divider line in pixels * @cssprop {String} --divider-transition-duration - The duration of transition animations * @cssprop {String} --divider-transition-mode - The timing function for transition animations * @cssprop {String} --divider-transition-property - The CSS properties to animate during transitions * * @example * Horizontal divider separating content sections: * ```html *
Section 1
* *
Section 2
* ``` * * @example * Vertical divider in navigation menu: * ```html * * ``` * * @public */ export declare class DividerElement extends DividerElement_base implements IDividerElementProps { private _thickness?; /** * @public */ constructor(); /** * Returns the `is` property. * * @public * @static * @readonly */ static get is(): string; /** * Gets or sets the thickness property. * * @public * @attr */ get thickness(): number | undefined; set thickness(value: number | undefined); } /** * @public */ export declare namespace DividerElement { type Props = IDividerElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-divider': DividerElement; } } export {}; //# sourceMappingURL=DividerElement.d.ts.map