stories: fix type loader signature and safety (#104307)

Fixes the type loader signature and uses optional chaining to avoid
attempting to access documentation values when the type loader is not
enabled.

Author: JonasBa

static/app/components/charts/chartWidgetLoader.stories.tsx

@@ -5,7 +5,7 @@ import {CodeBlock} from 'sentry/components/core/code';
 import * as Storybook from 'sentry/stories';
 
 export default Storybook.story('ChartWidgetLoader', (story, APIReference) => {
-  APIReference(documentation.props.ChartWidgetLoader);
+  APIReference(documentation.props?.ChartWidgetLoader);
 
   story('Getting Started', () => {
     return (

static/app/components/core/button/button.mdx

@@ -37,18 +37,18 @@ import ButtonDocumentation from '!!type-loader!@sentry/scraps/button';
 
 export const documentation = {
   exports: {
-    module: ButtonDocumentation.exports.module,
+    module: ButtonDocumentation.exports?.module,
     exports: {
       // Button has some exports that we don't want to document, strip them out until they are removed
       ...Object.fromEntries(
-        Object.entries(ButtonDocumentation.exports.exports).filter(
+        Object.entries(ButtonDocumentation?.exports?.exports ?? {}).filter(
           ([key]) => key !== 'StyledButton' && key !== 'ButtonBar'
         )
       ),
     },
   },
   props: {
-    ...ButtonDocumentation.props,
+    ...ButtonDocumentation?.props,
   },
 };
 
@@ -63,19 +63,17 @@ To create a basic button, wrap text in a `<Button>` and pass an `onClick` callba
 Buttons come in a few different styles: `muted` (default), `primary`, `warning`, `danger`, `transparent` and `link`.
 
 <Storybook.Demo>
-  <Button priority="muted">Muted (default)</Button>
+  <Button priority="default">Default (default)</Button>
   <Button priority="primary">Primary</Button>
-  <Button priority="warning">Warning</Button>
   <Button priority="danger">Danger</Button>
   <Button priority="transparent">Transparent</Button>
   <div style={{alignSelf: 'center'}}>
     <Button priority="link">Link</Button>
   </div>
 </Storybook.Demo>
 ```jsx
-<Button priority="muted">Muted (default)</Button>
+<Button priority="default">Default (default)</Button>
 <Button priority="primary">Primary</Button>
-<Button priority="warning">Warning</Button>
 <Button priority="danger">Danger</Button>
 <Button priority="transparent">Transparent</Button>
 <Button priority="link">Link</Button>

static/app/components/core/button/buttonBar.stories.tsx

@@ -6,7 +6,7 @@ import {ButtonBar} from 'sentry/components/core/button/buttonBar';
 import * as Storybook from 'sentry/stories';
 
 export default Storybook.story('ButtonBar', (story, APIReference) => {
-  APIReference(documentation.props.ButtonBar);
+  APIReference(documentation.props?.ButtonBar);
 
   story('Default', () => {
     const [active, setActive] = useState('One');

static/app/components/core/input/input.stories.tsx

@@ -8,7 +8,7 @@ import * as Storybook from 'sentry/stories';
 import {space} from 'sentry/styles/space';
 
 export default Storybook.story('Input', (story, APIReference) => {
-  APIReference(documentation.props.Input);
+  APIReference(documentation.props?.Input);
 
   story('Sizes', () => {
     return (

static/app/components/core/input/inputGroup.stories.tsx

@@ -10,7 +10,7 @@ import {space} from 'sentry/styles/space';
 import {InputGroup} from './inputGroup';
 
 export default Storybook.story('InputGroup', (story, APIReference) => {
-  APIReference(documentation.props.InputGroup);
+  APIReference(documentation.props?.InputGroup);
 
   story('Default', () => {
     return (

static/app/components/core/input/numberDragInput.stories.tsx

@@ -6,7 +6,7 @@ import {NumberDragInput} from 'sentry/components/core/input/numberDragInput';
 import * as Storybook from 'sentry/stories';
 
 export default Storybook.story('NumberDragInput', (story, APIReference) => {
-  APIReference(documentation.props.NumberDragInput);
+  APIReference(documentation.props?.NumberDragInput);
 
   story('Default', () => {
     const [horizontalValue, setHorizontalValue] = useState(10);

static/app/components/core/input/numberInput.stories.tsx

@@ -6,7 +6,7 @@ import * as Storybook from 'sentry/stories';
 import {NumberInput} from './numberInput';
 
 export default Storybook.story('NumberInput', (story, APIReference) => {
-  APIReference(documentation.props.NumberInput);
+  APIReference(documentation.props?.NumberInput);
 
   story('Default', () => {
     return (

static/app/components/core/menuListItem/menuListItem.stories.tsx

@@ -6,7 +6,7 @@ import * as Storybook from 'sentry/stories';
 import {space} from 'sentry/styles/space';
 
 export default Storybook.story('MenuListItem', (story, APIReference) => {
-  APIReference(documentation.props.MenuListItem);
+  APIReference(documentation.props?.MenuListItem);
 
   story('focused', () => {
     return <SizeVariants isFocused />;

static/app/components/core/radio/radio.stories.tsx

@@ -7,7 +7,7 @@ import * as Storybook from 'sentry/stories';
 import {space} from 'sentry/styles/space';
 
 export default Storybook.story('Radio', (story, APIReference) => {
-  APIReference(documentation.props.Radio);
+  APIReference(documentation.props?.Radio);
 
   story('Default', () => {
     return (

static/app/components/core/select/select.stories.tsx

@@ -6,7 +6,7 @@ import {IconGraphBar} from 'sentry/icons/iconGraphBar';
 import * as Storybook from 'sentry/stories';
 
 export default Storybook.story('Select', (story, APIReference) => {
-  APIReference(documentation.props.Select);
+  APIReference(documentation.props?.Select);
 
   story('Sizes', () => {
     return (