petals-ui/dist/flex/logic/Flex.js

Front-end UI components foundation

import { getComponentConfig, BaseHeadlessComponent } from '../../basic';
class FlexHeadlessComponent extends BaseHeadlessComponent {
    getComponentName() {
        return getComponentConfig('flex', 'name') || 'Flex';
    }
    getClassNames() {
        const sc = this.sc;
        const classNames = [
            this.getComponentName(),
            this.getModifierClassName(sc.direction === 'vertical' ? 'vertical' : 'horizontal'),
        ];
        if (sc.reverse) {
            classNames.push(this.getModifierClassName('reverse'));
        }
        switch (sc.align) {
            case 'center':
                classNames.push(this.getModifierClassName('alignCenter'));
                break;
            case 'end':
                classNames.push(this.getModifierClassName('alignEnd'));
                break;
            default:
                classNames.push(this.getModifierClassName('alignStart'));
        }
        switch (sc.justify) {
            case 'center':
                classNames.push(this.getModifierClassName('justifyCenter'));
                break;
            case 'end':
                classNames.push(this.getModifierClassName('justifyEnd'));
                break;
            default:
                classNames.push(this.getModifierClassName('justifyStart'));
        }
        return classNames;
    }
}
export { FlexHeadlessComponent };