@pega/cosmos-react-demos 3.0.0-dev.1.0 → 3.0.0-dev.10.0

package/jsx/core/SummaryItem/SummaryItem.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"SummaryItem.stories.jsx","sourceRoot":"","sources":["../../../src/core/SummaryItem/SummaryItem.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,MAAM,EACN,IAAI,EACJ,UAAU,EACV,QAAQ,EACR,MAAM,EACN,WAAW,EAEZ,MAAM,yBAAyB,CAAC;AAEjC,eAAe;IACb,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACM,CAAC;AAQV,MAAM,CAAC,MAAM,eAAe,GAAiC,CAAC,IAA2B,EAAE,EAAE;IAC3F,OAAO,CACL,CAAC,WAAW,CACV,OAAO,CAAC,0BAA0B,CAClC,SAAS,CAAC,CACR,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CACnB,CAAC,QAAQ,CACP,KAAK,CAAC,CAAC;gBACL,mBAAmB;gBACnB,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE,MAAM,CAAC;gBAC3C,EACE;qBAAK,CAAC,GAAG,CACT;gBAAA,CAAC,IAAI,CAAC,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,QAAQ,CAC/C;;gBACF,EAAE,IAAI,CACR;cAAA,GAAG;aACJ,CAAC,EACF,CACH,CAAC,CAAC,CAAC,SAAS,CACd,CACD,MAAM,CAAC,CACL,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAChB,CAAC,MAAM,CACL,IAAI,CAAC,GAAG,CACR,IAAI,CAAC,YAAY,CACjB,QAAQ,CAAC,gDAAgD,EACzD,CACH,CAAC,CAAC,CAAC,SAAS,CACd,CACD,OAAO,CAAC,CACN,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CACjB,CAAC,UAAU,CACT,IAAI,CAAC,SAAS,CACd,OAAO,CAAC,QAAQ,CAChB,IAAI,CAAC,MAAM,CACX,QAAQ,CACR,IAAI,CAAC,CAAC;gBACJ,KAAK,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;oBAC5E,EAAE,EAAE,IAAI;oBACR,OAAO,EAAE,IAAI;iBACd,CAAC,CAAC;aACJ,CAAC,EACF,CACH,CAAC,CAAC,CAAC,SAAS,CACd,EACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,CAAC,IAAI,GAAG;IACrB,aAAa,EAAE,IAAI;IACnB,UAAU,EAAE,IAAI;IAChB,WAAW,EAAE,IAAI;CAClB,CAAC;AAEF,eAAe,CAAC,QAAQ,GAAG;IACzB,aAAa,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC/C,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC5C,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport {\n  Avatar,\n  Link,\n  MenuButton,\n  MetaList,\n  Status,\n  SummaryItem,\n  SummaryItemProps\n} from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/SummaryItem',\n  component: SummaryItem,\n  parameters: {\n    layout: 'centered'\n  }\n} as Meta;\n\ninterface SummaryItemStoryProps extends SummaryItemProps {\n  showSecondary: boolean;\n  showVisual: boolean;\n  showActions: boolean;\n}\n\nexport const SummaryItemDemo: Story<SummaryItemStoryProps> = (args: SummaryItemStoryProps) => {\n  return (\n    <SummaryItem\n      primary='This is the primary info'\n      secondary={\n        args.showSecondary ? (\n          <MetaList\n            items={[\n              'email@example.com',\n              <Status variant='success'>Verified</Status>,\n              <>\n                Go to{' '}\n                <Link href='https://www.pega.com' target='_blank'>\n                  Pega.com\n                </Link>\n              </>\n            ]}\n          />\n        ) : undefined\n      }\n      visual={\n        args.showVisual ? (\n          <Avatar\n            size='l'\n            name='Random Man'\n            imageSrc='https://randomuser.me/api/portraits/men/41.jpg'\n          />\n        ) : undefined\n      }\n      actions={\n        args.showActions ? (\n          <MenuButton\n            text='Options'\n            variant='simple'\n            icon='more'\n            iconOnly\n            menu={{\n              items: ['Option Number 1', 'Option Number 2', 'Option Number 3'].map(name => ({\n                id: name,\n                primary: name\n              }))\n            }}\n          />\n        ) : undefined\n      }\n    />\n  );\n};\n\nSummaryItemDemo.args = {\n  showSecondary: true,\n  showVisual: true,\n  showActions: true\n};\n\nSummaryItemDemo.argTypes = {\n  showSecondary: { control: { type: 'boolean' } },\n  showVisual: { control: { type: 'boolean' } },\n  showActions: { control: { type: 'boolean' } }\n};\n"]}
+{"version":3,"file":"SummaryItem.stories.jsx","sourceRoot":"","sources":["../../../src/core/SummaryItem/SummaryItem.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,MAAM,EACN,IAAI,EACJ,UAAU,EACV,QAAQ,EACR,MAAM,EACN,WAAW,EAEZ,MAAM,yBAAyB,CAAC;AAEjC,eAAe;IACb,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACM,CAAC;AAQV,MAAM,CAAC,MAAM,eAAe,GAAiC,CAAC,IAA2B,EAAE,EAAE;IAC3F,OAAO,CACL,CAAC,WAAW,CACV,OAAO,CAAC,0BAA0B,CAClC,SAAS,CAAC,CACR,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CACnB,CAAC,QAAQ,CACP,KAAK,CAAC,CAAC;gBACL,mBAAmB;gBACnB,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE,MAAM,CAAC;gBAC3C,EACE;qBAAK,CAAC,GAAG,CACT;gBAAA,CAAC,IAAI,CAAC,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,QAAQ,CAC/C;;gBACF,EAAE,IAAI,CACR;cAAA,GAAG;aACJ,CAAC,EACF,CACH,CAAC,CAAC,CAAC,SAAS,CACd,CACD,MAAM,CAAC,CACL,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAChB,CAAC,MAAM,CACL,IAAI,CAAC,GAAG,CACR,IAAI,CAAC,YAAY,CACjB,QAAQ,CAAC,gDAAgD,EACzD,CACH,CAAC,CAAC,CAAC,SAAS,CACd,CACD,OAAO,CAAC,CACN,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CACjB,CAAC,UAAU,CACT,IAAI,CAAC,SAAS,CACd,OAAO,CAAC,QAAQ,CAChB,IAAI,CAAC,MAAM,CACX,QAAQ,CACR,IAAI,CAAC,CAAC;gBACJ,KAAK,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;oBAC5E,EAAE,EAAE,IAAI;oBACR,OAAO,EAAE,IAAI;iBACd,CAAC,CAAC;aACJ,CAAC,EACF,CACH,CAAC,CAAC,CAAC,SAAS,CACd,EACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,CAAC,IAAI,GAAG;IACrB,aAAa,EAAE,IAAI;IACnB,UAAU,EAAE,IAAI;IAChB,WAAW,EAAE,IAAI;CAClB,CAAC;AAEF,eAAe,CAAC,QAAQ,GAAG;IACzB,aAAa,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC/C,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC5C,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport {\n  Avatar,\n  Link,\n  MenuButton,\n  MetaList,\n  Status,\n  SummaryItem,\n  SummaryItemProps\n} from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/SummaryItem',\n  component: SummaryItem,\n  parameters: {\n    layout: 'centered'\n  }\n} as Meta;\n\ntype SummaryItemStoryProps = SummaryItemProps & {\n  showSecondary?: boolean;\n  showVisual?: boolean;\n  showActions?: boolean;\n};\n\nexport const SummaryItemDemo: Story<SummaryItemStoryProps> = (args: SummaryItemStoryProps) => {\n  return (\n    <SummaryItem\n      primary='This is the primary info'\n      secondary={\n        args.showSecondary ? (\n          <MetaList\n            items={[\n              'email@example.com',\n              <Status variant='success'>Verified</Status>,\n              <>\n                Go to{' '}\n                <Link href='https://www.pega.com' target='_blank'>\n                  Pega.com\n                </Link>\n              </>\n            ]}\n          />\n        ) : undefined\n      }\n      visual={\n        args.showVisual ? (\n          <Avatar\n            size='l'\n            name='Random Man'\n            imageSrc='https://randomuser.me/api/portraits/men/41.jpg'\n          />\n        ) : undefined\n      }\n      actions={\n        args.showActions ? (\n          <MenuButton\n            text='Options'\n            variant='simple'\n            icon='more'\n            iconOnly\n            menu={{\n              items: ['Option Number 1', 'Option Number 2', 'Option Number 3'].map(name => ({\n                id: name,\n                primary: name\n              }))\n            }}\n          />\n        ) : undefined\n      }\n    />\n  );\n};\n\nSummaryItemDemo.args = {\n  showSecondary: true,\n  showVisual: true,\n  showActions: true\n};\n\nSummaryItemDemo.argTypes = {\n  showSecondary: { control: { type: 'boolean' } },\n  showVisual: { control: { type: 'boolean' } },\n  showActions: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/core/SummaryList/SummaryList.stories.d.ts

@@ -1,8 +1,8 @@
 import { Meta, Story } from '@storybook/react';
-import { SummaryListProps } from '@pega/cosmos-react-core';
+import { OmitStrict, SummaryListProps } from '@pega/cosmos-react-core';
 declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
-interface SummaryListStoryProps extends SummaryListProps {
+interface SummaryListStoryProps extends OmitStrict<SummaryListProps, 'items'> {
     showSecondary?: boolean;
     showVisual?: boolean;
     showActions?: boolean;

package/jsx/core/SummaryList/SummaryList.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SummaryList.stories.d.ts","sourceRoot":"","sources":["../../../src/core/SummaryList/SummaryList.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAML,gBAAgB,EAGjB,MAAM,yBAAyB,CAAC;;AAIjC,wBA4BU;AAEV,UAAU,qBAAsB,SAAQ,gBAAgB;IACtD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,qBAAqB,CAmDxD,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,qBAAqB,CAqG3D,CAAC"}
+{"version":3,"file":"SummaryList.stories.d.ts","sourceRoot":"","sources":["../../../src/core/SummaryList/SummaryList.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAEL,UAAU,EAIV,gBAAgB,EAGjB,MAAM,yBAAyB,CAAC;;AAIjC,wBA4BU;AAEV,UAAU,qBAAsB,SAAQ,UAAU,CAAC,gBAAgB,EAAE,OAAO,CAAC;IAC3E,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,qBAAqB,CAmDxD,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,qBAAqB,CAqG3D,CAAC"}

package/jsx/core/SummaryList/SummaryList.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"SummaryList.stories.jsx","sourceRoot":"","sources":["../../../src/core/SummaryList/SummaryList.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useContext, useMemo, useState } from 'react';\n\nimport {\n  icons,\n  OmitStrict,\n  Modal,\n  ModalManagerContext,\n  SummaryList,\n  SummaryListProps,\n  ViewAll,\n  createStringMatcher\n} from '@pega/cosmos-react-core';\n\nimport { useMockListData } from './SummaryList.mocks';\n\nexport default {\n  title: 'Core/SummaryList',\n  component: SummaryList,\n  parameters: {\n    layout: 'centered'\n  },\n  args: {\n    name: 'People',\n    icon: 'users-solid',\n    count: 5,\n    loading: false,\n    showSecondary: true,\n    showVisual: true,\n    showActions: true,\n    noItems: false,\n    noItemsText: 'No items'\n  },\n  argTypes: {\n    name: { control: { type: 'text' } },\n    icon: { options: icons, control: { type: 'select', icons: true } },\n    count: { control: { type: 'number' } },\n    loading: { control: { type: 'boolean' } },\n    showSecondary: { control: { type: 'boolean' } },\n    showVisual: { control: { type: 'boolean' } },\n    showActions: { control: { type: 'boolean' } },\n    noItems: { control: { type: 'boolean' } },\n    noItemsText: { control: { type: 'text' } }\n  }\n} as Meta;\n\ninterface SummaryListStoryProps extends SummaryListProps {\n  showSecondary?: boolean;\n  showVisual?: boolean;\n  showActions?: boolean;\n  noItems?: boolean;\n}\n\nexport const SummaryListDemo: Story<SummaryListStoryProps> = (args: SummaryListStoryProps) => {\n  const { create: createModal } = useContext(ModalManagerContext);\n  const [loading, setLoading] = useState(true);\n\n  const [items] = useMockListData(\n    () => {\n      setLoading(false);\n    },\n    { count: args.count }\n  );\n\n  const itemsToRender = items.map(item => {\n    return {\n      ...item,\n      secondary: args.showSecondary ? item.secondary : undefined,\n      visual: args.showVisual ? item.visual : undefined,\n      actions: args.showActions\n        ? ['Action 1', 'Action 2', 'Action 3'].map(text => ({\n            text,\n            id: text\n          }))\n        : undefined\n    };\n  });\n\n  return (\n    <SummaryList\n      name={args.name}\n      icon={args.icon}\n      count={args.loading || loading ? undefined : args.count}\n      items={args.noItems ? [] : itemsToRender}\n      loading={args.loading || loading}\n      noItemsText={args.noItemsText}\n      actions={[\n        {\n          text: `Add new ${args.name}`,\n          id: `${args.name}:addNew`,\n          icon: 'plus',\n          onClick() {\n            createModal(() => {\n              return (\n                <Modal heading={`Add new ${args.name}`}>\n                  {`Content for adding new ${args.name} goes here…`}\n                </Modal>\n              );\n            });\n          }\n        }\n      ]}\n    />\n  );\n};\n\nexport const SummaryListViewAll: Story<SummaryListStoryProps> = (args: SummaryListStoryProps) => {\n  const SummaryListViewAllModal = ({\n    name,\n    count,\n    loading\n  }: OmitStrict<SummaryListProps, 'items'>) => {\n    const [search, setSearch] = useState('');\n    const [modalLoading, setModalLoading] = useState(true);\n\n    const [items] = useMockListData(\n      () => {\n        setModalLoading(false);\n      },\n      {\n        count\n      }\n    );\n\n    const itemsToRender = useMemo(() => {\n      if (search.trim()) {\n        const filterRegex = createStringMatcher(search, 'boundary');\n        return items.filter(({ primary }) => filterRegex.test(primary));\n      }\n\n      return items;\n    }, [items, search]);\n\n    return (\n      <Modal heading={args.name}>\n        <ViewAll\n          loading={loading || modalLoading}\n          items={itemsToRender}\n          actions={[\n            {\n              id: 'addNew',\n              text: `Add ${name}`\n            }\n          ]}\n          searchInputProps={{ onSearchChange: setSearch }}\n        />\n      </Modal>\n    );\n  };\n\n  const { create: createModal } = useContext(ModalManagerContext);\n  const [loading, setLoading] = useState(true);\n\n  const [items] = useMockListData(\n    () => {\n      setLoading(false);\n    },\n    { count: 3 }\n  );\n\n  const itemsToRender = items.map(item => {\n    return {\n      ...item,\n      secondary: args.showSecondary ? item.secondary : undefined,\n      visual: args.showVisual ? item.visual : undefined,\n      actions: args.showActions\n        ? ['Action 1', 'Action 2', 'Action 3'].map(text => ({\n            text,\n            id: text\n          }))\n        : undefined\n    };\n  });\n\n  return (\n    <SummaryList\n      name={args.name}\n      icon={args.icon}\n      count={args.loading || loading ? undefined : args.count}\n      items={args.noItems ? [] : itemsToRender}\n      loading={args.loading || loading}\n      noItemsText={args.noItemsText}\n      actions={[\n        {\n          text: `Add new ${args.name}`,\n          id: `${args.name}:addNew`,\n          icon: 'plus',\n          onClick() {\n            createModal(() => {\n              return (\n                <Modal heading={`Add new ${args.name}`}>\n                  {`Content for adding new ${args.name} goes here…`}\n                </Modal>\n              );\n            });\n          }\n        }\n      ]}\n      onViewAll={() => {\n        createModal(SummaryListViewAllModal, {\n          name: args.name,\n          count: args.count,\n          loading: args.loading\n        });\n      }}\n    />\n  );\n};\n"]}
+{"version":3,"file":"SummaryList.stories.jsx","sourceRoot":"","sources":["../../../src/core/SummaryList/SummaryList.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useContext, useMemo, useState } from 'react';\n\nimport {\n  icons,\n  OmitStrict,\n  Modal,\n  ModalManagerContext,\n  SummaryList,\n  SummaryListProps,\n  ViewAll,\n  createStringMatcher\n} from '@pega/cosmos-react-core';\n\nimport { useMockListData } from './SummaryList.mocks';\n\nexport default {\n  title: 'Core/SummaryList',\n  component: SummaryList,\n  parameters: {\n    layout: 'centered'\n  },\n  args: {\n    name: 'People',\n    icon: 'users-solid',\n    count: 5,\n    loading: false,\n    showSecondary: true,\n    showVisual: true,\n    showActions: true,\n    noItems: false,\n    noItemsText: 'No items'\n  },\n  argTypes: {\n    name: { control: { type: 'text' } },\n    icon: { options: icons, control: { type: 'select', icons: true } },\n    count: { control: { type: 'number' } },\n    loading: { control: { type: 'boolean' } },\n    showSecondary: { control: { type: 'boolean' } },\n    showVisual: { control: { type: 'boolean' } },\n    showActions: { control: { type: 'boolean' } },\n    noItems: { control: { type: 'boolean' } },\n    noItemsText: { control: { type: 'text' } }\n  }\n} as Meta;\n\ninterface SummaryListStoryProps extends OmitStrict<SummaryListProps, 'items'> {\n  showSecondary?: boolean;\n  showVisual?: boolean;\n  showActions?: boolean;\n  noItems?: boolean;\n}\n\nexport const SummaryListDemo: Story<SummaryListStoryProps> = (args: SummaryListStoryProps) => {\n  const { create: createModal } = useContext(ModalManagerContext);\n  const [loading, setLoading] = useState(true);\n\n  const [items] = useMockListData(\n    () => {\n      setLoading(false);\n    },\n    { count: args.count }\n  );\n\n  const itemsToRender = items.map(item => {\n    return {\n      ...item,\n      secondary: args.showSecondary ? item.secondary : undefined,\n      visual: args.showVisual ? item.visual : undefined,\n      actions: args.showActions\n        ? ['Action 1', 'Action 2', 'Action 3'].map(text => ({\n            text,\n            id: text\n          }))\n        : undefined\n    };\n  });\n\n  return (\n    <SummaryList\n      name={args.name}\n      icon={args.icon}\n      count={args.loading || loading ? undefined : args.count}\n      items={args.noItems ? [] : itemsToRender}\n      loading={args.loading || loading}\n      noItemsText={args.noItemsText}\n      actions={[\n        {\n          text: `Add new ${args.name}`,\n          id: `${args.name}:addNew`,\n          icon: 'plus',\n          onClick() {\n            createModal(() => {\n              return (\n                <Modal heading={`Add new ${args.name}`}>\n                  {`Content for adding new ${args.name} goes here…`}\n                </Modal>\n              );\n            });\n          }\n        }\n      ]}\n    />\n  );\n};\n\nexport const SummaryListViewAll: Story<SummaryListStoryProps> = (args: SummaryListStoryProps) => {\n  const SummaryListViewAllModal = ({\n    name,\n    count,\n    loading\n  }: OmitStrict<SummaryListProps, 'items'>) => {\n    const [search, setSearch] = useState('');\n    const [modalLoading, setModalLoading] = useState(true);\n\n    const [items] = useMockListData(\n      () => {\n        setModalLoading(false);\n      },\n      {\n        count\n      }\n    );\n\n    const itemsToRender = useMemo(() => {\n      if (search.trim()) {\n        const filterRegex = createStringMatcher(search, 'boundary');\n        return items.filter(({ primary }) => filterRegex.test(primary));\n      }\n\n      return items;\n    }, [items, search]);\n\n    return (\n      <Modal heading={args.name}>\n        <ViewAll\n          loading={loading || modalLoading}\n          items={itemsToRender}\n          actions={[\n            {\n              id: 'addNew',\n              text: `Add ${name}`\n            }\n          ]}\n          searchInputProps={{ onSearchChange: setSearch }}\n        />\n      </Modal>\n    );\n  };\n\n  const { create: createModal } = useContext(ModalManagerContext);\n  const [loading, setLoading] = useState(true);\n\n  const [items] = useMockListData(\n    () => {\n      setLoading(false);\n    },\n    { count: 3 }\n  );\n\n  const itemsToRender = items.map(item => {\n    return {\n      ...item,\n      secondary: args.showSecondary ? item.secondary : undefined,\n      visual: args.showVisual ? item.visual : undefined,\n      actions: args.showActions\n        ? ['Action 1', 'Action 2', 'Action 3'].map(text => ({\n            text,\n            id: text\n          }))\n        : undefined\n    };\n  });\n\n  return (\n    <SummaryList\n      name={args.name}\n      icon={args.icon}\n      count={args.loading || loading ? undefined : args.count}\n      items={args.noItems ? [] : itemsToRender}\n      loading={args.loading || loading}\n      noItemsText={args.noItemsText}\n      actions={[\n        {\n          text: `Add new ${args.name}`,\n          id: `${args.name}:addNew`,\n          icon: 'plus',\n          onClick() {\n            createModal(() => {\n              return (\n                <Modal heading={`Add new ${args.name}`}>\n                  {`Content for adding new ${args.name} goes here…`}\n                </Modal>\n              );\n            });\n          }\n        }\n      ]}\n      onViewAll={() => {\n        createModal(SummaryListViewAllModal, {\n          name: args.name,\n          count: args.count,\n          loading: args.loading\n        });\n      }}\n    />\n  );\n};\n"]}

package/jsx/core/Switch/Switch.stories.d.ts

@@ -4,4 +4,11 @@ declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
 export declare const SwitchDemo: Story<SwitchProps>;
 export declare const SwitchInCard: Story<SwitchProps>;
+interface ConfigurableSwitchProps extends SwitchProps {
+    height?: string;
+    width?: string;
+    onColor?: string;
+    offColor?: string;
+}
+export declare const ConfigurableSwitch: Story<ConfigurableSwitchProps>;
 //# sourceMappingURL=Switch.stories.d.ts.map

package/jsx/core/Switch/Switch.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Switch/Switch.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAgB,WAAW,EAAE,MAAM,yBAAyB,CAAC;;AAIpE,wBAWU;AAEV,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,WAAW,CAYzC,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,WAAW,CAc3C,CAAC"}
+{"version":3,"file":"Switch.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Switch/Switch.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAA+B,WAAW,EAAE,MAAM,yBAAyB,CAAC;;AAInF,wBAWU;AAEV,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,WAAW,CAYzC,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,WAAW,CAc3C,CAAC;AAEF,UAAU,uBAAwB,SAAQ,WAAW;IACnD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,uBAAuB,CAyB7D,CAAC"}

package/jsx/core/Switch/Switch.stories.jsx

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { Card, Switch } from '@pega/cosmos-react-core';
+import { Card, Configuration, Switch } from '@pega/cosmos-react-core';
 import { StyledCard } from './Switch.styles';
 export default {
     title: 'Core/Switch',
@@ -23,4 +23,37 @@ export const SwitchInCard = (args) => {
       <Switch id='switch' on={on} onChange={() => setOn(curr => !curr)} label={args.label} disabled={args.disabled}/>
     </Card>);
 };
+export const ConfigurableSwitch = (args) => {
+    const [on, setOn] = useState(false);
+    return (<Configuration theme={{
+            components: {
+                switch: {
+                    height: args.height,
+                    width: args.width,
+                    on: {
+                        color: args.onColor
+                    },
+                    off: {
+                        color: args.offColor
+                    }
+                }
+            }
+        }}>
+      <Switch on={on} onChange={() => setOn(curr => !curr)} label='Toggle on/off'/>
+    </Configuration>);
+};
+ConfigurableSwitch.args = {
+    height: '1.5rem',
+    width: '3rem',
+    onColor: '#076bc9',
+    offColor: '#939393'
+};
+ConfigurableSwitch.argTypes = {
+    height: { control: { type: 'text' } },
+    width: { control: { type: 'text' } },
+    onColor: { control: { type: 'color' } },
+    offColor: { control: { type: 'color' } },
+    label: { table: { disable: true } },
+    disabled: { table: { disable: true } }
+};
 //# sourceMappingURL=Switch.stories.jsx.map

package/jsx/core/Switch/Switch.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.stories.jsx","sourceRoot":"","sources":["../../../src/core/Switch/Switch.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAe,MAAM,yBAAyB,CAAC;AAEpE,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,eAAe;IACb,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,MAAM;IACjB,IAAI,EAAE;QACJ,KAAK,EAAE,eAAe;QACtB,QAAQ,EAAE,KAAK;KAChB;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;QACpC,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;KAC3C;CACM,CAAC;AAEV,MAAM,CAAC,MAAM,UAAU,GAAuB,CAAC,IAAiB,EAAE,EAAE;IAClE,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpC,OAAO,CACL,CAAC,MAAM,CACL,EAAE,CAAC,QAAQ,CACX,EAAE,CAAC,CAAC,EAAE,CAAC,CACP,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CACrC,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EACxB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAuB,CAAC,IAAiB,EAAE,EAAE;IACpE,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpC,OAAO,CACL,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,UAAU,CAAC,CACnB;MAAA,CAAC,MAAM,CACL,EAAE,CAAC,QAAQ,CACX,EAAE,CAAC,CAAC,EAAE,CAAC,CACP,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CACrC,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAE5B;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { Card, Switch, SwitchProps } from '@pega/cosmos-react-core';\n\nimport { StyledCard } from './Switch.styles';\n\nexport default {\n  title: 'Core/Switch',\n  component: Switch,\n  args: {\n    label: 'Toggle on/off',\n    disabled: false\n  },\n  argTypes: {\n    label: { control: { type: 'text' } },\n    disabled: { control: { type: 'boolean' } }\n  }\n} as Meta;\n\nexport const SwitchDemo: Story<SwitchProps> = (args: SwitchProps) => {\n  const [on, setOn] = useState(false);\n\n  return (\n    <Switch\n      id='switch'\n      on={on}\n      onChange={() => setOn(curr => !curr)}\n      label={args.label}\n      disabled={args.disabled}\n    />\n  );\n};\n\nexport const SwitchInCard: Story<SwitchProps> = (args: SwitchProps) => {\n  const [on, setOn] = useState(false);\n\n  return (\n    <Card as={StyledCard}>\n      <Switch\n        id='switch'\n        on={on}\n        onChange={() => setOn(curr => !curr)}\n        label={args.label}\n        disabled={args.disabled}\n      />\n    </Card>\n  );\n};\n"]}
+{"version":3,"file":"Switch.stories.jsx","sourceRoot":"","sources":["../../../src/core/Switch/Switch.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { Card, Configuration, Switch, SwitchProps } from '@pega/cosmos-react-core';\n\nimport { StyledCard } from './Switch.styles';\n\nexport default {\n  title: 'Core/Switch',\n  component: Switch,\n  args: {\n    label: 'Toggle on/off',\n    disabled: false\n  },\n  argTypes: {\n    label: { control: { type: 'text' } },\n    disabled: { control: { type: 'boolean' } }\n  }\n} as Meta;\n\nexport const SwitchDemo: Story<SwitchProps> = (args: SwitchProps) => {\n  const [on, setOn] = useState(false);\n\n  return (\n    <Switch\n      id='switch'\n      on={on}\n      onChange={() => setOn(curr => !curr)}\n      label={args.label}\n      disabled={args.disabled}\n    />\n  );\n};\n\nexport const SwitchInCard: Story<SwitchProps> = (args: SwitchProps) => {\n  const [on, setOn] = useState(false);\n\n  return (\n    <Card as={StyledCard}>\n      <Switch\n        id='switch'\n        on={on}\n        onChange={() => setOn(curr => !curr)}\n        label={args.label}\n        disabled={args.disabled}\n      />\n    </Card>\n  );\n};\n\ninterface ConfigurableSwitchProps extends SwitchProps {\n  height?: string;\n  width?: string;\n  onColor?: string;\n  offColor?: string;\n}\n\nexport const ConfigurableSwitch: Story<ConfigurableSwitchProps> = (\n  args: ConfigurableSwitchProps\n) => {\n  const [on, setOn] = useState(false);\n\n  return (\n    <Configuration\n      theme={{\n        components: {\n          switch: {\n            height: args.height,\n            width: args.width,\n            on: {\n              color: args.onColor\n            },\n            off: {\n              color: args.offColor\n            }\n          }\n        }\n      }}\n    >\n      <Switch on={on} onChange={() => setOn(curr => !curr)} label='Toggle on/off' />\n    </Configuration>\n  );\n};\n\nConfigurableSwitch.args = {\n  height: '1.5rem',\n  width: '3rem',\n  onColor: '#076bc9',\n  offColor: '#939393'\n};\n\nConfigurableSwitch.argTypes = {\n  height: { control: { type: 'text' } },\n  width: { control: { type: 'text' } },\n  onColor: { control: { type: 'color' } },\n  offColor: { control: { type: 'color' } },\n  label: { table: { disable: true } },\n  disabled: { table: { disable: true } }\n};\n"]}

package/jsx/core/Table/Table.mocks.d.ts

@@ -16,4 +16,10 @@ export declare const tableData: ({
     balance: string;
     emailVerified?: undefined;
 })[];
+export declare const commitsData: {
+    id: string;
+    author: string;
+    date: string;
+    message: string;
+}[];
 //# sourceMappingURL=Table.mocks.d.ts.map

package/jsx/core/Table/Table.mocks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Table.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Table/Table.mocks.tsx"],"names":[],"mappings":";AAAA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;IAgCrB,CAAC"}
+{"version":3,"file":"Table.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Table/Table.mocks.tsx"],"names":[],"mappings":";AAAA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;IAgCrB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;GAuIvB,CAAC"}

package/jsx/core/Table/Table.mocks.jsx

@@ -29,4 +29,138 @@ export const tableData = [
         balance: '-$175'
     }
 ];
+export const commitsData = [
+    {
+        id: '1407c5fcbe460aa06a78b4779583917599d9bd78',
+        author: 'Scott Farmer',
+        date: 'Fri Jan 28',
+        message: 'pkg: Version 3.0.0-dev.2.1.'
+    },
+    {
+        id: '902716be61eed70280178c01db19fwa504f57a51',
+        author: 'Scott Farmer',
+        date: 'Fri Jan 28',
+        message: 'fix(core:Menu): Adds missing icon registrations.'
+    },
+    {
+        id: '8b7916b1d8691fec1d884eadb445019a44ba6c6b',
+        author: 'Sam Singh',
+        date: 'Fri Jan 28',
+        message: 'fix(core:Currency): Fixes decimal truncation. Updates the tests.'
+    },
+    {
+        id: '7d119a2af6d6de9516da3e4eddf8e4523152358e',
+        author: 'Sam Singh',
+        date: 'Wed Jan 26',
+        message: 'docs(work:Details): Updates the demo.'
+    },
+    {
+        id: '41f0875a5b049d40081w0bf8bbae0279ee469fe6',
+        author: 'Scott Farmer',
+        date: 'Tue Jan 25',
+        message: 'fix(core:icons): Updates minus icon to be more centered.'
+    },
+    {
+        id: '9f5996ebd2d9076b53bff2cf8a641v292bcbc256',
+        author: 'Anna Florence',
+        date: 'Wed Jan 26',
+        message: 'docs(core:Toaster): Modifies Toaster demo to incorporate wrapping Toaster component.'
+    },
+    {
+        id: '6125f52db79bc1ada47e195e36d01927443b0e1c',
+        author: 'Anna Florence',
+        date: 'Tue Jan 25',
+        message: 'docs: Modifies copy-demos script to maintain relative paths for all inner demo package imports.'
+    },
+    {
+        id: '1eceb3ef9539e22225ab287428d7902ee19b5753',
+        author: 'Scott Farmer',
+        date: 'Fri Jan 21',
+        message: 'pkg: Version 3.0.0-dev.2.0.'
+    },
+    {
+        id: 'aeb1e26fa8f0f2ae29f93ae07ac3c98dde3ade46',
+        author: 'Scott Farmer',
+        date: 'Fri Jan 21',
+        message: 'pkg: Updaes types packages for React 17.'
+    },
+    {
+        id: '55a2c452559a59bcadedb0020b03675c3234a238',
+        author: 'Jan Stark',
+        date: 'Mon Jan 17',
+        message: 'fix(core:MultiStep): Fixes position of step labels.'
+    },
+    {
+        id: 'f1e1a36e86de7a8e33684b44203a36d6622b39f6',
+        author: 'Yan Miller',
+        date: 'Wed Jan 19',
+        message: 'fix(social:Email): Fixes the persistent utility resize issue with email components.'
+    },
+    {
+        id: '82ed6caa36f4518de7af66aff80dee7b128c23d4',
+        author: 'Anna Florence',
+        date: 'Wed Jan 19',
+        message: 'docs: Adds demos for component customization, configuration, and theme.'
+    },
+    {
+        id: '6e0702db4cc0c59375006dfd36f9a943953d0716',
+        author: 'Anna Florence',
+        date: 'Wed Jan 19',
+        message: 'style: Re-orders component theme definitions to be in alphabetical order.'
+    },
+    {
+        id: '3cc54ccc2a2287019594eda4db68838aa1f32b0b',
+        author: 'Sam Singh',
+        date: 'Fri Jan 21',
+        message: 'docs(work:Details): Fixes displaying currency fields in the demo file.'
+    },
+    {
+        id: '38ba5f8a83681345d9568b9a7c3693bd30af7be8',
+        author: 'Sam Singh',
+        date: 'Fri Jan 21',
+        message: 'fix(core:Number)!: Enables rounding for NumberDisplay component. Fixes decimal precision support.'
+    },
+    {
+        id: '5914d105574e12f4c3aae6a616c54ce9cc4f70bf',
+        author: 'Yan Miller',
+        date: 'Thu Jan 20',
+        message: 'fix(core:TextArea): Fixes ios safari focus styling issue.'
+    },
+    {
+        id: 'b03f783df31634a334e1c46c76c30391a8907080',
+        author: 'Sam Singh',
+        date: 'Mon Dec 20',
+        message: 'fix(core:Currency)!: Enables rounding for CurrencyDisplay.'
+    },
+    {
+        id: '759536fb5e257a3a3c0b85d3cb2b63565f3b30e1',
+        author: 'Scott Farmer',
+        date: 'Wed Jan 19',
+        message: 'pkg: Updates development versions of React and ReactDOM to 17.0.2.'
+    },
+    {
+        id: 'dcf4a23758f6eaca62bad5f50a9bf1b281ad931b',
+        author: 'Sam Singh',
+        date: 'Tue Jan 18',
+        message: 'refactor(build:Workbench): Optimizes CSS for zoom.'
+    },
+    {
+        id: '94186cf82de48c3a4cbea158f25ad471cd49b9e4',
+        author: 'Sam Singh',
+        date: 'Tue Jan 18',
+        message: 'fix(build:Workbench): Adds tooltip to close button.'
+    },
+    {
+        id: 'da16bdc203ddb10a5ad9c48882a73d9587daa198',
+        author: 'Sam Singh',
+        date: 'Mon Jan 17',
+        message: "fix(build:Workbench): Corrects component's expanding in Page Templates."
+    },
+    {
+        id: '8dd5d2190aaaf72ae4aac70af42d16365845fb18',
+        author: 'Sam Singh',
+        date: 'Mon Jan 17',
+        message: 'fix(build:Workbench): Truncates long headings.'
+    }
+];
 //# sourceMappingURL=Table.mocks.jsx.map

package/jsx/core/Table/Table.mocks.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Table.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Table/Table.mocks.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB;QACE,EAAE,EAAE,MAAM;QACV,IAAI,EAAE,YAAY;QAClB,GAAG,EAAE,YAAY;QACjB,OAAO,EAAE,YAAY;QACrB,KAAK,EAAE,kBAAkB;QACzB,aAAa,EAAE,IAAI;QACnB,OAAO,EAAE,QAAQ;KAClB;IACD;QACE,EAAE,EAAE,MAAM;QACV,IAAI,EAAE,WAAW;QACjB,GAAG,EAAE,YAAY;QACjB,OAAO,EAAE,EAAE;QACX,KAAK,EAAE,qBAAqB;QAC5B,aAAa,EAAE,IAAI;QACnB,OAAO,EAAE,QAAQ;KAClB;IACD;QACE,EAAE,EAAE,MAAM;QACV,IAAI,EAAE,UAAU;QAChB,GAAG,EAAE,YAAY;QACjB,OAAO,EAAE,CACP,EACE;QAAA,CAAC,GAAG,CAAC,YAAY,EAAE,GAAG,CACtB;QAAA,CAAC,GAAG,CAAC,gBAAgB,EAAE,GAAG,CAC5B;MAAA,GAAG,CACJ;QACD,KAAK,EAAE,EAAE;QACT,OAAO,EAAE,OAAO;KACjB;CACF,CAAC","sourcesContent":["export const tableData = [\n  {\n    id: '1234',\n    name: 'Jane Smith',\n    dob: '12/31/1990',\n    address: 'Boston, MA',\n    email: 'jsmith@email.com',\n    emailVerified: true,\n    balance: '$2,200'\n  },\n  {\n    id: '5678',\n    name: 'Joe Smith',\n    dob: '01/01/1980',\n    address: '',\n    email: 'joe.smith@email.com',\n    emailVerified: true,\n    balance: '$1,350'\n  },\n  {\n    id: '0000',\n    name: 'Mary Lou',\n    dob: '06/15/1985',\n    address: (\n      <>\n        <div>100 Main St.</div>\n        <div>Springfield, USA</div>\n      </>\n    ),\n    email: '',\n    balance: '-$175'\n  }\n];\n"]}
+{"version":3,"file":"Table.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Table/Table.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["export const tableData = [\n  {\n    id: '1234',\n    name: 'Jane Smith',\n    dob: '12/31/1990',\n    address: 'Boston, MA',\n    email: 'jsmith@email.com',\n    emailVerified: true,\n    balance: '$2,200'\n  },\n  {\n    id: '5678',\n    name: 'Joe Smith',\n    dob: '01/01/1980',\n    address: '',\n    email: 'joe.smith@email.com',\n    emailVerified: true,\n    balance: '$1,350'\n  },\n  {\n    id: '0000',\n    name: 'Mary Lou',\n    dob: '06/15/1985',\n    address: (\n      <>\n        <div>100 Main St.</div>\n        <div>Springfield, USA</div>\n      </>\n    ),\n    email: '',\n    balance: '-$175'\n  }\n];\n\nexport const commitsData = [\n  {\n    id: '1407c5fcbe460aa06a78b4779583917599d9bd78',\n    author: 'Scott Farmer',\n    date: 'Fri Jan 28',\n    message: 'pkg: Version 3.0.0-dev.2.1.'\n  },\n  {\n    id: '902716be61eed70280178c01db19fwa504f57a51',\n    author: 'Scott Farmer',\n    date: 'Fri Jan 28',\n    message: 'fix(core:Menu): Adds missing icon registrations.'\n  },\n  {\n    id: '8b7916b1d8691fec1d884eadb445019a44ba6c6b',\n    author: 'Sam Singh',\n    date: 'Fri Jan 28',\n    message: 'fix(core:Currency): Fixes decimal truncation. Updates the tests.'\n  },\n  {\n    id: '7d119a2af6d6de9516da3e4eddf8e4523152358e',\n    author: 'Sam Singh',\n    date: 'Wed Jan 26',\n    message: 'docs(work:Details): Updates the demo.'\n  },\n  {\n    id: '41f0875a5b049d40081w0bf8bbae0279ee469fe6',\n    author: 'Scott Farmer',\n    date: 'Tue Jan 25',\n    message: 'fix(core:icons): Updates minus icon to be more centered.'\n  },\n  {\n    id: '9f5996ebd2d9076b53bff2cf8a641v292bcbc256',\n    author: 'Anna Florence',\n    date: 'Wed Jan 26',\n    message: 'docs(core:Toaster): Modifies Toaster demo to incorporate wrapping Toaster component.'\n  },\n  {\n    id: '6125f52db79bc1ada47e195e36d01927443b0e1c',\n    author: 'Anna Florence',\n    date: 'Tue Jan 25',\n    message:\n      'docs: Modifies copy-demos script to maintain relative paths for all inner demo package imports.'\n  },\n  {\n    id: '1eceb3ef9539e22225ab287428d7902ee19b5753',\n    author: 'Scott Farmer',\n    date: 'Fri Jan 21',\n    message: 'pkg: Version 3.0.0-dev.2.0.'\n  },\n  {\n    id: 'aeb1e26fa8f0f2ae29f93ae07ac3c98dde3ade46',\n    author: 'Scott Farmer',\n    date: 'Fri Jan 21',\n    message: 'pkg: Updaes types packages for React 17.'\n  },\n  {\n    id: '55a2c452559a59bcadedb0020b03675c3234a238',\n    author: 'Jan Stark',\n    date: 'Mon Jan 17',\n    message: 'fix(core:MultiStep): Fixes position of step labels.'\n  },\n  {\n    id: 'f1e1a36e86de7a8e33684b44203a36d6622b39f6',\n    author: 'Yan Miller',\n    date: 'Wed Jan 19',\n    message: 'fix(social:Email): Fixes the persistent utility resize issue with email components.'\n  },\n  {\n    id: '82ed6caa36f4518de7af66aff80dee7b128c23d4',\n    author: 'Anna Florence',\n    date: 'Wed Jan 19',\n    message: 'docs: Adds demos for component customization, configuration, and theme.'\n  },\n  {\n    id: '6e0702db4cc0c59375006dfd36f9a943953d0716',\n    author: 'Anna Florence',\n    date: 'Wed Jan 19',\n    message: 'style: Re-orders component theme definitions to be in alphabetical order.'\n  },\n  {\n    id: '3cc54ccc2a2287019594eda4db68838aa1f32b0b',\n    author: 'Sam Singh',\n    date: 'Fri Jan 21',\n    message: 'docs(work:Details): Fixes displaying currency fields in the demo file.'\n  },\n  {\n    id: '38ba5f8a83681345d9568b9a7c3693bd30af7be8',\n    author: 'Sam Singh',\n    date: 'Fri Jan 21',\n    message:\n      'fix(core:Number)!: Enables rounding for NumberDisplay component. Fixes decimal precision support.'\n  },\n  {\n    id: '5914d105574e12f4c3aae6a616c54ce9cc4f70bf',\n    author: 'Yan Miller',\n    date: 'Thu Jan 20',\n    message: 'fix(core:TextArea): Fixes ios safari focus styling issue.'\n  },\n  {\n    id: 'b03f783df31634a334e1c46c76c30391a8907080',\n    author: 'Sam Singh',\n    date: 'Mon Dec 20',\n    message: 'fix(core:Currency)!: Enables rounding for CurrencyDisplay.'\n  },\n  {\n    id: '759536fb5e257a3a3c0b85d3cb2b63565f3b30e1',\n    author: 'Scott Farmer',\n    date: 'Wed Jan 19',\n    message: 'pkg: Updates development versions of React and ReactDOM to 17.0.2.'\n  },\n  {\n    id: 'dcf4a23758f6eaca62bad5f50a9bf1b281ad931b',\n    author: 'Sam Singh',\n    date: 'Tue Jan 18',\n    message: 'refactor(build:Workbench): Optimizes CSS for zoom.'\n  },\n  {\n    id: '94186cf82de48c3a4cbea158f25ad471cd49b9e4',\n    author: 'Sam Singh',\n    date: 'Tue Jan 18',\n    message: 'fix(build:Workbench): Adds tooltip to close button.'\n  },\n  {\n    id: 'da16bdc203ddb10a5ad9c48882a73d9587daa198',\n    author: 'Sam Singh',\n    date: 'Mon Jan 17',\n    message: \"fix(build:Workbench): Corrects component's expanding in Page Templates.\"\n  },\n  {\n    id: '8dd5d2190aaaf72ae4aac70af42d16365845fb18',\n    author: 'Sam Singh',\n    date: 'Mon Jan 17',\n    message: 'fix(build:Workbench): Truncates long headings.'\n  }\n];\n"]}

package/jsx/core/Table/Table.stories.d.ts

@@ -11,4 +11,29 @@ interface TableStoryProps {
 }
 export declare const TableDemo: Story<TableStoryProps>;
 export declare const StyledTableDemo: Story<TableStoryProps>;
+interface ConfigurableTableProps extends TableStoryProps {
+    headerFontSize?: string;
+    headerFontWeight?: string;
+    headerForegroundColor?: string;
+    headerBackgroundColor?: string;
+    headerVerticalSpacing?: number;
+    headerHorizontalSpacing?: number;
+    headerBorderWidth?: string;
+    headerBorderColor?: string;
+    bodyForegroundColor?: string;
+    bodyBackgroundColor?: string;
+    bodyVerticalSpacing?: number;
+    bodyHorizontalSpacing?: number;
+    bodyBorderWidth?: string;
+    bodyBorderColor?: string;
+    borderHorizontalInner?: boolean;
+    borderHorizontalOuter?: boolean;
+    borderVerticalInner?: boolean;
+    borderVerticalOuter?: boolean;
+    spacingHorizontalInner?: boolean;
+    spacingHorizontalOuter?: boolean;
+    spacingVerticalInner?: boolean;
+    spacingVerticalOuter?: boolean;
+}
+export declare const ConfigurableTable: Story<ConfigurableTableProps>;
 //# sourceMappingURL=Table.stories.d.ts.map

package/jsx/core/Table/Table.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Table.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Table/Table.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAA8B,UAAU,EAAE,MAAM,yBAAyB,CAAC;;AAKjF,wBAiBU;AAEV,UAAU,eAAe;IACvB,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC5B,cAAc,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;IAChC,cAAc,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,eAAe,CAmB5C,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,eAAe,CAuClD,CAAC"}
+{"version":3,"file":"Table.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Table/Table.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAA8B,UAAU,EAAiB,MAAM,yBAAyB,CAAC;;AAKhG,wBAiBU;AAEV,UAAU,eAAe;IACvB,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC5B,cAAc,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;IAChC,cAAc,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,eAAe,CAmB5C,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,eAAe,CAuClD,CAAC;AAEF,UAAU,sBAAuB,SAAQ,eAAe;IACtD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,sBAAsB,CAuE3D,CAAC"}

package/jsx/core/Table/Table.stories.jsx

@@ -1,4 +1,4 @@
-import { Status, Table } from '@pega/cosmos-react-core';
+import { Status, Table, Configuration } from '@pega/cosmos-react-core';
 import { tableData } from './Table.mocks';
 import { StyledBalance } from './Table.styles';
 export default {
@@ -55,4 +55,123 @@ export const StyledTableDemo = (args) => {
     ];
     return (<Table title={args.title} hoverHighlight={args.hoverHighlight} loading={args.loading} loadingMessage={args.loadingMessage} data={args.emptyTable ? [] : tableData} columns={columns}/>);
 };
+export const ConfigurableTable = (args) => {
+    const columns = [
+        { renderer: data => <b>{data.name}</b>, label: 'Name' },
+        { renderer: 'dob', label: 'Date of Birth' },
+        { renderer: 'address', label: 'Address' },
+        {
+            renderer: data => {
+                return (<>
+            {data.email && data.emailVerified && <Status variant='success'>{data.email}</Status>}
+            {data.email && !data.emailVerified && <Status variant='urgent'>{data.email}</Status>}
+          </>);
+            },
+            label: 'Email'
+        },
+        {
+            renderer: data => {
+                return (<StyledBalance negativeBalance={data.balance.startsWith('-')}>
+            {data.balance}
+          </StyledBalance>);
+            },
+            label: 'Account Balance',
+            align: 'right'
+        }
+    ];
+    return (<Configuration theme={{
+            components: {
+                table: {
+                    header: {
+                        'font-size': args.headerFontSize,
+                        'font-weight': args.headerFontWeight,
+                        'foreground-color': args.headerForegroundColor,
+                        'background-color': args.headerBackgroundColor,
+                        'vertical-spacing': args.headerVerticalSpacing,
+                        'horizontal-spacing': args.headerHorizontalSpacing,
+                        'border-width': args.headerBorderWidth,
+                        'border-color': args.headerBorderColor
+                    },
+                    body: {
+                        'foreground-color': args.bodyForegroundColor,
+                        'background-color': args.bodyBackgroundColor,
+                        'vertical-spacing': args.bodyVerticalSpacing,
+                        'horizontal-spacing': args.bodyHorizontalSpacing,
+                        'border-width': args.bodyBorderWidth,
+                        'border-color': args.bodyBorderColor
+                    },
+                    border: {
+                        'horizontal-inner': args.borderHorizontalInner,
+                        'horizontal-outer': args.borderHorizontalOuter,
+                        'vertical-inner': args.borderVerticalInner,
+                        'vertical-outer': args.borderVerticalOuter
+                    },
+                    spacing: {
+                        'horizontal-inner': args.spacingHorizontalInner,
+                        'horizontal-outer': args.spacingHorizontalOuter,
+                        'vertical-inner': args.spacingVerticalInner,
+                        'vertical-outer': args.spacingVerticalOuter
+                    }
+                }
+            }
+        }}>
+      <Table title='Accounts' data={tableData} columns={columns}/>
+    </Configuration>);
+};
+ConfigurableTable.args = {
+    headerFontSize: 's',
+    headerFontWeight: '600',
+    headerForegroundColor: '#000000',
+    headerBackgroundColor: '#71baff',
+    headerVerticalSpacing: 1,
+    headerHorizontalSpacing: 2,
+    headerBorderWidth: '0.0625rem',
+    headerBorderColor: '#cfcfcf',
+    bodyForegroundColor: '#000000',
+    bodyBackgroundColor: '#e2f1ff',
+    bodyVerticalSpacing: 1,
+    bodyHorizontalSpacing: 1,
+    bodyBorderWidth: '0.0625rem',
+    bodyBorderColor: '#cfcfcf',
+    borderHorizontalInner: true,
+    borderHorizontalOuter: true,
+    borderVerticalInner: true,
+    borderVerticalOuter: true,
+    spacingHorizontalInner: true,
+    spacingHorizontalOuter: true,
+    spacingVerticalInner: true,
+    spacingVerticalOuter: true
+};
+ConfigurableTable.argTypes = {
+    headerFontSize: {
+        options: ['xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl'],
+        control: { type: 'select' }
+    },
+    headerFontWeight: { control: { type: 'text' } },
+    headerForegroundColor: { control: { type: 'color' } },
+    headerBackgroundColor: { control: { type: 'color' } },
+    headerVerticalSpacing: { control: { type: 'number' } },
+    headerHorizontalSpacing: { control: { type: 'number' } },
+    headerBorderWidth: { control: { type: 'text' } },
+    headerBorderColor: { control: { type: 'color' } },
+    bodyForegroundColor: { control: { type: 'color' } },
+    bodyBackgroundColor: { control: { type: 'color' } },
+    bodyVerticalSpacing: { control: { type: 'number' } },
+    bodyHorizontalSpacing: { control: { type: 'number' } },
+    bodyBorderWidth: { control: { type: 'text' } },
+    bodyBorderColor: { control: { type: 'color' } },
+    borderHorizontalInner: { control: { type: 'boolean' } },
+    borderHorizontalOuter: { control: { type: 'boolean' } },
+    borderVerticalInner: { control: { type: 'boolean' } },
+    borderVerticalOuter: { control: { type: 'boolean' } },
+    spacingHorizontalInner: { control: { type: 'boolean' } },
+    spacingHorizontalOuter: { control: { type: 'boolean' } },
+    spacingVerticalInner: { control: { type: 'boolean' } },
+    spacingVerticalOuter: { control: { type: 'boolean' } },
+    title: { table: { disable: true } },
+    hoverHighlight: { table: { disable: true } },
+    loading: { table: { disable: true } },
+    loadingMessage: { table: { disable: true } },
+    emptyTable: { table: { disable: true } }
+};
 //# sourceMappingURL=Table.stories.jsx.map

package/jsx/core/Table/Table.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Table.stories.jsx","sourceRoot":"","sources":["../../../src/core/Table/Table.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,KAAK,EAA2B,MAAM,yBAAyB,CAAC;AAEjF,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE/C,eAAe;IACb,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,KAAK;IAChB,IAAI,EAAE;QACJ,KAAK,EAAE,UAAU;QACjB,cAAc,EAAE,KAAK;QACrB,OAAO,EAAE,KAAK;QACd,cAAc,EAAE,cAAc;QAC9B,UAAU,EAAE,KAAK;KAClB;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;QACpC,cAAc,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;QAChD,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;QACzC,cAAc,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;QAC7C,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;KAC7C;CACM,CAAC;AAUV,MAAM,CAAC,MAAM,SAAS,GAA2B,CAAC,IAAqB,EAAE,EAAE;IACzE,MAAM,OAAO,GAA4C;QACvD,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE;QACnC,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE;QAC3C,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE;QACzC,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;QACrC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,OAAO,EAAE;KAClE,CAAC;IAEF,OAAO,CACL,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,cAAc,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CACpC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CACtB,cAAc,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CACpC,IAAI,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CACvC,OAAO,CAAC,CAAC,OAAO,CAAC,EACjB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAA2B,CAAC,IAAqB,EAAE,EAAE;IAC/E,MAAM,OAAO,GAA4C;QACvD,EAAE,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE;QACvD,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE;QAC3C,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE;QACzC;YACE,QAAQ,EAAE,IAAI,CAAC,EAAE;gBACf,OAAO,CACL,EACE;YAAA,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,aAAa,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC,CACpF;YAAA,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC,CACtF;UAAA,GAAG,CACJ,CAAC;YACJ,CAAC;YACD,KAAK,EAAE,OAAO;SACf;QACD;YACE,QAAQ,EAAE,IAAI,CAAC,EAAE;gBACf,OAAO,CACL,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAC3D;YAAA,CAAC,IAAI,CAAC,OAAO,CACf;UAAA,EAAE,aAAa,CAAC,CACjB,CAAC;YACJ,CAAC;YACD,KAAK,EAAE,iBAAiB;YACxB,KAAK,EAAE,OAAO;SACf;KACF,CAAC;IAEF,OAAO,CACL,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,cAAc,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CACpC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CACtB,cAAc,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CACpC,IAAI,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CACvC,OAAO,CAAC,CAAC,OAAO,CAAC,EACjB,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Status, Table, ColumnProps, TableProps } from '@pega/cosmos-react-core';\n\nimport { tableData } from './Table.mocks';\nimport { StyledBalance } from './Table.styles';\n\nexport default {\n  title: 'Core/Table',\n  component: Table,\n  args: {\n    title: 'Accounts',\n    hoverHighlight: false,\n    loading: false,\n    loadingMessage: 'Loading data',\n    emptyTable: false\n  },\n  argTypes: {\n    title: { control: { type: 'text' } },\n    hoverHighlight: { control: { type: 'boolean' } },\n    loading: { control: { type: 'boolean' } },\n    loadingMessage: { control: { type: 'text' } },\n    emptyTable: { control: { type: 'boolean' } }\n  }\n} as Meta;\n\ninterface TableStoryProps {\n  title?: TableProps['title'];\n  hoverHighlight?: TableProps['hoverHighlight'];\n  loading?: TableProps['loading'];\n  loadingMessage?: TableProps['loadingMessage'];\n  emptyTable?: boolean;\n}\n\nexport const TableDemo: Story<TableStoryProps> = (args: TableStoryProps) => {\n  const columns: ColumnProps<typeof tableData[number]>[] = [\n    { renderer: 'name', label: 'Name' },\n    { renderer: 'dob', label: 'Date of Birth' },\n    { renderer: 'address', label: 'Address' },\n    { renderer: 'email', label: 'Email' },\n    { renderer: 'balance', label: 'Account Balance', align: 'right' }\n  ];\n\n  return (\n    <Table\n      title={args.title}\n      hoverHighlight={args.hoverHighlight}\n      loading={args.loading}\n      loadingMessage={args.loadingMessage}\n      data={args.emptyTable ? [] : tableData}\n      columns={columns}\n    />\n  );\n};\n\nexport const StyledTableDemo: Story<TableStoryProps> = (args: TableStoryProps) => {\n  const columns: ColumnProps<typeof tableData[number]>[] = [\n    { renderer: data => <b>{data.name}</b>, label: 'Name' },\n    { renderer: 'dob', label: 'Date of Birth' },\n    { renderer: 'address', label: 'Address' },\n    {\n      renderer: data => {\n        return (\n          <>\n            {data.email && data.emailVerified && <Status variant='success'>{data.email}</Status>}\n            {data.email && !data.emailVerified && <Status variant='urgent'>{data.email}</Status>}\n          </>\n        );\n      },\n      label: 'Email'\n    },\n    {\n      renderer: data => {\n        return (\n          <StyledBalance negativeBalance={data.balance.startsWith('-')}>\n            {data.balance}\n          </StyledBalance>\n        );\n      },\n      label: 'Account Balance',\n      align: 'right'\n    }\n  ];\n\n  return (\n    <Table\n      title={args.title}\n      hoverHighlight={args.hoverHighlight}\n      loading={args.loading}\n      loadingMessage={args.loadingMessage}\n      data={args.emptyTable ? [] : tableData}\n      columns={columns}\n    />\n  );\n};\n"]}
+{"version":3,"file":"Table.stories.jsx","sourceRoot":"","sources":["../../../src/core/Table/Table.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Status, Table, ColumnProps, TableProps, Configuration } from '@pega/cosmos-react-core';\n\nimport { tableData } from './Table.mocks';\nimport { StyledBalance } from './Table.styles';\n\nexport default {\n  title: 'Core/Table',\n  component: Table,\n  args: {\n    title: 'Accounts',\n    hoverHighlight: false,\n    loading: false,\n    loadingMessage: 'Loading data',\n    emptyTable: false\n  },\n  argTypes: {\n    title: { control: { type: 'text' } },\n    hoverHighlight: { control: { type: 'boolean' } },\n    loading: { control: { type: 'boolean' } },\n    loadingMessage: { control: { type: 'text' } },\n    emptyTable: { control: { type: 'boolean' } }\n  }\n} as Meta;\n\ninterface TableStoryProps {\n  title?: TableProps['title'];\n  hoverHighlight?: TableProps['hoverHighlight'];\n  loading?: TableProps['loading'];\n  loadingMessage?: TableProps['loadingMessage'];\n  emptyTable?: boolean;\n}\n\nexport const TableDemo: Story<TableStoryProps> = (args: TableStoryProps) => {\n  const columns: ColumnProps<typeof tableData[number]>[] = [\n    { renderer: 'name', label: 'Name' },\n    { renderer: 'dob', label: 'Date of Birth' },\n    { renderer: 'address', label: 'Address' },\n    { renderer: 'email', label: 'Email' },\n    { renderer: 'balance', label: 'Account Balance', align: 'right' }\n  ];\n\n  return (\n    <Table\n      title={args.title}\n      hoverHighlight={args.hoverHighlight}\n      loading={args.loading}\n      loadingMessage={args.loadingMessage}\n      data={args.emptyTable ? [] : tableData}\n      columns={columns}\n    />\n  );\n};\n\nexport const StyledTableDemo: Story<TableStoryProps> = (args: TableStoryProps) => {\n  const columns: ColumnProps<typeof tableData[number]>[] = [\n    { renderer: data => <b>{data.name}</b>, label: 'Name' },\n    { renderer: 'dob', label: 'Date of Birth' },\n    { renderer: 'address', label: 'Address' },\n    {\n      renderer: data => {\n        return (\n          <>\n            {data.email && data.emailVerified && <Status variant='success'>{data.email}</Status>}\n            {data.email && !data.emailVerified && <Status variant='urgent'>{data.email}</Status>}\n          </>\n        );\n      },\n      label: 'Email'\n    },\n    {\n      renderer: data => {\n        return (\n          <StyledBalance negativeBalance={data.balance.startsWith('-')}>\n            {data.balance}\n          </StyledBalance>\n        );\n      },\n      label: 'Account Balance',\n      align: 'right'\n    }\n  ];\n\n  return (\n    <Table\n      title={args.title}\n      hoverHighlight={args.hoverHighlight}\n      loading={args.loading}\n      loadingMessage={args.loadingMessage}\n      data={args.emptyTable ? [] : tableData}\n      columns={columns}\n    />\n  );\n};\n\ninterface ConfigurableTableProps extends TableStoryProps {\n  headerFontSize?: string;\n  headerFontWeight?: string;\n  headerForegroundColor?: string;\n  headerBackgroundColor?: string;\n  headerVerticalSpacing?: number;\n  headerHorizontalSpacing?: number;\n  headerBorderWidth?: string;\n  headerBorderColor?: string;\n  bodyForegroundColor?: string;\n  bodyBackgroundColor?: string;\n  bodyVerticalSpacing?: number;\n  bodyHorizontalSpacing?: number;\n  bodyBorderWidth?: string;\n  bodyBorderColor?: string;\n  borderHorizontalInner?: boolean;\n  borderHorizontalOuter?: boolean;\n  borderVerticalInner?: boolean;\n  borderVerticalOuter?: boolean;\n  spacingHorizontalInner?: boolean;\n  spacingHorizontalOuter?: boolean;\n  spacingVerticalInner?: boolean;\n  spacingVerticalOuter?: boolean;\n}\n\nexport const ConfigurableTable: Story<ConfigurableTableProps> = (args: ConfigurableTableProps) => {\n  const columns: ColumnProps<typeof tableData[number]>[] = [\n    { renderer: data => <b>{data.name}</b>, label: 'Name' },\n    { renderer: 'dob', label: 'Date of Birth' },\n    { renderer: 'address', label: 'Address' },\n    {\n      renderer: data => {\n        return (\n          <>\n            {data.email && data.emailVerified && <Status variant='success'>{data.email}</Status>}\n            {data.email && !data.emailVerified && <Status variant='urgent'>{data.email}</Status>}\n          </>\n        );\n      },\n      label: 'Email'\n    },\n    {\n      renderer: data => {\n        return (\n          <StyledBalance negativeBalance={data.balance.startsWith('-')}>\n            {data.balance}\n          </StyledBalance>\n        );\n      },\n      label: 'Account Balance',\n      align: 'right'\n    }\n  ];\n\n  return (\n    <Configuration\n      theme={{\n        components: {\n          table: {\n            header: {\n              'font-size': args.headerFontSize,\n              'font-weight': args.headerFontWeight,\n              'foreground-color': args.headerForegroundColor,\n              'background-color': args.headerBackgroundColor,\n              'vertical-spacing': args.headerVerticalSpacing,\n              'horizontal-spacing': args.headerHorizontalSpacing,\n              'border-width': args.headerBorderWidth,\n              'border-color': args.headerBorderColor\n            },\n            body: {\n              'foreground-color': args.bodyForegroundColor,\n              'background-color': args.bodyBackgroundColor,\n              'vertical-spacing': args.bodyVerticalSpacing,\n              'horizontal-spacing': args.bodyHorizontalSpacing,\n              'border-width': args.bodyBorderWidth,\n              'border-color': args.bodyBorderColor\n            },\n            border: {\n              'horizontal-inner': args.borderHorizontalInner,\n              'horizontal-outer': args.borderHorizontalOuter,\n              'vertical-inner': args.borderVerticalInner,\n              'vertical-outer': args.borderVerticalOuter\n            },\n            spacing: {\n              'horizontal-inner': args.spacingHorizontalInner,\n              'horizontal-outer': args.spacingHorizontalOuter,\n              'vertical-inner': args.spacingVerticalInner,\n              'vertical-outer': args.spacingVerticalOuter\n            }\n          }\n        }\n      }}\n    >\n      <Table title='Accounts' data={tableData} columns={columns} />\n    </Configuration>\n  );\n};\n\nConfigurableTable.args = {\n  headerFontSize: 's',\n  headerFontWeight: '600',\n  headerForegroundColor: '#000000',\n  headerBackgroundColor: '#71baff',\n  headerVerticalSpacing: 1,\n  headerHorizontalSpacing: 2,\n  headerBorderWidth: '0.0625rem',\n  headerBorderColor: '#cfcfcf',\n  bodyForegroundColor: '#000000',\n  bodyBackgroundColor: '#e2f1ff',\n  bodyVerticalSpacing: 1,\n  bodyHorizontalSpacing: 1,\n  bodyBorderWidth: '0.0625rem',\n  bodyBorderColor: '#cfcfcf',\n  borderHorizontalInner: true,\n  borderHorizontalOuter: true,\n  borderVerticalInner: true,\n  borderVerticalOuter: true,\n  spacingHorizontalInner: true,\n  spacingHorizontalOuter: true,\n  spacingVerticalInner: true,\n  spacingVerticalOuter: true\n};\n\nConfigurableTable.argTypes = {\n  headerFontSize: {\n    options: ['xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl'],\n    control: { type: 'select' }\n  },\n  headerFontWeight: { control: { type: 'text' } },\n  headerForegroundColor: { control: { type: 'color' } },\n  headerBackgroundColor: { control: { type: 'color' } },\n  headerVerticalSpacing: { control: { type: 'number' } },\n  headerHorizontalSpacing: { control: { type: 'number' } },\n  headerBorderWidth: { control: { type: 'text' } },\n  headerBorderColor: { control: { type: 'color' } },\n  bodyForegroundColor: { control: { type: 'color' } },\n  bodyBackgroundColor: { control: { type: 'color' } },\n  bodyVerticalSpacing: { control: { type: 'number' } },\n  bodyHorizontalSpacing: { control: { type: 'number' } },\n  bodyBorderWidth: { control: { type: 'text' } },\n  bodyBorderColor: { control: { type: 'color' } },\n  borderHorizontalInner: { control: { type: 'boolean' } },\n  borderHorizontalOuter: { control: { type: 'boolean' } },\n  borderVerticalInner: { control: { type: 'boolean' } },\n  borderVerticalOuter: { control: { type: 'boolean' } },\n  spacingHorizontalInner: { control: { type: 'boolean' } },\n  spacingHorizontalOuter: { control: { type: 'boolean' } },\n  spacingVerticalInner: { control: { type: 'boolean' } },\n  spacingVerticalOuter: { control: { type: 'boolean' } },\n  title: { table: { disable: true } },\n  hoverHighlight: { table: { disable: true } },\n  loading: { table: { disable: true } },\n  loadingMessage: { table: { disable: true } },\n  emptyTable: { table: { disable: true } }\n};\n"]}

package/jsx/core/Tabs/Tabs.stories.d.ts

@@ -2,6 +2,14 @@ import { Meta, Story } from '@storybook/react';
 import { TabsProps } from '@pega/cosmos-react-core';
 declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
-export declare const TabsDemo: Story<TabsProps>;
-export declare const TabsCountDemo: Story<TabsProps>;
+interface TabDemoProps {
+    type: 'horizontal' | 'vertical';
+}
+export declare const TabsDemo: Story<TabDemoProps>;
+export declare const TabsCountDemo: Story<TabDemoProps>;
+interface ConfigurableTabsProps {
+    foreground?: string;
+    type?: TabsProps['type'];
+}
+export declare const ConfigurableTabs: Story<ConfigurableTabsProps>;
 //# sourceMappingURL=Tabs.stories.d.ts.map

package/jsx/core/Tabs/Tabs.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAwB,SAAS,EAAE,MAAM,yBAAyB,CAAC;;AAE1E,wBASU;AAEV,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,SAAS,CA6BrC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,SAAS,CA6B1C,CAAC"}
+{"version":3,"file":"Tabs.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAuC,SAAS,EAAE,MAAM,yBAAyB,CAAC;;AAEzF,wBASU;AAEV,UAAU,YAAY;IACpB,IAAI,EAAE,YAAY,GAAG,UAAU,CAAC;CACjC;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,YAAY,CA6BxC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,YAAY,CA6B7C,CAAC;AAEF,UAAU,qBAAqB;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;CAC1B;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,qBAAqB,CAuCzD,CAAC"}