@pega/cosmos-react-demos 2.1.3 → 2.1.6

package/lib/core/Text/Text.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Text.stories.js","sourceRoot":"","sources":["../../../src/core/Text/Text.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAa,MAAM,yBAAyB,CAAC;AAE1D,eAAe;IACb,KAAK,EAAE,WAAW;IAClB,SAAS,EAAE,IAAI;CACR,CAAC;AAEV,MAAM,CAAC,MAAM,QAAQ,GAAqB,CAAC,IAAe,EAAE,EAAE;IAC5D,OAAO,CACL,KAAC,IAAI,IAAC,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,oCAEzC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,QAAQ,CAAC,IAAI,GAAG;IACd,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,SAAS;CAClB,CAAC;AAEF,QAAQ,CAAC,QAAQ,GAAG;IAClB,OAAO,EAAE;QACP,OAAO,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;QACrE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;KAC5B;IACD,MAAM,EAAE,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;CAC7F,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Text, TextProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Text',\n  component: Text\n} as Meta;\n\nexport const TextDemo: Story<TextProps> = (args: TextProps) => {\n  return (\n    <Text variant={args.variant} status={args.status}>\n      Pega Cosmos\n    </Text>\n  );\n};\n\nTextDemo.args = {\n  variant: 'primary',\n  status: undefined\n};\n\nTextDemo.argTypes = {\n  variant: {\n    options: ['primary', 'secondary', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6'],\n    control: { type: 'select' }\n  },\n  status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } }\n};\n"]}

package/lib/core/TextArea/TextArea.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import { TextAreaProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const TextAreaDemo: Story<TextAreaProps>;
-//# sourceMappingURL=TextArea.stories.d.ts.map

package/lib/core/TextArea/TextArea.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextArea.stories.d.ts","sourceRoot":"","sources":["../../../src/core/TextArea/TextArea.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAY,aAAa,EAAE,MAAM,yBAAyB,CAAC;;AAElE,wBAGU;AAEV,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,aAAa,CAwB7C,CAAC"}

package/lib/core/TextArea/TextArea.stories.js

@@ -1,44 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useState } from 'react';
-import { TextArea } from '@pega/cosmos-react-core';
-export default {
-    title: 'Core/Textarea',
-    component: TextArea
-};
-export const TextAreaDemo = (args) => {
-    const [value, setValue] = useState('');
-    return (_jsx(TextArea, { id: 'text-area', value: value, onChange: (e) => setValue(e.target.value), minLength: args.minLength, maxLength: args.maxLength, displayCharCount: args.displayCharCount, hardStop: args.hardStop, resizable: args.resizable, autoResize: args.autoResize, label: args.label, labelHidden: args.labelHidden, info: args.info, placeholder: args.placeholder, status: args.status, required: args.required, disabled: args.disabled, readOnly: args.readOnly }, void 0));
-};
-TextAreaDemo.args = {
-    minLength: 0,
-    maxLength: 300,
-    displayCharCount: false,
-    hardStop: true,
-    resizable: false,
-    autoResize: false,
-    label: 'Text Area',
-    labelHidden: false,
-    info: 'Enter a large amount of text',
-    placeholder: 'Tell us a story…',
-    status: undefined,
-    required: false,
-    disabled: false,
-    readOnly: false
-};
-TextAreaDemo.argTypes = {
-    minLength: { control: { type: 'number' } },
-    maxLength: { control: { type: 'number' } },
-    displayCharCount: { control: { type: 'boolean' } },
-    hardStop: { control: { type: 'boolean' } },
-    resizable: { control: { type: 'boolean' } },
-    autoResize: { control: { type: 'boolean' } },
-    label: { control: { type: 'text' } },
-    labelHidden: { control: { type: 'boolean' } },
-    info: { control: { type: 'text' } },
-    placeholder: { control: { type: 'text' } },
-    status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },
-    required: { control: { type: 'boolean' } },
-    disabled: { control: { type: 'boolean' } },
-    readOnly: { control: { type: 'boolean' } }
-};
-//# sourceMappingURL=TextArea.stories.js.map

package/lib/core/TextArea/TextArea.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextArea.stories.js","sourceRoot":"","sources":["../../../src/core/TextArea/TextArea.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState, ChangeEvent } from 'react';\n\nimport { TextArea, TextAreaProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Textarea',\n  component: TextArea\n} as Meta;\n\nexport const TextAreaDemo: Story<TextAreaProps> = (args: TextAreaProps) => {\n  const [value, setValue] = useState('');\n\n  return (\n    <TextArea\n      id='text-area'\n      value={value}\n      onChange={(e: ChangeEvent<HTMLTextAreaElement>) => setValue(e.target.value)}\n      minLength={args.minLength}\n      maxLength={args.maxLength}\n      displayCharCount={args.displayCharCount}\n      hardStop={args.hardStop}\n      resizable={args.resizable}\n      autoResize={args.autoResize}\n      label={args.label}\n      labelHidden={args.labelHidden}\n      info={args.info}\n      placeholder={args.placeholder}\n      status={args.status}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n    />\n  );\n};\n\nTextAreaDemo.args = {\n  minLength: 0,\n  maxLength: 300,\n  displayCharCount: false,\n  hardStop: true,\n  resizable: false,\n  autoResize: false,\n  label: 'Text Area',\n  labelHidden: false,\n  info: 'Enter a large amount of text',\n  placeholder: 'Tell us a story…',\n  status: undefined,\n  required: false,\n  disabled: false,\n  readOnly: false\n};\n\nTextAreaDemo.argTypes = {\n  minLength: { control: { type: 'number' } },\n  maxLength: { control: { type: 'number' } },\n  displayCharCount: { control: { type: 'boolean' } },\n  hardStop: { control: { type: 'boolean' } },\n  resizable: { control: { type: 'boolean' } },\n  autoResize: { control: { type: 'boolean' } },\n  label: { control: { type: 'text' } },\n  labelHidden: { control: { type: 'boolean' } },\n  info: { control: { type: 'text' } },\n  placeholder: { control: { type: 'text' } },\n  status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n  required: { control: { type: 'boolean' } },\n  disabled: { control: { type: 'boolean' } },\n  readOnly: { control: { type: 'boolean' } }\n};\n"]}

package/lib/core/Toaster/Toaster.stories.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-import { Meta } from '@storybook/react';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const ToasterDemo: () => JSX.Element;
-//# sourceMappingURL=Toaster.stories.d.ts.map

package/lib/core/Toaster/Toaster.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Toaster.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Toaster/Toaster.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;;AAKxC,wBAGU;AAEV,eAAO,MAAM,WAAW,mBAyBvB,CAAC"}

package/lib/core/Toaster/Toaster.stories.js

@@ -1,30 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useContext, useState } from 'react';
-import { Button, Toaster, ToasterContext } from '@pega/cosmos-react-core';
-export default {
-    title: 'Core/Toaster',
-    component: Toaster
-};
-export const ToasterDemo = () => {
-    /*
-     * The <Toaster> component should be wrapped around the entire portion of an application that utilizes it.
-     * For most apps that is once near the root of the app's React tree.
-     * Descendant components can utilize the Toaster's push context method via a useContext hook, as demonstrated here.
-     * This story component represents an component rendered somewhere in an app's tree.
-     * Note, a Toaster provider is already rendered at the root of the Cosmos Storybook, allowing for the use of context here.
-     */
-    const { push } = useContext(ToasterContext);
-    const [count, setCount] = useState(0);
-    const messages = [
-        'Thi is a short toast message!',
-        'This toast message is much longer and will need to be trimmed with an ellipsis in order to fit within the confines of the component.'
-    ];
-    const pushToaster = () => {
-        setCount(curr => curr + 1);
-        push({
-            content: messages[count % 2]
-        });
-    };
-    return _jsx(Button, { onClick: pushToaster, children: "Make some Toast" }, void 0);
-};
-//# sourceMappingURL=Toaster.stories.js.map

