petals-ui
Version:
Front-end UI components foundation
33 lines (32 loc) • 1.2 kB
JavaScript
import { getComponentConfig, BaseHeadlessComponent } from '../../basic';
class GridColHeadlessComponent extends BaseHeadlessComponent {
getResponsiveClassName(span, breakpoint = '') {
if (span === -1) {
return '';
}
const breakpointPart = breakpoint ? `${breakpoint}-` : '';
return this.getModifierClassName(span === 0 ? `${breakpointPart}hidden` : `${breakpointPart}${span}`);
}
getComponentName() {
return getComponentConfig('gridCol', 'name') || 'GridCol';
}
getClassNames() {
const sc = this.sc;
const classNames = [this.getComponentName()];
const spanClassName = this.getResponsiveClassName(sc.span);
if (spanClassName !== '') {
classNames.push(spanClassName);
}
if (sc.offset > 0) {
classNames.push(this.getModifierClassName(`offset-${sc.offset}`));
}
['xs', 'sm', 'md', 'lg', 'xl'].forEach(bp => {
const cls = this.getResponsiveClassName(sc[bp], bp);
if (cls !== '') {
classNames.push(cls);
}
});
return classNames;
}
}
export { GridColHeadlessComponent };