@pmndrs/uikit-horizon/dist/button/label-subtext.js

Horizon kit for @pmndrs/uikit based on the Reality Labs Design System (RLDS)

import { componentDefaults, Container, } from '@pmndrs/uikit';
import { computed } from '@preact/signals-core';
import { Button } from './index.js';
import { theme } from '../theme.js';
export class ButtonLabelSubtext extends Container {
    constructor(inputProperties, initialClasses, config) {
        super(inputProperties, initialClasses, {
            defaults: componentDefaults,
            ...config,
            defaultOverrides: {
                fontSize: 12,
                lineHeight: '16px',
                color: computed(() => {
                    const button = this.parentContainer.value?.parentContainer.value;
                    if (!(button instanceof Button)) {
                        return undefined;
                    }
                    if (button.properties.value.disabled === true) {
                        theme.component.button[button.properties.value.variant ?? 'primary'].subtext.disabled.value;
                    }
                    return theme.component.button[button.properties.value.variant ?? 'primary'].subtext.default.value;
                }),
                ...config?.defaultOverrides,
            },
        });
    }
}