primevue-mirror/components/lib/inputswitch/BaseInputSwitch.vue

<script>
import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle';

const styles = `
@layer primevue.core {
    .p-inputswitch {
        display: inline-block;
    }
    
    .p-inputswitch-slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border: 1px solid transparent;
    }
    
    .p-inputswitch-slider:before {
        position: absolute;
        content: '';
        top: 50%;
    }
}
`;

const inlineStyles = {
    root: { position: 'relative' }
};

const classes = {
    root: ({ instance, props }) => [
        'p-inputswitch p-component',
        {
            'p-inputswitch-checked': instance.checked,
            'p-disabled': props.disabled,
            'p-focus': instance.focused
        }
    ],
    slider: 'p-inputswitch-slider'
};

const { load: loadStyle } = useStyle(styles, { name: 'inputswitch', manual: true });

export default {
    name: 'BaseInputSwitch',
    extends: BaseComponent,
    props: {
        modelValue: {
            type: null,
            default: false
        },
        trueValue: {
            type: null,
            default: true
        },
        falseValue: {
            type: null,
            default: false
        },
        disabled: {
            type: Boolean,
            default: false
        },
        inputId: {
            type: String,
            default: null
        },
        inputClass: {
            type: [String, Object],
            default: null
        },
        inputStyle: {
            type: Object,
            default: null
        },
        inputProps: {
            type: null,
            default: null
        },
        'aria-labelledby': {
            type: String,
            default: null
        },
        'aria-label': {
            type: String,
            default: null
        }
    },
    css: {
        classes,
        inlineStyles,
        loadStyle
    },
    provide() {
        return {
            $parentInstance: this
        };
    }
};
</script>