How to use the storybook/constants/siteConstants.DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS function in storybook

DOCUMENTATION_URL,
  STORYBOOK_CATEGORY
} from 'storybook/constants/siteConstants';
import { ListGroup, ListGroupItem } from '../ListGroup';
import { name } from '../../../package.json';
import { InfoTip } from './index';

const stories = storiesOf(
  `${storybookPackageName(name)}/${STORYBOOK_CATEGORY.WIDGETS}/Info Tip`,
  module
);

stories.addDecorator(
  defaultTemplate({
    title: 'InfoTip',
    documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#info-tip`
  })
);

stories.add(
  'InfoTip',
  withInfo()(() => (
    <nav>
      <div>
        <button data-target=".navbar-collapse-1" data-toggle="collapse" type="button">
          <span>Toggle navigation</span>
          <span></span></button></div></nav>

import React from 'react';
import { storiesOf } from '@storybook/react';
import { withInfo } from '@storybook/addon-info';
import { defaultTemplate } from 'storybook/decorators/storyTemplates';
import { storybookPackageName, DOCUMENTATION_URL, STORYBOOK_CATEGORY } from 'storybook/constants/siteConstants';
import { ListGroup, ListGroupItem } from '../ListGroup';
import { name } from '../../../package.json';
import { InfoTip } from './index';

const stories = storiesOf(`${storybookPackageName(name)}/${STORYBOOK_CATEGORY.WIDGETS}/Info Tip`, module);

stories.addDecorator(
  defaultTemplate({
    title: 'InfoTip',
    documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#info-tip`
  })
);

stories.add(
  'InfoTip',
  withInfo()(() => (
    <nav>
      <div>
        <button data-target=".navbar-collapse-1" data-toggle="collapse" type="button">
          <span>Toggle navigation</span>
          <span>
          <span>
          <span>
        </span></span></span></button>
        <a href="/">
          <img alt="PatternFly Enterprise Application" src="http://www.patternfly.org/assets/img/brand.svg"></a></div></nav>

module
);
const description = (
  <p>
    This component is based on React Bootstrap Tabs component. See{' '}
    <a href="https://react-bootstrap.github.io/components.html#tabs">
      React Bootstrap Docs
    </a>{' '}
    for complete Tabs component documentation.
  </p>
);
stories.addDecorator(withKnobs);
stories.addDecorator(
  defaultTemplate({
    title: 'Tabs',
    documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#tabs`,
    description
  })
);

stories.add(
  'Basic Tabs',
  withInfo()(() =&gt; {
    const bsClass = classNames('nav nav-tabs', {
      'nav-justified': boolean('Justified', false)
    });
    const t1Disabled = boolean('Tab 1 Disabled', false);
    const t1Title = (

<div>
        </div>
    );

    return inlineTemplate({
      title: 'Switch',
      documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#bootstrap-switch`,
      reactBootstrapDocumentationLink: 'https://www.npmjs.com/package/react-bootstrap-switch',
      story
    });
  })
);

);
    return inlineTemplate({
      title: 'Pager',
      documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#pagination`,
      story,
      description: (
        <div>
          Pager is a stateless functional component which previous and next links. See Action Logger for details.
        </div>
      )
    });
  })
);

import React from 'react';
import { storiesOf } from '@storybook/react';
import { withKnobs, text, select, boolean } 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 { Button, OverlayTrigger, Popover } from '../../index';
import { name } from '../../../package.json';

const stories = storiesOf(`${storybookPackageName(name)}/${STORYBOOK_CATEGORY.WIDGETS}/Popover`, module);
stories.addDecorator(withKnobs);
stories.addDecorator(
  defaultTemplate({
    title: 'Popover',
    documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#popover`,
    reactBootstrapDocumentationLink: `${DOCUMENTATION_URL.REACT_BOOTSTRAP_COMPONENT}popovers/`
  })
);

stories.add(
  'Popover',
  withInfo()(() => {
    const title = <div>;
    const content = (
      <div>Holy guacamole! Check this info.')
        }}
      /&gt;
    );
    const popover = (</div></div>

import { name } from '../../../package.json';

const stories = storiesOf(`${storybookPackageName(name)}/${STORYBOOK_CATEGORY.WIDGETS}/Badges`, module);

const description = (
  <p>
    This component is based on React Bootstrap Badge component. Badges easily highlight new or unread items. See{' '}
    <a href="{`${DOCUMENTATION_URL.REACT_BOOTSTRAP_COMPONENT}badge/`}">React Bootstrap Docs</a> for complete Badge
    component documentation.
  </p>
);

stories.addDecorator(
  defaultTemplate({
    title: 'Badges',
    documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#badges`,
    description
  })
);

stories.add(
  'Badges',
  withInfo()(() =&gt; (
    <a href="#">
      Inbox 42
    </a>
  ))
);

import { TabContainer, Nav, NavItem, NavDropdown, MenuItem, TabPane, TabContent } from '../../index';
import { name } from '../../../package.json';

const stories = storiesOf(`${storybookPackageName(name)}/${STORYBOOK_CATEGORY.WIDGETS}/Tabs`, module);
const description = (
  <p>
    This component is based on React Bootstrap Tabs component. See{' '}
    <a href="{`${DOCUMENTATION_URL.REACT_BOOTSTRAP_COMPONENT}tabs/`}">React Bootstrap Docs</a> for complete Tabs component
    documentation.
  </p>
);
stories.addDecorator(withKnobs);
stories.addDecorator(
  defaultTemplate({
    title: 'Tabs',
    documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#tabs`,
    description
  })
);

stories.add(
  'Basic Tabs',
  withInfo()(() =&gt; {
    const bsClass = classNames('nav nav-tabs', {
      'nav-justified': boolean('Justified', false)
    });
    const t1Disabled = boolean('Tab 1 Disabled', false);
    const t1Title = (

storybookPackageName,
  DOCUMENTATION_URL,
  STORYBOOK_CATEGORY
} from 'storybook/constants/siteConstants';
import { ProgressBar } from './index';
import { name } from '../../../package.json';

const stories = storiesOf(
  `${storybookPackageName(name)}/${STORYBOOK_CATEGORY.WIDGETS}/Progress Bar`,
  module
);
stories.addDecorator(
  defaultTemplate({
    title: 'Progress Bar',
    documentationLink: `${
      DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS
    }/#progress-bars/`
  })
);

stories.add(
  'Progress Bar',
  withInfo('These are the available progress bar types')(() => (
    <div>
      <p>These are the available progress bar types</p>
      <h1>Default progress bar</h1>
      
      <h1>Progress bar with label</h1>
      
      <h1>Progress bars with contextual colors</h1>
      <div>
        </div></div>