package/lib/core/Toaster/Toaster.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Toaster.stories.js","sourceRoot":"","sources":["../../../src/core/Toaster/Toaster.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAE1E,eAAe;IACb,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,OAAO;CACX,CAAC;AAEV,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE;IAC9B;;;;;;OAMG;IAEH,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC,CAAC;IAC5C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAEtC,MAAM,QAAQ,GAAG;QACf,+BAA+B;QAC/B,sIAAsI;KACvI,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC;QAC3B,IAAI,CAAC;YACH,OAAO,EAAE,QAAQ,CAAC,KAAK,GAAG,CAAC,CAAC;SAC7B,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,KAAC,MAAM,IAAC,OAAO,EAAE,WAAW,wCAA0B,CAAC;AAChE,CAAC,CAAC","sourcesContent":["import { Meta } from '@storybook/react';\nimport { useContext, useState } from 'react';\n\nimport { Button, Toaster, ToasterContext } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Toaster',\n  component: Toaster\n} as Meta;\n\nexport const ToasterDemo = () => {\n  /*\n   * The <Toaster> component should be wrapped around the entire portion of an application that utilizes it.\n   * For most apps that is once near the root of the app's React tree.\n   * Descendant components can utilize the Toaster's push context method via a useContext hook, as demonstrated here.\n   * This story component represents an component rendered somewhere in an app's tree.\n   * Note, a Toaster provider is already rendered at the root of the Cosmos Storybook, allowing for the use of context here.\n   */\n\n  const { push } = useContext(ToasterContext);\n  const [count, setCount] = useState(0);\n\n  const messages = [\n    'Thi is a short toast message!',\n    'This toast message is much longer and will need to be trimmed with an ellipsis in order to fit within the confines of the component.'\n  ];\n\n  const pushToaster = () => {\n    setCount(curr => curr + 1);\n    push({\n      content: messages[count % 2]\n    });\n  };\n\n  return <Button onClick={pushToaster}>Make some Toast</Button>;\n};\n"]}

package/lib/core/Tooltip/Tooltip.stories.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-declare const _default: {
-    title: string;
-    component: import("react").FunctionComponent<import("@pega/cosmos-react-core").TooltipProps & import("@pega/cosmos-react-core").ForwardProps>;
-};
-export default _default;
-export declare const TooltipDemo: () => JSX.Element;
-//# sourceMappingURL=Tooltip.stories.d.ts.map

package/lib/core/Tooltip/Tooltip.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tooltip.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Tooltip/Tooltip.stories.tsx"],"names":[],"mappings":";;;;;AAEA,wBAGE;AAEF,eAAO,MAAM,WAAW,mBAgBvB,CAAC"}

