Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
stories.add('Stateful Drawer Wrapper', () => {
const story = (
<nav>
<nav>
</nav>
</nav>
);
return inlineTemplate({
title: 'Stateful Drawer Wrapper',
documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION}notification-drawer`,
story
});
});
};
panels={panels}
expandedPanel="1"
toggleDrawerExpand={expandClicked}
toggleDrawerHide={closeClicked}
togglePanel={expandClicked}
onNotificationClick={notifClicked}
onNotificationHide={notifClicked}
onMarkPanelAsRead={linkClicked}
onMarkPanelAsClear={linkClicked}
onClickedLink={linkClicked}
/>
);
return inlineTemplate({
title: 'Drawer Wrapper',
documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION}notification-drawer`,
story
});
});
};
panels={panels}
expandedPanel="1"
toggleDrawerExpand={expandClicked}
toggleDrawerHide={closeClicked}
togglePanel={expandClicked}
onNotificationClick={notifClicked}
onNotificationHide={notifClicked}
onMarkPanelAsRead={linkClicked}
onMarkPanelAsClear={linkClicked}
onClickedLink={linkClicked}
/>
);
return inlineTemplate({
title: 'Drawer Wrapper',
documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION}notification-drawer`,
story
});
});
};
<a aria-expanded="false">
Notification Tab 2
</a>
);
return inlineTemplate({
title: 'Notification Drawer',
documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION}notification-drawer`,
story
});
});
};
<div>
<a href="#">Start Server</a>
</div>
)}
<span>
<strong>{header}</strong>
{message}
</span>
);
return inlineTemplate({
title: 'Toast Notification',
documentationLink: `${
DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION
}toast-notifications/`,
story
});
})
);
})(() => {
const story = (
);
return inlineTemplate({
title: 'Loading Wizard',
description: 'The loading wizard shows loading wizard contents within a wizard.',
documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION}wizard/#design`,
story
});
})
);
import { withKnobs, text, boolean, select } from '@storybook/addon-knobs';
import { withInfo } from '@storybook/addon-info';
import { defaultTemplate } from 'storybook/decorators/storyTemplates';
import { storybookPackageName, DOCUMENTATION_URL, STORYBOOK_CATEGORY } from 'storybook/constants/siteConstants';
import { FieldLevelHelp } from './index';
import { name } from '../../../package.json';
const stories = storiesOf(
`${storybookPackageName(name)}/${STORYBOOK_CATEGORY.FORMS_AND_CONTROLS}/Help On Forms`,
module
);
stories.addDecorator(withKnobs);
stories.addDecorator(
defaultTemplate({
title: 'FieldLevelHelp',
documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION}inline-notifications/`
})
);
stories.add(
'FieldLevelHelp',
withInfo()(() => {
const rootClose = boolean('Root Close', true);
const content = text(
'content',
'Enter the hostname in a valid format <br> <a href="http://www.test.example.com">Click here for examples of valid hostnames</a>'
);
const placement = select('Placement', ['top', 'bottom', 'left', 'right'], 'top');
const fieldLabel = text('Field Label', 'Hostname');
const htmlContent = (
const story = (
<nav>
<nav>
</nav>
</nav>
);
return inlineTemplate({
title: 'Stateful Drawer Wrapper',
documentationLink: `${
DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION
}notification-drawer`,
story
});
});
};
stories.addWithInfo('Stateful Drawer Wrapper', '', () => {
const story = (
<nav>
<nav>
</nav>
</nav>
);
return inlineTemplate({
title: 'Stateful Drawer Wrapper',
documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION}notification-drawer`,
story
});
});
};
withInfo('Loading State shows centered spinner when loading')(() => {
const loading = boolean('Loading', true);
const size = select('Size', ['lg', 'md', 'sm', 'xs'], 'lg');
const story = (
<div>Look at me! I am loaded content!</div>
);
return inlineTemplate({
title: 'Loading State',
documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_COMMUNICATION}loading-state/`,
story
});
})
)