How to use the storybook/constants/siteConstants.storybookPackageName function in storybook

FilterValueSelector,
  FilterCategorySelector,
  FilterCategoryValueSelector,
  FilterActiveLabel,
  FilterList,
  FilterItem
} from '../../index';

import {
  MockFilterExample,
  mockFilterExampleSource
} from './__mocks__/mockFilterExample';
import { name } from '../../../package.json';

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

stories.addDecorator(
  defaultTemplate({
    title: 'Filter',
    documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_FORMS}filter/`
  })
);

stories.add(
  'Filter',
  withInfo({
    source: false,

import React from 'react';
import { storiesOf } from '@storybook/react';
import { withInfo } from '@storybook/addon-info/dist/index';
import { defaultTemplate } from 'storybook/decorators/storyTemplates';
import { storybookPackageName } from 'storybook/constants/siteConstants';
import pfBrand from 'patternfly/dist/img/logo-alt.svg';
import ngnix from './__images__/nginx.png';
import { name } from '../../../package.json';

import { CatalogItemHeader } from './index';

const stories = storiesOf(`${storybookPackageName(name)}/Catalog Components/Catalog Item Header`, module);

stories.addDecorator(
  defaultTemplate({
    title: 'Catalog Item Header',
    description: 'This is a header component used as the header for catalog item details.'
  })
);

stories.add(
  'Catalog Item Header',
  withInfo()(() => (
    <div>
      <div style="{{">
        </div></div>

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

const stories = storiesOf(`${storybookPackageName(name)}/${STORYBOOK_CATEGORY.DATA_VISUALIZATION}/Charts`, module);
stories.addDecorator(withKnobs);
stories.addDecorator(
  defaultTemplate({
    title: 'Utilization Bar',
    documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_CARDS}utilization-bar-card/`
  })
);

stories.add(
  'Utilization Bar',
  withInfo('Utilization Bar')(() => (
    <div>
      <h1>Utilization bar</h1>
      </div>

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

const stories = storiesOf(
  `${storybookPackageName(name)}/${
    STORYBOOK_CATEGORY.DATA_VISUALIZATION
  }/Charts`,
  module
);
stories.addDecorator(withKnobs);
stories.addDecorator(
  defaultTemplate({
    title: 'Utilization Bar',
    documentationLink: `${
      DOCUMENTATION_URL.PATTERNFLY_ORG_CARDS
    }utilization-bar-card/`
  })
);

stories.add(
  'Utilization Bar',

import React from 'react';
import { storiesOf } from '@storybook/react';
import { withKnobs, 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 { Grid } from './index';
import { name } from '../../../package.json';

const stories = storiesOf(`${storybookPackageName(name)}/${STORYBOOK_CATEGORY.LAYOUTS}/Grid`, module);
stories.addDecorator(withKnobs);

const description = (
  <p>
    This component is based on React Bootstrap Grid component. Grids are used to structure and present data. See{' '}
    <a href="{`${DOCUMENTATION_URL.REACT_BOOTSTRAP_LAYOUT}grid/`}">React Bootstrap Docs</a> for complete Grid component
    documentation.
  </p>
);

const dummySentences = [
  'Lorem ipsum dolor sit amet, consectetuer adipiscing elit.',
  'Donec hendrerit tempor tellus.',
  'Donec pretium posuere tellus.',
  'Proin quam nisl, tincidunt et, mattis eget, convallis nec, purus.',
  'Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.',

import React from 'react';
import { storiesOf } from '@storybook/react';
import { withInfo } from '@storybook/addon-info';
import { inlineTemplate } from 'storybook/decorators/storyTemplates';
import { storybookPackageName, DOCUMENTATION_URL, STORYBOOK_CATEGORY } from 'storybook/constants/siteConstants';
import { Label, DisposableLabel, RemoveButton, CompoundLabel } from './index';
import { MockCompoundLabel, mockCompoundLabelSource } from './__mocks__/mockCompoundLabel';
import { MockLabelRemove, mockLabelRemoveSource } from './__mocks__/mockLabelExamples';
import { name } from '../../../package.json';

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

stories.add(
  'Label',
  withInfo()(() => {
    const story = (
      <div>
        <label>Default</label> <label>Primary</label>{' '}
        <label>Success</label> <label>Info</label>{' '}
        <label>Warning</label> <label>Danger</label>
      </div>
    );
    return inlineTemplate({
      title: 'Label',
      documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#labels`,
      story,
      reactBootstrapDocumentationLink: `${DOCUMENTATION_URL.REACT_BOOTSTRAP_COMPONENT}label/`

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 { Badge } from '../Badge';
import { ListGroup, ListGroupItem } from './index';
import { name } from '../../../package.json';

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

stories.addDecorator(
  defaultTemplate({
    title: 'ListGroup',
    documentationLink: `${DOCUMENTATION_URL.PATTERNFLY_ORG_WIDGETS}#list-group`,
    reactBootstrapDocumentationLink: `${
      DOCUMENTATION_URL.REACT_BOOTSTRAP_COMPONENT
    }list-group/`
  })
);

stories.add(
  'List Group',
  withInfo()(() => (