@pega/cosmos-react-demos 4.0.0-dev.12.1 → 4.0.0-dev.14.0

package/jsx/core/Popover/Popover.mocks.jsx

@@ -0,0 +1,114 @@
+import styled, { createGlobalStyle, css } from 'styled-components';
+import { createContext, useLayoutEffect, useMemo } from 'react';
+import { defaultThemeProp, Popover, useElement } from '@pega/cosmos-react-core';
+const PopoverMockContext = createContext({
+    arrow: false,
+    primaryPlacement: 'bottom',
+    secondaryPlacement: 'none',
+    contentSize: 1
+});
+const Target = styled.div ``;
+const PopoverMockHeader = styled.div ``;
+const PopoverMockContent = styled.div(({ theme }) => {
+    return css `
+    min-width: ${theme.base['content-width'].md};
+    overflow: auto;
+  `;
+});
+const PopoverMockFooter = styled.div ``;
+const MockContentBlock = styled.div(({ theme }) => {
+    return css `
+    padding-block: ${theme.base.spacing};
+    border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};
+
+    &:first-child {
+      padding-block-start: 0;
+    }
+
+    &:last-child {
+      border: none;
+      padding-block-end: 0;
+    }
+  `;
+});
+MockContentBlock.defaultProps = defaultThemeProp;
+const PopoverMock = styled(Popover)(({ theme }) => {
+    return css `
+    display: flex;
+    flex-direction: column;
+
+    ${PopoverMockHeader},
+    ${PopoverMockContent},
+    ${PopoverMockFooter} {
+      padding: calc(2 * ${theme.base.spacing});
+    }
+  `;
+});
+PopoverMock.defaultProps = defaultThemeProp;
+const GlobalStyle = createGlobalStyle(({ theme }) => {
+    return css `
+    :root {
+      &::before,
+      &::after {
+        position: fixed;
+        content: '';
+        background-color: purple;
+        display: block;
+      }
+
+      &::before {
+        left: 0;
+        right: 0;
+        top: calc(50% - 0.0625rem);
+        height: 0.125rem;
+      }
+
+      &::after {
+        top: 0;
+        bottom: 0;
+        left: calc(50% - 0.0625rem);
+        width: 0.125rem;
+      }
+    }
+
+    body {
+      width: calc(200% - 2rem);
+      height: calc(200% - 2rem);
+    }
+
+    ${Target} {
+      position: absolute;
+      width: 2rem;
+      height: 2rem;
+      inset: 100% auto auto 100%;
+      transform: translate(-2rem, -2rem);
+      background-color: ${theme.base.palette['foreground-color']};
+    }
+  `;
+});
+export const PlaceAndContainMock = ({ arrow, primaryPlacement, secondaryPlacement, contentSize }) => {
+    const [target, setTarget] = useElement(null);
+    useLayoutEffect(() => {
+        const vw = document.documentElement.clientWidth;
+        const vh = document.documentElement.clientHeight;
+        window.scrollTo(vw / 2 - 16, vh / 2 - 16);
+    }, []);
+    const mockContent = Array.from({ length: contentSize }, (_, i) => {
+        return <MockContentBlock key={i}>Content item {i + 1}</MockContentBlock>;
+    });
+    const ctxValue = useMemo(() => {
+        return { arrow, primaryPlacement, secondaryPlacement, contentSize };
+    }, [arrow, primaryPlacement, secondaryPlacement, contentSize]);
+    return (<>
+      <GlobalStyle />
+      <PopoverMockContext.Provider value={ctxValue}>
+        <Target ref={setTarget}/>
+        <PopoverMock arrow={arrow} target={target} placement={`${primaryPlacement}${secondaryPlacement && secondaryPlacement !== 'none' ? `-${secondaryPlacement}` : ''}`}>
+          <PopoverMockHeader>Header</PopoverMockHeader>
+          <PopoverMockContent>{mockContent}</PopoverMockContent>
+          <PopoverMockFooter>Footer</PopoverMockFooter>
+        </PopoverMock>
+      </PopoverMockContext.Provider>
+    </>);
+};
+//# sourceMappingURL=Popover.mocks.jsx.map

package/jsx/core/Popover/Popover.mocks.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Popover/Popover.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import styled, { createGlobalStyle, css } from 'styled-components';\nimport { createContext, useLayoutEffect, useMemo } from 'react';\n\nimport { defaultThemeProp, Popover, PopoverProps, useElement } from '@pega/cosmos-react-core';\n\nexport interface PlaceAndContainMockProps extends Pick<PopoverProps, 'arrow'> {\n  primaryPlacement: 'bottom' | 'top' | 'left' | 'right' | 'none';\n  secondaryPlacement: 'start' | 'end' | 'none';\n  contentSize: number;\n}\n\nconst PopoverMockContext = createContext<PlaceAndContainMockProps>({\n  arrow: false,\n  primaryPlacement: 'bottom',\n  secondaryPlacement: 'none',\n  contentSize: 1\n});\n\nconst Target = styled.div``;\n\nconst PopoverMockHeader = styled.div``;\n\nconst PopoverMockContent = styled.div(({ theme }) => {\n  return css`\n    min-width: ${theme.base['content-width'].md};\n    overflow: auto;\n  `;\n});\n\nconst PopoverMockFooter = styled.div``;\n\nconst MockContentBlock = styled.div(({ theme }) => {\n  return css`\n    padding-block: ${theme.base.spacing};\n    border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n\n    &:first-child {\n      padding-block-start: 0;\n    }\n\n    &:last-child {\n      border: none;\n      padding-block-end: 0;\n    }\n  `;\n});\n\nMockContentBlock.defaultProps = defaultThemeProp;\n\nconst PopoverMock = styled(Popover)(({ theme }) => {\n  return css`\n    display: flex;\n    flex-direction: column;\n\n    ${PopoverMockHeader},\n    ${PopoverMockContent},\n    ${PopoverMockFooter} {\n      padding: calc(2 * ${theme.base.spacing});\n    }\n  `;\n});\n\nPopoverMock.defaultProps = defaultThemeProp;\n\nconst GlobalStyle = createGlobalStyle(({ theme }) => {\n  return css`\n    :root {\n      &::before,\n      &::after {\n        position: fixed;\n        content: '';\n        background-color: purple;\n        display: block;\n      }\n\n      &::before {\n        left: 0;\n        right: 0;\n        top: calc(50% - 0.0625rem);\n        height: 0.125rem;\n      }\n\n      &::after {\n        top: 0;\n        bottom: 0;\n        left: calc(50% - 0.0625rem);\n        width: 0.125rem;\n      }\n    }\n\n    body {\n      width: calc(200% - 2rem);\n      height: calc(200% - 2rem);\n    }\n\n    ${Target} {\n      position: absolute;\n      width: 2rem;\n      height: 2rem;\n      inset: 100% auto auto 100%;\n      transform: translate(-2rem, -2rem);\n      background-color: ${theme.base.palette['foreground-color']};\n    }\n  `;\n});\n\nexport const PlaceAndContainMock = ({\n  arrow,\n  primaryPlacement,\n  secondaryPlacement,\n  contentSize\n}: PlaceAndContainMockProps) => {\n  const [target, setTarget] = useElement<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    const vw = document.documentElement.clientWidth;\n    const vh = document.documentElement.clientHeight;\n\n    window.scrollTo(vw / 2 - 16, vh / 2 - 16);\n  }, []);\n\n  const mockContent = Array.from({ length: contentSize }, (_, i) => {\n    return <MockContentBlock key={i}>Content item {i + 1}</MockContentBlock>;\n  });\n\n  const ctxValue = useMemo(() => {\n    return { arrow, primaryPlacement, secondaryPlacement, contentSize };\n  }, [arrow, primaryPlacement, secondaryPlacement, contentSize]);\n\n  return (\n    <>\n      <GlobalStyle />\n      <PopoverMockContext.Provider value={ctxValue}>\n        <Target ref={setTarget} />\n        <PopoverMock\n          arrow={arrow}\n          target={target}\n          placement={`${primaryPlacement}${\n            secondaryPlacement && secondaryPlacement !== 'none' ? `-${secondaryPlacement}` : ''\n          }`}\n        >\n          <PopoverMockHeader>Header</PopoverMockHeader>\n          <PopoverMockContent>{mockContent}</PopoverMockContent>\n          <PopoverMockFooter>Footer</PopoverMockFooter>\n        </PopoverMock>\n      </PopoverMockContext.Provider>\n    </>\n  );\n};\n"]}

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

