```md
<!--- YourComponent.stories.mdx -->

import { Meta, Story, Canvas } from '@storybook/addon-docs';

import { YourComponent } from './your-component';

<Meta title="Example of how to use argTypes and functions" component={YourComponent} />

<!-- Render functions are a framework specific feature to allow you control on how the component renders -->


<!---👇 A function to apply some computations -->

export const someFunction = (valuePropertyA, valuePropertyB) => {

  <!--- Makes some computations and returns something -->

};

<!---👇 Assigns the function result to a variable -->

<Canvas>
  <Story
    name="ExampleStory"
    argTypes={{
      propertyA: {
        options: [
          'Item One',
          'Item Two',
          'Item Three'
        ],
      },
      propertyB: {
        options: [
          'Another Item One',
          'Another Item Two',
          'Another Item Three'
        ],
      },
    }}
    args={{
      propertyA: 'Item One',
      propertyB: 'Another Item One',
    }}
    render={(args) => {
      const { propertyA, propertyB } = args;
      const someFunctionResult = someFunction(propertyA, propertyB);
      return <YourComponent {...args} someProperty={someFunctionResult} />;
    }} />
</Canvas>
```