package/lib/core/Tooltip/Tooltip.stories.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Tooltip, useElement } from '@pega/cosmos-react-core';
-export default {
-    title: 'Core/Tooltip',
-    component: Tooltip
-};
-export const TooltipDemo = () => {
-    const [el, setEl] = useElement();
-    return (_jsxs(_Fragment, { children: [_jsx(Button, { ref: setEl, children: "Hover me" }, void 0), el && (_jsx(Tooltip, { target: el, children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur finibus scelerisque viverra. Fusce consequat, justo at laoreet lobortis, mauris ipsum aliquet arcu, non convallis nisl elit id erat. Pellentesque posuere sagittis velit a molestie." }, void 0))] }, void 0));
-};
-//# sourceMappingURL=Tooltip.stories.js.map

package/lib/core/Tooltip/Tooltip.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tooltip.stories.js","sourceRoot":"","sources":["../../../src/core/Tooltip/Tooltip.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEtE,eAAe;IACb,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,OAAO;CACnB,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE;IAC9B,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,GAAG,UAAU,EAAE,CAAC;IAEjC,OAAO,CACL,8BACE,KAAC,MAAM,IAAC,GAAG,EAAE,KAAK,iCAAmB,EAEpC,EAAE,IAAI,CACL,KAAC,OAAO,IAAC,MAAM,EAAE,EAAE,gRAIT,CACX,YACA,CACJ,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Button, Tooltip, useElement } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Tooltip',\n  component: Tooltip\n};\n\nexport const TooltipDemo = () => {\n  const [el, setEl] = useElement();\n\n  return (\n    <>\n      <Button ref={setEl}>Hover me</Button>\n\n      {el && (\n        <Tooltip target={el}>\n          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur finibus scelerisque\n          viverra. Fusce consequat, justo at laoreet lobortis, mauris ipsum aliquet arcu, non\n          convallis nisl elit id erat. Pellentesque posuere sagittis velit a molestie.\n        </Tooltip>\n      )}\n    </>\n  );\n};\n"]}

package/lib/core/Tree/Tree.mocks.d.ts

@@ -1,2 +0,0 @@
-export declare const themeToTree: (themeNode: object, parentPath?: string | undefined) => import("@pega/cosmos-react-core").TreeNode[];
-//# sourceMappingURL=Tree.mocks.d.ts.map

package/lib/core/Tree/Tree.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tree.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Tree/Tree.mocks.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW,cAAe,MAAM,kFAsB5C,CAAC"}

package/lib/core/Tree/Tree.mocks.js

@@ -1,22 +0,0 @@
-export const themeToTree = (themeNode, parentPath) => {
-    const dataArray = [];
-    Object.entries(themeNode).forEach(([childKey, childValue]) => {
-        const id = parentPath ? `${parentPath}.${childKey}` : childKey;
-        const label = childKey;
-        // Is a leaf
-        if (childValue.$type) {
-            dataArray.push({
-                id,
-                label,
-                data: { ...childValue }
-            });
-        }
-        // Is a parent
-        else {
-            const nodes = themeToTree(childValue, id);
-            dataArray.push({ id, label, nodes });
-        }
-    });
-    return dataArray;
-};
-//# sourceMappingURL=Tree.mocks.js.map

package/lib/core/Tree/Tree.mocks.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tree.mocks.js","sourceRoot":"","sources":["../../../src/core/Tree/Tree.mocks.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,SAAiB,EAAE,UAAmB,EAAE,EAAE;IACpE,MAAM,SAAS,GAAuB,EAAE,CAAC;IACzC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,EAAE,UAAU,CAAC,EAAE,EAAE;QAC3D,MAAM,EAAE,GAAG,UAAU,CAAC,CAAC,CAAC,GAAG,UAAU,IAAI,QAAQ,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC;QAC/D,MAAM,KAAK,GAAG,QAAQ,CAAC;QAEvB,YAAY;QACZ,IAAI,UAAU,CAAC,KAAK,EAAE;YACpB,SAAS,CAAC,IAAI,CAAC;gBACb,EAAE;gBACF,KAAK;gBACL,IAAI,EAAE,EAAE,GAAG,UAAU,EAAE;aACxB,CAAC,CAAC;SACJ;QACD,cAAc;aACT;YACH,MAAM,KAAK,GAAuB,WAAW,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;YAC9D,SAAS,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;SACtC;IACH,CAAC,CAAC,CAAC;IAEH,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC","sourcesContent":["import { TreeProps } from '@pega/cosmos-react-core';\n\nexport const themeToTree = (themeNode: object, parentPath?: string) => {\n  const dataArray: TreeProps['nodes'] = [];\n  Object.entries(themeNode).forEach(([childKey, childValue]) => {\n    const id = parentPath ? `${parentPath}.${childKey}` : childKey;\n    const label = childKey;\n\n    // Is a leaf\n    if (childValue.$type) {\n      dataArray.push({\n        id,\n        label,\n        data: { ...childValue }\n      });\n    }\n    // Is a parent\n    else {\n      const nodes: TreeProps['nodes'] = themeToTree(childValue, id);\n      dataArray.push({ id, label, nodes });\n    }\n  });\n\n  return dataArray;\n};\n"]}

package/lib/core/Tree/Tree.stories.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-import { Meta, Story } from '@storybook/react';
-import { StandardTreeProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const BaseTree: () => JSX.Element;
-export declare const StandardTreeDemo: Story<Pick<StandardTreeProps, 'lined'>>;
-//# sourceMappingURL=Tree.stories.d.ts.map

package/lib/core/Tree/Tree.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tree.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Tree/Tree.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAGL,iBAAiB,EAMlB,MAAM,yBAAyB,CAAC;;AAKjC,wBAGU;AAEV,eAAO,MAAM,QAAQ,mBAcpB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,IAAI,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAmFpE,CAAC"}

package/lib/core/Tree/Tree.stories.js

@@ -1,85 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import { action } from '@storybook/addon-actions';
-import { Button, StandardTree, Tree, treeHelpers, createUID, themeDefinition } from '@pega/cosmos-react-core';
-import { themeToTree } from './Tree.mocks';
-import { StyledBaseTree } from './Tree.styles';
-export default {
-    title: 'Core/Tree',
-    component: Tree
-};
-export const BaseTree = () => {
-    return (_jsx(StyledBaseTree, { nodes: themeToTree(themeDefinition), nodeRenderer: ({ id, subTree }) => {
-            return (_jsxs(_Fragment, { children: [_jsx("span", { children: id }, void 0), subTree] }, void 0));
-        } }, void 0));
-};
-export const StandardTreeDemo = ({ lined }) => {
-    const getMockNodes = ({ length = 5, parent = true } = {}) => {
-        return Array.from({ length }, (_, i) => {
-            const isParent = parent && i !== 2;
-            const id = createUID();
-            return {
-                id,
-                label: isParent ? 'Parent' : 'Leaf',
-                icon: isParent ? 'folder-solid' : 'document-solid',
-                nodes: isParent ? [] : undefined,
-                actions: [
-                    { id: 'star', text: 'Star', icon: 'star', onClick: action(`Star node: ${id}`) },
-                    { id: 'pin', text: 'Pin', icon: 'pin', onClick: action(`Pin node: ${id}`) }
-                ],
-                onClick: isParent
-                    ? undefined
-                    : nodeId => {
-                        action(`Action for node: ${nodeId}`)();
-                    }
-            };
-        });
-    };
-    const [currentNodeId, setCurrentNodeId] = useState();
-    const [allNodes, setAllNodes] = useState(() => {
-        return getMockNodes({ length: 10 });
-    });
-    const loadChildNodes = (id) => {
-        setTimeout(() => {
-            setAllNodes(tree => {
-                return treeHelpers.mapNode(tree, id, node => {
-                    return {
-                        ...node,
-                        loading: false,
-                        nodes: [...(node.nodes ?? []), ...getMockNodes()]
-                    };
-                });
-            });
-        }, 1000);
-    };
-    const expandTo = (id) => {
-        setAllNodes(tree => {
-            return treeHelpers.expandTo(tree, id);
-        });
-    };
-    return (_jsxs(_Fragment, { children: [_jsx(StandardTree, { lined: lined, currentNodeId: currentNodeId, nodes: allNodes, onNodeClick: id => {
-                    const clickedNode = treeHelpers.getNode(allNodes, id);
-                    setCurrentNodeId(id);
-                    // If a leaf node, just set to current
-                    if (!clickedNode?.nodes)
-                        return;
-                    setAllNodes(tree => treeHelpers.mapNode(tree, id, node => {
-                        return {
-                            ...node,
-                            expanded: !node.expanded,
-                            loading: node.nodes?.length === 0
-                        };
-                    }));
-                    // If a parent node with children already loaded, we're done.
-                    if (clickedNode?.nodes?.length > 0)
-                        return;
-                    loadChildNodes(id);
-                } }, void 0), _jsx(Button, { onClick: () => expandTo(''), children: "Collapse All" }, void 0), _jsx(Button, { onClick: () => expandTo(currentNodeId || ''), children: "Expand to active item" }, void 0)] }, void 0));
-};
-StandardTreeDemo.args = {
-    lined: false
-};
-StandardTreeDemo.argTypes = {
-    lined: { control: { type: 'boolean' } }
-};
-//# sourceMappingURL=Tree.stories.js.map

package/lib/core/Tree/Tree.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tree.stories.js","sourceRoot":"","sources":["../../../src/core/Tree/Tree.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Meta, Story } from '@storybook/react';\n\nimport {\n  Button,\n  StandardTree,\n  StandardTreeProps,\n  Tree,\n  TreeNode,\n  treeHelpers,\n  createUID,\n  themeDefinition\n} from '@pega/cosmos-react-core';\n\nimport { themeToTree } from './Tree.mocks';\nimport { StyledBaseTree } from './Tree.styles';\n\nexport default {\n  title: 'Core/Tree',\n  component: Tree\n} as Meta;\n\nexport const BaseTree = () => {\n  return (\n    <StyledBaseTree\n      nodes={themeToTree(themeDefinition)}\n      nodeRenderer={({ id, subTree }) => {\n        return (\n          <>\n            <span>{id}</span>\n            {subTree}\n          </>\n        );\n      }}\n    />\n  );\n};\n\nexport const StandardTreeDemo: Story<Pick<StandardTreeProps, 'lined'>> = ({ lined }) => {\n  const getMockNodes = ({\n    length = 5,\n    parent = true\n  }: { length?: number; parent?: boolean } = {}): StandardTreeProps['nodes'] => {\n    return Array.from({ length }, (_, i) => {\n      const isParent = parent && i !== 2;\n      const id = createUID();\n      return {\n        id,\n        label: isParent ? 'Parent' : 'Leaf',\n        icon: isParent ? 'folder-solid' : 'document-solid',\n        nodes: isParent ? [] : undefined,\n        actions: [\n          { id: 'star', text: 'Star', icon: 'star', onClick: action(`Star node: ${id}`) },\n          { id: 'pin', text: 'Pin', icon: 'pin', onClick: action(`Pin node: ${id}`) }\n        ],\n        onClick: isParent\n          ? undefined\n          : nodeId => {\n              action(`Action for node: ${nodeId}`)();\n            }\n      };\n    });\n  };\n\n  const [currentNodeId, setCurrentNodeId] = useState<string | undefined>();\n  const [allNodes, setAllNodes] = useState<StandardTreeProps['nodes']>(() => {\n    return getMockNodes({ length: 10 });\n  });\n\n  const loadChildNodes = (id: string) => {\n    setTimeout(() => {\n      setAllNodes(tree => {\n        return treeHelpers.mapNode(tree, id, node => {\n          return {\n            ...node,\n            loading: false,\n            nodes: [...(node.nodes ?? []), ...getMockNodes()]\n          };\n        });\n      });\n    }, 1000);\n  };\n\n  const expandTo = (id: TreeNode['id']) => {\n    setAllNodes(tree => {\n      return treeHelpers.expandTo(tree, id);\n    });\n  };\n\n  return (\n    <>\n      <StandardTree\n        lined={lined}\n        currentNodeId={currentNodeId}\n        nodes={allNodes}\n        onNodeClick={id => {\n          const clickedNode = treeHelpers.getNode(allNodes, id);\n          setCurrentNodeId(id);\n          // If a leaf node, just set to current\n          if (!clickedNode?.nodes) return;\n\n          setAllNodes(tree =>\n            treeHelpers.mapNode(tree, id, node => {\n              return {\n                ...node,\n                expanded: !node.expanded,\n                loading: node.nodes?.length === 0\n              };\n            })\n          );\n\n          // If a parent node with children already loaded, we're done.\n          if (clickedNode?.nodes?.length > 0) return;\n\n          loadChildNodes(id);\n        }}\n      />\n      <Button onClick={() => expandTo('')}>Collapse All</Button>\n      <Button onClick={() => expandTo(currentNodeId || '')}>Expand to active item</Button>\n    </>\n  );\n};\n\nStandardTreeDemo.args = {\n  lined: false\n};\n\nStandardTreeDemo.argTypes = {\n  lined: { control: { type: 'boolean' } }\n};\n"]}

package/lib/core/Tree/Tree.styles.d.ts

@@ -1,3 +0,0 @@
-import { Tree } from '@pega/cosmos-react-core';
-export declare const StyledBaseTree: typeof Tree;
-//# sourceMappingURL=Tree.styles.d.ts.map

package/lib/core/Tree/Tree.styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tree.styles.d.ts","sourceRoot":"","sources":["../../../src/core/Tree/Tree.styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE/C,eAAO,MAAM,cAAc,EAAE,OAAO,IAMnC,CAAC"}

package/lib/core/Tree/Tree.styles.js

@@ -1,10 +0,0 @@
-import styled from 'styled-components';
-import { Tree } from '@pega/cosmos-react-core';
-export const StyledBaseTree = styled(Tree) `
-  &,
-  & ul {
-    padding: revert;
-    list-style: revert;
-  }
-`;
-//# sourceMappingURL=Tree.styles.js.map

package/lib/core/Tree/Tree.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tree.styles.js","sourceRoot":"","sources":["../../../src/core/Tree/Tree.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE/C,MAAM,CAAC,MAAM,cAAc,GAAgB,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;;CAMtD,CAAC","sourcesContent":["import styled from 'styled-components';\n\nimport { Tree } from '@pega/cosmos-react-core';\n\nexport const StyledBaseTree: typeof Tree = styled(Tree)`\n  &,\n  & ul {\n    padding: revert;\n    list-style: revert;\n  }\n`;\n"]}

package/lib/core/URL/URL.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import { URLDisplayProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const URLDisplayDemo: Story<URLDisplayProps>;
-//# sourceMappingURL=URL.stories.d.ts.map

package/lib/core/URL/URL.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"URL.stories.d.ts","sourceRoot":"","sources":["../../../src/core/URL/URL.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAc,eAAe,EAAE,MAAM,yBAAyB,CAAC;;AAEtE,wBAGU;AAEV,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,eAAe,CAEjD,CAAC"}

package/lib/core/URL/URL.stories.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { URLDisplay } from '@pega/cosmos-react-core';
-export default {
-    title: 'Core/URL',
-    component: URLDisplay
-};
-export const URLDisplayDemo = (args) => (_jsx(URLDisplay, { value: args.value, displayText: args.displayText, variant: args.variant }, void 0));
-URLDisplayDemo.args = {
-    value: 'https://www.google.com/',
-    displayText: 'Example URL',
-    variant: 'link'
-};
-URLDisplayDemo.argTypes = {
-    value: { control: { type: 'text' } },
-    displayText: { control: { type: 'text' } },
-    variant: { options: ['link', 'text'], control: { type: 'select' } }
-};
-//# sourceMappingURL=URL.stories.js.map

package/lib/core/URL/URL.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"URL.stories.js","sourceRoot":"","sources":["../../../src/core/URL/URL.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,UAAU,EAAmB,MAAM,yBAAyB,CAAC;AAEtE,eAAe;IACb,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,UAAU;CACd,CAAC;AAEV,MAAM,CAAC,MAAM,cAAc,GAA2B,CAAC,IAAqB,EAAE,EAAE,CAAC,CAC/E,KAAC,UAAU,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,WAAI,CACxF,CAAC;AAEF,cAAc,CAAC,IAAI,GAAG;IACpB,KAAK,EAAE,yBAAyB;IAChC,WAAW,EAAE,aAAa;IAC1B,OAAO,EAAE,MAAM;CAChB,CAAC;AAEF,cAAc,CAAC,QAAQ,GAAG;IACxB,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAC1C,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;CACpE,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { URLDisplay, URLDisplayProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/URL',\n  component: URLDisplay\n} as Meta;\n\nexport const URLDisplayDemo: Story<URLDisplayProps> = (args: URLDisplayProps) => (\n  <URLDisplay value={args.value} displayText={args.displayText} variant={args.variant} />\n);\n\nURLDisplayDemo.args = {\n  value: 'https://www.google.com/',\n  displayText: 'Example URL',\n  variant: 'link'\n};\n\nURLDisplayDemo.argTypes = {\n  value: { control: { type: 'text' } },\n  displayText: { control: { type: 'text' } },\n  variant: { options: ['link', 'text'], control: { type: 'select' } }\n};\n"]}

package/lib/cs/Article/Article.mocks.d.ts

@@ -1,14 +0,0 @@
-export declare const ArticleMockData: {
-    fullArticleContent: {
-        header: string;
-        abstract: string;
-        content: string;
-        meta: {
-            category: string;
-            publishedDate: string;
-            likes: number;
-            disLikes: number;
-        };
-    };
-};
-//# sourceMappingURL=Article.mocks.d.ts.map

package/lib/cs/Article/Article.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Article.mocks.d.ts","sourceRoot":"","sources":["../../../src/cs/Article/Article.mocks.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe;;;;;;;;;;;;CAc3B,CAAC"}

package/lib/cs/Article/Article.mocks.js

@@ -1,14 +0,0 @@
-export const ArticleMockData = {
-    fullArticleContent: {
-        header: '5 Tips for handling a Difficult customer',
-        abstract: '5 Tips for handling a Difficult customer. This will give you clear guidelines to deal with a customer',
-        content: "<p>Changing your monthly billing cycle can help you better manage your monthly bills and when you pay them.  U+Comm offers 3 main billing cycles with due dates falling on the 1st, 15th, or the 28th of each month.  This provides our customers with flexibility when choosing a billing cycle and corresponding due date that matches your personal finance planning.If you change an existing bill cycle, there will generally be a number of days prorated to compensate from the gap from the end of the previous bill cycle to when the new bill cycle is started.  This proration will be included in your next (new) billing cycle statement, and will cause an increase in that month’s payment due.  But rest assured, you’re not being charged ‘extra’, but paying for the days that were between the old and new billing cycle dates.</p><br/><div>Find more details from this article <a data-article-id='5' href='#'>How to sell a product</a></div><br/><div>Find some suggestions from this article <a data-article-id='8' href='#'>How to convince a customer</a></div><br/><div><b>Before you change your billing cycle, be aware that:</b> </div><br/><ul><li>Your billing cycle can't be changed if your account is in a delinquent status, or if the account will fall delinquent before the requested change date.</li><li>If you have a payment arrangement set up, the payment arrangement must be made before the billing cycle is changed.</li><li>If you have AutoPay, you may see two AutoPay drafts in one month due to the billing cycle change.</li><li>When a billing cycle change is made, prorated charges will occur.</li><li>Your billing cycle can't be changed if your account is in a delinquent status, or if the account will fall delinquent before the requested change date.</li><li>If you have a payment arrangement set up, the payment arrangement must be made before the billing cycle is changed.</li><li>If you have AutoPay, you may see two AutoPay drafts in one month due to the billing cycle change.</li><li>When a billing cycle change is made, prorated charges will occur.</li></ul><br/><p>If you change an existing bill cycle, there will generally be a number of days prorated to compensate from the gap from the end of the previous bill cycle to when the new bill cycle is started.  This proration will be included in your next (new) billing cycle statement, and will cause an increase in that month’s payment due.  But rest assured, you’re not being charged ‘extra’, but paying for the days that were between the old and new billing cycle dates.</p>",
-        meta: {
-            category: 'Banking and Retail',
-            publishedDate: '12/12/2019',
-            likes: 124,
-            disLikes: 47
-        }
-    }
-};
-//# sourceMappingURL=Article.mocks.js.map

package/lib/cs/Article/Article.mocks.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Article.mocks.js","sourceRoot":"","sources":["../../../src/cs/Article/Article.mocks.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,kBAAkB,EAAE;QAClB,MAAM,EAAE,0CAA0C;QAClD,QAAQ,EACN,uGAAuG;QACzG,OAAO,EACL,2+EAA2+E;QAC7+E,IAAI,EAAE;YACJ,QAAQ,EAAE,oBAAoB;YAC9B,aAAa,EAAE,YAAY;YAC3B,KAAK,EAAE,GAAG;YACV,QAAQ,EAAE,EAAE;SACb;KACF;CACF,CAAC","sourcesContent":["export const ArticleMockData = {\n  fullArticleContent: {\n    header: '5 Tips for handling a Difficult customer',\n    abstract:\n      '5 Tips for handling a Difficult customer. This will give you clear guidelines to deal with a customer',\n    content:\n      \"<p>Changing your monthly billing cycle can help you better manage your monthly bills and when you pay them.  U+Comm offers 3 main billing cycles with due dates falling on the 1st, 15th, or the 28th of each month.  This provides our customers with flexibility when choosing a billing cycle and corresponding due date that matches your personal finance planning.If you change an existing bill cycle, there will generally be a number of days prorated to compensate from the gap from the end of the previous bill cycle to when the new bill cycle is started.  This proration will be included in your next (new) billing cycle statement, and will cause an increase in that month’s payment due.  But rest assured, you’re not being charged ‘extra’, but paying for the days that were between the old and new billing cycle dates.</p><br/><div>Find more details from this article <a data-article-id='5' href='#'>How to sell a product</a></div><br/><div>Find some suggestions from this article <a data-article-id='8' href='#'>How to convince a customer</a></div><br/><div><b>Before you change your billing cycle, be aware that:</b> </div><br/><ul><li>Your billing cycle can't be changed if your account is in a delinquent status, or if the account will fall delinquent before the requested change date.</li><li>If you have a payment arrangement set up, the payment arrangement must be made before the billing cycle is changed.</li><li>If you have AutoPay, you may see two AutoPay drafts in one month due to the billing cycle change.</li><li>When a billing cycle change is made, prorated charges will occur.</li><li>Your billing cycle can't be changed if your account is in a delinquent status, or if the account will fall delinquent before the requested change date.</li><li>If you have a payment arrangement set up, the payment arrangement must be made before the billing cycle is changed.</li><li>If you have AutoPay, you may see two AutoPay drafts in one month due to the billing cycle change.</li><li>When a billing cycle change is made, prorated charges will occur.</li></ul><br/><p>If you change an existing bill cycle, there will generally be a number of days prorated to compensate from the gap from the end of the previous bill cycle to when the new bill cycle is started.  This proration will be included in your next (new) billing cycle statement, and will cause an increase in that month’s payment due.  But rest assured, you’re not being charged ‘extra’, but paying for the days that were between the old and new billing cycle dates.</p>\",\n    meta: {\n      category: 'Banking and Retail',\n      publishedDate: '12/12/2019',\n      likes: 124,\n      disLikes: 47\n    }\n  }\n};\n"]}

package/lib/cs/Article/Article.stories.d.ts

@@ -1,15 +0,0 @@
-/// <reference types="react" />
-declare const _default: {
-    title: string;
-    component: import("react").FunctionComponent<import("@pega/cosmos-react-cs").ArticleProps & import("@pega/cosmos-react-core").ForwardProps>;
-    subcomponents: {
-        ArticleFooter: import("react").FunctionComponent<import("@pega/cosmos-react-cs").ArticleFooterProps & import("@pega/cosmos-react-core").ForwardProps>;
-    };
-    parameters: {
-        layout: string;
-    };
-};
-export default _default;
-export declare const ArticleStory: () => JSX.Element;
-export declare const ArticleStorySkeletonize: () => JSX.Element;
-//# sourceMappingURL=Article.stories.d.ts.map

package/lib/cs/Article/Article.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Article.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/Article/Article.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;AAeA,wBAOE;AAEF,eAAO,MAAM,YAAY,mBA2GxB,CAAC;AAEF,eAAO,MAAM,uBAAuB,mBAwCnC,CAAC"}

package/lib/cs/Article/Article.stories.js

@@ -1,85 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { action } from '@storybook/addon-actions';
-import { Button, Flex, Icon, registerIcon, Link, Text } from '@pega/cosmos-react-core';
-import * as openIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/open.icon';
-import * as starIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/star.icon';
-import * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';
-import * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';
-import * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';
-import { Article, ArticleFooter } from '@pega/cosmos-react-cs';
-import { ArticleMockData } from './Article.mocks';
-registerIcon(openIcon, starIcon, caretLeftIcon, thumbsUpSolidIcon, thumbsDownSolidIcon);
-export default {
-    title: 'Customer Service/Article',
-    component: Article,
-    subcomponents: { ArticleFooter },
-    parameters: {
-        layout: 'fullscreen'
-    }
-};
-export const ArticleStory = () => {
-    const onBackToArticlesClick = (event) => {
-        event.preventDefault();
-    };
-    return (_jsx("div", { style: {
-            maxWidth: '31.25rem',
-            maxHeight: '100vh'
-        }, children: _jsx(Article, { navigation: _jsx(Link, { href: '/', onClick: onBackToArticlesClick, children: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: 'caret-left' }, void 0), _jsx(Text, { children: "Back to all articles" }, void 0)] }, void 0) }, void 0), primaryActions: _jsxs(_Fragment, { children: [_jsx(Button, { "aria-label": 'star', variant: 'simple', icon: true, children: _jsx(Icon, { name: 'star' }, void 0) }, void 0), _jsx(Button, { "aria-label": 'open', variant: 'simple', icon: true, children: _jsx(Icon, { name: 'open' }, void 0) }, void 0)] }, void 0), secondaryActions: [
-                {
-                    text: 'Filter 1',
-                    id: 'f1a'
-                },
-                {
-                    text: 'Filter 2',
-                    id: 'f2a'
-                }
-            ], content: 
-            // TODO : Container components need to ensure that html being sent to the __html below needs to be free from XSS attack
-            // eslint-disable-next-line react/no-danger
-            _jsx("div", { dangerouslySetInnerHTML: { __html: ArticleMockData.fullArticleContent.content } }, void 0), skeletonize: false, title: ArticleMockData.fullArticleContent.header, meta: [
-                _jsx(Text, { variant: 'secondary', "aria-label": 'category', children: ArticleMockData.fullArticleContent.meta.category }, void 0),
-                _jsx(Text, { variant: 'secondary', "aria-label": 'published date', children: ArticleMockData.fullArticleContent.meta.publishedDate }, void 0),
-                _jsxs(Flex, { container: { gap: 2, alignItems: 'center' }, children: [_jsxs(Flex, { container: { gap: 1, alignItems: 'center' }, children: [_jsx(Icon, { name: 'thumbs-up-solid' }, void 0), _jsxs(Text, { "aria-label": 'likes', children: ["(", ArticleMockData.fullArticleContent.meta.likes, ")"] }, void 0)] }, void 0), _jsxs(Flex, { container: { gap: 1, alignItems: 'center' }, children: [_jsx(Icon, { name: 'thumbs-down-solid' }, void 0), _jsxs(Text, { "aria-label": 'dislikes', children: ["(", ArticleMockData.fullArticleContent.meta.disLikes, ")"] }, void 0)] }, void 0)] }, void 0)
-            ], footer: _jsx(ArticleFooter, { content: _jsxs(Flex, { container: { gap: 1 }, children: [_jsx(Text, { children: "Was this helpful ?" }, void 0), " ", _jsx(Button, { children: "Yes" }, void 0), " ", _jsx(Button, { children: "No" }, void 0)] }, void 0), tags: [
-                    {
-                        id: 'Retail banking',
-                        tagName: '#Retail_banking'
-                    },
-                    {
-                        id: 'difficult_customers',
-                        tagName: '#Difficult_customers'
-                    },
-                    {
-                        id: '223444',
-                        tagName: '#CSR_Skills'
-                    },
-                    {
-                        id: '223446',
-                        tagName: '#Premium_Customers'
-                    },
-                    {
-                        id: '223447',
-                        tagName: '#Rare_Customers'
-                    },
-                    {
-                        id: '223448',
-                        tagName: '#Finance_Customers'
-                    }
-                ], onTagClick: action('Tag clicked') }, void 0) }, void 0) }, void 0));
-};
-export const ArticleStorySkeletonize = () => {
-    const onBackToArticlesClick = (event) => {
-        event.preventDefault();
-    };
-    return (_jsx("div", { style: { maxWidth: '31.25rem', maxHeight: '100vh' }, children: _jsx(Article, { skeletonize: true, navigation: _jsx(Link, { href: '/', onClick: onBackToArticlesClick, children: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: 'caret-left' }, void 0), _jsx(Text, { children: "Back to articles" }, void 0)] }, void 0) }, void 0), primaryActions: _jsxs(_Fragment, { children: [_jsx(Button, { variant: 'simple', icon: true, children: _jsx(Icon, { name: 'star' }, void 0) }, void 0), _jsx(Button, { variant: 'simple', icon: true, children: _jsx(Icon, { name: 'open' }, void 0) }, void 0)] }, void 0), secondaryActions: [
-                {
-                    text: 'Filter 1',
-                    id: 'f1a'
-                },
-                {
-                    text: 'Filter 2',
-                    id: 'f2a'
-                }
-            ] }, void 0) }, void 0));
-};
-//# sourceMappingURL=Article.stories.js.map

package/lib/cs/Article/Article.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Article.stories.js","sourceRoot":"","sources":["../../../src/cs/Article/Article.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AACvF,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AACxF,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AACxF,OAAO,KAAK,aAAa,MAAM,mEAAmE,CAAC;AACnG,OAAO,KAAK,iBAAiB,MAAM,wEAAwE,CAAC;AAC5G,OAAO,KAAK,mBAAmB,MAAM,0EAA0E,CAAC;AAChH,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE/D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAElD,YAAY,CAAC,QAAQ,EAAE,QAAQ,EAAE,aAAa,EAAE,iBAAiB,EAAE,mBAAmB,CAAC,CAAC;AAExF,eAAe;IACb,KAAK,EAAE,0BAA0B;IACjC,SAAS,EAAE,OAAO;IAClB,aAAa,EAAE,EAAE,aAAa,EAAE;IAChC,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,qBAAqB,GAAG,CAAC,KAAiB,EAAE,EAAE;QAClD,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO,CACL,cACE,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,SAAS,EAAE,OAAO;SACnB,YAED,KAAC,OAAO,IACN,UAAU,EACR,KAAC,IAAI,IAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,qBAAqB,YAC3C,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC/C,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,WAAG,EAC1B,KAAC,IAAI,+CAA4B,YAC5B,WACF,EAET,cAAc,EACZ,8BACE,KAAC,MAAM,kBAAY,MAAM,EAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,kBAC7C,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,WAAG,WACb,EACT,KAAC,MAAM,kBAAY,MAAM,EAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,kBAC7C,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,WAAG,WACb,YACR,EAEL,gBAAgB,EAAE;gBAChB;oBACE,IAAI,EAAE,UAAU;oBAChB,EAAE,EAAE,KAAK;iBACV;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,EAAE,EAAE,KAAK;iBACV;aACF,EACD,OAAO;YACL,uHAAuH;YACvH,2CAA2C;YAC3C,cAAK,uBAAuB,EAAE,EAAE,MAAM,EAAE,eAAe,CAAC,kBAAkB,CAAC,OAAO,EAAE,WAAI,EAE1F,WAAW,EAAE,KAAK,EAClB,KAAK,EAAE,eAAe,CAAC,kBAAkB,CAAC,MAAM,EAChD,IAAI,EAAE;gBACJ,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,gBAAY,UAAU,YAC5C,eAAe,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,WAC5C;gBACP,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,gBAAY,gBAAgB,YAClD,eAAe,CAAC,kBAAkB,CAAC,IAAI,CAAC,aAAa,WACjD;gBACP,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC/C,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC/C,KAAC,IAAI,IAAC,IAAI,EAAC,iBAAiB,WAAG,EAC/B,MAAC,IAAI,kBAAY,OAAO,kBAAG,eAAe,CAAC,kBAAkB,CAAC,IAAI,CAAC,KAAK,iBAAS,YAC5E,EACP,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC/C,KAAC,IAAI,IAAC,IAAI,EAAC,mBAAmB,WAAG,EACjC,MAAC,IAAI,kBAAY,UAAU,kBACvB,eAAe,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,iBAC7C,YACF,YACF;aACR,EACD,MAAM,EACJ,KAAC,aAAa,IACZ,OAAO,EACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,aACzB,KAAC,IAAI,6CAA0B,OAAC,KAAC,MAAM,8BAAa,OAAC,KAAC,MAAM,6BAAY,YACnE,EAET,IAAI,EAAE;oBACJ;wBACE,EAAE,EAAE,gBAAgB;wBACpB,OAAO,EAAE,iBAAiB;qBAC3B;oBACD;wBACE,EAAE,EAAE,qBAAqB;wBACzB,OAAO,EAAE,sBAAsB;qBAChC;oBACD;wBACE,EAAE,EAAE,QAAQ;wBACZ,OAAO,EAAE,aAAa;qBACvB;oBACD;wBACE,EAAE,EAAE,QAAQ;wBACZ,OAAO,EAAE,oBAAoB;qBAC9B;oBACD;wBACE,EAAE,EAAE,QAAQ;wBACZ,OAAO,EAAE,iBAAiB;qBAC3B;oBACD;wBACE,EAAE,EAAE,QAAQ;wBACZ,OAAO,EAAE,oBAAoB;qBAC9B;iBACF,EACD,UAAU,EAAE,MAAM,CAAC,aAAa,CAAC,WACjC,WAEJ,WACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,GAAG,EAAE;IAC1C,MAAM,qBAAqB,GAAG,CAAC,KAAiB,EAAE,EAAE;QAClD,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO,CACL,cAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,YACtD,KAAC,OAAO,IACN,WAAW,QACX,UAAU,EACR,KAAC,IAAI,IAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,qBAAqB,YAC3C,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC/C,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,WAAG,EAC1B,KAAC,IAAI,2CAAwB,YACxB,WACF,EAET,cAAc,EACZ,8BACE,KAAC,MAAM,IAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,kBAC3B,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,WAAG,WACb,EACT,KAAC,MAAM,IAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,kBAC3B,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,WAAG,WACb,YACR,EAEL,gBAAgB,EAAE;gBAChB;oBACE,IAAI,EAAE,UAAU;oBAChB,EAAE,EAAE,KAAK;iBACV;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,EAAE,EAAE,KAAK;iBACV;aACF,WACD,WACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { MouseEvent } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport { Button, Flex, Icon, registerIcon, Link, Text } from '@pega/cosmos-react-core';\nimport * as openIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/open.icon';\nimport * as starIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/star.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';\nimport * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';\nimport { Article, ArticleFooter } from '@pega/cosmos-react-cs';\n\nimport { ArticleMockData } from './Article.mocks';\n\nregisterIcon(openIcon, starIcon, caretLeftIcon, thumbsUpSolidIcon, thumbsDownSolidIcon);\n\nexport default {\n  title: 'Customer Service/Article',\n  component: Article,\n  subcomponents: { ArticleFooter },\n  parameters: {\n    layout: 'fullscreen'\n  }\n};\n\nexport const ArticleStory = () => {\n  const onBackToArticlesClick = (event: MouseEvent) => {\n    event.preventDefault();\n  };\n\n  return (\n    <div\n      style={{\n        maxWidth: '31.25rem',\n        maxHeight: '100vh'\n      }}\n    >\n      <Article\n        navigation={\n          <Link href='/' onClick={onBackToArticlesClick}>\n            <Flex container={{ alignItems: 'center', gap: 1 }}>\n              <Icon name='caret-left' />\n              <Text>Back to all articles</Text>\n            </Flex>\n          </Link>\n        }\n        primaryActions={\n          <>\n            <Button aria-label='star' variant='simple' icon>\n              <Icon name='star' />\n            </Button>\n            <Button aria-label='open' variant='simple' icon>\n              <Icon name='open' />\n            </Button>\n          </>\n        }\n        secondaryActions={[\n          {\n            text: 'Filter 1',\n            id: 'f1a'\n          },\n          {\n            text: 'Filter 2',\n            id: 'f2a'\n          }\n        ]}\n        content={\n          // TODO : Container components need to ensure that html being sent to the __html below needs to be free from XSS attack\n          // eslint-disable-next-line react/no-danger\n          <div dangerouslySetInnerHTML={{ __html: ArticleMockData.fullArticleContent.content }} />\n        }\n        skeletonize={false}\n        title={ArticleMockData.fullArticleContent.header}\n        meta={[\n          <Text variant='secondary' aria-label='category'>\n            {ArticleMockData.fullArticleContent.meta.category}\n          </Text>,\n          <Text variant='secondary' aria-label='published date'>\n            {ArticleMockData.fullArticleContent.meta.publishedDate}\n          </Text>,\n          <Flex container={{ gap: 2, alignItems: 'center' }}>\n            <Flex container={{ gap: 1, alignItems: 'center' }}>\n              <Icon name='thumbs-up-solid' />\n              <Text aria-label='likes'>({ArticleMockData.fullArticleContent.meta.likes})</Text>\n            </Flex>\n            <Flex container={{ gap: 1, alignItems: 'center' }}>\n              <Icon name='thumbs-down-solid' />\n              <Text aria-label='dislikes'>\n                ({ArticleMockData.fullArticleContent.meta.disLikes})\n              </Text>\n            </Flex>\n          </Flex>\n        ]}\n        footer={\n          <ArticleFooter\n            content={\n              <Flex container={{ gap: 1 }}>\n                <Text>Was this helpful ?</Text> <Button>Yes</Button> <Button>No</Button>\n              </Flex>\n            }\n            tags={[\n              {\n                id: 'Retail banking',\n                tagName: '#Retail_banking'\n              },\n              {\n                id: 'difficult_customers',\n                tagName: '#Difficult_customers'\n              },\n              {\n                id: '223444',\n                tagName: '#CSR_Skills'\n              },\n              {\n                id: '223446',\n                tagName: '#Premium_Customers'\n              },\n              {\n                id: '223447',\n                tagName: '#Rare_Customers'\n              },\n              {\n                id: '223448',\n                tagName: '#Finance_Customers'\n              }\n            ]}\n            onTagClick={action('Tag clicked')}\n          />\n        }\n      />\n    </div>\n  );\n};\n\nexport const ArticleStorySkeletonize = () => {\n  const onBackToArticlesClick = (event: MouseEvent) => {\n    event.preventDefault();\n  };\n\n  return (\n    <div style={{ maxWidth: '31.25rem', maxHeight: '100vh' }}>\n      <Article\n        skeletonize\n        navigation={\n          <Link href='/' onClick={onBackToArticlesClick}>\n            <Flex container={{ alignItems: 'center', gap: 1 }}>\n              <Icon name='caret-left' />\n              <Text>Back to articles</Text>\n            </Flex>\n          </Link>\n        }\n        primaryActions={\n          <>\n            <Button variant='simple' icon>\n              <Icon name='star' />\n            </Button>\n            <Button variant='simple' icon>\n              <Icon name='open' />\n            </Button>\n          </>\n        }\n        secondaryActions={[\n          {\n            text: 'Filter 1',\n            id: 'f1a'\n          },\n          {\n            text: 'Filter 2',\n            id: 'f2a'\n          }\n        ]}\n      />\n    </div>\n  );\n};\n"]}

package/lib/cs/ArticleList/ArticleList.mocks.d.ts

@@ -1,21 +0,0 @@
-export declare const ArticleListMockData: {
-    articleList: {
-        articleId: string;
-        header: string;
-        abstract: string;
-        meta: {
-            category: string;
-            publishedDate: string;
-            likes: number;
-            disLikes: number;
-        };
-    }[];
-    categoriesList: {
-        id: string;
-        name: string;
-        level: string;
-        category: string;
-    }[];
-    sortByOptions: string[];
-};
-//# sourceMappingURL=ArticleList.mocks.d.ts.map

package/lib/cs/ArticleList/ArticleList.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ArticleList.mocks.d.ts","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.mocks.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;CA4G/B,CAAC"}