@@ -1,7 +1,13 @@
 import { Meta, Story } from '@storybook/react';
 import { PopoverProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+import { PlaceAndContainMockProps } from './Popover.mocks';
+declare const _default: Meta;
 export default _default;
 export declare const PopoverDemo: Story<Pick<PopoverProps, 'arrow' | 'showDelay' | 'hideDelay' | 'placement'>>;
 export declare const PopoverGroups: Story;
+export declare const PlaceAndContain: Story<PlaceAndContainMockProps & {
+    placement?: never;
+    showDelay?: never;
+    hideDelay?: never;
+}>;
 //# sourceMappingURL=Popover.stories.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Popover.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Popover/Popover.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAOL,YAAY,EAIb,MAAM,yBAAyB,CAAC;;AAEjC,wBAkCU;AAEV,eAAO,MAAM,WAAW,EAAE,KAAK,CAC7B,IAAI,CAAC,YAAY,EAAE,OAAO,GAAG,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC,CAqFtE,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAmF3B,CAAC"}
+{"version":3,"file":"Popover.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Popover/Popover.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAOL,YAAY,EAIb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAuB,wBAAwB,EAAE,MAAM,iBAAiB,CAAC;;AAEhF,wBAkCU;AAEV,eAAO,MAAM,WAAW,EAAE,KAAK,CAC7B,IAAI,CAAC,YAAY,EAAE,OAAO,GAAG,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC,CAqFtE,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAmF3B,CAAC;AASF,eAAO,MAAM,eAAe,EAAE,KAAK,CACjC,wBAAwB,GAAG;IAAE,SAAS,CAAC,EAAE,KAAK,CAAC;IAAC,SAAS,CAAC,EAAE,KAAK,CAAC;IAAC,SAAS,CAAC,EAAE,KAAK,CAAA;CAAE,CAGvF,CAAC"}

package/jsx/core/Popover/Popover.stories.jsx

@@ -1,5 +1,6 @@
 import { useState } from 'react';
 import { Button, Card, CardContent, Flex, Link, Popover, Text, Tooltip, useElement } from '@pega/cosmos-react-core';
+import { PlaceAndContainMock } from './Popover.mocks';
 export default {
     title: 'Core/Popover',
     component: Popover,
@@ -179,4 +180,30 @@ PopoverGroups.argTypes = {
     hideDelay: { table: { disable: true } },
     placement: { table: { disable: true } }
 };
+export const PlaceAndContain = (args) => {
+    return <PlaceAndContainMock {...args}/>;
+};
+PlaceAndContain.args = {
+    arrow: false,
+    primaryPlacement: 'bottom',
+    secondaryPlacement: 'none',
+    contentSize: 15
+};
+PlaceAndContain.argTypes = {
+    arrow: { control: { type: 'boolean' } },
+    primaryPlacement: {
+        control: { type: 'select' },
+        options: ['bottom', 'top', 'left', 'right', 'none']
+    },
+    secondaryPlacement: {
+        control: { type: 'select' },
+        options: ['none', 'start', 'end']
+    },
+    contentSize: {
+        control: { type: 'range', min: 1, max: 30, step: 1 }
+    },
+    placement: { table: { disable: true } },
+    showDelay: { table: { disable: true } },
+    hideDelay: { table: { disable: true } }
+};
 //# sourceMappingURL=Popover.stories.jsx.map

package/jsx/core/Popover/Popover.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.stories.jsx","sourceRoot":"","sources":["../../../src/core/Popover/Popover.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport {\n  Button,\n  Card,\n  CardContent,\n  Flex,\n  Link,\n  Popover,\n  PopoverProps,\n  Text,\n  Tooltip,\n  useElement\n} from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Popover',\n  component: Popover,\n  args: {\n    arrow: false,\n    showDelay: 'none',\n    hideDelay: 'none',\n    placement: 'bottom'\n  },\n  argTypes: {\n    arrow: { control: { type: 'boolean' } },\n    showDelay: { options: ['none', 'short', 'long'], control: { type: 'select' } },\n    hideDelay: { options: ['none', 'short', 'long'], control: { type: 'select' } },\n    placement: {\n      options: [\n        'bottom',\n        'bottom-start',\n        'bottom-end',\n        'top',\n        'top-start',\n        'top-end',\n        'left',\n        'left-start',\n        'left-end',\n        'right',\n        'right-start',\n        'right-end',\n        'auto',\n        'auto-start',\n        'auto-end'\n      ],\n      control: { type: 'select' }\n    }\n  }\n} as Meta;\n\nexport const PopoverDemo: Story<\n  Pick<PopoverProps, 'arrow' | 'showDelay' | 'hideDelay' | 'placement'>\n> = (args: Pick<PopoverProps, 'arrow' | 'showDelay' | 'hideDelay' | 'placement'>) => {\n  const [mountHoverPopover, setMountHoverPopover] = useState(false);\n  const setHoverPopoverEl = useElement<HTMLDivElement>()[1];\n  const [textEl, setTextEl] = useElement<HTMLDivElement>();\n\n  const [mountClickPopover, setMountClickPopover] = useState(false);\n  const setClickPopoverEl = useElement<HTMLDivElement>()[1];\n  const [buttonEl, setButtonEl] = useElement<HTMLButtonElement>();\n\n  const toggleHoverPopover = ({ type, key }: { type: string; key: string }) => {\n    if (type === 'keydown') {\n      if (key === 'Escape') setMountHoverPopover(false);\n      return;\n    }\n    setMountHoverPopover(type === 'mouseover' || type === 'focus');\n  };\n\n  const hoverMountingHandlers = {\n    onMouseOver: toggleHoverPopover,\n    onMouseOut: toggleHoverPopover,\n    onKeyDown: toggleHoverPopover,\n    onFocus: toggleHoverPopover,\n    onBlur: toggleHoverPopover\n  };\n\n  const toggleClickPopover = ({ type, key }: { type: string; key: string }) => {\n    if (type === 'keydown') {\n      if (key === 'Escape') setMountClickPopover(false);\n      return;\n    }\n    setMountClickPopover(type === 'click' || type === 'focus');\n  };\n\n  const clickMountingHandlers = {\n    onClick: toggleClickPopover,\n    onKeyDown: toggleClickPopover,\n    onFocus: toggleClickPopover,\n    onBlur: toggleClickPopover\n  };\n\n  return (\n    <Flex container={{ justify: 'center', pad: 4, gap: 4, alignItems: 'center' }}>\n      <Text ref={setTextEl} variant='h1' {...hoverMountingHandlers}>\n        Hover Over Me\n      </Text>\n      <Popover\n        ref={setHoverPopoverEl}\n        show={mountHoverPopover}\n        target={textEl}\n        portal\n        arrow={args.arrow}\n        showDelay={args.showDelay}\n        hideDelay={args.hideDelay}\n        placement={args.placement}\n        {...hoverMountingHandlers}\n      >\n        <Card>\n          <CardContent>\n            <Text>This Popover appears on hover!</Text>\n          </CardContent>\n        </Card>\n      </Popover>\n      <Button ref={setButtonEl} {...clickMountingHandlers}>\n        Click Me\n      </Button>\n      <Popover\n        ref={setClickPopoverEl}\n        show={mountClickPopover}\n        target={buttonEl}\n        portal\n        arrow={args.arrow}\n        showDelay={args.showDelay}\n        hideDelay={args.hideDelay}\n        placement={args.placement}\n        {...clickMountingHandlers}\n      >\n        <Card>\n          <CardContent>\n            <Text>This Popover appears on click!</Text>\n          </CardContent>\n        </Card>\n      </Popover>\n    </Flex>\n  );\n};\n\nexport const PopoverGroups: Story = () => {\n  const [firstTooltipButton, setFirstTooltipButton] = useElement<HTMLButtonElement>();\n  const [secondTooltipButton, setSecondTooltipButton] = useElement<HTMLButtonElement>();\n  const [thirdTooltipButton, setThirdTooltipButton] = useElement<HTMLButtonElement>();\n\n  const [firstPopoverButton, setFirstPopoverButton] = useElement<HTMLButtonElement>();\n  const [secondPopoverButton, setSecondPopoverButton] = useElement<HTMLButtonElement>();\n  const [thirdPopoverButton, setThirdPopoverButton] = useElement<HTMLButtonElement>();\n\n  const [showFirstPopover, setShowFirstPopover] = useState(false);\n  const [showSecondPopover, setShowSecondPopover] = useState(false);\n  const [showThirdPopover, setShowThirdPopover] = useState(false);\n\n  return (\n    <Flex container={{ direction: 'column', gap: 4 }}>\n      <Text variant='h2'>groupId: link_preview</Text>\n      <div>\n        <Link href='http://www.google.com' previewable>\n          Previewable Link\n        </Link>\n        <Link href='http://www.google.com' previewable>\n          Previewable Link\n        </Link>\n        <Link href='http://www.google.com' previewable>\n          Previewable Link\n        </Link>\n      </div>\n      <Text variant='h2'>groupId: tooltip</Text>\n      <div>\n        <Button ref={setFirstTooltipButton} aria-describedby='first-tooltip'>\n          Hover me\n        </Button>\n        <Tooltip target={firstTooltipButton} id='first-tooltip'>\n          This is a tooltip for the first button.\n        </Tooltip>\n        <Button ref={setSecondTooltipButton} aria-describedby='second-tooltip'>\n          Hover me\n        </Button>\n        <Tooltip target={secondTooltipButton} id='second-tooltip'>\n          This is a tooltip for the second button.\n        </Tooltip>\n        <Button ref={setThirdTooltipButton} aria-describedby='third-tooltip'>\n          Hover me\n        </Button>\n        <Tooltip target={thirdTooltipButton} id='third-tooltip'>\n          This is a tooltip for the third button.\n        </Tooltip>\n      </div>\n      <Text variant='h2'>No groupId</Text>\n      <div>\n        <Button ref={setFirstPopoverButton} onClick={() => setShowFirstPopover(curr => !curr)}>\n          Click me\n        </Button>\n        <Popover show={showFirstPopover} target={firstPopoverButton}>\n          <Card>\n            <CardContent>\n              <Text>Popover #1</Text>\n            </CardContent>\n          </Card>\n        </Popover>\n        <Button ref={setSecondPopoverButton} onClick={() => setShowSecondPopover(curr => !curr)}>\n          Click me\n        </Button>\n        <Popover show={showSecondPopover} target={secondPopoverButton}>\n          <Card>\n            <CardContent>\n              <Text>Popover #2</Text>\n            </CardContent>\n          </Card>\n        </Popover>\n        <Button ref={setThirdPopoverButton} onClick={() => setShowThirdPopover(curr => !curr)}>\n          Click me\n        </Button>\n        <Popover show={showThirdPopover} target={thirdPopoverButton}>\n          <Card>\n            <CardContent>\n              <Text>Popover #3</Text>\n            </CardContent>\n          </Card>\n        </Popover>\n      </div>\n    </Flex>\n  );\n};\n\nPopoverGroups.argTypes = {\n  arrow: { table: { disable: true } },\n  showDelay: { table: { disable: true } },\n  hideDelay: { table: { disable: true } },\n  placement: { table: { disable: true } }\n};\n"]}
+{"version":3,"file":"Popover.stories.jsx","sourceRoot":"","sources":["../../../src/core/Popover/Popover.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport {\n  Button,\n  Card,\n  CardContent,\n  Flex,\n  Link,\n  Popover,\n  PopoverProps,\n  Text,\n  Tooltip,\n  useElement\n} from '@pega/cosmos-react-core';\n\nimport { PlaceAndContainMock, PlaceAndContainMockProps } from './Popover.mocks';\n\nexport default {\n  title: 'Core/Popover',\n  component: Popover,\n  args: {\n    arrow: false,\n    showDelay: 'none',\n    hideDelay: 'none',\n    placement: 'bottom'\n  },\n  argTypes: {\n    arrow: { control: { type: 'boolean' } },\n    showDelay: { options: ['none', 'short', 'long'], control: { type: 'select' } },\n    hideDelay: { options: ['none', 'short', 'long'], control: { type: 'select' } },\n    placement: {\n      options: [\n        'bottom',\n        'bottom-start',\n        'bottom-end',\n        'top',\n        'top-start',\n        'top-end',\n        'left',\n        'left-start',\n        'left-end',\n        'right',\n        'right-start',\n        'right-end',\n        'auto',\n        'auto-start',\n        'auto-end'\n      ],\n      control: { type: 'select' }\n    }\n  }\n} as Meta;\n\nexport const PopoverDemo: Story<\n  Pick<PopoverProps, 'arrow' | 'showDelay' | 'hideDelay' | 'placement'>\n> = (args: Pick<PopoverProps, 'arrow' | 'showDelay' | 'hideDelay' | 'placement'>) => {\n  const [mountHoverPopover, setMountHoverPopover] = useState(false);\n  const setHoverPopoverEl = useElement<HTMLDivElement>()[1];\n  const [textEl, setTextEl] = useElement<HTMLDivElement>();\n\n  const [mountClickPopover, setMountClickPopover] = useState(false);\n  const setClickPopoverEl = useElement<HTMLDivElement>()[1];\n  const [buttonEl, setButtonEl] = useElement<HTMLButtonElement>();\n\n  const toggleHoverPopover = ({ type, key }: { type: string; key: string }) => {\n    if (type === 'keydown') {\n      if (key === 'Escape') setMountHoverPopover(false);\n      return;\n    }\n    setMountHoverPopover(type === 'mouseover' || type === 'focus');\n  };\n\n  const hoverMountingHandlers = {\n    onMouseOver: toggleHoverPopover,\n    onMouseOut: toggleHoverPopover,\n    onKeyDown: toggleHoverPopover,\n    onFocus: toggleHoverPopover,\n    onBlur: toggleHoverPopover\n  };\n\n  const toggleClickPopover = ({ type, key }: { type: string; key: string }) => {\n    if (type === 'keydown') {\n      if (key === 'Escape') setMountClickPopover(false);\n      return;\n    }\n    setMountClickPopover(type === 'click' || type === 'focus');\n  };\n\n  const clickMountingHandlers = {\n    onClick: toggleClickPopover,\n    onKeyDown: toggleClickPopover,\n    onFocus: toggleClickPopover,\n    onBlur: toggleClickPopover\n  };\n\n  return (\n    <Flex container={{ justify: 'center', pad: 4, gap: 4, alignItems: 'center' }}>\n      <Text ref={setTextEl} variant='h1' {...hoverMountingHandlers}>\n        Hover Over Me\n      </Text>\n      <Popover\n        ref={setHoverPopoverEl}\n        show={mountHoverPopover}\n        target={textEl}\n        portal\n        arrow={args.arrow}\n        showDelay={args.showDelay}\n        hideDelay={args.hideDelay}\n        placement={args.placement}\n        {...hoverMountingHandlers}\n      >\n        <Card>\n          <CardContent>\n            <Text>This Popover appears on hover!</Text>\n          </CardContent>\n        </Card>\n      </Popover>\n      <Button ref={setButtonEl} {...clickMountingHandlers}>\n        Click Me\n      </Button>\n      <Popover\n        ref={setClickPopoverEl}\n        show={mountClickPopover}\n        target={buttonEl}\n        portal\n        arrow={args.arrow}\n        showDelay={args.showDelay}\n        hideDelay={args.hideDelay}\n        placement={args.placement}\n        {...clickMountingHandlers}\n      >\n        <Card>\n          <CardContent>\n            <Text>This Popover appears on click!</Text>\n          </CardContent>\n        </Card>\n      </Popover>\n    </Flex>\n  );\n};\n\nexport const PopoverGroups: Story = () => {\n  const [firstTooltipButton, setFirstTooltipButton] = useElement<HTMLButtonElement>();\n  const [secondTooltipButton, setSecondTooltipButton] = useElement<HTMLButtonElement>();\n  const [thirdTooltipButton, setThirdTooltipButton] = useElement<HTMLButtonElement>();\n\n  const [firstPopoverButton, setFirstPopoverButton] = useElement<HTMLButtonElement>();\n  const [secondPopoverButton, setSecondPopoverButton] = useElement<HTMLButtonElement>();\n  const [thirdPopoverButton, setThirdPopoverButton] = useElement<HTMLButtonElement>();\n\n  const [showFirstPopover, setShowFirstPopover] = useState(false);\n  const [showSecondPopover, setShowSecondPopover] = useState(false);\n  const [showThirdPopover, setShowThirdPopover] = useState(false);\n\n  return (\n    <Flex container={{ direction: 'column', gap: 4 }}>\n      <Text variant='h2'>groupId: link_preview</Text>\n      <div>\n        <Link href='http://www.google.com' previewable>\n          Previewable Link\n        </Link>\n        <Link href='http://www.google.com' previewable>\n          Previewable Link\n        </Link>\n        <Link href='http://www.google.com' previewable>\n          Previewable Link\n        </Link>\n      </div>\n      <Text variant='h2'>groupId: tooltip</Text>\n      <div>\n        <Button ref={setFirstTooltipButton} aria-describedby='first-tooltip'>\n          Hover me\n        </Button>\n        <Tooltip target={firstTooltipButton} id='first-tooltip'>\n          This is a tooltip for the first button.\n        </Tooltip>\n        <Button ref={setSecondTooltipButton} aria-describedby='second-tooltip'>\n          Hover me\n        </Button>\n        <Tooltip target={secondTooltipButton} id='second-tooltip'>\n          This is a tooltip for the second button.\n        </Tooltip>\n        <Button ref={setThirdTooltipButton} aria-describedby='third-tooltip'>\n          Hover me\n        </Button>\n        <Tooltip target={thirdTooltipButton} id='third-tooltip'>\n          This is a tooltip for the third button.\n        </Tooltip>\n      </div>\n      <Text variant='h2'>No groupId</Text>\n      <div>\n        <Button ref={setFirstPopoverButton} onClick={() => setShowFirstPopover(curr => !curr)}>\n          Click me\n        </Button>\n        <Popover show={showFirstPopover} target={firstPopoverButton}>\n          <Card>\n            <CardContent>\n              <Text>Popover #1</Text>\n            </CardContent>\n          </Card>\n        </Popover>\n        <Button ref={setSecondPopoverButton} onClick={() => setShowSecondPopover(curr => !curr)}>\n          Click me\n        </Button>\n        <Popover show={showSecondPopover} target={secondPopoverButton}>\n          <Card>\n            <CardContent>\n              <Text>Popover #2</Text>\n            </CardContent>\n          </Card>\n        </Popover>\n        <Button ref={setThirdPopoverButton} onClick={() => setShowThirdPopover(curr => !curr)}>\n          Click me\n        </Button>\n        <Popover show={showThirdPopover} target={thirdPopoverButton}>\n          <Card>\n            <CardContent>\n              <Text>Popover #3</Text>\n            </CardContent>\n          </Card>\n        </Popover>\n      </div>\n    </Flex>\n  );\n};\n\nPopoverGroups.argTypes = {\n  arrow: { table: { disable: true } },\n  showDelay: { table: { disable: true } },\n  hideDelay: { table: { disable: true } },\n  placement: { table: { disable: true } }\n};\n\nexport const PlaceAndContain: Story<\n  PlaceAndContainMockProps & { placement?: never; showDelay?: never; hideDelay?: never }\n> = (args: PlaceAndContainMockProps) => {\n  return <PlaceAndContainMock {...args} />;\n};\n\nPlaceAndContain.args = {\n  arrow: false,\n  primaryPlacement: 'bottom',\n  secondaryPlacement: 'none',\n  contentSize: 15\n};\n\nPlaceAndContain.argTypes = {\n  arrow: { control: { type: 'boolean' } },\n  primaryPlacement: {\n    control: { type: 'select' },\n    options: ['bottom', 'top', 'left', 'right', 'none']\n  },\n  secondaryPlacement: {\n    control: { type: 'select' },\n    options: ['none', 'start', 'end']\n  },\n  contentSize: {\n    control: { type: 'range', min: 1, max: 30, step: 1 }\n  },\n  placement: { table: { disable: true } },\n  showDelay: { table: { disable: true } },\n  hideDelay: { table: { disable: true } }\n};\n"]}

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

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
 import { ProgressProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 interface ProgressDemoProps extends ProgressProps {
     announce?: boolean;

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

@@ -1,5 +1,5 @@
 import { Meta, Story } from '@storybook/react';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 interface QRCodeDemoProps {
     value: string;

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

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
 import { RadioCheckProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 interface RadioCheckStoryProps extends RadioCheckProps {
     showAdditionalInfo?: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"RadioButton.stories.d.ts","sourceRoot":"","sources":["../../../src/core/RadioButton/RadioButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAA8B,eAAe,EAAE,MAAM,yBAAyB,CAAC;;AAEtF,wBAoBU;AAEV,UAAU,oBAAqB,SAAQ,eAAe;IACpD,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,oBAAoB,CAkB1D,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,oBAAoB,CAmBvD,CAAC;AAEF,UAAU,4BAA6B,SAAQ,eAAe;IAC5D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,4BAA4B,CAwCvE,CAAC"}
+{"version":3,"file":"RadioButton.stories.d.ts","sourceRoot":"","sources":["../../../src/core/RadioButton/RadioButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAA8B,eAAe,EAAE,MAAM,yBAAyB,CAAC;;AAEtF,wBAsBU;AAEV,UAAU,oBAAqB,SAAQ,eAAe;IACpD,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,oBAAoB,CAmB1D,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,oBAAoB,CAmBvD,CAAC;AAEF,UAAU,4BAA6B,SAAQ,eAAe;IAC5D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,4BAA4B,CAwCvE,CAAC"}

package/jsx/core/RadioButton/RadioButton.stories.jsx

@@ -5,6 +5,7 @@ export default {
     excludeStories: ['ConfigurableRadioButton'],
     args: {
         status: undefined,
+        info: 'You must select it',
         label: 'Choose me',
         required: false,
         disabled: false,
@@ -13,6 +14,7 @@ export default {
     },
     argTypes: {
         status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },
+        info: { control: { type: 'text' } },
         label: { control: { type: 'text' } },
         required: { control: { type: 'boolean' } },
         disabled: { control: { type: 'boolean' } },
@@ -26,7 +28,7 @@ export const DefaultRadioButton = (args) => {
                 heading: 'Additional Info',
                 content: 'Some additional info'
             }
-            : undefined} status={args.status} label={args.label} required={args.required} disabled={args.disabled} readOnly={args.readOnly}/>);
+            : undefined} status={args.status} info={args.info} label={args.label} required={args.required} disabled={args.disabled} readOnly={args.readOnly}/>);
 };
 export const RadioButtonCard = (args) => {
     return (<RadioButton additionalInfo={args.showAdditionalInfo

package/jsx/core/RadioButton/RadioButton.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButton.stories.jsx","sourceRoot":"","sources":["../../../src/core/RadioButton/RadioButton.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Configuration, RadioButton, RadioCheckProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/RadioButton',\n  component: RadioButton,\n  excludeStories: ['ConfigurableRadioButton'],\n  args: {\n    status: undefined,\n    label: 'Choose me',\n    required: false,\n    disabled: false,\n    readOnly: false,\n    showAdditionalInfo: true\n  },\n  argTypes: {\n    status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n    label: { control: { type: 'text' } },\n    required: { control: { type: 'boolean' } },\n    disabled: { control: { type: 'boolean' } },\n    readOnly: { control: { type: 'boolean' } },\n    showAdditionalInfo: { control: { type: 'boolean' } }\n  }\n} as Meta;\n\ninterface RadioCheckStoryProps extends RadioCheckProps {\n  showAdditionalInfo?: boolean;\n}\n\nexport const DefaultRadioButton: Story<RadioCheckStoryProps> = (args: RadioCheckStoryProps) => {\n  return (\n    <RadioButton\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      status={args.status}\n      label={args.label}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n    />\n  );\n};\n\nexport const RadioButtonCard: Story<RadioCheckStoryProps> = (args: RadioCheckStoryProps) => {\n  return (\n    <RadioButton\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      variant='card'\n      status={args.status}\n      label={args.label}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n    />\n  );\n};\n\ninterface ConfigurableRadioButtonProps extends RadioCheckProps {\n  size?: string;\n  backgroundColor?: string;\n  borderColor?: string;\n  borderWidth?: string;\n  borderRadius?: string;\n  labelColor?: string;\n  labelFontWeight?: string;\n  checkedBackgroundColor?: string;\n  checkedBorderColor?: string;\n  showAdditionalInfo?: boolean;\n}\n\nexport const ConfigurableRadioButton: Story<ConfigurableRadioButtonProps> = (\n  args: ConfigurableRadioButtonProps\n) => {\n  return (\n    <Configuration\n      theme={{\n        components: {\n          'radio-button': {\n            'border-radius': args.borderRadius\n          },\n          'radio-check': {\n            'border-color': args.borderColor,\n            'border-width': args.borderWidth,\n            'background-color': args.backgroundColor,\n            label: {\n              color: args.labelColor,\n              'font-weight': args.labelFontWeight\n            },\n            size: args.size,\n            ':checked': {\n              'background-color': args.checkedBackgroundColor,\n              'border-color': args.checkedBorderColor\n            }\n          }\n        }\n      }}\n    >\n      <RadioButton\n        additionalInfo={\n          args.showAdditionalInfo\n            ? {\n                heading: 'Additional Info',\n                content: 'Some additional info'\n              }\n            : undefined\n        }\n        label='Configurable Radio Button'\n      />\n    </Configuration>\n  );\n};\n\nConfigurableRadioButton.args = {\n  size: '1.25rem',\n  backgroundColor: '#ffffff',\n  borderColor: '#939393',\n  borderWidth: '0.0625rem',\n  borderRadius: '50%',\n  labelColor: '#939393',\n  labelFontWeight: '400',\n  checkedBackgroundColor: '#076bc9',\n  checkedBorderColor: '#076bc9'\n};\n\nConfigurableRadioButton.argTypes = {\n  size: { control: { type: 'text' } },\n  backgroundColor: { control: { type: 'color' } },\n  borderColor: { control: { type: 'color' } },\n  borderWidth: { control: { type: 'text' } },\n  borderRadius: { control: { type: 'text' } },\n  labelColor: { control: { type: 'color' } },\n  labelFontWeight: { control: { type: 'text' } },\n  checkedBackgroundColor: { control: { type: 'color' } },\n  checkedBorderColor: { control: { type: 'color' } },\n  status: { table: { disable: true } },\n  label: { table: { disable: true } },\n  required: { table: { disable: true } },\n  disabled: { table: { disable: true } },\n  readOnly: { table: { disable: true } }\n};\n"]}
+{"version":3,"file":"RadioButton.stories.jsx","sourceRoot":"","sources":["../../../src/core/RadioButton/RadioButton.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Configuration, RadioButton, RadioCheckProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/RadioButton',\n  component: RadioButton,\n  excludeStories: ['ConfigurableRadioButton'],\n  args: {\n    status: undefined,\n    info: 'You must select it',\n    label: 'Choose me',\n    required: false,\n    disabled: false,\n    readOnly: false,\n    showAdditionalInfo: true\n  },\n  argTypes: {\n    status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n    info: { control: { type: 'text' } },\n    label: { control: { type: 'text' } },\n    required: { control: { type: 'boolean' } },\n    disabled: { control: { type: 'boolean' } },\n    readOnly: { control: { type: 'boolean' } },\n    showAdditionalInfo: { control: { type: 'boolean' } }\n  }\n} as Meta;\n\ninterface RadioCheckStoryProps extends RadioCheckProps {\n  showAdditionalInfo?: boolean;\n}\n\nexport const DefaultRadioButton: Story<RadioCheckStoryProps> = (args: RadioCheckStoryProps) => {\n  return (\n    <RadioButton\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      status={args.status}\n      info={args.info}\n      label={args.label}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n    />\n  );\n};\n\nexport const RadioButtonCard: Story<RadioCheckStoryProps> = (args: RadioCheckStoryProps) => {\n  return (\n    <RadioButton\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      variant='card'\n      status={args.status}\n      label={args.label}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n    />\n  );\n};\n\ninterface ConfigurableRadioButtonProps extends RadioCheckProps {\n  size?: string;\n  backgroundColor?: string;\n  borderColor?: string;\n  borderWidth?: string;\n  borderRadius?: string;\n  labelColor?: string;\n  labelFontWeight?: string;\n  checkedBackgroundColor?: string;\n  checkedBorderColor?: string;\n  showAdditionalInfo?: boolean;\n}\n\nexport const ConfigurableRadioButton: Story<ConfigurableRadioButtonProps> = (\n  args: ConfigurableRadioButtonProps\n) => {\n  return (\n    <Configuration\n      theme={{\n        components: {\n          'radio-button': {\n            'border-radius': args.borderRadius\n          },\n          'radio-check': {\n            'border-color': args.borderColor,\n            'border-width': args.borderWidth,\n            'background-color': args.backgroundColor,\n            label: {\n              color: args.labelColor,\n              'font-weight': args.labelFontWeight\n            },\n            size: args.size,\n            ':checked': {\n              'background-color': args.checkedBackgroundColor,\n              'border-color': args.checkedBorderColor\n            }\n          }\n        }\n      }}\n    >\n      <RadioButton\n        additionalInfo={\n          args.showAdditionalInfo\n            ? {\n                heading: 'Additional Info',\n                content: 'Some additional info'\n              }\n            : undefined\n        }\n        label='Configurable Radio Button'\n      />\n    </Configuration>\n  );\n};\n\nConfigurableRadioButton.args = {\n  size: '1.25rem',\n  backgroundColor: '#ffffff',\n  borderColor: '#939393',\n  borderWidth: '0.0625rem',\n  borderRadius: '50%',\n  labelColor: '#939393',\n  labelFontWeight: '400',\n  checkedBackgroundColor: '#076bc9',\n  checkedBorderColor: '#076bc9'\n};\n\nConfigurableRadioButton.argTypes = {\n  size: { control: { type: 'text' } },\n  backgroundColor: { control: { type: 'color' } },\n  borderColor: { control: { type: 'color' } },\n  borderWidth: { control: { type: 'text' } },\n  borderRadius: { control: { type: 'text' } },\n  labelColor: { control: { type: 'color' } },\n  labelFontWeight: { control: { type: 'text' } },\n  checkedBackgroundColor: { control: { type: 'color' } },\n  checkedBorderColor: { control: { type: 'color' } },\n  status: { table: { disable: true } },\n  label: { table: { disable: true } },\n  required: { table: { disable: true } },\n  disabled: { table: { disable: true } },\n  readOnly: { table: { disable: true } }\n};\n"]}

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

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
 import { RadioCheckGroupProps, OmitStrict } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 interface RadioCheckGroupStoryProps extends RadioCheckGroupProps {
     showAdditionalInfo?: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"RadioButtonGroup.stories.d.ts","sourceRoot":"","sources":["../../../src/core/RadioButtonGroup/RadioButtonGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAML,oBAAoB,EAEpB,UAAU,EACX,MAAM,yBAAyB,CAAC;;AAIjC,wBAuBU;AAEV,UAAU,yBAA0B,SAAQ,oBAAoB;IAC9D,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,UAAU,CAAC,yBAAyB,EAAE,UAAU,CAAC,CAiFzF,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,UAAU,CAAC,yBAAyB,EAAE,UAAU,CAAC,CAwFzF,CAAC"}
+{"version":3,"file":"RadioButtonGroup.stories.d.ts","sourceRoot":"","sources":["../../../src/core/RadioButtonGroup/RadioButtonGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAML,oBAAoB,EAEpB,UAAU,EACX,MAAM,yBAAyB,CAAC;;AAIjC,wBA2BU;AAEV,UAAU,yBAA0B,SAAQ,oBAAoB;IAC9D,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,UAAU,CAAC,yBAAyB,EAAE,UAAU,CAAC,CAqFzF,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,UAAU,CAAC,yBAAyB,EAAE,UAAU,CAAC,CAwFzF,CAAC"}

package/jsx/core/RadioButtonGroup/RadioButtonGroup.stories.jsx

@@ -11,7 +11,9 @@ export default {
         disabled: false,
         readOnly: false,
         showAdditionalInfo: true,
-        showNestedAdditionalInfo: false
+        showNestedAdditionalInfo: false,
+        status: undefined,
+        info: 'You must select it'
     },
     argTypes: {
         labelHidden: { control: { type: 'boolean' } },
@@ -21,7 +23,9 @@ export default {
         disabled: { control: { type: 'boolean' } },
         readOnly: { control: { type: 'boolean' } },
         showAdditionalInfo: { control: { type: 'boolean' } },
-        showNestedAdditionalInfo: { control: { type: 'boolean' } }
+        showNestedAdditionalInfo: { control: { type: 'boolean' } },
+        status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },
+        info: { control: { type: 'text' } }
     }
 };
 export const RadioButtonGroupDemo = (args) => {
@@ -30,7 +34,7 @@ export const RadioButtonGroupDemo = (args) => {
                 heading: 'Additional Info',
                 content: 'Some additional info'
             }
-            : undefined} label='What do you want to eat?' name='Fruit' labelHidden={args.labelHidden} inline={args.inline} autoStack={args.autoStack} required={args.required} disabled={args.disabled} readOnly={args.readOnly}>
+            : undefined} label='What do you want to eat?' name='Fruit' labelHidden={args.labelHidden} inline={args.inline} autoStack={args.autoStack} required={args.required} disabled={args.disabled} readOnly={args.readOnly} status={args.status} info={args.info}>
       <RadioButton label='Banana' id='Banana' defaultChecked additionalInfo={{
             heading: 'Additional Info',
             content: 'Some additional info'
@@ -52,7 +56,7 @@ export const RadioButtonGroupDemo = (args) => {
                 heading: 'Additional Info',
                 content: 'Some additional info'
             }
-            : undefined} label='What do you want to eat?' name='Fruit' labelHidden={args.labelHidden} inline={args.inline} autoStack={args.autoStack} required={args.required} disabled={args.disabled} readOnly={args.readOnly}>
+            : undefined} label='What do you want to eat?' name='Fruit' labelHidden={args.labelHidden} inline={args.inline} autoStack={args.autoStack} required={args.required} disabled={args.disabled} readOnly={args.readOnly} status={args.status} info={args.info}>
       <RadioButton label='Banana' id='Banana' defaultChecked/>
       <RadioButton label='Apple' id='Apple'/>
       <RadioButton label='Mango' id='Mango'/>

package/jsx/core/RadioButtonGroup/RadioButtonGroup.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButtonGroup.stories.jsx","sourceRoot":"","sources":["../../../src/core/RadioButtonGroup/RadioButtonGroup.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport {\n  FieldGroup,\n  FieldValueList,\n  Flex,\n  RadioButton,\n  RadioButtonGroup,\n  RadioCheckGroupProps,\n  Text,\n  OmitStrict\n} from '@pega/cosmos-react-core';\n\nimport { Paragraph, StyledImage } from './RadioButtonGroup.styles';\n\nexport default {\n  title: 'Core/RadioButtonGroup',\n  component: RadioButtonGroup,\n  args: {\n    labelHidden: false,\n    inline: false,\n    autoStack: true,\n    required: false,\n    disabled: false,\n    readOnly: false,\n    showAdditionalInfo: true,\n    showNestedAdditionalInfo: false\n  },\n  argTypes: {\n    labelHidden: { control: { type: 'boolean' } },\n    inline: { control: { type: 'boolean' } },\n    autoStack: { control: { type: 'boolean' } },\n    required: { control: { type: 'boolean' } },\n    disabled: { control: { type: 'boolean' } },\n    readOnly: { control: { type: 'boolean' } },\n    showAdditionalInfo: { control: { type: 'boolean' } },\n    showNestedAdditionalInfo: { control: { type: 'boolean' } }\n  }\n} as Meta;\n\ninterface RadioCheckGroupStoryProps extends RadioCheckGroupProps {\n  showAdditionalInfo?: boolean;\n  showNestedAdditionalInfo?: boolean;\n}\n\nexport const RadioButtonGroupDemo: Story<OmitStrict<RadioCheckGroupStoryProps, 'children'>> = (\n  args: OmitStrict<RadioCheckGroupStoryProps, 'children'>\n) => {\n  return args.showNestedAdditionalInfo ? (\n    <RadioButtonGroup\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      label='What do you want to eat?'\n      name='Fruit'\n      labelHidden={args.labelHidden}\n      inline={args.inline}\n      autoStack={args.autoStack}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n    >\n      <RadioButton\n        label='Banana'\n        id='Banana'\n        defaultChecked\n        additionalInfo={{\n          heading: 'Additional Info',\n          content: 'Some additional info'\n        }}\n      />\n      <RadioButton\n        label='Apple'\n        id='Apple'\n        additionalInfo={{\n          heading: 'Additional Info',\n          content: 'Some additional info'\n        }}\n      />\n      <RadioButton\n        label='Mango'\n        id='Mango'\n        additionalInfo={{\n          heading: 'Additional Info',\n          content: 'Some additional info'\n        }}\n      />\n      <RadioButton\n        label='Orange'\n        id='Orange'\n        additionalInfo={{\n          heading: 'Additional Info',\n          content: 'Some additional info'\n        }}\n      />\n    </RadioButtonGroup>\n  ) : (\n    <RadioButtonGroup\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      label='What do you want to eat?'\n      name='Fruit'\n      labelHidden={args.labelHidden}\n      inline={args.inline}\n      autoStack={args.autoStack}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n    >\n      <RadioButton label='Banana' id='Banana' defaultChecked />\n      <RadioButton label='Apple' id='Apple' />\n      <RadioButton label='Mango' id='Mango' />\n      <RadioButton label='Orange' id='Orange' />\n    </RadioButtonGroup>\n  );\n};\n\nexport const RadioButtonCardGroup: Story<OmitStrict<RadioCheckGroupStoryProps, 'children'>> = (\n  args: OmitStrict<RadioCheckGroupStoryProps, 'children'>\n) => {\n  return (\n    <RadioButtonGroup\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      variant='card'\n      label='Which visuals appear satisfying?'\n      labelHidden={args.labelHidden}\n      inline={args.inline}\n      autoStack={args.autoStack}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n    >\n      <RadioButton\n        additionalInfo={\n          args.showNestedAdditionalInfo\n            ? {\n                heading: 'Additional Info',\n                content: 'Some additional info'\n              }\n            : undefined\n        }\n        label={\n          <Flex container={{ direction: 'column', gap: 1 }}>\n            <Text variant='h4'>A paragraph</Text>\n            <Paragraph>\n              This is a paragraph of text. It is meant to appear visually satisfying amongst the\n              other options in this group.\n            </Paragraph>\n          </Flex>\n        }\n        id='paragraph'\n        defaultChecked\n      />\n      <RadioButton\n        label={\n          <Flex container={{ direction: 'column', gap: 1 }}>\n            <Text variant='h4'>Space</Text>\n            <StyledImage\n              src='https://thumbor.forbes.com/thumbor/960x0/https%3A%2F%2Fspecials-images.forbesimg.com%2Fdam%2Fimageserve%2F765877054%2F960x0.jpg%3Ffit%3Dscale'\n              alt='space'\n            />\n          </Flex>\n        }\n        id='space-photo'\n      />\n      <RadioButton\n        label={\n          <Flex container={{ gap: 1, alignItems: 'start' }}>\n            <StyledImage\n              src='https://thumbor.forbes.com/thumbor/960x0/https%3A%2F%2Fspecials-images.forbesimg.com%2Fdam%2Fimageserve%2F765877054%2F960x0.jpg%3Ffit%3Dscale'\n              alt='space'\n            />\n            <Flex container={{ direction: 'column', gap: 1 }}>\n              <Text variant='h4'>Space</Text>\n              <Paragraph>\n                Space is the final frontier. There is so much to discover within Cosmos!\n              </Paragraph>\n            </Flex>\n          </Flex>\n        }\n        id='cosmos'\n      />\n      <RadioButton\n        label={\n          <FieldGroup name='Gold service plan' headingTag='h3'>\n            <FieldValueList\n              fields={[\n                { id: 'service', name: 'Service length', value: '1 year' },\n                { id: 'monthly-cost', name: 'Monthly cost', value: '$180.00' },\n                { id: 'total-cost', name: 'Total cost', value: '$2,160.00' }\n              ]}\n            />\n          </FieldGroup>\n        }\n        id='phone-plan'\n      />\n    </RadioButtonGroup>\n  );\n};\n"]}
+{"version":3,"file":"RadioButtonGroup.stories.jsx","sourceRoot":"","sources":["../../../src/core/RadioButtonGroup/RadioButtonGroup.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport {\n  FieldGroup,\n  FieldValueList,\n  Flex,\n  RadioButton,\n  RadioButtonGroup,\n  RadioCheckGroupProps,\n  Text,\n  OmitStrict\n} from '@pega/cosmos-react-core';\n\nimport { Paragraph, StyledImage } from './RadioButtonGroup.styles';\n\nexport default {\n  title: 'Core/RadioButtonGroup',\n  component: RadioButtonGroup,\n  args: {\n    labelHidden: false,\n    inline: false,\n    autoStack: true,\n    required: false,\n    disabled: false,\n    readOnly: false,\n    showAdditionalInfo: true,\n    showNestedAdditionalInfo: false,\n    status: undefined,\n    info: 'You must select it'\n  },\n  argTypes: {\n    labelHidden: { control: { type: 'boolean' } },\n    inline: { control: { type: 'boolean' } },\n    autoStack: { control: { type: 'boolean' } },\n    required: { control: { type: 'boolean' } },\n    disabled: { control: { type: 'boolean' } },\n    readOnly: { control: { type: 'boolean' } },\n    showAdditionalInfo: { control: { type: 'boolean' } },\n    showNestedAdditionalInfo: { control: { type: 'boolean' } },\n    status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n    info: { control: { type: 'text' } }\n  }\n} as Meta;\n\ninterface RadioCheckGroupStoryProps extends RadioCheckGroupProps {\n  showAdditionalInfo?: boolean;\n  showNestedAdditionalInfo?: boolean;\n}\n\nexport const RadioButtonGroupDemo: Story<OmitStrict<RadioCheckGroupStoryProps, 'children'>> = (\n  args: OmitStrict<RadioCheckGroupStoryProps, 'children'>\n) => {\n  return args.showNestedAdditionalInfo ? (\n    <RadioButtonGroup\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      label='What do you want to eat?'\n      name='Fruit'\n      labelHidden={args.labelHidden}\n      inline={args.inline}\n      autoStack={args.autoStack}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n      status={args.status}\n      info={args.info}\n    >\n      <RadioButton\n        label='Banana'\n        id='Banana'\n        defaultChecked\n        additionalInfo={{\n          heading: 'Additional Info',\n          content: 'Some additional info'\n        }}\n      />\n      <RadioButton\n        label='Apple'\n        id='Apple'\n        additionalInfo={{\n          heading: 'Additional Info',\n          content: 'Some additional info'\n        }}\n      />\n      <RadioButton\n        label='Mango'\n        id='Mango'\n        additionalInfo={{\n          heading: 'Additional Info',\n          content: 'Some additional info'\n        }}\n      />\n      <RadioButton\n        label='Orange'\n        id='Orange'\n        additionalInfo={{\n          heading: 'Additional Info',\n          content: 'Some additional info'\n        }}\n      />\n    </RadioButtonGroup>\n  ) : (\n    <RadioButtonGroup\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      label='What do you want to eat?'\n      name='Fruit'\n      labelHidden={args.labelHidden}\n      inline={args.inline}\n      autoStack={args.autoStack}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n      status={args.status}\n      info={args.info}\n    >\n      <RadioButton label='Banana' id='Banana' defaultChecked />\n      <RadioButton label='Apple' id='Apple' />\n      <RadioButton label='Mango' id='Mango' />\n      <RadioButton label='Orange' id='Orange' />\n    </RadioButtonGroup>\n  );\n};\n\nexport const RadioButtonCardGroup: Story<OmitStrict<RadioCheckGroupStoryProps, 'children'>> = (\n  args: OmitStrict<RadioCheckGroupStoryProps, 'children'>\n) => {\n  return (\n    <RadioButtonGroup\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      variant='card'\n      label='Which visuals appear satisfying?'\n      labelHidden={args.labelHidden}\n      inline={args.inline}\n      autoStack={args.autoStack}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n    >\n      <RadioButton\n        additionalInfo={\n          args.showNestedAdditionalInfo\n            ? {\n                heading: 'Additional Info',\n                content: 'Some additional info'\n              }\n            : undefined\n        }\n        label={\n          <Flex container={{ direction: 'column', gap: 1 }}>\n            <Text variant='h4'>A paragraph</Text>\n            <Paragraph>\n              This is a paragraph of text. It is meant to appear visually satisfying amongst the\n              other options in this group.\n            </Paragraph>\n          </Flex>\n        }\n        id='paragraph'\n        defaultChecked\n      />\n      <RadioButton\n        label={\n          <Flex container={{ direction: 'column', gap: 1 }}>\n            <Text variant='h4'>Space</Text>\n            <StyledImage\n              src='https://thumbor.forbes.com/thumbor/960x0/https%3A%2F%2Fspecials-images.forbesimg.com%2Fdam%2Fimageserve%2F765877054%2F960x0.jpg%3Ffit%3Dscale'\n              alt='space'\n            />\n          </Flex>\n        }\n        id='space-photo'\n      />\n      <RadioButton\n        label={\n          <Flex container={{ gap: 1, alignItems: 'start' }}>\n            <StyledImage\n              src='https://thumbor.forbes.com/thumbor/960x0/https%3A%2F%2Fspecials-images.forbesimg.com%2Fdam%2Fimageserve%2F765877054%2F960x0.jpg%3Ffit%3Dscale'\n              alt='space'\n            />\n            <Flex container={{ direction: 'column', gap: 1 }}>\n              <Text variant='h4'>Space</Text>\n              <Paragraph>\n                Space is the final frontier. There is so much to discover within Cosmos!\n              </Paragraph>\n            </Flex>\n          </Flex>\n        }\n        id='cosmos'\n      />\n      <RadioButton\n        label={\n          <FieldGroup name='Gold service plan' headingTag='h3'>\n            <FieldValueList\n              fields={[\n                { id: 'service', name: 'Service length', value: '1 year' },\n                { id: 'monthly-cost', name: 'Monthly cost', value: '$180.00' },\n                { id: 'total-cost', name: 'Total cost', value: '$2,160.00' }\n              ]}\n            />\n          </FieldGroup>\n        }\n        id='phone-plan'\n      />\n    </RadioButtonGroup>\n  );\n};\n"]}

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

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
 import { RatingProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 interface RatingStoryProps extends RatingProps {
     ariaLabel?: string;

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

@@ -1 +1 @@
-{"version":3,"file":"Rating.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Rating/Rating.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAyB,WAAW,EAAE,MAAM,yBAAyB,CAAC;;AAE7E,wBAIU;AAEV,UAAU,gBAAiB,SAAQ,WAAW;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,gBAAgB,CAU9C,CAAC;AAgBF,UAAU,uBAAuB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,uBAAuB,CAqB7D,CAAC"}
+{"version":3,"file":"Rating.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Rating/Rating.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAyB,WAAW,EAAE,MAAM,yBAAyB,CAAC;;AAE7E,wBAIU;AAEV,UAAU,gBAAiB,SAAQ,WAAW;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,gBAAgB,CAS9C,CAAC;AAgBF,UAAU,uBAAuB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,uBAAuB,CAqB7D,CAAC"}

package/jsx/core/Rating/Rating.stories.jsx

@@ -5,7 +5,7 @@ export default {
     excludeStories: ['ConfigurableRating']
 };
 export const RatingDemo = (args) => {
-    return (<Rating {...args} maxRating={args.maxRating} value={args.value} metaInfo={args.metaInfo} aria-label={args.ariaLabel}/>);
+    return (<Rating maxRating={args.maxRating} value={args.value} metaInfo={args.metaInfo} aria-label={args.ariaLabel}/>);
 };
 RatingDemo.args = {
     maxRating: 5,

package/jsx/core/Rating/Rating.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Rating.stories.jsx","sourceRoot":"","sources":["../../../src/core/Rating/Rating.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,EAAe,MAAM,yBAAyB,CAAC;AAE7E,eAAe;IACb,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,MAAM;IACjB,cAAc,EAAE,CAAC,oBAAoB,CAAC;CAC/B,CAAC;AAMV,MAAM,CAAC,MAAM,UAAU,GAA4B,CAAC,IAAsB,EAAE,EAAE;IAC5E,OAAO,CACL,CAAC,MAAM,CACL,IAAI,IAAI,CAAC,CACT,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAC1B,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,UAAU,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,EAC3B,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,UAAU,CAAC,IAAI,GAAG;IAChB,SAAS,EAAE,CAAC;IACZ,KAAK,EAAE,GAAG;IACV,QAAQ,EAAE,YAAY;IACtB,SAAS,EAAE,wCAAwC;CACpD,CAAC;AAEF,UAAU,CAAC,QAAQ,GAAG;IACpB,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAC1C,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IACtC,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACvC,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CACzC,CAAC;AAMF,MAAM,CAAC,MAAM,kBAAkB,GAAmC,CAChE,IAA6B,EAC7B,EAAE;IACF,OAAO,CACL,CAAC,aAAa,CACZ,KAAK,CAAC,CAAC;YACL,UAAU,EAAE;gBACV,MAAM,EAAE;oBACN,KAAK,EAAE,IAAI,CAAC,KAAK;iBAClB;aACF;SACF,CAAC,CAEF;MAAA,CAAC,MAAM,CACL,SAAS,CAAC,CAAC,CAAC,CAAC,CACb,KAAK,CAAC,CAAC,GAAG,CAAC,CACX,QAAQ,CAAC,YAAY,CACrB,UAAU,CAAC,wCAAwC,EAEvD;IAAA,EAAE,aAAa,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAkB,CAAC,IAAI,GAAG;IACxB,KAAK,EAAE,SAAS;CACjB,CAAC;AAEF,kBAAkB,CAAC,QAAQ,GAAG;IAC5B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE;CACtC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Configuration, Rating, RatingProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Rating',\n  component: Rating,\n  excludeStories: ['ConfigurableRating']\n} as Meta;\n\ninterface RatingStoryProps extends RatingProps {\n  ariaLabel?: string;\n}\n\nexport const RatingDemo: Story<RatingStoryProps> = (args: RatingStoryProps) => {\n  return (\n    <Rating\n      {...args}\n      maxRating={args.maxRating}\n      value={args.value}\n      metaInfo={args.metaInfo}\n      aria-label={args.ariaLabel}\n    />\n  );\n};\n\nRatingDemo.args = {\n  maxRating: 5,\n  value: 3.6,\n  metaInfo: '52 reviews',\n  ariaLabel: '3.6 out of 5 stars based on 52 reviews'\n};\n\nRatingDemo.argTypes = {\n  maxRating: { control: { type: 'number' } },\n  value: { control: { type: 'number' } },\n  metaInfo: { control: { type: 'text' } },\n  ariaLabel: { control: { type: 'text' } }\n};\n\ninterface ConfigurableRatingProps {\n  color?: string;\n}\n\nexport const ConfigurableRating: Story<ConfigurableRatingProps> = (\n  args: ConfigurableRatingProps\n) => {\n  return (\n    <Configuration\n      theme={{\n        components: {\n          rating: {\n            color: args.color\n          }\n        }\n      }}\n    >\n      <Rating\n        maxRating={5}\n        value={3.6}\n        metaInfo='52 reviews'\n        aria-label='3.6 out of 5 stars based on 52 reviews'\n      />\n    </Configuration>\n  );\n};\n\nConfigurableRating.args = {\n  color: '#939393'\n};\n\nConfigurableRating.argTypes = {\n  color: { control: { type: 'color' } }\n};\n"]}
+{"version":3,"file":"Rating.stories.jsx","sourceRoot":"","sources":["../../../src/core/Rating/Rating.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,EAAe,MAAM,yBAAyB,CAAC;AAE7E,eAAe;IACb,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,MAAM;IACjB,cAAc,EAAE,CAAC,oBAAoB,CAAC;CAC/B,CAAC;AAMV,MAAM,CAAC,MAAM,UAAU,GAA4B,CAAC,IAAsB,EAAE,EAAE;IAC5E,OAAO,CACL,CAAC,MAAM,CACL,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAC1B,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,UAAU,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,EAC3B,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,UAAU,CAAC,IAAI,GAAG;IAChB,SAAS,EAAE,CAAC;IACZ,KAAK,EAAE,GAAG;IACV,QAAQ,EAAE,YAAY;IACtB,SAAS,EAAE,wCAAwC;CACpD,CAAC;AAEF,UAAU,CAAC,QAAQ,GAAG;IACpB,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAC1C,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IACtC,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACvC,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CACzC,CAAC;AAMF,MAAM,CAAC,MAAM,kBAAkB,GAAmC,CAChE,IAA6B,EAC7B,EAAE;IACF,OAAO,CACL,CAAC,aAAa,CACZ,KAAK,CAAC,CAAC;YACL,UAAU,EAAE;gBACV,MAAM,EAAE;oBACN,KAAK,EAAE,IAAI,CAAC,KAAK;iBAClB;aACF;SACF,CAAC,CAEF;MAAA,CAAC,MAAM,CACL,SAAS,CAAC,CAAC,CAAC,CAAC,CACb,KAAK,CAAC,CAAC,GAAG,CAAC,CACX,QAAQ,CAAC,YAAY,CACrB,UAAU,CAAC,wCAAwC,EAEvD;IAAA,EAAE,aAAa,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAkB,CAAC,IAAI,GAAG;IACxB,KAAK,EAAE,SAAS;CACjB,CAAC;AAEF,kBAAkB,CAAC,QAAQ,GAAG;IAC5B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE;CACtC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Configuration, Rating, RatingProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Rating',\n  component: Rating,\n  excludeStories: ['ConfigurableRating']\n} as Meta;\n\ninterface RatingStoryProps extends RatingProps {\n  ariaLabel?: string;\n}\n\nexport const RatingDemo: Story<RatingStoryProps> = (args: RatingStoryProps) => {\n  return (\n    <Rating\n      maxRating={args.maxRating}\n      value={args.value}\n      metaInfo={args.metaInfo}\n      aria-label={args.ariaLabel}\n    />\n  );\n};\n\nRatingDemo.args = {\n  maxRating: 5,\n  value: 3.6,\n  metaInfo: '52 reviews',\n  ariaLabel: '3.6 out of 5 stars based on 52 reviews'\n};\n\nRatingDemo.argTypes = {\n  maxRating: { control: { type: 'number' } },\n  value: { control: { type: 'number' } },\n  metaInfo: { control: { type: 'text' } },\n  ariaLabel: { control: { type: 'text' } }\n};\n\ninterface ConfigurableRatingProps {\n  color?: string;\n}\n\nexport const ConfigurableRating: Story<ConfigurableRatingProps> = (\n  args: ConfigurableRatingProps\n) => {\n  return (\n    <Configuration\n      theme={{\n        components: {\n          rating: {\n            color: args.color\n          }\n        }\n      }}\n    >\n      <Rating\n        maxRating={5}\n        value={3.6}\n        metaInfo='52 reviews'\n        aria-label='3.6 out of 5 stars based on 52 reviews'\n      />\n    </Configuration>\n  );\n};\n\nConfigurableRating.args = {\n  color: '#939393'\n};\n\nConfigurableRating.argTypes = {\n  color: { control: { type: 'color' } }\n};\n"]}

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

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
 import { SearchInputProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 export declare const SearchInputDemo: Story<SearchInputProps>;
 export declare const EnhancedSearchInputDemo: Story;

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

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
 import { SelectProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 interface SelectStoryProps extends SelectProps {
     showAction: boolean;

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

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
 import { SentimentProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 interface SentimentStoryProps extends SentimentProps {
     positiveLabel: string;

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

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

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

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
 import { SliderProps, OmitStrict } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 type SliderStoryProps = OmitStrict<SliderProps, 'value' | 'onChange'> & {
     min: number;

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

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
 import { SummaryItemProps } from '@pega/cosmos-react-core';
-declare const _default: Meta<import("@storybook/react").Args>;
+declare const _default: Meta;
 export default _default;
 type SummaryItemStoryProps = SummaryItemProps & {
     showSecondary?: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"SummaryList.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/SummaryList/SummaryList.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAuB,MAAM,OAAO,CAAC;AAIjF,OAAkB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,SAAS,CAAC;IACrB,MAAM,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE;QACL,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;KACxB,CAAC;IACF,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,QAAQ,EAAE,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,WAAiB,MAAM,KAAO,QAAQ,mBAAmB,CAMjF,CAAC;AAiCF,eAAO,MAAM,eAAe,OACtB,MAAM,IAAI;;MAEb,CAAC,YAAY,EAAE,EAAE,SAAS,eAAe,YAAY,EAAE,CAAC,CAAC,CAa3D,CAAC"}
+{"version":3,"file":"SummaryList.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/SummaryList/SummaryList.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAuB,MAAM,OAAO,CAAC;AAIjF,OAAkB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,SAAS,CAAC;IACrB,MAAM,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE;QACL,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;KACxB,CAAC;IACF,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,QAAQ,EAAE,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,WAAiB,MAAM,KAAO,QAAQ,mBAAmB,CAMjF,CAAC;AAiCF,eAAO,MAAM,eAAe,OACtB,MAAM,IAAI;;MAEb,CAAC,YAAY,EAAE,EAAE,SAAS,eAAe,YAAY,EAAE,CAAC,CAAC,CAuB3D,CAAC"}