Cacher is the code snippet organizer for pro developers

<template>
  
    <div class="slds-theme_shade">
        <div class="slds-m-left_small slds-m-right_large">
            <lightning-combobox name="commodityCombo" 
                                label="Commodity" 
                                value={value}
                                options={options}
                                onchange={handleChange}>

            </lightning-combobox>

            <lightning-input name="location" label="Location" class="slds-m-top_small"></lightning-input>

            <lightning-button label="Search"></lightning-button>
        </div>
    </div>

    <div class="slds-m-top_small">
        <div class="slds-m-left_small">
            <lightning-checkbox-group name="Checkbox Group"
                                        label="" variant="label-hidden"
                                        options={optionsCheckBox}
                                        value={valueCheckBox}>

            </lightning-checkbox-group>
        </div>
    </div>

</template>

import { LightningElement, track } from 'lwc';

export default class VxSidebar extends LightningElement {
    @track value = 'Commodity';
    @track valueCheckBox = ['Manufacturer', 'Corrugator', 'Sheet plant', 'Large RSC', 'Triple wall', '4+ colors'];
    @track optionsCheckBox = [
        {label : 'Manufacturer', value : 'Manufacturer'},
        {label : 'Corrugator', value : 'Corrugator'},
        {label : 'Sheet plant', value : 'Sheet plant'},
        {label : 'Large RSC', value : 'Large RSC'},
        {label : 'Small RSC', value : 'Small RSC'},
        {label : 'Displays/POP', value : 'Displays/POP'},
        {label : 'Triple wall', value : 'Triple wall'},
        {label : '4+ colors', value : '4+ colors'},
        {label : 'Micro flute', value : 'Micro flute'},
        {label : 'Speciality glue or die cut', value : 'Speciality glue or die cut'}
    ];

    get options () {
        return [
            {label : 'Commodity', value : 'Commodity'},
            {label : 'Flexible', value : 'Flexible'}
        ];
    }

    handleChange(e) {
        this.value = e.detail.value;

        if (e.detail.value === 'Commodity') {
            this.optionsCheckBox = [
                {label : 'Manufacturer', value : 'Manufacturer'},
                {label : 'Corrugator', value : 'Corrugator'},
                {label : 'Sheet plant', value : 'Sheet plant'},
                {label : 'Large RSC', value : 'Large RSC'},
                {label : 'Small RSC', value : 'Small RSC'},
                {label : 'Displays/POP', value : 'Displays/POP'},
                {label : 'Triple wall', value : 'Triple wall'},
                {label : '4+ colors', value : '4+ colors'},
                {label : 'Micro flute', value : 'Micro flute'},
                {label : 'Speciality glue or die cut', value : 'Speciality glue or die cut'}
            ];

            this.valueCheckBox = ['Manufacturer', 'Corrugator', 'Sheet plant', 'Large RSC', 'Triple wall', '4+ colors'];
        }
        else if (e.detail.value === 'Flexible') {
            this.optionsCheckBox = [
                {label : 'Printer/Converter (checkbox)', value : 'Printer/Converter (checkbox)'},
                {label : 'Types of Materials (free text)', value : 'Types of Materials (free text)'},
                {label : 'Styles of Materials (free text)', value : 'Styles of Materials (free text)'},
                {label : '# of Layers (free text)', value : '# of Layers (free text)'},
                {label : 'Ability to Perf (checkbox)', value : 'Ability to Perf (checkbox)'},
                {label : 'Print Processes (free text)', value : 'Print Processes (free text)'},
                {label : 'Surface Print/Reverse Print (free text)', value : 'Surface Print/Reverse Print (free text)'},
                {label : '# of Colors (free text)', value : '# of Colors (free text)'},
                {label : 'In-House Graphics/Plates (checkbox)', value : 'In-House Graphics/Plates (checkbox)'}
            ]

            this.valueCheckBox = ['Printer/Converter (checkbox)', 'Types of Materials (free text)'];
        }
    }
}

<template>
    
    <div class="slds-grid slds-gutters slds-wrap">
        <div class="slds-col slds-size_1-of-4">
            <!--Side bar component goes here-->
            <c-vx-sidebar></c-vx-sidebar>
        </div>
        <div class="slds-col slds-size_3-of-4">
            <!--Data table component goes here-->
            <c-file-table parent-record-id={parentRecordId}
                          origin-page={originPage}
                          columns={columns}
                          row-records={rowRecords}
                          checkboxes={checkboxes}>
        </c-file-table>
        </div>
    </div>

</template>

import { LightningElement, track, api } from 'lwc';

export default class VxContainerCmp extends LightningElement {
    @api parentRecordId; 
    @api originPage; 
    @api columns = []; 
    @api rowRecords = []; 
    @api checkboxes; 
    @track draftValues = [];  
    @track error;
}